/* NEST · Startseite. Richtung: Das N als Grundriss. */
@font-face{font-family:Apercu;font-weight:300;font-style:normal;font-display:swap;src:url(../fonts/apercu-light.woff2) format("woff2")}
@font-face{font-family:Apercu;font-weight:700;font-style:normal;font-display:swap;src:url(../fonts/apercu-bold.woff2) format("woff2")}
@font-face{font-family:"Apercu Mono";font-weight:400;font-style:normal;font-display:swap;src:url(../fonts/apercu-mono.woff2) format("woff2")}

:root{
  --gelb:#FFD630; --gelb-hell:#FFF1BA; --schwarz:#0F0F10; --anthrazit:#282A2C; --weiss:#fff;
  --grund:#F2F2EF; --text-leise:#4a4d50; --text-leise-dunkel:#d0d3d6; --linie:#0F0F10;
  --rand:clamp(16px,4.4vw,64px);
  --abschnitt:clamp(72px,11vw,168px);
  --serif:none;
  --f-text:Apercu,system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"Apercu Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --ease:cubic-bezier(.16,1,.3,1);
  /* Regler für Phase 6 (tweaks.css überschreibt) */
  --hero-h1:clamp(32px,5.2vw,80px);
  --hero-text-unten:clamp(20px,5vh,56px);
  --hero-scroll:380vh;
  --h2:clamp(34px,5.2vw,80px);
}
*{box-sizing:border-box;margin:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:72px;scrollbar-color:var(--schwarz) var(--weiss)}
body{background:var(--weiss);color:var(--schwarz);font:300 clamp(17px,1.25vw,20px)/1.55 var(--f-text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
::selection{background:var(--gelb);color:var(--schwarz)}
img,svg{max-width:100%;display:block}
a{color:inherit;text-underline-offset:.22em;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--schwarz);outline-offset:3px}
.dunkel :focus-visible,.dunkel:focus-visible{outline-color:var(--gelb)}
input,textarea,select,button{font:inherit;color:inherit;caret-color:var(--schwarz)}
html[lang=de] h1,html[lang=de] h2,html[lang=de] h3{hyphens:manual}
h1,h2,h3{font-weight:700;letter-spacing:-.025em;line-height:1.02;text-wrap:balance}
h2{font-size:var(--h2)}
h3{font-size:clamp(22px,2.2vw,32px);letter-spacing:-.015em;line-height:1.12}
p{max-width:62ch;text-wrap:pretty}
.mono{font-family:var(--f-mono);font-weight:400;letter-spacing:.01em}
.skip{position:absolute;left:-999px;top:8px;background:var(--gelb);padding:10px 14px;z-index:100;font-weight:700}
.skip:focus{left:8px}
.wrap{padding-inline:var(--rand);max-width:1680px;margin-inline:auto}
section{position:relative}
.abschnitt{padding-block:var(--abschnitt)}
.dunkel{background:var(--schwarz);color:var(--weiss)}
.anthrazit{background:var(--anthrazit);color:var(--weiss)}
.grund{background:var(--grund)}
.gelb-flaeche{background:var(--gelb)}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:.6em;min-height:52px;padding:.8em 1.4em;background:var(--schwarz);color:var(--gelb);font-weight:700;font-size:1.02rem;text-decoration:none;border:2px solid var(--schwarz);transition:background .25s var(--ease),color .25s var(--ease),transform .25s var(--ease)}
.btn:hover{background:var(--gelb);color:var(--schwarz)}
.btn:active{transform:translateY(1px)}
.btn.zweit{background:transparent;color:inherit;border-color:currentColor}
.btn.zweit:hover{background:var(--schwarz);color:var(--gelb);border-color:var(--schwarz)}
.dunkel .btn,.anthrazit .btn{background:var(--gelb);color:var(--schwarz);border-color:var(--gelb)}
.dunkel .btn:hover,.anthrazit .btn:hover{background:var(--weiss);border-color:var(--weiss)}
.btn .pfeil{display:inline-block;width:1.1em;height:1px;background:currentColor;position:relative}
.btn .pfeil::after{content:"";position:absolute;right:0;top:-3px;width:7px;height:7px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)}

