/* ===== tokens/fonts.css ===== */
/* Elite Windows and Smart Interiors LLP — webfonts.
   Cal Sans (display/headings) + Golos Text (body & UI).

   NOTE: this replaces the Montserrat + Lato pairing named in
   "Elite Branding guidelines.pdf", at the client's request (Sept 2026).
   Cal Sans ships a single weight (600), so the heading ladder is built from
   size and case rather than weight — see readme.md → VISUAL FOUNDATIONS.

   Served from jsDelivr (Fontsource). For the production site, download these
   woff2 files into assets/fonts/ and repoint the src urls — that removes the
   third-party connection and is required for the 90+ PageSpeed target. */

/* Cal Sans — display. Single weight. */
@font-face {
  font-family: "Cal Sans";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/npm/@fontsource/cal-sans@5.2.5/files/cal-sans-latin-600-normal.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: "Cal Sans";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/npm/@fontsource/cal-sans@5.2.5/files/cal-sans-latin-ext-600-normal.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;
}

/* Golos Text — body and UI. 400 / 500 / 600 / 700 / 800. */
@font-face {
  font-family: "Golos Text";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/npm/@fontsource/golos-text@5.2.5/files/golos-text-latin-400-normal.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: "Golos Text";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/npm/@fontsource/golos-text@5.2.5/files/golos-text-latin-500-normal.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: "Golos Text";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/npm/@fontsource/golos-text@5.2.5/files/golos-text-latin-600-normal.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: "Golos Text";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/npm/@fontsource/golos-text@5.2.5/files/golos-text-latin-700-normal.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: "Golos Text";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/npm/@fontsource/golos-text@5.2.5/files/golos-text-latin-800-normal.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: "Golos Text";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/npm/@fontsource/golos-text@5.2.5/files/golos-text-cyrillic-400-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Golos Text";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("https://cdn.jsdelivr.net/npm/@fontsource/golos-text@5.2.5/files/golos-text-cyrillic-700-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* ===== tokens/colors.css ===== */
/* Elite Windows and Smart Interiors LLP — colour system.
   Source: "Elite Branding guidelines.pdf" + exact pixel values sampled from
   the master logo (assets/logo/elite-logo-full-color.png). */
:root {
  /* ---- Brand core ---------------------------------------------------- */
  /* Primary Blue — trust, professional, stability. The dominant UI colour:
     hero panels, footers, headings, primary buttons. */
  --elite-navy-900: #0b1c4d;
  --elite-navy-800: #0e2461;
  --elite-navy: #132e79;
  --elite-navy-600: #1b3d94;

  /* Logo gradient blue (#0e64c8 in the guidelines) — links, active states,
     the bright end of every brand gradient. */
  --elite-blue: #0e64c8;
  --elite-blue-700: #0b52a6;
  --elite-blue-300: #7fb2e8;

  /* Light Blue — clarity, calmness, cleanliness. Glass, tints, highlights. */
  --elite-sky: #7ec8f8;
  --elite-sky-200: #bde3fc;
  --elite-sky-100: #e4f2fd;

  /* Accent Green — growth, freshness, modernity. Secondary CTA, "sustainable",
     the LLP rule in the logo. Exact logo green. */
  --elite-green: #5baf3f;
  --elite-green-700: #479133;
  --elite-green-600: #4faa38;
  --elite-green-200: #c3e6b4;
  --elite-green-100: #edf7e8;

  /* ---- Neutrals ------------------------------------------------------ */
  --elite-ink: #333333;      /* Dark Gray — balance, readability, elegance */
  --elite-ink-700: #4d4f52;
  --elite-ink-500: #6b6e73;
  --elite-ink-400: #8a8e94;
  --elite-line: #dfe5ee;
  --elite-line-soft: #eaeff6;
  --elite-mist: #f5f7fa;     /* Light Gray — simplicity, space, modern look */
  --elite-white: #ffffff;

  /* ---- Semantic aliases --------------------------------------------- */
  --text-heading: var(--elite-navy);
  --text-body: var(--elite-ink);
  --text-muted: var(--elite-ink-500);
  --text-on-dark: #ffffff;
  --text-on-dark-muted: rgba(255, 255, 255, 0.76);
  --text-link: var(--elite-blue);
  --text-link-hover: var(--elite-navy);

  --surface-page: var(--elite-white);
  --surface-card: var(--elite-white);
  --surface-subtle: var(--elite-mist);
  --surface-tint-blue: var(--elite-sky-100);
  --surface-tint-green: var(--elite-green-100);
  --surface-dark: var(--elite-navy);
  --surface-dark-deep: var(--elite-navy-900);

  --border-default: var(--elite-line);
  --border-soft: var(--elite-line-soft);
  --border-strong: var(--elite-navy);
  --border-on-dark: rgba(255, 255, 255, 0.22);

  --action-primary: var(--elite-navy);
  --action-primary-hover: var(--elite-navy-600);
  --action-primary-press: var(--elite-navy-900);
  --action-secondary: var(--elite-green);
  --action-secondary-hover: var(--elite-green-700);
  --action-accent: var(--elite-blue);
  --focus-ring: var(--elite-blue);

  /* ---- Status -------------------------------------------------------- */
  --status-success: var(--elite-green);
  --status-info: var(--elite-blue);
  --status-warning: #d98014;
  --status-error: #c62828;

  /* ---- Brand gradients ----------------------------------------------- */
  /* The logo's own blue→green sweep. Use for the 4px accent bar, the "LLP"
     rule and the footer band. Never as a large background wash. */
  --gradient-brand: linear-gradient(90deg, var(--elite-navy) 0%, var(--elite-blue) 45%, var(--elite-sky) 65%, var(--elite-green) 100%); /* @kind color */
  --gradient-brand-v: linear-gradient(180deg, var(--elite-blue) 0%, var(--elite-green) 100%); /* @kind color */
  /* Hero photo overlay — keeps white type legible over interior photography. */
  --gradient-hero: linear-gradient(100deg, rgba(11, 28, 77, 0.94) 0%, rgba(19, 46, 121, 0.86) 42%, rgba(19, 46, 121, 0.22) 100%); /* @kind color */
  /* Protection scrim for text sitting on the bottom of an image card. */
  --gradient-scrim: linear-gradient(180deg, rgba(11, 28, 77, 0) 0%, rgba(11, 28, 77, 0.82) 100%); /* @kind color */
  /* Glass tint used on the mark's panes; good for stat tiles on dark. */
  --gradient-glass: linear-gradient(160deg, rgba(255, 255, 255, 0.16) 0%, rgba(126, 200, 248, 0.1) 100%); /* @kind color */
}

/* ===== tokens/typography.css ===== */
/* Elite — typography. Montserrat for headings/titles, Lato for body text. */
:root {
  /* Cal Sans — headings, display, stat numbers. Single weight (600), so the
     heading ladder is built from size and case, not weight. */
  --font-display: "Cal Sans", "Segoe UI", system-ui, sans-serif;
  /* Golos Text — running text. */
  --font-body: "Golos Text", "Segoe UI", system-ui, sans-serif;
  /* Small UI type (buttons, eyebrows, nav, labels, table headers). Golos Text
     is used here rather than Cal Sans: at 12–15px, tracked and uppercase,
     Cal Sans's single 600 weight reads soft, while Golos 700 stays crisp. */
  --font-ui: "Golos Text", "Segoe UI", system-ui, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* Weights actually used by the brand.
     Cal Sans ships 600 only — every --font-display weight token is 600. */
  --fw-body: 400; /* @kind font */
  --fw-body-bold: 700; /* @kind font */
  --fw-heading: 600; /* @kind font */
  --fw-heading-strong: 600; /* @kind font */
  --fw-display: 600; /* @kind font */
  /* Weights for --font-ui type */
  --fw-ui: 600; /* @kind font */
  --fw-ui-strong: 700; /* @kind font */

  /* Type scale — 1.25 major-third-ish ramp, clamped for fluid marketing pages */
  --fs-display-1: clamp(2.75rem, 5.2vw, 4.25rem);   /* @kind font */ /* hero headline */
  --fs-display-2: clamp(2.25rem, 4vw, 3.25rem);     /* @kind font */ /* section opener */
  --fs-h1: clamp(2rem, 3.2vw, 2.75rem); /* @kind font */
  --fs-h2: clamp(1.625rem, 2.4vw, 2.125rem); /* @kind font */
  --fs-h3: 1.375rem; /* @kind font */
  --fs-h4: 1.125rem; /* @kind font */
  --fs-body-lg: 1.125rem; /* @kind font */
  --fs-body: 1rem; /* @kind font */
  --fs-body-sm: 0.9375rem; /* @kind font */
  --fs-caption: 0.8125rem; /* @kind font */
  --fs-eyebrow: 0.75rem; /* @kind font */

  --lh-tight: 1.1; /* @kind font */
  --lh-heading: 1.22; /* @kind font */
  --lh-snug: 1.45; /* @kind font */
  --lh-body: 1.7; /* @kind font */

  /* Cal Sans is already tightly fitted, so tracking is gentler than the
     Montserrat setup it replaces. */
  --ls-display: -0.012em; /* @kind font */
  --ls-heading: -0.006em; /* @kind font */
  --ls-body: 0; /* @kind font */
  --ls-eyebrow: 0.16em;   /* @kind font */ /* "BRAND GUIDELINES" / "WHO WE ARE" letterspacing */
  --ls-button: 0.02em; /* @kind font */

  /* Semantic aliases */
  --text-eyebrow-transform: uppercase; /* @kind other */
  --measure-prose: 68ch; /* @kind other */
  --measure-narrow: 46ch; /* @kind other */
}

/* ===== tokens/spacing.css ===== */
/* Elite — spacing & layout. 4px base grid. */
:root {
  --space-0: 0;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --space-32: 128px;

  /* Rhythm aliases */
  --gap-inline: var(--space-3); /* @kind spacing */ /* icon → label */
  --gap-stack: var(--space-4); /* @kind spacing */ /* paragraph rhythm */
  --gap-card: var(--space-6); /* @kind spacing */ /* grid gutters */
  --pad-card: var(--space-6); /* @kind spacing */
  --pad-card-lg: var(--space-8); /* @kind spacing */
  --section-y: clamp(56px, 7vw, 96px); /* @kind spacing */
  --section-y-tight: clamp(40px, 5vw, 64px); /* @kind spacing */

  /* Container */
  --container-max: 1200px; /* @kind spacing */
  --container-wide: 1400px; /* @kind spacing */
  --container-pad: clamp(16px, 4vw, 40px); /* @kind spacing */

  /* Radii — the brand is squarish. Buttons/cards 6–8px, pills only for chips. */
  --radius-xs: 3px;
  --radius-sm: 4px;
  --radius: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-pill: 999px;
  --radius-circle: 50%;

  /* Hit targets */
  --control-h-sm: 36px; /* @kind spacing */
  --control-h: 44px; /* @kind spacing */
  --control-h-lg: 52px; /* @kind spacing */
  --icon-sm: 18px; /* @kind spacing */
  --icon: 22px; /* @kind spacing */
  --icon-lg: 28px; /* @kind spacing */
  --icon-tile: 56px; /* @kind spacing */

  /* Signature 4px gradient accent bar under eyebrows and section titles */
  --accent-bar-w: 56px; /* @kind spacing */
  --accent-bar-h: 4px; /* @kind spacing */
}

/* ===== tokens/elevation.css ===== */
/* Elite — elevation, borders, blur. Shadows are soft, cool and navy-tinted;
   never neutral black, never more than one level of lift on a card. */
:root {
  --shadow-none: none;
  --shadow-xs: 0 1px 2px rgba(11, 28, 77, 0.06);
  --shadow-sm: 0 2px 8px rgba(11, 28, 77, 0.07);
  --shadow-card: 0 6px 20px rgba(11, 28, 77, 0.08);
  --shadow-card-hover: 0 14px 34px rgba(11, 28, 77, 0.14);
  --shadow-lifted: 0 20px 48px rgba(11, 28, 77, 0.18);
  --shadow-header: 0 2px 14px rgba(11, 28, 77, 0.1);
  --shadow-button: 0 4px 12px rgba(19, 46, 121, 0.24);
  --shadow-button-green: 0 4px 12px rgba(91, 175, 63, 0.28);
  --shadow-inset-line: inset 0 -1px 0 var(--elite-line-soft); /* @kind shadow */

  --border-w: 1px; /* @kind spacing */
  --border-w-strong: 2px; /* @kind spacing */

  --ring-focus: 0 0 0 3px rgba(14, 100, 200, 0.34); /* @kind shadow */
  --ring-focus-green: 0 0 0 3px rgba(91, 175, 63, 0.32); /* @kind shadow */

  --blur-glass: blur(14px); /* @kind other */
  --glass-fill: rgba(255, 255, 255, 0.1); /* @kind other */
  --glass-fill-light: rgba(255, 255, 255, 0.72); /* @kind other */
}

/* ===== tokens/motion.css ===== */
/* Elite — motion. Calm, short, no bounce. Photography scales gently; UI moves
   2–4px. Everything respects prefers-reduced-motion. */
:root {
  --dur-instant: 80ms; /* @kind other */
  --dur-fast: 160ms; /* @kind other */
  --dur: 240ms; /* @kind other */
  --dur-slow: 400ms; /* @kind other */
  --dur-reveal: 620ms; /* @kind other */

  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
  --ease-out: cubic-bezier(0.16, 0.84, 0.44, 1); /* @kind other */
  --ease-in: cubic-bezier(0.5, 0, 1, 1); /* @kind other */

  --lift-hover: -3px;      /* @kind other */ /* translateY on card hover */
  --press-scale: 0.985;    /* @kind other */ /* buttons compress, never shrink hard */
  --zoom-image-hover: 1.05; /* @kind other */

  --transition-control: background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard), color var(--dur-fast) var(--ease-standard), box-shadow var(--dur-fast) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); /* @kind other */
  --transition-card: transform var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out); /* @kind other */
}
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 0ms; /* @kind other */
    --dur: 0ms; /* @kind other */
    --dur-slow: 0ms; /* @kind other */
    --dur-reveal: 0ms; /* @kind other */
    --lift-hover: 0px; /* @kind other */
    --press-scale: 1; /* @kind other */
    --zoom-image-hover: 1; /* @kind other */
  }
}

