:root {
  /* Surfaces */
  --bg:           #06090C;
  --surface:      #0B1218;
  --surface-2:    #131C24;
  --border:       rgba(255, 255, 255, 0.08);
  --border-strong:rgba(255, 255, 255, 0.16);
  --overlay:      rgba(6, 9, 12, 0.72);
  --overlay-soft: rgba(6, 9, 12, 0.36);

  /* Type */
  --text:         #F4F6F8;
  --text-body:    #C4D0DA;
  --text-mute:    #6E7E8C;
  --text-faint:   #2E3A45;

  /* Action — chrome white, never yellow */
  --action:       #F4F6F8;
  --action-ink:   #06090C;
  --action-glow:  rgba(255, 255, 255, 0.20);

  /* Single deep accent — submerge teal, used 3 places max */
  --accent:       #2E6F8E;
  --accent-glow:  rgba(46, 111, 142, 0.25);

  /* States */
  --success:      #67D6A1;
  --error:        #F47266;

  /* Type families — self-hosted woff2 */
  --ff-sans: "Inter", system-ui, -apple-system, "Helvetica Neue", sans-serif;
  --ff-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* Type scale (clamp) */
  --fs-eyebrow:   10px;
  --fs-body:      clamp(15px, 1.05vw, 17px);
  --fs-lead:      clamp(18px, 1.4vw, 22px);
  --fs-h3:        clamp(22px, 2.2vw, 30px);
  --fs-h2:        clamp(34px, 4.5vw, 56px);
  --fs-h1:        clamp(44px, 7vw, 88px);
  --fs-display:   clamp(56px, 10vw, 140px);

  /* Spacing — 8pt grid */
  --s-1:   8px;
  --s-2:  16px;
  --s-3:  24px;
  --s-4:  32px;
  --s-5:  48px;
  --s-6:  64px;
  --s-7:  96px;
  --s-8: 128px;
  --s-9: 192px;

  /* Radii — quiet, luxury not SaaS */
  --r-sm:  4px;
  --r-md:  8px;
  --r-lg: 12px;
  --r-pill: 9999px;

  /* Shadows — almost none */
  --shadow-cta: 0 8px 32px var(--action-glow);
  --shadow-lift: 0 24px 64px rgba(0, 0, 0, 0.4);

  /* Layout */
  --max-w: 1280px;
  --gutter: clamp(16px, 4vw, 48px);
  --nav-h: 72px;
  --promo-h: 36px;

  /* Motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 180ms;
  --dur-base: 320ms;
  --dur-slow: 600ms;
}