:root {
  /* ─── Palette ─────────────────────────────────────── */
  --navy:          #0C2340;
  --navy-light:    #142d4d;
  --navy-dark:     #071828;
  --orange:        #E87722;
  --orange-deep:   #C5601A;
  --orange-soft:   rgba(232,119,34,0.12);
  --cream:         #FBFBFC;
  --cream-dark:    #EFF1F4;
  --white:         #FFFFFF;
  --ink:           #1A1208;
  --ink-mid:       #5C5045;
  --ink-light:     #8A7F74;
  --ice:           #EAF2FA;
  --peach:         #FCEADE;
  --green:         #22c55e;
  --amber:         #F59E0B;
  --red:           #EF4444;

  /* ─── Semantic ───────────────────────────────────── */
  --bg:            var(--cream);
  --bg-dark:       var(--navy);
  --text:          var(--ink);
  --text-mid:      var(--ink-mid);
  --text-light:    var(--ink-light);
  --accent:        var(--orange);
  --accent-deep:   var(--orange-deep);

  /* ─── Lines ──────────────────────────────────────── */
  --line:          rgba(12,35,64,0.10);
  --line-warm:     rgba(26,18,8,0.08);
  --line-light:    rgba(255,255,255,0.10);
  --line-orange:   rgba(232,119,34,0.25);

  /* ─── Typography ─────────────────────────────────── */
  --font-display:  'Playfair Display', Georgia, serif;
  --font-body:     'Inter', system-ui, sans-serif;
  --font-mono:     'DM Mono', 'Courier New', monospace;

  /* ─── Spacing ────────────────────────────────────── */
  --s-1:   0.25rem;
  --s-2:   0.5rem;
  --s-3:   0.75rem;
  --s-4:   1rem;
  --s-6:   1.5rem;
  --s-8:   2rem;
  --s-10:  2.5rem;
  --s-12:  3rem;
  --s-16:  4rem;
  --s-20:  5rem;
  --s-24:  6rem;
  --s-32:  8rem;

  /* ─── Layout ─────────────────────────────────────── */
  --container:      1100px;
  --container-wide: 1320px;
  --gutter:         clamp(1.25rem, 4vw, 2.5rem);

  /* ─── Radii ──────────────────────────────────────── */
  --r-sm:   6px;
  --r-md:   14px;
  --r-lg:   22px;
  --r-xl:   36px;
  --r-full: 999px;

  /* ─── Shadows ────────────────────────────────────── */
  --shadow-xs: 0 1px 4px rgba(12,35,64,0.06);
  --shadow-sm: 0 3px 12px rgba(12,35,64,0.09);
  --shadow-md: 0 8px 30px rgba(12,35,64,0.13);
  --shadow-lg: 0 20px 60px rgba(12,35,64,0.18);
  --shadow-xl: 0 32px 80px rgba(12,35,64,0.24);
  --shadow-orange: 0 8px 32px rgba(232,119,34,0.28);

  /* ─── Easing ─────────────────────────────────────── */
  --ease-out:    cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-in:     cubic-bezier(0.55, 0, 1, 0.45);

  /* ─── Duration ───────────────────────────────────── */
  --t-fast:   150ms;
  --t-base:   250ms;
  --t-slow:   400ms;
  --t-slower: 600ms;

  /* ─── Z-index ────────────────────────────────────── */
  --z-bg:      -1;
  --z-base:     1;
  --z-above:   10;
  --z-nav:    100;
  --z-overlay: 200;
  --z-modal:   300;
}