/* ===== tokens/base.css ===== */
/* Elite — base element defaults. Deliberately small: this sets type, links and
   a handful of layout primitives the whole brand relies on. */
*, *::before, *::after { box-sizing: border-box }
html { -webkit-text-size-adjust: 100% }
body {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--text-body);
  background: var(--surface-page);
  -webkit-font-smoothing: antialiased;
  text-wrap: pretty;
}
h1, h2, h3, h4, h5, h6 {
  margin: 0 0 var(--space-4);
  font-family: var(--font-display);
  font-weight: var(--fw-heading);
  line-height: var(--lh-heading);
  letter-spacing: var(--ls-heading);
  color: var(--text-heading);
  text-wrap: balance;
}
h1 { font-size: var(--fs-h1) }
h2 { font-size: var(--fs-h2) }
h3 { font-size: var(--fs-h3) }
h4 { font-size: var(--fs-h4) }
p { margin: 0 0 var(--gap-stack); max-width: var(--measure-prose) }
a { color: var(--text-link); text-decoration: none; transition: color var(--dur-fast) var(--ease-standard) }
a:hover { color: var(--text-link-hover); text-decoration: underline; text-underline-offset: 3px }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid var(--focus-ring); outline-offset: 2px; border-radius: var(--radius-xs);
}
strong, b { font-weight: var(--fw-body-bold) }
img, picture, svg, video { max-width: 100%; height: auto; display: block }
ul, ol { margin: 0 0 var(--gap-stack); padding-left: 1.25em }
li { margin-bottom: var(--space-2) }
hr { border: 0; height: 1px; background: var(--border-default); margin: var(--space-8) 0 }
figure { margin: 0 }
table { border-collapse: collapse; width: 100% }
th, td { text-align: left; padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--border-soft) }
th { font-family: var(--font-ui); font-weight: var(--fw-ui-strong); color: var(--text-heading) }