/* Kopf */
.kopf{position:fixed;inset:0 0 auto 0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px var(--rand);pointer-events:none}
.kopf>*{pointer-events:auto}
.marke{font-family:var(--f-mono);font-size:13px;line-height:1.25;text-decoration:none;background:var(--weiss);padding:6px 10px;border:1px solid var(--schwarz)}
.nav{display:flex;align-items:center;gap:6px;background:var(--weiss);border:1px solid var(--schwarz);padding:4px 4px 4px 14px;font-size:15px}
.nav a{padding:8px 10px;text-decoration:none;position:relative}
.nav a:hover{text-decoration:underline}
.nav .anfragen{background:var(--schwarz);color:var(--gelb);font-weight:700;padding:9px 14px;margin-left:6px}
.nav .anfragen:hover{background:var(--gelb);color:var(--schwarz);text-decoration:none}
.nav .sprache{font-family:var(--f-mono);font-size:13px;padding-inline:8px}
.menue-knopf{display:none}
@media (max-width:1020px){
  .nav{padding:4px}
  .nav a:not(.anfragen):not(.sprache){display:none}
  .nav.offen{position:fixed;inset:60px var(--rand) auto var(--rand);flex-direction:column;align-items:stretch;padding:8px}
  .nav.offen a:not(.anfragen):not(.sprache){display:block;padding:14px 12px;border-bottom:1px solid #ddd;font-size:18px}
  .menue-knopf{display:inline-block;background:var(--weiss);border:1px solid var(--schwarz);padding:9px 12px;font-family:var(--f-mono);font-size:13px;cursor:pointer}
  .marke span{display:none}
}

/* ===== Einstieg: der Plan zoomt ===== */
.buehne{height:var(--hero-scroll);position:relative}
.sticky{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--weiss)}
#plan{position:absolute;inset:0;width:100%;height:100%;max-width:none}
.hud{margin-right:auto;font-family:var(--f-mono);font-size:13px;line-height:1.25;background:var(--weiss);padding:6px 10px;border:1px solid var(--schwarz);white-space:nowrap}
.satz{position:absolute;right:var(--rand);top:84px;z-index:3;font-family:var(--f-mono);font-size:clamp(13px,1.1vw,15px);min-height:2.4em;background:var(--weiss);padding:6px 10px;border:1px solid var(--schwarz);opacity:0;transform:translateY(-4px);transition:opacity .5s var(--ease),transform .6s var(--ease)}
.satz.an{opacity:1;transform:none}
.einstieg-text{position:absolute;left:var(--rand);bottom:var(--hero-text-unten);z-index:3;max-width:min(1260px,calc(100vw - 2*var(--rand)));background:var(--weiss);padding:clamp(14px,2vw,28px) clamp(14px,2vw,28px) clamp(16px,2vw,30px) 0}
.einstieg-text h1{font-size:var(--hero-h1)}
.einstieg-text .lead{margin-top:clamp(10px,1.4vw,18px);font-size:clamp(17px,1.45vw,22px);max-width:36ch}
.einstieg-text .tasten{margin-top:clamp(14px,1.6vw,22px);display:flex;flex-wrap:wrap;gap:12px}
.einstieg-text.kompakt h1{font-size:calc(var(--hero-h1)*.62)}
.einstieg-text.kompakt .lead{display:none}
.einstieg-text h1{transition:font-size .5s var(--ease)}
.scroll-hinweis{position:absolute;left:50%;bottom:10px;z-index:3;font-family:var(--f-mono);font-size:13px;transform:translateX(-50%);background:var(--weiss);padding:2px 8px}
@media (max-width:700px){.scroll-hinweis{display:none}.satz{top:76px}}

/* ===== Warum ===== */
.warum{--w:var(--schwarz)}
.warum .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,112px)}
.warum h2{position:sticky;top:96px;align-self:start}
.warum .aussage{font-weight:700;font-size:clamp(26px,3.3vw,52px);line-height:1.08;letter-spacing:-.02em;max-width:22ch}
.warum .aussage mark{background:none;color:var(--gelb)}
.raum-weiss{margin-top:clamp(32px,4vw,56px);background:var(--weiss);color:var(--schwarz);padding:clamp(18px,2.6vw,36px)}
.masskette{display:flex;align-items:center;gap:10px;font-family:var(--f-mono);font-size:13px;margin-bottom:12px}
.masskette i{flex:1;height:1px;background:currentColor;position:relative}
.masskette i::before,.masskette i:last-child::after{content:"";position:absolute;top:-6px;height:13px;width:1px;background:currentColor}
.masskette i::before{left:0}.masskette i:last-child::after{right:0}
.masskette i:last-child::before{display:none}
.rollen{display:grid;gap:0;border-top:1px solid var(--schwarz)}
.rollen p{display:grid;grid-template-columns:56px minmax(0,12ch) 1fr;gap:16px 20px;align-items:center;padding:16px 0;border-bottom:1px solid var(--schwarz);max-width:none;font-size:clamp(18px,1.6vw,24px)}
.moebel{width:48px;height:48px;fill:none;stroke:var(--schwarz);stroke-width:1.3}
.rollen b{font-family:var(--f-mono);font-weight:400;font-size:13px;color:var(--schwarz)}
.warum .schluss{margin-top:clamp(28px,4vw,56px);color:var(--text-leise-dunkel);max-width:46ch}
@media (max-width:900px){.warum .wrap{grid-template-columns:1fr}.warum h2{position:static}.rollen p{grid-template-columns:48px 1fr;gap:4px 14px}.rollen p .moebel{grid-row:1/3}}

