/* theme.css — ONLY CSS variables. A site's whole look changes from this file.
   Tokens {{COLOR_*}} are filled by tools/new_site.py from site.json.
   Presets: the default (light) below, plus [data-theme="cinematic"] (dark).
   Switch preset with <html data-theme="cinematic">. */

:root {
  /* Colour */
  --c-bg: #f5f7fc;
  --c-surface: #ffffff;
  --c-surface-2: #e8eefb;
  --c-text: #0a1230;
  --c-muted: #3f4a68;          /* ≥ 4.5:1 on --c-bg */
  --c-border: #d3dcf0;
  --c-primary: #0047ff;
  --c-primary-ink: #ffffff;    /* text on primary */
  --c-accent: #ffe14d;
  --c-accent-ink: #0a1230;
  --c-focus: #1a5fd0;
  --c-banner-bg: #0a1230;
  --c-banner-ink: #fbfaf7;
  --c-scrim: rgba(12, 10, 8, .62);
  --c-whatsapp: #1f8f4e;       /* darker than brand green for 4.5:1 with white */

  /* Type */
  --font-body: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-display: "Bahnschrift Condensed", "Bahnschrift", "DIN Condensed", "Arial Narrow", "Roboto Condensed", sans-serif;
  --fw-body: 400;
  --fw-display: 700;
  --ls-display: 0;
  --tt-display: uppercase;
  --lh-body: 1.6;
  --lh-display: .98;
  --fs-base: 1.0625rem;
  --fs-small: .9rem;
  --fs-lead: clamp(1.1rem, .6vw + 1rem, 1.3rem);
  --fs-h1: clamp(3rem, 7vw + 1rem, 7rem);
  --fs-h2: clamp(2rem, 3vw + 1rem, 3.4rem);
  --fs-h3: clamp(1.15rem, .5vw + 1rem, 1.35rem);
  --fs-kinetic: clamp(4rem, 16vw, 14rem);

  /* Shape & space */
  --radius: 4px;
  --radius-lg: 8px;
  --radius-btn: 4px;
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2.5rem;
  --space-6: 4rem;
  --space-7: clamp(4.5rem, 8vw, 7.5rem);
  --container: 1160px;
  --header-h: 68px;
  --shadow: 0 1px 2px rgba(0,0,0,.05), 0 8px 24px rgba(0,0,0,.07);
  --shadow-lift: 0 2px 4px rgba(0,0,0,.06), 0 18px 40px rgba(0,0,0,.12);

  /* Motion personality (playful bakery vs calm accounting) */
  --motion-speed: 260ms;
  --motion-ease: cubic-bezier(.3, .8, .3, 1);
  --motion-distance: 18px;
  --motion-stagger: 45ms;
}

/* Polar Peak: electric blue + safety yellow, condensed caps, snappy motion. */

/* Dark "cinematic" preset (kinetic type, starfield). */
[data-theme="cinematic"] {
  --c-bg: #0b0a0d;
  --c-surface: #15131a;
  --c-surface-2: #1d1a23;
  --c-text: #f3eff6;
  --c-muted: #b9b1c2;
  --c-border: #2c2833;
  --c-primary-ink: #0b0a0d;
  --c-focus: #9cc2ff;
  --c-banner-bg: #f3eff6;
  --c-banner-ink: #0b0a0d;
  --c-scrim: rgba(5, 4, 8, .66);
  --shadow: 0 1px 2px rgba(0,0,0,.4), 0 10px 30px rgba(0,0,0,.45);
  --shadow-lift: 0 2px 6px rgba(0,0,0,.5), 0 22px 50px rgba(0,0,0,.6);
}