/* ---- Brand layout primitives ----------------------------------------- */
.elite-container { width: 100%; max-width: var(--container-max); margin-inline: auto; padding-inline: var(--container-pad) }
.elite-section { padding-block: var(--section-y) }
.elite-section--subtle { background: var(--surface-subtle) }
.elite-section--dark { background: var(--surface-dark); color: var(--text-on-dark) }
.elite-section--dark h1, .elite-section--dark h2, .elite-section--dark h3 { color: var(--text-on-dark) }

/* Eyebrow + gradient accent bar: the brand's standard section opener. */
.elite-eyebrow {
  display: block; font-family: var(--font-ui); font-size: var(--fs-eyebrow);
  font-weight: var(--fw-heading); letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase; color: var(--elite-green); margin-bottom: var(--space-3);
}
.elite-accent-bar { width: var(--accent-bar-w); height: var(--accent-bar-h); background: var(--gradient-brand); border-radius: var(--radius-pill) }

/* Full-bleed gradient hairline used under the header and above the footer. */
.elite-brand-rule { height: var(--accent-bar-h); background: var(--gradient-brand) }

.elite-prose-narrow { max-width: var(--measure-narrow) }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0 }

/* ===== Elite Windows — component styles for the static build =====
   Paired with the design-system token layer, which is concatenated
   above this block in assets/css/site.css. */

