/* TRAPP Vorschau, Designlinie: somervilles.co.uk (Creme-Insel, zwei Schnitte, eine Mikro-Akzentfarbe) */
@font-face{font-family:"Switzer";src:url("/assets/fonts/switzer-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Switzer";src:url("/assets/fonts/switzer-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}

:root{
  --creme:#fbf8f1;--creme-2:#efebe1;--creme-3:#e4dfd2;--weiss:#fff;
  --guss:#1f2225;--guss-2:#2c3034;--guss-linie:#3a3f44;
  --text:#43464a;--meta:#66696d;--linie:#d9d4c7;
  --blau:#005287;--blau-hell:#7fbbe4;
  --rand:30px;--radius-s:10px;--radius-l:20px;
  --wrap:1620px;--innen:min(100% - 46px,1500px);
  --ease:cubic-bezier(.22,.61,.36,1);
  --kopf-h:92px;
}
@media (min-width:768px){:root{--rand:40px;--innen:min(100% - 96px,1500px)}}
@media (min-width:1400px){:root{--rand:64px;--innen:min(100% - 154px,1500px)}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;background:var(--creme);color:var(--text);font-family:"Switzer",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:17px;line-height:1.6;font-weight:400;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4{font-weight:500;color:var(--guss);margin:0;line-height:1.1;letter-spacing:-.018em}
h1{font-size:clamp(2.65rem,5.6vw,5.2rem);letter-spacing:-.028em;line-height:1.04}
h2{font-size:clamp(1.7rem,3.3vw,3.2rem);letter-spacing:-.022em}
h3{font-size:clamp(1.3rem,1.8vw,1.6rem);line-height:1.2}
p{margin:0 0 1em}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--blau);outline-offset:3px}
:focus:not(:focus-visible){outline:none}
[hidden]{display:none!important}
.nur-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.nur-sr:focus{position:fixed!important;left:12px;top:12px;width:auto;height:auto;clip:auto;z-index:200;background:var(--guss);color:#fff;padding:10px 16px;border-radius:999px}

/* Insel-Prinzip der Referenz */
.insel{width:calc(100% - 2*var(--rand));margin-inline:auto}
@media (max-width:767px){.insel{width:calc(100% - 20px)}}
.innen{width:var(--innen);margin-inline:auto}
.flaeche-dunkel{background:var(--guss);color:#d6d6d6;border-radius:var(--radius-l)}
.flaeche-dunkel h2,.flaeche-dunkel h3{color:#fbf8f1}
.flaeche-creme2{background:var(--creme-2);border-radius:var(--radius-l)}
@media (max-width:767px){.flaeche-dunkel,.flaeche-creme2{border-radius:var(--radius-s)}}
.abschnitt{padding-block:clamp(64px,8vw,120px)}
.kicker{font-size:15.5px;letter-spacing:.01em;color:var(--meta);margin:0 0 18px;display:flex;align-items:center;gap:12px}
.kicker::before{content:"";width:22px;height:2px;background:var(--blau);flex:none}
.flaeche-dunkel .kicker{color:#b9bcbf}
.flaeche-dunkel .kicker::before{background:var(--blau-hell)}
.lead{font-size:clamp(1.08rem,1.35vw,1.25rem);line-height:1.6;color:var(--text);max-width:60ch}
.flaeche-dunkel .lead,.flaeche-dunkel p{color:#d6d6d6}

/* Knöpfe: Pille mit Pfeil, wie die Referenz */
.knopf{display:inline-flex;align-items:center;gap:12px;min-height:52px;padding:0 24px;border-radius:999px;
  font-weight:500;font-size:16.5px;text-decoration:none;border:1px solid transparent;cursor:pointer;
  transition:background .2s ease-in-out,color .2s ease-in-out,border-color .2s ease-in-out;white-space:nowrap}
.knopf svg{flex:none;color:var(--blau);transition:transform .3s var(--ease)}
.knopf:hover svg{transform:translateX(4px)}
.knopf--dunkel{background:var(--guss);color:var(--creme)}
.knopf--dunkel svg{color:var(--blau-hell)}
.knopf--dunkel:hover{background:#000}
.knopf--hell{background:var(--creme);color:var(--guss)}
.knopf--hell:hover{background:#fff}
.knopf--glas{background:rgba(39,39,39,.7);border-color:rgba(255,255,255,.18);color:#fff}
.knopf--glas svg{color:var(--blau-hell)}
.knopf--glas:hover{background:var(--creme);color:var(--guss)}
.knopf--glas:hover svg{color:var(--blau)}
.knopf--linie{border-color:var(--guss);color:var(--guss);background:transparent}
.knopf--linie:hover{background:var(--guss);color:var(--creme)}
.knopfreihe{display:flex;flex-wrap:wrap;gap:12px;align-items:center}

/* Umgekehrter Unterstrich (Signatur der Referenz) */
.ulink{text-decoration:none;position:relative;display:inline-flex;align-items:center;min-height:44px}
.ulink::after{content:"";position:absolute;left:0;right:0;bottom:9px;height:1px;background:currentColor;transform-origin:left;transition:transform .3s ease}
.ulink:hover::after{transform:scaleX(0);transform-origin:right}
.ulink--blau::after{height:2px;background:var(--blau)}
.flaeche-dunkel .ulink--blau::after,.fuss .ulink--blau::after{background:var(--blau-hell)}

/* ---------- Kopf ---------- */
.kopf{position:fixed;top:0;left:0;right:0;z-index:50;transition:background-color .3s ease,box-shadow .3s ease}
.kopf__innen{transition:padding .3s ease,min-height .3s ease}
/* Kopf scrollt mit (Axel 09.11.2026): fest oben, ab Scroll dunkle Leiste */
.kopf.is-fest{background:rgba(31,34,37,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 1px 0 rgba(255,255,255,.06),0 8px 24px rgba(0,0,0,.18)}
.kopf.is-fest .kopf__innen{min-height:0;padding-block:8px}
.kopf--hell.is-fest .kopf__nav a,.kopf--hell.is-fest .kopf__nav button,.kopf--hell.is-fest .burger,.kopf--hell.is-fest .suche-knopf{text-shadow:none}
.kopf--hell.is-fest .burger svg,.kopf--hell.is-fest .suche-knopf svg,.kopf--hell.is-fest .marke__wort{filter:none}
html{scroll-padding-top:calc(var(--kopf-jetzt,0px) + 12px)}
.kopf__innen{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;
  width:calc(100% - 2*var(--rand));margin-inline:auto;padding:22px clamp(20px,3vw,48px);min-height:var(--kopf-h)}
@media (max-width:767px){.kopf__innen{width:calc(100% - 20px);padding:14px 16px}}
.kopf__links{display:flex;align-items:center;gap:clamp(14px,2vw,26px)}
.kopf__rechts{display:flex;align-items:center;justify-content:flex-end;gap:14px}
.burger{display:inline-flex;align-items:center;gap:12px;min-height:48px;padding:0 4px;background:none;border:0;cursor:pointer;color:inherit;font-weight:500;font-size:16.5px}
.burger__striche{width:22px;height:14px;position:relative;display:block}
.burger__striche::before,.burger__striche::after,.burger__striche span{content:"";position:absolute;left:0;right:0;height:1.6px;background:currentColor;border-radius:2px}
.burger__striche::before{top:0}.burger__striche span{top:6px}.burger__striche::after{bottom:0}
.kopf__nav{display:flex;gap:clamp(14px,1.8vw,26px);list-style:none;margin:0;padding:0}
.kopf__nav a,.kopf__nav button{display:inline-flex;align-items:center;min-height:48px;text-decoration:none;font-weight:500;font-size:16.5px;background:none;border:0;cursor:pointer;padding:0;color:inherit;position:relative}
.kopf__nav a::after,.kopf__nav button::after{content:"";position:absolute;left:0;right:0;bottom:10px;height:2px;background:var(--blau-hell);transform:scaleX(0);transform-origin:right;transition:transform .3s ease}
.kopf__nav a:hover::after,.kopf__nav button:hover::after,.kopf__nav [aria-current="page"]::after{transform:scaleX(1);transform-origin:left}
.marke{display:flex;align-items:center;gap:14px;text-decoration:none}
.marke__zeichen{width:auto;height:52px;border-radius:3px}
.marke__wort{height:21px;width:auto}
.suche-knopf{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:none;border:0;cursor:pointer;color:inherit}
.kopf--hell{color:#fff}
.kopf--dunkel{position:sticky;color:var(--guss);background:var(--creme)}
.kopf--dunkel.is-fest{background:rgba(251,248,241,.96);box-shadow:0 1px 0 var(--linie),0 8px 24px rgba(31,34,37,.08)}
.kopf--dunkel .kopf__nav a::after,.kopf--dunkel .kopf__nav button::after{background:var(--blau)}
@media (max-width:1279px){.kopf__nav{display:none}}
.marke img{flex:none;max-width:none}
@media (max-width:767px){.kopf .knopf{display:none}.marke__zeichen{height:44px}.marke__wort{height:17px}.burger__wort{display:none}}

/* ---------- Hero (Vollbild, Insel, unten gerundet) ---------- */
.hero{position:relative;isolation:isolate;overflow:hidden;background:#15181b;border-radius:0 0 var(--radius-l) var(--radius-l);
  min-height:min(92svh,1000px);display:grid;align-items:end}
@media (min-width:1024px){.hero{min-height:min(88svh,1020px)}}
@media (max-width:767px){.hero{border-radius:0 0 var(--radius-s) var(--radius-s);min-height:92svh}}
.hero picture{display:contents}
.hero__foto{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%;z-index:-2;filter:brightness(1.04) saturate(1.04)}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(10,12,14,.30) 0%,rgba(10,12,14,0) 24%),
             linear-gradient(0deg,rgba(10,12,14,.62) 0%,rgba(10,12,14,.52) 30%,rgba(10,12,14,.28) 56%,rgba(10,12,14,0) 80%)}
@media (max-width:767px){.hero::before{background:linear-gradient(180deg,rgba(10,12,14,.30) 0%,rgba(10,12,14,0) 22%),
             linear-gradient(0deg,rgba(10,12,14,.78) 0%,rgba(10,12,14,.62) 34%,rgba(10,12,14,.3) 58%,rgba(10,12,14,0) 80%)}}
.hero__innen,.grossbild__text{text-shadow:0 1px 2px rgba(0,0,0,.35),0 2px 22px rgba(0,0,0,.4)}
.hero__innen .knopf,.grossbild__text .knopf{text-shadow:none}
@media (min-width:760px){.hero--kontakt .hero__foto{object-position:50% 100%}}
.hero__innen{width:calc(100% - 2*var(--rand));margin-inline:auto;padding:0 clamp(20px,3vw,48px) clamp(34px,4vw,54px);color:#fff}
@media (max-width:767px){.hero__innen{width:calc(100% - 20px);padding-inline:16px}}
.hero h1{color:#fff;max-width:15ch}
.hero__kicker{color:#fff;font-size:15.5px;margin:0 0 18px;display:flex;gap:12px;align-items:center}
.hero__kicker::before{content:"";width:22px;height:2px;background:var(--blau-hell)}
.hero__unten{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:22px 40px;margin-top:clamp(26px,3vw,40px);
  padding-top:clamp(22px,2.4vw,30px);border-top:1px solid rgba(255,255,255,.2)}
.hero__satz{margin:0;max-width:52ch;font-size:clamp(1.05rem,1.3vw,1.2rem);color:rgba(255,255,255,.93)}
.hero__quelle{font-size:15.5px;color:rgba(255,255,255,.8);margin:16px 0 0}
.hero--seite{min-height:min(64svh,640px)}
.hero--seite h1{max-width:18ch}

/* ---------- Brotkrume ---------- */
.krume{padding-top:22px}
.krume ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 10px;font-size:15.5px;color:var(--meta)}
.krume li+li::before{content:"";display:inline-block;width:5px;height:5px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg);margin:0 10px 2px 0}
.krume li{display:inline-flex;align-items:center;min-height:44px;line-height:1.3}
.krume li+li::before{margin-bottom:0}
@media (max-width:767px){.krume--produkt li[aria-current]{display:none}}
.krume a{text-decoration:none;display:inline-flex;align-items:center;min-height:44px}.krume a:hover{color:var(--guss)}

/* ---------- Register (Startseite, Liste mit Bildwechsel) ---------- */
.reg{display:grid;gap:40px}
@media (min-width:1024px){.reg{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(40px,6vw,110px);align-items:start}}
.reg__kopf{display:grid;gap:18px;margin-bottom:clamp(30px,4vw,54px)}
@media (min-width:1024px){.reg__kopf{grid-template-columns:1fr 1fr;align-items:start}}
.reg__liste{list-style:none;margin:0;padding:0;border-top:1px solid var(--linie)}
.reg__zeile{border-bottom:1px solid var(--linie)}
.reg__link{display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:18px;padding:20px 0;text-decoration:none;min-height:72px}
.reg__buchst{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--linie);font-weight:500;color:var(--guss);font-size:17px;transition:background .3s ease,color .3s ease,border-color .3s ease}
.reg__name{font-size:clamp(1.3rem,2.1vw,1.9rem);font-weight:500;color:var(--guss);letter-spacing:-.015em;line-height:1.15}
.reg__unter{display:block;font-size:15.5px;font-weight:400;color:var(--meta);letter-spacing:0;margin-top:4px}
.reg__zahl{font-size:15.5px;color:var(--meta);white-space:nowrap;display:flex;align-items:center;gap:12px}
.reg__zahl svg{color:var(--blau);transition:transform .3s var(--ease)}
.reg__link:hover .reg__buchst,.reg__link[data-aktiv="ja"] .reg__buchst{background:var(--guss);color:var(--creme);border-color:var(--guss)}
.reg__link:hover .reg__zahl svg{transform:translateX(5px)}
.reg__buehne{position:sticky;top:calc(var(--kopf-jetzt,0px) + 30px);display:none;margin:0}
@media (min-width:1024px){.reg__buehne{display:block}}
.reg__bild{position:relative;aspect-ratio:4/5;max-width:420px;margin-left:auto;border-radius:15px;overflow:hidden;background:var(--weiss)}
.reg__bild img{position:absolute;left:8%;top:10%;width:84%;height:80%;object-fit:contain;opacity:0;transition:opacity .45s ease}
.reg__bild img[data-an="ja"]{opacity:1}
.reg__bild figcaption{position:absolute;left:22px;bottom:18px;font-size:15.5px;color:var(--meta)}
.reg__mini{display:none}
@media (max-width:1023px){
  .reg__link{grid-template-columns:64px 1fr auto}
  .reg__mini{display:block;width:64px;height:64px;border-radius:10px;background-color:#fff;background-repeat:no-repeat;background-position:center;background-size:contain;background-origin:content-box;padding:6px}
  .reg__buchst{display:none}
}

/* ---------- Bildkarten mit Ecken-Morph (Signatur der Referenz) ---------- */
.morph{position:relative;display:block;overflow:hidden;border-radius:15px;transition:border-radius .4s ease;background:var(--creme-3)}
.morph img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.morph__plus{position:absolute;right:16px;bottom:16px;width:48px;height:48px;border-radius:50%;background:#fff;display:grid;place-items:center;transition:background .4s ease}
.morph__plus::before,.morph__plus::after{content:"";position:absolute;width:14px;height:1.6px;background:var(--blau);transition:background .4s ease}
.morph__plus::after{transform:rotate(90deg)}
a:hover>.morph,a:focus-visible>.morph,.morph:hover{border-bottom-right-radius:35px}
a:hover>.morph img,.morph:hover img{transform:scale(1.06)}
a:hover>.morph .morph__plus{background:var(--guss)}
a:hover>.morph .morph__plus::before,a:hover>.morph .morph__plus::after{background:#fff}

/* ---------- Fertigung (dunkle Insel, drei Bildspalten) ---------- */
.dreier{display:grid;gap:34px;margin-top:clamp(40px,5vw,72px)}
@media (min-width:900px){.dreier{grid-template-columns:repeat(3,1fr);gap:30px}}
.dreier a{text-decoration:none;display:block}
.dreier .morph{aspect-ratio:4/3}
.dreier h3{margin:22px 0 10px}
.dreier p{margin:0;font-size:16.5px}
.zweier-kopf{display:grid;gap:22px}
@media (min-width:1024px){.zweier-kopf{grid-template-columns:1fr 1fr;gap:64px;align-items:start}}

/* ---------- Projekte ---------- */
.projekte{display:grid;gap:clamp(34px,4vw,54px);margin-top:clamp(90px,10vw,150px)}
.projekte__titel{max-width:62ch}
.projekte__titel p{margin:22px 0 30px}
.projekte__raster{display:grid;gap:34px}
@media (min-width:900px){.projekte__raster{grid-template-columns:repeat(3,1fr);gap:30px}}
.projekt{text-decoration:none;display:block}
.projekt .morph{aspect-ratio:4/3}
.projekt h3{margin:22px 0 10px;font-size:clamp(1.2rem,1.6vw,1.45rem)}
.projekt__meta{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 0;font-size:15.5px}
.projekt__meta li{color:#b9bcbf}
.projekt__meta li:first-child{color:#fbf8f1;font-weight:500}
.projekt__meta li+li::before{content:"";display:inline-block;width:1px;height:13px;background:#6d7176;margin:0 11px;vertical-align:-1px}

/* ---------- Großbild mit Text (full-width-media-block) ---------- */
.grossbild{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--radius-l);min-height:clamp(520px,62vw,780px);display:grid;align-items:end;background:#222}
@media (max-width:767px){.grossbild{border-radius:var(--radius-s);min-height:620px}}
.grossbild img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 85%;z-index:-2}
.grossbild::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(10,12,14,.62) 0%,rgba(10,12,14,.4) 34%,rgba(10,12,14,0) 66%)}
.grossbild__text{padding:clamp(26px,5vw,72px);color:#fff;max-width:760px}
.grossbild h2{color:#fff;margin-bottom:18px}
.grossbild p{color:rgba(255,255,255,.92);font-size:clamp(1.05rem,1.3vw,1.18rem)}

/* ---------- Text-Media ---------- */
.textmedia{display:grid;gap:36px;align-items:center}
@media (min-width:900px){.textmedia{grid-template-columns:1.05fr 1fr;gap:clamp(40px,6vw,100px)}}
.textmedia .morph{aspect-ratio:5/4}
.textmedia h2{margin-bottom:22px}

/* ---------- Bewertungen (Google-Look, erlaubte Kartenausnahme) ---------- */
.bew__kopf{display:grid;gap:18px;margin-bottom:34px}
@media (min-width:1024px){.bew__kopf{grid-template-columns:1fr auto;align-items:start}}
.bew__schnitt{display:flex;align-items:center;gap:14px;font-size:16.5px;color:var(--text)}
.bew__schnitt b{font-size:2.3rem;font-weight:500;color:var(--guss);letter-spacing:-.02em}
.rvs{display:grid;gap:30px}
@media (min-width:900px){.rvs{grid-template-columns:repeat(3,1fr);gap:30px}}
.rv{border-top:1px solid var(--guss);padding:22px 0 0}
.rv__kopf{display:flex;align-items:center;gap:10px}
.rv__ini{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#e8eaed;color:#3c4043;font-weight:500}
.rv__meta{display:flex;flex-direction:column;line-height:1.25;flex:1 1 auto}
.rv__name{font-size:16px;color:#202124;font-weight:500}
.rv__zeit{font-size:15.5px;color:#5f6368}
.rv__sterne{display:flex;gap:2px;color:#B87A00;margin:12px 0 8px}
.rv__text{margin:0;color:#3c4043;font-size:16px;line-height:1.55}
.rv__hinweis{font-size:15.5px;color:var(--meta);margin:6px 0 0}
.bew__fuss{font-size:15.5px;color:var(--meta);margin-top:18px;max-width:80ch}

/* ---------- FAQ ---------- */
.faq-innen{display:grid;gap:28px 64px;align-items:start}
@media (min-width:900px){.faq-innen{grid-template-columns:1fr 1.35fr}.faq-kopf{position:sticky;top:calc(var(--kopf-jetzt,0px) + 40px)}}
.faq-kopf h2{margin-bottom:18px}
.tel-fett{font-size:clamp(1.3rem,2vw,1.6rem);font-weight:500;color:var(--guss);text-decoration:none;display:inline-flex;align-items:center;min-height:48px}
.frage{border-top:1px solid var(--linie)}
.frage:last-child{border-bottom:1px solid var(--linie)}
.frage summary{display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:68px;padding:18px 0;cursor:pointer;list-style:none;font-weight:500;color:var(--guss);font-size:1.12rem;line-height:1.4}
.frage summary::-webkit-details-marker{display:none}
.frage summary:hover{color:var(--blau)}
.frage-zeichen{position:relative;flex:0 0 18px;height:18px}
.frage-zeichen::before,.frage-zeichen::after{content:"";position:absolute;left:0;top:8px;width:18px;height:2px;background:var(--blau);transition:transform .3s ease}
.frage-zeichen::after{transform:rotate(90deg)}
.frage[open] .frage-zeichen::after{transform:rotate(0)}
.frage p{margin:0;padding:0 40px 24px 0;max-width:64ch}

/* ---------- Fuß ---------- */
.fuss{position:relative;overflow:hidden;background:var(--guss);color:#c9cbcd;border-radius:var(--radius-l) var(--radius-l) 0 0;margin-top:clamp(64px,8vw,120px);padding:clamp(64px,8vw,110px) 0 34px}
@media (max-width:767px){.fuss{border-radius:var(--radius-s) var(--radius-s) 0 0;padding-bottom:100px}}
.fuss__ruf{font-size:clamp(1.7rem,3.2vw,3rem);color:#fbf8f1;font-weight:500;letter-spacing:-.02em;line-height:1.15;margin:0 0 clamp(36px,4vw,56px);max-width:24ch}
.fuss__ruf a{text-decoration:none;position:relative;display:inline;color:#fbf8f1}
.fuss__ruf a::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--blau-hell);transform-origin:left;transition:transform .3s ease}
.fuss__ruf a:hover::after{transform:scaleX(0);transform-origin:right}
.fuss__spalten{display:grid;gap:34px;position:relative;z-index:1}
@media (min-width:900px){.fuss__spalten{grid-template-columns:1.2fr 1fr 1fr 1fr}}
.fuss__titel{font-size:15.5px;color:#9ea2a6;font-weight:400;margin:0 0 14px;letter-spacing:.01em}
.fuss ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.fuss a{text-decoration:none;color:#e4e5e6;display:inline-flex;min-height:44px;align-items:center}
.fuss a:hover{color:#fff}
.fuss address{font-style:normal;line-height:1.7;color:#d6d6d6}
.fuss__unten{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center;justify-content:space-between;margin-top:clamp(70px,9vw,150px);padding-top:22px;border-top:1px solid var(--guss-linie);font-size:15.5px;color:#a9adb1}
.fuss__unten a{min-height:44px}
.fuss__recht{display:flex;flex-wrap:wrap;gap:4px 22px}
.strivera-credit{display:inline-block;font-size:1.05rem;text-decoration:none;color:#a9adb1;letter-spacing:.01em;opacity:.95;transition:opacity .2s ease}
.strivera-credit:hover,.strivera-credit:focus-visible{opacity:1;text-decoration:underline;text-underline-offset:3px}
.strivera-credit__mark{font-weight:700;letter-spacing:-.02em;color:#fff}
.strivera-credit__dot{color:#3B72E0;font-weight:700}
.demo-hinweis{font-size:15.5px;color:#9ea2a6;margin:18px 0 0;max-width:90ch;position:relative;z-index:1}

/* ---------- Sticky-Kapsel (Baustein, unverändert) ---------- */
.stky{position:fixed;left:14px;right:14px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:60;display:flex;align-items:center;gap:8px;padding:7px;border-radius:999px;
  background:rgba(31,34,37,.58);-webkit-backdrop-filter:blur(16px) saturate(150%);backdrop-filter:blur(16px) saturate(150%);
  box-shadow:0 16px 34px -18px rgba(0,0,0,.78);transform:translateY(150%);transition:transform .34s cubic-bezier(.22,.61,.36,1)}
.stky.is-an{transform:none}
.stky.is-an.is-weg{transform:translateY(150%)}
.stky__tel{flex:0 0 auto;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:#fff;border:1px solid rgba(255,255,255,.34);background:transparent}
.stky__cta{flex:1 1 auto;min-height:48px;border-radius:999px;display:flex;align-items:center;justify-content:center;gap:8px;padding:0 16px;background:var(--blau);color:#fff;font-weight:500;font-size:16.5px;white-space:nowrap;text-decoration:none}
@media (min-width:1020px){.stky{display:none}}


/* =================================================================
   REGISTER-MENÜ (Mega-Menü): Vollbild-Flyout, drei Spalten + Suche
   ================================================================= */
body[data-menue="offen"]{overflow:hidden}
.menue:focus{outline:none}
.menue{position:fixed;inset:0;z-index:100;background:var(--creme);visibility:hidden;opacity:0;transition:opacity .35s ease,visibility 0s linear .35s;display:flex;flex-direction:column}
.menue[data-offen="ja"]{visibility:visible;opacity:1;transition:opacity .35s ease}
.menue__oben{display:flex;align-items:center;gap:clamp(14px,2vw,30px);padding:18px clamp(16px,3vw,48px);border-bottom:1px solid var(--linie);flex:none}
.menue__zu{display:inline-flex;align-items:center;gap:12px;background:none;border:0;cursor:pointer;font-weight:500;font-size:16.5px;color:var(--guss);min-height:48px;padding:0}
.menue__zu-kreis{width:48px;height:48px;border-radius:50%;background:var(--guss);color:#fff;display:grid;place-items:center}
.menue__such{flex:1 1 auto;display:flex;align-items:center;gap:14px;max-width:760px;margin-inline:auto;border-bottom:1.5px solid var(--guss);min-height:56px}
.menue__such svg{flex:none;color:var(--guss)}
.menue__such input{flex:1;border:0;background:transparent;font:inherit;font-size:clamp(1.1rem,1.8vw,1.6rem);color:var(--guss);padding:8px 0;min-width:0;outline:none}
.menue__such input::placeholder{color:#8b8d90}
.menue__tel{font-weight:500;color:var(--guss);text-decoration:none;white-space:nowrap;min-height:48px;display:inline-flex;align-items:center}
@media (max-width:900px){.menue__tel{display:none}}
.menue__koerper{flex:1 1 auto;min-height:0;display:grid;grid-template-columns:minmax(330px,1.1fr) minmax(220px,.8fr) minmax(0,2fr)}
.menue__spalte{overflow-y:auto;padding:clamp(24px,3vw,44px) clamp(18px,2.4vw,40px);overscroll-behavior:contain}
.menue__spalte+.menue__spalte{border-left:1px solid var(--linie)}
.menue__label{font-size:13.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--meta);margin:0 0 16px}
.gruppen{list-style:none;margin:0;padding:0}
.gruppen{display:grid;gap:4px}
.gruppe-knopf{display:grid;grid-template-columns:56px minmax(0,1fr) 34px;align-items:center;column-gap:16px;width:100%;text-align:left;background:transparent;border:0;border-radius:14px;cursor:pointer;
  padding:8px 12px 8px 8px;color:var(--guss);text-decoration:none;transition:background .25s ease}
.gruppe-bild{width:56px;height:56px;border-radius:10px;background:#fff;display:block;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(31,34,37,.06);transition:border-radius .3s ease}
.gruppe-bild img{position:absolute;left:6%;top:6%;width:88%;height:88%;object-fit:contain}
.gruppe-text{display:flex;flex-direction:column;gap:2px;min-width:0}
.gruppe-knopf .gruppe-b{font-size:13.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--meta);font-weight:500;line-height:1.3}
.gruppe-knopf .gruppe-n{font-size:clamp(1.15rem,1.35vw,1.32rem);font-weight:500;letter-spacing:-.012em;line-height:1.2;text-wrap:balance}
.gruppe-pfeil{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:var(--guss);border:1px solid var(--linie);opacity:0;transform:translateX(-6px);transition:opacity .25s ease,transform .3s var(--ease),background .25s ease,color .25s ease,border-color .25s ease}
.gruppe-pfeil svg{width:16px;height:16px}
.gruppe-knopf:hover{background:var(--creme-2)}
.gruppe-knopf:hover .gruppe-pfeil{opacity:1;transform:none}
.gruppe-knopf[aria-selected="true"]{background:#fff;box-shadow:0 1px 2px rgba(31,34,37,.06),0 10px 24px -18px rgba(31,34,37,.35)}
.gruppe-knopf[aria-selected="true"] .gruppe-bild{border-bottom-right-radius:20px}
.gruppe-knopf[aria-selected="true"] .gruppe-b{color:var(--blau)}
.gruppe-knopf[aria-selected="true"] .gruppe-pfeil{opacity:1;transform:none;background:var(--guss);border-color:var(--guss);color:#fff}
.menue__alle{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:26px 0 0;padding:18px 20px;border-radius:14px;background:var(--guss);color:#fbf8f1;text-decoration:none;transition:background .2s ease}
.menue__alle span{display:flex;flex-direction:column;gap:2px;font-size:15.5px;color:#c9cbcd}
.menue__alle b{font-weight:500;font-size:17px;color:#fbf8f1}
.menue__alle svg{color:var(--blau-hell);flex:none;transition:transform .3s var(--ease)}
.menue__alle:hover{background:#000}.menue__alle:hover svg{transform:translateX(4px)}
.menue__label--seiten{margin:30px 0 6px}
.menue__seiten{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;column-gap:20px;border-top:1px solid var(--linie)}
.menue__seiten li{border-bottom:1px solid var(--linie)}
.menue__seiten a{display:flex;align-items:center;min-height:48px;text-decoration:none;font-weight:500;color:var(--guss);font-size:16.5px}
.menue__seiten a:hover{color:var(--blau)}
.unter{display:none}
.unter[data-aktiv="ja"]{display:block}
.unter__titel{font-size:1.35rem;margin:0 0 6px;font-weight:500;color:var(--guss);line-height:1.2;letter-spacing:-.018em}
.unter__text{font-size:16px;color:var(--text);margin:0 0 22px;max-width:36ch}
.unter__liste{list-style:none;margin:0;padding:0;border-top:1px solid var(--linie)}
.unter__liste li{border-bottom:1px solid var(--linie)}
.unter__liste a{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;min-height:56px;padding:8px 0;text-decoration:none;color:var(--guss);font-weight:500}
.kz{display:inline-grid;place-items:center;min-width:46px;height:30px;padding:0 7px;border-radius:6px;background:var(--guss);color:#fff;font-size:13.5px;letter-spacing:.04em;text-transform:uppercase;font-weight:500}
.kz--blau{background:var(--blau)}
.unter__liste .anz{color:var(--meta);font-weight:400;font-size:15.5px}
.unter__liste a:hover{color:var(--blau)}
.unter__alle{margin-top:24px}
.tafel{display:none}
.tafel[data-aktiv="ja"]{display:block}
.tafel__kopf{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin-bottom:18px}
.tafel__kopf a{font-weight:500;color:var(--guss);font-size:16.5px}
.tafel__abschnitt+.tafel__abschnitt{margin-top:26px}
.tafel__abschnitt--strich{border-top:2px solid var(--guss);padding-top:22px}
.unter__liste li.strich{border-top:2px solid var(--guss);margin-top:14px}
.katalog-unter--strich{border-top:2px solid var(--guss);padding-top:10px;margin-top:40px}
.tafel__titel{font-size:15.5px;font-weight:500;color:var(--meta);margin:0 0 10px;letter-spacing:0}
.kacheln{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:10px}
.kachel{display:flex;flex-direction:column;text-decoration:none;color:var(--guss);border-radius:10px;transition:border-radius .3s ease}
.kachel__bild{position:relative;aspect-ratio:1;background:#fff;border-radius:10px;overflow:hidden;transition:border-radius .3s ease}
.kachel__bild img{position:absolute;left:5%;top:5%;width:90%;height:90%;object-fit:contain;transition:transform .35s ease}
.kachel:hover .kachel__bild{border-bottom-right-radius:24px}
.kachel:hover .kachel__bild img{transform:scale(1.07)}
.kachel__nr{font-size:13.5px;font-weight:500;letter-spacing:.03em;text-transform:uppercase;margin-top:7px;line-height:1.3}
.kachel:hover .kachel__nr{color:var(--blau)}
/* Suchtreffer */
.treffer{display:none;flex:1 1 auto;min-height:0;overflow-y:auto;padding:clamp(24px,3vw,44px) clamp(18px,3vw,48px)}
.menue[data-suche="ja"] .treffer{display:block}
.menue[data-suche="ja"] .menue__koerper{display:none}
.treffer__info{font-size:16.5px;color:var(--meta);margin:0 0 18px}
.treffer .kacheln{grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:14px}
.treffer__name{font-size:15.5px;font-weight:400;color:var(--meta);text-transform:none;letter-spacing:0;line-height:1.35;margin-top:2px}
/* Mobil: Akkordeon statt drei Spalten */
@media (max-width:1023px){
  .menue__koerper{display:block;overflow-y:auto}
  .menue__spalte{overflow:visible;padding:18px 16px}
  .menue__spalte+.menue__spalte{border-left:0}
  .menue__spalte--unter,.menue__spalte--tafel{display:none}
  .gruppe-knopf{grid-template-columns:52px minmax(0,1fr) 34px;padding:8px 8px 8px 6px}
  .gruppe-bild{width:52px;height:52px}
  .gruppe-pfeil{opacity:1;transform:rotate(90deg)}
  .gruppe-knopf[aria-selected="true"]{background:transparent;box-shadow:none}
  .gruppe-knopf[aria-selected="true"] .gruppe-pfeil{background:transparent;border-color:var(--linie);color:var(--guss)}
  .gruppe-knopf[aria-selected="true"] .gruppe-bild{border-bottom-right-radius:10px}
  .gruppe-knopf[aria-selected="true"] .gruppe-b{color:var(--meta)}
  .gruppen li:has(.gruppe-mobil[data-aktiv="ja"]) .gruppe-pfeil{transform:rotate(-90deg);background:var(--guss);border-color:var(--guss);color:#fff}
  .gruppen li{border-bottom:1px solid var(--linie)}
  .gruppe-mobil{display:none;padding:6px 0 18px}
  .gruppe-mobil[data-aktiv="ja"]{display:block}
  .gruppe-mobil .kacheln{grid-template-columns:repeat(3,1fr);gap:8px}
  .gruppe-mobil__titel{font-size:15.5px;font-weight:500;color:var(--meta);margin:14px 0 8px}
  .menue__oben{flex-wrap:wrap;padding:12px 14px;gap:10px}
  .menue__zu-wort{display:none}
  .menue__such{order:3;flex-basis:100%;margin:0}
  .menue__such input{font-size:1.1rem}
}
@media (min-width:1024px){.gruppe-mobil{display:none!important}}

/* =========================== Katalog =========================== */
.filter{position:sticky;top:var(--kopf-jetzt,0px);z-index:30;background:rgba(251,248,241,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--linie)}
.filter__innen{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px;padding:14px 0}
.chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;flex:1 1 520px}
.chips::-webkit-scrollbar{display:none}
@media (min-width:1020px){.chips{flex-wrap:wrap;overflow:visible;flex-basis:100%}}
.chip{flex:none;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--linie);background:transparent;cursor:pointer;font-weight:500;font-size:15.5px;color:var(--guss);text-decoration:none;white-space:nowrap}
.chip span{color:var(--meta);font-weight:400}
.chip:hover{border-color:var(--guss)}
.chip[aria-pressed="true"]{background:var(--guss);border-color:var(--guss);color:#fff}
.chip[aria-pressed="true"] span{color:#c9cbcd}
.feld-such{display:flex;align-items:center;gap:10px;border-bottom:1.5px solid var(--guss);min-height:46px;flex:0 1 330px}
.feld-such input{min-height:44px;border:0;background:transparent;font:inherit;font-size:17px;color:var(--guss);flex:1;min-width:0;outline:none;padding:6px 0}
.katalog-gruppe{padding-top:clamp(48px,6vw,84px);scroll-margin-top:90px}
.katalog-gruppe[data-ohne-kopf]{padding-top:12px}
.lead--knapp{margin-bottom:10px}
.h2--abstand{margin-bottom:30px}
.katalog-gruppe__kopf{display:grid;gap:14px;margin-bottom:26px}
@media (min-width:1024px){.katalog-gruppe__kopf{grid-template-columns:1fr 1fr;align-items:start}}
.katalog-gruppe__kopf h2{display:flex;align-items:baseline;gap:16px}
.katalog-gruppe__kopf h2 .gruppe-b{font-size:16.5px;color:var(--meta);letter-spacing:0;font-weight:400}
.katalog-unter{margin-top:28px;scroll-margin-top:90px}
.katalog-unter__kopf{display:flex;align-items:center;gap:12px;padding:14px 0;border-top:1px solid var(--linie);margin-bottom:16px}
.katalog-unter__kopf h3{font-size:1.2rem}
.katalog-unter__kopf .anz{color:var(--meta);font-size:15.5px;margin-left:auto}
.produkte{display:grid;grid-template-columns:repeat(2,1fr);gap:22px 12px}
@media (min-width:640px){.produkte{grid-template-columns:repeat(3,1fr);gap:28px 16px}}
@media (min-width:1024px){.produkte{grid-template-columns:repeat(4,1fr)}}
@media (min-width:1400px){.produkte{grid-template-columns:repeat(5,1fr)}}
.pk{text-decoration:none;display:flex;flex-direction:column;color:var(--guss)}
.pk__bild{position:relative;aspect-ratio:1;background:#fff;border-radius:15px;overflow:hidden;display:block;transition:border-radius .4s ease}
.pk__bild img{position:absolute;left:6%;top:5%;width:88%;height:78%;object-fit:contain;transition:transform .4s ease}
.pk:hover .pk__bild{border-bottom-right-radius:35px}
.pk:hover .pk__bild img{transform:scale(1.06)}
.pk__marke{position:absolute;left:12px;top:12px;font-size:13.5px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;padding:4px 9px;border-radius:999px;background:var(--creme-2);color:var(--guss)}
.pk__marke--neu{background:var(--blau);color:#fff}
.pk__marke--statisch{position:static}
.kz:empty{display:none}
.bild-nr{position:absolute;right:12px;bottom:8px;line-height:1.2;max-width:calc(100% - 24px);text-align:right;z-index:2;font-size:15.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--guss);font-variant-numeric:tabular-nums;pointer-events:none}
@media (max-width:759px){.pk__marke+img{top:19%;height:64%}}
.pk__name{display:block;margin-top:12px;font-size:16.5px;font-weight:500;line-height:1.3}
.pk:hover .pk__name{color:var(--blau)}
.pk[hidden]{display:none}
.leer{padding:40px 0;font-size:17px;color:var(--meta)}
.gruppen-reihe{display:grid;grid-template-columns:repeat(2,1fr);gap:22px 12px}
@media (min-width:640px){.gruppen-reihe{gap:28px 16px}}
@media (min-width:1024px){.gruppen-reihe{grid-template-columns:repeat(4,1fr)}}
@media (min-width:1400px){.gruppen-reihe{grid-template-columns:repeat(5,1fr)}}
@media (max-width:1399px){.gruppen-reihe .gk:nth-child(n+5){display:none}}
.gk{text-decoration:none;display:block}
.gk h3{margin:18px 0 6px}
.gk p{margin:0;font-size:16px;color:var(--meta)}

/* =========================== Produktseite =========================== */
.produkt{display:grid;grid-template-columns:minmax(0,1fr);gap:40px;padding-top:28px}
@media (min-width:1024px){.produkt{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);grid-template-rows:auto 1fr;column-gap:clamp(40px,6vw,96px);row-gap:10px;align-items:start}
  .produkt .galerie{grid-column:1;grid-row:1}.produkt__info{grid-column:2;grid-row:1 / span 2}.produkt__extra{grid-column:1;grid-row:2}}
.galerie__haupt{display:block;width:100%;aspect-ratio:1;background:#fff;border-radius:var(--radius-l);overflow:hidden;border:0;padding:0;cursor:zoom-in;position:relative}
.galerie__haupt img{width:100%;height:100%;object-fit:contain;padding:5%}
.galerie__text{margin:10px 2px 0;font-size:1rem;line-height:1.4}
.galerie__daumen{display:flex;gap:10px;margin-top:12px;overflow-x:auto;padding-bottom:6px}
.galerie__daumen button{flex:0 0 84px;height:84px;border-radius:10px;background:#fff;border:1.5px solid transparent;padding:6px;cursor:pointer}
.galerie__daumen button[aria-pressed="true"]{border-color:var(--guss)}
.galerie__daumen img{width:100%;height:100%;object-fit:contain}
@media (min-width:1024px){.produkt__info{position:sticky;top:calc(var(--kopf-jetzt,0px) + 30px)}}
.produkt__kz{display:flex;gap:10px;align-items:center;margin-bottom:18px;flex-wrap:wrap}
.produkt__kz a{display:inline-flex;align-items:center;min-height:44px;font-size:15.5px;color:var(--meta);text-decoration:none}
.produkt__kz a:hover{color:var(--guss)}
.produkt h1{font-size:clamp(2.1rem,3.6vw,3.3rem);margin-bottom:22px}
.produkt__text p{max-width:60ch}
.daten{margin:28px 0 0;border-top:1px solid var(--linie)}
.daten div{display:grid;grid-template-columns:minmax(120px,.8fr) 1.6fr;gap:16px;padding:13px 0;border-bottom:1px solid var(--linie)}
.daten dt{color:var(--meta);font-size:16px}
.daten dd{margin:0;color:var(--guss);font-size:16.5px}
.dokumente{margin-top:30px}
.dokumente h2{font-size:1.2rem;margin-bottom:10px}
.dok{display:flex;align-items:center;gap:14px;min-height:56px;padding:6px 0;border-bottom:1px solid var(--linie);text-decoration:none;color:var(--guss);font-weight:500}
.dok__typ{min-width:52px;height:32px;border-radius:6px;display:grid;place-items:center;background:var(--creme-2);font-size:13.5px;letter-spacing:.05em;text-transform:uppercase}
.dok__titel{flex:1 1 auto;display:flex;align-items:center;gap:14px}
.dok__hinweis{margin-left:auto;font-size:15.5px;color:var(--meta);font-weight:400;white-space:nowrap}
@media (max-width:599px){.dok__titel{flex-direction:column;align-items:flex-start;gap:0}.dok__hinweis{margin-left:0}}
.dok:hover{color:var(--blau)}
.produkt__tun{margin-top:30px}
.verwandt{margin-top:clamp(64px,8vw,110px)}
.verwandt__kopf{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin-bottom:24px;flex-wrap:wrap}
.zeile-scroll{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(170px,1fr);gap:16px;overflow-x:auto;padding-bottom:10px;scroll-snap-type:x mandatory}
.zeile-scroll .pk{scroll-snap-align:start}
@media (min-width:1024px){.zeile-scroll{grid-auto-flow:row;grid-template-columns:repeat(6,1fr);overflow:visible;padding-bottom:0}.zeile-scroll .pk:nth-child(n+7){display:none}}
.verbaut{display:grid;gap:12px;margin-top:22px}
.verbaut a{display:grid;grid-template-columns:96px 1fr;gap:16px;align-items:center;text-decoration:none;color:var(--guss);font-weight:500}
.verbaut img{width:96px;height:72px;object-fit:cover;border-radius:8px}
/* Lightbox */
.lb{border:0;padding:0;background:transparent;max-width:min(96vw,1100px);max-height:94vh}
.lb::backdrop{background:rgba(15,17,19,.82);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.lb img{max-height:86vh;width:auto;max-width:100%;background:#fff;border-radius:14px;padding:3%}
.lb__zu{position:absolute;top:10px;right:10px;width:48px;height:48px;border-radius:50%;background:var(--guss);color:#fff;border:0;cursor:pointer;display:grid;place-items:center}

/* =========================== Referenzen / Unternehmen / Kontakt =========================== */
.ref-liste{list-style:none;margin:0;padding:0;border-top:1px solid var(--linie)}
.ref{display:grid;gap:18px;padding:28px 0;border-bottom:1px solid var(--linie)}
@media (min-width:900px){.ref{grid-template-columns:110px minmax(0,1fr) minmax(0,1.3fr);gap:34px;align-items:start}}
.ref__jahr{font-size:16.5px;color:var(--meta);hyphens:auto;-webkit-hyphens:auto;overflow-wrap:anywhere}
.ref h3{margin-bottom:8px}
.ref p{margin:0 0 10px}
.ref__produkte{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.ref__produkte a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;border-radius:999px;border:1px solid var(--linie);text-decoration:none;font-size:15.5px;font-weight:500;color:var(--guss)}
.ref__produkte a:hover{border-color:var(--guss)}
.ref__bilder{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.ref__bilder button:first-child{grid-column:1 / -1;aspect-ratio:3/2}
@media (min-width:900px){.ref__bilder{grid-template-columns:repeat(3,1fr)}.ref__bilder button:first-child{grid-column:auto;aspect-ratio:4/3}}
.ref__stadt{color:var(--meta)}
.ref__bilder button{padding:0;border:0;background:none;cursor:zoom-in;aspect-ratio:4/3;border-radius:10px;overflow:hidden}
.ref__bilder img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.ref__bilder button:hover img{transform:scale(1.05)}
.ref--ohne .ref__bilder{display:none}
.zeitleiste{list-style:none;margin:0;padding:0;border-top:1px solid var(--guss-linie)}
.zeitleiste li{display:grid;grid-template-columns:96px 1fr;gap:20px;padding:26px 0;border-bottom:1px solid var(--guss-linie);align-items:start}
@media (min-width:900px){.zeitleiste li{grid-template-columns:150px 1fr 100px;gap:34px}}
.zeitleiste .jahr{font-size:clamp(1.6rem,2.6vw,2.4rem);font-weight:500;color:#fbf8f1;letter-spacing:-.02em;line-height:1}
.zeitleiste h3{font-size:1.2rem;margin-bottom:8px}
.zeitleiste p{margin:0;max-width:62ch}
.zeitleiste img{display:none;width:100px;height:100px;object-fit:cover;border-radius:10px;filter:grayscale(.15)}
@media (min-width:900px){.zeitleiste img{display:block}}
.leistungen{display:grid;gap:34px 28px}
@media (min-width:700px){.leistungen{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1100px){.leistungen{grid-template-columns:repeat(3,1fr)}}
.leistung .morph{aspect-ratio:3/2}
.leistung h3{margin:20px 0 8px}
.leistung ul{margin:0;padding-left:18px;font-size:16.5px}
.kontakt{display:grid;gap:48px}
@media (min-width:1024px){.kontakt{grid-template-columns:1fr 1.2fr;gap:clamp(48px,7vw,120px)}}
.kontakt__daten dl{margin:0;border-top:1px solid var(--linie)}
.kontakt__daten dl div{display:grid;grid-template-columns:130px 1fr;gap:16px;padding:16px 0;border-bottom:1px solid var(--linie)}
.kontakt__daten dt{color:var(--meta)}
.kontakt__daten dd{margin:0;color:var(--guss);font-weight:500}
.kontakt__daten dd a{text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
.formular{display:grid;gap:20px;background:var(--creme-2);border-radius:var(--radius-l);padding:clamp(24px,4vw,48px)}
.formular label{display:grid;gap:8px;font-weight:500;color:var(--guss);font-size:16px}
.formular input,.formular textarea,.formular select{font:inherit;font-size:17px;color:var(--guss);background:var(--creme);border:1px solid var(--linie);border-radius:10px;padding:13px 14px;min-height:52px;width:100%}
.formular textarea{min-height:150px;resize:vertical}
.formular input:focus,.formular textarea:focus,.formular select:focus{outline:2px solid var(--blau);outline-offset:1px}
.formular__zwei{display:grid;gap:20px}
@media (min-width:700px){.formular__zwei{grid-template-columns:1fr 1fr}}
.formular__hinweis{font-size:15.5px;color:var(--meta);margin:0}
.formular__titel{font-size:1.6rem}
.formular__senden{justify-self:start}
.formular--danke{align-content:start}
.formular--danke p{margin:0}
.abschnitt--eng{padding-top:40px}
.abschnitt--ohne-oben{padding-top:0}
.abschnitt--ohne-unten{padding-bottom:0}
.zweier-kopf--abstand{margin-bottom:40px}
@media (max-width:1019px){.abschnitt--kontakt{padding-bottom:100px}}
.rechtstext{max-width:78ch;padding-block:clamp(40px,6vw,80px)}
.rechtstext h1{font-size:clamp(2.2rem,4vw,3.4rem);margin-bottom:30px}
.rechtstext h2{font-size:1.4rem;margin:34px 0 12px}
.menue[hidden]{display:none}
.katalog-unter[hidden],.katalog-gruppe[hidden]{display:none}

input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
@media (max-width:600px){.reg__zahl .reg__wort{display:none}.hero__kicker{font-size:15.5px}}

.fuss .strivera-credit{display:inline-block;line-height:44px}
.fuss__sterne{display:inline-flex;align-items:center;gap:10px;color:#c9cbcd}
.fuss__sterne .rv__sterne{margin:0;color:#e0a92e}
/* ---------- Feedback Rubinstein 21.10.: helles Startbild, Telefon-Icon, Logo auf Creme ---------- */
/* Startseite: Lesbarkeit auf dem hellen Opernfoto (Rubinstein 16.10.) */
.hero--start::before{background:linear-gradient(180deg,rgba(10,12,14,.55) 0%,rgba(10,12,14,.18) 16%,rgba(10,12,14,0) 28%),
  linear-gradient(90deg,rgba(10,12,14,.66) 0%,rgba(10,12,14,.52) 44%,rgba(10,12,14,.2) 64%,rgba(10,12,14,0) 84%),
  linear-gradient(0deg,rgba(10,12,14,.7) 0%,rgba(10,12,14,.45) 30%,rgba(10,12,14,0) 62%)}
.hero--start .hero__innen{text-shadow:0 1px 3px rgba(0,0,0,.55),0 3px 28px rgba(0,0,0,.55)}
.hero--start .hero__kicker,.hero--start .hero__satz,.hero--start .hero__quelle{color:#fff;font-weight:500}
.hero--start .knopf--glas{background:rgba(15,18,21,.62);border-color:rgba(255,255,255,.55)}
.kopf--hell .kopf__nav a,.kopf--hell .kopf__nav button,.kopf--hell .burger,.kopf--hell .suche-knopf{text-shadow:0 1px 3px rgba(0,0,0,.6),0 2px 14px rgba(0,0,0,.45)}
.kopf--hell .burger svg,.kopf--hell .suche-knopf svg,.kopf--hell .marke__wort{filter:drop-shadow(0 1px 3px rgba(0,0,0,.5))}
@media (max-width:767px){.hero--start::before{background:linear-gradient(180deg,rgba(10,12,14,.5) 0%,rgba(10,12,14,0) 22%),
  linear-gradient(0deg,rgba(10,12,14,.86) 0%,rgba(10,12,14,.7) 34%,rgba(10,12,14,.35) 58%,rgba(10,12,14,0) 78%)}}
.hero--rund{border-radius:var(--radius-l)}
@media (max-width:767px){.hero--rund{border-radius:var(--radius-s)}}
.knopf .tel-ico,.menue__tel .tel-ico,.tel-fett .tel-ico{color:var(--blau);transform:none!important}
.knopf--dunkel .tel-ico,.knopf--glas .tel-ico{color:var(--blau-hell)}
.knopf--linie:hover .tel-ico{color:var(--blau-hell)}
.menue__tel,.tel-fett{gap:10px}
.stky__tel{width:auto;padding:0 16px 0 13px;border-radius:999px;display:flex;align-items:center;gap:8px;font-weight:500;font-size:16.5px;text-decoration:none}
.hero h1,.start h1{overflow-wrap:break-word}
.formular__hinweis a.tap{display:inline-flex;align-items:center;min-height:44px}
/* LV-Muster je Produkt und Übersicht /planer (31.10.2026) */
.lv-auf{margin-top:clamp(28px,4vw,48px);border-top:1px solid var(--linie)}
.lv-auf .planer-gruppe{border-bottom:1px solid var(--linie)}
.lv-auf__h{font-size:1.12rem;font-weight:500;color:var(--guss);letter-spacing:0;line-height:1.3}
.lv-auf .lv{margin:0 0 28px}
.lv__tun{margin-top:22px}
.lv .lv__tun .knopf{display:inline-flex;padding:0 24px;margin:0;text-decoration:none}
.lv .lv__tun .knopf--linie{color:var(--guss)}
@media (max-width:599px){.lv-auf summary .anz{display:none}}
.lv__tun button.knopf{font:inherit;cursor:pointer}
.lv__status{min-height:1.4em;margin:12px 0 0;font-size:15.5px;color:var(--blau)}
.lv-zeilen{display:grid;gap:2px;padding:0 0 18px}
@media (min-width:900px){.lv-zeilen{grid-template-columns:1fr 1fr;column-gap:40px}}
.lv-zeile{display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--creme-3)}
.lv-zeile .ulink{display:inline-block;padding:12px 0;min-height:44px;color:var(--guss)}
.lv-zeile__txt{display:inline-flex;align-items:center;min-height:44px;min-width:44px;justify-content:center;color:var(--blau);font-size:15.5px;text-decoration:underline;text-underline-offset:3px}
/* Umrüstsätze Fremdleuchten (31.10.2026) */
.umr-leuchte{display:flex;align-items:center;gap:14px}
.umr-leuchte img{flex:0 0 56px;width:56px;height:auto;max-height:72px;object-fit:contain;background:#fff;border-radius:6px}
.atab.atab--umr{min-width:0}
.atab--umr td{vertical-align:middle}
.atab--umr th[scope=row]{font-weight:400}
.atab--umr small{display:block;font-size:15.5px;color:var(--meta);margin-top:2px}
.atab--umr td b{font-weight:600;color:var(--guss);white-space:nowrap}
.umr-module{display:grid;gap:24px;margin-top:clamp(22px,3vw,36px)}
@media (min-width:700px){.umr-module{grid-template-columns:1fr 1fr}}
.umr-modul{margin:0;background:#fff;border-radius:var(--radius-l);padding:22px;display:grid;gap:14px}
.umr-modul img{width:100%;max-width:300px;height:auto;margin:0 auto;object-fit:contain}
.umr-mail{display:inline-block;padding:11px 0;margin:-11px 0;color:var(--guss);text-decoration:underline;text-underline-offset:3px}
.umr-modul figcaption{font-size:16px;line-height:1.5}
.umr-modul figcaption b{display:block;color:var(--guss);font-weight:500;font-size:1.1rem}
/* LiteEngine IV, Planungshilfen (06.11.2026) */
.atab.atab--optik{min-width:0}
.atab--optik th:first-child{white-space:nowrap}
.atab.atab--vergleich{min-width:0}
.antwort .atab-wrap+p,.antwort .schritte+p{margin-top:22px}
.le-abb{margin:26px 0 0}
.le-abb button{display:block;width:100%;border:0;padding:0;background:#fff;border-radius:var(--radius-s);overflow:hidden;cursor:zoom-in}
.le-abb img{display:block;width:100%;height:auto}
.le-abb figcaption{margin-top:10px;font-size:15.5px;line-height:1.5;color:var(--meta)}
.le-abb figcaption a{color:var(--guss);text-decoration:underline;text-underline-offset:3px;display:inline-block;padding:11px 0;margin:-11px 0}
.le-ldt-tun{margin-top:26px}
.le-abb+p{margin-top:24px}
#ldt .planer-gruppe summary .anz{white-space:nowrap}
.le-abb--liteengine-iv-mischoptiken,.le-abb--nacht{max-width:520px}
/* REG-MINI START (build.py) */
.reg__mini--historische-leuchten{background-image:url("/assets/p/de-thl-231-1-k.webp?v=3110b")}.reg__mini--kandelaber-wandarme{background-image:url("/assets/p/de-thk-674-1-k.webp?v=3110b")}.reg__mini--dekorative-leuchten{background-image:url("/assets/p/de-deko-l190-1-k.webp?v=3110b")}.reg__mini--technische-leuchten{background-image:url("/assets/p/de-iris-1-1-k.webp?v=3110b")}.reg__mini--projektleuchten{background-image:url("/assets/p/de-thl-131-haupt-k.webp?v=3110b")}.reg__mini--poller{background-image:url("/assets/p/slupek-separacyjny-tap-2017-1-k.webp?v=3110b")}.reg__mini--stadtgestaltung{background-image:url("/assets/p/lawka-tsb-723-1-k.webp?v=3110b")}.reg__mini--umruestsaetze{background-image:url("/assets/p/de-led-3-1-haupt-k.webp?v=3110b")}
/* REG-MINI ENDE */
.menue:focus,.menue:focus-visible{outline:none}
.gruppe-knopf:focus{outline:none}
.gruppe-knopf:focus-visible{outline:none;box-shadow:0 0 0 2px var(--blau)}
.gruppe-knopf[aria-selected="true"]:focus-visible{box-shadow:0 0 0 2px var(--blau),0 10px 24px -18px rgba(31,34,37,.35)}

/* ===== Umbau 12.10.2026: deutsches Sortiment, Leistungen, Kataloge ===== */
.top3{display:grid;gap:12px;margin-top:clamp(18px,2.4vw,30px)}
@media (min-width:700px){.top3{grid-template-columns:repeat(2,1fr);gap:14px}}
@media (min-width:900px){.top3{gap:16px}}
.top3__k{display:grid;grid-template-columns:96px 1fr auto;align-items:center;gap:18px;padding:12px 22px 12px 12px;background:#fff;border-radius:var(--radius-l);text-decoration:none;color:var(--guss);transition:border-radius .4s ease,background .3s ease}
.top3__k:hover{border-bottom-right-radius:42px}
.top3__k svg{color:var(--blau);transition:transform .3s var(--ease)}
.top3__k:hover svg{transform:translateX(4px)}
.top3__bild{aspect-ratio:1;border-radius:12px;overflow:hidden;background:#fff;display:block}
.top3__bild img{width:100%;height:100%;object-fit:contain}
.top3__text{display:flex;flex-direction:column;gap:2px;min-width:0}
.top3__b{font-size:15.5px;color:var(--meta)}
.top3__n{font-size:clamp(1.2rem,1.6vw,1.4rem);font-weight:500;line-height:1.2}
.top3__u{font-size:15.5px;color:var(--meta);line-height:1.35}
@media (max-width:420px){.top3__k{grid-template-columns:76px 1fr auto;gap:14px}}

.favoriten{padding-top:clamp(40px,5vw,70px)}
.favoriten__kopf{display:grid;gap:10px;margin-bottom:clamp(24px,3vw,36px)}
@media (min-width:1024px){.favoriten__kopf{grid-template-columns:1fr 1fr;align-items:start;gap:64px}.favoriten__kopf .kicker{grid-column:1/-1;margin:0}}
.lead--knapp{margin:0}
.produkte--fav{padding-bottom:clamp(30px,4vw,56px);border-bottom:1px solid var(--linie)}
@media (min-width:640px){.produkte--fav{grid-template-columns:repeat(3,1fr)}}

.kombi{display:grid;gap:28px;padding-top:clamp(40px,5vw,70px)}
@media (min-width:1024px){.kombi{grid-template-columns:.8fr 1.2fr;gap:64px;align-items:center}}
.kombi h2{margin-bottom:18px}
.kombi__bilder{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.kombi__bilder button{border:0;padding:0;background:#fff;border-radius:var(--radius-s);overflow:hidden;cursor:zoom-in}
.kombi__bilder img{width:100%;height:auto}

.dreier--hell a h3{color:var(--guss)}
@media (min-width:900px){.dreier--zwei{grid-template-columns:repeat(2,1fr)}}
.textmedia--dreh{}
@media (min-width:900px){.textmedia--dreh{grid-template-columns:1fr 1.05fr}}
.haken{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:10px}
.haken li{position:relative;padding-left:30px;color:var(--guss)}
.haken li::before{content:"";position:absolute;left:2px;top:.55em;width:14px;height:8px;border-left:2px solid var(--blau);border-bottom:2px solid var(--blau);transform:rotate(-45deg)}
.hinweisband{display:grid;gap:22px;align-items:center;padding:clamp(26px,4vw,48px);background:var(--creme-2);border-radius:var(--radius-l)}
@media (min-width:900px){.hinweisband{grid-template-columns:1fr auto;gap:40px}}
.hinweisband h2{font-size:clamp(1.5rem,2.4vw,2.2rem);margin-bottom:10px}
.hinweisband p{margin:0}
.rechner-rahmen{padding-bottom:clamp(40px,6vw,80px);scroll-margin-top:30px}
.leist-pj{margin:clamp(36px,4vw,56px) 0 0;font-size:1.1rem}

.kataloge{display:grid;gap:18px}
@media (min-width:700px){.kataloge{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1150px){.kataloge{grid-template-columns:repeat(3,1fr)}}
.katalog{display:grid;grid-template-columns:110px 1fr;gap:20px;align-items:center;padding:16px;background:#fff;border-radius:var(--radius-l);text-decoration:none;color:var(--guss);transition:border-radius .4s ease}
.katalog:hover{border-bottom-right-radius:42px}
.katalog__bild{display:block;border-radius:8px;overflow:hidden;box-shadow:0 6px 18px rgba(31,34,37,.14)}
.katalog__text{display:flex;flex-direction:column;gap:6px}
.katalog__text b{font-weight:500;font-size:1.15rem;line-height:1.25}
.katalog__text span{font-size:15.5px;color:var(--text);line-height:1.45}
.katalog__meta{color:var(--blau)!important;font-weight:500}

.newsletter{display:grid;gap:14px;margin:0 0 clamp(40px,5vw,64px);padding:clamp(22px,3vw,34px);border:1px solid var(--guss-linie);border-radius:var(--radius-l);position:relative;z-index:1}
@media (min-width:900px){.newsletter{grid-template-columns:1.1fr 1fr auto;align-items:center;gap:24px}}
.newsletter p{margin:0;color:#c9cbcd}
.newsletter .fuss__titel{margin:0 0 4px}
.newsletter__feld input{width:100%;min-height:52px;border-radius:999px;border:1px solid var(--guss-linie);background:var(--guss-2);color:#fbf8f1;padding:0 20px;font:inherit;font-size:16px}
.newsletter__feld input::placeholder{color:#9a9da0}
.newsletter__hinweis{grid-column:1/-1;font-size:15.5px}
.pk__marke{z-index:2}

/* Newsletter-Anmeldung und LED-Rechner-Freischaltung */
.falle{position:absolute!important;left:-9999px;width:1px;height:1px;opacity:0}
.newsletter__ok{grid-column:1/-1;display:flex;gap:12px;align-items:flex-start;font-size:15.5px;color:#c9cbcd;line-height:1.5;cursor:pointer}
.newsletter__ok input,.tor__ok input{flex:none;-webkit-appearance:none;appearance:none;width:44px;height:44px;min-height:0;margin:-11px;padding:0;border:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Crect x='.75' y='.75' width='20.5' height='20.5' rx='3' fill='%23fff' stroke='%23b9b3a8' stroke-width='1.5'/%3E%3C/svg%3E") center/22px 22px no-repeat;cursor:pointer;outline-offset:-9px}
.newsletter__ok input:checked,.tor__ok input:checked{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Crect x='.75' y='.75' width='20.5' height='20.5' rx='3' fill='%23005287' stroke='%23005287' stroke-width='1.5'/%3E%3Cpath d='M5.5 11.5l3.6 3.6 7.4-8' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.newsletter__ok a{color:#fbf8f1}
.newsletter__ok a,.tor__ok a{display:inline-block;padding:11px 0;margin:-11px 0}
.newsletter__danke{grid-column:1/-1;font-size:17px;color:#fbf8f1!important}
.strivera-fehler{grid-column:1/-1;margin:0;font-size:15.5px;color:#b3261e}
.newsletter .strivera-fehler{color:#ffb4a9}
.tor{display:grid;gap:clamp(28px,4vw,56px);align-items:start}
.tor__text h2{font-size:clamp(1.9rem,3.4vw,2.9rem);margin:0 0 16px}
.tor__text>p{max-width:56ch}
.tor__klein{margin-top:22px;font-size:15.5px;color:var(--meta)}
.tor__form .formular__titel{margin:0}
.tor__ok{display:flex!important;gap:12px;align-items:flex-start;font-weight:400!important;font-size:15.5px!important;line-height:1.5;color:var(--meta)!important;cursor:pointer}
.tor__danke p{margin:10px 0 0}
.optional{font-weight:400;color:var(--meta)}
.rechner-kopf{padding-top:clamp(8px,2vw,24px)}
@media (min-width:900px){.tor{grid-template-columns:1fr 1.05fr}}
/* Bau-Check 17.10.2026: Honeypot, Kundenfragen (C4), Kontakt-Satz (C26) */
.falle{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}
.kfragen-wrap .kicker{margin-bottom:26px}
.kfragen{display:grid;gap:30px 48px}
@media (min-width:900px){.kfragen{grid-template-columns:1fr 1fr}}
.kfrage h2{font-size:clamp(1.2rem,1.6vw,1.45rem);line-height:1.25;margin-bottom:10px}
.kfrage p{margin:0;color:var(--text);line-height:1.6;max-width:62ch}
.kontakt__satz{margin:-14px 0 24px;color:var(--text);max-width:52ch;line-height:1.55}

/* ---------- Neue Seiten 17.10.2026: Ratgeber, Einzelreferenzen, Planer, Gasleuchten ---------- */
.prosa{max-width:72ch}
.prosa h2,.textmedia h2{margin-bottom:18px}
.prosa p,.textmedia p{line-height:1.65}
.quelle{font-size:15.5px;color:var(--meta);line-height:1.5;margin-top:18px;max-width:72ch}
.autor{font-size:15.5px;color:var(--meta);margin:0;padding:18px 0;border-bottom:1px solid var(--linie)}
.autor a{color:var(--guss)}
.gasgalerie{display:grid;grid-template-columns:repeat(2,1fr);gap:18px 14px}
@media (min-width:700px){.gasgalerie{grid-template-columns:repeat(4,1fr);gap:24px 20px}}
.gasbild{margin:0}
.gasbild button{display:block;width:100%;padding:0;border:0;background:#fff;border-radius:var(--radius-l);overflow:hidden;cursor:zoom-in;aspect-ratio:1}
.gasbild img{width:100%;height:100%;object-fit:contain;display:block}
.gasbild figcaption{font-size:15.5px;color:var(--text);margin-top:10px;line-height:1.4}
.einzelref{display:grid;gap:40px}
@media (min-width:1024px){.einzelref{grid-template-columns:1.1fr .9fr;gap:clamp(40px,6vw,96px);align-items:start}}
.einzelref__text h2{margin-bottom:22px}
.einzelref__text p{line-height:1.65;max-width:62ch}
.einzelref__h3{margin:36px 0 10px;font-size:1.2rem}
.einzelref__bilder{margin-top:28px}
.einzelref__bilder button:first-child{aspect-ratio:4/3}
.projekte__raster--vier{margin-top:0}
@media (min-width:900px){.projekte__raster--vier{grid-template-columns:repeat(4,1fr)}}
.ref__link{color:inherit;text-decoration:none}
.ref__link:hover{color:var(--blau)}
.ref__mehr{margin:12px 0 0;font-size:16.5px}
.planer-gruppen{border-top:1px solid var(--linie)}
.planer-gruppe{border-bottom:1px solid var(--linie)}
.planer-gruppe summary{display:flex;align-items:center;gap:14px;min-height:68px;padding:16px 0;cursor:pointer;list-style:none;font-weight:500;color:var(--guss);font-size:1.12rem}
.planer-gruppe summary::-webkit-details-marker{display:none}
.planer-gruppe summary .anz{margin-left:auto;font-size:15.5px;color:var(--meta);font-weight:400}
.planer-gruppe summary .frage-zeichen{flex:0 0 18px}
.planer-gruppe[open] .frage-zeichen::after{transform:rotate(0)}
.planer-liste{display:grid;gap:0 40px;padding-bottom:20px}
@media (min-width:900px){.planer-liste{grid-template-columns:1fr 1fr}}
.planer-liste .dok,.planer-zwei .dok{min-height:52px}
.planer-liste .dok__hinweis,.planer-zwei .dok__hinweis{white-space:normal;text-align:right;max-width:46%}
.planer-zwei{display:grid;gap:48px}
@media (min-width:1024px){.planer-zwei{grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,96px)}}
.planer-zwei h2{margin-bottom:16px}
.planer-zwei .dokumente{margin-top:0}
.planer-h3{margin:34px 0 10px;font-size:1.2rem}
.planer-zwei p{line-height:1.6;max-width:60ch}
.lv{margin-top:clamp(28px,4vw,48px);padding:clamp(22px,3.5vw,40px);background:#fff;border-radius:var(--radius-l);border-top:3px solid var(--blau);max-width:92ch}
.lv__hinweis{font-size:15.5px;color:var(--meta);margin:0 0 14px}
.lv h3{font-size:1.25rem;margin-bottom:14px;line-height:1.3}
.lv p{line-height:1.6}
.lv__liste{margin:14px 0 0;padding-left:22px;display:grid;gap:9px;line-height:1.55}
.lv__fuss{margin-top:20px;font-size:16px;color:var(--text)}
.prosa p a,.textmedia p a,.einzelref__text p a,.autor a,.lv a,.planer-zwei p a,.reg__kopf .lead a,.lv__fuss a{display:inline-block;padding:11px 0;margin:-11px 0;color:var(--guss);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.prosa p a:hover,.textmedia p a:hover,.einzelref__text p a:hover{color:var(--blau)}
.projekte__raster--vier .projekt h3{color:var(--guss)}
.projekte__raster--vier .projekt__meta li{color:var(--text)}
.projekte__raster--vier .projekt__meta li:first-child{color:var(--guss)}
.projekte__raster--vier .projekt__meta li+li::before{background:var(--linie)}
/* G21 Antwortblöcke (build.py antwort_block, tabelle, liste) */
.antwort .prosa{max-width:80ch}
.antwort .lead{max-width:68ch}
.schritte{margin:22px 0 0;padding-left:1.4em;display:grid;gap:10px;color:var(--guss)}
.schritte li{padding-left:4px}
.atab-wrap{margin:26px 0 0;overflow-x:auto;-webkit-overflow-scrolling:touch}
.atab{border-collapse:collapse;width:100%;min-width:640px;font-size:16px;line-height:1.45;color:var(--text)}
.atab-titel{font-size:15.5px;color:var(--meta);margin:26px 0 0}
.atab-titel + .atab-wrap{margin-top:10px}
.atab th,.atab td{text-align:left;vertical-align:top;padding:12px 14px 12px 0;border-bottom:1px solid var(--linie)}
.atab--zahlen td{white-space:nowrap}
.atab thead th{font-weight:500;color:var(--guss);border-bottom:2px solid var(--guss)}
.atab tbody th{font-weight:500;color:var(--guss)}
.atab a{color:var(--guss);text-decoration:underline;text-underline-offset:3px;display:inline-block;padding:11px 0;margin:-11px 0}
.antwort .prosa > p a{color:var(--guss)}
.antwort li a,.frage p a{display:inline-block;padding:11px 0;margin:-11px 0;color:var(--guss);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.ref h3 a{display:inline-block;padding:10px 0;margin:-10px 0}

#led-rechner > p{max-width:72ch}
.bsp{margin:10px 0 0;border-top:2px solid var(--guss)}
.bsp div{display:grid;grid-template-columns:1fr;gap:2px;padding:12px 0;border-bottom:1px solid var(--linie)}
.bsp dt{font-weight:500}
.bsp dd{margin:0}
@media (min-width:760px){.bsp div{grid-template-columns:2fr 3fr;gap:24px}}
.rechner-tor__bild{max-width:420px;margin:0 0 24px}

/* ---- Call Axel 28.10.2026 ---- */
/* V2 (Axel, „gesetzt“): dunkle Flächen in TRAPP-Blau statt Gussgrau, Schrift bleibt. Graue Nebentexte heller, damit der Kontrast auf Blau reicht. */
.flaeche-dunkel,.fuss{background:var(--blau);--guss-2:#0b5f96;--guss-linie:#2f78aa}
.knopf--dunkel,.knopf--linie:hover,.chip[aria-pressed="true"],.reg__link:hover .reg__buchst,.reg__link[data-aktiv="ja"] .reg__buchst{background:var(--blau);border-color:var(--blau)}
.flaeche-dunkel .kicker,.projekt__meta li,.fuss__titel,.fuss__unten,.fuss,.demo-hinweis{color:#d3dde6}
.projekt__meta li+li::before{background:#7fa7c6}
.pk__zusatz{display:block;margin-top:3px;font-size:15.5px;font-weight:400;color:var(--meta)}
/* Startseite: Referenzen und Projektleuchten vor den Produkten (Axel: „vertrauensbildende Maßnahme“) */
.insel--nach-hero{margin-top:clamp(18px,2.4vw,30px)}
.projekte--oben{margin-top:0}
.projekte--oben .projekte__titel{max-width:none;display:grid;gap:12px}
@media (min-width:1024px){.projekte--oben .projekte__titel{grid-template-columns:1fr 1fr;align-items:start;gap:64px}.projekte--oben .projekte__titel .knopf{justify-self:start}}
.projekte--oben .projekte__titel p{margin:0}
.produkte--vier{grid-template-columns:repeat(2,1fr)}
@media (min-width:760px){.produkte--vier{grid-template-columns:repeat(4,1fr)}}
.top3--mitte{margin-top:clamp(40px,5vw,72px)}

/* 30.10.2026 Pascal: Referenzen auf der Startseite als Bühne, großes Bild links, zwei rechts */
.projekte--oben{gap:clamp(30px,3.4vw,46px)}
.projekte--oben .projekte__titel .lead{max-width:34ch}
.projekte__raster--buehne{gap:28px}
.projekte__raster--buehne .projekt h3{margin:16px 0 6px}
@media (min-width:900px){
  .projekte__raster--buehne{grid-template-columns:1.45fr 1fr;grid-template-rows:1fr 1fr;gap:26px 30px}
  .projekte__raster--buehne .projekt{display:flex;flex-direction:column;min-height:0}
  .projekte__raster--buehne .projekt .morph{aspect-ratio:16/9}
  .projekte__raster--buehne .projekt:first-child{grid-row:1/3}
  .projekte__raster--buehne .projekt:first-child .morph{aspect-ratio:auto;flex:1 1 auto;min-height:420px}
  .projekte__raster--buehne .projekt:first-child h3{font-size:clamp(1.45rem,2vw,1.8rem)}
}
.projekte__raster--buehne .projekt:first-child .morph img{object-position:50% 45%}
.projekte__raster--buehne .projekt:nth-child(2) .morph img{object-position:50% 30%}
.insel--nach-hero.abschnitt{padding-block:clamp(54px,6vw,92px)}
@media (max-width:599px){.projekte__raster--buehne .projekt__meta{display:grid;gap:2px}.projekte__raster--buehne .projekt__meta li+li::before{display:none}}
/* 30.10.2026 Kopf der Referenzen: Titel und Unterzeile links als Block, Knopf rechts auf Grundlinie */
.projekte--oben .projekte__titel--zeile{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:22px 40px}
.projekte--oben .projekte__titel--zeile h2{margin:0}
.projekte--oben .projekte__titel--zeile .projekte__unter{margin:14px 0 0;font-size:clamp(1.05rem,1.3vw,1.2rem);color:#d3dde6;max-width:44ch}
.projekte--oben .projekte__titel--zeile .knopf{flex:none}
/* 30.10. Startseite Projektleuchten: Fotos am Ort statt Freisteller */
.pk--foto .pk__bild{aspect-ratio:4/5;background:var(--guss)}
.pk--foto .pk__bild img{left:0;top:0;width:100%;height:100%;object-fit:cover}
.pk--foto .bild-nr{color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.55)}
.favoriten{scroll-margin-top:90px}
/* 31.10. Conversion-Fixes: Pflichtfelder, Foto-Hinweis, 404-Seite, Anfrage-Band mit Telefon */
.pflicht{color:var(--blau);font-weight:500}
.formular__pflicht{font-size:15.5px;color:var(--meta);margin:-4px 0 0}
.formular__foto{margin-top:-4px}
.hinweisband .knopfreihe{justify-content:flex-start}
.nf{display:grid;gap:clamp(36px,5vw,72px)}
@media (min-width:900px){.nf{grid-template-columns:1.2fr 1fr}}
.nf__form{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:0 0 18px}
.nf__form .feld-such{flex:1 1 260px}
.nf .knopfreihe{margin:18px 0}
.stky{background:rgba(31,34,37,.74)} /* Kontrast „Anrufen“ auf hellem Grund mind. 4,5:1 (Lighthouse 31.10.) */
/* ---- Telefonat Axel 09.11.2026: quadratische Referenzkacheln, Storyline, Vorher-Nachher, Prozess ---- */
.ref__bilder button,.ref__bilder button:first-child{aspect-ratio:1/1}
.story{display:grid;gap:10px;margin:14px 0 18px;padding:16px 18px;background:var(--creme);border-left:3px solid var(--blau);border-radius:0 var(--radius-s) var(--radius-s) 0}
.story div{display:grid;gap:2px}
.story dt{font-size:15.5px;color:var(--meta)}
.story dd{margin:0;font-weight:600;color:var(--guss)}
@media (min-width:600px){.story div{grid-template-columns:140px 1fr;gap:14px}}
.vn{margin:0 0 34px}
.vn__paar{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.vn__bild{position:relative;border-radius:var(--radius-s);overflow:hidden;aspect-ratio:3/4;background:var(--guss)}
.vn__bild img{width:100%;height:100%;object-fit:cover;display:block}
.vn__marke{position:absolute;left:10px;top:10px;padding:4px 10px;border-radius:999px;background:rgba(31,34,37,.82);color:#fff;font-size:15.5px;font-weight:600}
.vn__marke--nach{background:var(--blau)}
.vn figcaption{margin-top:10px;font-size:15.5px;color:var(--meta)}
@media (min-width:900px){.vn__paar{gap:16px}.vn{max-width:1100px}}
.prozess{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
@media (min-width:900px){.prozess{grid-template-columns:repeat(5,1fr)}}
.prozess button{padding:0;border:0;background:none;cursor:zoom-in;aspect-ratio:1/1;width:100%;border-radius:var(--radius-s);overflow:hidden}
.prozess img{width:100%;height:100%;object-fit:cover;display:block}
.prozess p{margin:10px 0 0;font-size:15.5px;line-height:1.4}
.hinweis-box{padding:clamp(20px,3vw,34px);border:1px solid var(--linie);border-radius:var(--radius-l);background:var(--creme);max-width:980px}
.hinweis-box h2{margin:0 0 12px}
.hinweis-box p{margin:0 0 10px}
.vn-reihe{display:grid;gap:clamp(24px,3vw,40px)}
@media (min-width:1024px){.vn-reihe{grid-template-columns:1.25fr 1fr;align-items:start}}
/* ---- Phase A SEO 14.11.2026: Suchbegriff-H1, Wege-Sätze, Kommunen-Block, Produktzeile „Für Planer und Kommunen“ ---- */
.hero h1.h1--lang{font-size:clamp(2.6rem,5.2vw,4.7rem);max-width:20ch}
.hero--seite h1.h1--lang{max-width:22ch}
.wege{padding-top:clamp(18px,2.4vw,28px)}
.wege p,.wege-satz{max-width:78ch;margin:0;line-height:1.7;color:var(--guss)}
.wege a,.wege-satz a,.wege-liste a{color:var(--guss);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;display:inline-block;padding:11px 0;margin:-11px 0}
.wege a:hover,.wege-satz a:hover,.wege-liste a:hover{color:var(--blau)}
.einzelref__text .wege-satz{margin-top:4px}
.wege-raster{display:grid;gap:0 clamp(18px,3vw,40px);margin-top:clamp(18px,2.4vw,28px)}
.wege-raster > .dok{min-width:0}
.wege-raster .dok__titel,.wege-raster .dok__hinweis{white-space:normal;text-align:left;max-width:none;min-width:0;overflow-wrap:anywhere}
@media (min-width:760px){.wege-raster{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.wege-raster{grid-template-columns:repeat(3,minmax(0,1fr))}}
.wege-liste a{overflow-wrap:anywhere}
.wege-produkt{margin-top:26px}
.wege-liste{list-style:none;padding:0;margin:0;display:grid;gap:4px}
.wege-liste li{padding:10px 0;border-bottom:1px solid var(--linie)}
.wege-raster .dok__titel{flex-direction:column;align-items:flex-start;gap:2px}
@media (min-width:760px){.hero h1{hyphens:none;-webkit-hyphens:none}}
.wege-raster .dok__hinweis{margin-left:0;text-align:left;max-width:none}

/* 14.11.2026 Pascal: Zweispaltige Köpfe oben bündig. Steht links ein Kicker über der H2, startet die rechte Spalte auf Höhe der H2 (Kicker 25px plus 18px Abstand). */
@media (min-width:1024px){.reg__kopf:has(> div > .kicker) > :last-child,.zweier-kopf:has(> div > .kicker) > :last-child{margin-top:43px}}

/* ---------- Phase B SEO 14.11.2026: Textlinks in neuen Absätzen mit 44px Tap-Höhe, lange Datenblatt-Bezeichnungen trennen ---------- */
.reg__kopf p a,.produkt__absatz a{display:inline-block;padding:11px 0;margin:-11px 0;color:var(--guss);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.reg__kopf p a:hover,.produkt__absatz a:hover{color:var(--blau)}
.produkt__absatz{margin-top:1em}
.daten dt{hyphens:auto;-webkit-hyphens:auto}