/* Schriften lokal (DSGVO) */
@font-face{font-family:"Bitter";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/bitter-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Bitter";font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/bitter-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Bitter";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/bitter-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/source-sans-3-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/source-sans-3-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/source-sans-3-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/source-sans-3-latin-700-normal.woff2) format("woff2")}
:root{
  --rot:#98162F;
  --rot-dunkel:#730F22;
  --rot-blass:#F7EDEF;
  --gelb:#FFE900;
  --text:#2B2A33;
  --leise:#6F6E7A;
  --linie:#E6E4E8;
  --grau:#F5F4F6;
  --dunkel:#24232B;
  --foto:#DCD6D8;
  --foto-text:#9F989B;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:5.5rem; scroll-behavior:smooth}
body{margin:0; background:#fff; color:var(--text); font-family:"Source Sans 3",system-ui,sans-serif;
  font-size:15px; line-height:1.75; -webkit-font-smoothing:antialiased}
a{color:inherit}
.wrap{width:min(1180px,100% - 3rem); margin-inline:auto}
h1,h2,h3.gross{font-family:Bitter,Georgia,serif; font-weight:600; margin:0;
  letter-spacing:-.005em; line-height:1.2}
h2{font-size:clamp(1.65rem,2.9vw,2.3rem)}
.ueberzeile{display:block; font-size:.6875rem; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:var(--rot); margin-bottom:.9rem}
.knopf{display:inline-flex; align-items:center; gap:.55rem; background:var(--rot); color:#fff;
  text-decoration:none; font-size:.6875rem; font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; padding:.95rem 1.4rem; border-radius:4px; white-space:nowrap;
  transition:background .25s}
.knopf:hover{background:var(--rot-dunkel)}
.knopf svg{width:12px; height:12px; transition:transform .25s}
.knopf:hover svg{transform:translateX(4px)}
.knopf--hell{background:#fff; color:var(--rot)}
.knopf--hell:hover{background:var(--rot-blass)}
.knopf--rand{background:transparent; color:var(--text); box-shadow:inset 0 0 0 1.5px var(--linie)}
.knopf--rand:hover{background:var(--grau)}
.foto{background:var(--foto); color:var(--foto-text); display:flex; align-items:center;
  justify-content:center; text-align:center; font-size:.6875rem; font-weight:700;
  letter-spacing:.12em; text-transform:uppercase; padding:1rem}

/* Einblenden beim Scrollen */
.js .rv{opacity:0; transform:translateY(26px); transition:opacity .7s ease, transform .7s ease}
.js .rv.zu{opacity:1; transform:none}
.js .rv.v1{transition-delay:.08s} .js .rv.v2{transition-delay:.16s} .js .rv.v3{transition-delay:.24s}

/* Kopf */
.kopf{background:rgba(255,255,255,.97); border-bottom:1px solid var(--linie);
  position:sticky; top:env(safe-area-inset-top,0px); z-index:50}
.kopf .wrap{display:flex; align-items:center; justify-content:space-between; gap:2rem; min-height:84px}
.kopf img{height:42px; width:auto; display:block}
.menue{display:flex; gap:1.8rem; font-size:.8125rem; font-weight:700; white-space:nowrap}
.menue a{text-decoration:none; padding:1.9rem 0; border-bottom:3px solid transparent;
  display:flex; align-items:center; gap:.3rem; transition:color .2s, border-color .2s}
.menue a:hover,.menue a[aria-current]{color:var(--rot); border-color:var(--rot)}
.menue svg{width:9px; height:9px}
.burger{display:none; background:none; border:0; color:inherit; padding:.4rem; cursor:pointer}

/* Hero: vier Bereiche als Panels */
.hero2{position:relative; height:clamp(700px,88vh,840px); background:#1C1B21; color:#fff; overflow:hidden; isolation:isolate}
.panele{position:absolute; inset:0; display:flex; z-index:0}
.panel{position:relative; flex:1 1 0; min-width:0; overflow:hidden; text-decoration:none; color:#fff;
  border-left:1px solid rgba(255,255,255,.16); transition:flex-grow .8s cubic-bezier(.65,0,.25,1)}
.panel:first-child{border-left:0}
.panel.ist-aktiv{flex-grow:2.7}
.panel img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block;
  transform:scale(1.14); filter:saturate(.55) brightness(.62);
  transition:transform 1.2s ease, filter .8s ease}
.panel.ist-aktiv img{transform:scale(1.02); filter:none; transition:transform 7s linear, filter .8s ease}
.panel__schleier{position:absolute; inset:0;
  background:linear-gradient(to top,rgba(20,19,24,.92) 0%,rgba(20,19,24,.35) 38%,rgba(20,19,24,0) 60%)}
.panel::after{content:""; position:absolute; left:0; right:0; bottom:0; height:5px; background:var(--rot);
  transform:scaleX(0); transform-origin:left; transition:transform .6s ease .2s}
.panel.ist-aktiv::after{transform:scaleX(1)}
.panel__inhalt{position:absolute; left:0; right:0; bottom:0; padding:0 1.6rem 6.6rem}
.panel:first-child .panel__inhalt{padding-left:max(1.6rem, calc((100vw - 1180px) / 2))}
.panel__spur{display:block; height:2px; width:min(100%,220px); background:rgba(255,255,255,.25); margin-bottom:1rem; overflow:hidden}
.panel__spur i{display:block; height:100%; width:100%; background:#fff; transform:scaleX(0); transform-origin:left}
.hero2.laeuft .ist-aktiv .panel__spur i,
.hero2.laeuft .tab.ist-aktiv .tab__spur i{animation:spur 6.5s linear forwards}
.hero2.pausiert .ist-aktiv .panel__spur i{animation:none; transform:scaleX(1)}
@keyframes spur{to{transform:scaleX(1)}}
.panel__nr{display:block; font-family:Bitter,Georgia,serif; font-weight:700; font-size:.8125rem; letter-spacing:.1em; color:#F2CBD3}
.panel__titel{display:block; font-family:Bitter,Georgia,serif; font-weight:600; font-size:1.15rem; line-height:1.25;
  margin-top:.25rem; transition:font-size .6s ease}
.panel.ist-aktiv .panel__titel{font-size:1.65rem}
.panel__text,.panel__mehr{display:block; max-height:0; opacity:0; overflow:hidden; transform:translateY(10px);
  transition:max-height .5s ease, opacity .4s ease, transform .5s ease}
.panel__text{font-size:.875rem; color:#E4E1E8; max-width:26rem; line-height:1.6}
.panel__mehr{font-size:.6875rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase}
.panel__mehr svg{width:12px; height:12px; vertical-align:-1px; margin-left:.35rem; transition:transform .25s}
.panel:hover .panel__mehr svg{transform:translateX(4px)}
.panel.ist-aktiv .panel__text{max-height:5rem; opacity:1; transform:none; margin-top:.5rem; transition-delay:.35s}
.panel.ist-aktiv .panel__mehr{max-height:2rem; opacity:1; transform:none; margin-top:.9rem; transition-delay:.45s}
.panel:focus-visible{outline:3px solid #fff; outline-offset:-3px}

.hero2::before{content:""; position:absolute; left:0; right:0; top:0; bottom:30%; z-index:1; pointer-events:none;
  background:linear-gradient(100deg,rgba(20,19,24,.9) 0%,rgba(20,19,24,.62) 32%,rgba(20,19,24,0) 60%);
  -webkit-mask-image:linear-gradient(to bottom,#000 72%,transparent); mask-image:linear-gradient(to bottom,#000 72%,transparent)}
.hero2__text{position:relative; z-index:2; pointer-events:none; padding-top:clamp(3rem,7vh,5rem)}
.hero2__text a{pointer-events:auto}
.hero2__text .ueberzeile{color:#F2CBD3}
.hero2 h1{font-size:clamp(2.4rem,4.6vw,4rem); line-height:1.08; color:#fff}
.hero2 h1 .zeile{display:block; overflow:hidden; padding-bottom:.06em}
.hero2 h1 .zeile > span{display:block}
.hero2 h1 em{font-style:normal; color:#fff; background:linear-gradient(transparent 68%,var(--rot) 68%, var(--rot) 92%,transparent 92%)}
.hero2__text p{color:#DAD7DE; max-width:28rem; margin:1.4rem 0 2rem; font-size:1rem}
.knopf--glas{background:rgba(255,255,255,.08); color:#fff; box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.4);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px)}
.knopf--glas:hover{background:rgba(255,255,255,.18)}
.hero2 h1 + .aktionen{margin-top:2rem}
.hero2__tabs{display:none}

/* Intro-Animation */
.js .hero2 .panel{animation:panelRein 1.1s cubic-bezier(.7,0,.2,1) both; animation-delay:calc(var(--i) * .12s)}
@keyframes panelRein{from{clip-path:inset(100% 0 0 0)}to{clip-path:inset(0 0 0 0)}}
.js .hero2 h1 .zeile > span{animation:zeileRein .9s cubic-bezier(.2,.7,.2,1) both}
.js .hero2 h1 .zeile:nth-child(1) > span{animation-delay:.55s}
.js .hero2 h1 .zeile:nth-child(2) > span{animation-delay:.7s}
@keyframes zeileRein{from{transform:translateY(105%)}to{transform:none}}
.js .hero2 .rein{animation:rein .8s ease both}
.js .hero2 .ueberzeile.rein{animation-delay:.4s}
.js .hero2 p.rein{animation-delay:.9s}
.js .hero2 .aktionen.rein{animation-delay:1.05s}
@keyframes rein{from{opacity:0; transform:translateY(18px)}to{opacity:1; transform:none}}

/* Schnellzugriff */
.schnell{position:relative; z-index:5; margin-top:-4.6rem}
.schnell .wrap{display:grid; grid-template-columns:repeat(4,1fr); gap:1rem}
.sz{position:relative; isolation:isolate; overflow:hidden; display:flex; flex-direction:column; gap:1.1rem;
  min-height:210px; padding:1.4rem 1.4rem 1.25rem; background:#fff; border-radius:4px; text-decoration:none;
  box-shadow:0 18px 44px rgba(28,27,33,.14);
  transition:transform .5s cubic-bezier(.2,.7,.2,1), box-shadow .5s ease}
.sz::before{content:""; position:absolute; inset:0; z-index:-2;
  background:linear-gradient(150deg,var(--rot) 0%,var(--rot-dunkel) 100%);
  transform:translateY(101%); transition:transform .6s cubic-bezier(.7,0,.2,1)}
.sz::after{content:""; position:absolute; inset:0; z-index:-1; opacity:0; transition:opacity .4s ease;
  background:radial-gradient(260px circle at var(--mx,50%) var(--my,0%),rgba(255,255,255,.22),transparent 70%)}
.sz:hover,.sz:focus-visible{transform:translateY(-8px); box-shadow:0 28px 56px rgba(152,22,47,.30)}
.sz:hover::before,.sz:focus-visible::before{transform:none}
.sz:hover::after{opacity:1}
.sz:focus-visible{outline:3px solid var(--text); outline-offset:3px}
.js .sz.rv.zu{transition:transform .5s cubic-bezier(.2,.7,.2,1), box-shadow .5s ease, opacity .7s ease}
.js .sz.rv.zu:hover,.js .sz.rv.zu:focus-visible{transform:translateY(-8px)}
.sz__kopf{display:flex; justify-content:space-between; align-items:flex-start}
.sz__icon{width:54px; height:54px; border-radius:4px; background:var(--rot); color:var(--gelb);
  display:grid; place-items:center; transition:background .4s, color .4s}
.sz__icon svg{width:30px; height:30px; transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.sz:hover .sz__icon{background:rgba(255,255,255,.16); color:var(--gelb)}
.sz:hover .sz__icon svg{transform:rotate(-8deg) scale(1.1)}
.sz__nr{font-family:Bitter,Georgia,serif; font-weight:700; font-size:.8125rem; letter-spacing:.1em; color:#C9C6CF; transition:color .4s}
.sz:hover .sz__nr{color:rgba(255,255,255,.55)}
.sz__titel{display:block; font-family:Bitter,Georgia,serif; font-weight:600; font-size:1.15rem; line-height:1.3;
  color:var(--text); transition:color .4s}
.sz__text{display:block; font-size:.8rem; line-height:1.55; color:var(--leise); margin-top:.3rem; transition:color .4s}
.sz:hover .sz__titel{color:#fff}
.sz:hover .sz__text{color:#F3D6DC}
.sz__fuss{margin-top:auto; display:flex; justify-content:space-between; align-items:center; gap:1rem;
  padding-top:.9rem; border-top:1px solid var(--linie); transition:border-color .4s}
.sz__fuss span{font-size:.6875rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--rot); transition:color .4s}
.sz__pfeil{width:34px; height:34px; border-radius:50%; display:grid; place-items:center; flex:none;
  box-shadow:inset 0 0 0 1.5px var(--linie); color:var(--rot);
  transition:background .4s, color .4s, box-shadow .4s, transform .5s cubic-bezier(.2,.7,.2,1)}
.sz__pfeil svg{width:14px; height:14px; transform:rotate(-45deg); transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.sz:hover .sz__fuss{border-color:rgba(255,255,255,.22)}
.sz:hover .sz__fuss > span:first-child{color:#fff}
.sz:hover .sz__pfeil{background:#fff; color:var(--rot); box-shadow:none; transform:scale(1.08)}
.sz:hover .sz__pfeil svg{transform:none}

/* Abschnitte */
.abschnitt{padding:6rem 0}
.abschnitt--grau{background:linear-gradient(to bottom, var(--grau), #fff)}
.kopfzeile{display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:end; margin-bottom:2.6rem}
.kopfzeile h2{max-width:22ch}
.kopfzeile--bereiche{margin-bottom:4.5rem; padding-bottom:2.6rem; border-bottom:1px solid var(--linie)}
.kopfzeile .rechts{display:flex; gap:2rem; align-items:center; justify-content:space-between}
.kopfzeile .rechts p{margin:0; color:var(--leise); font-size:.875rem; max-width:30rem}

/* Bereichskarten mit Text */
.karten{display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem}
.karte{display:flex; flex-direction:column; text-decoration:none; background:#fff;
  border-radius:4px; overflow:hidden; border:1px solid var(--linie);
  transition:transform .35s ease, box-shadow .35s ease}
.karte:hover{transform:translateY(-6px); box-shadow:0 20px 40px rgba(43,42,51,.12)}
.karte .bild{position:relative; aspect-ratio:4/3; overflow:hidden}
.karte .bild .foto{position:absolute; inset:0; transition:transform .6s ease}
.karte:hover .bild .foto{transform:scale(1.05)}
.karte .bild .deck{position:absolute; inset:0;
  background:linear-gradient(to top,rgba(115,15,34,.9),rgba(115,15,34,0) 60%)}
.karte .bild .titel{position:absolute; left:1.2rem; right:1.2rem; bottom:1rem; color:#fff;
  display:flex; align-items:center; gap:.6rem; font-weight:700; font-size:.9375rem; line-height:1.3}
.karte .bild svg{width:28px; height:28px; flex:none}
.karte .korpus{padding:1.2rem 1.2rem 1.4rem; display:flex; flex-direction:column; flex:1}
.karte p{margin:0 0 1rem; font-size:.8125rem; color:var(--leise); line-height:1.65}
.karte .mehr{margin-top:auto; font-size:.6875rem; font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; color:var(--rot); display:flex; align-items:center; gap:.45rem}
.karte .mehr svg{width:12px; height:12px; transition:transform .25s}
.karte:hover .mehr svg{transform:translateX(4px)}

/* Feature-Zeilen */
.feature{display:grid; grid-template-columns:1fr 1fr; gap:4.5rem; align-items:center}
.feature--umgekehrt .feature__bild{order:2}
.feature__bild{position:relative}
.feature__bild .gross{aspect-ratio:5/4; border-radius:4px; overflow:hidden; position:relative}
.feature__bild .gross .foto{position:absolute; inset:0}
.feature__bild .ecke{position:absolute; width:46%; aspect-ratio:1/1; right:-2rem; bottom:-2rem;
  border-radius:4px; overflow:hidden; border:6px solid #fff; box-shadow:0 14px 34px rgba(43,42,51,.14)}
.feature--umgekehrt .feature__bild .ecke{right:auto; left:-2rem}
.feature__bild .ecke .foto{position:absolute; inset:0}
.feature__bild .keil{position:absolute; left:-1.4rem; top:-1.4rem; width:38%; height:38%;
  background:var(--rot); clip-path:polygon(0 0,100% 0,0 100%); z-index:-1}
.feature--umgekehrt .feature__bild .keil{left:auto; right:-1.4rem; clip-path:polygon(0 0,100% 0,100% 100%)}
.feature__bild{isolation:isolate}
.feature p.lead{color:var(--leise); margin:1.2rem 0 1.6rem; font-size:.9375rem}
.liste{list-style:none; margin:0 0 1.8rem; padding:0; display:grid; grid-template-columns:1fr 1fr;
  gap:.65rem 1.4rem}
.liste li{display:flex; gap:.6rem; align-items:flex-start; font-size:.875rem; font-weight:600; line-height:1.45}
.liste li::before{content:""; width:9px; height:9px; margin-top:.35rem; flex:none;
  background:var(--rot); transform:rotate(45deg)}
.chips{display:flex; flex-wrap:wrap; gap:.5rem; margin:0 0 1.8rem}
.chip{display:inline-flex; align-items:center; gap:.4rem; padding:.45rem .85rem; border-radius:4px;
  background:var(--rot-blass); color:var(--rot); font-size:.75rem; font-weight:700}
.chip svg{width:13px; height:13px}
.aktionen{display:flex; gap:.8rem; flex-wrap:wrap}

/* Zahlenband */
.zahlen{background:var(--rot); color:#fff; position:relative; overflow:hidden}
.zahlen::before,.zahlen::after{content:""; position:absolute; background:rgba(255,255,255,.07);
  transform:rotate(45deg)}
.zahlen::before{width:260px; height:260px; left:-90px; top:-120px}
.zahlen::after{width:200px; height:200px; right:6%; bottom:-140px}
.zahlen .wrap{position:relative; display:grid; grid-template-columns:repeat(4,1fr); gap:2rem; padding:4.2rem 0}
.zahl{display:flex; gap:1rem; align-items:center}
.zahl b{font-family:Bitter,Georgia,serif; font-weight:600; font-size:clamp(2.4rem,4vw,3.4rem);
  line-height:1; font-variant-numeric:tabular-nums}
.zahl span{font-size:.8125rem; line-height:1.45; color:#F3D6DC; font-weight:600}

/* Video-Band */
.video{position:relative; height:420px; overflow:hidden}
.video .foto{position:absolute; inset:0; background:#3A3640; color:#8E8893}
.video .deck{position:absolute; inset:0; background:linear-gradient(90deg,rgba(36,35,43,.88) 0%,rgba(36,35,43,.4) 60%,rgba(36,35,43,.2) 100%)}
.video .wrap{position:relative; height:100%; display:flex; align-items:center; gap:2.5rem; color:#fff}
.play{width:92px; height:92px; border-radius:50%; background:var(--rot); display:grid; place-items:center;
  flex:none; border:0; cursor:pointer; position:relative; box-shadow:0 0 0 10px rgba(152,22,47,.3);
  transition:transform .3s, box-shadow .3s}
.play:hover{transform:scale(1.06); box-shadow:0 0 0 16px rgba(152,22,47,.25)}
.play svg{width:28px; height:28px; margin-left:5px}
.video h2{color:#fff; max-width:18ch}
.video p{margin:.8rem 0 0; color:#D8D5DD; max-width:32rem}

/* Über uns */
.ueber{display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center}
.collage{position:relative; aspect-ratio:1/1; max-width:500px}
.collage .r{position:absolute; transform:rotate(45deg); overflow:hidden; width:33%; height:33%; border-radius:4px}
.collage .r img{object-fit:cover; display:block; transition:transform .6s ease; position:absolute; left:-22%; top:-22%; width:144%; height:144%; transform:rotate(-45deg)}
.collage .r:hover img{transform:rotate(-45deg) scale(1.06)}
.collage .r .foto{position:absolute; left:-22%; top:-22%; width:144%; height:144%; transform:rotate(-45deg)}
.r1{left:33.5%; top:6%} .r2{left:8.5%; top:31%} .r3{left:58.5%; top:31%} .r4{left:33.5%; top:56%}
.collage .blass{position:absolute; transform:rotate(45deg); background:var(--grau); border-radius:4px; width:22%; height:22%}
.b1{left:-2%; top:6%} .b2{left:80%; top:56%}
.banner{position:absolute; left:-4%; bottom:4%; z-index:4; display:flex; align-items:stretch; height:62px}
.banner .kasten{background:var(--rot); color:#fff; padding:.55rem 1.4rem .55rem 1.2rem;
  clip-path:polygon(0 0,100% 0,88% 100%,0 100%); min-width:160px}
.banner b{display:block; font-family:Bitter,Georgia,serif; font-weight:600; font-size:1.25rem; line-height:1.15}
.banner small{font-size:.625rem; font-weight:600; color:#F2CBD3; line-height:1.2; display:block}
.banner .pfeil{width:34px; background:#C9A3AC; margin-left:-10px; clip-path:polygon(0 0,60% 0,100% 50%,60% 100%,0 100%,40% 50%)}
.banner .pfeil + .pfeil{background:var(--rot-dunkel); margin-left:-14px}
.ueber > div > p{color:var(--leise); margin:1.2rem 0 0; font-size:.875rem}
.ueber > div > p + p{margin-top:.8rem}
.ueber .links3{margin-top:1.6rem}
.links3{display:grid; grid-template-columns:repeat(3,1fr); gap:.9rem; margin-bottom:1.8rem}
.l3{border:1px solid var(--linie); border-radius:4px; padding:1.1rem 1rem; text-decoration:none;
  transition:border-color .25s, background .25s}
.l3:hover{border-color:var(--rot); background:var(--rot-blass)}
.l3 svg{width:36px; height:36px; color:var(--rot); display:block; margin-bottom:.5rem}
.l3 b{display:block; font-size:.875rem}
.l3 span{font-size:.75rem; color:var(--leise)}

/* Standorte */
.orte{display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem}
.ort{background:#fff; border-radius:4px; overflow:hidden; border:1px solid var(--linie)}
.ort .karte-k{height:190px; position:relative; background:#EAE6E8; overflow:hidden}
.ort .karte-k img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.ort:hover .karte-k img{transform:scale(1.06)}
.ort .korpus{padding:1.3rem 1.3rem 1.5rem}
.ort h3{margin:0 0 .35rem; font-size:1rem}
.ort p{margin:0 0 1rem; font-size:.8125rem; color:var(--leise); line-height:1.6}
.ort .mehr{font-size:.6875rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--rot); text-decoration:none}

/* Gesellschaften: Firmenstruktur */
.struktur{--linie-b:3rem; display:grid; grid-template-columns:1fr 240px 1fr; align-items:center}
.struktur .seite{position:relative; display:grid; grid-template-rows:repeat(3,1fr); gap:1rem}
.struktur .seite--l{padding-right:var(--linie-b)}
.struktur .seite--r{padding-left:var(--linie-b)}
/* Sammelleitung */
.struktur .seite::before{content:""; position:absolute; top:calc(100% / 6); bottom:calc(100% / 6); width:2px;
  background:var(--linie); transform:scaleY(0); transition:transform .9s cubic-bezier(.2,.7,.2,1) .5s}
.struktur .seite--l::before{right:0}
.struktur .seite--r::before{left:0}
.struktur.zu .seite::before{transform:scaleY(1)}

.ges{position:relative; display:flex; align-items:center; gap:1rem; min-height:96px; padding:1rem 1.1rem;
  background:#fff; border-radius:4px; box-shadow:0 1px 0 rgba(43,42,51,.04), 0 10px 26px rgba(43,42,51,.06);
  transition:transform .45s cubic-bezier(.2,.7,.2,1), box-shadow .45s ease}
/* Anschlussleitung */
.ges::after{content:""; position:absolute; top:50%; width:var(--linie-b); height:2px; background:var(--linie);
  transform:scaleX(0); transition:transform .6s ease .9s, background .3s ease}
.seite--l .ges::after{right:calc(-1 * var(--linie-b)); transform-origin:right}
.seite--r .ges::after{left:calc(-1 * var(--linie-b)); transform-origin:left}
.struktur.zu .ges::after{transform:scaleX(1)}
.ges::before{content:""; position:absolute; top:calc(50% - 5px); width:10px; height:10px; background:var(--rot);
  transform:rotate(45deg) scale(0); transition:transform .4s ease 1.3s; z-index:1}
.seite--l .ges::before{right:-5px}
.seite--r .ges::before{left:-5px}
.struktur.zu .ges::before{transform:rotate(45deg) scale(1)}
.seite--l .ges:hover{transform:translateX(6px)}
.seite--r .ges:hover{transform:translateX(-6px)}
.js .seite--l .ges.rv.zu:hover{transform:translateX(6px)}
.js .seite--r .ges.rv.zu:hover{transform:translateX(-6px)}
.js .ges.rv.zu{transition:transform .45s cubic-bezier(.2,.7,.2,1), box-shadow .45s ease, opacity .7s ease}
.ges:hover{box-shadow:0 0 0 1.5px var(--rot), 0 18px 36px rgba(152,22,47,.14)}
.ges:hover::after{background:var(--rot)}
.ges__icon{width:46px; height:46px; flex:none; border-radius:4px; background:var(--rot); color:var(--gelb);
  display:grid; place-items:center; transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.ges:hover .ges__icon{transform:rotate(-6deg) scale(1.06)}
.ges__icon svg{width:26px; height:26px}
.ges b{display:block; font-size:.875rem; line-height:1.35}
.ges > span:nth-child(2){padding-right:1.3rem}
.ges small{display:block; font-size:.75rem; color:var(--leise); margin-top:.2rem; font-weight:500}
.ges__nr{position:absolute; top:.6rem; right:.8rem; font-family:Bitter,Georgia,serif; font-weight:700; font-size:.6875rem;
  letter-spacing:.08em; color:#CFCBD2}

.kern{position:relative; justify-self:center; width:240px; height:240px; display:grid; place-items:center}
.kern::before,.kern::after{content:""; position:absolute; left:50%; top:50%; height:2px; width:calc(50% - 64px); background:var(--linie);
  transform:scaleX(0); transition:transform .6s ease .3s}
.kern::before{right:calc(50% + 64px); left:auto; transform-origin:left}
.kern::after{left:calc(50% + 64px); transform-origin:right}
.struktur.zu .kern::before,.struktur.zu .kern::after{transform:scaleX(1)}
.kern__raute{position:relative; width:128px; height:128px; transform:rotate(45deg); border-radius:4px; background:#fff;
  box-shadow:0 0 0 3px var(--rot), 0 20px 44px rgba(152,22,47,.22); display:grid; place-items:center; z-index:1}
.kern__raute > div{transform:rotate(-45deg); text-align:center}
.kern__raute img{width:104px; height:auto; display:block; margin:0 auto}
.kern__raute small{display:block; font-size:.625rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--rot); margin-top:.15rem}
.kern__ring{position:absolute; left:50%; top:50%; width:128px; height:128px; margin:-64px 0 0 -64px; border-radius:4px;
  border:2px solid var(--rot); transform:rotate(45deg); opacity:0; animation:ring 3.2s ease-out infinite}
.kern__ring + .kern__ring{animation-delay:1.6s}
@keyframes ring{0%{transform:rotate(45deg) scale(1); opacity:.5}100%{transform:rotate(45deg) scale(1.55); opacity:0}}

/* Jobs */
.jobs{background:var(--dunkel); color:#fff; position:relative; overflow:hidden}
.jobs::before{content:""; position:absolute; right:0; top:0; bottom:0; width:38%; background:var(--rot);
  clip-path:polygon(22% 0,100% 0,100% 100%,0 100%)}
.jobs .wrap{position:relative; display:flex; align-items:center; justify-content:space-between; gap:2rem; padding:4.2rem 0}
.jobs h2{color:#fff; max-width:20ch}
.jobs p{margin:.7rem 0 0; color:#C9C6CF; max-width:34rem}

/* Fuß */
footer{background:#1C1B21; color:#B8B7C0; padding:3.5rem 0 1.8rem; font-size:.8125rem}
footer .oben{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:2.5rem; padding-bottom:2.2rem;
  border-bottom:1px solid rgba(255,255,255,.12)}
footer h4{color:#fff; font-size:.75rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; margin:0 0 1rem}
footer ul{list-style:none; margin:0; padding:0; line-height:2.1}
footer a{color:#DDDCE3; text-decoration:none}
footer a:hover{color:#fff; text-decoration:underline}
footer .logo-weiss{background:#fff; display:inline-block; padding:.6rem .8rem; border-radius:4px; margin-bottom:1rem}
footer .logo-weiss img{height:34px; width:auto; display:block}
footer .f-verwaltung{font-style:normal; margin-top:1.2rem; line-height:1.7}
footer .f-verwaltung b{display:block; color:#fff; font-size:.75rem; letter-spacing:.12em; text-transform:uppercase; margin-bottom:.3rem}
footer .unten{display:flex; justify-content:space-between; gap:1.5rem; flex-wrap:wrap; padding-top:1.3rem}

@media (max-width:1080px){
  .menue{display:none}
  .burger{display:block}
  .hero2{height:auto; min-height:620px; display:flex; flex-direction:column}
  .panel{position:absolute; inset:0; border-left:0; opacity:0; transition:opacity 1.1s ease}
  .panel.ist-aktiv{opacity:1}
  .panel::after,.panel__inhalt{display:none}
  .js .hero2 .panel{animation:none}
  .hero2::before{bottom:0; -webkit-mask-image:none; mask-image:none; background:linear-gradient(to top,rgba(20,19,24,.92) 0%,rgba(20,19,24,.55) 45%,rgba(20,19,24,.35) 100%)}
  .hero2__text{padding-top:3.5rem; padding-bottom:1.5rem}
  .hero2__tabs{display:grid; grid-template-columns:repeat(4,1fr); gap:.6rem; position:relative; z-index:2;
    margin-top:auto; padding-bottom:6rem}
  .tab{background:none; border:0; color:#fff; text-align:left; padding:0; cursor:pointer; font:inherit}
  .tab__spur{display:block; height:3px; background:rgba(255,255,255,.28); overflow:hidden; margin-bottom:.55rem}
  .tab__spur i{display:block; height:100%; background:var(--rot); transform:scaleX(0); transform-origin:left}
  .tab:not(.ist-aktiv) .tab__spur i{animation:none !important}
  .tab b{display:block; font-size:.75rem; font-weight:700; line-height:1.3; opacity:.65; transition:opacity .3s}
  .tab.ist-aktiv b{opacity:1}
  .schnell .wrap{grid-template-columns:1fr 1fr}
  .kopfzeile,.feature,.ueber{grid-template-columns:1fr; gap:2.4rem}
  .kopfzeile .rechts{flex-wrap:wrap}
  .feature--umgekehrt .feature__bild{order:0}
  .karten{grid-template-columns:1fr 1fr}
  .zahlen .wrap{grid-template-columns:1fr 1fr}
  .orte{grid-template-columns:1fr}
  .struktur{grid-template-columns:1fr; gap:1rem}
  .kern{order:-1; width:100%; height:190px}
  .kern::before,.kern::after,.struktur .seite::before,.ges::after,.ges::before{display:none}
  .struktur .seite--l,.struktur .seite--r{padding:0}
  .seite--l .ges:hover,.seite--r .ges:hover,.js .seite--l .ges.rv.zu:hover,.js .seite--r .ges.rv.zu:hover{transform:translateY(-3px)}
  .jobs .wrap{flex-direction:column; align-items:flex-start}
  .jobs::before{display:none}
  footer .oben{grid-template-columns:1fr 1fr}
  .abschnitt{padding:4.2rem 0}
}
@media (max-width:600px){
  .schnell .wrap,.karten,.liste,.links3{grid-template-columns:1fr}
  .sz{min-height:0}
  .feature__bild .ecke{display:none}
  .video .wrap{flex-direction:column; align-items:flex-start; justify-content:center}
  footer .oben{grid-template-columns:1fr}
}
/* Bilder in Platzhalter-Rahmen */
.bildfuell{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block}
.karte .bild .bildfuell{transition:transform .6s ease}
.karte:hover .bild .bildfuell{transform:scale(1.05)}
.feature__bild .bildfuell{transition:transform .8s ease}
.feature__bild:hover .gross .bildfuell{transform:scale(1.04)}
.zahl b small{font-size:.5em; font-weight:600; margin-left:.12em}
.zahl b i{font-style:normal}

/* Energie */
.energie{position:relative; overflow:hidden; isolation:isolate; padding:6.5rem 0; color:#fff;
  background:
    radial-gradient(900px 560px at 88% 0%, rgba(255,233,0,.14), transparent 62%),
    radial-gradient(800px 560px at 0% 100%, rgba(80,6,20,.55), transparent 62%),
    var(--rot)}
.energie__netz{position:absolute; inset:0; width:100%; height:100%; z-index:-1; pointer-events:none}
.energie__netz .basis{fill:none; stroke:rgba(255,255,255,.1); stroke-width:1.2}
.energie__netz .fluss{fill:none; stroke:var(--gelb); stroke-width:1.6; stroke-linecap:round;
  stroke-dasharray:70 1400; opacity:.4; animation:fluss 7s linear infinite}
.energie__netz .fluss:nth-of-type(2n){animation-duration:9s; animation-delay:-3s; stroke:#fff}
.energie__netz .fluss:nth-of-type(3n){animation-duration:11s; animation-delay:-6s}
@keyframes fluss{from{stroke-dashoffset:1470}to{stroke-dashoffset:0}}
.energie .ueberzeile{color:var(--gelb)}
.energie h2{color:#fff}
.energie .kopfzeile .rechts p{color:#F3D6DC}

.energie__top{display:grid; grid-template-columns:1.05fr 1fr; gap:1.4rem; margin-bottom:1.4rem}
.energie__bild{position:relative; border-radius:4px; overflow:hidden; min-height:420px}
.energie__bild .bildfuell{transition:transform 1.2s ease}
.energie__bild:hover .bildfuell{transform:scale(1.05)}
.energie__bild .deck{position:absolute; inset:0;
  background:linear-gradient(to top,rgba(80,6,20,.92) 0%,rgba(80,6,20,.25) 50%,rgba(80,6,20,0) 70%)}
.energie__bild .unten{position:absolute; left:1.6rem; right:1.6rem; bottom:1.5rem}
.energie__bild .unten b{display:block; font-family:Bitter,Georgia,serif; font-weight:700; font-size:1.35rem; line-height:1.3}
.energie__bild .unten span{display:block; font-size:.8125rem; color:#D5D1DA; margin-top:.3rem}
.energie__bild .chip-hell{position:absolute; left:1.6rem; top:1.4rem; display:inline-flex; align-items:center; gap:.5rem;
  padding:.45rem .8rem; border-radius:4px; background:rgba(80,6,20,.6); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  font-size:.6875rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase}

.zaehler{position:relative; border-radius:4px; padding:2rem 2rem 1.8rem; display:flex; flex-direction:column;
  background:linear-gradient(160deg,rgba(255,255,255,.12),rgba(255,255,255,.04));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18); overflow:hidden}
.zaehler::before{content:""; position:absolute; width:340px; height:340px; right:-120px; top:-140px; border-radius:50%;
  background:radial-gradient(circle,rgba(255,233,0,.22),transparent 65%); animation:atmen 5s ease-in-out infinite}
@keyframes atmen{50%{transform:scale(1.15); opacity:.7}}
.zaehler__label{display:flex; align-items:center; gap:.6rem; font-size:.75rem; font-weight:700; letter-spacing:.1em;
  text-transform:uppercase; color:#D5D1DA}
.puls{width:9px; height:9px; border-radius:50%; background:var(--gelb); box-shadow:0 0 0 0 rgba(255,233,0,.6);
  animation:puls 1.8s ease-out infinite; flex:none}
@keyframes puls{70%{box-shadow:0 0 0 10px rgba(255,233,0,0)}100%{box-shadow:0 0 0 0 rgba(255,233,0,0)}}
.zaehler__wert{font-family:Bitter,Georgia,serif; font-weight:700; font-size:clamp(2.3rem,4.6vw,3.9rem); line-height:1;
  margin:1.1rem 0 .3rem; color:var(--gelb); font-variant-numeric:tabular-nums; letter-spacing:-.01em;
  text-shadow:0 0 34px rgba(255,233,0,.25); white-space:nowrap}
.zaehler__wert small{font-size:.38em; color:#fff; margin-left:.35rem; letter-spacing:0; text-shadow:none}
.zaehler__hinweis{margin:0; font-size:.75rem; color:#F0C4CD}
.zaehler__balken{margin:1.6rem 0 .5rem; height:8px; border-radius:4px; background:rgba(0,0,0,.22); overflow:hidden}
.zaehler__balken i{display:block; height:100%; width:0; border-radius:inherit;
  background:linear-gradient(90deg,#fff,var(--gelb)); box-shadow:0 0 18px rgba(255,233,0,.45);
  transition:width 1.6s cubic-bezier(.2,.7,.2,1)}
.zaehler__skala{display:flex; justify-content:space-between; font-size:.6875rem; color:#F0C4CD}
.zaehler__kpis{margin-top:auto; padding-top:1.6rem; display:grid; grid-template-columns:repeat(3,1fr); gap:1rem;
  border-top:1px solid rgba(255,255,255,.2)}
.zaehler__kpis b{display:block; font-family:Bitter,Georgia,serif; font-weight:700; font-size:1.6rem; line-height:1.1}
.zaehler__kpis span{font-size:.75rem; color:#F3D6DC; line-height:1.4; display:block; margin-top:.2rem}

.etiles{display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem}
.et{position:relative; isolation:isolate; overflow:hidden; border-radius:4px; padding:1.5rem 1.5rem 1.4rem;
  background:rgba(255,255,255,.07); box-shadow:inset 0 0 0 1px rgba(255,255,255,.16);
  transition:transform .5s cubic-bezier(.2,.7,.2,1), box-shadow .5s ease, background .5s ease}
.et::after{content:""; position:absolute; inset:0; z-index:-1; opacity:0; transition:opacity .4s;
  background:radial-gradient(280px circle at var(--mx,50%) var(--my,0%),rgba(255,233,0,.13),transparent 70%)}
.et:hover{background:rgba(255,255,255,.11); box-shadow:inset 0 0 0 1px rgba(255,233,0,.6), 0 24px 50px rgba(60,4,15,.45)}
.et:hover::after{opacity:1}
.js .et.rv.zu{transition:transform .5s cubic-bezier(.2,.7,.2,1), box-shadow .5s ease, background .5s ease, opacity .7s ease}
.js .et.rv.zu:hover,.et:hover{transform:translateY(-6px)}
.et__kopf{display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:1.2rem}
.et__icon{width:52px; height:52px; border-radius:4px; display:grid; place-items:center; color:var(--gelb);
  background:rgba(0,0,0,.18); box-shadow:inset 0 0 0 1px rgba(255,233,0,.3)}
.et__icon svg{width:30px; height:30px; overflow:visible}
.et__wert{font-family:Bitter,Georgia,serif; font-weight:700; font-size:2rem; line-height:1; color:#fff}
.et__wert small{font-size:.48em; color:var(--gelb); margin-left:.25rem}
.et h3{margin:.55rem 0 .4rem; font-size:1rem; line-height:1.35; color:#fff}
.et p{margin:0; font-size:.8125rem; color:#F3D6DC; line-height:1.6}
.status{display:inline-flex; align-items:center; gap:.4rem; font-size:.625rem; font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; padding:.32rem .65rem; border-radius:4px; white-space:nowrap}
.status--an{background:rgba(0,0,0,.22); color:var(--gelb)}
.status--an::before{content:""; width:6px; height:6px; border-radius:50%; background:currentColor; animation:puls 1.8s ease-out infinite}
.status--plan{background:rgba(255,255,255,.18); color:#fff}
.status--offen{color:#F3D6DC; box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}

/* animierte Icons */
.ic-rotor{transform-box:view-box; transform-origin:16px 12px; animation:drehen 3.2s linear infinite}
.et:hover .ic-rotor{animation-duration:1.1s}
@keyframes drehen{to{transform:rotate(360deg)}}
.ic-strahl{animation:strahlen 2.4s ease-in-out infinite}
@keyframes strahlen{50%{opacity:.25}}
.ic-glanz{animation:glanz 3s ease-in-out infinite}
@keyframes glanz{0%,60%,100%{opacity:0}30%{opacity:1}}
.ic-tropfen{animation:tropfen 2.6s ease-in-out infinite}
@keyframes tropfen{50%{transform:translateY(-2px)}}
.ic-ladung{transform-box:fill-box; transform-origin:left center; animation:laden 2.8s ease-in-out infinite}
@keyframes laden{0%{transform:scaleX(.1)}70%,100%{transform:scaleX(1)}}
.ic-flamme{transform-box:fill-box; transform-origin:50% 100%; animation:flackern 1.4s ease-in-out infinite}
@keyframes flackern{25%{transform:scale(1.04,.96)}50%{transform:scale(.97,1.05)}75%{transform:scale(1.03,.98)}}

.efuss{display:flex; justify-content:space-between; align-items:center; gap:1.2rem 2rem; flex-wrap:wrap; font-size:.8125rem}
.energie .efuss{color:#F3D6DC; margin-top:2.2rem}
.energie .efuss b{color:#fff}
.knopf--gelb{background:var(--gelb); color:#1C1B21}
.knopf--gelb:hover{background:#fff}

/* Immobilien */
.karte .ort-zeile{display:block; font-size:.6875rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:var(--leise); margin-bottom:.4rem}
.zitat{margin:2.4rem 0 0; padding:1.4rem 1.6rem; border-left:4px solid var(--rot); background:var(--grau);
  border-radius:0 4px 4px 0; display:flex; justify-content:space-between; align-items:center; gap:1.5rem 2.5rem; flex-wrap:wrap}
.zitat q{font-family:Bitter,Georgia,serif; font-weight:600; font-size:1.1rem; line-height:1.45; quotes:"„" "“"}
.ikarten{display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem}
.ik{position:relative; isolation:isolate; display:block; aspect-ratio:4/5; border-radius:4px; overflow:hidden;
  color:#fff; text-decoration:none; box-shadow:0 14px 34px rgba(43,42,51,.12);
  transition:transform .5s cubic-bezier(.2,.7,.2,1), box-shadow .5s ease}
.js .ik.rv.zu{transition:transform .5s cubic-bezier(.2,.7,.2,1), box-shadow .5s ease, opacity .7s ease}
.ik:hover,.js .ik.rv.zu:hover{transform:translateY(-6px); box-shadow:0 26px 50px rgba(152,22,47,.22)}
.ik .bildfuell{transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
.ik:hover .bildfuell{transform:scale(1.07)}
.ik__deck{position:absolute; inset:0; background:linear-gradient(to top,rgba(28,27,33,.92) 0%,rgba(28,27,33,.4) 42%,rgba(28,27,33,0) 68%)}
.ik::after{content:""; position:absolute; inset:0; z-index:1; opacity:0; transition:opacity .5s ease;
  background:linear-gradient(to top,rgba(115,15,34,.96) 0%,rgba(152,22,47,.6) 50%,rgba(152,22,47,.08) 100%)}
.ik:hover::after{opacity:1}
.ik__tag{position:absolute; left:1.3rem; top:1.3rem; z-index:2; padding:.42rem .75rem; border-radius:4px;
  background:rgba(28,27,33,.45); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  font-size:.625rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase}
.ik__pfeil{position:absolute; right:1.3rem; top:1.3rem; z-index:2; width:42px; height:42px; border-radius:50%;
  display:grid; place-items:center; background:rgba(255,255,255,.14); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.35); transition:background .4s, color .4s, transform .5s cubic-bezier(.2,.7,.2,1)}
.ik__pfeil svg{width:16px; height:16px; transform:rotate(-45deg); transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.ik:hover .ik__pfeil{background:#fff; color:var(--rot); transform:scale(1.08)}
.ik:hover .ik__pfeil svg{transform:none}
.ik__inhalt{position:absolute; left:1.6rem; right:1.6rem; bottom:1.5rem; z-index:2}
.ik__titel{display:block; font-family:Bitter,Georgia,serif; font-weight:600; font-size:1.65rem; line-height:1.2}
.ik__titel::after{content:""; display:block; width:34px; height:3px; margin-top:.7rem; background:var(--gelb);
  transition:width .5s cubic-bezier(.2,.7,.2,1)}
.ik:hover .ik__titel::after{width:70px}
.ik__text,.ik__mehr{display:block; max-height:0; opacity:0; overflow:hidden; transform:translateY(10px);
  transition:max-height .5s ease, opacity .4s ease, transform .5s ease, margin .5s ease}
.ik__text{font-size:.875rem; line-height:1.6; color:#F3E3E7}
.ik__mehr{font-size:.6875rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase}
.ik:hover .ik__text{max-height:6rem; opacity:1; transform:none; margin-top:.8rem}
.ik:hover .ik__mehr{max-height:2rem; opacity:1; transform:none; margin-top:.9rem; transition-delay:.08s}
@media (hover:none){
  .ik__text,.ik__mehr{max-height:none; opacity:1; transform:none}
  .ik__text{margin-top:.8rem} .ik__mehr{margin-top:.8rem}
}
@media (max-width:1080px){.ikarten{grid-template-columns:1fr 1fr} .ik:last-child{grid-column:1 / -1; aspect-ratio:16/9}}
@media (max-width:640px){.ikarten{grid-template-columns:1fr} .ik,.ik:last-child{aspect-ratio:4/5}}
.karten.karten--3{grid-template-columns:repeat(3,1fr); gap:1.4rem}
.karten--3 .karte .bild{aspect-ratio:3/2}
@media (max-width:800px){.karten.karten--3{grid-template-columns:1fr}}
.zitat{flex-direction:column; align-items:stretch; gap:1.4rem}
.nutzungen{padding-top:1.3rem; border-top:1px solid var(--linie)}
.nutzungen__titel{display:block; font-size:.6875rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--leise); margin-bottom:1rem}
.nutzungen ul{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(5,1fr); gap:1rem 1.4rem}
.nutzungen li{display:flex; align-items:center; gap:.75rem; font-size:.8125rem; font-weight:600; line-height:1.35; hyphens:manual}
.nutzung__icon{flex:none; color:var(--rot); display:grid; place-items:center}
.nutzung__icon svg{width:36px; height:36px}
@media (max-width:1080px){.nutzungen ul{grid-template-columns:repeat(3,1fr)}}
@media (max-width:600px){.nutzungen ul{grid-template-columns:1fr 1fr}}

/* Standort-Karten */
.ort.st{position:relative; isolation:isolate; display:flex; flex-direction:column; border:0; border-radius:4px; overflow:hidden;
  padding:1.6rem 1.6rem 1.5rem; background:transparent; box-shadow:inset 0 0 0 1.5px #DEDAE0;
  transition:transform .45s cubic-bezier(.2,.7,.2,1), box-shadow .45s ease}
.js .st.rv.zu{transition:transform .45s cubic-bezier(.2,.7,.2,1), box-shadow .45s ease, background .45s ease, opacity .7s ease}
.st:hover,.js .st.rv.zu:hover{transform:translateY(-6px); background:rgba(255,255,255,.55); box-shadow:inset 0 0 0 1.5px var(--rot),0 24px 46px rgba(152,22,47,.12)}
.st::before{content:""; position:absolute; left:0; top:0; right:0; height:4px; background:var(--rot);
  transform:scaleX(.16); transform-origin:left; transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.st:hover::before{transform:scaleX(1)}
.st::after{content:""; position:absolute; z-index:-1; right:-56px; top:-56px; width:150px; height:150px;
  border:2px solid var(--rot-blass);
  transform:rotate(45deg); transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.st:hover::after{transform:rotate(90deg) scale(1.08)}
.st__kopf{display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-bottom:1rem}
.st__nr{font-family:Bitter,Georgia,serif; font-weight:700; font-size:2.4rem; line-height:1; color:#E9D3D8}
.st__status{display:inline-flex; align-items:center; gap:.45rem; padding:.38rem .7rem; border-radius:4px; background:var(--grau);
  font-size:.6875rem; font-weight:700; color:var(--leise); white-space:nowrap; background:#fff}
.st__status i{width:8px; height:8px; border-radius:50%; background:#B9B4BC; flex:none}
.st__status.offen{background:#EAF4EC; color:#24663A}
.st__status.offen i{background:#2E8B4A; animation:puls-gruen 1.8s ease-out infinite}
@keyframes puls-gruen{0%{box-shadow:0 0 0 0 rgba(46,139,74,.5)}70%,100%{box-shadow:0 0 0 8px rgba(46,139,74,0)}}
.st h3{margin:.15rem 0 .4rem; font-family:Bitter,Georgia,serif; font-weight:600; font-size:1.55rem; line-height:1.2}
.ort.st p.st__leist{margin:0; font-size:.8125rem; color:var(--leise); line-height:1.6}
.st__adresse{display:flex; gap:.75rem; align-items:flex-start; margin:1.2rem 0; font-size:.875rem; line-height:1.5; color:var(--leise)}
.st__adresse b{color:var(--text)}
.st__pin{width:34px; height:34px; flex:none; border-radius:4px; background:var(--rot); color:var(--gelb); display:grid; place-items:center}
.st__pin svg{width:18px; height:18px}
.ort.st .tun{margin-top:auto; padding-top:1.3rem; display:grid; grid-template-columns:1fr 1fr; gap:.5rem}
.ort.st .tun a{justify-content:center; padding:.85rem .6rem}
@media (prefers-reduced-motion: reduce){.st__status.offen i{animation:none}}
/* Standort-Karten in Rot */
.ort.st{background:var(--rot); color:#fff; box-shadow:0 14px 34px rgba(152,22,47,.18)}
.st:hover,.js .st.rv.zu:hover{background:var(--rot-dunkel); box-shadow:0 26px 50px rgba(115,15,34,.32)}
.st::before{background:var(--gelb)}
.st::after{border-color:rgba(255,255,255,.14)}
.st__nr{color:rgba(255,255,255,.22)}
.ort.st .tag{color:var(--gelb)}
.st h3{color:#fff}
.ort.st p.st__leist{color:#F3D6DC}
.st__adresse{color:#F3D6DC}
.st__adresse b{color:#fff}
.st__pin{background:rgba(0,0,0,.2); color:var(--gelb)}
.st__status{background:rgba(0,0,0,.2); color:#fff}
.st__status i{background:rgba(255,255,255,.5)}
.st__status.offen{background:#fff; color:#24663A}
.ort.st .tun a{color:#fff; box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.45); background:transparent}
.ort.st .tun a:hover{background:rgba(255,255,255,.12); box-shadow:inset 0 0 0 1.5px #fff}
.ort.st .tun a:first-child{background:#fff; color:var(--rot); box-shadow:none}
.ort.st .tun a:first-child:hover{background:var(--rot-blass)}


/* Standorte: Zeiten und Aktionen */
.ort .zeiten{font-size:.75rem; color:var(--leise); line-height:1.65; margin:0 0 1.1rem; padding:.75rem .9rem;
  background:var(--grau); border-radius:4px}
.ort .zeiten b{color:var(--text)}
.ort .tag{display:inline-block; font-size:.625rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--rot); margin-bottom:.4rem}
.ort .tun{display:flex; gap:.5rem; flex-wrap:wrap}
.ort .tun a{display:inline-flex; align-items:center; gap:.4rem; font-size:.6875rem; font-weight:700; letter-spacing:.06em;
  text-transform:uppercase; text-decoration:none; padding:.6rem .85rem; border-radius:4px;
  box-shadow:inset 0 0 0 1.5px var(--linie); transition:background .25s, box-shadow .25s}
.ort .tun a:hover{background:var(--rot-blass); box-shadow:inset 0 0 0 1.5px var(--rot)}
.ort .tun a:first-child{background:var(--rot); color:#fff; box-shadow:none}
.ort .tun a:first-child:hover{background:var(--rot-dunkel)}
.ort .tun svg{width:13px; height:13px}

/* Mobile Aktionsleiste */
.aktionsleiste{display:none}

@media (max-width:1080px){
  .energie__top{grid-template-columns:1fr}
  .energie__bild{min-height:300px}
  .etiles{grid-template-columns:1fr 1fr}
  .energie{padding:4.5rem 0}
  .feature__bild .ecke{right:-1rem}
  .feature--umgekehrt .feature__bild .ecke{right:auto; left:-1rem}
  .menue.offen{display:flex; flex-direction:column; gap:0; position:absolute; left:0; right:0; top:100%;
    background:#fff; border-bottom:1px solid var(--linie); box-shadow:0 18px 30px rgba(43,42,51,.08); padding:.4rem 0 1rem}
  .menue.offen a{padding:.85rem 1.5rem; border-bottom:0; border-left:3px solid transparent}
}
@media (max-width:600px){
  .etiles{grid-template-columns:1fr}
  .zaehler__kpis{gap:.6rem}
  .zaehler__kpis b{font-size:1.3rem}
  .zaehler{padding:1.6rem 1.4rem}
  .aktionsleiste{display:grid; grid-template-columns:repeat(3,1fr); position:fixed; left:0; right:0; bottom:0; z-index:60;
    background:#fff; border-top:1px solid var(--linie); box-shadow:0 -8px 24px rgba(43,42,51,.08);
    padding-bottom:env(safe-area-inset-bottom,0px)}
  .aktionsleiste a{display:flex; flex-direction:column; align-items:center; gap:.15rem; padding:.6rem 0 .55rem;
    font-size:.6875rem; font-weight:700; text-decoration:none; color:var(--text)}
  .aktionsleiste a:first-child{background:var(--rot); color:#fff}
  .aktionsleiste svg{width:20px; height:20px}
  body{padding-bottom:62px}
}
@media (prefers-reduced-motion: reduce){
  .kern__ring{animation:none}
  .energie__netz .fluss,.zaehler::before,.puls,.status--an::before,.ic-rotor,.ic-strahl,.ic-glanz,.ic-tropfen,.ic-ladung,.ic-flamme{animation:none}
  .js .hero2 .panel,.js .hero2 h1 .zeile > span,.js .hero2 .rein{animation:none}
  .hero2 .panel__spur i,.hero2 .tab__spur i{animation:none !important; transform:scaleX(1)}
  .panel.ist-aktiv img{transform:none}
  .js .rv{opacity:1; transform:none; transition:none}
  *{transition-duration:.01ms !important}
  html{scroll-behavior:auto}
}

/* Parallax */
.px{translate:0 var(--py,0px); will-change:translate}
.video .bildfuell{top:-25%; height:150%}
.ik .bildfuell{top:-15%; height:130%}
.energie__netz{inset:auto; left:0; top:-15%; width:100%; height:130%}
.zahlen::before{translate:0 var(--py,0px)}
.zahlen::after{translate:0 calc(var(--py,0px) * -1.6)}

/* Collage: Rauten fügen sich zusammen */
.collage .r{transition:translate .25s linear, opacity .8s ease, scale 1s cubic-bezier(.2,.7,.2,1)}
.collage .r1{translate:0 calc(var(--spread,0px) * -1)}
.collage .r2{translate:calc(var(--spread,0px) * -1) 0}
.collage .r3{translate:var(--spread,0px) 0}
.collage .r4{translate:0 var(--spread,0px)}
.js .collage.rv .r{opacity:0; scale:.55}
.js .collage.rv.zu .r{opacity:1; scale:1}
.js .collage.rv.zu .r2{transition-delay:0s,.12s,.12s}
.js .collage.rv.zu .r3{transition-delay:0s,.24s,.24s}
.js .collage.rv.zu .r4{transition-delay:0s,.36s,.36s}
@media (prefers-reduced-motion: reduce){.js .collage.rv .r{opacity:1; scale:1}}

/* Jobs mit Team-Foto */
.jobs{overflow:visible; margin-top:14rem}
#kontakt{padding-bottom:6rem}
.jobs::before{width:46%; clip-path:polygon(24% 0,100% 0,100% 100%,0 100%)}
.jobs .wrap{display:grid; grid-template-columns:1fr minmax(0,520px); align-items:end; gap:2rem; padding:0}
.jobs__text{padding:4.6rem 0}
.jobs__text .knopf{margin-top:1.8rem}
.jobs__team{position:relative; align-self:end; display:flex; justify-content:center}
.jobs__team::before{content:""; position:absolute; left:50%; bottom:100px; width:360px; height:360px; margin-left:-180px;
  background:#F7EDEF; transform:rotate(45deg); border-radius:4px; box-shadow:0 0 0 14px rgba(255,255,255,.12)}
.jobs__team img{position:relative; display:block; backface-visibility:hidden; width:100%; height:auto; margin-top:-9rem;}
@media (max-width:1080px){
  #kontakt{padding-bottom:4.2rem}
  .jobs{margin-top:0}
  .jobs .wrap{grid-template-columns:1fr; gap:0}
  .jobs__text{padding:4rem 0 4.5rem}
  .jobs__team img{margin-top:0; max-width:440px}
  .jobs__team::before{width:220px; height:220px; margin-left:-110px; bottom:70px}
}
.knopf--gross{padding:1.15rem 1.9rem; font-size:.8125rem; gap:.7rem}
.knopf--gross svg{width:14px; height:14px}

/* Zahlenband neu */
.zahlen .wrap{grid-template-columns:repeat(4,1fr); gap:0; padding:4.8rem 0}
.zahlen .zahl{flex-direction:column; align-items:flex-start; gap:0; padding:0 2.2rem; border-left:1px solid rgba(255,255,255,.18)}
.zahlen .zahl:first-child{border-left:0; padding-left:0}
.zahl .zahl__icon{width:46px; height:46px; border-radius:4px; background:rgba(0,0,0,.18); color:var(--gelb);
  display:grid; place-items:center; margin-bottom:1.4rem; transition:transform .5s cubic-bezier(.2,.7,.2,1), background .4s}
.zahl .zahl__icon svg{width:26px; height:26px; overflow:visible}
.zahl:hover .zahl__icon{transform:translateY(-4px) rotate(-6deg); background:rgba(0,0,0,.28)}
.zahlen .zahl b{font-family:Bitter,Georgia,serif; font-weight:700; font-size:clamp(2.5rem,4.4vw,3.9rem); line-height:1; letter-spacing:-.01em; white-space:nowrap}
.zahlen .zahl b small{font-size:.4em; color:var(--gelb); margin-left:.25rem; font-weight:700}
.zahl .zahl__linie{display:block; width:42px; height:3px; background:var(--gelb); margin:1.05rem 0 .85rem;
  transform:scaleX(0); transform-origin:left; transition:transform .9s cubic-bezier(.2,.7,.2,1) .35s}
.zahl.zu .zahl__linie{transform:scaleX(1)}
.zahl:hover .zahl__linie{width:72px}
.zahl .zahl__text{display:block; font-size:.875rem; font-weight:600; line-height:1.45; color:#F3D6DC; max-width:15ch}
@media (max-width:1080px){
  .zahlen .wrap{grid-template-columns:1fr 1fr; row-gap:2.6rem}
  .zahlen .zahl:nth-child(3){border-left:0; padding-left:0}
}
@media (max-width:600px){
  .zahlen .zahl{padding:0 0 0 1.1rem}
  .zahlen .zahl b{font-size:2.3rem}
  .zahl .zahl__icon{width:40px; height:40px; margin-bottom:1rem}
}

/* Nach oben */
.nach-oben{position:fixed; right:1.5rem; bottom:1.5rem; z-index:55; width:52px; height:52px; border:3px solid #fff; border-radius:50%; cursor:pointer;
  background:var(--rot); color:#fff; display:grid; place-items:center; overflow:hidden;
  box-shadow:0 12px 28px rgba(152,22,47,.32); opacity:0; visibility:hidden; transform:translateY(16px);
  transition:opacity .35s ease, transform .35s ease, visibility 0s linear .35s, background .25s}
.nach-oben.sichtbar{opacity:1; visibility:visible; transform:none; transition:opacity .35s ease, transform .35s ease, background .25s}
.nach-oben:hover{background:var(--rot-dunkel)}
.nach-oben svg{color:var(--gelb); width:18px; height:18px; transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.nach-oben:hover svg{transform:translateY(-3px)}
.nach-oben i{display:none}
.nach-oben:focus-visible{outline:3px solid var(--text); outline-offset:3px}
@media (max-width:600px){.nach-oben,.nach-oben.sichtbar{display:none}}

/* Video: Loop im Hintergrund + Lightbox */
.video .video__loop{opacity:0; transition:opacity 1.2s ease}
.video .video__loop.laeuft{opacity:1}
.video .deck{z-index:1}
.video .wrap{z-index:2}
.play::after{content:""; position:absolute; inset:-14px; border-radius:50%; border:2px solid rgba(255,255,255,.5); animation:play-puls 2.2s ease-out infinite}
@keyframes play-puls{0%{transform:scale(.85); opacity:.9}100%{transform:scale(1.35); opacity:0}}
.lightbox{position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:clamp(1rem,4vw,3rem);
  background:rgba(20,19,24,.9); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); opacity:0; transition:opacity .35s ease}
.lightbox[hidden]{display:none}
.lightbox.offen{opacity:1}
.lightbox__rahmen{position:relative; width:min(1200px,100%); aspect-ratio:16/9; transform:scale(.96); transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.lightbox.offen .lightbox__rahmen{transform:none}
.lightbox video{width:100%; height:100%; display:block; background:#000; border-radius:4px; box-shadow:0 30px 80px rgba(0,0,0,.5)}
.lightbox__zu{position:absolute; right:0; top:-3.4rem; width:44px; height:44px; border-radius:50%; border:2px solid #fff; background:var(--rot);
  color:#fff; display:grid; place-items:center; cursor:pointer; transition:background .25s, transform .3s}
.lightbox__zu:hover{background:var(--rot-dunkel); transform:rotate(90deg)}
.lightbox__zu svg{width:18px; height:18px}
@media (prefers-reduced-motion: reduce){.play::after{animation:none}}

/* Standorte im Bereich Sand & Kies */
.orte-band{background:#fff; padding:5.5rem 0 2.5rem; margin-top:0; scroll-margin-top:80px}
@media (max-width:1080px){ .orte-band{padding:4.2rem 0} }
/* Baustraße unter Sand & Kies */
#kies{padding-bottom:0}
.baustrasse{position:relative; height:190px; margin-top:0; overflow:hidden; pointer-events:none}
.fz{position:absolute; bottom:-12px; left:0; will-change:transform}
.fz svg{display:block; width:100%; height:auto; overflow:visible}
.fz--bagger{width:250px; z-index:1}
.fz--lkw{width:270px; z-index:2; bottom:-11px}
.fz .rad{transform-box:fill-box; transform-origin:center}
.fz--bagger .arm{transform-box:view-box; transform-origin:118px 66px; animation:baggern 3.4s ease-in-out infinite}
@keyframes baggern{0%,100%{transform:rotate(0)}45%{transform:rotate(-9deg)}70%{transform:rotate(4deg)}}
.fz--lkw .staub circle{fill:#CBB998}
@media (max-width:760px){
  .baustrasse{height:130px}
  .fz--bagger{width:170px}
  .fz--lkw{width:185px}
}
@media (prefers-reduced-motion: reduce){
  .fz--bagger .arm{animation:none}
}

/* Golfschlag unter Freizeit */
.golfbahn{position:relative; height:230px; margin-top:6rem; pointer-events:none}
.golfbahn__svg{position:absolute; inset:0; width:100%; height:100%; overflow:visible}
.golfbahn .spur{fill:none; stroke:#98162F; stroke-width:2; stroke-dasharray:2 9; stroke-linecap:round; opacity:.55}
.golfbahn .spur{transition:opacity .9s ease}
.golfbahn.eingelocht .spur{opacity:0}
.golfbahn .maske{fill:none; stroke:#fff; stroke-width:8}
.golfbahn .boden{stroke:var(--linie); stroke-width:2}
.golfbahn .gruen{fill:#DCEBCF}
.golfbahn .loch{fill:#24232B}
.gball{position:absolute; left:0; top:0; width:20px; height:20px; margin:-10px 0 0 -10px; will-change:transform; z-index:2}
.gball svg{display:block; width:100%; height:100%}
.gschatten{position:absolute; left:0; top:0; width:20px; height:6px; margin:-3px 0 0 -10px; border-radius:50%;
  background:rgba(36,35,43,.22); will-change:transform,opacity}
.fahne{position:absolute; bottom:28px; width:46px; height:110px; margin-left:-2px; transform-origin:2px 100%}
.fahne svg{display:block; width:100%; height:100%; overflow:visible}
.fahne .tuch{transform-box:fill-box; transform-origin:0 50%; animation:wehen 2.6s ease-in-out infinite}
@keyframes wehen{0%,100%{transform:skewY(0) scaleX(1)}50%{transform:skewY(-5deg) scaleX(.9)}}
.fahne.wackelt{animation:wackeln .9s ease-out}
@keyframes wackeln{0%{transform:rotate(0)}20%{transform:rotate(-9deg)}45%{transform:rotate(6deg)}70%{transform:rotate(-3deg)}100%{transform:rotate(0)}}
@media (max-width:760px){
  .golfbahn{height:160px; margin-top:4rem}
  .fahne{height:80px; width:34px}
  .gball{width:15px; height:15px; margin:-7.5px 0 0 -7.5px}
}
@media (prefers-reduced-motion: reduce){
  .fahne .tuch,.fahne.wackelt{animation:none}
}

/* Stadtbild unter Immobilien */
.stadtbild{position:relative; height:240px; margin-top:3rem; overflow:hidden; pointer-events:none}
.sb-ebene{position:absolute; bottom:0; left:-6%; width:112%; will-change:transform}
.sb-ebene svg{display:block; width:100%; height:auto; overflow:visible}
.sb-ebene--hinten{bottom:0}
.sb-ebene--vorne .f{fill:#730F22; transition:fill .6s ease}
.sb-ebene--vorne .f.an{fill:#FFE900}
@media (max-width:760px){
  .stadtbild{height:150px; margin-top:2.5rem}
  .sb-ebene{left:-70%; width:240%}
}

/* Ausgelagerte Inline-Styles */
#freizeit{padding-bottom:2rem}
#immobilien{padding-bottom:0}
.ueberzeile--hell{color:#F2CBD3}
footer .f-intro{margin:0; line-height:1.8}
.pos-62-50{object-position:62% 50%}
.pos-50-50{object-position:50% 50%}
.pos-50-55{object-position:50% 55%}
.pos-50-60{object-position:50% 60%}
.pos-65-50{object-position:65% 50%}
.pos-58-50{object-position:58% 50%}
.pos-45-85{object-position:45% 85%}
.pos-60-50{object-position:60% 50%}
.panel[data-i="0"]{--i:0}
.panel[data-i="1"]{--i:1}
.panel[data-i="2"]{--i:2}
.panel[data-i="3"]{--i:3}

/* Unternehmen: jetzt direkt nach Immobilien, darum eigener Hintergrund */
#ueber{background:#EBE9ED}
#ueber .collage .blass{background:var(--linie)}
/* Link-Kacheln Unternehmen */
#ueber .links3{gap:1rem; margin-top:2rem}
#ueber .l3{position:relative; display:flex; flex-direction:column; overflow:hidden;
  background:#fff; border:0; border-radius:6px; padding:1.4rem 1.2rem 2.9rem; color:var(--text);
  box-shadow:0 1px 2px rgba(36,35,43,.06);
  transition:transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s ease}
#ueber .l3::before{content:""; position:absolute; left:0; top:0; height:3px; width:36px; background:var(--rot);
  transition:width .4s cubic-bezier(.2,.7,.2,1)}
#ueber .l3::after{content:""; position:absolute; left:1.25rem; bottom:1.25rem; width:7px; height:7px;
  border-top:2px solid var(--rot); border-right:2px solid var(--rot); transform:rotate(45deg);
  transition:transform .3s ease}
#ueber .l3 svg{box-sizing:border-box; width:52px; height:52px; padding:11px; margin-bottom:1rem;
  border-radius:50%; background:var(--rot-blass); color:var(--rot); stroke-width:1.7;
  transition:background .3s ease, color .3s ease}
#ueber .l3 b{font-family:Bitter,Georgia,serif; font-weight:700; font-size:1rem; line-height:1.3; margin-bottom:.3rem}
#ueber .l3 span{font-size:.8125rem; line-height:1.5; color:var(--leise)}
#ueber .l3:hover{transform:translateY(-5px); background:#fff; box-shadow:0 18px 34px -16px rgba(36,35,43,.28)}
#ueber .l3:hover::before{width:100%}
#ueber .l3:hover::after{transform:translateX(5px) rotate(45deg)}
#ueber .l3:hover svg{background:var(--rot); color:#fff}
#ueber .l3:focus-visible{outline:2px solid var(--rot); outline-offset:3px}
@media (max-width:1080px){
  #ueber .l3{display:grid; grid-template-columns:auto 1fr; column-gap:1rem; align-items:center; padding:1.1rem 2.8rem 1.1rem 1.1rem}
  #ueber .l3 svg{grid-row:span 2; margin:0; width:46px; height:46px; padding:9px}
  #ueber .l3 b{margin:0; align-self:end}
  #ueber .l3 span{align-self:start}
  #ueber .l3::after{left:auto; right:1.3rem; bottom:auto; top:50%; margin-top:-4px}
}
@media (prefers-reduced-motion: reduce){
  #ueber .l3, #ueber .l3::before, #ueber .l3::after, #ueber .l3 svg{transition:none}
  #ueber .l3:hover{transform:none}
}

/* Neues Logo (Davids Firmengruppe, 646 x 240) */
.kopf img{height:50px}
footer .logo-weiss{background:none; padding:0; border-radius:0; margin-bottom:1.2rem}
footer .logo-weiss img{height:46px}
.kern__raute img{width:96px}
@media (max-width:600px){ .kopf img{height:42px} }

/* Standort-Auswahl im Bereich Sand und Kies */
.ortwahl{margin:0 0 1.8rem}
.ortwahl .ueberzeile{margin-bottom:.7rem}
.ortwahl .chips{margin:0}
.ortwahl .chip{border:0; cursor:pointer; font-family:inherit; line-height:1.2;
  transition:background .25s ease, color .25s ease}
.ortwahl .chip:hover{background:#EFD9DE}
.ortwahl .chip[aria-expanded="true"]{background:var(--rot); color:#fff}
.ortwahl .chip:focus-visible{outline:2px solid var(--rot); outline-offset:2px}
.ortwahl__klappe{display:grid; grid-template-rows:0fr; transition:grid-template-rows .4s cubic-bezier(.2,.7,.2,1)}
.ortwahl__klappe.offen{grid-template-rows:1fr}
.ortwahl__innen{overflow:hidden; min-height:0}
.ortwahl__feld{display:flex; align-items:center; justify-content:space-between; gap:1.2rem; flex-wrap:wrap;
  margin-top:.8rem; padding:1.1rem 1.2rem; background:#fff; border:1px solid var(--linie);
  border-left:3px solid var(--rot); border-radius:6px; animation:ortRein .35s ease}
.ortwahl__info{display:flex; flex:1 1 220px; align-items:flex-start; gap:.8rem}
.ortwahl__pin{flex:none; width:38px; height:38px; border-radius:50%; background:var(--rot-blass); color:var(--rot);
  display:grid; place-items:center}
.ortwahl__pin svg{width:18px; height:18px}
.ortwahl__info small{display:block; font-size:.6875rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--leise)}
.ortwahl__info b{display:block; font-family:Bitter,Georgia,serif; font-size:1rem; margin:.1rem 0 .2rem}
.ortwahl__info > span > span{font-size:.875rem; color:var(--leise); line-height:1.5}

.ortwahl__feld[hidden]{display:none}
@keyframes ortRein{from{opacity:0; transform:translateY(6px)} to{opacity:1; transform:none}}
@media (prefers-reduced-motion: reduce){
  .ortwahl__klappe{transition:none} .ortwahl__feld{animation:none}
}