/* Wedsite Studios — canonical brand tokens.
   ONE source of truth for every surface: marketing site, consoles, intake form,
   brand guide. Email templates mirror these values inline (email can't import CSS).

   Import first, before any surface stylesheet:
     @import url("../brand/tokens.css");

   Two layers:
   1. PALETTE  — raw values. Never used directly in components.
   2. SEMANTIC — what a component actually reaches for. Dark is the default;
                 add [data-surface="light"] (or .surface-light) to flip a subtree.

   Site-era aliases (--navy, --cream, --mute, --rule…) are kept at the bottom so the
   marketing site keeps working unchanged. New work should use the semantic names. */

:root{
/* ── 1. palette ─────────────────────────────────────────── */
--p-navy:#0f172a;--p-navy-deep:#0a0f1c;--p-navy-raised:#14203a;--p-navy-card:#182542;--p-navy-card-2:#1c2c4e;
--p-cream:#faf7f2;--p-ivory:#ece3cf;--p-ivory-raised:#f8f1e0;--p-ivory-card:#f6efdd;--p-ivory-card-2:#ece1c9;
--p-ink:#1c2434;--p-ink-warm:#231e18;
--p-gold:#d8b65a;--p-gold-accent:#ecdcab;--p-gold-deep:#c79a2f;--p-gold-text:#a5761a;--p-gold-text-deep:#8f6512;
--p-green:#7bbf8f;--p-green-dark:#47905f;--p-rose:#d98a8a;--p-rose-dark:#c0605f;
--gold-metal:linear-gradient(95deg,#fff 0%,#fbf6ea 26%,#f4e3ab 52%,#e7c764 74%,#c79a2f 100%);
--gold-metal-dark:linear-gradient(95deg,#c79a2f 0%,#b8891f 50%,#9a6f14 100%);

/* ── 2. semantic — DARK (default) ───────────────────────── */
--bg:var(--p-navy);--bg-deep:var(--p-navy-deep);--bg-raised:var(--p-navy-raised);
--bg-card:var(--p-navy-card);--bg-card-2:var(--p-navy-card-2);--field-bg:rgba(255,255,255,.03);
--text:var(--p-cream);--muted:rgba(250,247,242,.62);--faint:rgba(250,247,242,.4);
--line:rgba(250,247,242,.13);--line-soft:rgba(250,247,242,.08);--line-strong:rgba(250,247,242,.22);
--gold:var(--p-gold);--gold-accent:var(--p-gold-accent);--gold-deep:var(--p-gold-deep);
--rule:rgba(216,182,90,.38);--rule-soft:rgba(250,247,242,.13);
--on-gold:var(--p-navy);--gold-wash:rgba(216,182,90,.09);
--green:var(--p-green);--rose:var(--p-rose);
--shadow-card:0 12px 30px rgba(0,0,0,.32);
--shadow-lift:0 3px 6px rgba(0,0,0,.18),0 40px 66px -30px rgba(0,0,0,.5);

/* ── 3. type ────────────────────────────────────────────── */
--display:"Playfair Display",Georgia,"Times New Roman",serif;
--edit:"Cormorant Garamond",Georgia,serif;
--ui:"Archivo",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
--mono:ui-monospace,SFMono-Regular,Menlo,monospace;
--t-label:11px;--t-label-track:.28em;
--t-micro:12px;--t-small:14px;--t-body:15px;--t-lede:17px;
--w-body:300;--w-ui:400;

/* ── 4. shape, space, motion ────────────────────────────── */
--r-sm:2px;--r-md:4px;--r-lg:8px;--r-pill:999px;
--gutter:clamp(24px,5vw,48px);--bay:clamp(76px,13vw,140px);
--ease:cubic-bezier(.2,.7,.2,1);--ease-out:cubic-bezier(.2,.8,.2,1)
}

/* ── semantic — LIGHT surface ───────────────────────────── */
[data-surface="light"],.surface-light{
--bg:var(--p-ivory);--bg-deep:#e5dbc4;--bg-raised:var(--p-ivory-raised);
--bg-card:var(--p-ivory-card);--bg-card-2:var(--p-ivory-card-2);--field-bg:#fbf6ea;
--text:var(--p-ink-warm);--muted:#5b5446;--faint:#837b6a;
--line:rgba(28,36,52,.14);--line-soft:rgba(28,36,52,.08);--line-strong:rgba(28,36,52,.22);
--gold:var(--p-gold-text);--gold-accent:var(--p-gold-text-deep);--gold-deep:var(--p-gold-text-deep);
--rule:rgba(165,118,26,.4);--rule-soft:rgba(28,36,52,.12);
--on-gold:#fff8ec;--gold-wash:rgba(165,118,26,.08);
--green:var(--p-green-dark);--rose:var(--p-rose-dark);
--shadow-card:0 10px 28px rgba(44,38,32,.08);
--shadow-lift:0 3px 6px rgba(28,36,52,.06),0 40px 66px -30px rgba(28,36,52,.38);
color-scheme:light
}
