/* ==========================================================================
   The BS Foundation — design tokens
   Colours: copied verbatim from claude.ai/design → "BS Foundation Brand
   Guidelines". Do not hand-tune them.
   Type, rules and shape: the Quarterly Zine redesign (October 2026), which
   replaced the guidelines' Cormorant / Instrument Sans pairing. Port these
   back to the design system before the next re-sync, or it will undo them.
   ========================================================================== */

/* --- Layer 1: Foundation. Never changes.
   Carries logo, nav, footer, donation/transparency, legal. --- */
:root {
  --bsf-forest: #1B3409;        /* sampled from the crest: rgb(27,52,9) */
  --bsf-forest-deep: #112205;   /* pressed / footer base */
  --bsf-forest-soft: #2E4A1C;   /* hover on forest surfaces */
  --bsf-cream: #F5EFE1;         /* page background — never pure white */
  --bsf-cream-deep: #ECE4D0;    /* alternate section / card on cream */
  --bsf-ink: #15170F;           /* body text */
  --bsf-sage: #8C9677;          /* decorative: rules, ornaments, borders on forest */
  --bsf-sage-light: #D8DCC8;    /* quiet fills, disabled */
  --bsf-stone: #6B665A;         /* secondary text (5.0:1 on cream) */
  --bsf-line: #D9D1BD;          /* hairlines on cream */

  /* Accent hooks — default to foundation values.
     Sponsored-maker palettes live in a separate site section. */
  --accent-primary: #1B3409;
  --accent-on-primary: #F5EFE1;
  --accent-secondary: #8C9677;
  --accent-tint: #ECE4D0;

  /* Semantic aliases */
  --surface-page: var(--bsf-cream);
  --surface-raised: var(--bsf-cream-deep);
  --surface-brand: var(--bsf-forest);
  --surface-feature: var(--accent-tint);
  --text-body: var(--bsf-ink);
  --text-muted: var(--bsf-stone);
  --text-brand: var(--bsf-forest);
  --text-on-brand: var(--bsf-cream);
  --border-hairline: var(--bsf-line);
  --focus-ring: var(--bsf-forest);
  --link: var(--bsf-forest);
  --link-hover: var(--accent-primary);

  /* Error — from Input.jsx */
  --bsf-error: #8A1C1C;

  /* --- Type ---
     Anybody is a variable grotesque with a width axis: expanded and black
     for mastheads, condensed for cover lines. Libre Franklin carries the
     reading. */
  --font-display: 'Anybody', 'Arial Narrow', 'Helvetica Neue', Arial, sans-serif;
  --font-sans: 'Libre Franklin', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, Menlo, Consolas, monospace;

  --type-body-l: 400 19px/1.55 var(--font-sans);
  --type-body: 400 17px/1.6 var(--font-sans);
  --type-small: 400 14px/1.5 var(--font-sans);

  /* --- Space, shape, rules, motion --- */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 24px;
  --space-6: 32px; --space-7: 48px; --space-8: 64px; --space-9: 96px; --space-10: 128px;
  --content-max: 1320px;
  --gutter: clamp(16px, 3.4vw, 48px);
  --rule-heavy: 4px solid currentColor;   /* the printed rule under a masthead */
  --rule: 2px solid currentColor;
  --cut: 2px dashed currentColor;         /* the coupon's cut line */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 140ms; --dur-base: 240ms;

  /* z-index scale */
  --z-nav: 50; --z-skip: 60;
}