/* Shared by all three sites: reset, gutters, footer, focus, reduced motion.
   Everything visual (colour, type, layout, motion) lives in each site's own style.css. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;min-height:100vh;-webkit-font-smoothing:antialiased}
img,svg,canvas{max-width:100%}
h1,h2,h3,h4{margin:0;text-wrap:balance}
p{margin:0}
a{color:inherit}
button{font:inherit}
.pad{padding-left:max(clamp(16px,4vw,48px),env(safe-area-inset-left,0px));padding-right:max(clamp(16px,4vw,48px),env(safe-area-inset-right,0px))}
.wrap{max-width:1240px;margin:0 auto}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;padding:8px 14px;background:#fff;color:#000;border-radius:6px}
.skip:focus{left:12px}
:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.nav{display:flex;flex-wrap:wrap;gap:10px 20px;align-items:center;justify-content:space-between;padding-block:18px}
.nav nav{display:flex;flex-wrap:wrap;gap:4px 18px;font-size:14px}
.nav nav a{text-decoration:none;opacity:.75}
.nav nav a:hover{opacity:1}
.ctas{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.btn{text-decoration:none;display:inline-flex;align-items:center;white-space:nowrap}
.foot{display:flex;flex-wrap:wrap;gap:10px 24px;justify-content:space-between;align-items:center;padding-block:22px;font-size:13px;border-top:1px solid color-mix(in oklab,currentColor 16%,transparent)}
.foot nav{display:flex;flex-wrap:wrap;gap:6px 18px}
.foot a{text-underline-offset:3px}
.foot-me{opacity:.45}
.example{font:10px/1.3 ui-monospace,Menlo,monospace;letter-spacing:.1em;text-transform:uppercase;opacity:.6}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}