/* Studio pop (row 42): white, cobalt, sunny yellow, record red, ink. Bump ?v= in the pages when this changes. */
:root{--bg:#FFFFFF;--ink:#111322;--muted:#5B5F73;--cobalt:#2340E8;--sun:#FFD23F;--red:#E5483A;--line:#E6E7EE}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Arial,sans-serif;padding:0 16px}
.top{display:flex;align-items:baseline;gap:16px;max-width:960px;margin:0 auto;padding:20px 0;flex-wrap:wrap}
.brand{font-weight:800;font-size:28px;letter-spacing:-.5px}
.brand i{display:inline-block;width:.36em;height:.36em;border-radius:50%;background:var(--red);margin-left:2px}
.motto{color:var(--muted);font-weight:600}
main{max-width:960px;margin:0 auto}
.card{border:2px solid var(--ink);border-radius:24px;padding:20px;background:#fff}
.hero{background:var(--sun);box-shadow:6px 6px 0 var(--cobalt);margin-bottom:20px}
.hero h1{font-size:clamp(28px,6vw,48px);margin:0 0 8px;letter-spacing:-1px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.grid b{font-size:20px;color:var(--cobalt)}
.muted{color:var(--muted)}
.doc{max-width:720px;margin:0 auto 40px}.doc h2{margin-top:28px}
footer{max-width:960px;margin:32px auto;color:var(--muted);font-size:14px}
a{color:var(--cobalt)}
@media (max-width:520px){.top{flex-direction:column;gap:4px}}