@font-face{font-family:Archivo;font-weight:100 900;font-stretch:62% 125%;font-display:swap;src:url(/fonts/archivo-latin-wdth-normal.woff2) format("woff2")}
@font-face{font-family:Schibsted;font-weight:400;font-display:swap;src:url(/fonts/schibsted-grotesk-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:Schibsted;font-weight:500;font-display:swap;src:url(/fonts/schibsted-grotesk-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:Schibsted;font-weight:700;font-display:swap;src:url(/fonts/schibsted-grotesk-latin-700-normal.woff2) format("woff2")}

:root{--ink:#0a1124;--blue:#2459e0;--blue-d:#1c47b8;--pale:#d6e2ff;--off:#f3f4f7;--line:#e2e5ec;--mut:#596177;--wrap:1220px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
html,body{overflow-x:clip}
body{margin:0;font:400 16px/1.55 Schibsted,"Helvetica Neue",Arial,sans-serif;color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased}
img{display:block;width:100%}
a{color:inherit}
p{margin:0}
h1,h2,h3{margin:0;font-family:Archivo,"Helvetica Neue",Arial,sans-serif;font-weight:800;font-stretch:104%;text-transform:uppercase;letter-spacing:-.015em}
h1{font-size:clamp(2.35rem,5.6vw,4.75rem);line-height:.96}
h1.lang{font-size:clamp(1.65rem,4.3vw,3.5rem);line-height:1;overflow-wrap:break-word}
h2{font-size:clamp(1.7rem,3.3vw,2.75rem);line-height:1}
h3{font-size:1.05rem;line-height:1.15}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:20px}
.lab{font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mut);margin-bottom:14px}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px}

