/* =========================================================
   R&A URETHANE — LIGHT THEME
   Loaded on every page after pages.css. The site defaults to
   the dark ENGINE look; html[data-theme="light"] flips the
   token layer and the handful of surfaces that hardcode dark
   values. Footer, CTA band and .section--navy stay navy in
   both modes as deliberate brand anchors.
   CMS: theme is a root attribute — no markup changes needed.
   ========================================================= */

html { color-scheme: dark; }
html[data-theme="light"] { color-scheme: light; }

html[data-theme="light"] {
  --canvas: #FBFCFE;                    /* brighter page so panels lift off it */
  --canvas-2: #EEF3F9;
  --paper: #FFFFFF;                     /* cards are solid white now, not a tint */
  --paper-solid: #FFFFFF;
  --surface: #E6EDF5;                   /* alternating band — clearly deeper than canvas */
  --surface-2: #DCE6F0;
  --ink: #0C1826;                       /* near-black slate for max headline contrast */
  --muted: #43566B;                     /* 8.0:1 on canvas */
  --hairline: rgb(12 24 38 / 16%);      /* firmer dividers */
  --field-border: rgb(12 24 38 / 34%);
  --green-text: #3B7A1B;               /* lime family, 5.6:1 on canvas */
  --sky-text: #1A6699;
  --sky-bright: #1A6699;
  --glow-lime: rgb(141 198 63 / 26%);
  --glow-sky: rgb(51 150 209 / 20%);
  --shadow-1: 0 1px 2px rgb(12 24 38 / 7%), 0 8px 22px rgb(12 24 38 / 8%);
  --shadow-2: 0 2px 6px rgb(12 24 38 / 8%), 0 20px 46px rgb(12 24 38 / 12%);
}

