/*
Theme Name: Aguapure Child
Theme URI: https://themes.theme-kalia.com/wp/aguapure/
Template: aguapure
Author: Theme Kalia
Author URI: http://themeforest.net/user/theme-kalia
Description: Bringing in ultimate aesthetic sense, Deeds2 portfolio WordPress theme is something TOTALLY unique and different. It’s a TRULY creative showcase for your creative work. The animations are so genuine and so full of life and artificial intelligence – simply matchless. It’s minimalist and lightning fast. Tick has four homepage layouts, where again each layout takes you to a new horizon of creativity. Everything from featured area and menu to mouse hover, products grid, and social integration appears in a new style. Also, there are seven inner pages and a detail page layout.
Tags: blog,two-columns,left-sidebar,accessibility-ready,custom-background,custom-colors,custom-header,custom-logo,custom-menu,editor-style,featured-images,microformats,post-formats,rtl-language-support,sticky-post,threaded-comments,translation-ready
Version: 1.3.1783850888
Updated: 2026-07-12 10:08:08




/* ---------------------------------------------------
   Fonts (self-hosted, licensed OFL, variable weight)
   Real brand fonts confirmed from the source Figma file's
   own typography.css: Montserrat (display) + Inter (body).
--------------------------------------------------- */
@font-face {
  font-family: 'Montserrat';
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  src: url('assets/fonts/montserrat-var.ttf') format('truetype');
}
@font-face {
  font-family: 'Montserrat';
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
  src: url('assets/fonts/montserrat-italic-var.ttf') format('truetype');
}
@font-face {
  font-family: 'Inter';
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  src: url('assets/fonts/inter-var.ttf') format('truetype');
}

/* ---------------------------------------------------
   Design tokens — corrected against the real values
   extracted directly from the source Figma file
   (tokens/colors.css, tokens/typography.css,
   tokens/spacing.css). Variable names kept identical to
   the earlier approximation so every template using them
   picks up the correction automatically.
--------------------------------------------------- */
:root {
  /* layout — overridable from Theme Settings (wp-admin) */
  --container-width: 1240px;
  --container-width-narrow: 1100px;
  --container-width-content: 800px;

  /* brand */
  --color-brand-primary: #00527F;       /* blue-900, rgb(0,82,127) */
  --color-brand-primary-hover: #00556B; /* blue-800 */
  --color-brand-secondary: #016BA4;     /* blue-700, rgb(1,107,164) */
  --color-action-primary: #006E1D;      /* green-700, rgb(0,110,29) */
  --color-action-primary-hover: #007520;/* green-600 */
  --blue-100: #E0F2FE;                  /* rgb(224,242,254) */
  --blue-700: #016BA4;

  /* semantic */
  --color-success: #006E1D;
  --color-success-bg: rgba(0,110,29,.08);
  --color-error: #BA1A1A;               /* red-600, rgb(186,26,26) */
  --color-error-bg: rgba(186,26,26,.08);
  --color-info-bg: #E0F2FE;

  /* neutrals */
  --color-text-primary: #191C1E;        /* neutral-900 */
  --color-text-body: #404750;           /* neutral-700 */
  --color-text-muted: #707881;          /* neutral-500 */
  --color-text-link: var(--color-brand-secondary);
  --color-border-subtle: #E6E8EA;       /* neutral-200 */
  --color-border-default: #C0C7D1;      /* neutral-300 */
  --color-bg-page: #F7F9FB;             /* neutral-050 */
  --color-bg-muted: #F2F4F6;            /* neutral-100 */
  --white: #FFFFFF;

  /* shape + elevation */
  --radius-sm: 8px;
  --radius-md: 12.8px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --shadow-xs: 0px 1px 2px 0px rgba(0,0,0,.05);
  --shadow-sm: 0px 1px 3px 0px rgba(0,0,0,.1);
  --shadow-md: 0px 4px 16px 0px rgba(0,0,0,.1);
  --shadow-brand-sm: 0px 4px 12px 0px rgba(0,82,127,.08);

  /* type */
  --font-display: 'Montserrat', system-ui, -apple-system, sans-serif;
  --font-body: 'Inter', system-ui, -apple-system, sans-serif;
  --letter-spacing-display: -0.96px;
}

@media (min-width: 1200px) {
    .container {
        max-width: 1440px !important;
    }
}