.knopf{display:inline-flex;align-items:center;justify-content:center;gap:12px;background:var(--blue);color:#fff;border:1.5px solid var(--blue);font:700 .82rem/1 Archivo,Arial,sans-serif;font-stretch:112%;letter-spacing:.07em;text-transform:uppercase;padding:15px 22px;text-decoration:none;cursor:pointer;border-radius:0}
.knopf:hover{background:var(--blue-d);border-color:var(--blue-d)}
.knopf svg{width:15px;height:15px;flex:none}
.knopf.rand{background:transparent;color:var(--ink);border-color:var(--ink)}
.knopf.rand:hover{background:var(--ink);color:#fff}
.knopf.hell{background:transparent;color:#fff;border-color:#fff}
.knopf.hell:hover{background:#fff;color:var(--ink)}
.knopf.klein{padding:11px 16px;font-size:.74rem}

.kopf{position:sticky;top:0;z-index:30;background:#fff;border-bottom:1px solid var(--line)}
.kopf .wrap{max-width:none;padding-inline:44px;display:flex;align-items:center;height:64px;gap:30px}
.marke{text-decoration:none;font:800 1.3rem/1 Archivo,Arial,sans-serif;font-stretch:100%;letter-spacing:-.03em;text-transform:lowercase}
.marke span{color:var(--blue)}
.kopf nav{margin-inline:auto;display:flex;gap:26px;font-size:.76rem;letter-spacing:.1em;text-transform:uppercase}
.kopf nav a{text-decoration:none}
.kopf nav a:hover{color:var(--blue)}

.einstieg{padding:58px 0 0}
.einstieg .wrap{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:56px;align-items:center}
.einstieg .vor{margin-top:26px;font-size:1.16rem;line-height:1.5;max-width:26em}
.einstieg .tag{display:inline-block;margin-top:24px;background:var(--pale);font:700 .7rem/1 Archivo,Arial,sans-serif;font-stretch:112%;letter-spacing:.09em;text-transform:uppercase;padding:7px 10px}
.einstieg img{aspect-ratio:4/5;object-fit:cover}

.anfrage{margin:40px auto 0;max-width:calc(var(--wrap) - 40px);border:1px solid var(--line);background:#fff;box-shadow:0 12px 34px rgba(10,17,36,.08);padding:20px 22px}
.anfrage .oben{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin-bottom:16px}
.anfrage h2{font-size:1.05rem;letter-spacing:0}
.schritte{display:flex;gap:18px;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mut)}
.schritte .an{color:var(--ink);font-weight:700}
.feld{display:grid;gap:14px;grid-template-columns:minmax(0,1.3fr) minmax(0,.8fr) minmax(0,1fr) minmax(0,1fr) auto;align-items:end}
.feld[data-schritt="2"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.feld[hidden]{display:none}
.feld .breit{grid-column:1/-1}
.feld .halb{grid-column:span 2}
.anfrage label{display:grid;gap:6px;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mut)}
.anfrage input,.anfrage select,.anfrage textarea{font:400 .95rem/1.2 Schibsted,Arial,sans-serif;color:var(--ink);background:#fff;border:1px solid #c9cedb;border-radius:0;padding:12px;width:100%;min-width:0;min-height:46px;-webkit-appearance:none;appearance:none;letter-spacing:0;text-transform:none}
.anfrage select{background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%230a1124' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 12px center/11px;padding-right:32px}
.anfrage input:focus,.anfrage select:focus,.anfrage textarea:focus{outline:2px solid var(--blue);outline-offset:-1px}
.anfrage .knopf{min-height:46px}
.haken{display:flex!important;gap:10px;align-items:flex-start;letter-spacing:0!important;text-transform:none!important;font-size:.84rem!important;color:var(--ink)!important}
.haken input{width:18px;height:18px;min-height:0;margin:1px 0 0;flex:none;-webkit-appearance:auto;appearance:auto}
.zeile{display:flex;gap:12px;justify-content:flex-end}
.falle{position:absolute;left:-9999px}

.zahlen{margin-top:64px;background:var(--ink);color:#fff}
.zahlen .wrap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;padding-block:50px}
.zahlen b{display:block;font:800 2.75rem/1 Archivo,Arial,sans-serif;font-stretch:112%;letter-spacing:-.02em}
.zahlen span{display:block;margin-top:10px;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:#c3c9d9}

.teil{padding:84px 0}
.teil.off{background:var(--off)}
.teil.dunkel{background:var(--ink);color:#fff}
.teil.dunkel .lab{color:#9aa3bb}
.kopfzeile{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:34px}

.karten{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.karte{all:unset;display:block;border:1px solid var(--line);background:#fff;cursor:zoom-in}
.karte:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.karte img{aspect-ratio:4/3;object-fit:cover}
.karte div{padding:16px 16px 18px}
.karte small{display:block;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mut);margin-bottom:6px}
.karte b{font:800 1.08rem/1.15 Archivo,Arial,sans-serif;font-stretch:112%;text-transform:uppercase}
dialog.gross{border:0;padding:0;background:transparent;max-width:min(94vw,1100px);max-height:94vh}
dialog.gross::backdrop{background:rgba(10,17,36,.92)}
dialog.gross img{max-height:86vh;width:auto;max-width:100%;margin:auto}
dialog.gross form{display:flex;justify-content:flex-end;margin-bottom:8px}
dialog.gross button{background:none;border:0;color:#fff;font:700 .78rem Archivo,Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;padding:6px 0}

.band{background:var(--pale);padding:64px 0}
.band .wrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:56px;align-items:center}
.ablauf{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px;counter-reset:s}
.ablauf li{counter-increment:s;font-size:.9rem}
.ablauf li::before{content:counter(s);display:block;font:800 1.5rem/1 Archivo,Arial,sans-serif;margin-bottom:12px}
.ablauf h3{margin-bottom:8px}

.zwei{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:64px;align-items:start}
.zwei .text p:not(.lab){margin:22px 0 28px;font-size:1.05rem;line-height:1.6;max-width:27em}
.kasten{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.kasten div{border:1px solid var(--line);background:#fff;padding:22px}
.kasten b{display:block;font-weight:700;font-size:1rem;margin-bottom:6px}
.kasten p{font-size:.9rem;color:var(--mut)}

.orte{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
.ort h3{min-width:0;overflow-wrap:anywhere}
.ort{display:block;text-decoration:none;border:1px solid var(--line);background:#fff;padding:20px 22px}
.ort:hover{border-color:var(--ink)}
.ort .oben{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.ort .oben b{font-weight:700;color:var(--blue);white-space:nowrap}
.ort ul{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.ort li{border:1px solid var(--line);padding:6px 11px;font-size:.88rem}
.ort li i{font-style:normal;font-weight:700;color:var(--blue);margin-left:6px}

.fragen{display:grid;gap:10px}
.fragen details{border:1px solid var(--line);padding:0 22px}
.fragen summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px;align-items:center;padding:19px 0;font-weight:700}
.fragen summary::-webkit-details-marker{display:none}
.fragen summary::after{content:"+";flex:none;font:400 1.5rem/1 Archivo,Arial,sans-serif}
.fragen details[open] summary::after{content:"–"}
.fragen details p{padding:0 30px 20px 0;color:var(--mut)}

.wege{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:34px}
.wege div{border:1px solid #2a3350;padding:30px}
.wege p{margin:12px 0 22px;color:#c3c9d9;font-size:.95rem}

.fuss{background:var(--ink);color:#aeb6ca;border-top:1px solid #2a3350;padding:54px 0 32px;font-size:.88rem}
.fuss .spalten{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px}
.fuss .marke{color:#fff;display:inline-block;margin-bottom:14px}
.fuss .marke span{color:#7ea6ff}
.fuss h3{color:#fff;font-size:.76rem;letter-spacing:.12em;margin-bottom:14px}
.fuss a{display:block;text-decoration:none;margin-bottom:8px}
.fuss a:hover{color:#fff}
.fuss .unten{border-top:1px solid #2a3350;margin-top:36px;padding-top:20px;font-size:.8rem}

.text-seite{max-width:780px;padding:64px 20px 96px}
.text-seite h1{font-size:clamp(1.9rem,4vw,2.8rem);margin-bottom:24px}
.text-seite h2{font-size:1.15rem;margin:30px 0 8px}
.text-seite p{margin-top:10px}
.danke{padding:96px 0 120px}
.danke p{margin:20px 0 30px;font-size:1.1rem;max-width:30em}
.leiste{display:none}

@media (max-width:980px){
  .kopf nav{display:none}
  .kopf .wrap{padding-inline:20px;justify-content:space-between}
  .einstieg .wrap,.band .wrap,.zwei{grid-template-columns:minmax(0,1fr);gap:34px}
  .einstieg img{aspect-ratio:4/3}
  .feld,.feld[data-schritt="2"]{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .feld .gross{grid-column:1/-1}
  .feld .knopf{grid-column:1/-1}
  .karten{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fuss .spalten{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  body{padding-bottom:68px}
  .kopf .knopf{display:none}
  .einstieg{padding-top:34px}
  .einstieg .vor{font-size:1.05rem}
  .anfrage{margin-inline:20px;padding:18px 16px}
  .anfrage .oben{flex-direction:column;gap:8px}
  .zahlen{margin-top:44px}
  .zahlen .wrap{grid-template-columns:1fr 1fr;padding-block:38px;gap:28px 20px}
  .zahlen b{font-size:2.1rem}
  .teil{padding:58px 0}
  .band{padding:48px 0}
  .kopfzeile{flex-direction:column;align-items:flex-start}
  .karten{gap:12px}
  .karte div{padding:12px 12px 14px}
  .karte b{font-size:.9rem}
  .ablauf,.kasten,.wege{grid-template-columns:minmax(0,1fr)}
  .ablauf{gap:24px}
  .zeile{flex-direction:column-reverse}
  .fuss .spalten{grid-template-columns:1fr;gap:26px}
  .leiste{display:grid;grid-template-columns:1fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:40;background:#fff;border-top:1px solid var(--line);padding:10px 12px calc(10px + env(safe-area-inset-bottom));gap:8px}
  .leiste .knopf{padding:14px 8px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
