/* =========================================================
   MAGAZINE THEME — VARIABLES
========================================================= */

:root{
  --mag-paper:#fffdf8;
  --mag-paper-soft:#f7f3ea;
  --mag-ink:#111111;
  --mag-muted:#68645e;
  --mag-rule:#d8d1c5;
  --mag-red:#d71920;
  --mag-red-dark:#9f1015;
  --mag-blue:#173e6b;
  --mag-gold:#b58a35;

  --bg:var(--mag-paper-soft);
  --surface:var(--mag-paper);
  --surface2:#f3eee4;
  --text:var(--mag-ink);
  --muted:var(--mag-muted);
  --accent:var(--mag-red);
  --accent2:var(--mag-blue);
  --link:var(--mag-red-dark);
  --border:var(--mag-rule);

  --header-bg:var(--mag-paper);
  --header-text:var(--mag-ink);
  --footer-bg:#101010;
  --footer-text:#f6f1e7;

  --font-body:"Inter",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-title:"Space Grotesk","Inter",sans-serif;
  --font-serif:Georgia,"Times New Roman",serif;
  --font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  --maxw:1380px;
  --layout-gap:30px;
  --layout-sidebar-width:330px;

  --radius:0;
  --radius-sm:2px;
  --radius-md:4px;
  --radius-lg:6px;
  --radius-xl:8px;
  --radius-pill:999px;

  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-6:24px;

  --shadow-sm:0 8px 20px rgba(17,17,17,.06);
  --shadow-md:0 16px 36px rgba(17,17,17,.09);
  --shadow-lg:0 28px 64px rgba(17,17,17,.12);

  --transition-fast:.16s ease;
  --transition-base:.24s ease;

  --z-header:1000;
  --z-dropdown:1100;
  --z-overlay:9999;
}