/* MUSTERMANN & SÖHNE IMMOBILIEN — eigenständiges Stylesheet, handgebaut für PEAK.
Handschrift "Redaktionell": geteilter Bildschirm, Reportage-Aufbau,
Randnotizen statt Kacheln, Inhaltsverzeichnis mit Punktlinien.
© Thomas Eichinger — kein Baukasten, keine Vorlage. */
@font-face{font-family:'Literata';font-style:normal;font-weight:400 600;font-display:swap;src:url('fonts/literata.woff2') format('woff2')}
@font-face{font-family:'Literata';font-style:italic;font-weight:400 500;font-display:swap;src:url('fonts/literata-italic.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400 600;font-display:swap;src:url('fonts/plexsans.woff2') format('woff2')}
:root{
--papier:#F5F1E7;
--papier-2:#FFFFFF;
--karte:#ECE5D5;
--tinte:#211F1A;
--tinte-2:#55524A;
--tinte-3:#68655a;
--stein:#3C4A50;
--stein-2:#283337;
--stein-3:#4E5F66;
--terra:#A34F28;
--terra-2:#833D1D;
--gold:#806933;
--gold-h:#b79753;
--linie:rgba(33,31,26,.16);
--linie-2:rgba(33,31,26,.09);
--linie-hell:rgba(245,241,231,.22);
--serif:'Literata',Georgia,'Iowan Old Style','Times New Roman',serif;
--sans:'IBM Plex Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
--schatten:0 2px 6px rgba(33,31,26,.06),0 16px 40px rgba(33,31,26,.09);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
body{font-family:var(--sans);background:var(--papier);color:var(--tinte);line-height:1.7;font-size:17px;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
h1,h2,h3,h4{font-family:var(--serif);font-weight:400;letter-spacing:-.006em;color:var(--tinte);line-height:1.2}
section{scroll-margin-top:104px}
.w{max-width:1180px;margin:0 auto;padding:0 24px}
.wschmal{max-width:760px;margin:0 auto;padding:0 24px}
.sec{padding-block:clamp(60px,8vw,112px)}
/* Kicker statt Eyebrow-Kapitälchen: kursiv, kein Tracking, kein Uppercase */
.rubrik{font-family:var(--serif);font-style:italic;font-size:1.02rem;color:var(--gold);margin-bottom:14px}
.rubrik b{font-style:normal;font-weight:600}
/* ── ENTWURF-Banner ─────────────────────────────────────────────── */
.demo{background:var(--stein-2);color:#EDE6D6;text-align:center;padding:10px 16px;font-size:.76rem;letter-spacing:.02em;line-height:1.5}
.demo a{color:#fff;text-decoration:underline;text-underline-offset:3px}
.demo b{font-weight:700}
/* ── Kopf / Nav ─────────────────────────────────────────────────── */
.utilbar{background:var(--stein-2);color:#CBD3D2;font-size:.82rem}
.utilrow{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:7px 0;flex-wrap:wrap}
.utilrow .status{display:flex;align-items:center;gap:8px}
.punkt{width:8px;height:8px;border-radius:50%;background:#5DA36B;box-shadow:0 0 0 3px rgba(93,163,107,.22);flex:none}
.punkt.zu{background:var(--terra);box-shadow:0 0 0 3px rgba(163,79,40,.2)}
.utilrow a.tel{color:#fff;font-weight:600;display:inline-flex;align-items:center;min-height:32px}
header{position:sticky;top:0;z-index:90;background:rgba(245,241,231,.95);backdrop-filter:blur(10px);border-bottom:1px solid var(--linie-2)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-block:14px}
.marke{display:block;line-height:1.1}
.marke b{display:block;font-family:var(--serif);font-size:clamp(1.12rem,3vw,1.36rem);font-weight:500;color:var(--stein-2)}
.marke i{display:block;font-style:italic;font-size:.76rem;color:var(--tinte-3);margin-top:3px}
.mn{display:flex;gap:26px;list-style:none;align-items:center}
.mn a{display:flex;align-items:center;min-height:44px;font-size:.92rem;color:var(--tinte-2);border-bottom:2px solid transparent;transition:.2s}
.mn a:hover,.mn a.hier{color:var(--stein-2);border-bottom-color:var(--terra)}
.mn a.hier{font-weight:600}
.nrufen{display:inline-flex;align-items:center;min-height:46px;background:var(--terra);color:#fff;padding:0 22px;border-radius:2px;font-size:.88rem;font-weight:600;white-space:nowrap;transition:.2s}
.nrufen:hover{background:var(--terra-2)}
.bg{display:none;background:none;border:0;cursor:pointer;padding:10px;min-height:44px;min-width:44px}
.bg span{display:block;width:23px;height:2px;background:var(--stein-2);margin:5px 0}
/* ── HERO — geteilter Bildschirm ────────────────────────────────── */
.hero{display:grid;grid-template-columns:minmax(300px,40%) 1fr;min-height:min(88vh,860px)}
.hero-links{display:flex;flex-direction:column;justify-content:center;padding:clamp(40px,6vw,80px) clamp(28px,5vw,64px);background:var(--papier)}
.hero-links h1{font-size:clamp(2.15rem,4.6vw,3.35rem);line-height:1.12;margin-bottom:22px}
.hero-links h1 em{font-style:italic;color:var(--terra)}
.hero-links p{color:var(--tinte-2);max-width:38ch;font-size:1.05rem;margin-bottom:30px}
.hero-cta{display:flex;align-items:baseline;gap:22px;flex-wrap:wrap;margin-bottom:34px}
.btn{display:inline-flex;align-items:center;min-height:52px;background:var(--stein-2);color:#fff;padding:0 30px;font-size:.94rem;font-weight:600;transition:.2s}
.btn:hover{background:var(--terra)}
.link-u{font-size:.92rem;font-weight:600;color:var(--stein-2);border-bottom:1px solid var(--gold);padding-bottom:3px;display:inline-flex;align-items:center;min-height:44px}
.link-u:hover{color:var(--terra);border-color:var(--terra)}
.hero-info{display:flex;gap:26px;flex-wrap:wrap;border-top:1px solid var(--linie);padding-top:20px;font-size:.9rem;color:var(--tinte-2)}
.hero-info b{color:var(--tinte);font-weight:600}
.hero-rechts{position:relative;overflow:hidden;background:linear-gradient(180deg,#B7C6C6 0%,#7C9494 42%,#3C4A50 100%)}
/* 20.09.2026 — das neue Haus-Foto ist unten hell, die weisse
Bildunterschrift ging darin unter. Ein weicher dunkler Verlauf
nur im unteren Drittel haelt sie lesbar. */
.hero-rechts::before{content:"";position:absolute;left:0;right:0;bottom:0;height:38%;background:linear-gradient(rgba(18,22,24,0),rgba(18,22,24,.60));z-index:2;pointer-events:none}
.hero-svg{position:absolute;inset:0;width:100%;height:100%}
.hero-svg svg{position:absolute;inset:-4% -4% -4% -4%;width:108%;height:108%;animation:kenburns 26s ease-in-out infinite alternate}
@keyframes kenburns{0%{transform:scale(1) translate(0,0)}100%{transform:scale(1.09) translate(-1%,-1.4%)}}
@media (prefers-reduced-motion: reduce){.hero-svg svg{animation:none}}
.hero-bildunterschrift{position:absolute;right:22px;bottom:20px;color:rgba(245,241,231,.82);font-size:.78rem;font-style:italic;text-align:right;max-width:220px;text-shadow:0 1px 6px rgba(0,0,0,.35);z-index:3}
.hero-fahne{position:absolute;left:0;top:36px;background:var(--terra);color:#fff;padding:8px 20px 8px 16px;font-size:.78rem;font-style:italic;letter-spacing:.02em;box-shadow:0 6px 18px rgba(0,0,0,.2);z-index:3}
@media(max-width:900px){
.hero{grid-template-columns:1fr;min-height:auto}
.hero-rechts{min-height:52vh;order:-1}
.hero-links{padding:36px 22px 44px}
}
/* ── EINLAUF-Text (Wortweise) ───────────────────────────────────── */
.einlauf span{display:inline-block;opacity:0;transform:translateY(.4em);filter:blur(2px);transition:opacity .6s ease,transform .6s ease,filter .6s ease}
.einlauf.ein span{opacity:1;transform:none;filter:none}
@media (prefers-reduced-motion: reduce){.einlauf span{opacity:1;transform:none;filter:none}}
/* ── Auf/Ab-Reveal (eigene Klasse "auf") ────────────────────────── */
.auf{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1)}
.auf.ein{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){.auf{opacity:1;transform:none;transition:none}}
/* ── INHALTSVERZEICHNIS ─────────────────────────────────────────── */
.toc{background:var(--papier-2);border-top:1px solid var(--linie);border-bottom:1px solid var(--linie)}
.toc-in{padding-block:clamp(46px,6vw,70px)}
.toc-kopf{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:30px;flex-wrap:wrap}
.toc-kopf h2{font-size:clamp(1.5rem,3vw,1.9rem)}
.toc-kopf span{font-family:var(--serif);font-style:italic;color:var(--tinte-3);font-size:.95rem}
.toc-liste{list-style:none}
.toc-liste li{border-bottom:1px solid var(--linie-2)}
.toc-liste a{display:flex;align-items:baseline;gap:14px;padding:18px 2px;transition:.2s}
.toc-liste a:hover{color:var(--terra)}
.toc-nr{font-family:var(--serif);font-style:italic;color:var(--gold);font-size:1.05rem;flex:none;width:28px}
.toc-titel{font-family:var(--serif);font-size:1.28rem;white-space:nowrap}
.toc-fuell{flex:1;border-bottom:2px dotted var(--linie);transform:translateY(-6px);min-width:24px}
.toc-beschreibung{color:var(--tinte-3);font-size:.9rem;white-space:nowrap;flex:none}
@media(max-width:640px){.toc-liste a{flex-wrap:wrap}.toc-beschreibung{width:100%;padding-left:42px}.toc-fuell{display:none}}
/* ── REPORTAGE ───────────────────────────────────────────────────── */
.reportage-kopf{max-width:62ch;margin-bottom:clamp(30px,4vw,46px)}
.reportage-kopf h2{font-size:clamp(1.9rem,4.2vw,3rem);line-height:1.15;margin-bottom:6px}
.reportage-byline{color:var(--tinte-3);font-size:.86rem;font-style:italic;margin-top:10px}
.reportage-grid{display:grid;grid-template-columns:1fr 220px;gap:clamp(30px,4vw,56px);align-items:start}
.reportage-text{max-width:62ch}
.reportage-text p{color:var(--tinte-2);margin-bottom:1.15em;font-size:1.04rem}
.reportage-text p.initiale::first-letter{font-family:var(--serif);font-size:4.6rem;line-height:.78;float:left;padding:.03em .1em 0 0;color:var(--terra);font-weight:500}
@media(min-width:760px){.reportage-2col{column-count:2;column-gap:36px}}
.zitat{grid-column:1/-1;background:var(--karte);border-left:3px solid var(--terra);padding:clamp(26px,4vw,42px) clamp(28px,4.6vw,52px);margin-block:8px}
.zitat p{font-family:var(--serif);font-style:italic;font-size:clamp(1.25rem,2.4vw,1.6rem);line-height:1.42;color:var(--tinte);max-width:56ch}
.zitat-quelle{margin-top:16px;font-family:var(--sans);font-style:normal;font-size:.86rem;color:var(--tinte-3)}
.randnotizen{display:flex;flex-direction:column;gap:26px;position:sticky;top:120px}
.rn{border-top:1px solid var(--linie);padding-top:10px}
.rn .zahl{font-family:var(--serif);font-size:clamp(1.9rem,3vw,2.3rem);color:var(--stein-2);line-height:1;font-weight:500}
.rn .zahl.z-terra{color:var(--terra)}
.rn .txt{font-size:.86rem;color:var(--tinte-3);margin-top:4px;line-height:1.5}
@media(max-width:900px){.reportage-grid{grid-template-columns:1fr}.randnotizen{position:static;flex-direction:row;flex-wrap:wrap;gap:20px 30px;border-top:1px solid var(--linie);padding-top:20px;margin-top:8px}.rn{border-top:0;padding-top:0;flex:1;min-width:130px}}
/* ── BILDSTRECKE (asymmetrisch, versetzt) ───────────────────────── */
.bildstrecke{display:grid;grid-template-columns:1.15fr .85fr 1fr;gap:22px;margin-block:clamp(40px,5vw,60px);align-items:start}
.bs-item{position:relative}
.bs-item:nth-child(2){margin-top:56px}
.bs-item:nth-child(3){margin-top:-24px}
.bs-bild{overflow:hidden;box-shadow:var(--schatten)}
.bs-bild .waechst{transition:transform 1.1s cubic-bezier(.16,1,.3,1)}
.bs-item.ein .waechst{transform:scale(1.06)}
.bs-cap{margin-top:10px;font-size:.82rem;color:var(--tinte-3);font-style:italic;line-height:1.5}
.bs-a{aspect-ratio:4/5}.bs-b{aspect-ratio:3/4}.bs-c{aspect-ratio:5/6}
@media(max-width:820px){.bildstrecke{grid-template-columns:1fr;gap:26px}.bs-item:nth-child(2),.bs-item:nth-child(3){margin-top:0}}
/* ── FIRMENZAHLEN (dunkles Band, Randnotizen im Fließtext) ──────── */
.dunkel{background:var(--stein-2);color:#E7E2D4}
.dunkel h2{color:#fff}
.dunkel .rubrik{color:var(--gold-h)}
.firmen-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(30px,5vw,64px);align-items:start}
.firmen-text{max-width:56ch;color:rgba(231,226,212,.86);font-size:1.03rem}
.firmen-text p{margin-bottom:1.1em}
.firmen-noten{display:flex;flex-direction:column;gap:24px}
.fn{border-top:1px solid var(--linie-hell);padding-top:12px}
.fn .zahl{font-family:var(--serif);font-size:clamp(2.1rem,4vw,2.7rem);color:var(--gold-h);line-height:1}
.fn .txt{font-size:.86rem;color:rgba(231,226,212,.68);margin-top:5px}
@media(max-width:860px){.firmen-grid{grid-template-columns:1fr}.firmen-noten{flex-direction:row;flex-wrap:wrap;gap:20px 30px}.fn{flex:1;min-width:140px}}
/* ── REGIONSKARTE (interaktiv) ───────────────────────────────────── */
.karten-sec{background:var(--papier-2)}
.karten-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(30px,5vw,60px);align-items:center}
.karten-bild{position:relative;background:linear-gradient(160deg,#DCE3DD,#C7D2C9 60%,#AEBDB2);box-shadow:var(--schatten);overflow:hidden;aspect-ratio:6/5}
.karten-bild svg{position:absolute;inset:0;width:100%;height:100%}
.ort{position:absolute;width:30px;height:30px;margin:-15px 0 0 -15px;border:0;background:none;cursor:pointer;padding:0}
.ort span{position:absolute;inset:9px;border-radius:50%;background:var(--terra);box-shadow:0 0 0 5px rgba(163,79,40,.18);transition:.25s}
.ort:hover span,.ort:focus-visible span,.ort.aktiv span{background:var(--stein-2);box-shadow:0 0 0 8px rgba(40,51,55,.2);transform:scale(1.25)}
.ort b{position:absolute;top:26px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:.74rem;font-weight:600;color:var(--stein-2);background:rgba(255,255,255,.88);padding:2px 8px;border-radius:2px;opacity:0;transition:.2s;pointer-events:none}
.ort:hover b,.ort:focus-visible b,.ort.aktiv b{opacity:1}
.karten-text{min-height:210px}
.karten-text .ortname{font-size:clamp(1.5rem,3vw,1.9rem);margin-bottom:10px}
.karten-text p{color:var(--tinte-2);max-width:44ch}
.karten-hinweis{font-size:.86rem;color:var(--tinte-3);font-style:italic;margin-bottom:18px}
@media(max-width:820px){.karten-grid{grid-template-columns:1fr}.karten-text{min-height:auto;margin-top:8px}}
/* ── OBJEKTE-TEASER (versetzte Zeilen, kein Raster) ──────────────── */
.obj-reihe{display:grid;grid-template-columns:38% 1fr;gap:clamp(24px,4vw,48px);align-items:center;padding-block:clamp(28px,4vw,40px);border-bottom:1px solid var(--linie)}
.obj-reihe:nth-child(even){grid-template-columns:1fr 38%}
.obj-reihe:nth-child(even) .obj-bild{order:2}
.obj-bild{aspect-ratio:4/3;overflow:hidden;box-shadow:var(--schatten)}
.obj-bild svg{width:100%;height:100%}
.obj-info .ort-tag{font-family:var(--serif);font-style:italic;color:var(--gold);font-size:.92rem;margin-bottom:6px}
.obj-info h3{font-size:clamp(1.35rem,2.6vw,1.75rem);margin-bottom:8px}
.obj-info p{color:var(--tinte-2);max-width:46ch;margin-bottom:14px;font-size:.98rem}
.obj-preis{font-family:var(--serif);font-size:1.15rem;color:var(--stein-2)}
.obj-preis small{font-family:var(--sans);font-size:.76rem;color:var(--tinte-3);display:block;margin-top:2px}
@media(max-width:760px){.obj-reihe,.obj-reihe:nth-child(even){grid-template-columns:1fr}.obj-reihe .obj-bild,.obj-reihe:nth-child(even) .obj-bild{order:-1}}
/* ── CTA / FOOTER ─────────────────────────────────────────────────── */
.cta{background:var(--terra);color:#fff}
.cta-in{display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap;padding-block:clamp(40px,5vw,58px)}
.cta h2{color:#fff;font-size:clamp(1.5rem,3.4vw,2.2rem);max-width:32ch}
.cta .btn{background:#fff;color:var(--terra-2)}
.cta .btn:hover{background:var(--stein-2);color:#fff}
footer{background:var(--stein-2);color:rgba(231,226,212,.7);padding-block:clamp(50px,6vw,70px) 26px;font-size:.9rem}
.f-hinweis{border:1px solid var(--linie-hell);padding:18px 22px;margin-bottom:38px;font-size:.84rem;color:rgba(231,226,212,.68)}
.f-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:40px;margin-bottom:40px}
.f-grid b{display:block;font-family:var(--serif);font-size:1.3rem;color:#fff;margin-bottom:12px;font-weight:500}
.f-grid p{max-width:34ch;color:rgba(231,226,212,.68)}
footer h5{color:var(--gold-h);font-family:var(--serif);font-style:italic;font-size:.94rem;margin-bottom:14px;font-weight:400}
footer ul{list-style:none}
footer li{margin-bottom:4px}
footer a{display:inline-flex;align-items:center;min-height:36px;transition:.2s}
footer a:hover{color:#fff}
.f-unten{border-top:1px solid var(--linie-hell);padding-top:22px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:.8rem}
@media(max-width:760px){.f-grid{grid-template-columns:1fr;gap:28px}}
/* ── Mobiles Menü: Schublade von links, ~42% Breite, deckend ──────── */
@media(max-width:900px){
header{backdrop-filter:none}
.mn-schatten{position:fixed;inset:0;background:rgba(0,0,0,0);visibility:hidden;transition:.3s;z-index:60;pointer-events:none}
.mn-schatten.auf{background:rgba(0,0,0,.4);visibility:visible;pointer-events:auto}
.mn{position:fixed;top:0;left:0;bottom:0;width:34vw;max-width:150px;min-width:118px;background:var(--papier);flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:8px;transform:translateX(-100%);visibility:hidden;transition:.3s;z-index:200;padding:90px 14px 30px;overflow-y:auto;box-shadow:8px 0 30px rgba(0,0,0,.2)}
.mn.open{transform:translateX(0);visibility:visible}
.mn a{font-family:var(--serif);font-size:.94rem;letter-spacing:0;min-height:44px}
.bg{display:block;z-index:210}
.nav .nrufen{display:none}
.utilrow{justify-content:center;text-align:center}
}
/* ── Seiten-Kopf (Unterseiten) ────────────────────────────────────── */
.seitenkopf{background:var(--papier-2);border-bottom:1px solid var(--linie-2);padding-block:clamp(40px,6vw,64px)}
.krumen{font-size:.8rem;color:var(--tinte-3);margin-bottom:20px}
.krumen a{border-bottom:1px solid var(--linie)}
.krumen a:hover{color:var(--terra)}
.seitenkopf h1{font-size:clamp(2rem,4.6vw,3.1rem)}
.seitenkopf p.sub{color:var(--tinte-2);max-width:56ch;margin-top:16px;font-size:1.06rem}
/* ── Textseiten (Verkaufen, Bewertung, Über uns, Impressum...) ──── */
.txt{max-width:68ch;color:var(--tinte-2)}
.txt h2{font-size:clamp(1.5rem,3vw,2rem);margin:40px 0 16px;color:var(--stein-2)}
.txt h2:first-child{margin-top:0}
.txt h3{font-size:1.2rem;margin:26px 0 10px;color:var(--stein-2)}
.txt p{margin-bottom:1.1em}
.txt p.initiale::first-letter{font-family:var(--serif);font-size:4rem;line-height:.75;float:left;padding:.02em .09em 0 0;color:var(--terra);font-weight:500}
.txt strong{color:var(--tinte);font-weight:600}
.txt ul{list-style:none;margin:14px 0}
.txt li{padding:6px 0 6px 22px;position:relative}
.txt li::before{content:"";position:absolute;left:2px;top:15px;width:6px;height:6px;background:var(--gold);transform:rotate(45deg)}
/* ── Chronik (Über uns) ───────────────────────────────────────────── */
.chronik{list-style:none;border-top:1px solid var(--linie)}
.chronik li{display:flex;gap:26px;padding:24px 0;border-bottom:1px solid var(--linie)}
.chronik b{font-family:var(--serif);font-size:1.5rem;color:var(--terra);flex:none;width:70px}
.chronik p{color:var(--tinte-2)}
/* ── Regler (Bewertung) ───────────────────────────────────────────── */
.regler-box{background:var(--karte);padding:clamp(26px,4vw,42px);margin-block:34px}
.regler-werte{display:flex;justify-content:space-between;font-family:var(--serif);font-size:clamp(1.4rem,3vw,1.9rem);color:var(--stein-2);margin-bottom:8px}
.regler-werte .a{color:var(--tinte-3);font-size:.9rem;align-self:flex-end}
.regler-lineal{position:relative;height:6px;background:var(--linie);border-radius:3px;margin-block:26px}
.regler-fuellung{position:absolute;inset:0;background:var(--terra);border-radius:3px;width:38%}
input[type=range].regler{width:100%;-webkit-appearance:none;background:transparent;position:relative;top:-32px;height:44px;margin:0}
input[type=range].regler::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;border-radius:50%;background:#fff;border:3px solid var(--stein-2);box-shadow:0 3px 8px rgba(0,0,0,.2);cursor:pointer;margin-top:6px}
input[type=range].regler::-moz-range-thumb{width:26px;height:26px;border-radius:50%;background:#fff;border:3px solid var(--stein-2);cursor:pointer}
.regler-erklaerung{font-size:.9rem;color:var(--tinte-3);text-align:center}
/* ── Objekt-Detail (Musterobjekte auf objekte.html) ──────────────── */
.objekt-detail{padding-block:clamp(50px,6vw,80px);border-bottom:1px solid var(--linie)}
.objekt-detail:last-child{border-bottom:0}
.od-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,54px);align-items:start}
.objekt-detail:nth-child(even) .od-grid{direction:rtl}
.objekt-detail:nth-child(even) .od-grid>*{direction:ltr}
.od-bild{box-shadow:var(--schatten);overflow:hidden;aspect-ratio:4/3}
.od-info .ort-tag{font-family:var(--serif);font-style:italic;color:var(--gold);margin-bottom:8px;font-size:.98rem}
.od-info h2{font-size:clamp(1.6rem,3vw,2.15rem);margin-bottom:12px}
.od-info p{color:var(--tinte-2);margin-bottom:16px;max-width:48ch}
.od-fakten{display:grid;grid-template-columns:repeat(2,1fr);gap:10px 20px;margin-block:18px;font-size:.9rem}
.od-fakten div{border-top:1px solid var(--linie);padding-top:8px}
.od-fakten b{display:block;font-family:var(--serif);color:var(--stein-2);font-size:1.05rem}
.od-fakten span{color:var(--tinte-3)}
.od-preis{font-family:var(--serif);font-size:1.5rem;color:var(--terra);margin-top:6px}
.od-energie{font-size:.82rem;color:var(--tinte-3);font-style:italic;margin-top:14px;border-top:1px dotted var(--linie);padding-top:10px}
@media(max-width:820px){.od-grid,.objekt-detail:nth-child(even) .od-grid{grid-template-columns:1fr;direction:ltr}}
/* ── Musterhinweis-Kasten (rechtlich, auf jeder Seite) ───────────── */
.hinweisbox{background:var(--karte);padding:22px 26px;font-size:.92rem;color:var(--tinte-2);margin-bottom:36px;border-left:3px solid var(--gold)}
.hinweisbox b{display:block;font-family:var(--serif);color:var(--stein-2);margin-bottom:6px;font-size:1.02rem}
/* ══════════════════════════════════════════════════════════════════
ECHTE BILDER + BEWEGUNG — Nachtrag 18.09.
© Thomas Eichinger — handgebaut, kein Baukasten.
══════════════════════════════════════════════════════════════════ */
/* Bild-Container: gleiche Optik wie vorher, jetzt mit ![]()
statt