@font-face{font-family:Poppins;font-weight:600;font-display:swap;src:url(fonts/poppins-600.woff2) format("woff2")}
@font-face{font-family:Inter;font-weight:400;font-display:swap;src:url(fonts/inter-400.woff2) format("woff2")}
@font-face{font-family:Inter;font-weight:500;font-display:swap;src:url(fonts/inter-500.woff2) format("woff2")}
@font-face{font-family:"Geist Mono";font-weight:400;font-display:swap;src:url(fonts/geist-mono-400.woff2) format("woff2")}

:root{--grund:#000;--flaeche:#111;--linie:rgba(255,255,255,.14);--text:#fafafa;--leise:rgba(255,255,255,.62);--knopf:#f2f2f2;color-scheme:dark}
*{box-sizing:border-box}
body{margin:0;background:var(--grund);color:var(--text);font:16px/1.5 Inter,system-ui,sans-serif;padding:0 clamp(16px,4vw,48px)}
a{color:inherit}
.rahmen{max-width:1120px;margin:0 auto}
.m{font-family:"Geist Mono",ui-monospace,monospace;font-size:12px;color:var(--leise)}
nav{display:flex;justify-content:space-between;align-items:center;padding:20px 0;gap:12px;flex-wrap:wrap}
nav b{font:600 18px Poppins,sans-serif}

.held{padding-top:12px}
.collage{display:grid;grid-template-columns:repeat(4,minmax(0,220px));justify-content:space-between;align-items:start}
.telefon{display:block;position:relative;padding:5px;border-radius:15%/7%;background:#050505;box-shadow:0 0 0 1px rgba(255,255,255,.26),0 0 0 3px #1b1b1d,0 18px 50px rgba(255,255,255,.07)}
.telefon img,.telefon video{display:block;width:100%;height:auto;aspect-ratio:1206/2622;border-radius:12.5%/5.8%;background:#000}
.kachel{margin:0}
.kachel figcaption{margin-top:16px}
.kachel figcaption b{display:block;font-weight:400;color:var(--text)}
.k1{margin-top:44px}
.k3{margin-top:72px}
.k4{margin-top:18px}
.botschaft{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap;margin-top:56px}
h1{font:600 clamp(34px,5.4vw,60px)/1.08 Poppins,sans-serif;letter-spacing:-.02em;margin:0;max-width:13em}
.sub{max-width:24em;color:var(--leise);margin:0;font-size:15px}

.statistik{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:40px 0 56px}
.stat{background:var(--flaeche);border:1px solid var(--linie);border-radius:14px;padding:16px 18px}
.stat b{font:600 38px/1 Poppins,sans-serif;display:block}
.stat .icons{display:flex;gap:6px;margin:12px 0 10px}
.stat .icons img{width:34px;height:34px;border-radius:9px;display:block}

h2{font:600 24px Poppins,sans-serif;letter-spacing:-.01em;margin:0 0 12px}
.zeile{border-top:1px solid var(--linie)}
.zeile:last-of-type{border-bottom:1px solid var(--linie)}
summary{list-style:none;display:grid;grid-template-columns:96px minmax(0,1fr) auto 18px;gap:20px;align-items:center;padding:16px 0;cursor:pointer}
summary::-webkit-details-marker{display:none}
summary:focus-visible{outline:2px solid var(--text);outline-offset:2px;border-radius:6px}
.thumb{width:96px;height:72px;border-radius:10px;overflow:hidden;background:#1c1c1c;display:block}
.thumb img{width:100%;height:100%;object-fit:cover;object-position:center 38%;display:block}
.kopf{display:grid;gap:2px;min-width:0}
.name{font-weight:500}
.text{color:var(--leise);font-size:15px;margin:0}
.status{font:400 12px "Geist Mono",monospace;color:var(--leise);white-space:nowrap}
.pfeil{color:var(--leise);transition:transform .2s}
details[open] .pfeil{transform:rotate(90deg)}
.detail{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;padding:4px 0 28px 116px}
.detail.ohne-bilder{grid-template-columns:minmax(0,1fr)}
.shots{display:flex;gap:14px;align-items:flex-start}
.shots .telefon{flex:1 1 0;min-width:0;max-width:200px}
.shots.quer{display:grid;gap:10px}
.shots>img{width:100%;border-radius:10px;display:block;border:1px solid var(--linie)}
.infos{display:grid;gap:18px;align-content:start}
h3{font:400 12px "Geist Mono",monospace;color:var(--leise);margin:0 0 4px}
.infos p{margin:0;font-size:15px}
.infos p.m{font-size:12px}
.weg{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:6px}
.weg li{font-size:13px;padding:3px 10px;border:1px solid var(--linie);border-radius:999px}
.knoepfe{display:flex;gap:8px;flex-wrap:wrap}
.k{font-size:14px;padding:8px 14px;border-radius:9px;background:rgba(255,255,255,.1);color:var(--text);text-decoration:none}
.k.voll{background:var(--knopf);color:#0a0a0a;font-weight:500}
.weitere{margin-top:56px}
.weitere ul{list-style:none;margin:0;padding:0}
.weitere li{display:grid;grid-template-columns:220px minmax(0,1fr);gap:20px;padding:14px 0;border-top:1px solid var(--linie)}
.weitere li:last-child{border-bottom:1px solid var(--linie)}
footer{padding:40px 0 56px}
.fuss{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
footer p{margin:10px 0 0}
.leer-seite{padding-block:20vh}

@media (max-width:760px){
  .collage{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
  .k1{margin-top:28px}
  .k2{margin-top:0}
  .k3,.k4{display:none}
  .statistik{grid-template-columns:minmax(0,1fr)}
  .stat{display:grid;grid-template-columns:auto 1fr;gap:0 14px;align-items:center}
  .stat .icons{margin:0;justify-content:flex-end}
  .stat .m{grid-column:1/3;margin-top:6px}
  summary{grid-template-columns:72px minmax(0,1fr) 14px;gap:12px}
  .thumb{width:72px;height:72px}
  .status{display:none}
  .detail{grid-template-columns:minmax(0,1fr);padding-left:0}
  .shots .telefon{padding:3px}
  .weitere li{grid-template-columns:minmax(0,1fr);gap:2px}
}
@media (prefers-reduced-motion:reduce){.pfeil{transition:none}}
