:root{
/* 4-px base; brand scale 8·14·20·28·40·56·84 */
--space-base:4px;
--space-1:8px;--space-2:14px;--space-3:20px;--space-4:28px;--space-5:40px;--space-6:56px;--space-7:84px;
--space-half:4px;
/* Radii */
--radius-xs:6px;--radius-sm:8px;--radius-card:14px;--radius-card-lg:16px;--radius-pill:100px;
/* Layout */
--content-max:1180px;--content-max-wide:1220px;--content-max-narrow:1120px;
--gutter:48px;--gutter-mobile:28px;--section-gap:84px;--grid-columns:12; /* @kind other */
--grid-gap:28px;
/* Elevation — used sparingly: overlays only */
--shadow-none:none;
--shadow-pop:0 14px 36px rgba(29,38,44,.16),0 2px 6px rgba(29,38,44,.08);
--shadow-hover:0 6px 18px rgba(29,38,44,.08);
--overlay-scrim:rgba(29,38,44,.56); /* @kind color */

}
@media (max-width:720px){:root{--gutter:var(--gutter-mobile)}}