/* ========================================================================== site/grid-105.css · THE MASTER GRID, 5% WIDER — LIVE 2026-09-27 Owner-approved "Option 3 — +5% Wider" (compared at /doctor/grid-width.html). Linked LAST in the of every live page. Undo: delete that one . The site grid is the header's own formula (site-chrome/header.css, home-system/home.css, site/grid.css): --pad: clamp(24px, 4vw, 72px) --maxw: min(1440px, 100% - 2 * --pad) the usable content width --grid-edge: max(--pad, (100% - --maxw) / 2) the left/right line This file makes that usable width 5% wider at every desktop/tablet width: below ~1565px gutter = 1.7vw (was 4vw) 0.92 * 1.05 = 0.966 of the screen above ~1565px width = 1512px (was 1440px) 1440 * 1.05 and never lets the gutter fall under the site's own desktop minimum, 24px. Phones (<=760px) are untouched: they keep 18px. It changes NO rule of any section. It re-declares the same tokens in every scope that declares them, so every lane already written against them — the header, the section row, every section, the footer — moves together: :root / header.bar / .screen --pad --maxw --grid-edge --wpad --site-* header.bar --nav-gutter (the logo and the last tab) #about5 (homepage) its own --pad footer.mx its private --gut and the 1440px cap of .mx-in .x9 (inner-page hero) --e, the hero's outer edge (same formula) Internal padding, card sizes, columns, colour, type and behaviour are not touched; a section's own inner inset still sits inside the new line. ========================================================================== */ @media (min-width: 761px) { html:root, html body header.bar, html body .screen { --pad: clamp(24px, 1.7vw, 72px) !important; --maxw: min(1512px, calc(100% - 2 * clamp(24px, 1.7vw, 72px))) !important; --grid-edge: max(var(--pad), calc((100% - var(--maxw)) / 2)) !important; --wpad: var(--grid-edge) !important; --site-gutter: clamp(24px, 1.7vw, 72px) !important; --site-lane: min(1512px, calc(100% - 2 * var(--site-gutter))) !important; } html body header.bar { --nav-gutter: var(--grid-edge) !important; } html body #about5 { --pad: clamp(24px, 1.7vw, 72px) !important; } html body footer.mx { --gut: clamp(24px, 1.7vw, 72px) !important; } html body footer.mx .mx-in { width: min(1512px, calc(100% - 2 * var(--gut))) !important; } html body .x9 { --e: max(clamp(24px, 1.7vw, 72px), calc((100% - 1512px) / 2)) !important; } }