/* ============================================================
   MiTax — Locked design tokens
   Source of truth: DESIGN.md (do not deviate)
   ============================================================ */

:root {
  /* -----------------------------------------------------------
     Brand — Blue Ribbon
  ----------------------------------------------------------- */
  --primary-050: oklch(0.975 0.018 261);   /* #F2F6FF */
  --primary-100: oklch(0.94 0.045 261);    /* #E2EBFF */
  --primary-500: oklch(0.535 0.245 261);   /* #0357ED */
  --primary-600: oklch(0.475 0.235 261);   /* #0246C2 */
  --primary-700: oklch(0.395 0.205 261);   /* #013396 */

  /* -----------------------------------------------------------
     Accent — Mountain Meadow
  ----------------------------------------------------------- */
  --accent-050: oklch(0.975 0.018 167);    /* #EBFAF3 */
  --accent-100: oklch(0.94 0.045 167);     /* #D6F4E8 */
  --accent-500: oklch(0.68 0.158 167);     /* #11BD8F */
  --accent-600: oklch(0.605 0.155 165);    /* #0B9D75 */

  /* -----------------------------------------------------------
     Neutrals (tinted toward primary)
  ----------------------------------------------------------- */
  --ink:        oklch(0.17 0.018 261);     /* #0B1226 — body text */
  --ink-700:    oklch(0.33 0.018 261);     /* #2A3550 */
  --ink-500:    oklch(0.50 0.014 261);     /* #5E6680 — muted */
  --ink-300:    oklch(0.72 0.010 261);     /* #A6ABBC — strong border */
  --ink-200:    oklch(0.86 0.008 261);     /* #D2D5E0 — subtle border */
  --snow:       oklch(0.995 0.004 261);    /* #FAFBFE — page bg */
  --surface:    oklch(1 0 0);              /* near-white surface */

  /* -----------------------------------------------------------
     Status
  ----------------------------------------------------------- */
  --success:    oklch(0.68 0.158 167);
  --warning:    oklch(0.77 0.165 80);      /* #FFB840 */
  --error:      oklch(0.60 0.22 25);       /* #E84141 */

  /* -----------------------------------------------------------
     Type scale (DESIGN.md — 1.333 ratio)
     Fluid clamps applied in base.css. Raw values kept here.
  ----------------------------------------------------------- */
  --fs-display: 4.5rem;     /* 72 */
  --fs-h1:      3.375rem;   /* 54 */
  --fs-h2:      2.5rem;     /* 40 */
  --fs-h3:      1.875rem;   /* 30 */
  --fs-h4:      1.375rem;   /* 22 */
  --fs-body:    1.0625rem;  /* 17 */
  --fs-caption: 0.8125rem;  /* 13 */
  --fs-small:   0.6875rem;  /* 11 */

  /* Line heights */
  --lh-tight:   1.04;
  --lh-snug:    1.18;
  --lh-body:    1.55;
  --lh-caption: 1.35;

  /* Tracking */
  --tr-display: -0.04em;
  --tr-head:    -0.02em;
  --tr-body:    0;
  --tr-caption: 0.02em;

  /* -----------------------------------------------------------
     Spacing (8-px base with rhythm variations)
  ----------------------------------------------------------- */
  --sp-1:  4px;
  --sp-2:  8px;
  --sp-3:  12px;
  --sp-4:  16px;
  --sp-5:  24px;
  --sp-6:  32px;
  --sp-7:  48px;
  --sp-8:  64px;
  --sp-9:  96px;
  --sp-10: 128px;

  /* -----------------------------------------------------------
     Radii
  ----------------------------------------------------------- */
  --r-sm:   6px;
  --r-md:   12px;
  --r-lg:   20px;
  --r-xl:   28px;
  --r-pill: 999px;

  /* -----------------------------------------------------------
     Elevation (tinted toward primary, single soft layer)
  ----------------------------------------------------------- */
  --shadow-sm:   0 1px 2px oklch(0.17 0.018 261 / 0.06);
  --shadow-md:   0 8px 24px oklch(0.17 0.018 261 / 0.08);
  --shadow-lg:   0 24px 64px oklch(0.17 0.018 261 / 0.12);
  --shadow-glow: 0 8px 40px oklch(0.535 0.245 261 / 0.22);

  /* -----------------------------------------------------------
     Motion
  ----------------------------------------------------------- */
  --ease-out-quart: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast:  140ms;
  --dur-base:  220ms;
  --dur-slow:  380ms;

  /* -----------------------------------------------------------
     Layout
  ----------------------------------------------------------- */
  --container-max: 1200px;
  --nav-h-desktop: 72px;
  --nav-h-mobile:  56px;
  --measure:       68ch; /* body max-width (65-70ch) */

  /* -----------------------------------------------------------
     Brand gradient (hero — Drenched)
     Primary -> accent via oklch interpolation.
  ----------------------------------------------------------- */
  --brand-gradient:
    linear-gradient(
      135deg in oklch,
      oklch(0.535 0.245 261) 0%,
      oklch(0.56 0.22 220) 40%,
      oklch(0.62 0.20 195) 65%,
      oklch(0.68 0.158 167) 100%
    );

  /* Safe fallback for browsers without `in oklch` interpolation */
  --brand-gradient-fallback:
    linear-gradient(135deg, #0357ED 0%, #0A7CC9 50%, #11BD8F 100%);
}

@supports not (background: linear-gradient(in oklch, red, blue)) {
  :root {
    --brand-gradient: var(--brand-gradient-fallback);
  }
}
