/* GEO — design tokens
   Palette follows the gold-on-dark logo. Dark is the brand default;
   "paper" sections are used for long reading. */

:root {
  /* Brand colours */
  --base: #0F0F0E;
  --surface: #1A1917;
  --line-dark: #2C2A26;

  --gold: #C9A961;        /* headings, rules, links on dark   8.5:1 on base */
  --gold-deep: #9A7B3C;   /* rules and large text on paper    3.5:1 on paper */
  --gold-muted: #6E5A33;

  --paper: #F3EFE6;       /* light surface; body text on dark 16:1 */
  --ink: #1C1B19;         /* body on paper                    15:1 */
  --ink-2: #55534E;       /* secondary on paper               6.7:1 */
  --line-light: #D9D4C8;

  --signal: #2E5C4F;      /* links and focus on paper         6.7:1 */
  --error: #A3372E;

  /* Semantic, dark default */
  --bg: var(--base);
  --bg-2: var(--surface);
  --fg: var(--paper);
  --fg-2: #B9B3A6;        /* secondary on dark                9.3:1 */
  --line: var(--line-dark);
  --accent: var(--gold);
  --accent-soft: var(--gold-muted);
  --link: var(--gold);
  --focus: var(--gold);

  /* Type */
  --font-display: "Cormorant Garamond", "Times New Roman", Georgia, serif;
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --step--1: 0.875rem;
  --step-0: 1rem;
  --step-1: 1.1875rem;
  --step-2: clamp(1.5rem, 1.2rem + 1.5vw, 2.125rem);
  --step-3: clamp(2rem, 1.4rem + 3vw, 3.25rem);
  --step-4: clamp(2.5rem, 1.5rem + 5.5vw, 5.5rem);

  --leading-tight: 1.05;
  --leading-snug: 1.25;
  --leading-body: 1.6;

  --tracking-caps: 0.14em;

  /* Space */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2rem;
  --space-6: 3rem;
  --space-7: 4rem;
  --space-section: 3.5rem;    /* 56px mobile, 80px desktop (see media query) */

  /* Layout */
  --container: 80rem;         /* 1280px */
  --gutter: 1rem;             /* 16px at 360 */
  --header-h: 4.5rem;

  --radius: 2px;
  --ease: cubic-bezier(0.2, 0.6, 0.2, 1);
  --ease-wipe: cubic-bezier(0.77, 0, 0.18, 1);
  --dur: 200ms;
  --dur-reveal: 400ms;
  --straddle: 2.5rem;         /* how far a lead image / card row overlaps the previous section */
}

@media (min-width: 48em) {
  :root {
    --space-section: 5rem;
    --straddle: 4rem;
    --gutter: 2rem;
    --step-0: 1.0625rem;
    --header-h: 5rem;
  }
}

/* Paper (light) surfaces: whole page or a single section */
:root[data-theme="light"],
.theme-paper {
  --bg: var(--paper);
  --bg-2: #EAE5DA;
  --fg: var(--ink);
  --fg-2: var(--ink-2);
  --line: var(--line-light);
  --accent: var(--gold-deep);
  --accent-soft: #C9B686;
  --link: var(--signal);
  --focus: var(--signal);
}

/* Dark surfaces, explicit (for nested use inside a light page) */
:root[data-theme="dark"],
.theme-base {
  --bg: var(--base);
  --bg-2: var(--surface);
  --fg: var(--paper);
  --fg-2: #B9B3A6;
  --line: var(--line-dark);
  --accent: var(--gold);
  --accent-soft: var(--gold-muted);
  --link: var(--gold);
  --focus: var(--gold);
}

/* Spacing scale (transitions & rhythm pass): two steps per breakpoint */
:root { --space-section: 6rem; --space-section-lg: 8rem; --band: 8rem; --stack: 3rem; }
@media (max-width: 47.98em) { :root { --space-section: 3.5rem; --space-section-lg: 4.5rem; --band: 4.5rem; --stack: 2rem; } }