/*
 * Salty & Clever — global chrome.
 *
 * Extracted from home.css so that interior pages stop downloading ~44 KB of
 * homepage-only section CSS (hero, premise, kitchen desk, sequence, proof,
 * closing) on every article, page and archive.
 *
 * Everything here renders on EVERY template: the skip link, the shell width,
 * focus and selection contracts, the footer, and the shared editorial
 * typography + button system that interior templates rely on. The masthead
 * and its navigation are styled in assets/hybrid-header.css.
 *
 * home.css remains the front page's stylesheet and still contains these same
 * rules. That small overlap on one page is deliberate: it keeps the homepage
 * byte-identical in behaviour while interiors get the saving.
 */

*{box-sizing:border-box}

/* Was capped at 1500px, which on a 1920 screen is 78% and on a 2560 is 59% —
 * the home page read as a column in a field while the hero behind it went
 * edge to edge. The gutter is all that is reserved now, so the front page
 * bleeds to the viewport and interiors keep their 90% well. */
.scf-shell{width:min(calc(100% - 3rem),2400px);margin-inline:auto}

/* Skip link — must stay styled on every template, not just the homepage. */
.scf-skip{position:fixed;top:.75rem;left:.75rem;z-index:99999;padding:.8rem 1rem;background:var(--sn-navy);color:var(--sn-linen);font:600 .72rem/1 var(--sc-mono);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;transform:translateY(-180%);transition:transform .2s ease}
.scf-skip:focus{transform:none}
@media (prefers-reduced-motion:reduce){
	.scf-skip{transition:none}
}

:focus-visible{outline:3px solid var(--sn-brass);outline-offset:4px}
::selection{background:var(--sn-brass);color:var(--sn-ink)}

/* ---------- Footer ----------
 * One map of the site (the navigation model, five doors per section), the
 * accountability and legal links, and the publisher line. Its own class names,
 * so the older .scf-footer rules still in home.css cannot reach it. */
.scf-foot{background:var(--sn-navy);color:var(--sn-linen);padding-block:clamp(32px,5vw,64px) 24px}
.scf-foot__inner{display:grid;gap:clamp(24px,3vw,40px)}
.scf-foot__brand{display:grid;gap:8px}
.scf-foot__name{font:400 clamp(24px,2.4vw,32px)/1 var(--sc-display);letter-spacing:-.02em;color:var(--sn-linen);text-decoration:none}
.scf-foot__name em{color:var(--sn-candle)}
.scf-foot__brand p{margin:0;font:15px/1.5 var(--sc-sans);color:var(--sn-text-on-dark-muted)}
.scf-foot__map{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:24px clamp(16px,2vw,32px);padding-block:clamp(20px,3vw,32px);border-block:1px solid rgb(var(--sn-linen-rgb) / .14)}
.scf-foot__group{display:grid;align-content:start;gap:10px}
.scf-foot__hub{display:flex;align-items:center;min-height:44px;font:600 13px/1.2 var(--sc-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--sn-candle);text-decoration:none}
.scf-foot__group ul{display:grid;gap:4px;margin:0;padding:0;list-style:none}
.scf-foot__group li a{display:inline-flex;align-items:center;min-height:28px;font:15px/1.35 var(--sc-sans);color:var(--sn-text-on-dark);text-decoration:none}
.scf-foot a:hover,.scf-foot a:focus-visible{color:var(--sn-candle);text-decoration:underline;text-underline-offset:3px}
.scf-foot__base{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 32px}
.scf-foot__links{display:flex;flex-wrap:wrap;gap:4px 20px}
.scf-foot__links a{display:inline-flex;align-items:center;min-height:28px;font:14px/1.4 var(--sc-sans);color:var(--sn-text-on-dark);text-decoration:none}
.scf-foot__house{flex-basis:100%;margin:0;font:13px/1.5 var(--sc-mono);color:var(--sn-text-on-dark-muted)}
.scf-foot__house a{color:var(--sn-text-on-dark);text-decoration:underline;text-decoration-color:rgb(var(--sn-brass-rgb) / .6);text-underline-offset:3px}

/* Shared editorial typography */
.scf-eyebrow,.scf-section-mark>span{display:inline-block;font:500 .9rem/1.45 var(--sc-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--sn-rosemary)}
.scf-eyebrow--navy{color:var(--sn-ink)}
.scf-eyebrow--glass{color:var(--sn-harbor)}
.scf-eyebrow--coral{color:var(--sn-rosemary)}
.scf-eyebrow--saffron{color:var(--sn-navy)}
.scf-section-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(18rem,28rem);gap:clamp(2rem,6vw,7rem);align-items:end;margin-bottom:clamp(3rem,7vw,6.5rem)}
.scf-section-head h2{max-width:16ch;margin:.65rem 0 0;font:400 clamp(2rem,3.6vw,3.35rem)/1.1 var(--sc-display);letter-spacing:-.018em}
.scf-section-head h2 em{color:var(--sn-navy);font-weight:300}
.scf-section-head h2 strong{color:var(--sn-navy);font-weight:400}
.scf-section-head>p{margin:0;color:var(--sn-ink);font-size:clamp(1rem,1.35vw,1.2rem);line-height:1.65}
.scf-section-head--dark{color:var(--sn-linen)}
.scf-section-head--dark>p{color:rgb(var(--sn-linen-rgb) / 0.68)}
.scf-section-head--dark h2 em{color:var(--sn-candle)}
.scf-button{display:inline-flex;align-items:center;justify-content:center;gap:.8rem;min-height:50px;padding:1rem 1.35rem;border:1px solid transparent;font:500 1rem/1.3 var(--sc-mono);letter-spacing:.08em;text-transform:uppercase;text-decoration:none;transition:transform .2s ease,background .2s ease,color .2s ease,border-color .2s ease}
.scf-button:hover{transform:translateY(-3px)}
.scf-button--saffron{background:var(--sn-navy);color:var(--sn-linen);border-color:var(--sn-navy)}
.scf-button--saffron:hover{background:var(--sn-navy);color:var(--sn-linen);border-color:var(--sn-brass)}
.scf-button--navy{background:var(--sn-navy);color:var(--sn-linen);border-color:var(--sn-navy)}
.scf-button--navy:hover{background:var(--sn-navy);border-color:var(--sn-brass);color:var(--sn-linen)}
.scf-button--ghost{border-color:rgb(var(--sn-brass-rgb) / 0.58);color:var(--sn-linen);background:rgb(var(--sn-navy-rgb) / 0.25)}
.scf-button--ghost:hover{border-color:var(--sn-brass);color:var(--sn-candle);background:rgb(var(--sn-navy-rgb) / 0.6)}
.scf-text-link{display:inline-flex;align-items:center;gap:.65rem;min-height:44px;padding:.35rem 0;font:600 .88rem/1.35 var(--sc-mono);letter-spacing:.1em;text-underline-offset:.32rem;text-transform:uppercase;color:var(--sn-navy)}
.scf-text-link:hover{color:var(--sn-navy)}
.scf-text-link--light{color:var(--sn-candle)}

/* Article kicker is now a route back to the category hub, so it has to read as
 * a link rather than as decoration (WCAG 1.4.1 — colour alone is not enough). */
.evs-kicker__link{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.28em;text-decoration-color:var(--sn-brass)}
.evs-kicker__link:hover,.evs-kicker__link:focus-visible{text-decoration-color:currentColor}

/* Reduced motion: the transforms above are ornamental lift, not information. */
@media (prefers-reduced-motion:reduce){
	.scf-button:hover{transform:none}
	.scf-button{transition:color .12s ease,background .12s ease,border-color .12s ease}
}