/* ═════ base: reset, type, layout primitives ═════ */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:72px}
body{margin:0;background:var(--sl-cream)!important;color:var(--sl-brown);font-family:var(--font-ui);font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{max-width:100%}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:700;line-height:1.2;margin:0;color:inherit}
p{margin:0}
a{color:inherit}
button{font-family:inherit;color:inherit}
:focus-visible{outline:3px dashed var(--sl-ochre)!important;outline-offset:3px!important;border-radius:8px}
.sr-only{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:absolute;top:-80px;right:12px;background:var(--sl-brown);color:var(--sl-cream);padding:10px 16px;border-radius:0 0 12px 12px;z-index:2000;font-weight:700;text-decoration:none;transition:top var(--dur-1)}
.skip-link:focus{top:0}
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
.sec{position:relative;padding-block:var(--section-y)}
.eyebrow{font-family:var(--font-note);font-size:12px;font-weight:600;letter-spacing:.14em;color:var(--sl-terracotta);margin-bottom:10px;direction:ltr;text-align:right;display:flex;align-items:center;gap:10px}
.eyebrow::before{content:'';width:7px;height:7px;border-radius:50%;background:currentColor}
.h2{font-size:clamp(30px,6vw,52px);color:var(--sl-ink)}
.lede{color:var(--brown-soft);font-size:15px;margin-top:10px;max-width:56ch}

/* scalloped edge = the “bite” arcs of the kit, repeated as a section transition */
.scallop{--c:var(--sl-cream);display:block;height:26px;margin-top:-1px;background:radial-gradient(circle 19px at 24px 100%,var(--c) 97%,transparent 100%) 0 0/48px 26px repeat-x;pointer-events:none}
.scallop.up{transform:scaleY(-1);margin-top:0;margin-bottom:-1px}

[hidden]{display:none!important}