/* ---------------------------------------------------------------
   Design tokens — Cresyn brand scale (matches cresyn.ai / Partners deck)
   Fluid type via clamp() since this is a real scrolling page, not a
   fixed-canvas camera deck.
--------------------------------------------------------------- */
:root {
  /* brand palette */
  --navy-900: #080f18;
  --navy-800: #0d1b2a;
  --navy-700: #1b263b;
  --navy-600: #334963;
  --slate-500: #415a77;
  --steel-400: #778da9;
  --mist-300: #9aa4b2;
  --mist-100: #e0e1dd;
  --white: #ffffff;
  --gold: #c9a96e;
  --gold-soft: #ddc496;

  /* semantic */
  --bg: var(--navy-900);
  --bg-raised: #0b1420;
  --surface: rgba(224, 225, 221, 0.045);
  --surface-strong: rgba(224, 225, 221, 0.08);
  --border: rgba(224, 225, 221, 0.1);
  --border-strong: rgba(224, 225, 221, 0.2);

  --text: var(--mist-100);
  --text-dim: rgba(224, 225, 221, 0.68);
  --text-faint: rgba(224, 225, 221, 0.42);

  --glow-gold: 0 0 70px hsla(38, 55%, 62%, 0.28);
  --shadow-card: 0 24px 70px rgba(0, 0, 0, 0.45);

  /* type */
  --font-sans: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --font-mono: 'Geist Mono', ui-monospace, Menlo, monospace;

  --fs-eyebrow: clamp(11px, 0.85vw, 13px);
  --fs-body: clamp(15px, 1.05vw, 18px);
  --fs-lead: clamp(18px, 1.5vw, 24px);
  --fs-h4: clamp(17px, 1.5vw, 21px);
  --fs-h3: clamp(22px, 2.1vw, 30px);
  --fs-h2: clamp(32px, 4.4vw, 58px);
  --fs-h1: clamp(44px, 7.4vw, 104px);
  --fs-stat: clamp(38px, 4.6vw, 64px);

  /* spacing */
  --space-3xs: 4px;
  --space-2xs: 8px;
  --space-xs: 14px;
  --space-sm: 22px;
  --space-md: 36px;
  --space-lg: 56px;
  --space-xl: 88px;
  --space-2xl: 128px;

  --radius-sm: 10px;
  --radius-md: 18px;
  --radius-lg: 28px;

  /* motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-soft: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-back: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast: 0.35s;
  --dur-med: 0.7s;
  --dur-slow: 1.1s;

  /* layout */
  --container-w: 1240px;
  --gutter: clamp(24px, 5vw, 96px);
  --navrail-w: 208px;

  /* z-index */
  --z-bg: 1;
  --z-content: 2;
  --z-chrome: 100;
  --z-overlay: 200;

  color-scheme: dark;
}

@media (max-width: 860px) {
  :root {
    --navrail-w: 0px;
  }
}