/* ═══════════════════════════════════════════════════════════════════
   CRAIG SWANGER — PERSONAL EXECUTIVE BRAND
   Design tokens. Distinct from Revolver Capital.
   Aesthetic: US East Coast partner-firm — Lazard / Apollo / Brunswick.
   Restrained ink, oxblood accent, bone paper, classical proportions.
   ═══════════════════════════════════════════════════════════════════ */

/* Fonts */
@import url('https://fonts.googleapis.com/css2?family=Source+Serif+4:opsz,wght@8..60,300;8..60,400;8..60,500;8..60,600;8..60,700&family=Inter+Tight:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  /* ─── Color ─── */
  /* Ink — near-black with cool undertone, dominant text */
  --cs-ink:        #14181F;
  --cs-ink-90:     #1E232C;
  --cs-ink-80:     #2A2F39;
  --cs-ink-60:     #4F5560;
  --cs-ink-40:     #8A8E97;
  --cs-ink-20:     #C9CBD0;
  --cs-ink-10:     #E4E5E8;
  --cs-ink-5:      #F1F2F4;

  /* Paper — warm bone, never flat white */
  --cs-paper:      #FBFAF6;
  --cs-stone:      #EDE8DD;   /* section alternation, cards */
  --cs-bone:       #F5F1E8;   /* mid-tone surface */

  /* Accent — Oxblood — sparing, used for rules + key numbers + one button per section */
  --cs-oxblood:    #6B1F2D;
  --cs-oxblood-90: #5A1825;
  --cs-oxblood-70: #8A3340;

  /* Highlight — restrained brass for inline emphasis */
  --cs-brass:      #B98A3E;
  --cs-brass-soft: #D6B473;

  /* Dark surfaces — for hero, case studies, testimonials */
  --cs-night:      #0C0F14;
  --cs-night-80:   #14181F;

  /* Foreground roles */
  --cs-fg1: var(--cs-ink);
  --cs-fg2: var(--cs-ink-80);
  --cs-fg3: var(--cs-ink-60);
  --cs-fg4: var(--cs-ink-40);
  --cs-fg-on-dark: var(--cs-paper);
  --cs-fg-muted-on-dark: rgba(251, 250, 246, 0.62);
  --cs-fg-faint-on-dark: rgba(251, 250, 246, 0.38);

  /* Background roles */
  --cs-bg1: var(--cs-paper);
  --cs-bg2: var(--cs-stone);
  --cs-bg3: var(--cs-bone);
  --cs-bg-dark: var(--cs-night);

  /* Rules */
  --cs-rule:        1px solid var(--cs-ink-20);
  --cs-rule-soft:   1px solid var(--cs-ink-10);
  --cs-rule-on-dark:1px solid rgba(251, 250, 246, 0.14);

  /* ─── Type ─── */
  --cs-serif:  'Source Serif 4', 'Source Serif Pro', Georgia, 'Times New Roman', serif;
  --cs-sans:   'Inter Tight', ui-sans-serif, -apple-system, system-ui, Helvetica, Arial, sans-serif;
  --cs-mono:   'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  /* Scale */
  --cs-fs-mega:    clamp(72px, 9.5vw, 140px);  /* hero name */
  --cs-fs-display: clamp(48px, 5.5vw, 84px);   /* section super-headlines */
  --cs-fs-h1:      clamp(36px, 4vw, 56px);
  --cs-fs-h2:      clamp(28px, 3vw, 42px);
  --cs-fs-h3:      clamp(20px, 1.6vw, 24px);
  --cs-fs-h4:      18px;
  --cs-fs-body:    16px;
  --cs-fs-body-lg: 17px;
  --cs-fs-small:   14px;
  --cs-fs-micro:   12px;
  --cs-fs-eyebrow: 11px;

  /* Rhythm */
  --cs-lh-tight:   1.02;
  --cs-lh-snug:    1.15;
  --cs-lh-normal:  1.5;
  --cs-lh-relaxed: 1.7;

  --cs-tr-tight: -0.02em;
  --cs-tr-snug:  -0.01em;
  --cs-tr-caps:   0.16em;
  --cs-tr-wide:   0.08em;

  /* Spacing — 8pt base, generous at large end */
  --cs-s-1: 4px;
  --cs-s-2: 8px;
  --cs-s-3: 12px;
  --cs-s-4: 16px;
  --cs-s-5: 24px;
  --cs-s-6: 32px;
  --cs-s-7: 48px;
  --cs-s-8: 64px;
  --cs-s-9: 96px;
  --cs-s-10: 128px;
  --cs-s-11: 160px;

  /* Radii — extremely restrained; brand is precise */
  --cs-r-xs: 0;
  --cs-r-sm: 2px;
  --cs-r-md: 4px;

  /* Shadows */
  --cs-shadow-sm: 0 1px 2px rgba(20, 24, 31, 0.06), 0 4px 12px rgba(20, 24, 31, 0.04);
  --cs-shadow-md: 0 8px 24px rgba(20, 24, 31, 0.10);
  --cs-shadow-lg: 0 24px 60px -16px rgba(20, 24, 31, 0.22);

  /* Layout */
  --cs-container:      1200px;
  --cs-container-wide: 1360px;
  --cs-measure:        62ch;

  /* Motion */
  --cs-ease: cubic-bezier(0.2, 0.6, 0.2, 1);
  --cs-dur-fast: 160ms;
  --cs-dur-med:  280ms;
  --cs-dur-slow: 480ms;
}

