@font-face{font-family:"Schibsted Grotesk";src:url("fonts/schibsted-400.woff2") format("woff2");font-weight:400 800;font-style:normal;font-display:swap}
:root{--bg:#1a2039;--surface:#212846;--ink:#f9a3c0;--muted:#d7b0c0;--accent:#f9a3c0;--accent-ink:#1a2039;
--step-small:clamp(0.8125rem,0.79rem + 0.1vw,0.875rem);--step-body:clamp(1.0625rem,1rem + 0.25vw,1.1875rem);
--step-lead:clamp(1.25rem,1.1rem + 0.7vw,1.625rem);--step-head:clamp(2rem,1.3rem + 3.2vw,4rem);--m:clamp(16px,4vw,56px)}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Schibsted Grotesk",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
font-size:var(--step-body);line-height:1.4;letter-spacing:-0.01em}
a{color:inherit}img{max-width:100%;height:auto;display:block}
.top{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:20px var(--m);z-index:2;font-weight:600}
.top a{text-decoration:none}.top nav a{margin-left:20px}
.hero{position:relative;min-height:100svh;min-height:100vh;overflow:hidden;padding:0 var(--m)}
.hero svg{position:absolute;right:-18vh;top:12vh;width:120vh;height:120vh;fill:var(--accent)}
.hero .copy{position:relative;z-index:1;max-width:min(52vw,720px);padding-top:28vh}
h1,h2{font-weight:800;letter-spacing:-0.04em;line-height:0.98;margin:0}
h1{font-size:clamp(3rem,7.2vw,7.5rem)}h2{font-size:var(--step-head)}
.lead{font-size:var(--step-lead);margin:28px 0 32px;max-width:34ch;line-height:1.3}
.btn{display:inline-block;background:var(--accent);color:var(--accent-ink);font-weight:600;text-decoration:none;padding:18px 34px 16px 22px;
clip-path:polygon(0 100%,0 30%,70% 30%,70% 0,100% 0,100% 100%);transition:transform .2s}
.btn:hover,.btn:focus-visible{transform:translateY(-3px)}
.panel{margin:20px;background:var(--surface);overflow:hidden;display:grid;grid-template-columns:1fr 1fr;gap:40px;padding:56px}
.panel p{max-width:42ch}.muted{color:var(--muted)}
.shape{clip-path:polygon(0 100%,0 66%,33% 66%,33% 33%,66% 33%,66% 0,100% 0,100% 100%);width:100%;aspect-ratio:1/1;object-fit:cover}
.topics{padding:12vh var(--m)}
.topics ol{list-style:none;padding:0;margin:48px 0 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 56px;max-width:1100px}
.topics li{display:flex;gap:16px;align-items:flex-start;font-size:var(--step-lead);line-height:1.25}
.topics li svg{flex:0 0 22px;width:22px;height:22px;fill:var(--accent);margin-top:4px}
.band{height:clamp(80px,14vw,180px);background:var(--accent);clip-path:polygon(0 100%,0 60%,25% 60%,25% 40%,50% 40%,50% 20%,75% 20%,75% 0,100% 0,100% 100%)}
.next{display:grid;grid-template-columns:5fr 7fr;gap:48px;padding:12vh var(--m);align-items:center}
.next img{width:100%;aspect-ratio:3/2;object-fit:cover}
.org{padding:10vh var(--m);max-width:900px}
.org p{font-size:var(--step-lead);line-height:1.3}
footer{padding:48px var(--m) 64px;font-size:var(--step-small);color:var(--muted);border-top:0}
footer p{max-width:110ch}footer a{color:var(--ink)}
.page{padding:22vh var(--m) 10vh;max-width:820px}.page h1{font-size:clamp(2.6rem,6vw,5rem);margin-bottom:32px}
.page h2{font-size:clamp(1.5rem,2.4vw,2rem);letter-spacing:-0.03em;line-height:1.05;margin:40px 0 12px}
.page p,.page li{max-width:62ch}
@media (max-width:760px){
 .top nav a{margin-left:14px}
 .hero{min-height:0;display:flex;flex-direction:column}.hero .copy{order:1}.hero svg{order:2;position:relative;display:block;right:auto;top:auto;width:120vw;height:120vw;margin:48px 0 -40vw -4vw}
 .hero .copy{max-width:none;padding-top:96px}h1{font-size:11.5vw}
 .panel{grid-template-columns:1fr;margin:10px;padding:28px}
 .topics ol{grid-template-columns:1fr}.next{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}