:root{--petrol:#12343E;--ivoor:#F3EFE6;--koper:#BF6045;--koper-tekst:#A2523B;--grafiet:#292E31;--verloop:linear-gradient(135deg,#081D24 0%,#0F303A 50%,#1A4652 100%);--mono:"IBM Plex Mono",ui-monospace,monospace}
*{box-sizing:border-box}
body{margin:0;background:var(--ivoor);color:var(--grafiet);font:17px/1.65 "IBM Plex Sans",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
header{background:var(--verloop);padding:26px 0}
header img{height:32px;width:auto;display:block}
.wrap{max-width:760px;margin:0 auto;padding:0 24px}
main{padding:56px 0 80px}
h1{color:var(--petrol);font-size:clamp(32px,5vw,44px);line-height:1.1;margin:0 0 8px}
h2{color:var(--petrol);font-size:21px;margin:36px 0 8px}
p,li{margin:0 0 12px}
.label{font:600 12px/1.4 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--koper-tekst);margin:0 0 14px}
a{color:var(--petrol)}
a:focus-visible{outline:3px solid var(--koper);outline-offset:3px}
footer{background:var(--verloop);color:#CFDCD9;padding:32px 0;font:500 13px/1.7 var(--mono)}
footer a{color:var(--ivoor)}
@media (max-width:640px){body{font-size:16px}.wrap{padding:0 16px}main{padding:40px 0 60px}}
.skip{position:absolute;left:16px;top:-60px;background:var(--ivoor);color:var(--petrol);padding:12px 18px;border-radius:8px;font-weight:600}
.skip:focus{top:16px}
footer a{display:inline-block;padding:6px 0}