/* ==========================================================================
   Design Tokens
   --------------------------------------------------------------------------
   Central source of truth for color, spacing, and effect values used across
   the site. Reference these with var(--token-name) instead of hardcoding
   values, so the theme stays consistent and easy to update in one place.

   Palette: a warm gold pair as the single accent, set against near-black
   blue and slate blue grounds, with white doing the highlight/glass work.
   ========================================================================== */
:root{

    /* Brand accent — gold pair. Spend this deliberately: CTAs, active
       states, borders on glass, small highlights. Not a background color. */
    --gold:#D0A060;
    --gold-soft:#C09060;
    --gold-light:#E4C48F;

    /* Dark grounds */
    --ink:#0F172A;
    --ink-soft:#16213A;
    --slate:#2E4057;
    --slate-soft:#3B5170;

    /* Light grounds — warm off-white, not stark white, so glass reads
       against it */
    --cream:#FAF7F2;
    --cream-deep:#F3EDE3;
    --surface:#FFFFFF;

    /* Text */
    --text:#111827;
    --text-light:#374151;
    --muted:#6B7280;
    --text-on-dark:#F5F1EA;
    --text-on-dark-muted:#C7CDDB;

    /* Legacy aliases kept for any selector still referencing the old
       blue/green palette during the transition — new work should use the
       tokens above directly. */
    --primary:var(--gold);
    --primary-dark:var(--gold-soft);
    --accent:var(--gold);
    --background:var(--cream);

    --border:#E5DFD3;
    --border-on-dark:rgba(245,241,234,.14);

    /* Glass surfaces */
    --glass-bg:rgba(255,255,255,.55);
    --glass-bg-dark:rgba(255,255,255,.06);
    --glass-border:rgba(255,255,255,.55);
    --glass-border-dark:rgba(255,255,255,.16);
    --glass-border-gold:rgba(208,160,96,.45);
    --glass-blur:14px;

    /* Effects */
    --shadow:0 10px 30px rgba(15,23,42,.06);
    --shadow-lg:0 24px 60px rgba(15,23,42,.16);
    --shadow-gold:0 12px 32px rgba(192,144,96,.28);
    --radius-sm:8px;
    --radius-md:14px;
    --radius-lg:22px;
    --transition:.2s ease;

    /* Type */
    --font-display:'Fraunces',Georgia,'Times New Roman',serif;
    --font-body:'Inter','Segoe UI',Arial,sans-serif;

    /* Layout */
    --container:1120px;

}