/* Downtown Ventura — brand tokens + base. Light = "Daylight", dark = "After Sunset" (navy, never black). Tokens from the DVP web design system, Brand Guidelines v2. Fonts are loaded from . */ :root{ --navy-50:#EEF0F7;--navy-100:#DCE0EE;--navy-200:#BCC4DE;--navy-300:#98A4C9;--navy-400:#6F7FAD;--navy-500:#4A5A8C;--navy-600:#283667;--navy-700:#212D56;--navy-800:#1A2343;--navy-900:#131A32;--navy-950:#0C1120; --olive-100:#E5E8D2;--olive-200:#CDD3A9;--olive-300:#B0BA7E;--olive-500:#75843F;--olive-600:#677437;--olive-700:#535E2C;--olive-800:#404822;--olive-900:#2D3318;--olive-950:#1C200E; --red-100:#FAD5D0;--red-300:#EF7D6E;--red-400:#EB5442;--red-500:#E83425;--red-600:#C42A1D;--red-700:#9C2117; --gold-100:#F6E6C2;--gold-200:#ECCF8B;--gold-300:#E2B95C;--gold-400:#D6A42F;--gold-500:#B78A24;--gold-800:#4D390E; --sand-50:#FBF7EE;--sand-100:#F6EFDF;--sand-200:#EFE4CC;--sand-300:#E0CCAB;--sand-400:#C9B28D;--sand-500:#A98F6D;--sand-600:#877052;--sand-700:#6A553E;--sand-800:#574232;--sand-900:#482E29; --alt:#E7DBBF; --font-display:'Jost','The Future',Futura,sans-serif; --font-mono:'IBM Plex Mono','Relative Mono',ui-monospace,Menlo,monospace; --credit-bg:rgba(224,204,171,.92);--credit-text:var(--sand-900); /* mode tokens — pages may override per theme */ --pg:var(--sand-50);--pg-alt:var(--alt);--ink:var(--navy-700);--body:var(--sand-800);--mut:var(--sand-600); --card:var(--sand-100);--card-line:#D9C49E;--line:var(--sand-400);--hair:var(--sand-200); --link:var(--red-700);--hot:var(--red-500);--kick:var(--olive-600); } [data-mode="dark"]{ --pg:var(--navy-900);--pg-alt:var(--navy-950);--ink:var(--sand-200);--body:var(--sand-400);--mut:var(--navy-300); --card:var(--navy-800);--card-line:var(--navy-600);--line:var(--navy-600);--hair:var(--navy-800); --link:var(--gold-300);--hot:var(--gold-300);--kick:var(--gold-300); } *{box-sizing:border-box} [hidden]{display:none !important} html{scroll-behavior:smooth} body{margin:0;background:var(--pg);color:var(--body);font:400 13px/1.8 var(--font-mono);-webkit-font-smoothing:antialiased;transition:background .25s,color .25s} img,video{max-width:100%;display:block} a{color:var(--link);text-decoration:none} a:hover{color:var(--hot)} h1,h2,h3{color:var(--ink);font-family:var(--font-display);margin:0} ::selection{background:var(--gold-200);color:var(--sand-900)} :focus-visible{outline:2px solid var(--gold-400);outline-offset:2px} button{font:inherit;cursor:pointer;border:none;background:none;padding:0;color:inherit} .container{max-width:1240px;margin:0 auto;padding-left:clamp(16px,4vw,44px);padding-right:clamp(16px,4vw,44px)} .kicker{font:600 11.5px/1.5 var(--font-mono);letter-spacing:.24em;text-transform:uppercase;color:var(--kick)} .display{font:900 clamp(38px,7vw,84px)/0.92 var(--font-display);text-transform:uppercase;letter-spacing:-.02em;color:var(--ink);text-wrap:balance} .credit{position:absolute;right:10px;bottom:10px;font:500 9px/1.4 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;background:var(--credit-bg);color:var(--credit-text);padding:4px 9px;border-radius:4px;z-index:2} .pill{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:700 11px/1 var(--font-display);letter-spacing:.12em;text-transform:uppercase;padding:12px 22px;border-radius:999px;white-space:nowrap;transition:background .2s,color .2s,border-color .2s} /* ---------- responsive utilities ---------- */ .grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px} .grid-2{display:grid;grid-template-columns:1fr 1fr;gap:20px} @media (max-width:1000px){ .grid-3{grid-template-columns:1fr 1fr} .mm-cols{grid-template-columns:1fr 1fr !important} } @media (max-width:640px){ .grid-3,.grid-2{grid-template-columns:1fr} .mm-cols{grid-template-columns:1fr !important} } .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}