/* ─── Reset + base ─── */
*, *::before, *::after { box-sizing: border-box; }
.cs-root {
  font-family: var(--cs-sans);
  color: var(--cs-fg2);
  background: var(--cs-bg1);
  font-size: var(--cs-fs-body);
  line-height: var(--cs-lh-normal);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-feature-settings: 'ss01', 'cv11';
}

/* ─── Type primitives ─── */
.cs-eyebrow {
  font-family: var(--cs-sans);
  font-size: var(--cs-fs-eyebrow);
  font-weight: 600;
  letter-spacing: var(--cs-tr-caps);
  text-transform: uppercase;
  color: var(--cs-fg3);
}
.cs-eyebrow--gold { color: var(--cs-brass); }
.cs-eyebrow--ox   { color: var(--cs-oxblood); }
.cs-eyebrow--dark { color: var(--cs-brass-soft); }

.cs-h1   { font-family: var(--cs-serif); font-weight: 400; font-size: var(--cs-fs-h1); line-height: var(--cs-lh-snug); letter-spacing: var(--cs-tr-snug); color: var(--cs-fg1); }
.cs-h2   { font-family: var(--cs-serif); font-weight: 400; font-size: var(--cs-fs-h2); line-height: var(--cs-lh-snug); letter-spacing: var(--cs-tr-snug); color: var(--cs-fg1); }
.cs-h3   { font-family: var(--cs-serif); font-weight: 500; font-size: var(--cs-fs-h3); line-height: 1.25; color: var(--cs-fg1); }
.cs-disp { font-family: var(--cs-serif); font-weight: 400; font-size: var(--cs-fs-display); line-height: var(--cs-lh-tight); letter-spacing: -0.018em; color: var(--cs-fg1); text-wrap: balance; }
.cs-mega { font-family: var(--cs-serif); font-weight: 400; font-size: var(--cs-fs-mega); line-height: 0.95; letter-spacing: -0.025em; color: var(--cs-fg1); text-wrap: balance; }

.cs-body { font-family: var(--cs-sans); font-size: var(--cs-fs-body); line-height: var(--cs-lh-relaxed); color: var(--cs-fg2); font-weight: 400; }
.cs-body-lg { font-family: var(--cs-sans); font-size: var(--cs-fs-body-lg); line-height: var(--cs-lh-relaxed); color: var(--cs-fg2); font-weight: 400; }
.cs-small { font-family: var(--cs-sans); font-size: var(--cs-fs-small); line-height: var(--cs-lh-normal); color: var(--cs-fg3); }
.cs-mono  { font-family: var(--cs-mono); font-feature-settings: 'tnum'; }

/* Selection */
.cs-root ::selection { background: var(--cs-oxblood); color: var(--cs-paper); }