/* ==============================
   DESIGN TOKENS
   Minimal, restrained palette: white/off-white surfaces, one muted
   accent, no purple/teal/black. Values verified against WCAG AA
   (see assets/css/style.css usage) — do not swap in unverified hexes.
   ============================== */
:root {
    /* Surfaces — white + one subtle off-white for section banding.
       No inverse/dark surface: navbar, footer, hero, and CTA blocks
       all stay on light surfaces. */
    --surface:       #ffffff;
    --surface-alt:   #f7f5f2;
    --surface-card:  #ffffff;

    /* Text — soft charcoal, not true black; muted tier kept dark
       enough to clear 4.5:1 on both surfaces. */
    --text-primary:   #33333a;
    --text-secondary: #5b5b64;
    --text-on-accent: #ffffff;

    --border: #e7e5e1;

    /* Inverse surface — used sparingly for contrast/punctuation (footer,
       occasional dark section), not as the site's default mode. */
    --surface-inverse:      #17171b;
    --surface-inverse-alt:  #222226;
    --text-inverse:         #f5f4f2;
    --text-inverse-muted:   rgba(245,244,242,0.62);
    --border-inverse:       rgba(245,244,242,0.14);
    /* Lighter accent tint — the base --accent fails AA on dark surfaces */
    --accent-on-inverse:    #e08277;

    /* Single accent — a muted, desaturated descendant of the old
       brand red. Used for CTAs, links, active states, small accents.
       No secondary hue, no per-business-unit colors. */
    --accent:        #b5564e;
    --accent-hover:  #9c4b42;
    --accent-subtle: #f5e9e7;

    /* Status colors — incidental (form feedback), not brand colors */
    --success-bg: #d1fae5;
    --success-text: #065f46;
    --success-border: #a7f3d0;
    --error-bg: #fee2e2;
    --error-text: #991b1b;
    --error-border: #fecaca;

    /* Typography — General Sans (free-licensed, close match to the
       grotesque ramp.com actually renders), loaded from Fontshare in
       includes/header.php.

       Note: a 'Lausanne' font file was supplied for this project but
       turned out to be an unrelated decorative/art-deco display face
       (no real lowercase) despite the shared name, so it was never
       wired up and has since been removed from the repo. If a correct
       Lausanne file is obtained later, self-host it and swap it in
       here. */
    --font-body: 'General Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    /* Editorial display serif — used sparingly for section headings on
       magazine-style layouts (About page). Not the site's default. */
    --font-display: 'Hedvig Letters Serif', Georgia, 'Times New Roman', serif;

    --text-xs:   11px;
    --text-sm:   13px;
    --text-base: 15px;
    --text-md:   16px;
    --text-lg:   20px;
    --text-xl:   26px;
    --text-2xl:  34px;
    --text-3xl:  40px;
    --text-4xl:  48px;
    --text-5xl:  60px;

    /* Spacing — 4px base scale */
    --space-1:  4px;
    --space-2:  8px;
    --space-3:  12px;
    --space-4:  16px;
    --space-5:  20px;
    --space-6:  24px;
    --space-8:  32px;
    --space-10: 40px;
    --space-12: 48px;
    --space-16: 64px;
    --space-20: 80px;
    --space-24: 96px;
    --space-32: 128px;

    /* Radius — soft, not sharp; not fully rounded */
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 16px;
    --radius-full: 999px;

    /* Shadow — used for hover elevation instead of color-inversion */
    --shadow-sm: 0 2px 8px rgba(51,51,58,0.06);
    --shadow-md: 0 8px 24px rgba(51,51,58,0.10);
    --shadow-lg: 0 24px 48px rgba(51,51,58,0.16);

    --transition: all 0.3s ease;

    /* Legacy aliases — kept only during migration so partially-updated
       files don't break; remove once nothing references them. */
    --primary:    var(--accent);
    --secondary:  var(--accent);
    --dark:       var(--text-primary);
    --white:      var(--surface);
    --light-bg:   var(--surface-alt);
    --text:       var(--text-primary);
    --text-muted: var(--text-secondary);
}