/* ==========================================================================
   instlyquote.com — DESIGN TOKENS
   --------------------------------------------------------------------------
   Built from the measured Shoor landing-page spec (752 x 4960 artboard).
   Every artboard measurement is DOUBLED here, per the spec's scale caveat:
   the authoring file is ~1504px wide, so 8 a-px body = 16px, 34 a-px H1 = 68px.

   Deviations from the spec are marked DEVIATION with the reason. There are
   four, all legibility or honesty related. Everything else is the sampled
   value.
   ========================================================================== */

:root {
  /* ---- page ---------------------------------------------------------- */
  --c-base:            #05081b;   /* sampled at 8 y-positions, identical */
  --c-band:            #0c0c29;   /* benefits / products flat band */
  --c-band-alt:        #0a0a23;   /* card-adjacent field */
  --c-nebula:          #2a185e;   /* diagonal wash behind the globe */

  /* ---- panels & surfaces --------------------------------------------- */
  --c-card:            #0a0a23;
  --c-card-line:       rgba(255,255,255,0.06);
  --c-bento-a:         #0c112d;
  --c-bento-b:         #141a3c;
  --c-bento-line:      rgba(255,255,255,0.07);
  --c-bar:             #151734;   /* announcement bar */
  --c-bar-edge:        #1d2a4a;
  --c-pill:            #191b3d;   /* badge */
  --c-pill-line:       #1f1e40;
  --c-btn-2:           #1f2539;   /* secondary button */
  --c-input:           #181a39;
  --c-chrome:          #212330;   /* browser frame */
  --c-chrome-line:     #2b2d3f;
  --c-rail:            #2f3349;   /* timeline rail + circuit traces */
  --c-rule:            #2f3651;   /* footer rule */
  --c-glass:           rgba(255,255,255,0.07);
  --c-glass-line:      rgba(255,255,255,0.08);

  /* ---- text ----------------------------------------------------------- */
  --c-display:         #ffffff;
  --c-grad-a:          #cdd0ea;   /* hero line 2, left stop */
  --c-grad-b:          #9a9dc7;
  --c-grad-c:          #8b8eb4;   /* right stop */
  --c-nav:             #a9adbe;
  --c-announce:        #f5faff;
  --c-para:            #d6daed;   /* timeline paragraphs */
  --c-lead:            #d0b9d8;   /* first sentence of each paragraph */
  --c-muted:           #9c9fb7;   /* subs, trust line, captions */
  --c-card-title:      #cdcee5;
  --c-placeholder:     #9d9fbc;
  --c-foot-head:       #f7fbff;
  --c-foot-link:       #9195a8;
  --c-copyright:       #a9acc0;

  /* DEVIATION 1 — spec card body is #67687e, which measures 3.4:1 on
     #0a0a23 and fails WCAG AA for body text. Lifted to 5.9:1. The sampled
     value is kept below for genuinely incidental micro-copy. */
  --c-card-body:       #9497b3;
  --c-card-body-spec:  #67687e;

  /* DEVIATION 2 — spec inline link is #5c66b9, ~2.5:1 on the base. Lifted.
     Links stay underlined either way, so colour is not the only signal. */
  --c-link:            #8b93e8;
  --c-link-spec:       #5c66b9;

  /* ---- accents -------------------------------------------------------- */
  --c-arrow-btn:       #21389d;   /* announcement-bar arrow fill */
  --c-tile-indigo:     #6b72ff;
  --c-tile-orchid:     #d768b9;
  --c-tile-amber:      #b8730f;   /* spec core UNKNOWN (sub-pixel); edge was #5b3507 */
  --c-glyph:           #6468a4;   /* feature-card icon glyphs */
  --c-glow:            #9283b3;   /* hero burst peak */
  --c-glow-2:          #917db4;

  --c-cta-a:           #672a93;   /* primary CTA gradient, left */
  --c-cta-b:           #4a53a8;   /* primary CTA gradient, right */

  /* status — ours, not the spec's. Tuned to sit on this palette. */
  --c-live:            #6ee7a8;
  --c-live-bg:         rgba(110,231,168,0.12);
  --c-testing:         #f0c274;
  --c-testing-bg:      rgba(240,194,116,0.12);
  --c-build:           #a99bf0;
  --c-build-bg:        rgba(169,155,240,0.14);
  --c-next:            #9c9fb7;
  --c-next-bg:         rgba(156,159,183,0.12);

  /* editorial flag for unresolved facts and dead CTAs */
  --c-todo:            #f0c274;
  --c-todo-bg:         rgba(240,194,116,0.07);
  --c-todo-line:       rgba(240,194,116,0.32);

  /* ---- gradients ------------------------------------------------------ */
  /* 6.1a — measured centre-column falloff: y40 #101137 -> y80 #7956a1 ->
     y110 PEAK #9283b3 -> y150 #2f2a62 -> y210 #0e0e37. Radii are 640x230 a-px
     doubled. Extra stops so the peak actually reads as a burst rather than a
     single centre pixel. */
  /* 6.1a — the burst is NOT a contained ellipse. In the reference the lit band
     spans the FULL page width and runs up into both top corners; its lower
     boundary is a wide shallow valley that dips behind the headline. So the
     rim has to be wider than the viewport and bleed off both edges — a rim
     that terminates inside the page reads as a blob with dark corners.
     Three layers: core, body, and a full-bleed rim. */
  --g-hero-core: radial-gradient(ellipse 520px 195px at 50% 235px,
                    #ddd2f2 0%, #a88fd0 16%, #8a5fb8 34%,
                    rgba(91,61,156,0) 74%);
  --g-hero-body: radial-gradient(ellipse 880px 300px at 50% 91px,
                    rgba(138,95,200,0.80) 0%,
                    rgba(104,74,182,0.62) 34%,
                    rgba(62,56,150,0.40) 60%,
                    rgba(28,36,100,0.20) 80%,
                    rgba(5,8,27,0) 96%);
  --g-hero-rim:  radial-gradient(ellipse 1240px 320px at 50% 84px,
                    rgba(5,8,27,0) 20%,
                    rgba(92,120,215,0.34) 48%,
                    rgba(70,190,214,0.30) 68%,
                    rgba(48,104,160,0.17) 85%,
                    rgba(5,8,27,0) 100%);

  /* DEVIATION 5 — the spec records the heading gradient as "90deg", which in
     CSS is left-to-right. The reference fades TOP TO BOTTOM (and
     DESIGN-AUDIT-shoor.md 3.6 says "vertical gradient fading downward"). The
     spec meant 90 degrees from horizontal. Using 180deg. */
  --g-heading:    linear-gradient(180deg, #eef0fb 0%, #c3c7e6 60%, #a3a8cc 100%);
  --g-cta:        linear-gradient(90deg, #672a93 0%, #4a53a8 100%);
  --g-bento:      linear-gradient(160deg, #0c112d 0%, #141a3c 100%);
  --g-nebula:     linear-gradient(115deg, rgba(10,10,35,0) 35%, rgba(42,24,94,0.55) 100%);

  /* ---- type ----------------------------------------------------------- */
  /* Switzer, self-hosted — chosen 2026-07-27 from a five-way specimen.
     The spec named General Sans / Switzer / Plus Jakarta Sans as the closest
     matches; Switzer reads credible and technical rather than startup-friendly,
     and its tabular numerals hold up in a dense comparison table. */
  --font-sans: "Switzer", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;

  --fs-h1:        clamp(2.75rem, 1.6rem + 3.9vw, 4.25rem);  /* 68px at 2x */
  --fs-h2:        clamp(2rem, 1.4rem + 2.1vw, 3.125rem);    /* 50px */
  --fs-h2-cta:    clamp(2rem, 1.4rem + 2.2vw, 3.1875rem);   /* 51px */
  --fs-sub:       1.3125rem;   /* 21px */
  --fs-announce:  1.5rem;      /* 24px */
  --fs-para:      1.6875rem;   /* 27px — timeline paragraphs */
  --fs-badge:     1.25rem;     /* 20px */
  --fs-nav:       1.1875rem;   /* 19px */
  --fs-btn:       1.1875rem;   /* 19px */
  --fs-card-t:    1.3125rem;   /* 21px */
  --fs-card-b:    1rem;        /* 16px */
  --fs-trust:     1.125rem;    /* 18px — trust line, copyright */
  --fs-foot-h:    1.0625rem;   /* 17px */
  --fs-foot-l:    1rem;        /* 16px */

  --lh-h1:        0.97;
  --lh-h2:        1.16;   /* DEVIATION 3 — spec 1.32 at 25/33 a-px. At 50px
                             that is 66px leading, which reads as a gap, not a
                             heading. Tightened. */
  --lh-sub:       1.5;    /* DEVIATION 4 — spec measures 1.05, almost certainly
                             an ink measurement rather than baseline pitch.
                             1.05 collides descenders on a two-line sub. */
  --lh-para:      1.4;
  --lh-body:      1.5;

  --tr-h1:        -0.006em;   /* -0.4px at 68px */
  --tr-badge:     0.08em;

  /* ---- space — 8/16 base at 2x ---------------------------------------- */
  --s-1:  0.5rem;    /* 8 */
  --s-2:  1rem;      /* 16 */
  --s-3:  1.375rem;  /* 22 */
  --s-4:  2rem;      /* 32 */
  --s-5:  2.75rem;   /* 44 */
  --s-6:  4rem;      /* 64 */
  --s-7:  5.75rem;   /* 92 */
  --s-8:  7.25rem;   /* 116 */
  --s-9:  9.375rem;  /* 150 */

  /* ---- layout --------------------------------------------------------- */
  --w-page:    1316px;   /* 658 x 2, verified on three elements */
  --gutter:    var(--s-4);
  --w-prose:   44ch;     /* timeline paragraph measure, 257 a-px */
  --grid-gap:  2.25rem;  /* 36 = 18 x 2 */
  --bento-gap: 2.125rem; /* 34 = 17 x 2 */

  --r-card:    1.5rem;    /* 24 = 12 x 2 */
  --r-feature: 1.375rem;  /* 22 = 11 x 2 */
  --r-bar:     0.875rem;  /* 14 = 7 x 2 */
  --r-pill:    999px;
  --r-chip:    0.75rem;
  --r-frame:   1.125rem;  /* 18 = 9 x 2 */

  --rail-w:    4px;       /* 2 a-px */

  /* ==== LEGACY ALIASES =================================================
     The other seven pages are still on the undesigned scaffold (base.css)
     and read these names. Mapped onto the new palette so they stay coherent
     rather than turning into white-on-white. They go away when those pages
     are built against the real system.
     =================================================================== */
  --c-bg: var(--c-base);
  --c-bg-alt: var(--c-band-alt);
  --c-panel: var(--c-card);
  --c-border: var(--c-card-line);
  --c-border-strong: var(--c-rail);
  --c-text: #e8eaf5;
  --c-text-muted: var(--c-muted);
  --c-text-faint: #7a81a1;
  --c-accent: var(--c-link);
  --c-accent-text: #ffffff;
  --c-status-live: var(--c-live);       --c-status-live-bg: var(--c-live-bg);
  --c-status-testing: var(--c-testing); --c-status-testing-bg: var(--c-testing-bg);
  --c-status-build: var(--c-build);     --c-status-build-bg: var(--c-build-bg);
  --c-status-next: var(--c-next);       --c-status-next-bg: var(--c-next-bg);
  --fs-hero: var(--fs-h1);
  --fs-h3: var(--fs-card-t);
  --fs-body: 1.0625rem;
  --fs-small: 0.9375rem;
  --fs-micro: 0.75rem;
  --lh-tight: 1.1;
  --radius: var(--r-feature);
  --radius-s: 0.5rem;
  --s-section: clamp(1.5rem, 2.2vw, 2.25rem);
}