/* ---------- resets the DC runtime used to provide ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#fff;color:var(--text-body);font-family:var(--font-body)}
img{max-width:100%}
a{color:var(--elite-blue);text-decoration:none}
a:hover{color:var(--elite-navy)}
.eic{display:inline-flex;flex:none;vertical-align:middle}

.eskip{position:absolute;left:-9999px;top:0;background:var(--elite-navy);color:#fff;padding:10px 16px;z-index:99}
.eskip:focus{left:8px;top:8px}

/* ---------- Button ---------- */
.ebtn{display:inline-flex;width:auto;align-items:center;justify-content:center;gap:var(--space-2);
  font-family:var(--font-ui);font-weight:var(--fw-ui-strong);letter-spacing:var(--ls-button);line-height:1;
  border-radius:var(--radius);cursor:pointer;text-decoration:none;white-space:nowrap;transition:var(--transition-control)}
.ebtn-full{display:flex;width:100%}
.ebtn-sm{height:var(--control-h-sm);padding:0 16px;font-size:var(--fs-body-sm)}
.ebtn-md{height:var(--control-h);padding:0 22px;font-size:var(--fs-body-sm)}
.ebtn-lg{height:var(--control-h-lg);padding:0 30px;font-size:var(--fs-body)}
.ebtn-primary{background:var(--action-primary);color:#fff;border:1px solid var(--action-primary);box-shadow:var(--shadow-button)}
.ebtn-primary:hover{background:var(--action-primary-hover);border-color:var(--action-primary-hover);color:#fff}
.ebtn-secondary{background:var(--action-secondary);color:#fff;border:1px solid var(--action-secondary);box-shadow:var(--shadow-button-green)}
.ebtn-secondary:hover{background:var(--action-secondary-hover);border-color:var(--action-secondary-hover);color:#fff}
.ebtn-outline{background:transparent;color:var(--elite-navy);border:1px solid var(--elite-blue)}
.ebtn-outline:hover{background:var(--elite-navy);color:#fff;border-color:var(--elite-navy)}
.ebtn-ghost{background:transparent;color:var(--elite-navy);border:1px solid transparent}
.ebtn-ghost:hover{background:var(--surface-tint-blue);color:var(--elite-navy)}
.ebtn-white{background:#fff;color:var(--elite-navy);border:1px solid #fff;box-shadow:var(--shadow-sm)}
.ebtn-white:hover{background:var(--elite-sky-100);border-color:var(--elite-sky-100);color:var(--elite-navy)}
.ebtn:active{transform:scale(var(--press-scale))}
.ebtn-arrow{flex:none;transition:transform var(--dur-fast) var(--ease-standard)}
.ebtn:hover .ebtn-arrow{transform:translateX(2px)}

/* ---------- SectionHeading ---------- */
.eheading{display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:var(--space-3)}
.eheading-center{align-items:center;text-align:center;max-width:760px;margin-inline:auto}
.eheading-eyebrow{font-family:var(--font-ui);font-size:var(--fs-eyebrow);font-weight:var(--fw-ui-strong);
  letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--elite-green)}
.eheading-dark .eheading-eyebrow{color:var(--elite-sky)}
.eaccent-bar{display:block;width:var(--accent-bar-w);height:var(--accent-bar-h);border-radius:var(--radius-pill);background:var(--gradient-brand)}
.eheading-title{margin:0;font-family:var(--font-display);font-weight:var(--fw-heading-strong);
  line-height:var(--lh-heading);letter-spacing:var(--ls-heading);color:var(--text-heading);text-wrap:balance}
.eheading-dark .eheading-title{color:#fff}
.eheading-lead{margin:0;max-width:62ch;font-size:var(--fs-body-lg);line-height:var(--lh-body);color:var(--text-muted)}
.eheading-dark .eheading-lead{color:var(--text-on-dark-muted)}
/* the brand writes uPVC with a lowercase u even inside caps labels */
[data-elite="nocaps"] .eheading-eyebrow,[data-elite="nocaps"] .efcard-title{text-transform:none}

/* ---------- ProductCard ---------- */
.epcard{display:flex;flex-direction:column;height:100%;background:var(--surface-card);
  border:1px solid var(--border-soft);border-radius:var(--radius-md);overflow:hidden;text-decoration:none;
  box-shadow:var(--shadow-card);transition:var(--transition-card)}
.epcard:hover{box-shadow:var(--shadow-card-hover);transform:translateY(var(--lift-hover))}
.epcard-media{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;background:var(--surface-subtle)}
.epcard-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform var(--dur-slow) var(--ease-out)}
.epcard:hover .epcard-media img{transform:scale(var(--zoom-image-hover))}
.epcard-badge{position:absolute;top:var(--space-3);left:var(--space-3);padding:5px 10px;border-radius:var(--radius-sm);
  background:var(--elite-navy);color:#fff;font-family:var(--font-ui);font-size:var(--fs-eyebrow);
  font-weight:var(--fw-ui-strong);letter-spacing:.08em;text-transform:uppercase}
.epcard-body{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--pad-card);flex:1}
.epcard-title{margin:0;font-family:var(--font-display);font-size:var(--fs-h4);font-weight:var(--fw-heading-strong);
  color:var(--text-heading);line-height:1.3}
.epcard-text{font-size:var(--fs-body-sm);line-height:var(--lh-body);color:var(--text-muted)}
.epcard-cta{margin-top:auto;padding-top:var(--space-3);display:inline-flex;align-items:center;gap:var(--space-2);
  font-family:var(--font-ui);font-size:var(--fs-caption);font-weight:var(--fw-ui-strong);letter-spacing:.08em;
  text-transform:uppercase;color:var(--elite-blue);transition:color var(--dur-fast) var(--ease-standard)}
.epcard:hover .epcard-cta{color:var(--elite-green)}
.ecard-arrow{transition:transform var(--dur-fast) var(--ease-standard)}
.epcard:hover .ecard-arrow{transform:translateX(3px)}

/* ---------- FeatureCard ---------- */
.efcard{display:flex;flex-direction:column;gap:var(--space-4);padding:var(--pad-card);background:var(--surface-card);
  border:1px solid var(--border-soft);border-radius:var(--radius-md);box-shadow:var(--shadow-card);
  transition:var(--transition-card);text-decoration:none;height:100%}
.efcard:hover{box-shadow:var(--shadow-card-hover);transform:translateY(var(--lift-hover))}
.efcard-dark{background:rgba(255,255,255,.06);border-color:var(--border-on-dark);box-shadow:none}
.efcard-icon{display:inline-flex;align-items:center;justify-content:center;width:var(--icon-tile);height:var(--icon-tile);
  border-radius:var(--radius-md);background:var(--surface-tint-blue)}
.efcard-dark .efcard-icon{background:rgba(255,255,255,.1);filter:invert(1) brightness(2)}
.efcard-icon img{width:30px;height:30px;object-fit:contain;display:block}
.efcard-title{margin:0;font-family:var(--font-display);font-size:var(--fs-h4);font-weight:var(--fw-heading-strong);
  letter-spacing:.01em;text-transform:uppercase;line-height:1.3;color:var(--text-heading)}
.efcard-dark .efcard-title{color:#fff}
.efcard-text{margin:0;font-size:var(--fs-body-sm);line-height:var(--lh-body);color:var(--text-muted)}
.efcard-dark .efcard-text{color:var(--text-on-dark-muted)}

/* ---------- ProcessStep ---------- */
.estep{position:relative;display:flex;flex-direction:column;gap:var(--space-3);padding-right:var(--space-4)}
.estep-last{padding-right:0}
.estep-head{display:flex;align-items:center;gap:var(--space-3)}
.estep-tile{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;
  border-radius:var(--radius-md);background:var(--surface-tint-blue);color:var(--elite-navy)}
.estep-dark .estep-tile{background:rgba(255,255,255,.1);color:#fff}
.estep-num{font-family:var(--font-display);font-size:2rem;font-weight:var(--fw-display);line-height:1;color:var(--elite-line)}
.estep-dark .estep-num{color:rgba(255,255,255,.22)}
.estep-title{margin:0;font-family:var(--font-display);font-size:var(--fs-h4);font-weight:var(--fw-heading-strong);
  color:var(--text-heading);line-height:1.3}
.estep-dark .estep-title{color:#fff}
.estep-text{margin:0;font-size:var(--fs-body-sm);line-height:var(--lh-body);color:var(--text-muted);max-width:34ch}
.estep-dark .estep-text{color:var(--text-on-dark-muted)}

/* ---------- IconTile ---------- */
.etile{display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-md);flex:none}
.etile-blue{background:var(--surface-tint-blue);color:var(--elite-navy)}
.etile-green{background:var(--surface-tint-green);color:var(--elite-green-700)}
.etile-navy{background:var(--elite-navy);color:#fff}
.etile-outline{background:#fff;color:var(--elite-navy);box-shadow:inset 0 0 0 1px var(--border-default)}

/* ---------- TestimonialCard ---------- */
.etest{display:flex;flex-direction:column;gap:var(--space-4);margin:0;padding:var(--pad-card-lg);
  background:var(--surface-card);border:1px solid var(--border-soft);border-radius:var(--radius-md);
  box-shadow:var(--shadow-card);height:100%}
.etest-stars{display:inline-flex;gap:2px;color:#f5a524}
.etest-quote{margin:0;font-size:var(--fs-body);line-height:var(--lh-body);color:var(--text-body);flex:1}
.etest-foot{display:flex;align-items:center;gap:var(--space-3)}
.etest-foot img{width:46px;height:46px;border-radius:var(--radius-circle);object-fit:cover;flex:none}
.etest-foot>span{display:flex;flex-direction:column}
.etest-name{font-family:var(--font-ui);font-size:var(--fs-body-sm);font-weight:var(--fw-ui-strong);color:var(--text-heading)}
.etest-loc{font-size:var(--fs-caption);color:var(--text-muted)}

/* ---------- FAQ accordion (details/summary: answers always in the HTML) ---------- */
.efaq{display:flex;flex-direction:column;gap:var(--space-3)}
.efaq-item{border:1px solid var(--border-soft);border-radius:var(--radius-md);background:var(--surface-card);
  transition:background var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard)}
.efaq-item[open]{border-color:var(--elite-sky-200);background:var(--surface-tint-blue)}
.efaq-q{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);
  padding:var(--space-5) var(--space-6);cursor:pointer;list-style:none;
  font-family:var(--font-display);font-size:var(--fs-h4);font-weight:var(--fw-heading);
  color:var(--text-heading);line-height:1.35}
.efaq-q::-webkit-details-marker{display:none}
.efaq-plus{flex:none;color:var(--elite-green);transition:transform var(--dur) var(--ease-out)}
.efaq-item[open] .efaq-plus{transform:rotate(45deg)}
.efaq-a{padding:0 var(--space-6) var(--space-6)}
.efaq-a p{margin:0;color:var(--text-body);line-height:var(--lh-body)}

/* ---------- CtaBanner ---------- */
.ecta{position:relative;overflow:hidden;background:var(--surface-dark)}
.ecta-bar{display:block;height:var(--accent-bar-h);background:var(--gradient-brand)}
.ecta-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.22}
.ecta-inner{position:relative;width:100%;max-width:var(--container-max);margin:0 auto;
  padding:var(--section-y-tight) var(--container-pad);display:flex;flex-wrap:wrap;align-items:center;
  justify-content:space-between;gap:var(--space-8)}
.ecta-copy{display:flex;flex-direction:column;gap:var(--space-3);max-width:60ch}
.ecta-eyebrow{font-family:var(--font-ui);font-size:var(--fs-eyebrow);font-weight:var(--fw-ui-strong);
  letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--elite-sky)}
.ecta-title{margin:0;font-family:var(--font-display);font-size:var(--fs-h1);font-weight:var(--fw-heading-strong);
  line-height:var(--lh-heading);color:#fff}
.ecta-text{margin:0;color:#fff;font-size:var(--fs-body-lg)}
.ecta-actions{display:flex;flex-wrap:wrap;gap:var(--space-3)}

/* ---------- forms ---------- */
.efield{display:flex;flex-direction:column;gap:var(--space-2)}
.efield-label{font-family:var(--font-ui);font-size:var(--fs-caption);font-weight:var(--fw-ui-strong);
  letter-spacing:.04em;text-transform:uppercase;color:var(--text-heading)}
.efield-req{color:var(--elite-green)}
.efield-hint{font-size:var(--fs-caption);color:var(--text-muted)}
.econtrol{width:100%;min-height:var(--control-h);padding:0 var(--space-4);font-family:var(--font-body);
  font-size:var(--fs-body-sm);color:var(--text-body);background:var(--surface-card);
  border:1px solid var(--border-default);border-radius:var(--radius);outline:none;transition:var(--transition-control)}
.econtrol:focus{border-color:var(--elite-blue);box-shadow:var(--ring-focus)}
.econtrol-area{padding:var(--space-3) var(--space-4);min-height:0;line-height:var(--lh-snug);resize:vertical}
.eselect{position:relative;display:block}
.eselect select{appearance:none;-webkit-appearance:none;padding-right:var(--space-10);cursor:pointer}
.eselect .eic{position:absolute;right:var(--space-4);top:50%;transform:translateY(-50%);pointer-events:none;color:var(--elite-navy)}
.eform-status{margin:0;font-size:var(--fs-body-sm);color:var(--elite-green-700)}

/* ---------- header ---------- */
.ehead{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);
  box-shadow:0 1px 0 var(--border-soft),0 6px 20px rgba(11,28,77,.06)}
.eutil{background:var(--elite-navy-900);color:var(--text-on-dark-muted);font-size:var(--fs-caption)}
.eutil-inner{max-width:var(--container-max);margin:0 auto;padding:9px var(--container-pad);
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-4)}
.eutil a{color:#fff}
.ehairline{display:block;height:4px;background:var(--gradient-brand)}
.enav-row{max-width:var(--container-max);margin:0 auto;padding:var(--space-3) var(--container-pad);
  display:flex;align-items:center;justify-content:space-between;gap:var(--space-6)}
.elogo img{height:74px;width:auto;display:block}
.enav{display:flex;align-items:center;gap:22px}
.enav>a,.enav-trigger>a{font-family:var(--font-ui);font-size:14px;font-weight:var(--fw-ui-strong);
  color:var(--elite-navy);text-decoration:none;padding-bottom:3px;border-bottom:2px solid transparent}
.enav>a:hover,.enav-trigger>a:hover{color:var(--elite-blue)}
.enav a[aria-current="page"]{color:var(--elite-blue);border-bottom-color:var(--elite-green)}
.enav-trigger{position:static}
.enav-trigger>a{display:flex;align-items:center;gap:4px}
.emega{position:absolute;top:100%;left:0;right:0;display:none;background:#fff;
  border-top:1px solid var(--border-soft);box-shadow:0 26px 54px rgba(11,28,77,.18);z-index:70}
.emega.is-open{display:block}
.emega-inner{display:grid;max-width:var(--container-max);margin:0 auto;
  padding:var(--space-8) var(--container-pad);grid-template-columns:minmax(0,1fr) 260px;gap:var(--space-10)}
.emega-label{display:block;font-family:var(--font-ui);font-size:11px;font-weight:700;
  letter-spacing:.16em;color:var(--elite-green);margin-bottom:var(--space-5)}
.emega-grid{display:grid;gap:var(--space-4)}
.emega-grid-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.emega-grid-4{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-5)}
.emega-tile{display:block;text-decoration:none;border-radius:6px}
.emega-tile img{width:100%;height:88px;object-fit:cover;border-radius:6px;display:block;border:1px solid var(--border-soft)}
.emega-grid-4 .emega-tile img{height:120px}
.emega-tile span{display:block;margin-top:8px;font-family:var(--font-ui);font-size:13px;
  font-weight:var(--fw-ui-strong);color:var(--elite-navy)}
.emega-tile small{display:block;margin-top:3px;font-size:12px;color:var(--text-muted)}
.emega-foot{display:flex;flex-wrap:wrap;gap:var(--space-6);margin-top:var(--space-8);
  padding-top:var(--space-6);border-top:1px solid var(--border-soft)}
.emega-foot a{display:flex;align-items:center;gap:12px;text-decoration:none}
.emega-foot img{width:56px;height:56px;object-fit:cover;border-radius:6px;display:block}
.emega-foot strong{display:block;font-family:var(--font-ui);font-size:14px;font-weight:var(--fw-ui-strong);color:var(--elite-navy)}
.emega-foot small{display:block;font-size:12px;color:var(--text-muted)}
.emega-promo{display:block;background:var(--elite-navy);border-radius:8px;padding:var(--space-6);align-self:start}
.emega-promo span{display:block;font-family:var(--font-ui);font-size:11px;font-weight:700;letter-spacing:.16em;color:var(--elite-sky);margin-bottom:10px}
.emega-promo strong{display:block;font-family:var(--font-display);font-size:20px;line-height:1.25;color:#fff;margin-bottom:10px}
.emega-promo p{margin:0 0 var(--space-5);font-size:13px;line-height:1.6;color:#fff}
.emega-aside img{width:100%;height:180px;object-fit:cover;border-radius:8px;display:block;margin-bottom:var(--space-4)}
.emega-aside p{margin:0 0 var(--space-4);font-size:13px;line-height:1.6;color:var(--elite-ink)}
.eburger{display:none;align-items:center;justify-content:center;width:46px;height:46px;
  border:1px solid var(--border-default);border-radius:6px;background:#fff;cursor:pointer;flex:none}
.emobile{display:none;border-top:1px solid var(--border-soft);background:#fff;max-height:70vh;overflow:auto}
.emobile.is-open{display:block}
.emobile-inner{max-width:var(--container-max);margin:0 auto;padding:var(--space-4) var(--container-pad);
  display:flex;flex-direction:column;gap:2px}
.emobile-inner a{padding:12px 4px;font-family:var(--font-ui);font-weight:var(--fw-ui-strong);font-size:15px;
  color:var(--elite-navy);text-decoration:none;border-bottom:1px solid var(--border-soft)}

/* ---------- footer ---------- */
.efoot{background:var(--surface-dark-deep);color:var(--text-on-dark-muted)}
.efoot-grid{max-width:var(--container-max);margin:0 auto;padding:var(--section-y-tight) var(--container-pad);
  display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:var(--space-10)}
.efoot h3{margin:0 0 var(--space-4);font-family:var(--font-ui);font-size:var(--fs-caption);font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:#fff}
.efoot-links a{display:block;padding:5px 0;font-size:var(--fs-body-sm);color:var(--text-on-dark-muted);text-decoration:none}
.efoot-links a:hover{color:#fff}
.efoot-brand img{width:272px;max-width:100%;height:auto;display:block}
.efoot-brand p{margin:0;font-size:var(--fs-body-sm);line-height:1.7;max-width:40ch;color:var(--text-on-dark-muted)}
.efoot-social{display:flex;gap:10px;margin-top:var(--space-2)}
.efoot-social a{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;
  border:1px solid rgba(255,255,255,.22);border-radius:6px;color:#fff}
.efoot-social a:hover{background:rgba(255,255,255,.08)}
.efoot-contact{display:flex;flex-direction:column;gap:var(--space-3);font-size:var(--fs-body-sm)}
.efoot-contact a,.efoot-contact span{display:flex;gap:12px;color:#fff;text-decoration:none;line-height:1.45;min-width:0}
.efoot-contact a span,.efoot-contact span span{display:block;min-width:0;overflow-wrap:anywhere}
.efoot-bar{border-top:1px solid rgba(255,255,255,.12)}
.efoot-bar-inner{max-width:var(--container-max);margin:0 auto;padding:var(--space-5) var(--container-pad);
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-4);font-size:var(--fs-caption)}
.efoot-bar a{color:var(--text-on-dark-muted);text-decoration:none}
.efoot-bar a:hover{color:#fff}
.efoot-credit a{color:var(--elite-sky)}

/* ---------- WhatsApp float ---------- */
.ewa{position:fixed;right:20px;bottom:20px;z-index:80;display:inline-flex;align-items:center;justify-content:center;
  width:56px;height:56px;border-radius:50%;background:var(--elite-green);color:#fff;box-shadow:0 10px 26px rgba(11,28,77,.28)}
.ewa:hover{background:var(--elite-green-700);color:#fff}

/* ---------- page furniture carried over from the DC build ---------- */
@keyframes eliteMarqueeLeft{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@keyframes eliteMarqueeRight{from{transform:translate3d(-50%,0,0)}to{transform:translate3d(0,0,0)}}
[data-elite="marquee"]:hover [data-elite="marquee-track"]{animation-play-state:paused}
[data-elite^="rail"]{scrollbar-width:none;-ms-overflow-style:none}
[data-elite^="rail"]::-webkit-scrollbar{display:none}
img{transition:filter 240ms cubic-bezier(.4,0,.2,1),box-shadow 240ms cubic-bezier(.4,0,.2,1),transform 400ms cubic-bezier(.16,.84,.44,1)}
a:hover img,[data-elite="tile"]:hover img{filter:brightness(1.07) saturate(1.06) contrast(1.02);
  box-shadow:0 0 0 1px rgba(126,200,248,.75),0 0 22px rgba(126,200,248,.45),0 16px 38px rgba(14,100,200,.28)}
[data-elite="tile"]{position:relative;overflow:hidden}
[data-elite="tile"]::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(115deg,rgba(255,255,255,0) 38%,rgba(255,255,255,.42) 50%,rgba(255,255,255,0) 62%);
  transform:translateX(-120%);transition:transform 620ms cubic-bezier(.16,.84,.44,1)}
[data-elite="tile"]:hover::after{transform:translateX(120%)}
.ehero-slide{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity 700ms cubic-bezier(.4,0,.2,1)}
.ehero-slide.is-active{opacity:1;pointer-events:auto}
.ehero-dot{width:34px;height:4px;border:0;padding:0;border-radius:999px;background:rgba(255,255,255,.32);cursor:pointer}
.ehero-dot.is-active{background:rgba(255,255,255,.9)}

/* ---------- responsive ---------- */
@media (max-width:1180px){.emega{display:none!important}}
@media (max-width:1080px){
  .enav{display:none}
  .eburger{display:inline-flex}
  [data-elite="hero-aside"]{display:none}
}
@media (max-width:760px){
  [data-elite="utility-areas"]{display:none}
  [data-elite="header-cta"]{display:none}
  [data-elite="split"]{grid-template-columns:minmax(0,1fr)!important}
  .efoot-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .elogo img{height:58px}
}
@media (max-width:520px){.efoot-grid{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){*{transition-duration:0ms!important;animation-duration:0ms!important}}
@media print{.ehead,.ewa,.ecta-actions,.emobile{display:none!important}}

/* ===== hover / focus states lifted out of the markup ===== */
[data-es-hover="es0"]:hover{border-color:var(--elite-blue)}
[data-es-hover="es1"]:hover{box-shadow:0 14px 32px rgba(11,28,77,.14)}