/* ═══════════════════════════════════════════════════════════════════════
   MERIDIAN DESIGN SYSTEM — LOCKED TOKENS  v2.0
   Insurance + Mortgage · "Origin × Rocket"
   ───────────────────────────────────────────────────────────────────────
   TWO MODES, ONE SYSTEM:
     • EDITORIAL-DARK  (Origin DNA)  → brand & hero moments. Near-black,
       full-bleed photography, italic-first serif display, lavender AI.
     • CONVERSION-LIGHT (Rocket DNA) → product, offers, calculators.
       White, friendly bold sans, red (mortgage) / green (insurance) CTAs.
   Display: Newsreader · UI/Body: Hanken Grotesk · Labels+Numerics: JetBrains Mono
   THESE VALUES ARE LOCKED. Do not invent colors, fonts, or sizes outside this file.
   ═══════════════════════════════════════════════════════════════════════ */

:root {
  /* ── NEUTRALS · dark (Origin editorial) ── */
  --ink:        #08080A;   /* page-black — hero & section base */
  --ink-1:      #0E0E11;   /* raised black */
  --ink-2:      #16161A;   /* dark surface */
  --ink-3:      #1E1E24;   /* card on dark */
  --ink-4:      #2A2A31;   /* hairline / chip on dark */
  --ink-5:      #3A3A43;   /* strong hairline */

  /* ── NEUTRALS · light (Rocket conversion) ── */
  --paper:      #FFFFFF;   /* primary light page (Rocket is white) */
  --paper-2:    #FAFAF8;   /* warm off-white section */
  --paper-3:    #F4F3EF;   /* wash / alt band */
  --paper-pink: #F1ECF3;   /* calculator/offer tint (Rocket pink) */

  /* ── BORDERS · warm light hairlines (matches calc card #ECECE9 / cards #E8E8E4) ── */
  --border:        #E9E8E3;   /* dividers, input borders, low-emphasis lines */
  --border-strong: #D8D6CF;   /* stronger hairline / form borders at rest */

  /* ── TEXT ── */
  --t-hi:       #0A0A0A;   /* primary on light */
  --t-mid:      #5C5C66;   /* secondary on light */
  --t-lo:       #98989F;   /* tertiary on light */
  --t-hi-d:     #F5F5F2;   /* primary on dark */
  --t-mid-d:    rgba(245,245,242,0.64);
  --t-lo-d:     rgba(245,245,242,0.40);

  /* ── MORTGAGE accent · Valley West Mortgage red (from VWM logo) ── */
  --m:          #D0202F;
  --m-hover:    #A81A27;
  --m-soft:     #FBE7E9;
  --m-glow:     rgba(208,32,47,0.28);

  /* ── INSURANCE accent · Valley West Insurance green + navy (from VWI logo) ── */
  --i:          #50B45A;   /* fresh kelly green sampled from logo house mark */
  --i-hover:    #3C9446;
  --i-soft:     #EAF7EB;
  --i-navy:     #141B45;   /* deep navy wordmark — primary insurance dark */
  --i-navy-2:   #1E2A66;
  --i-deep:     #141B45;   /* dark insurance surface = navy */
  --i-glow:     rgba(80,180,90,0.30);

  /* ── AI / INTELLIGENCE · lavender-periwinkle (shared by both DNAs) ── */
  --ai:         #8B8CF0;
  --ai-2:       #A6A7F5;
  --ai-soft:    #ECECFD;

  /* ── EXPRESSIVE ── */
  --wine:       #5A0E1E;   /* deep burgundy testimonial panel (Rocket) */
  --wine-2:     #76122A;

  /* ── SEMANTIC ── */
  --ok:         #16A34A;   /* trending / positive */
  --ok-soft:    #E7F6EC;
  --warn:       #D97706;
  --bad:        #D6122B;
  --up:         #4ED98A;   /* gains on dark */
  --down:       #F2789A;   /* losses on dark */

  /* ── GRADIENTS ── */
  /* Hero photography (CSS-simulated; swap for real photos in production) */
  --photo-sky:
    radial-gradient(120% 80% at 78% 18%, rgba(255,255,255,0.55) 0%, transparent 42%),
    radial-gradient(90% 60% at 22% 30%, rgba(255,255,255,0.40) 0%, transparent 40%),
    radial-gradient(70% 50% at 60% 70%, rgba(255,255,255,0.22) 0%, transparent 45%),
    linear-gradient(180deg, #6F9BD6 0%, #8FB2E0 38%, #BcCfE8 70%, #DCE6F0 100%);
  --photo-meadow:
    radial-gradient(80% 50% at 50% 0%, rgba(180,210,150,0.45) 0%, transparent 55%),
    radial-gradient(60% 60% at 30% 80%, rgba(20,40,20,0.55) 0%, transparent 60%),
    linear-gradient(180deg, #3E5C2C 0%, #4F7536 45%, #2F4722 100%);
  --grad-forecast: linear-gradient(178deg, #0A1A30 0%, #14365F 55%, #2E5E96 100%);
  /* Testimonial tiles (Origin) — original palette restored */
  --grad-tile-sky:  radial-gradient(92% 80% at 50% 42%, #AECBEE 0%, rgba(174,203,238,0) 60%), linear-gradient(168deg, #74B2EE 0%, #84AFDF 52%, #8EABD4 100%);
  --grad-tile-moss: radial-gradient(135% 125% at 28% 14%, #06764A 0%, #2A8A54 44%, #6BA65C 78%, #9AAE5E 100%);
  --grad-tile-teal: radial-gradient(120% 120% at 50% 52%, #0F97AA 0%, #34A7B8 52%, #76C0CB 100%);
  --grad-tile-gold: radial-gradient(125% 125% at 82% 82%, #F1AD3A 0%, #ECC36B 22%, #CADFE6 46%, #76BCF5 76%, #61B4FF 100%);
  /* Lavender glow (insight cards / AI) */
  --grad-lav: linear-gradient(165deg, #2A2A36 0%, #4B45A6 70%, #8B8CF0 130%);

  /* ── GLASS ── */
  --glass-d-bg:   rgba(255,255,255,0.07);
  --glass-d-bd:   rgba(255,255,255,0.15);
  --glass-l-bg:   rgba(255,255,255,0.72);
  --glass-l-bd:   rgba(255,255,255,0.40);
  --glass-blur:   blur(22px) saturate(170%);
  /* dark translucent pill on photo (Origin nav/buttons) */
  --glass-pill:   rgba(20,20,24,0.42);
  --glass-pill-bd:rgba(255,255,255,0.20);

  /* ── TYPE FAMILIES ── */
  --serif: "Newsreader", Georgia, "Times New Roman", serif;     /* display, editorial */
  --sans:  "Hanken Grotesk", -apple-system, system-ui, sans-serif; /* UI, body, product headings */
  --mono:  "Hanken Grotesk", -apple-system, system-ui, sans-serif; /* (JetBrains Mono retired — was too code-like) */

  /* ── TYPE WEIGHTS ── */
  --fw-thin: 200; --fw-light: 300; --fw-reg: 400; --fw-med: 500; --fw-semi: 600; --fw-bold: 700;

  /* ── TYPE SCALE (desktop) ── */
  --fs-display-xl: clamp(56px, 8vw, 120px); /* hero serif */
  --fs-display-l:  clamp(40px, 5.5vw, 72px);
  --fs-display-m:  clamp(32px, 4vw, 52px);
  --fs-h1: 40px; --fs-h2: 30px; --fs-h3: 22px;
  --fs-body-l: 18px; --fs-body: 15px; --fs-sm: 13px;
  --fs-label: 11px;  /* mono uppercase eyebrow */
  --fs-rate: 26px;   /* mono numerics */
  --tracking-label: 0.16em;
  --tracking-mark:  0.22em;

  /* ── RADII ── */
  --r-xs: 8px; --r-sm: 12px; --r-md: 16px; --r-card: 20px; --r-lg: 24px; --r-xl: 32px; --r-pill: 999px;

  /* ── SHADOW ── */
  --sh-1: 0 1px 3px rgba(8,8,10,.06);
  --sh-2: 0 6px 20px rgba(8,8,10,.09);
  --sh-3: 0 16px 44px rgba(8,8,10,.14);
  --sh-4: 0 30px 80px rgba(8,8,10,.22);
  --sh-photo: 0 40px 90px rgba(0,0,0,.45);
  --sh-m: 0 10px 26px rgba(8,8,10,.16);
  --sh-i: 0 10px 26px rgba(8,8,10,.16);

  /* ── SPACING (base 4) ── */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px; --s8:64px; --s9:96px; --s10:128px;

  /* ── MOTION ── */
  --ease-snap:   cubic-bezier(.25,0,0,1);
  --ease-spring: cubic-bezier(.34,1.56,.64,1);
  --ease-out:    cubic-bezier(.16,1,.3,1);
  --dur-fast: 200ms; --dur-normal: 300ms; --dur-slow: 600ms; --dur-hero: 1200ms;
}

/* Brand mode helper: set data-brand="insurance" to swap accent to green */
[data-brand="insurance"] {
  --accent: var(--i); --accent-hover: var(--i-hover); --accent-soft: var(--i-soft); --accent-glow: var(--i-glow);
}
[data-brand="mortgage"], :root {
  --accent: var(--m); --accent-hover: var(--m-hover); --accent-soft: var(--m-soft); --accent-glow: var(--m-glow);
}
