/* ==========================================================================
   Page shell and shared section furniture — width container, vertical
   rhythm, display type, section headers, corner ticks.
   ========================================================================== */

/* ---------- shared ---------- */
.wrap{ width:100%; max-width:1680px; margin:0 auto; padding:0 5vw; }
section{ position:relative; }
/* NOTE: these sections also carry .wrap. Use padding-block, never the
   `padding` shorthand — the shorthand resets .wrap's 5vw side gutters
   to zero and the section runs edge-to-edge. */
.block{ padding-block:15vh; }
.display{ font-family:var(--display); font-weight:800; text-transform:uppercase; line-height:.88; letter-spacing:-.03em; }
.shead{ display:flex; align-items:baseline; gap:clamp(14px,2vw,28px); flex-wrap:wrap; width:100%; }
.shead .sys{ font-size:var(--fs-sm); letter-spacing:.24em; text-transform:uppercase; color:var(--amber); }
.shead h2{ font-family:var(--display); font-weight:700; text-transform:uppercase; font-size:clamp(1.35rem,2.4vw,2.1rem); letter-spacing:-.01em; line-height:1.04; }
.shead .sh-line{ flex:1 1 60px; height:1px; background:var(--line); align-self:center; min-width:40px; }
.shead .sh-note{ font-size:var(--fs-xs); letter-spacing:.2em; text-transform:uppercase; color:var(--faint); }
@media (max-width:620px){ .shead{ align-items:flex-start; } .shead .sys{ width:100%; } .shead .sh-line{ flex-basis:100%; order:4; } .shead .sh-note{ width:100%; } }
.tickbox{ position:relative; }
.tickbox::before,.tickbox::after{ content:""; position:absolute; width:14px; height:14px; pointer-events:none; }
.tickbox::before{ top:-1px; left:-1px; border-top:2px solid var(--accent); border-left:2px solid var(--accent); }
.tickbox::after{ bottom:-1px; right:-1px; border-bottom:2px solid var(--accent); border-right:2px solid var(--accent); }