/* ---------- element separation: cards & panels lift off the page ---------- */
html[data-theme="light"] .card,
html[data-theme="light"] .bento > *,
html[data-theme="light"] .explorer a,
html[data-theme="light"] .mega__feature,
html[data-theme="light"] .pdetail__panel,
html[data-theme="light"] .person {
  background: #FFFFFF;
  border-color: rgb(12 24 38 / 12%);
  box-shadow: 0 1px 2px rgb(12 24 38 / 5%), 0 4px 14px rgb(12 24 38 / 5%);
}
html[data-theme="light"] .card--flat { box-shadow: none; }
html[data-theme="light"] .person:hover { box-shadow: 0 14px 30px rgb(12 24 38 / 12%), 0 0 20px rgb(141 198 63 / 10%); border-color: rgb(78 143 31 / 45%); }
html[data-theme="light"] .country-pill { background: rgb(78 143 31 / 12%); border-color: rgb(78 143 31 / 32%); }
html[data-theme="light"] .explorer { background: rgb(12 24 38 / 12%); }   /* grid lines read */
html[data-theme="light"] .section--surface {
  background: linear-gradient(180deg, var(--surface), var(--surface-2));
  border-block: 1px solid rgb(12 24 38 / 12%);
}
html[data-theme="light"] .stats { border-color: rgb(12 24 38 / 16%); background: #FFFFFF; box-shadow: var(--shadow-1); }
html[data-theme="light"] .stats > div { border-color: rgb(12 24 38 / 12%); }
html[data-theme="light"] .breadcrumbs { background: var(--surface); }

/* ---------- chrome ---------- */
html[data-theme="light"] .utility { background: #E2E9F1; color: var(--muted); }
html[data-theme="light"] .utility a { color: var(--ink); }
html[data-theme="light"] .header { background: rgb(244 248 252 / 84%); }
html[data-theme="light"] .brand__word { color: #2E7D32; }         /* exact artwork green */
html[data-theme="light"] .nav__link { color: #22354C; }
html[data-theme="light"] .nav__link:hover,
html[data-theme="light"] .nav__link[aria-expanded="true"],
html[data-theme="light"] .nav__link[aria-current="page"] { color: var(--green-text); }
html[data-theme="light"] .icon-btn { color: #22354C; }
html[data-theme="light"] .icon-btn:hover { color: var(--green-text); }
html[data-theme="light"] .mega { background: rgb(255 255 255 / 97%); }
html[data-theme="light"] .mega__feature { background: rgb(2 20 43 / 3%); }
html[data-theme="light"] .registerbar { background: #DFE7F0; color: #22354C; }
html[data-theme="light"] .registerbar b { color: var(--muted); }
html[data-theme="light"] .search-overlay { background: rgb(15 29 48 / 40%); }
html[data-theme="light"] .to-top { background: #fff; }

/* ---------- type accents ---------- */
html[data-theme="light"] :is(.grad, h1 em, h2 em) {
  background: linear-gradient(92deg, #4E8F1F 10%, #67A82E 45%, #1D6FA3 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
html[data-theme="light"] .lede,
html[data-theme="light"] .txt-soft,
html[data-theme="light"] .hero-slide__sub,
html[data-theme="light"] .page-hero .lede,
html[data-theme="light"] .card p { color: #3E4F63; }
html[data-theme="light"] .hero-slide__sub strong { color: var(--ink); }
html[data-theme="light"] .stats dd { color: #4E8F1F; text-shadow: none; }
html[data-theme="light"] .link-quiet:hover { color: var(--green-text); }

/* ---------- surfaces ---------- */
html[data-theme="light"] .card:hover {
  background: rgb(2 20 43 / 3%);
  box-shadow: 0 18px 40px rgb(15 29 48 / 12%), 0 0 24px rgb(141 198 63 / 10%);
  border-color: rgb(78 143 31 / 45%);
}
html[data-theme="light"] .btn--outline { background: rgb(2 20 43 / 3%); color: var(--ink); border-color: rgb(2 20 43 / 32%); }
html[data-theme="light"] .btn--outline:hover { background: rgb(2 20 43 / 8%); border-color: rgb(2 20 43 / 55%); color: var(--ink); }
html[data-theme="light"] .btn--primary { box-shadow: 0 6px 20px rgb(141 198 63 / 35%); }
html[data-theme="light"] .field input,
html[data-theme="light"] .field select,
html[data-theme="light"] .field textarea { background: #FFFFFF; }
html[data-theme="light"] .cred { background: rgb(2 20 43 / 3%); }
html[data-theme="light"] .cred__marks span { color: #22415F; }
html[data-theme="light"] .explorer a:hover { background: rgb(2 20 43 / 4%); }
html[data-theme="light"] .bento > * { background: var(--paper); }
html[data-theme="light"] .mega__col a .mono { color: var(--green-text); }

/* ---------- hero slider chrome ---------- */
html[data-theme="light"] .hero-slider__arrow,
html[data-theme="light"] .hero-slider__play { background: #fff; color: var(--ink); }
html[data-theme="light"] .hero-slider__dot { background: rgb(2 20 43 / 18%); }
html[data-theme="light"] .hero-slider__dot:hover { background: rgb(2 20 43 / 35%); }
html[data-theme="light"] .hero-slider__dot[aria-selected="true"] { background: #4E8F1F; }
html[data-theme="light"] .hero-slider__progress { background: rgb(2 20 43 / 12%); }

/* ---------- animated scenes: white linework → blueprint ink ---------- */
html[data-theme="light"] :is(.hero-scene__world, .hero-slide__scene svg) [stroke="#fff"] { stroke: #2B4763; }
html[data-theme="light"] :is(.hero-scene__world, .hero-slide__scene svg) [fill="#fff"] { fill: #2B4763; }
html[data-theme="light"] :is(.hero-scene__world, .hero-slide__scene svg) stop[stop-color="#fff"] { stop-color: #2B4763; }
html[data-theme="light"] :is(.hero-scene__world, .hero-slide__scene svg) [fill="#0B1830"] { fill: #C9D6E4; }
html[data-theme="light"] .hero-scene__aurora-a, html[data-theme="light"] .hero-scene__aurora-b { opacity: .35; }
html[data-theme="light"] .hero-scene__floor {
  background:
    linear-gradient(180deg, transparent, rgb(51 150 209 / 7%)),
    repeating-linear-gradient(90deg, rgb(2 20 43 / 6%) 0 1px, transparent 1px 90px),
    repeating-linear-gradient(0deg, rgb(2 20 43 / 6%) 0 1px, transparent 1px 46px);
}

/* the brand mark's white tick must stay white in both themes — the scene
   overrides above are scoped away from .brand__mark on purpose */

/* ---------- product category pages ---------- */
html[data-theme="light"] .prod-card,
html[data-theme="light"] .step {
  background: #FFFFFF; border-color: rgb(12 24 38 / 12%);
  box-shadow: 0 1px 2px rgb(12 24 38 / 5%), 0 4px 14px rgb(12 24 38 / 5%);
}
html[data-theme="light"] .prod-card:hover { box-shadow: 0 18px 38px rgb(12 24 38 / 13%), 0 0 22px rgb(141 198 63 / 10%); border-color: rgb(78 143 31 / 45%); }
html[data-theme="light"] .step:hover { border-color: rgb(78 143 31 / 42%); }
html[data-theme="light"] .prod-card__visual .a,
html[data-theme="light"] .cat-hero__visual .a,
html[data-theme="light"] .step::before { stroke: #4E8F1F; }
html[data-theme="light"] .step::before { color: #4E8F1F; text-shadow: none; }
html[data-theme="light"] .prod-group__label,
html[data-theme="light"] .country-pill { background: rgb(78 143 31 / 12%); border-color: rgb(78 143 31 / 32%); }