@layer reset{*,*::before,*::after{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:6rem}body{margin:0}img,svg,canvas{display:block;max-width:100%}button,input,select,textarea{font:inherit}[hidden]{display:none!important}}
@layer layout{
body{background:var(--grund);color:var(--text);font-family:var(--schrift);font-size:var(--text-normal);line-height:1.6;font-variant-numeric:tabular-nums;hyphens:auto;overflow-wrap:break-word}h1,h2,h3{font-family:var(--display);font-weight:750;line-height:1.04;letter-spacing:-.045em;margin:0 0 var(--s24);text-wrap:balance}h1{font-size:var(--titel);max-width:19ch}h2{font-size:var(--kapitel);max-width:22ch}h3{font-size:var(--untertitel);letter-spacing:-.025em;line-height:1.2}p{max-width:var(--lesebreite);margin:0 0 var(--s24)}blockquote{hanging-punctuation:first last;margin-inline:0}a{color:inherit;text-underline-offset:.25em;text-decoration-thickness:1px}a:hover{text-decoration-color:var(--akzent)}small{font-size:var(--text-klein)}
.kopf{position:relative;z-index:5;background:var(--schiefer-tief);color:var(--papier);border-bottom:1px solid #526067}.nav{max-width:var(--max);margin:auto;display:flex;align-items:center;gap:var(--s8);padding:var(--s16) var(--rand);flex-wrap:wrap}.nav>a{display:flex;align-items:center;min-height:44px;padding:.5rem .65rem;text-decoration:none;font-size:var(--text-klein)}.nav .marke{margin-right:auto;font-weight:850;letter-spacing:-.04em;font-size:clamp(1.05rem,1.8vw,1.4rem);padding-left:0;white-space:nowrap;gap:.6rem}.marke::before{content:'';width:23px;height:27px;background:linear-gradient(148deg,transparent 41%,var(--papier) 42% 48%,transparent 49% 60%,var(--papier) 61% 67%,transparent 68%);border-bottom:3px solid var(--signal)}.nav a[aria-current=page]{text-decoration:underline;text-decoration-color:var(--signal);text-decoration-thickness:3px}
.hero,.sektion,.redaktion{position:relative;padding:var(--luft) max(var(--rand),calc((100% - var(--max) + 2*var(--rand))/2))}.hero{background-color:var(--schiefer-tief);color:var(--papier);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:0 var(--spaltenluft);align-content:center;min-height:560px;padding-block:clamp(3rem,8vw,8rem);background-image:linear-gradient(90deg,#c9d0d314 1px,transparent 1px);background-size:96px 100%}.hero>*{grid-column:1/-1;min-width:0}.hero .kicker{color:#c9d0d3}.hero h1{position:relative;z-index:1}.hero>.button{justify-self:start}.hero::after{content:'';position:absolute;right:0;bottom:0;width:var(--falzbreite);height:var(--falzhoehe);background:var(--grund);clip-path:polygon(100% 0,100% 100%,0 100%)}
.hero-art{position:relative;max-width:720px;margin:var(--s40) 0 0;color:var(--zink-hell)}.hero-art svg{width:100%;height:auto}.hero-art figcaption{font-size:var(--text-klein);color:var(--zink-hell);border-top:1px solid #526067;padding-top:var(--s12);display:flex;justify-content:space-between;gap:var(--s16)}.kicker{font-size:var(--text-klein);line-height:1.5;letter-spacing:.14em;font-weight:600;text-transform:uppercase;color:var(--akzent);margin-bottom:var(--s24)}.kicker::before{content:'';display:inline-block;width:1.5rem;height:3px;background:var(--signal);vertical-align:middle;margin-right:.75rem}.antwort{font-size:var(--text-gross);max-width:57ch;border-left:1px solid #8c979c;padding-left:var(--s24);margin-top:var(--s12)}.breadcrumbs{padding:var(--s16) max(var(--rand),calc((100% - var(--max) + 2*var(--rand))/2));font-size:var(--text-klein);color:var(--sekundaer)}
.sektion{border-bottom:1px solid var(--linie)}.zweispaltig,.karten{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--spaltenluft)}.zweispaltig>*,.karten>*{grid-column:span 12;min-width:0}.dunkel{--text:#fbfaf7;--sekundaer:#c9d0d3;--flaeche:#14181b;--linie:#526067;--akzent:#a4c6b4;--fokus:#ffd200;background:var(--schiefer);color:var(--text);background-image:linear-gradient(90deg,#c9d0d314 1px,transparent 1px);background-size:96px 100%}.redaktion{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:0 var(--spaltenluft);padding-top:var(--s64)}.redaktion>*{grid-column:1/-1;min-width:0}.redaktion p{max-width:var(--lesebreite)}.redaktion h2{font-size:clamp(1.5rem,3vw,2.5rem);color:var(--akzent)}.fuss{background:var(--schiefer-tief);color:var(--papier);padding:var(--s64) max(var(--rand),calc((100% - var(--max) + 2*var(--rand))/2));border-top:3px solid var(--signal)}.fussnav{display:flex;gap:var(--s24);flex-wrap:wrap;margin-bottom:var(--s40)}.fussnav a{min-height:44px;display:flex;align-items:center}.fuss small{color:var(--zink-hell)}
@media(min-width:640px){.karten>*{grid-column:span 6}.hero{min-height:620px}.redaktion p,.redaktion h2{grid-column:2/12}.nav{flex-wrap:nowrap}.hero-art{max-width:540px}}
@media(min-width:900px){.zweispaltig>*{grid-column:span 6}.hero{min-height:650px}.hero>.kicker,.hero>h1,.hero>.antwort,.hero>.button{grid-column:1/11}.home .hero>.kicker,.home .hero>h1,.home .hero>.antwort,.home .hero>.button{grid-column:1/8}.home .hero h1{font-size:clamp(4.25rem,7.4vw,7.8rem);max-width:11ch}.home .hero-art{grid-column:8/-1;grid-row:1/6;align-self:center;margin:0}.redaktion h2{grid-column:1/5;grid-row:1/4;position:sticky;top:var(--s40);align-self:start}.redaktion p{grid-column:6/13}.karten>*{grid-column:span 4}}
@media(min-width:1200px){.hero>.kicker,.hero>h1,.hero>.antwort,.hero>.button{grid-column:1/10}.home .hero{min-height:740px}.home .hero-art{grid-column:7/-1}.home .hero>.antwort{grid-column:1/7}.zweispaltig{gap:var(--s64)}.redaktion p{grid-column:6/12}.hero-art{max-width:none}.karten{row-gap:var(--s40)}}
@media(min-width:1600px){:root{--max:1640px;--rand:5rem}.hero{min-height:760px}.home .hero-art{grid-column:7/13}.hero>.antwort{grid-column:1/8}.redaktion h2{grid-column:2/5}.redaktion p{grid-column:6/11}.karten>*{grid-column:span 3}}
@media(max-width:639px){.nav{gap:0 .25rem}.nav .marke{flex-basis:100%}.nav>a{padding:.35rem .55rem}.hero{min-height:0}.hero h1{max-width:100%}.home .hero-art{margin-top:var(--s40)}.fussnav{gap:var(--s16)}.fuss{padding-bottom:var(--s96)}}
}
@layer utilities{:focus-visible{outline:3px solid var(--fokus);outline-offset:5px}.kopf :focus-visible,.hero :focus-visible,.fuss :focus-visible{outline-color:var(--signal)}.skip-link{position:fixed;left:1rem;top:-8rem;background:var(--schiefer);color:var(--papier);padding:.7rem 1rem;border-bottom:3px solid var(--signal);z-index:100}.skip-link:focus{top:1rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}}
@layer layout{.sektion::after{content:'';position:absolute;top:0;right:0;width:96px;height:59.9875px;clip-path:polygon(0 0,100% 0,100% 100%);background:var(--linie);opacity:.25;pointer-events:none}}
