/* ============================================================================ NAMC STOREFRONT — LIGHT THEME TOKEN LAYER Scoped to so the staff back-office (which loads the same shared tokens.css but never gets the .shop class) stays dark "Forge". This redefines the token NAMES that shop.css already consumes, with LIGHT values — so shop.css needs no variable renames. Link order in base.html: tokens.css -> shop-tokens.css -> shop.css ========================================================================= */ body.shop { /* Surfaces — light scale: page -> alt band -> card -> input -> photo well */ --ink-900:#FFFFFF; /* page background */ --ink-850:#FAFAFA; /* alt section band / footer */ --ink-800:#FFFFFF; /* card / panel surface */ --ink-700:#F4F5F7; /* input / hover fill / inset */ --ink-650:#EEF0F3; /* media well behind photos */ --ink-600:#E6E9ED; /* deepest inset */ /* Hairline borders */ --line: rgba(17,18,20,.08); --line-2: rgba(17,18,20,.14); /* Text — near-black + muted + faint */ --text:#16181B; --muted:#5B636C; --faint:#868E97; /* Brand accent — the single recognizable thread (NAMC red) */ --red:#E0291F; --red-hot:#C81E15; --red-deep:#9E150D; /* hover DARKENS on light */ --red-tint:#FDECEA; /* Retire the old ember/cyan decorative accents: fold ember -> red; keep a calm blue only for informational links; near-black for "secondary" solids. */ --ember:#E0291F; --ember-soft:#F2685C; --signal:#5B636C; --signal-deep:#16181B; /* retired to neutral — red is the only accent */ --accent-ink:#16181B; /* Status (darkened for AA on white) */ --good:#15803D; --warn:#B45309; --good-tint:#ECFDF3; --warn-tint:#FFF7ED; /* Long-read paper (legal pages) */ --paper:#FFFFFF; --paper-ink:#16181B; /* Focus */ --focus:#E0291F; --focus-ring:0 0 0 3px rgba(224,41,31,.28); /* Shadows tuned for light UI — soft, neutral, low spread */ --sh-1:0 1px 2px rgba(17,18,20,.04), 0 4px 12px rgba(17,18,20,.06); --sh-2:0 8px 28px rgba(17,18,20,.10); --sh-photo:0 18px 50px rgba(17,18,20,.10); --glow-red:0 0 0 1px rgba(224,41,31,.18), 0 10px 28px rgba(224,41,31,.18); /* Radii — tightened for a precise, premium feel */ --r-xl:20px; --r-lg:14px; --r-md:10px; --r-sm:8px; --r-pill:999px; /* Type — modern neutral: Space Grotesk display + Inter body (tabular prices) */ --font-display:"Space Grotesk","Inter",system-ui,sans-serif; --font-sans:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif; --font-mono:"Inter",ui-monospace,monospace; /* Spacing scale */ --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px; --sp-7:48px; --sp-8:64px; --sp-9:96px; --container:1200px; color:var(--text); background:#FFFFFF; } /* Clean white canvas — strip the dark "Forge" atmosphere (grain overlay, corner glows, scanlines). On the storefront, photography carries the page. */ body.shop { background-image:none; } body.shop::after { content:none; }