@font-face { font-family: "Schibsted Grotesk"; src: url("assets/fonts/schibsted-grotesk-latin-wght-normal.woff2") format("woff2"); font-weight: 400 900; font-display: swap; }
@font-face { font-family: "Newsreader"; src: url("assets/fonts/newsreader-latin-opsz-normal.woff2") format("woff2"); font-weight: 200 800; font-display: swap; }
:root { --nacht: #0a0b0d; --rot: #d40000; --rot-hell: #ff4d45; --ink: #0a0b0d; --grau: #5d6168; --gelb: #ffe066; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--nacht); color: var(--ink); font-family: "Schibsted Grotesk", system-ui, sans-serif; font-size: 17px; line-height: 1.65; -webkit-font-smoothing: antialiased; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--rot-hell); outline-offset: 3px; border-radius: 4px; }
.kopf { max-width: 860px; margin: 0 auto; padding: 22px 16px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.marke { font-family: "Newsreader", serif; font-variation-settings: "opsz" 72; font-weight: 750; font-size: 24px; letter-spacing: -.03em; color: #fff; text-decoration: none; display: inline-flex; align-items: baseline; white-space: nowrap; }
.marke .news { font-weight: 400; }
.marke i { display: inline-block; width: .2em; height: .2em; border-radius: 50%; background: var(--rot-hell); margin: 0 .05em 0 .06em; }
.marke small { font-family: "Schibsted Grotesk", sans-serif; font-size: 11px; font-weight: 700; background: var(--rot); padding: 3px 6px 2px; border-radius: 5px; margin-left: 9px; align-self: center; }
.zurueck { color: #b9bdc4; font-size: 15px; font-weight: 600; text-decoration: none; }
.zurueck:hover { color: #fff; }
main { max-width: 860px; margin: 0 auto 48px; padding: clamp(28px, 5vw, 56px) clamp(20px, 5vw, 56px); background: #fff; border-radius: 24px; }
@media (max-width: 600px) { main { border-radius: 18px; margin: 0 8px 32px; } }
h1 { font-size: clamp(2rem, 7vw, 3rem); font-weight: 800; letter-spacing: -.035em; line-height: 1.05; margin: 0 0 10px; overflow-wrap: anywhere; }
.stand { color: var(--grau); margin: 0 0 32px; padding-bottom: 22px; border-bottom: 1px solid rgba(10,11,13,.1); }
h2 { font-size: 1.3rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.25; margin: 2em 0 .4em; }
p, li { overflow-wrap: anywhere; }
.kasten { background: #f3f3f5; border-radius: 14px; padding: 16px 20px; }
ol.schritte { padding-left: 1.3em; }
ol.schritte li { margin-bottom: .5em; }
.fuss { max-width: 860px; margin: 0 auto; padding: 0 16px 40px; display: flex; flex-wrap: wrap; gap: 8px 22px; font-size: 14px; }
.fuss a { color: #80858d; text-decoration: none; }
.fuss a:hover { color: #fff; }