:root{
  /* ===== Brand palette ===== */
  --c-cyan: #1B9CE8;
  --c-cyan-bright: #4FB7F0;
  --c-cyan-deep: #0B6BCB;
  --c-navy: #0B2545;
  --c-navy-deep: #061732;
  --c-navy-soft: #13315C;
  --c-ink: #050B18;
  --c-ink-2: #0A1426;
  --c-paper: #F6F9FC;
  --c-paper-2: #ECF1F8;
  --c-paper-3: #DDE5F0;
  --c-gold: #C9A227;
  --c-orange: #E66A2C;
  --c-success: #1E7E47;

  /* ===== Semantic LIGHT default ===== */
  --bg: #FBFCFE;
  --bg-elev-1: #FFFFFF;
  --bg-elev-2: var(--c-paper);
  --bg-glass: rgba(255,255,255,.78);
  --bg-overlay: rgba(11,37,69,.04);
  --fg: var(--c-navy-deep);
  --fg-muted: #4A5872;
  --fg-dim: #7C8AA5;
  --accent: var(--c-cyan-deep);
  --accent-2: var(--c-cyan);
  --border: rgba(11,37,69,.10);
  --border-strong: rgba(11,37,69,.18);
  --ring: 0 0 0 3px rgba(27,156,232,.32);
  --shadow-1: 0 1px 2px rgba(11,37,69,.06), 0 8px 24px rgba(11,37,69,.08);
  --shadow-2: 0 16px 56px rgba(11,37,69,.14), 0 4px 12px rgba(11,37,69,.06);
  --shadow-glow: 0 0 0 1px rgba(27,156,232,.28), 0 16px 56px rgba(27,156,232,.18);
  --nav-bg: rgba(255,255,255,.85);
  --nav-fg: var(--c-navy-deep);

  /* ===== Type ===== */
  --font-display: 'Space Grotesk','Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --font-body: 'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --fs-12: .75rem; --fs-14: .875rem; --fs-16: 1rem; --fs-18: 1.125rem;
  --fs-20: 1.25rem; --fs-24: 1.5rem; --fs-32: 2rem; --fs-40: 2.5rem;
  --fs-56: clamp(2.2rem, 5vw, 3.75rem);
  --fs-72: clamp(2.6rem, 7vw, 5rem);
  --fs-hero: clamp(2.6rem, 8.2vw, 7rem);
  --lh-tight: 1.04; --lh-snug: 1.18; --lh-base: 1.6;
  --ls-tight: -.035em; --ls-snug: -.012em; --ls-wide: .12em;

  /* ===== Spacing (más generoso) ===== */
  --sp-1: .25rem; --sp-2: .5rem; --sp-3: .85rem; --sp-4: 1.1rem;
  --sp-5: 1.6rem; --sp-6: 2.4rem; --sp-7: 3.6rem; --sp-8: 5rem;
  --sp-9: 7rem; --sp-10: 9rem;
  --section-pad: clamp(5rem, 10vw, 9rem);

  /* ===== Layout ===== */
  --container: 1240px;
  --container-wide: 1440px;
  --radius-sm: 10px; --radius: 16px; --radius-lg: 24px; --radius-xl: 32px; --radius-pill: 999px;

  /* ===== Motion ===== */
  --ease-out: cubic-bezier(.22,1,.36,1);
  --ease-in-out: cubic-bezier(.65,0,.35,1);
  --ease-spring: cubic-bezier(.34,1.56,.64,1);
  --dur-1: 180ms; --dur-2: 320ms; --dur-3: 600ms; --dur-4: 1100ms;

  --z-nav: 50; --z-cursor: 100; --z-modal: 200; --z-intro: 1000;
}

/* ===== Dark theme override ===== */
:root[data-theme="dark"]{
  --bg: var(--c-ink);
  --bg-elev-1: var(--c-ink-2);
  --bg-elev-2: #0F1A30;
  --bg-glass: rgba(11,37,69,.55);
  --bg-overlay: rgba(255,255,255,.02);
  --fg: #E8EEF7;
  --fg-muted: #95A3B8;
  --fg-dim: #5E6E86;
  --accent: var(--c-cyan);
  --accent-2: var(--c-cyan-bright);
  --border: rgba(255,255,255,.08);
  --border-strong: rgba(255,255,255,.14);
  --shadow-1: 0 1px 2px rgba(0,0,0,.4), 0 8px 24px rgba(0,0,0,.35);
  --shadow-2: 0 16px 56px rgba(0,0,0,.55), 0 4px 12px rgba(0,0,0,.4);
  --shadow-glow: 0 0 0 1px rgba(27,156,232,.35), 0 12px 48px rgba(27,156,232,.18);
  --nav-bg: rgba(5,11,24,.78);
  --nav-fg: #E8EEF7;
}

@media (prefers-reduced-motion: reduce){
  :root{ --dur-1: 0ms; --dur-2: 0ms; --dur-3: 0ms; --dur-4: 0ms; }
}