/* ========================================================================== EDITORIAL CITY SYSTEM v2 — "PANELS" — shared layer (.ce-*) Used by all 21 city pages and houston.html. Render-blocking by design: these rules style above-the-fold content, so they must not be async. Per-city art motifs stay inline on their own page. v2 changes the CONTAINMENT, not the structure. Every section's existing .container becomes a physical panel: stepped surface, hairline border, restrained lift, generous internal padding. Sections no longer bleed into one another, so the page reads as a stack of digestible units. No class was renamed or removed; no HTML change is required. ========================================================================== STRUCTURAL CONTRACT — binding on anyone editing the 22 city HTML files. Nothing to change; just do not break it. 1. Every section keeps a DIRECT-CHILD `
`. That div is the panel. Content moved outside it silently loses its panel. 2. `.ce-figure` must NEVER gain padding or a wrapper. `.ce-callouts li` carries inline, per-city `top:` percentages measured against that box (e.g. `
  • `). The card backdrop is a negative-inset ::before precisely so the box geometry is unchanged. 3. `.ce-facts` keeps exactly 5 `
    ` children (Rating / Local since / Every crew / Coverage / Office hours), or the `:last-child { grid-column: 1 / -1 }` fallback misfires. 4. `` keeps BOTH `city-page` and `city-ed` — the token block below is scoped to `body.city-page.city-ed`. 5. `.ce-facts dt`, `.ce-index dt`, `.ce-callouts li`, `.ce-quote footer`, `.ce-eyebrow` and `.breadcrumb` now render in their AUTHORED casing, because `text-transform: uppercase` was removed from them. Keep every one of those strings sentence case. ========================================================================== */ /* ========================================================================== 0. Tokens Surface scale steps: ground -> panel -> raised -> hover. Every text tier below was contrast-checked against every surface above, including the brightest pixel of each gradient panel. Lowest pair actually used on a page: 5.85:1 (--ce-dim on the close panel's bloom). Lowest theoretical pair anywhere in the matrix: 4.91:1. AA body text needs 4.5:1. ========================================================================== */ body.city-page.city-ed { --ce-serif: 'Iowan Old Style', 'Palatino Linotype', Palatino, 'Book Antiqua', Georgia, 'Times New Roman', serif; --ce-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif; /* surfaces */ --ce-ground: #0b0f17; /* page behind the panels */ --ce-surface: #141b29; /* the panel itself */ --ce-raised: #1c2434; /* a card nested inside a panel */ --ce-hover: #242e42; /* nested card, hover / open state */ --ce-thesis-surface: #121826; /* lines */ --ce-line: rgba(255, 255, 255, 0.10); --ce-hair: rgba(255, 255, 255, 0.065); /* v1 aliases — DO NOT DELETE. The per-city