/* ═════════════════════════════════════════════════════════════════════
   PULSE Design Tokens v3 — OKLCH augmentation
   Brand: Ion Cyan #00D4C8 ONLY. No secondary hue.
   Mint companion #7FFFD4 (already in shared.css as --accent-secondary)
   used ONLY for shimmer/highlight tints — never as a separate accent.
   ═════════════════════════════════════════════════════════════════════ */

:root {
  /* ── Accent ramp (Ion Cyan → 9 OKLCH stops, brand-faithful) ────────── */
  --c-50:  oklch(0.97 0.04 188);
  --c-100: oklch(0.94 0.07 186);
  --c-200: oklch(0.90 0.10 185);
  --c-300: oklch(0.86 0.13 184);
  --c-400: oklch(0.82 0.15 184);
  --c-500: oklch(0.78 0.16 184); /* ≈ #00D4C8 */
  --c-600: oklch(0.70 0.15 184);
  --c-700: oklch(0.58 0.13 184);
  --c-800: oklch(0.45 0.10 184);
  --c-900: oklch(0.32 0.07 184);

  /* Mint highlight (matches existing --accent-secondary #7FFFD4) — used
     ONLY inside shimmer text gradients, never as a stand-alone accent. */
  --c-mint: oklch(0.94 0.13 170);

  /* ── State accents (semantic only, not visual brand) ─────────────── */
  --green-400: oklch(0.78 0.18 155);
  --amber-400: oklch(0.82 0.17 85);
  --red-400:   oklch(0.66 0.24 25);

  /* ── Layered near-blacks (matches existing #030306 / #0a0a0a) ───────── */
  --ink-0:  oklch(0.06 0.005 250);  /* deepest recess (≈ #030306) */
  --ink-1:  oklch(0.10 0.006 250);  /* page bg (≈ #0a0a0a) */
  --ink-2:  oklch(0.14 0.008 250);  /* surface */
  --ink-3:  oklch(0.18 0.010 250);  /* surface elevated */
  --ink-4:  oklch(0.24 0.012 250);  /* surface hover */
  --ink-5:  oklch(0.32 0.014 250);  /* border-strong */

  /* ── Text ramp ─────────────────────────────────────────────────────── */
  --text-1: oklch(0.97 0.005 250);
  --text-2: oklch(0.78 0.008 250);
  --text-3: oklch(0.58 0.008 250);
  --text-4: oklch(0.42 0.006 250);

  /* ── Hairline borders ──────────────────────────────────────────────── */
  --line-1: oklch(1 0 0 / 0.06);
  --line-2: oklch(1 0 0 / 0.10);
  --line-3: oklch(1 0 0 / 0.14);
  --line-accent: oklch(0.78 0.16 184 / 0.35);

  /* ── Glows & shadows (cyan only) ───────────────────────────────────── */
  --glow-c-sm:  0 0 20px oklch(0.78 0.16 184 / 0.20);
  --glow-c-md:  0 0 40px oklch(0.78 0.16 184 / 0.30);
  --glow-c-lg:  0 0 80px oklch(0.78 0.16 184 / 0.20);
  --shadow-1: 0 1px 2px oklch(0.05 0 0 / 0.5);
  --shadow-2: 0 4px 16px oklch(0.05 0 0 / 0.5), 0 1px 2px oklch(0.05 0 0 / 0.4);
  --shadow-3: 0 12px 48px oklch(0.05 0 0 / 0.6), 0 4px 12px oklch(0.05 0 0 / 0.5);
  --inner-bevel: inset 0 1px 0 oklch(1 0 0 / 0.06);

  /* ── Gradients — CYAN ONLY (preserves PULSE brand) ─────────────────── */
  --grad-hero-text: linear-gradient(
    135deg,
    var(--c-500) 0%,
    var(--c-mint) 50%,
    var(--c-500) 100%
  );
  --grad-cta: linear-gradient(
    135deg,
    var(--c-500) 0%,
    var(--c-mint) 100%
  );
  /* Hero ambient halo — single-color radial */
  --grad-hero-glow: radial-gradient(
    ellipse 80% 60% at 50% 40%,
    oklch(0.78 0.16 184 / 0.18) 0%,
    transparent 70%
  );

  /* ── Type scale (fluid clamp) ──────────────────────────────────────── */
  --tx-2xs: clamp(0.6875rem, 0.65rem + 0.18vw, 0.75rem);
  --tx-xs:  clamp(0.75rem, 0.70rem + 0.22vw, 0.8125rem);
  --tx-sm:  clamp(0.875rem, 0.82rem + 0.25vw, 0.9375rem);
  --tx-base:clamp(1rem, 0.95rem + 0.3vw, 1.0625rem);
  --tx-lg:  clamp(1.125rem, 1.05rem + 0.5vw, 1.25rem);
  --tx-xl:  clamp(1.375rem, 1.25rem + 0.7vw, 1.5rem);
  --tx-2xl: clamp(1.75rem, 1.55rem + 1vw, 2rem);
  --tx-3xl: clamp(2.25rem, 1.95rem + 1.5vw, 2.75rem);
  --tx-4xl: clamp(3rem, 2.5rem + 2.5vw, 4rem);
  --tx-5xl: clamp(3.5rem, 2.8rem + 4vw, 5.5rem);
  --tx-6xl: clamp(4rem, 2.5rem + 6vw, 7.5rem);

  --track-mega:    -0.045em;
  --track-display: -0.030em;
  --track-tight:   -0.015em;
  --track-body:    -0.005em;
  --track-eyebrow:  0.180em;

  --lead-mega:    0.96;
  --lead-display: 1.06;
  --lead-body:    1.62;
  --lead-mono:    1.50;

  /* ── Motion tokens ──────────────────────────────────────────────────── */
  --dur-1: 120ms;
  --dur-2: 200ms;
  --dur-3: 320ms;
  --dur-4: 600ms;
  --dur-5: 900ms;
  --dur-6: 1400ms;

  --ease-out-quart:   cubic-bezier(0.25, 1.00, 0.50, 1.00);
  --ease-out-expo:    cubic-bezier(0.16, 1.00, 0.30, 1.00);
  --ease-out-back:    cubic-bezier(0.34, 1.56, 0.64, 1.00);
  --ease-in-out-quart:cubic-bezier(0.76, 0.00, 0.24, 1.00);
  --ease-snap:        cubic-bezier(0.65, 0.00, 0.35, 1.00);

  --r-1: 6px;
  --r-2: 10px;
  --r-3: 14px;
  --r-4: 20px;
  --r-5: 28px;
  --r-pill: 9999px;

  --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;

  --z-bg: 0;
  --z-hex: 1;
  --z-particles: 2;
  --z-content: 3;
  --z-sticky: 50;
  --z-nav: 100;
  --z-overlay: 200;
  --z-modal: 300;
}

/* Light-mode overrides — keep brand intact, flip surface tones */
[data-theme="light"] {
  --ink-0: oklch(0.96 0.004 250);
  --ink-1: oklch(0.98 0.003 250);
  --ink-2: oklch(0.94 0.005 250);
  --ink-3: oklch(0.91 0.006 250);
  --ink-4: oklch(0.87 0.008 250);
  --ink-5: oklch(0.78 0.010 250);

  --text-1: oklch(0.20 0.010 250);
  --text-2: oklch(0.40 0.010 250);
  --text-3: oklch(0.55 0.008 250);
  --text-4: oklch(0.70 0.006 250);

  --line-1: oklch(0 0 0 / 0.06);
  --line-2: oklch(0 0 0 / 0.10);
  --line-3: oklch(0 0 0 / 0.14);

  --shadow-1: 0 1px 2px oklch(0.20 0.010 250 / 0.06);
  --shadow-2: 0 4px 16px oklch(0.20 0.010 250 / 0.08), 0 1px 2px oklch(0.20 0.010 250 / 0.04);
  --shadow-3: 0 12px 48px oklch(0.20 0.010 250 / 0.10);
  --inner-bevel: inset 0 1px 0 oklch(1 0 0 / 0.40);
}