/* ===== Für wen: ein Plan aus drei Räumen ===== */
.fuer-wen .kopfzeile{display:grid;gap:18px;margin-bottom:clamp(36px,5vw,72px)}
.plan-raeume{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.55fr) minmax(0,1fr);align-items:stretch;gap:clamp(10px,1.2vw,18px);background:var(--schwarz);padding:clamp(10px,1.2vw,18px);}
.raum{position:relative;background:var(--weiss);padding:clamp(22px,2.6vw,40px);display:flex;flex-direction:column;gap:18px;transition:background .35s var(--ease)}
.raum:hover,.raum:focus-within{background:var(--gelb)}
.raum h3{font-size:clamp(26px,2.6vw,40px)}
.raum p{max-width:34ch}
.raum .btn{margin-top:auto;align-self:flex-start}

.beispiele{list-style:none;padding:0;border-top:1px solid var(--schwarz)}
.beispiele li{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid var(--schwarz);font-size:15.5px;line-height:1.3}
.beispiele li span:last-child{font-family:var(--f-mono);font-size:13px;white-space:nowrap}
@media (max-width:900px){.plan-raeume{grid-template-columns:1fr}}

/* ===== Methode: Weg durch den Plan ===== */
.methode .kopfzeile{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,5vw,96px);align-items:end;margin-bottom:clamp(48px,6vw,96px)}
.methode .kopfzeile p{font-size:clamp(18px,1.5vw,22px)}
.weg{list-style:none;padding:0;position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2.4vw,40px);--p:0}
.weg::before{content:"";position:absolute;left:0;right:0;top:19px;height:2px;background:linear-gradient(to right,var(--schwarz) 0 calc(var(--p)*100%),#c9c9c5 calc(var(--p)*100%) 100%)}
.weg li{position:relative;padding-top:64px}
.weg .knoten{position:absolute;left:0;top:0;width:40px;height:40px;border:2px solid var(--schwarz);background:var(--weiss);display:grid;place-items:center;font-family:var(--f-mono);font-size:13px;transition:background .4s var(--ease)}
.weg li.erreicht .knoten{background:var(--gelb)}
.weg li:not(:last-child)::after{content:"";position:absolute;top:-4px;right:calc(clamp(16px,2.4vw,40px)/-2 - 23px);width:46px;height:46px;border-top:1.5px dashed var(--schwarz);border-right:1.5px dashed var(--schwarz);border-left:2px solid var(--schwarz);border-top-right-radius:100%;background:var(--grund);pointer-events:none}
.weg li:not(:last-child)::before{content:"";position:absolute;top:19px;right:calc(clamp(16px,2.4vw,40px)/-2 - 23px);width:46px;height:2px;background:var(--grund)}
.weg h3{font-size:clamp(28px,3vw,46px);margin-bottom:14px}
.weg p{font-size:clamp(16px,1.2vw,19px);max-width:30ch}
.weg-fuss{margin-top:clamp(36px,4vw,64px);padding-top:24px;border-top:1px solid var(--schwarz);display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(20px,4vw,64px)}
.weg-fuss .mono{font-size:13px}
@media (max-width:900px){
  .methode .kopfzeile,.weg-fuss{grid-template-columns:1fr}
  .weg{grid-template-columns:1fr;gap:0}
  .weg::before{left:19px;right:auto;top:0;bottom:0;width:2px;height:auto;background:linear-gradient(to bottom,var(--schwarz) 0 calc(var(--p)*100%),#c9c9c5 calc(var(--p)*100%) 100%)}
  .weg li{padding:0 0 40px 64px}
  .weg li:not(:last-child)::after,.weg li:not(:last-child)::before{display:none}
}

/* ===== Werkzeuge ===== */
.werkzeuge .kopfzeile{margin-bottom:clamp(32px,4vw,64px)}
.werkzeuge h2{max-width:20ch}
.werkzeuge details{border-top:2px solid var(--schwarz)}
.werkzeuge details:last-of-type{border-bottom:2px solid var(--schwarz)}
.werkzeuge summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:minmax(0,7ch) 1fr 40px;gap:clamp(12px,2vw,32px);align-items:baseline;padding:clamp(18px,2.2vw,32px) 0}
.werkzeuge summary::-webkit-details-marker{display:none}
.werkzeuge .kurz{font-family:var(--f-mono);font-size:clamp(28px,3.4vw,52px);font-weight:400;letter-spacing:-.02em}
.werkzeuge .titel{font-weight:700;font-size:clamp(22px,2.6vw,40px);letter-spacing:-.02em;line-height:1.1}
.werkzeuge .plus{position:relative;width:28px;height:28px;justify-self:end;align-self:center}
.werkzeuge .plus::before,.werkzeuge .plus::after{content:"";position:absolute;background:var(--schwarz);left:0;right:0;top:13px;height:2px;transition:transform .35s var(--ease)}
.werkzeuge .plus::after{transform:rotate(90deg)}
.werkzeuge details[open] .plus::after{transform:rotate(0)}
.werkzeuge summary:hover .titel{text-decoration:underline;text-decoration-thickness:2px}
.werkzeuge .inhalt{display:grid;grid-template-columns:minmax(0,7ch) 1fr 40px;gap:clamp(12px,2vw,32px);padding-bottom:clamp(24px,3vw,48px)}
.werkzeuge .inhalt>div{grid-column:2;max-width:60ch;font-size:clamp(17px,1.3vw,20px)}
.werkzeuge details[open] summary .kurz{background:var(--gelb);padding:0 8px;justify-self:start}
@media (max-width:700px){.werkzeuge summary,.werkzeuge .inhalt{grid-template-columns:1fr 32px}.werkzeuge .kurz{grid-column:1/-1;font-size:24px}.werkzeuge .inhalt>div{grid-column:1/-1}}

/* ===== Maßstäbe ===== */
.massstaebe .kopfzeile{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,5vw,96px);margin-bottom:clamp(40px,5vw,80px);align-items:end}
.massstaebe .kopfzeile p{color:var(--text-leise-dunkel);font-size:clamp(18px,1.5vw,22px)}
.stufen{list-style:none;padding:0;display:grid}
.stufe{display:grid;grid-template-columns:clamp(110px,16vw,260px) minmax(0,5fr) minmax(0,7fr);gap:clamp(16px,3vw,56px);align-items:end;padding:clamp(16px,2vw,28px) 0;border-top:1px solid #4a4d50}
.stufe:last-child{border-bottom:1px solid #4a4d50}
.stufe .quad{width:calc(var(--sz)*var(--k,1));height:calc(var(--sz)*var(--k,1));min-width:44px;min-height:44px;border:2px solid var(--weiss);display:grid;place-items:center;font-family:var(--f-mono);font-size:clamp(14px,1.2vw,18px);transition:background .3s var(--ease),color .3s var(--ease);justify-self:start}
.stufe:hover .quad{background:var(--gelb);color:var(--schwarz);border-color:var(--gelb)}
.stufe .aufgabe{font-weight:700;font-size:clamp(20px,2vw,30px);line-height:1.12;letter-spacing:-.015em}
.stufe .beispiel{color:var(--text-leise-dunkel);max-width:46ch}
.stufe .beispiel b{color:var(--weiss);font-weight:700}
@media (max-width:800px){.stufe .quad{--k:.44}.massstaebe .kopfzeile{grid-template-columns:1fr}.stufe{grid-template-columns:112px 1fr;align-items:start}.stufe .beispiel{grid-column:2}}

/* ===== Projekte ===== */
.projekte .kopfzeile{margin-bottom:clamp(36px,5vw,72px)}
.tafel{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);background:var(--gelb);color:var(--schwarz);margin-bottom:clamp(36px,5vw,72px)}
.tafel .haupt{padding:clamp(24px,3.4vw,56px);display:grid;gap:18px;align-content:start}
.tafel h3{font-size:clamp(34px,4.6vw,72px);line-height:.98}
.tafel .datenblatt{background:var(--schwarz);color:var(--weiss);padding:clamp(24px,3vw,48px);display:grid;gap:0;align-content:start}
.tafel dl{display:grid;grid-template-columns:minmax(0,11ch) 1fr;gap:0}
.tafel dt,.tafel dd{padding:12px 0;border-bottom:1px solid #4a4d50;margin:0;font-size:clamp(15px,1.1vw,17px)}
.tafel dt{font-family:var(--f-mono);font-size:13px;color:var(--text-leise-dunkel);padding-top:15px}
.tafel .links{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.tafel .btn{background:var(--schwarz);color:var(--gelb);border-color:var(--schwarz)}
.tafel .btn.zweit{background:transparent;color:var(--schwarz)}
.tafel .btn.zweit:hover{background:var(--schwarz);color:var(--gelb)}
.register{list-style:none;padding:0;border-top:1px solid #4a4d50}
.register li{display:grid;grid-template-columns:clamp(60px,9vw,150px) minmax(0,4fr) minmax(0,7fr) auto;gap:clamp(12px,2.4vw,40px);padding:clamp(18px,2vw,28px) 0;border-bottom:1px solid #4a4d50;align-items:baseline}
.register .jahr{font-family:var(--f-mono);font-size:14px;color:var(--text-leise-dunkel)}
.register h3{font-size:clamp(24px,2.4vw,38px)}
.register .ort{display:block;font-family:var(--f-mono);font-size:13px;color:var(--text-leise-dunkel);font-weight:400;letter-spacing:0;margin-top:6px}
.register p{color:#dcdddf;max-width:54ch}
.register .gr{font-family:var(--f-mono);font-size:13px;border:1px solid #6b6e70;padding:3px 8px;white-space:nowrap}
.alle{margin-top:clamp(28px,3vw,48px)}
.alle summary{cursor:pointer;display:inline-flex;gap:12px;align-items:center;font-weight:700;font-size:clamp(18px,1.6vw,24px);list-style:none;border:2px solid var(--gelb);padding:14px 22px;color:var(--gelb)}
.alle summary::-webkit-details-marker{display:none}
.alle summary:hover{background:var(--gelb);color:var(--schwarz)}
.alle[open] summary{background:var(--gelb);color:var(--schwarz)}
.alle .liste{margin-top:28px;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,48px)}
.alle h4{font-family:var(--f-mono);font-weight:400;font-size:13px;color:var(--text-leise-dunkel);margin-bottom:12px}
.alle ul{list-style:none;padding:0;font-size:16px}
.alle li{padding:7px 0;border-bottom:1px solid #4a4d50;display:flex;justify-content:space-between;gap:12px}
.alle li span:last-child{font-family:var(--f-mono);font-size:13px;color:var(--text-leise-dunkel);white-space:nowrap;padding-top:3px}
.alle .sonst{grid-column:1/-1;color:var(--text-leise-dunkel)}
@media (max-width:1000px){.tafel{grid-template-columns:1fr}.register li{grid-template-columns:70px 1fr;gap:8px 16px}.register li p{grid-column:2}.register .gr{display:none}.alle .liste{grid-template-columns:1fr}}

/* ===== Phase Null ===== */
.phase-null .wrap{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:clamp(32px,6vw,112px);align-items:start}
.leerplan{margin-top:clamp(24px,3vw,48px);max-width:380px}
.leerplan svg{width:100%;height:auto}
.leerplan figcaption{margin-top:10px;font-size:13px}
.phase-null .links{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.phase-null p+p{margin-top:1.1em}
@media (max-width:900px){.phase-null .wrap{grid-template-columns:1fr}}

/* ===== Belege ===== */
.belege .wrap{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(32px,6vw,112px)}
.belege blockquote{font-weight:700;font-size:clamp(28px,3.8vw,60px);line-height:1.05;letter-spacing:-.025em;text-wrap:balance}
.belege blockquote cite{display:block;margin-top:24px;font:300 clamp(16px,1.3vw,19px)/1.4 var(--f-text);letter-spacing:0}
.legende{list-style:none;padding:0;align-self:end}
.legende li{display:flex;align-items:baseline;gap:10px;padding:10px 0;border-bottom:1px solid var(--schwarz);font-size:clamp(16px,1.3vw,19px)}
.legende li::after{content:none}
.legende .l{flex:1;border-bottom:1px dotted var(--schwarz);transform:translateY(-4px);min-width:20px}
.legende .w{font-family:var(--f-mono);font-size:14px;font-weight:400;text-align:right}
.partner{margin-top:clamp(36px,5vw,80px);padding-top:24px;border-top:2px solid var(--schwarz);grid-column:1/-1;display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:24px}
.partner h2{font-size:clamp(22px,2vw,30px);letter-spacing:-.015em}
.partner ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px 28px;font-weight:700;font-size:clamp(16px,1.4vw,21px)}
@media (max-width:900px){.belege .wrap{grid-template-columns:1fr}.partner{grid-template-columns:1fr}}

/* ===== Presse ===== */
.presse h2{margin-bottom:clamp(28px,4vw,56px)}
.presse ol{list-style:none;padding:0;border-top:2px solid var(--schwarz)}
.presse li{display:grid;grid-template-columns:clamp(110px,12vw,190px) minmax(0,3fr) minmax(0,8fr);gap:clamp(12px,2.4vw,40px);padding:18px 0;border-bottom:1px solid var(--schwarz);align-items:baseline}
.presse .datum{font-family:var(--f-mono);font-size:13px}
.presse .medium{font-weight:700}
.presse a{text-decoration:none;background:linear-gradient(var(--schwarz),var(--schwarz)) 0 100%/0 2px no-repeat;transition:background-size .3s var(--ease)}
.presse a:hover,.presse a:focus-visible{background-size:100% 2px}
@media (max-width:800px){.presse li{grid-template-columns:1fr;gap:4px}}

/* ===== FAQ ===== */
.faq .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,112px)}
.faq h2{position:sticky;top:96px;align-self:start;font-size:clamp(28px,3.1vw,48px);hyphens:manual}
.faq details{border-top:2px solid var(--schwarz)}
.faq details:last-of-type{border-bottom:2px solid var(--schwarz)}
.faq summary{cursor:pointer;list-style:none;font-weight:700;font-size:clamp(19px,1.8vw,26px);letter-spacing:-.015em;line-height:1.2;padding:22px 44px 22px 0;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:6px;top:50%;width:12px;height:12px;border-right:2px solid var(--schwarz);border-bottom:2px solid var(--schwarz);transform:translateY(-70%) rotate(45deg);transition:transform .3s var(--ease)}
.faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.faq summary:hover{text-decoration:underline;text-decoration-thickness:2px}
.faq .antwort{padding:0 0 26px;max-width:58ch}
.faq .nachtrag{margin-top:24px;color:var(--text-leise);font-size:.95em}
@media (max-width:900px){.faq .wrap{grid-template-columns:1fr}.faq h2{position:static}}

/* ===== Über ===== */
.ueber .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,112px)}
.ueber p+p{margin-top:1.1em}
.ueber .haltung{margin-top:clamp(28px,3vw,44px);padding-top:24px;border-top:2px solid var(--schwarz);font-weight:700;font-size:clamp(20px,2vw,30px);line-height:1.2;letter-spacing:-.015em;max-width:30ch}
@media (max-width:900px){.ueber .wrap{grid-template-columns:1fr}}

/* ===== Kontakt ===== */
.kontakt{background:var(--gelb)}
.kontakt .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,112px)}
.kontakt h2{margin-bottom:20px;font-size:clamp(28px,3vw,46px);hyphens:manual}
.kontakt .direkt{margin-top:clamp(28px,4vw,56px);font-size:17px;display:grid;gap:4px}
.kontakt .direkt a{font-weight:700}
.formular{background:var(--weiss);padding:clamp(22px,3vw,44px);border:2px solid var(--schwarz)}
.formular .reihe{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.field{display:grid;gap:6px;margin-bottom:18px;position:relative}
.field label,.field legend{font-family:var(--f-mono);font-size:13px;font-weight:400}
.field input:not([type=checkbox]):not([type=radio]),.field textarea,.field select{width:100%;border:0;border-bottom:2px solid var(--schwarz);background:var(--grund);padding:13px 12px;border-radius:0;min-height:50px;appearance:none}
.field select{background-image:linear-gradient(45deg,transparent 50%,var(--schwarz) 50%),linear-gradient(135deg,var(--schwarz) 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px;background-repeat:no-repeat;padding-right:36px}
.field textarea{min-height:130px;resize:vertical}
.field input:focus,.field textarea:focus,.field select:focus{outline:3px solid var(--schwarz);outline-offset:0;background:var(--weiss)}
.field-error{display:none;color:#a10000;font-size:15px;font-weight:700}
.field.has-error .field-error{display:block}
.field.has-error input,.field.has-error select,.field.has-error textarea{border-bottom-color:#a10000;background:#fff2f2}
.field .hinweis{font-size:14px;color:var(--text-leise)}
.zustimmung{display:flex;gap:12px;align-items:flex-start;font-size:16px}
.zustimmung input{width:22px;height:22px;margin-top:3px;accent-color:var(--schwarz);flex:none}
.hp{position:absolute;left:-9999px}
.form-status{margin-top:14px;font-weight:700;min-height:1.5em}
#form-wrap.is-sent form{display:none}
#form-success{padding:12px 0}
#form-success h3{font-size:clamp(28px,3vw,44px)}
#form-success:not([hidden]){display:block}
@media (max-width:900px){.kontakt .wrap{grid-template-columns:1fr}.formular .reihe{grid-template-columns:1fr}}

/* ===== Fuß ===== */
.fuss{background:var(--schwarz);color:var(--weiss);padding:clamp(40px,5vw,72px) var(--rand)}
.stempel{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border:1px solid var(--weiss);max-width:1680px;margin-inline:auto}
.stempel>div{padding:18px 20px;border-right:1px solid var(--weiss);font-size:15px;line-height:1.5}
.stempel>div:last-child{border-right:0}
.stempel .mono{display:block;font-size:13px;color:var(--text-leise-dunkel);margin-bottom:6px}
.stempel a{text-decoration:none}
.stempel a:hover{text-decoration:underline}
.fuss .wortmarke{max-width:1680px;margin:0 auto clamp(24px,3vw,40px)}
.fuss .wortmarke svg{width:100%;height:auto}
.fuss .wortmarke path{fill:var(--weiss)}
@media (max-width:900px){.stempel{grid-template-columns:1fr 1fr}.stempel>div{border-bottom:1px solid var(--weiss)}.stempel>div:nth-child(2n){border-right:0}}

/* ===== Einblenden, nur mit JS ===== */
.js .rv{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .8s var(--ease)}
.js .rv.sicht{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .rv{opacity:1;transform:none;transition:none}
  .raum,.btn,.satz,.werkzeuge .plus::before,.werkzeuge .plus::after{transition:none}
}

/* Unterseiten */
.rechtstext{padding:140px var(--rand) 96px;max-width:900px;margin-inline:auto}
.rechtstext h1{font-size:clamp(36px,5vw,72px);margin-bottom:28px}
.rechtstext h2{font-size:clamp(22px,2.2vw,30px);margin:36px 0 10px}
.fehler{min-height:100vh;display:grid;align-content:center;padding:var(--rand);gap:20px;background:var(--gelb)}
.fehler h1{font-size:clamp(48px,9vw,150px)}

/* Matterport-Scan: lädt erst auf Klick */
.scan{margin-top:28px;display:grid;gap:12px;max-width:none}
.scan-hinweis{font-size:14px;color:var(--text-leise);max-width:60ch}
.scan iframe{width:100%;aspect-ratio:16/9;border:2px solid var(--schwarz);background:var(--grund);display:block}
.scan.geladen .scan-knopf{display:none}
.scan-direkt{justify-self:start;font-size:16px}
.scan.geladen .scan-direkt{order:3}

.formular{margin-top:0}
.kontakt .masskette{color:var(--schwarz)}
@media (max-width:1020px){.hud{font-size:12.5px;padding:6px 8px}}
@media (max-width:420px){.marke{padding:6px 8px}.hud{padding:6px 6px}}
@media (max-width:520px){.nav:not(.offen) .sprache{display:none}.kopf{gap:8px}.nav .anfragen{padding:9px 11px;margin-left:2px}}
@media (max-width:400px){.hud .m{display:none}.menue-knopf{padding:9px 9px}}
@media (max-width:340px){.kopf{padding-inline:10px}.marke,.hud{padding:5px 6px}}
.stempel>div{min-width:0;overflow-wrap:anywhere}
.raum{min-width:0}
.beispiele li{flex-wrap:wrap}
@media (max-width:420px){.stempel{grid-template-columns:1fr}.stempel>div{border-right:0}.plan-raeume{padding:8px;gap:8px}}
