/* Schuster Immobilien – Nachbau der Framer-Vorlage „Manzil“ (Werte aus brain\_lernen\schuster\VORLAGE.md) */
@font-face{font-family:"Libre Baskerville";src:url(../fonts/baskerville-400.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Libre Baskerville";src:url(../fonts/baskerville-400-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Libre Baskerville";src:url(../fonts/baskerville-700.woff2) format("woff2");font-weight:500 700;font-style:normal;font-display:swap}
@font-face{font-family:"Open Sans";src:url(../fonts/opensans-300.woff2) format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"Open Sans";src:url(../fonts/opensans-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Open Sans";src:url(../fonts/opensans-400-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Open Sans";src:url(../fonts/opensans-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Open Sans";src:url(../fonts/opensans-600.woff2) format("woff2");font-weight:600;font-display:swap}

:root{
  --schwarz:#030304; --gold:#C09458; --gold-hell:#F3EADC; --hell:#F9F9F9; --weiss:#fff; --grau:#D6D6D6; --grau-t:#888;
  --text2:rgba(0,0,0,.6); --linie:rgba(3,3,4,.1);
  --serif:"Libre Baskerville",Georgia,serif; --sans:"Open Sans",Arial,sans-serif;
  --rand:64px; --sek:120px; --r:12px; --feder:cubic-bezier(.22,1.2,.36,1); --weich:cubic-bezier(.44,0,.56,1);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--hell);color:var(--schwarz);font:400 16px/1.4 var(--sans);letter-spacing:-.02em;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,h5,h6,p{margin:0}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:16px;z-index:999;background:#fff;padding:8px 12px}
.wrap{max-width:1440px;margin:0 auto;padding:0 var(--rand)}
.sek{padding:var(--sek) 0}
.sek--weiss{background:var(--weiss)}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* Typo */
.h1{font:400 74px/1.2 var(--serif);letter-spacing:-.07em}
.h1 em,.h2 em,.cta__titel em{font-style:italic;color:var(--gold);letter-spacing:-.05em}
.h1 em{display:block;line-height:1.1}
.h2{font:400 48px/1.2 var(--serif);letter-spacing:-.05em}
.h5{font:500 20px/1.4 var(--serif);letter-spacing:0}
.h6{font:500 18px/1.4 var(--serif);letter-spacing:0}
.p{font-size:16px;line-height:1.4;color:var(--text2)}
.p--dunkel{color:var(--schwarz)}
.label{font:500 16px/1.2 var(--sans);text-transform:uppercase;letter-spacing:0}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:16px;line-height:1.2;text-transform:uppercase;color:var(--text2);margin-bottom:24px}
.karo{display:inline-block;width:8px;height:8px;background:var(--gold);transform:rotate(45deg);border-radius:1px;flex:none}
.hell-text .eyebrow{color:#F9F9F9}.hell-text .karo{background:var(--gold)}

/* Kopf einer Sektion: Überschrift links, Text rechts */
.kopf{display:grid;grid-template-columns:1fr 417px;gap:24px 64px;align-items:end;margin-bottom:64px}
.kopf__text{display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.kopf--mitte{display:block;text-align:center}

/* Wörter-Animation (Überschriften) und Einblenden */
.js [data-woerter] .wort{display:inline-block;opacity:0;transform:translateY(16px) rotateX(-90deg);transform-origin:50% 100%;transition:opacity .5s ease-out,transform .6s var(--feder)}
.js [data-woerter].ist-da .wort{opacity:1;transform:none}
.js [data-anim]{opacity:0;transform:translateY(24px);transition:opacity .8s ease-out,transform .9s var(--feder)}
.js [data-anim].ist-da{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js [data-woerter] .wort,.js [data-anim]{opacity:1!important;transform:none!important;transition:none}}

/* Klammer-Button „[ LABEL ↗ ]“ mit Text-Roll */
.kb{display:inline-flex;align-items:center;gap:6px;color:var(--schwarz)}
.kb__k{font:300 24px/1.4 var(--sans)}
.kb__roll{display:inline-flex;align-items:flex-start;gap:8px;height:20px;overflow:hidden}
.kb__roll>svg{align-self:center}
.kb__spur{display:flex;flex-direction:column;transition:transform .4s var(--feder)}
.kb__spur span{display:block;height:20px;font:500 16px/20px var(--sans);text-transform:uppercase;letter-spacing:0;white-space:nowrap}
.kb svg{width:14px;height:14px;transition:transform .4s var(--feder)}
.kb:hover .kb__spur{transform:translateY(-20px)}
.kb:hover svg{transform:rotate(45deg)}
.kb--hell{color:#fff}

/* Navigation: schwebende Karte oben mittig */
.nav{position:fixed;top:16px;left:16px;right:16px;margin:0 auto;max-width:600px;z-index:50}
.nav__karte{display:flex;align-items:center;justify-content:space-between;height:60px;padding:12px 20px 12px 24px;background:rgba(255,255,255,.96);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);border-radius:8px;box-shadow:0 4px 24px rgba(0,0,0,.08)}
.nav__marke{font:italic 400 20px/1.4 var(--serif);letter-spacing:-.02em;transition:color .2s}
.nav__marke:hover{color:var(--text2)}
.nav__knopf{display:flex;align-items:center;gap:10px;color:var(--gold);font:500 16px/1.2 var(--sans);text-transform:uppercase;letter-spacing:0}
.nav__punkte{display:grid;grid-template-columns:repeat(3,4px);gap:4px;transition:transform .43s ease-out}
.nav__punkte i{width:4px;height:4px;border-radius:50%;background:var(--gold)}
.nav__knopf:hover .nav__punkte,.nav.offen .nav__punkte{transform:rotate(45deg)}
.nav__panel{margin-top:8px;background:#fff;border-radius:8px;box-shadow:0 12px 40px rgba(0,0,0,.12);padding:6px 24px 20px;display:none}
.nav.offen .nav__panel{display:block;animation:auf .35s var(--feder)}
@keyframes auf{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.nav__panel a{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid var(--linie);font:500 18px/1.2 var(--sans);text-transform:uppercase;letter-spacing:0;transition:color .2s}
.nav__panel a:hover,.nav__panel a[aria-current]{color:var(--gold)}
.nav__panel .nav__klein{display:block;border:0;padding:12px 0 0;font:400 16px/1.4 var(--sans);text-transform:none;color:var(--text2)}
.pfeil,.nav__panel a svg{width:16px;height:16px;flex:none}

/* Schwebender Anruf-Knopf unten rechts */
.anruf{position:fixed;right:21px;bottom:21px;z-index:40;display:flex;align-items:center;gap:10px;background:var(--schwarz);color:#fff;border-radius:8px;padding:10px 22px;font:400 16px/1.4 var(--sans);transition:background .17s}
.anruf:hover{background:rgba(3,3,4,.7)}
.anruf svg{width:16px;height:16px}

/* Hero */
.hero{position:relative;height:100vh;min-height:720px;max-height:1100px;overflow:hidden;background:var(--hell)}
.hero__bild{position:absolute;inset:0}
.hero__bild img{width:100%;height:100%;object-fit:cover}
.hero__bild::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(249,249,249,0) 35%,rgba(249,249,249,.55) 62%,rgba(249,249,249,.94) 88%,#F9F9F9 100%)}
.hero__text{position:absolute;left:0;right:0;bottom:56px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px;padding:0 24px}
.hero__text .p{max-width:430px;color:rgba(3,3,4,.75);margin:6px 0 4px}
.maus{width:20px;height:32px;border:1.5px solid rgba(3,3,4,.6);border-radius:10px;position:relative;margin-top:12px}
.maus::after{content:"";position:absolute;left:50%;top:6px;width:2px;height:8px;margin-left:-1px;background:rgba(3,3,4,.6);border-radius:2px;animation:maus 1.6s ease-in-out infinite}
@keyframes maus{0%{opacity:0;transform:translateY(0)}30%{opacity:1}100%{opacity:0;transform:translateY(10px)}}

/* About */
.about{padding:160px 0 100px}
.about__oben{display:grid;grid-template-columns:1fr 2fr;gap:24px}
.about__bild{border-radius:var(--r);overflow:hidden;aspect-ratio:1.9/1}
.about__bild img{width:100%;height:100%;object-fit:cover}
.about__unten{display:grid;grid-template-columns:1fr 417px;gap:64px;margin-top:64px;align-items:end}
.punkte{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.punkte li{display:flex;align-items:center;gap:12px;font-size:16px;line-height:1.4}
.person{display:flex;align-items:center;gap:16px;margin-top:24px}
.person img{width:64px;height:64px;border-radius:50%;object-fit:cover}
.person .p{font-size:14px}

/* Metrics */
.zahlen{display:grid;grid-template-columns:1fr 1fr;background:#fff}
.zahl{padding:40px 32px 32px;display:flex;flex-direction:column;gap:8px;border-right:1px solid var(--linie);border-bottom:1px solid var(--linie);min-height:220px}
.zahl:nth-child(2n){border-right:0}.zahl:nth-last-child(-n+2){border-bottom:0}
.zahl__wert{font:600 80px/1 var(--serif);letter-spacing:-.03em;margin-bottom:24px;color:#000}
.zahl__wert small{font-size:.5em;margin-left:6px}
.zahl .p{max-width:360px}

/* Tabs + Objektkarten */
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}
.tab{padding:6px 16px;border-radius:6px;background:var(--hell);color:var(--grau-t);font:400 16px/1.6 var(--sans);transition:background .2s,color .2s}
.tab:hover{background:var(--grau);color:var(--schwarz)}
.tab.aktiv{background:var(--schwarz);color:#fff}
.karten{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.karte{position:relative;display:flex;flex-direction:column;background:var(--hell);border-radius:var(--r);overflow:hidden;transition:opacity .3s}
.sek--hell .karte{background:#fff}
.karte[hidden]{display:none}
.karte__bild{position:relative;aspect-ratio:1.55/1;overflow:hidden;border-radius:var(--r) var(--r) 0 0}
.karte__bild img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .57s ease-out}
.karte__bild img+img{opacity:0}
.karte:hover .karte__bild img+img{opacity:1}
.karte:hover .karte__bild img:first-child:not(:only-of-type){opacity:0}
.pille{position:absolute;top:12px;right:12px;z-index:2;background:#fff;border-radius:20px;padding:4px 12px;font-size:13px;line-height:1.4}
.pille--gold{background:var(--gold);color:#fff}
.karte__text{padding:20px 20px 24px;display:flex;flex-direction:column;gap:8px;flex:1}
.ort{display:flex;gap:6px;align-items:flex-start;font-size:14px;color:var(--text2)}
.ort svg{width:14px;height:14px;flex:none;margin-top:2px}
.preis{font:400 20px/1.4 var(--serif);letter-spacing:-.02em;margin-top:4px}
.merkmale{display:flex;justify-content:space-between;gap:8px;border-top:1px solid var(--linie);padding-top:14px;margin-top:auto;font-size:14px;color:var(--text2)}
.merkmale span{display:flex;align-items:center;gap:6px}
.merkmale svg{width:15px;height:15px}
.karten__mehr{margin-top:48px;text-align:center}

/* Why choose us: dunkles Bild, Text links sticky, Karten rechts gestapelt */
.warum{position:relative;color:#fff;background:#141414}
.warum__bg{position:absolute;inset:0;overflow:hidden}
.warum__bg img{width:100%;height:100%;object-fit:cover;position:sticky;top:0}
.warum__bg::after{content:"";position:absolute;inset:0;background:rgba(10,10,12,.55)}
.warum .wrap{position:relative;display:grid;grid-template-columns:1fr 420px;gap:64px}
.warum__links{position:sticky;top:calc(100vh - 360px);align-self:start;padding-bottom:40px}
.warum__links .p{color:#F9F9F9;max-width:360px;margin-top:24px}
.warum__karten{display:flex;flex-direction:column;gap:80px;padding-bottom:40px}
.wkarte{position:sticky;background:#fff;color:var(--schwarz);border-radius:var(--r);padding:24px;min-height:300px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 20px 50px rgba(0,0,0,.25)}
.wkarte:nth-child(1){top:140px;width:88%;margin-left:auto}
.wkarte:nth-child(2){top:160px;width:94%;margin-left:auto}
.wkarte:nth-child(3){top:180px}
.wkarte:nth-child(4){top:200px}
.wkarte__nr{font:400 48px/1.2 var(--serif);letter-spacing:-.05em}
.wkarte .p{margin-top:8px}

/* Services: Zeilen, die sich beim Scrollen stapeln */
.dienste{display:flex;flex-direction:column}
.dienst{position:sticky;top:110px;background:#fff;border-top:1px solid var(--linie);padding:32px;display:grid;grid-template-columns:1fr 400px 1fr;gap:24px;min-height:264px}
.dienst:nth-child(2){top:130px}.dienst:nth-child(3){top:150px}.dienst:nth-child(4){top:170px}.dienst:nth-child(5){top:190px}
.dienst__nr{font:400 74px/1.2 var(--serif);letter-spacing:-.07em;color:var(--grau)}
.dienst__links{display:flex;flex-direction:column;justify-content:space-between}
.dienst__bild{border-radius:var(--r);overflow:hidden;height:200px}
.dienst__bild img{width:100%;height:100%;object-fit:cover}
.dienst__rechts{display:flex;flex-direction:column;justify-content:space-between;gap:16px}
.tags{display:flex;flex-wrap:wrap;gap:8px}
.tags span{padding:4px 12px;border-radius:20px;background:var(--hell);font-size:14px;text-transform:uppercase;color:var(--text2);letter-spacing:0}
.tags span.gold{background:var(--gold-hell);color:var(--gold)}

/* Team */
.team{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.tkarte__bild{aspect-ratio:1.07/1;border-radius:var(--r);overflow:hidden;background:#e9e7e3;margin-bottom:16px;position:relative}
.tkarte__bild img{width:100%;height:100%;object-fit:cover}
.tkarte__bild--contain img{object-fit:contain;padding:24px;background:#fff}
.tkarte .p{margin-top:4px}
.ph-box{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;padding:24px;color:var(--text2);background:repeating-linear-gradient(135deg,#efede9 0 14px,#e7e4df 14px 28px)}
.ph-box img{width:96px!important;height:96px!important;border-radius:50%;object-fit:cover;filter:grayscale(.1)}
.ph-box b{font:italic 400 16px/1.4 var(--serif);color:var(--schwarz)}

/* Testimonials */
.stimmen{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:stretch}
.stimmen__bild{border-radius:var(--r);overflow:hidden;height:560px;position:relative}
.stimmen__bild img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.stimmen__rechts{display:flex;flex-direction:column;justify-content:space-between;min-width:0}
.ticker{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 4%,#000 88%,transparent)}
.ticker__band{display:flex;gap:16px;width:max-content;animation:lauf var(--dauer,60s) linear infinite}
.ticker:hover .ticker__band{animation-play-state:paused}
@keyframes lauf{to{transform:translateX(calc(-50% - 8px))}}
.skarte{width:424px;min-height:250px;background:#fff;border-radius:8px;padding:24px;display:flex;flex-direction:column;justify-content:space-between;gap:16px}
.skarte .p{color:rgba(0,0,0,.75)}
.skarte__wer{display:flex;flex-direction:column;gap:2px}
.skarte__wer b{font:500 16px/1.2 var(--serif)}
.skarte__wer small{font-size:14px;color:var(--text2)}
.sterne{color:var(--gold);letter-spacing:2px;font-size:14px}
.siegelzeile{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:24px}
.siegelzeile img{height:72px;width:auto;border-radius:6px}

/* Blogs / Ratgeber */
.blogs{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:start}
.bkarte__bild{border-radius:var(--r);overflow:hidden;aspect-ratio:1.16/1;margin-bottom:16px}
.bkarte:nth-child(2) .bkarte__bild{aspect-ratio:1.9/1}
.bkarte__bild img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--weich)}
.bkarte:hover .bkarte__bild img{transform:scale(1.04)}
.bkarte__kat{font-size:14px;color:var(--text2)}
.bkarte__titel{display:flex;justify-content:space-between;gap:16px;align-items:flex-end;margin-top:6px}
.bkarte__titel svg{width:14px;height:14px;flex:none;transition:transform .3s}
.bkarte:hover .bkarte__titel svg{transform:rotate(45deg)}

/* FAQ */
.faq{margin-top:64px;border-top:1px solid var(--linie)}
.faq__item{border-bottom:1px solid var(--linie);background:transparent;transition:background .3s}
.faq__item.offen{background:#fff}
.faq__frage{width:100%;display:flex;justify-content:space-between;align-items:center;gap:24px;text-align:left;padding:28px var(--rand);font:400 16px/1.4 var(--sans);color:var(--schwarz)}
.faq__knopf{width:36px;height:36px;border-radius:50%;background:#fff;display:grid;place-items:center;flex:none;transition:background .3s,color .3s}
.faq__item.offen .faq__knopf{background:var(--schwarz);color:#fff}
.faq__knopf svg{width:16px;height:16px;transition:transform .3s}
.faq__item.offen .faq__knopf .senk{transform:scaleY(0)}
.faq__antwort{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s var(--weich)}
.faq__item.offen .faq__antwort{grid-template-rows:1fr}
.faq__antwort>div{overflow:hidden}
.faq__antwort .p{padding:0 var(--rand) 28px;max-width:calc(620px + var(--rand))}

/* CTA */
.cta{position:relative;height:720px;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;background:var(--hell)}
.cta__bild{position:absolute;inset:0}
.cta__bild img{width:100%;height:100%;object-fit:cover;opacity:.55}
.cta__bild::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#F9F9F9 0%,rgba(249,249,249,.35) 30%,rgba(249,249,249,.35) 70%,#F9F9F9 100%)}
.cta__inhalt{position:relative;display:flex;flex-direction:column;align-items:center;gap:24px;padding:0 24px}
.cta__inhalt .eyebrow{margin:0;color:var(--schwarz)}
.cta__titel{font:400 74px/1.2 var(--serif);letter-spacing:-.07em;max-width:900px}
.cta__titel em{display:block}

/* Footer */
.fuss{padding:40px 0 24px;background:var(--hell)}
.fuss__oben{display:flex;justify-content:space-between;gap:40px;margin-bottom:48px}
.fuss__oben .p{max-width:230px;margin-top:16px}
.fuss__kontakt{display:flex;flex-direction:column;gap:6px;text-align:left;min-width:240px}
.fuss__kontakt a,.fuss__kontakt span{color:var(--text2);transition:color .2s}
.fuss__kontakt a:hover{color:var(--gold)}
.fuss__kontakt .h5{margin-top:10px}
.fuss__mitte{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:end}
.fuss__links a{display:flex;justify-content:space-between;align-items:center;padding:16px 0 12px;border-bottom:1px solid var(--linie);font:500 20px/1.2 var(--sans);text-transform:uppercase;letter-spacing:0}
.fuss__links .kb__roll{height:24px}.fuss__links .kb__spur span{height:24px;font:500 20px/24px var(--sans)}
.fuss__links a:hover .kb__spur{transform:translateY(-24px)}
.fuss__links a:hover svg{transform:rotate(45deg)}
.fuss__links svg{width:16px;height:16px;transition:transform .4s var(--feder)}
.fuss__bild{border-radius:var(--r);overflow:hidden;aspect-ratio:2.7/1}
.fuss__bild img{width:100%;height:100%;object-fit:cover}
.fuss__mitte>*,.kopf>*,.kontakt>*,.od__grid>*{min-width:0}
.wortmarke{overflow:hidden;font:400 100px/1 var(--serif);color:var(--grau);letter-spacing:-.04em;white-space:nowrap;margin-top:-6px;text-transform:uppercase}
.wortmarke span{display:inline-block}
.fuss__unten{display:flex;justify-content:space-between;gap:16px;margin-top:32px;font-size:13px;color:var(--text2)}
.fuss__unten nav{display:flex;gap:16px}
.fuss__unten a:hover{color:var(--gold)}
.zeiten{display:grid;grid-template-columns:auto auto;gap:2px 16px;font-size:14px;color:var(--text2)}

/* Unterseiten-Kopf */
.seitenkopf{padding:160px 0 64px}
.zurueck{display:inline-flex;align-items:center;gap:8px;font-size:14px;margin-bottom:24px;color:var(--schwarz)}
.zurueck:hover{color:var(--gold)}
.zurueck svg{width:14px;height:14px}

/* Objekt-Detail */
.od__pillen{display:flex;gap:8px;margin-bottom:16px}
.od__pillen span{padding:4px 12px;border-radius:20px;background:#fff;font-size:14px}
.od__pillen span.gold{background:var(--gold-hell);color:var(--gold)}
.od__preis{display:flex;align-items:baseline;gap:10px;margin-top:8px}
.od__preis b{font:400 20px/1.4 var(--serif)}
.od__preis span{font-size:14px;color:var(--text2)}
.od__galerie{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;gap:12px;height:520px;margin:32px 0 64px}
.od__galerie figure{margin:0;border-radius:var(--r);overflow:hidden;position:relative}
.od__galerie figure:first-child{grid-row:1/3}
.od__galerie img{width:100%;height:100%;object-fit:cover}
.od__grid{display:grid;grid-template-columns:340px 1fr;gap:64px;align-items:start}
.od__info{position:sticky;top:110px;background:#fff;border-radius:var(--r);padding:24px}
.od__info .h6{margin-bottom:12px}
.od__info dl{margin:0}
.od__info div{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--linie);font-size:14px}
.od__info div:last-child{border-bottom:0}
.od__info dt{text-transform:uppercase;font-weight:500;display:flex;align-items:center;gap:8px}
.od__info dd{margin:0;color:var(--text2);text-align:right}
.od__block{margin-bottom:48px}
.od__block .h5{margin-bottom:16px}
.od__block .p+.p{margin-top:14px}
.tabelle{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--linie)}
.tabelle div{padding:14px 12px;border-bottom:1px solid var(--linie)}
.tabelle dt{font-size:14px;text-transform:uppercase;font-weight:500}
.tabelle dd{margin:4px 0 0;color:var(--text2);font-size:15px}
.od__galerie2{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.od__galerie2 figure{margin:0;border-radius:var(--r);overflow:hidden;aspect-ratio:1.4/1;position:relative}
.od__galerie2 img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--weich)}
.od__galerie2 figure:hover img{transform:scale(1.04)}
.hinweis{background:#fff;border-radius:var(--r);padding:20px 24px;font-size:14px;color:var(--text2);border-left:3px solid var(--gold)}
.karte-link{display:flex;align-items:center;justify-content:space-between;gap:16px;background:#fff;border-radius:var(--r);padding:24px;transition:color .2s}
.karte-link:hover{color:var(--gold)}
.karte-link svg{width:16px;height:16px;flex:none}
.karte-link span{display:flex;align-items:center;gap:8px}

/* Artikel */
.artikel{max-width:760px}
.artikel,.h1,.h2,.recht,.h5,.h6{overflow-wrap:break-word;hyphens:auto;-webkit-hyphens:auto}
.artikel h2{font:400 28px/1.3 var(--serif);letter-spacing:-.03em;margin:40px 0 14px}
.artikel h3{font:500 20px/1.4 var(--serif);margin:28px 0 10px}
.artikel p,.artikel li{font-size:17px;line-height:1.65;color:rgba(0,0,0,.72)}
.artikel p{margin:0 0 14px}
.artikel ul{padding-left:0;list-style:none;margin:0 0 18px}
.artikel li{position:relative;padding-left:22px;margin-bottom:8px}
.artikel li::before{content:"";position:absolute;left:2px;top:.62em;width:7px;height:7px;background:var(--gold);transform:rotate(45deg)}
.artikel a{color:var(--gold);text-decoration:underline}
.artikel__bild{border-radius:var(--r);overflow:hidden;aspect-ratio:2.2/1;margin:32px 0 16px}
.artikel__bild img{width:100%;height:100%;object-fit:cover}

/* Kontakt */
.kontakt{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.kontakt__knoepfe{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0 32px}
.knopf{display:inline-flex;align-items:center;gap:10px;padding:12px 20px;border-radius:8px;background:var(--schwarz);color:#fff;font-size:16px;transition:background .2s}
.knopf:hover{background:rgba(3,3,4,.75)}
.knopf--hell{background:#fff;color:var(--schwarz)}
.knopf--hell:hover{background:var(--grau)}
.knopf svg{width:16px;height:16px}
.formular{background:#fff;border-radius:var(--r);padding:32px;display:grid;grid-template-columns:1fr 1fr;gap:20px}
.feld{display:flex;flex-direction:column;gap:8px}
.feld--breit{grid-column:1/-1}
.feld label{font:500 14px/1.2 var(--sans);text-transform:uppercase;letter-spacing:0}
.feld input,.feld select,.feld textarea{font:400 16px/1.4 var(--sans);color:var(--schwarz);background:var(--hell);border:1px solid transparent;border-radius:8px;padding:12px 14px;transition:border-color .2s,background .2s}
.feld input:focus,.feld select:focus,.feld textarea:focus{outline:none;border-color:var(--gold);background:#fff}
.feld textarea{min-height:140px;resize:vertical}
.check{grid-column:1/-1;display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--text2)}
.check input{margin-top:3px;accent-color:var(--gold)}
.check a{color:var(--gold);text-decoration:underline}
.formular .knopf{justify-self:start}
.form-meldung{grid-column:1/-1;font-size:14px;color:var(--gold);min-height:1em}

/* Rechtstexte */
.recht{max-width:820px}
.recht h2{font:400 26px/1.3 var(--serif);letter-spacing:-.03em;margin:36px 0 12px}
.recht h3{font:500 18px/1.4 var(--serif);margin:24px 0 8px}
.recht p,.recht li{font-size:16px;line-height:1.6;color:rgba(0,0,0,.72)}
.recht p{margin:0 0 12px}
.recht a{color:var(--gold);text-decoration:underline}

/* 404 */
.fehler{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:16px;padding:140px 24px 80px}
.fehler__zahl{font:400 200px/1 var(--serif);letter-spacing:-.07em;color:var(--grau)}

/* Tablet */
@media (max-width:1199px){
  :root{--rand:40px;--sek:100px}
  .h1,.cta__titel{font-size:60px}
  .kopf{grid-template-columns:1fr 360px}
  .warum .wrap{grid-template-columns:1fr 380px}
  .dienst{grid-template-columns:1fr 300px 1fr}
}
/* Handy */
@media (max-width:809px){
  :root{--rand:20px;--sek:80px}
  .h1{font-size:38px;letter-spacing:-.06em}
  .hero__text .p{font-size:14px}
  .h2{font-size:34px}
  .cta__titel{font-size:44px}
  .kopf,.about__oben,.about__unten,.stimmen,.kontakt,.od__grid,.fuss__mitte{grid-template-columns:1fr}
  .kopf{margin-bottom:40px;gap:16px}
  .about{padding:100px 0 80px}
  .about__unten{margin-top:40px;gap:32px}
  .zahlen,.karten,.team,.blogs{grid-template-columns:1fr!important}
  .zahl{border-right:0!important;border-bottom:1px solid var(--linie)!important;min-height:0}
  .zahl:last-child{border-bottom:0!important}
  .zahl__wert{font-size:60px;margin-bottom:12px}
  .warum .wrap{grid-template-columns:1fr;gap:40px}
  .warum__links{position:relative;top:0}
  .warum__karten{gap:16px}
  .wkarte{position:relative;top:0!important;width:100%!important;min-height:0;gap:40px}
  .dienst{position:relative;top:0!important;grid-template-columns:1fr;padding:24px 0;min-height:0}
  .dienst__nr{font-size:54px}
  .stimmen__bild{height:360px}
  .skarte{width:300px}
  .bkarte:nth-child(2) .bkarte__bild{aspect-ratio:1.16/1}
  .faq__frage{padding:22px var(--rand)}
  .cta{height:600px}
  .fuss__oben{flex-direction:column}
  .seitenkopf{padding:120px 0 40px}
  .od__galerie{grid-template-columns:1fr;grid-template-rows:auto;height:auto}
  .od__galerie figure{aspect-ratio:1.4/1}
  .od__galerie figure:first-child{grid-row:auto}
  .od__info{position:relative;top:0}
  .od__galerie2{grid-template-columns:1fr 1fr}
  .tabelle{grid-template-columns:1fr}
  .formular{grid-template-columns:1fr;padding:20px}
  .anruf{right:12px;bottom:12px;padding:10px 16px}
  .fehler__zahl{font-size:120px}
  .hero{min-height:640px}
  .hero__text{bottom:40px}
}