/* ==========================================================================
   Perfect Enterprises — DESIGN TOKENS
   Every value the components draw from lives here. main.css must not contain
   a raw hex or rgba() literal; if a component needs a new colour, add a token.
   ========================================================================== */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/archivo-600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/archivo-600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/archivo-700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/archivo-700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/inter-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/inter-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/inter-600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/inter-600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* Core greens */
  --pe-green-950: #06211A;   /* deepest — footer bg, overlay scrim */
  --pe-green-900: #0B3026;   /* dark sections, headings on light */
  --pe-green-800: #114536;   /* dark cards, nav dropdown bg */
  --pe-green-700: #16604A;   /* secondary buttons, hovers, eyebrows */
  --pe-green-600: #17804F;   /* PRIMARY brand green — main buttons.
                                Darkened from the specified #1B8A5A, which was
                                4.35:1 on white and failed WCAG AA. See README. */
  --pe-green-500: #29A56B;   /* light accent — never carries text */
  --pe-green-300: #7FCFA6;   /* soft accents, icon fills on dark */
  --pe-green-100: #E4F3EB;   /* tinted section backgrounds */
  --pe-green-50:  #F3F9F5;   /* lightest wash */

  /* Accent — recycled-lime, used sparingly for emphasis */
  --pe-lime-500: #8DC63F;    /* dark backgrounds only */
  --pe-lime-400: #A6D65F;    /* dark backgrounds only */
  --pe-lime-600: #6F9D2F;    /* lime for light backgrounds (stars): clears 3:1 */

  /* Industrial neutrals (machinery steel) */
  --pe-steel-900: #141A18;   /* body text */
  --pe-steel-700: #39443F;
  --pe-steel-500: #606C64;   /* muted text. Darkened from the specified #6B7A73,
                                which was only 4.23:1 on --pe-green-50. */
  --pe-steel-300: #B7C2BC;   /* borders */
  --pe-steel-100: #EBEEEC;   /* dividers, card bg */
  --pe-white: #FFFFFF;

  /* Semantic */
  --pe-bg: var(--pe-white);
  --pe-bg-alt: var(--pe-green-50);
  --pe-bg-dark: var(--pe-green-950);
  --pe-text: var(--pe-steel-900);
  --pe-text-muted: var(--pe-steel-500);
  --pe-text-invert: var(--pe-white);
  --pe-border: var(--pe-steel-300);
  --pe-accent: var(--pe-green-600);
  --pe-error: #C0392B;

  /* WhatsApp brand — the ONE exception to the palette */
  --pe-wa: #25D366;          /* the round FAB keeps the exact brand green */
  --pe-wa-dark: #188842;     /* darkened so white button text clears 4.5:1 */

  /* Elevation */
  --pe-shadow-sm: 0 1px 3px rgba(6,33,26,.08);
  --pe-shadow-md: 0 6px 20px rgba(6,33,26,.10);
  --pe-shadow-lg: 0 18px 48px rgba(6,33,26,.16);

  /* Radii */
  --pe-r-sm: 4px;
  --pe-r-md: 8px;
  --pe-r-lg: 16px;
  --pe-r-pill: 999px;

  /* Layout */
  --pe-container: 1240px;
  --pe-gutter: 20px;
  --pe-section-y: clamp(56px, 8vw, 112px);

  /* Motion */
  --pe-ease: cubic-bezier(.22,.61,.36,1);
  --pe-dur: 420ms;

  /* Typography */
  --pe-font-head: 'Archivo', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --pe-font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --pe-h1: clamp(34px, 5.2vw, 62px);
  --pe-h2: clamp(28px, 3.6vw, 44px);
  --pe-h3: clamp(20px, 2.2vw, 27px);
  --pe-body: 16px;
  --pe-small: 14px;

  /* --------------------------------------------------------------------
     Derived translucent values. Kept here so main.css stays literal-free.
     -------------------------------------------------------------------- */
  --pe-scrim-hero: linear-gradient(100deg,
                     rgba(6,33,26,.90) 0%,
                     rgba(6,33,26,.66) 46%,
                     rgba(6,33,26,.24) 100%);
  --pe-scrim-card: linear-gradient(to top,
                     rgba(6,33,26,.94) 0%,
                     rgba(6,33,26,.72) 38%,
                     rgba(6,33,26,.12) 72%,
                     rgba(6,33,26,0) 100%);
  --pe-scrim-page: linear-gradient(180deg,
                     rgba(6,33,26,.72) 0%,
                     rgba(6,33,26,.86) 100%);
  --pe-scrim-cta: rgba(6,33,26,.80);

  --pe-rule-light: rgba(255,255,255,.14);
  --pe-rule-faint: rgba(255,255,255,.10);
  --pe-on-dark-80: rgba(255,255,255,.80);
  --pe-on-dark-84: rgba(255,255,255,.84);
  --pe-on-dark-88: rgba(255,255,255,.88);
  --pe-on-dark-72: rgba(255,255,255,.72);
  --pe-on-dark-06: rgba(255,255,255,.06);
  --pe-on-dark-12: rgba(255,255,255,.12);

  --pe-wa-ring: rgba(37,211,102,.40);
  --pe-cat-glow: 0 0 0 3px var(--pe-lime-400), 0 12px 32px rgba(23,128,79,.42);
  --pe-focus: 0 0 0 3px var(--pe-lime-400);
  --pe-error-bg: rgba(192,57,43,.08);
  --pe-header-shadow: 0 1px 0 rgba(6,33,26,.06), 0 4px 18px rgba(6,33,26,.07);
}