/* ===================================================================
   MARKETING HUB — theme system
   Six palettes, switchable live. Volt is the default.
   Tuned for growth / performance / social agency energy.
   =================================================================== */

/* ---------- VOLT — electric lime on near-black. Growth-marketing default. ---------- */
:root,
[data-theme="volt"]{
  --bg:#08090b;
  --bg-2:#0e1014;
  --surface:rgba(255,255,255,.04);
  --surface-2:rgba(255,255,255,.07);
  --line:rgba(196,248,42,.22);
  --line-2:rgba(255,255,255,.11);
  --ink:#f2f4f7;
  --ink-2:#9ba3af;
  --ink-3:#6b7280;
  --accent:#c4f82a;
  --accent-2:#7c5cff;
  --accent-3:#ff4d6d;
  --accent-ink:#08090b;
  --grad:linear-gradient(135deg,#c4f82a,#a3e635);
  --grad-text:linear-gradient(100deg,#e8ff8a,#c4f82a 42%,#9ee520);
  --glow-1:rgba(196,248,42,.16);
  --glow-2:rgba(124,92,255,.22);
  --glow-3:rgba(255,77,109,.12);
  --radius:10px;
  --radius-lg:16px;
  --font-display:'Archivo',system-ui,sans-serif;
  --font-body:'Inter',system-ui,sans-serif;
  --display-weight:800;
  --display-tracking:-.042em;
  --display-transform:none;
  --eyebrow-tracking:.14em;
  --shadow:0 30px 70px -22px rgba(196,248,42,.22);
}

/* ---------- STUDIO — light editorial agency, electric blue ---------- */
[data-theme="studio"]{
  --bg:#f4f4f1;
  --bg-2:#eaeae4;
  --surface:rgba(17,17,20,.032);
  --surface-2:rgba(17,17,20,.062);
  --line:rgba(29,78,216,.28);
  --line-2:rgba(17,17,20,.14);
  --ink:#111114;
  --ink-2:#55555e;
  --ink-3:#76767f;
  --accent:#1d4ed8;
  --accent-2:#111114;
  --accent-3:#f97316;
  --accent-ink:#ffffff;
  --grad:linear-gradient(135deg,#1d4ed8,#3b82f6);
  --grad-text:linear-gradient(100deg,#1d4ed8,#3b82f6 55%,#f97316);
  --glow-1:rgba(29,78,216,.10);
  --glow-2:rgba(249,115,22,.08);
  --glow-3:rgba(29,78,216,.06);
  --radius:6px;
  --radius-lg:12px;
  --font-display:'Archivo',system-ui,sans-serif;
  --font-body:'Inter',system-ui,sans-serif;
  --display-weight:800;
  --display-tracking:-.04em;
  --display-transform:none;
  --eyebrow-tracking:.15em;
  --shadow:0 20px 50px -20px rgba(17,17,20,.28);
}

/* ---------- FLARE — coral heat on deep plum. Social-media energy. ---------- */
[data-theme="flare"]{
  --bg:#120711;
  --bg-2:#1b0a18;
  --surface:rgba(255,255,255,.05);
  --surface-2:rgba(255,255,255,.085);
  --line:rgba(255,90,95,.26);
  --line-2:rgba(255,241,242,.13);
  --ink:#fff1f2;
  --ink-2:#c9a9bc;
  --ink-3:#9a7f90;
  --accent:#ff5a5f;
  --accent-2:#ff9f1c;
  --accent-3:#c084fc;
  --accent-ink:#ffffff;
  --grad:linear-gradient(135deg,#ff5a5f,#ff9f1c);
  --grad-text:linear-gradient(100deg,#ff9f1c,#ff5a5f 48%,#c084fc);
  --glow-1:rgba(255,90,95,.24);
  --glow-2:rgba(255,159,28,.20);
  --glow-3:rgba(192,132,252,.20);
  --radius:14px;
  --radius-lg:22px;
  --font-display:'Space Grotesk',system-ui,sans-serif;
  --font-body:'Inter',system-ui,sans-serif;
  --display-weight:700;
  --display-tracking:-.038em;
  --display-transform:none;
  --eyebrow-tracking:.13em;
  --shadow:0 30px 80px -24px rgba(255,90,95,.30);
}

/* ---------- MIDNIGHT SPECTRUM — violet / magenta / amber ---------- */
[data-theme="midnight"]{
  --bg:#07070c;
  --bg-2:#0d0c16;
  --surface:rgba(255,255,255,.055);
  --surface-2:rgba(255,255,255,.09);
  --line:rgba(168,85,247,.22);
  --line-2:rgba(255,255,255,.11);
  --ink:#f4f2ff;
  --ink-2:#a9a2c4;
  --ink-3:#7d7799;
  --accent:#a855f7;
  --accent-2:#ec4899;
  --accent-3:#f59e0b;
  --accent-ink:#ffffff;
  --grad:linear-gradient(135deg,#a855f7,#ec4899);
  --grad-text:linear-gradient(100deg,#c4b5fd,#f0abfc 45%,#fcd34d);
  --glow-1:rgba(124,58,237,.32);
  --glow-2:rgba(225,29,132,.24);
  --glow-3:rgba(245,158,11,.16);
  --radius:14px;
  --radius-lg:20px;
  --font-display:'Inter',system-ui,sans-serif;
  --font-body:'Inter',system-ui,sans-serif;
  --display-weight:800;
  --display-tracking:-.042em;
  --display-transform:none;
  --eyebrow-tracking:.14em;
  --shadow:0 30px 80px -24px rgba(124,58,237,.35);
}

/* ---------- SIGNAL — paper, ink, hot orange. Swiss editorial. ---------- */
[data-theme="signal"]{
  --bg:#f7f4ee;
  --bg-2:#efeade;
  --surface:rgba(14,13,11,.03);
  --surface-2:rgba(14,13,11,.06);
  --line:rgba(14,13,11,.9);
  --line-2:rgba(14,13,11,.16);
  --ink:#0e0d0b;
  --ink-2:#4a463f;
  --ink-3:#6b665c;
  --accent:#ff3d00;
  --accent-2:#0e0d0b;
  --accent-3:#ff8a3d;
  --accent-ink:#ffffff;
  --grad:linear-gradient(135deg,#ff3d00,#ff8a3d);
  --grad-text:linear-gradient(100deg,#ff3d00,#ff8a3d);
  --glow-1:rgba(255,61,0,.10);
  --glow-2:rgba(14,13,11,.05);
  --glow-3:rgba(255,138,61,.10);
  --radius:2px;
  --radius-lg:2px;
  --font-display:'Archivo',system-ui,sans-serif;
  --font-body:'Inter',system-ui,sans-serif;
  --display-weight:900;
  --display-tracking:-.05em;
  --display-transform:uppercase;
  --eyebrow-tracking:.18em;
  --shadow:6px 6px 0 rgba(14,13,11,1);
}

/* ---------- GULF GOLD — black, gold, emerald. Luxury / corporate. ---------- */
[data-theme="gold"]{
  --bg:#0a0a0a;
  --bg-2:#101010;
  --surface:rgba(255,255,255,.035);
  --surface-2:rgba(255,255,255,.06);
  --line:rgba(212,160,23,.18);
  --line-2:rgba(245,241,232,.12);
  --ink:#f5f1e8;
  --ink-2:#a8a091;
  --ink-3:#7d7667;
  --accent:#d4a017;
  --accent-2:#107a5e;
  --accent-3:#e8c15a;
  --accent-ink:#0a0a0a;
  --grad:linear-gradient(135deg,#d4a017,#e8c15a);
  --grad-text:linear-gradient(100deg,#e8c15a,#d4a017 60%,#107a5e);
  --glow-1:rgba(212,160,23,.16);
  --glow-2:rgba(16,122,94,.20);
  --glow-3:rgba(212,160,23,.10);
  --radius:4px;
  --radius-lg:8px;
  --font-display:'Instrument Serif',Georgia,serif;
  --font-body:'Inter',system-ui,sans-serif;
  --display-weight:400;
  --display-tracking:-.02em;
  --display-transform:none;
  --eyebrow-tracking:.24em;
  --shadow:0 24px 60px -20px rgba(0,0,0,.7);
}