/* Die Konstruktion, 3D-Szene und gespeicherten Zustände bleiben unverändert. */
:root{--papier:#f4f6f9;--karte:#fff;--tinte:#142a4c;--gedaempft:#5a6678;--linie:#cfd7e1;--linie-zart:#e4e9f0;--glas:#142a4c;--glas-tief:#283a55;--glas-hell:#e4e9f0;--glas-zart:#f4f6f8;--tief:#142a4c;--auf-tief:#d3dae4;--gold:#d3dae4;--line:#cfd7e1;--muted:#5a6678;--yellow:#d3dae4;--r-karte:0px;--r-buehne:0px;--r-feld:0px;--tiefe-karte:none;--tiefe-feld:none;--tiefe-schwebend:0 2px 8px #142a4c20;font-family:Manrope,Arial,sans-serif}
body{background:var(--papier);font-family:Manrope,Arial,sans-serif}main{padding-top:42px}html .intro{padding-block:8px 26px;border-bottom:1px solid var(--linie);margin-bottom:32px}html .intro .eyebrow{padding:0;background:none;border-radius:0;font-size:12px;letter-spacing:.16em}html .intro h1{font-size:clamp(32px,3.5vw,52px);font-weight:500;letter-spacing:-.045em}html .intro>p{font-size:14px;max-width:380px}html .visual{background:var(--tief);border:0;border-radius:0;box-shadow:none}html .config{border:1px solid var(--linie);border-radius:0;box-shadow:none}html .view-tabs{border-radius:0;background:#283850}html .view-tabs button{border-radius:0}html .view-tabs button[aria-pressed=true]{background:#f4f6f9;color:#142a4c;box-shadow:none}html .visual-top h2{font-size:26px;font-weight:500;letter-spacing:-.025em}html .stage{border-radius:0}html .view-controls button{border-radius:0}html .visual-footer{border-radius:0}html .scene-caption{border-radius:0}html .config-heading h2{font-weight:500;font-size:24px}html .config-heading{border-bottom:1px solid var(--linie);padding-bottom:22px}html .config button,html .config input,html .config select,html .config textarea{border-radius:0}html .config input,html .config select{font-size:16px}html .modus,html .preis-leiste,html .preis-leiste-auf,html .abschluss-karte,html .schritt-knopf,html .schritt-knopf[aria-current=step]{border-radius:0;box-shadow:none}html .modus button[aria-pressed=true]{background:var(--glas);color:white}html .finder-optionen button,html .bauform-kachel,html .katalog-karte,html .specification,html .stueckliste,html .vorgang,html .wa-panel{border-radius:0;box-shadow:none}html .katalog{border-color:var(--linie)}html .katalog h2{font-weight:500;letter-spacing:-.03em}html .katalog-karte{border:1px solid var(--linie)}html .katalog-karte:hover{border-color:var(--glas)}html .katalog-karte .kachel-bild{border-radius:0}html .specification,html .stueckliste{border:1px solid var(--linie)}html .szene-werkzeuge,html .szene-werkzeuge button{border-radius:0}html .helper,html .visual-note,html .modus-hinweis{font-size:12px}html .schritt-vor{background:var(--glas)}html .schritt-knopf[aria-current=step]{background:var(--glas);color:white}html .finder{border-radius:0;box-shadow:none}html .finder-optionen button[aria-pressed=true]{background:var(--glas);color:white}html .intro a,html footer a{min-height:44px}html .intro a{display:inline-flex;align-items:center}html .t-footer{line-height:1.6}
@media(max-width:780px){main{padding-top:25px}html .intro{gap:20px;padding-bottom:24px}html .intro h1{font-size:34px}html .config-heading h2{font-size:22px}html .visual-top h2{font-size:23px}html .intro>p{font-size:13px}}
@media(max-width:520px){html .intro h1{font-size:32px}html .intro{display:block}html .intro>p{margin-top:18px}html .config{padding:20px 16px}html .visual{padding:20px 14px}html .visual-top h2{font-size:22px}}

/* Auch Produktkacheln und Nebenansichten folgen den geraden Kanten. */
html .products button,html .products .kachel-bild,html .teileboard-teil,html .teil-bild,html .abschluss-weg,html .wa-auf,html .wa-kasten,html .visual-top button{border-radius:0;box-shadow:none}

/* Produktfinder und Finder-Seite, G3 24.09.2026 (Befund 1 und seitenübergreifend "linke Kante"). */
/* Inhalt auf der Linie des Logos: gleiche Breite und gleicher Rand wie der Kopf (kopf.css --k-breite, --k-rand), bei jeder Breite. */
main{max-width:var(--k-breite,1760px);padding-inline:var(--k-rand,64px)}
html .finder{grid-template-columns:minmax(0,1fr) minmax(0,1.9fr);gap:56px;padding:34px 36px 36px;margin-bottom:0}
html .finder-lead{font-size:13px}
html .finder-wege{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:24px}
html .finder-kopf #finder-neu{margin-top:0;min-height:52px}
/* Gefüllter Knopf wie .btn der Startseite: gerade Kanten, Glasgrün, Pfeil rechts */
html .finder-weiter{border-radius:0;background:var(--tinte);color:var(--papier);justify-content:space-between;gap:28px;min-height:52px;padding:14px 22px;font-size:13px}
html .finder-weiter::after{content:"↗";font-size:18px;line-height:1;font-weight:400}
html .finder-direkt{margin-top:0}
/* Bildkacheln der ersten Frage; das Bild sitzt unten bündig, der obere Rand der Duschansicht (Glasdicke) fällt weg */
html .finder-optionen button.mit-bild{display:flex;flex-direction:column;justify-content:flex-start;padding:0;overflow:hidden;background:var(--karte)}
html .finder-bild{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:center bottom;border-bottom:1px solid var(--linie)}
html .finder-optionen button.mit-bild .finder-option-titel{padding:12px 14px 0;font-size:13px}
html .finder-optionen button.mit-bild .finder-option-sub{padding:0 14px 14px}
html .finder-optionen button.mit-bild[aria-pressed=true]{background:var(--glas);border-color:var(--glas);color:#fff}
/* Gewählte Kachel ist glasgrün gefüllt (Regel oben); der Untertitel stand dort bisher in #2f415d und war kaum lesbar. */
html .finder-optionen button[aria-pressed=true] .finder-option-sub{color:#dadee4}
html .finder-ergebnis{border-radius:0}
/* Statuszeile, die nur die nächste Frage wiederholt: vorgelesen, nicht doppelt gezeigt */
html .finder-status-still{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;margin:0}
/* Band unter dem Finder mit Direktstart, Gestaltung wie das Konfigurator-Band der Startseite
   (a-planning in home.css; home.css lädt hier nicht, weil es .intro und img global umstellt). */
.finder-band{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.9fr);gap:56px;margin-top:40px;padding:44px 36px;background:var(--tief);color:var(--papier)}
html .finder-band .eyebrow{padding:0;background:none;border-radius:0;color:var(--auf-tief);font-size:12px;letter-spacing:.16em}
.finder-band h2{font-size:30px;font-weight:500;letter-spacing:-.03em;line-height:1.15;margin:12px 0;color:var(--papier);text-wrap:balance}
.finder-band p{font-size:14px;line-height:1.7;color:#cfd3da;max-width:420px}
.finder-band-telefon{margin-top:14px}
.finder-band a{color:var(--papier)}
.finder-band-telefon a{display:inline-flex;align-items:center;min-height:44px;font-weight:600;text-decoration:underline;text-underline-offset:4px}
.finder-band-liste{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-content:center;gap:8px}
.finder-band-liste a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:1px solid #d3dae480;font-size:13px;font-weight:500;text-decoration:none}
#glass-only a{display:inline-flex;align-items:center;min-height:44px;max-width:100%;text-underline-offset:3px}
.finder-band-liste a:hover{background:var(--papier);color:var(--tinte)}
.finder-band a:focus-visible{outline:3px solid var(--papier);outline-offset:3px}
/* Schmal: erst Frage und Kacheln, dann Erklärung und Knöpfe, damit die Auswahl früh im Bild steht */
@media(max-width:850px){html .finder{display:flex;flex-direction:column;gap:0;padding:24px 20px}html .finder-kopf{display:contents}html .finder-rechts{order:1;margin-top:22px}html .finder-kopf .finder-lead+.finder-lead{order:2;margin-top:4px}html .finder-wege{order:3;margin-top:18px}.finder-band{grid-template-columns:1fr;gap:24px;padding:32px 20px}}
@media(max-width:540px){html .finder-optionen{grid-template-columns:repeat(2,minmax(0,1fr))}.finder-band h2{font-size:26px}}

/* 54-BLAU: Vorwärts-Knöpfe bei allen Breiten im gemeinsamen Leitblau. */
:is(html .finder-weiter,html #katalog-anfrage-weg){background:var(--gc-active);border-color:var(--gc-active);color:#fff}
:is(html .finder-weiter,html #katalog-anfrage-weg):is(:hover,:active):not(:disabled):not([aria-disabled=true]){background:color-mix(in srgb,var(--gc-active),#000 15%);border-color:color-mix(in srgb,var(--gc-active),#000 15%);color:#fff}
:is(html .finder-weiter,html #katalog-anfrage-weg):focus-visible{outline:3px solid var(--gc-active);outline-offset:3px}
:is(html .finder-weiter,html #katalog-anfrage-weg):is(:disabled,[aria-disabled=true]){background:var(--gc-active);border-color:var(--gc-active);border-style:dashed;color:#fff;opacity:1;cursor:not-allowed}
