/* =========================================================
   GIARDINO Germering – Projektseite
   Design-System: Weiß · Champagner · Gold (angelehnt an Branding-Konzept 1)
   ========================================================= */

/* ---------- Schriften (selbst gehostet, kein CDN) ---------- */
@font-face{font-family:"Cormorant";src:url("../fonts/cormorant-latin-300-normal.woff2") format("woff2");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"Cormorant";src:url("../fonts/cormorant-latin-300-italic.woff2") format("woff2");font-weight:300;font-style:italic;font-display:swap}
@font-face{font-family:"Cormorant";src:url("../fonts/cormorant-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Cormorant";src:url("../fonts/cormorant-latin-500-normal.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Jost";src:url("../fonts/jost-latin-300-normal.woff2") format("woff2");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:"Jost";src:url("../fonts/jost-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Jost";src:url("../fonts/jost-latin-500-normal.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}

/* ---------- Tokens ---------- */
:root{
  --ivory-0:#fdfbf7;
  --ivory:#f6f3ec;
  --ivory-2:#efe8db;
  --sand:#e6dccb;
  --beige:#d6cab4;
  --gold-1:#e8d1a6;
  --gold:#c4a273;
  --gold-2:#a77f55;
  --gold-3:#8c6a45;
  --taupe:#796b5c;
  --ink:#433a34;
  --espresso:#302b29;
  --espresso-2:#1e1a18;

  --ff-serif:"Cormorant","Cormorant Garamond",Garamond,"Times New Roman",serif;
  --ff-sans:"Jost","Futura","Century Gothic","Avenir Next",system-ui,sans-serif;

  --fs-mega:clamp(3.4rem,12.6vw,14.5rem);
  --fs-num:clamp(3rem,6.6vw,6rem);
  --fs-h2:clamp(2.2rem,4.5vw,4.15rem);
  --fs-h3:clamp(1.4rem,2vw,1.8rem);
  --fs-body:clamp(1rem,.96rem + .2vw,1.125rem);
  --fs-small:.875rem;

  --s1:8px;--s2:16px;--s3:24px;--s4:32px;--s5:48px;--s6:64px;--s7:96px;--s8:128px;
  --container:1240px;
  --gutter:clamp(20px,5vw,40px);
  --section-y:clamp(64px,9vw,128px);
  --block-y:clamp(24px,4vw,48px);
  --hdr-h:84px;

  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);

  --noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .19 0 0 0 0 .16 0 0 0 0 .13 0 0 0 .055 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --g-ivory:linear-gradient(180deg,#fdfbf7 0%,#f7f3eb 46%,#efe7d9 100%);
  --g-ivory-up:linear-gradient(0deg,#fdfbf7 0%,#f7f3eb 50%,#efe7d9 100%);
  --g-sand:linear-gradient(165deg,#f5eee3 0%,#ece2d1 52%,#e0d2bb 100%);
  --g-dark:radial-gradient(120% 95% at 16% 0%,#4f463f 0%,#352f2c 40%,#231e1c 78%,#1b1716 100%);
  --g-gold:linear-gradient(135deg,#efd9b1 0%,#cfac7b 30%,#b18a5a 62%,#9c7549 82%,#c29d6c 100%);
  --g-gold-text:linear-gradient(176deg,#e6cb9c 0%,#c49f6b 42%,#9a7449 78%,#b48d5f 100%);
  --g-gold-line:linear-gradient(90deg,rgba(196,162,115,0),rgba(196,162,115,.85),rgba(196,162,115,0));

  --sh-1:0 1px 2px rgba(48,40,32,.06),0 8px 22px -6px rgba(48,40,32,.12);
  --sh-2:0 2px 6px rgba(48,40,32,.06),0 22px 46px -16px rgba(48,40,32,.28),0 50px 90px -50px rgba(48,40,32,.35);
  --sh-gold:0 14px 32px -12px rgba(150,108,62,.7),0 3px 8px rgba(110,80,46,.22);
}

/* ---------- Basis ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;font-family:var(--ff-sans);font-weight:400;font-size:var(--fs-body);line-height:1.7;color:var(--ink);background:var(--ivory);overflow-x:clip;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,picture,svg,video{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer}
h1,h2,h3,h4,p,figure,dl,dd,ul,ol{margin:0}
ul,ol{padding:0;list-style:none}
::selection{background:rgba(196,162,115,.35);color:var(--espresso)}
:focus-visible{outline:2px solid var(--gold-2);outline-offset:3px;border-radius:2px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.nowrap{white-space:nowrap}

.wrap{max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
.section{position:relative;padding-block:var(--section-y)}

/* Flächen: nie eine flache Farbe, immer Verlauf + feines Korn */
.bg-ivory{background:radial-gradient(60% 45% at 88% 8%,rgba(222,196,152,.22),rgba(222,196,152,0) 70%),var(--noise),var(--g-ivory)}
.bg-ivory-up{background:radial-gradient(55% 45% at 10% 92%,rgba(222,196,152,.2),rgba(222,196,152,0) 70%),var(--noise),var(--g-ivory-up)}
.bg-sand{background:radial-gradient(50% 40% at 12% 10%,rgba(255,255,255,.55),rgba(255,255,255,0) 70%),var(--noise),var(--g-sand)}
.bg-dark{background:var(--noise),var(--g-dark);color:#efe6d8}

/* ---------- Typografie ---------- */
.h2{font-family:var(--ff-serif);font-weight:300;font-size:var(--fs-h2);line-height:1.04;letter-spacing:-.005em;color:var(--espresso);text-wrap:balance;hyphens:manual}
.bg-dark .h2{color:#f4ecdf}
.h3{font-family:var(--ff-serif);font-weight:400;font-size:var(--fs-h3);line-height:1.2;color:var(--espresso);text-wrap:balance}
.lead{font-weight:300;font-size:clamp(1.06rem,1rem + .35vw,1.3rem);line-height:1.65;color:var(--ink);max-width:56ch;text-wrap:pretty}
.bg-dark .lead{color:rgba(239,230,216,.86)}
.text{max-width:62ch;text-wrap:pretty;hyphens:auto}
.small{font-size:var(--fs-small);line-height:1.6;color:var(--taupe)}
.gold-text{background:var(--g-gold-text);-webkit-background-clip:text;background-clip:text;color:transparent}
.vis-note{font-size:.75rem;letter-spacing:.03em;color:rgba(255,255,255,.78);font-weight:300}

/* ---------- Buttons / CTA (überall identisch) ---------- */
.btn{position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:0 36px;border:0;border-radius:999px;background:var(--g-gold);color:#2b2219;font-family:var(--ff-sans);font-weight:500;font-size:1rem;letter-spacing:.045em;line-height:1.2;text-decoration:none;text-align:center;box-shadow:var(--sh-gold),inset 0 1px 0 rgba(255,250,238,.65),inset 0 -1px 0 rgba(95,64,30,.28);transition:transform .55s var(--ease),box-shadow .55s var(--ease);-webkit-tap-highlight-color:transparent}
.btn::before{content:"";position:absolute;inset:1px;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,0) 55%);z-index:-1;pointer-events:none}
.btn::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:50%;background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,251,240,.75),rgba(255,255,255,0));transform:translateX(-120%) skewX(-18deg);transition:transform 1s var(--ease-out);pointer-events:none}
.btn:hover{transform:translateY(-2px);box-shadow:0 20px 40px -14px rgba(150,108,62,.75),0 4px 10px rgba(110,80,46,.25),inset 0 1px 0 rgba(255,250,238,.7),inset 0 -1px 0 rgba(95,64,30,.28)}
.btn:hover::after{transform:translateX(420%) skewX(-18deg)}
.btn:active{transform:translateY(0)}
.cta{display:flex;justify-content:center;margin-top:var(--s6);position:relative;z-index:2}
.cta .btn{white-space:nowrap;max-width:100%}
@media (max-width:767px){.btn{padding:0 22px;font-size:.95rem;letter-spacing:.025em}.cta .btn{width:100%}}

/* ---------- Header ---------- */
.hdr{position:fixed;inset:0 0 auto;z-index:50;height:var(--hdr-h);color:#fbf6ec;transition:transform .7s var(--ease),color .5s var(--ease)}
.hdr::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(253,251,247,.94),rgba(246,241,232,.88));backdrop-filter:blur(14px) saturate(1.15);-webkit-backdrop-filter:blur(14px) saturate(1.15);box-shadow:0 1px 0 rgba(167,127,85,.2),0 14px 34px -20px rgba(48,40,32,.35);opacity:0;transition:opacity .5s var(--ease)}
.hdr.is-solid{color:var(--espresso)}
.hdr.is-solid::before{opacity:1}
.hdr.is-hidden{transform:translateY(calc(-100% - 48px))}
.hdr__bar{position:relative;height:100%;max-width:1440px;margin-inline:auto;padding-inline:var(--gutter);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px}
.hdr__nav{display:flex;gap:clamp(18px,2.2vw,36px);font-size:.95rem;letter-spacing:.03em}
.hdr__nav--r{justify-content:flex-end;align-items:center}
.hdr__nav a{position:relative;text-decoration:none;padding-block:8px;opacity:.92}
.hdr__nav a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .5s var(--ease)}
.hdr__nav a:hover::after{transform:scaleX(1);transform-origin:left}
.hdr .btn{min-height:48px;padding:0 26px;font-size:.92rem;margin-left:8px}
.brand{display:flex;flex-direction:column;align-items:center;text-decoration:none;line-height:1}
.brand__name{font-family:var(--ff-serif);font-weight:300;font-size:1.7rem;letter-spacing:.34em;margin-right:-.34em}
.brand__sub{font-family:var(--ff-serif);font-style:italic;font-weight:300;font-size:.98rem;letter-spacing:.06em;margin-top:5px;opacity:.85}
@media (max-width:1023px){
  .hdr__bar{grid-template-columns:auto 1fr;}
  .hdr__nav{display:none}
  .brand{align-items:flex-start}
  :root{--hdr-h:70px}
}

/* ---------- Hero ---------- */
.hero{position:relative;min-height:100svh;min-height:max(100svh,600px);display:flex;align-items:flex-end;color:#fff;overflow:hidden;background:#2a2421;isolation:isolate}
.hero__media{position:absolute;inset:0;z-index:-2}
.hero__media img{width:100%;height:100%;object-fit:cover;object-position:58% 45%}
.js .hero__media img{animation:heroZoom 3.2s var(--ease-out) both}
@keyframes heroZoom{from{transform:scale(1.14)}to{transform:scale(1)}}
.hero__shade{position:absolute;inset:0;z-index:-1;background:
  linear-gradient(180deg,rgba(24,19,16,.55) 0%,rgba(24,19,16,.08) 18%,rgba(24,19,16,0) 34%,rgba(24,19,16,.38) 50%,rgba(22,18,15,.72) 68%,rgba(20,16,14,.9) 100%),
  radial-gradient(90% 60% at 50% 100%,rgba(20,16,14,.35),rgba(20,16,14,0) 70%)}
.hero__inner{width:100%;max-width:1440px;margin-inline:auto;padding:0 var(--gutter) clamp(84px,11svh,120px)}
.hero__title{font-family:var(--ff-serif);font-style:italic;font-weight:400;font-size:clamp(1.4rem,2.3vw,2.05rem);letter-spacing:.02em;color:#f7efe2;text-wrap:balance;text-shadow:0 2px 18px rgba(15,11,9,.55)}
.hero__mark{display:flex;justify-content:space-between;width:100%;margin:clamp(4px,1vw,14px) 0 clamp(18px,2.6vw,34px);font-family:var(--ff-serif);font-weight:300;font-size:var(--fs-mega);line-height:.86;overflow:hidden;padding-top:.02em}
.hero__mark .ch{display:inline-block;background:linear-gradient(180deg,#fffaf0 0%,#f2e4c8 55%,#d9bc8d 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}
.js .hero__mark .ch{transform:translateY(108%);animation:rise 1.5s var(--ease-out) forwards;animation-delay:calc(.25s + var(--i) * 75ms)}
@keyframes rise{to{transform:translateY(0)}}
.hero__row{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s4);flex-wrap:wrap}
.hero__lead{text-shadow:0 1px 12px rgba(15,11,9,.5);font-weight:300;font-size:clamp(1.02rem,.98rem + .3vw,1.22rem);line-height:1.55;color:rgba(255,248,236,.9);max-width:30ch;text-wrap:balance}
.hero__actions{display:flex;align-items:center;gap:clamp(20px,3vw,40px);flex-wrap:wrap}
.hero__price{display:flex;flex-direction:column;line-height:1.1}
.hero__price span{font-size:.85rem;letter-spacing:.06em;color:rgba(255,248,236,.75)}
.hero__price strong{font-family:var(--ff-serif);font-weight:400;font-size:clamp(1.7rem,2.6vw,2.3rem);color:#fff7e8}
.hero__scroll{position:absolute;left:50%;bottom:22px;width:44px;height:44px;margin-left:-22px;display:grid;place-items:center;color:rgba(255,248,236,.85);transition:opacity .6s var(--ease)}
.hero__scroll svg{width:22px;height:22px;animation:bob 2.6s var(--ease) infinite}
.hero__scroll.is-gone{opacity:0;pointer-events:none}
@keyframes bob{0%,100%{transform:translateY(-4px)}50%{transform:translateY(5px)}}
@media (max-width:700px){
  .hero__media img{object-position:50% 40%}
  .hero__row{flex-direction:column;align-items:stretch}
  .hero__actions{justify-content:space-between}
  .hero__actions .btn{flex:1 1 100%}
  .hero__inner{padding-bottom:84px}
}


/* Bild-Container: picture füllt den Rahmen */
.hero__media picture,.loc-bg picture,.final-bg picture,.map__preview picture,.floors__media picture,.dev__media picture,.funnel__media picture,.arch-window picture{display:block;width:100%;height:100%}

/* ---------- Intro: Statement + Eckdaten ---------- */
.s-intro{text-align:center}
.statement{max-width:21em;margin-inline:auto;font-family:var(--ff-serif);font-weight:300;font-size:clamp(1.8rem,4vw,3.45rem);line-height:1.2;color:var(--espresso);text-wrap:balance;hyphens:manual}
.js .statement.is-split .w{opacity:.17;transition:opacity .45s var(--ease)}
.js .statement.is-split .w.on{opacity:1}
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:clamp(56px,8vw,112px);position:relative}
.facts::before,.facts::after{content:"";position:absolute;left:0;right:0;height:1px;background:var(--g-gold-line)}
.facts::before{top:0}.facts::after{bottom:0}
.fact{position:relative;padding:clamp(28px,4vw,48px) 12px}
.fact+.fact::before{content:"";position:absolute;left:0;top:20%;bottom:20%;width:1px;background:linear-gradient(180deg,rgba(196,162,115,0),rgba(196,162,115,.75),rgba(196,162,115,0))}
.fact__num{display:inline-flex;align-items:baseline;justify-content:center;gap:.14em;font-family:var(--ff-serif);font-weight:300;font-size:var(--fs-num);line-height:1;white-space:nowrap}
.fact__num .n{background:var(--g-gold-text);-webkit-background-clip:text;background-clip:text;color:transparent;font-variant-numeric:lining-nums tabular-nums;display:inline-block;text-align:right}
.fact__pre{font-style:italic;font-size:.34em;color:var(--taupe)}
.fact__unit{font-size:.38em;color:var(--gold-2)}
.fact__label{margin-top:14px;font-size:.92rem;letter-spacing:.04em;color:var(--taupe)}
@media (max-width:767px){
  .facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fact:nth-child(3)::before{display:none}
  .fact:nth-child(n+3){border-top:1px solid rgba(196,162,115,.35)}
}

/* ---------- Architektur: Bogen öffnet sich ---------- */
.s-arch{padding-top:0}
.arch-stage{position:relative}
.arch-sticky{position:relative;height:auto;display:flex;flex-direction:column;align-items:center;gap:var(--s5);padding-block:var(--s6)}
.arch-window{position:relative;width:min(78vw,460px);aspect-ratio:460/620;border-radius:999px 999px 3px 3px;overflow:hidden;box-shadow:var(--sh-2);background:#d9cdb8;transform-origin:50% 50%}
.arch-window img{width:100%;height:100%;object-fit:cover}
.arch-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(22,18,16,0) 30%,rgba(22,18,16,.72) 100%);opacity:0;pointer-events:none}
.arch-word{font-family:var(--ff-serif);font-weight:300;font-size:clamp(2rem,3.1vw,3.3rem);line-height:1;color:var(--espresso);white-space:nowrap}
.arch-caption{display:none}
/* Live-Variante (mit JS und ohne reduzierte Bewegung) */
.arch-stage.is-live{height:260vh}
.arch-stage.is-live .arch-sticky{position:sticky;top:0;height:100svh;padding:0;overflow:hidden;display:block}
.arch-stage.is-live .arch-window{position:absolute;left:50%;top:50%;width:min(34vw,440px);height:min(66svh,600px);aspect-ratio:auto;transform:translate(-50%,-50%);will-change:transform;box-shadow:0 30px 70px -30px rgba(48,40,32,.45)}
.arch-stage.is-live .arch-window img{position:absolute;left:50%;top:50%;width:100vw;height:100svh;max-width:none;transform:translate(-50%,-50%) scale(1.18);will-change:transform}
@media (max-aspect-ratio:1/1){.arch-window img{object-position:64% 50%}}
.arch-stage.is-live .arch-word{position:absolute;top:50%;will-change:transform,opacity}
.arch-stage.is-live .arch-word--l{right:calc(50% + min(17vw,220px) + clamp(24px,2.6vw,48px));transform:translateY(-50%)}
.arch-stage.is-live .arch-word--r{left:calc(50% + min(17vw,220px) + clamp(24px,2.6vw,48px));transform:translateY(-50%)}
.arch-stage.is-live .arch-caption{display:block;position:absolute;left:0;right:0;bottom:0;padding:0 var(--gutter) clamp(40px,8svh,88px);color:#fff;opacity:0;will-change:opacity}
.arch-caption__in{max-width:var(--container);margin-inline:auto;display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s4);flex-wrap:wrap}
.arch-caption .h2{color:#fff8ec;max-width:13em}
.arch-caption .vis-note{max-width:28ch;text-align:right}
@media (max-width:899px){
  .arch-stage.is-live .arch-window{width:min(62vw,340px);height:min(52svh,470px)}
  .arch-stage.is-live .arch-word{top:auto;left:0;right:0;text-align:center;transform:none}
  .arch-stage.is-live .arch-word--l{top:calc(50% - min(26svh,235px) - 82px)}
  .arch-stage.is-live .arch-word--r{top:calc(50% + min(26svh,235px) + 30px);left:0}
  .arch-word{font-size:clamp(2rem,9vw,2.8rem)}
}
.arch-text{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(32px,6vw,96px);align-items:start;padding-top:var(--section-y)}
.arch-text .lead+.lead{margin-top:var(--s3)}
.specs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:var(--s5);border-top:1px solid rgba(196,162,115,.4)}
.spec{padding:var(--s3) var(--s2) 0 0}
.spec dt{font-size:.82rem;letter-spacing:.05em;color:var(--taupe)}
.spec dd{font-family:var(--ff-serif);font-size:1.5rem;font-weight:400;color:var(--espresso);line-height:1.25;margin-top:4px}
@media (max-width:899px){.arch-text{grid-template-columns:1fr}.specs{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:420px){.spec dd{font-size:1.25rem}}

/* ---------- Wohnen: Film-Galerie ---------- */
.s-film{padding-bottom:0;overflow:clip}
.film-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,80px);align-items:end}
.film-pin{position:relative;margin-top:var(--s6)}
.film-sticky{position:relative}
.film-track{display:flex;gap:clamp(16px,2.6vw,40px);overflow-x:auto;scroll-snap-type:x mandatory;padding:8px var(--gutter) 28px;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.film-track::-webkit-scrollbar{display:none}
.film-item{position:relative;flex:0 0 auto;width:min(84vw,560px);scroll-snap-align:center;margin:0}
.film-item button{all:unset;display:block;position:relative;width:100%;cursor:zoom-in;border-radius:3px;overflow:hidden;box-shadow:var(--sh-2)}
.film-item button:focus-visible{outline:2px solid var(--gold-2);outline-offset:4px}
.film-item img{width:100%;aspect-ratio:3/2;height:auto;object-fit:cover;transition:transform 1.4s var(--ease-out)}
.film-item button:hover img{transform:scale(1.045)}
.film-cap{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;align-items:flex-end;gap:16px;padding:48px 20px 16px;background:linear-gradient(180deg,rgba(20,16,14,0),rgba(20,16,14,.62));color:#fff;pointer-events:none}
.film-cap strong{font-family:var(--ff-serif);font-weight:400;font-size:clamp(1.2rem,1.6vw,1.5rem);line-height:1.2}
.film-cap .vis-note{text-align:right}
.film-progress{position:relative;height:1px;margin:8px var(--gutter) 0;background:rgba(167,127,85,.25);overflow:hidden}
.film-progress span{position:absolute;inset:0;background:var(--g-gold);transform-origin:left;transform:scaleX(.08)}
.film-cta{padding-bottom:var(--section-y)}
/* Desktop: vertikales Scrollen bewegt die Galerie horizontal */
.film-pin.is-pinned .film-sticky{position:sticky;top:0;height:100svh;overflow:hidden;display:flex;flex-direction:column;justify-content:center}
.film-pin.is-pinned .film-track{overflow:visible;width:max-content;scroll-snap-type:none;align-items:center;padding:0 var(--gutter);will-change:transform}
.film-pin.is-pinned .film-item{width:auto;height:min(62svh,620px);aspect-ratio:3/2}
.film-pin.is-pinned .film-item:nth-child(even){height:min(50svh,500px);margin-top:14svh}
.film-pin.is-pinned .film-item:nth-child(3n){margin-top:-12svh}
.film-pin.is-pinned .film-item button,.film-pin.is-pinned .film-item picture,.film-pin.is-pinned .film-item img{width:100%;height:100%}
.film-pin.is-pinned .film-item img{aspect-ratio:auto}
.film-pin.is-pinned .film-progress{position:absolute;left:var(--gutter);right:var(--gutter);bottom:6svh;margin:0}
@media (max-width:767px){.film-head{grid-template-columns:1fr}}

/* ---------- Lightbox ---------- */
.lb{position:fixed;inset:0;z-index:80;display:grid;grid-template-rows:auto 1fr auto;background:radial-gradient(90% 80% at 50% 40%,rgba(43,37,34,.96),rgba(18,15,14,.98));color:#f4ecdf;opacity:0;visibility:hidden;transition:opacity .45s var(--ease),visibility 0s linear .45s}
.lb.is-open{opacity:1;visibility:visible;transition:opacity .45s var(--ease)}
.lb__top{display:flex;justify-content:space-between;align-items:center;padding:14px var(--gutter)}
.lb__count{font-size:.85rem;letter-spacing:.08em;color:rgba(244,236,223,.7)}
.lb__stage{position:relative;display:grid;place-items:center;padding:0 clamp(12px,6vw,96px);min-height:0}
.lb__img{max-width:100%;max-height:78svh;width:auto;height:auto;object-fit:contain;border-radius:2px;box-shadow:0 30px 80px -30px rgba(0,0,0,.6);transition:opacity .35s var(--ease),transform .5s var(--ease-out)}
.lb__img.is-swap{opacity:0;transform:scale(.985)}
.lb__img--plan{background:#fff;padding:12px}
.lb__cap{text-align:center;padding:14px var(--gutter) 22px;font-family:var(--ff-serif);font-size:1.3rem}
.lb__cap small{display:block;font-family:var(--ff-sans);font-size:.78rem;color:rgba(244,236,223,.65);margin-top:4px}
.lb__btn{width:48px;height:48px;display:grid;place-items:center;border-radius:999px;border:1px solid rgba(214,186,138,.45);background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.02));color:#f4ecdf;transition:background .4s,border-color .4s}
.lb__btn:hover{border-color:rgba(214,186,138,.9);background:linear-gradient(180deg,rgba(214,186,138,.3),rgba(214,186,138,.08))}
.lb__btn svg{width:20px;height:20px}
.lb__nav{position:absolute;top:50%;transform:translateY(-50%)}
.lb__nav--prev{left:clamp(8px,2vw,28px)}.lb__nav--next{right:clamp(8px,2vw,28px)}
@media (max-width:600px){.lb__nav{top:auto;bottom:-56px;transform:none}.lb__stage{margin-bottom:56px}}

/* ---------- Vier Etagen ---------- */
.floors-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,80px);align-items:end;margin-bottom:clamp(40px,6vw,80px)}
.floors{display:grid;grid-template-columns:minmax(220px,.9fr) minmax(280px,1fr) minmax(280px,1.05fr);gap:clamp(28px,4.5vw,72px);align-items:center}
.floors__mega{font-family:var(--ff-serif);font-weight:300;font-size:clamp(5.5rem,11vw,10rem);line-height:.8;letter-spacing:-.01em;height:.82em;overflow:hidden;position:relative}
.floors__mega span{display:block;transition:transform .8s var(--ease-out),opacity .6s var(--ease)}
.floors__mega span.is-out{transform:translateY(-40%);opacity:0}
.floors__mega span.is-in{transform:translateY(40%);opacity:0}
.tablist{display:flex;flex-direction:column;margin-top:var(--s4)}
.tab{all:unset;cursor:pointer;position:relative;display:block;padding:14px 0 14px 22px;color:var(--taupe);transition:color .4s var(--ease)}
.tab::before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:2px;background:var(--g-gold);transform:scaleY(0);transition:transform .55s var(--ease-out)}
.tab::after{content:"";position:absolute;left:0;top:50%;width:1px;height:calc(100% - 24px);transform:translateY(-50%);background:rgba(167,127,85,.28)}
.tab[aria-selected="true"]{color:var(--espresso)}
.tab[aria-selected="true"]::before{transform:scaleY(1)}
.tab:focus-visible{outline:2px solid var(--gold-2);outline-offset:2px}
.tab__name{display:block;font-family:var(--ff-serif);font-size:1.6rem;line-height:1.15;font-weight:400}
.tab__hint{display:block;font-size:.85rem;margin-top:2px;color:var(--taupe)}
.floors__media{position:relative;aspect-ratio:4/5;border-radius:999px 999px 3px 3px;overflow:hidden;box-shadow:var(--sh-2);background:#d9cdb8}
.floors__media figure{position:absolute;inset:0;opacity:0;transition:opacity .9s var(--ease)}
.floors__media figure img{width:100%;height:100%;object-fit:cover;transform:scale(1.06);transition:transform 1.6s var(--ease-out)}
.floors__media figure.is-active{opacity:1}
.floors__media figure.is-active img{transform:scale(1)}
.floors__media figcaption{position:absolute;left:0;right:0;bottom:0;padding:40px 18px 14px;background:linear-gradient(180deg,rgba(20,16,14,0),rgba(20,16,14,.55));text-align:right}
.floor-panel[hidden]{display:none}
.floor-panel{animation:panelIn .7s var(--ease-out)}
@keyframes panelIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.floor-panel .h3{margin-bottom:var(--s2)}
.rooms{margin-top:var(--s3)}
.rooms li{display:flex;justify-content:space-between;gap:16px;align-items:baseline;padding:11px 0;border-bottom:1px solid transparent;border-image:var(--g-gold-line) 1;font-size:.98rem}
.rooms li span:last-child{font-family:var(--ff-serif);font-size:1.15rem;color:var(--gold-3);white-space:nowrap}
.plan-btn{all:unset;cursor:zoom-in;display:flex;align-items:center;gap:18px;margin-top:var(--s4);padding:12px;border-radius:6px;background:linear-gradient(135deg,rgba(255,255,255,.9),rgba(250,245,236,.7));box-shadow:var(--sh-1);border:1px solid rgba(196,162,115,.3);transition:box-shadow .5s var(--ease),transform .5s var(--ease)}
.plan-btn:hover{box-shadow:var(--sh-2);transform:translateY(-2px)}
.plan-btn:focus-visible{outline:2px solid var(--gold-2);outline-offset:3px}
.plan-btn img{width:88px;height:88px;object-fit:cover;object-position:50% 40%;border-radius:4px;background:#fff}
.plan-btn strong{display:block;font-family:var(--ff-serif);font-weight:400;font-size:1.25rem;color:var(--espresso)}
.plan-btn span{display:block;font-size:.82rem;color:var(--taupe)}
.floors-note{margin-top:var(--s5);text-align:center}
@media (max-width:1023px){
  .floors{grid-template-columns:1fr 1fr}
  .floors__nav{grid-column:1 / -1;display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
  .tablist{flex-direction:row;margin-top:0;gap:8px}
  .tab{padding:10px 14px;border-radius:999px;border:1px solid rgba(167,127,85,.35);text-align:center}
  .tab::before,.tab::after{display:none}
  .tab[aria-selected="true"]{background:var(--g-gold);color:#2b2219;border-color:transparent;box-shadow:var(--sh-gold)}
  .tab__name{font-family:var(--ff-sans);font-size:.95rem;font-weight:500;letter-spacing:.04em}
  .tab__hint{display:none}
  .floors__mega{font-size:clamp(4.5rem,16vw,7rem)}
}
@media (max-width:767px){
  .floors-head{grid-template-columns:1fr}
  .floors{grid-template-columns:1fr}
  .floors__nav{flex-direction:column;align-items:stretch}
  .tablist{display:grid;grid-template-columns:repeat(4,1fr)}
  .tab{padding:12px 4px}
  .floors__media{width:min(100%,440px);margin-inline:auto}
}
.tab__abbr{display:none}
@media (max-width:1023px){.tab__abbr{display:block;font-family:var(--ff-sans);font-weight:500;font-size:.95rem;letter-spacing:.06em}.tab__name{display:none}}

/* ---------- Ausstattung ---------- */
.equip-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,80px);align-items:end;margin-bottom:clamp(48px,6vw,88px)}
.equip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,2.4vw,36px);padding-bottom:var(--s6)}
.equip-card{position:relative;margin:0;border-radius:3px;overflow:hidden;aspect-ratio:4/5;box-shadow:var(--sh-2);background:#d9cdb8;isolation:isolate}
.equip-card:nth-child(3n+2){transform:translateY(var(--s6))}
.equip-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.6s var(--ease-out);z-index:-2}
.equip-card::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(20,16,14,0) 42%,rgba(20,16,14,.28) 62%,rgba(20,16,14,.82) 100%);transition:opacity .8s var(--ease)}
.equip-card::after{content:"";position:absolute;inset:14px;border:1px solid rgba(232,209,166,.75);border-radius:2px;opacity:0;transform:scale(.965);transition:opacity .7s var(--ease),transform .9s var(--ease-out);pointer-events:none}
.equip-card figcaption{position:absolute;left:0;right:0;bottom:0;padding:clamp(20px,2.4vw,30px);color:#fff}
.equip-card h3{font-family:var(--ff-serif);font-weight:400;font-size:clamp(1.45rem,1.8vw,1.75rem);line-height:1.15;color:#fff9ef;text-wrap:balance}
.equip-card p{margin-top:8px;font-size:.92rem;line-height:1.55;font-weight:300;color:rgba(255,248,236,.86);text-wrap:pretty}
.equip-card .vis-note{position:absolute;top:18px;right:20px}
@media (hover:hover){
  .equip-card:hover img{transform:scale(1.07)}
  .equip-card:hover::after{opacity:1;transform:scale(1)}
}
.equip-progress{display:none}
@media (max-width:1023px){
  .equip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .equip-card:nth-child(3n+2){transform:none}
  .equip-card:nth-child(2n){transform:translateY(var(--s5))}
  .equip{padding-bottom:var(--s5)}
}
@media (max-width:767px){
  .equip-head{grid-template-columns:1fr}
  .equip{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;margin-inline:calc(var(--gutter) * -1);padding:4px var(--gutter) 20px;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
  .equip::-webkit-scrollbar{display:none}
  .equip-card{flex:0 0 78vw;scroll-snap-align:center}
  .equip-card:nth-child(2n){transform:none}
  .equip-progress{display:block;position:relative;height:1px;background:rgba(167,127,85,.25);overflow:hidden}
  .equip-progress span{position:absolute;inset:0;background:var(--g-gold);transform-origin:left;transform:scaleX(.08)}
}

/* ---------- Energie ---------- */
.s-energy{overflow:hidden}
.energy-glow{position:absolute;left:0;top:0;width:640px;height:640px;margin:-320px 0 0 -320px;border-radius:50%;background:radial-gradient(circle,rgba(214,182,128,.2),rgba(214,182,128,0) 65%);pointer-events:none;opacity:0;transition:opacity .8s var(--ease);will-change:transform}
.s-energy:hover .energy-glow{opacity:1}
.energy{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(40px,6vw,104px);align-items:center}
.energy__mega{font-family:var(--ff-serif);font-weight:300;font-size:clamp(9rem,25vw,21rem);line-height:.78;letter-spacing:-.03em;margin-left:-.04em;padding-top:.05em}
.energy__mega-label{font-size:.95rem;letter-spacing:.04em;color:rgba(239,230,216,.75);margin-top:var(--s3)}
.escale{position:relative;margin-top:var(--s6);padding-top:46px}
.escale__bar{display:grid;grid-template-columns:repeat(9,1fr);gap:3px}
.escale__bar span{height:12px;border-radius:2px;box-shadow:inset 0 1px 0 rgba(255,255,255,.25)}
.escale__bar span:nth-child(1){background:linear-gradient(180deg,#86b07c,#5f8f58)}
.escale__bar span:nth-child(2){background:linear-gradient(180deg,#9cb877,#76994f)}
.escale__bar span:nth-child(3){background:linear-gradient(180deg,#b5bf72,#8f9b47)}
.escale__bar span:nth-child(4){background:linear-gradient(180deg,#cbc26f,#a69f45)}
.escale__bar span:nth-child(5){background:linear-gradient(180deg,#d8b469,#b48f43)}
.escale__bar span:nth-child(6){background:linear-gradient(180deg,#d99e60,#b5783d)}
.escale__bar span:nth-child(7){background:linear-gradient(180deg,#cf855a,#a95f3b)}
.escale__bar span:nth-child(8){background:linear-gradient(180deg,#c06c55,#984a39)}
.escale__bar span:nth-child(9){background:linear-gradient(180deg,#a95a51,#7f3c35)}
.escale__labels{display:grid;grid-template-columns:repeat(9,1fr);gap:3px;margin-top:8px;font-size:.75rem;text-align:center;color:rgba(239,230,216,.6)}
.escale__marker{position:absolute;top:0;left:0;width:calc((100% - 24px) / 9);display:flex;flex-direction:column;align-items:flex-start;transform:translateX(calc(800% + 24px));transition:transform 2s var(--ease-out) .25s}
.escale.in .escale__marker{transform:translateX(0)}
.escale__marker b{font-weight:500;font-size:.8rem;letter-spacing:.03em;white-space:nowrap;color:#2b2219;background:var(--g-gold);padding:4px 10px;border-radius:999px;box-shadow:var(--sh-gold)}
.escale__marker i{margin-left:calc(50% - 6px);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:7px solid #c4a273;margin-top:2px}
.tech{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(20px,3vw,40px);margin-top:var(--s5)}
.tech li{padding:16px 0;border-top:1px solid rgba(214,186,138,.22)}
.tech strong{display:block;font-family:var(--ff-serif);font-weight:400;font-size:1.3rem;color:#f6eddf;line-height:1.25}
.tech span{display:block;font-size:.88rem;color:rgba(239,230,216,.68);margin-top:2px}
.epass{margin-top:var(--s5);padding:20px 24px;border-radius:6px;border:1px solid rgba(214,186,138,.28);background:linear-gradient(135deg,rgba(255,255,255,.07),rgba(255,255,255,.015))}
.epass h3{font-family:var(--ff-sans);font-weight:500;font-size:.85rem;letter-spacing:.06em;color:var(--gold-1)}
.epass dl{display:grid;grid-template-columns:auto 1fr;gap:6px 20px;margin-top:10px;font-size:.88rem}
.epass dt{color:rgba(239,230,216,.62)}
.epass dd{color:#f4ebdd}
@media (max-width:899px){.energy{grid-template-columns:1fr}.energy__mega{font-size:clamp(8rem,42vw,14rem)}}
@media (max-width:480px){.tech{grid-template-columns:1fr}.epass dl{grid-template-columns:1fr;gap:0}.epass dd{margin-bottom:8px}}

/* ---------- Villenhälften ---------- */
.villas-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,80px);align-items:end;margin-bottom:clamp(40px,6vw,80px)}
.villas{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(28px,4.5vw,72px);align-items:start}
.siteplan{position:sticky;top:calc(var(--hdr-h) + 24px);padding:clamp(16px,2vw,28px);border-radius:6px;background:linear-gradient(150deg,rgba(255,255,255,.92),rgba(249,244,235,.78));box-shadow:var(--sh-2);border:1px solid rgba(196,162,115,.28)}
.siteplan svg{width:100%;height:auto}
.siteplan figcaption{margin-top:12px;text-align:center}
.lot-hi{opacity:0;transition:opacity .6s var(--ease)}
.lot.is-active .lot-hi{opacity:1}
.lot-num{font-family:var(--ff-serif);font-size:30px;fill:var(--espresso);transition:fill .5s}
.lot.is-active .lot-num{fill:#fffaf0}
.lot{cursor:pointer}
.lot:focus-visible{outline:none}
.lot:focus-visible .lot-edge{stroke:var(--espresso);stroke-width:2.5}
.villa-list{display:grid;gap:clamp(14px,1.6vw,20px)}
.villa{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:clamp(16px,2.4vw,32px);align-items:center;padding:clamp(20px,2.4vw,30px) clamp(20px,2.6vw,34px);border-radius:6px;background:linear-gradient(135deg,rgba(255,255,255,.9),rgba(250,246,238,.66));border:1px solid rgba(196,162,115,.26);box-shadow:var(--sh-1);transition:transform .7s var(--ease-out),box-shadow .7s var(--ease),border-color .5s;transform-style:preserve-3d;will-change:transform}
.villa::before{content:"";position:absolute;left:0;top:18px;bottom:18px;width:2px;background:var(--g-gold);transform:scaleY(0);transition:transform .6s var(--ease-out)}
.villa.is-active{box-shadow:var(--sh-2);border-color:rgba(196,162,115,.7)}
.villa.is-active::before{transform:scaleY(1)}
.villa__no{text-align:center;line-height:1}
.villa__no small{display:block;font-size:.72rem;letter-spacing:.06em;color:var(--taupe)}
.villa__no b{display:block;font-family:var(--ff-serif);font-weight:300;font-size:clamp(3.4rem,5vw,4.6rem);line-height:.9;background:var(--g-gold-text);-webkit-background-clip:text;background-clip:text;color:transparent;min-width:1.2em}
.villa__data{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 18px}
.villa__data dt{font-size:.78rem;letter-spacing:.03em;color:var(--taupe)}
.villa__data dd{font-family:var(--ff-serif);font-size:clamp(1.15rem,1.5vw,1.4rem);color:var(--espresso);white-space:nowrap}
.villa__price{text-align:right}
.villa__price strong{display:block;font-family:var(--ff-serif);font-weight:400;font-size:clamp(1.45rem,2vw,1.85rem);color:var(--espresso);white-space:nowrap;line-height:1.1}
.villa__price span{display:block;font-size:.78rem;color:var(--taupe);margin-top:4px}
.villa__price .villa__status{display:inline-flex;align-items:center;gap:7px;margin-top:8px;font-size:.78rem;color:var(--gold-3)}
.villa__status i{display:inline-block;flex:0 0 7px;width:7px;height:7px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#d5e7c3,#6f9a5c);box-shadow:0 0 0 4px rgba(111,154,92,.15)}
.villas-note{margin-top:var(--s3)}
@media (max-width:1023px){.villas{grid-template-columns:1fr}.siteplan{position:relative;top:0;max-width:640px;width:100%;margin-inline:auto}}
@media (max-width:767px){.villas-head{grid-template-columns:1fr}}
@media (max-width:600px){
  .villa{grid-template-columns:auto 1fr;grid-template-areas:"no price" "data data"}
  .villa__no{grid-area:no}.villa__price{grid-area:price}.villa__data{grid-area:data;padding-top:14px;border-top:1px solid rgba(196,162,115,.3)}
}

/* ---------- Lage ---------- */
.s-loc{position:relative;min-height:min(118svh,1100px);display:flex;align-items:center;color:#fff;overflow:hidden;isolation:isolate;padding-block:clamp(96px,12vw,160px)}
.loc-bg{position:absolute;left:0;right:0;top:-14%;bottom:-14%;z-index:-2;will-change:transform}
.loc-bg img{width:100%;height:100%;object-fit:cover}
.s-loc::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(24,19,17,.7) 0%,rgba(24,19,17,.38) 34%,rgba(24,19,17,.5) 60%,rgba(22,18,16,.88) 100%),radial-gradient(70% 60% at 20% 30%,rgba(22,18,16,.35),rgba(22,18,16,0))}
.loc-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,5vw,80px);align-items:end}
.s-loc .h2{color:#fff8ec}
.s-loc .lead{color:rgba(255,248,236,.88);margin-top:var(--s3)}
.loc-big{text-align:right}
.loc-big__num{font-family:var(--ff-serif);font-weight:300;font-size:clamp(6rem,15vw,13rem);line-height:.82;white-space:nowrap}
.loc-big__num .n{background:linear-gradient(180deg,#fffaf0,#e6cfa5 60%,#c9a675);-webkit-background-clip:text;background-clip:text;color:transparent;font-variant-numeric:lining-nums tabular-nums;display:inline-block;text-align:right}
.loc-big__num small{font-size:.32em;color:#f1e3c8;margin-left:.12em}
.loc-big__label{font-size:1rem;letter-spacing:.04em;color:rgba(255,248,236,.82);margin-top:10px}
.route{position:relative;margin-top:clamp(64px,9vw,120px)}
.route__line{position:absolute;left:0;right:0;top:9px;height:1px;background:linear-gradient(90deg,rgba(232,209,166,.95),rgba(232,209,166,.5));transform-origin:left;transform:scaleX(1)}
.route__stops{position:relative;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.stop{position:relative;padding-top:34px}
.stop::before{content:"";position:absolute;left:0;top:2px;width:15px;height:15px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff3d9,#c9a675 60%,#9a7449);box-shadow:0 0 0 6px rgba(232,209,166,.16)}
.stop strong{display:block;font-family:var(--ff-serif);font-weight:300;font-size:clamp(1.9rem,2.6vw,2.6rem);line-height:1;color:#fff8ec;white-space:nowrap}
.stop span{display:block;font-size:.9rem;line-height:1.45;color:rgba(255,248,236,.8);margin-top:8px}
.js .route .route__line{transform:scaleX(0);transition:transform 2.2s var(--ease-out)}
.js .route .stop{opacity:0;transform:translateY(14px);transition:opacity .8s var(--ease),transform .8s var(--ease);transition-delay:calc(.35s + var(--i) * 220ms)}
.js .route.in .route__line{transform:scaleX(1)}
.js .route.in .stop{opacity:1;transform:none}
.route-note{margin-top:var(--s4);font-size:.8rem;color:rgba(255,248,236,.6)}
@media (max-width:899px){
  .s-loc::before{background:linear-gradient(180deg,rgba(24,19,17,.78) 0%,rgba(24,19,17,.6) 40%,rgba(24,19,17,.66) 70%,rgba(22,18,16,.9) 100%)}
  .loc-grid{grid-template-columns:1fr}
  .loc-big{text-align:left}
  .route__line{left:7px;right:auto;top:6px;bottom:6px;width:1px;height:auto;background:linear-gradient(180deg,rgba(232,209,166,.95),rgba(232,209,166,.4));transform-origin:top}
  .js .route .route__line{transform:scaleY(0)}
  .js .route.in .route__line{transform:scaleY(1)}
  .route__stops{grid-template-columns:1fr;gap:22px}
  .stop{padding:0 0 0 40px;display:flex;align-items:baseline;gap:16px}
  .stop strong{min-width:4.2ch;font-size:2rem}
  .stop span{margin-top:0}
}

.near{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,5vw,88px);align-items:start}
.near .tablist{margin-top:var(--s4)}
.near-panel[hidden]{display:none}
.near-panel{animation:panelIn .6s var(--ease-out)}
.near-list li{display:grid;grid-template-columns:minmax(5.6ch,auto) 1fr;gap:clamp(16px,3vw,40px);align-items:baseline;padding:16px 0;border-bottom:1px solid transparent;border-image:var(--g-gold-line) 1}
.near-list b{font-family:var(--ff-serif);font-weight:300;font-size:clamp(1.9rem,3vw,2.6rem);line-height:1;color:var(--gold-3);white-space:nowrap}
.near-list span{font-size:1rem;color:var(--ink)}
@media (max-width:1023px){.near{grid-template-columns:1fr}.near .tablist{margin-top:var(--s3)}}

.map{position:relative;margin-top:clamp(56px,8vw,112px);border-radius:6px;overflow:hidden;aspect-ratio:16/8;min-height:440px;box-shadow:var(--sh-2);background:#cfc3ad;isolation:isolate}
.map__preview{position:absolute;inset:0}
.map__preview img{width:100%;height:100%;object-fit:cover;filter:saturate(.92)}
.map__preview::after{content:"";position:absolute;inset:0;background:linear-gradient(270deg,rgba(24,19,17,.82) 0%,rgba(24,19,17,.45) 30%,rgba(24,19,17,.08) 52%,rgba(24,19,17,0) 70%)}
.map__pin{position:absolute;left:var(--px,48.5%);top:var(--py,50%);width:56px;height:56px;margin:-28px 0 0 -28px;z-index:2;pointer-events:none}
.map__pin::before,.map__pin::after{content:"";position:absolute;inset:0;border-radius:50%;border:1.5px solid rgba(240,214,166,.95);animation:ping 2.6s var(--ease-out) infinite}
.map__pin::after{animation-delay:1.3s}
.map__pin i{position:absolute;left:50%;top:50%;width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff4dc,#c9a675 60%,#9a7449);box-shadow:0 0 0 5px rgba(255,248,236,.35),0 6px 16px rgba(0,0,0,.45)}
@keyframes ping{from{transform:scale(.3);opacity:1}to{transform:scale(1.6);opacity:0}}
.map__card{position:absolute;right:clamp(20px,4vw,56px);bottom:clamp(20px,4vw,56px);z-index:3;color:#fff;width:min(380px,calc(100% - 40px))}
.map__card .h2{color:#fff8ec;font-size:clamp(1.9rem,2.6vw,2.5rem);white-space:nowrap}
.map__card p{margin-top:8px;color:rgba(255,248,236,.85)}
.map__load{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:10px;margin-top:var(--s3);min-height:48px;padding:0 22px;border-radius:999px;border:1px solid rgba(240,214,166,.7);background:linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,.05));backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#fff8ec;font-size:.95rem;letter-spacing:.03em;transition:background .4s,border-color .4s}
.map__load:hover{background:linear-gradient(180deg,rgba(232,209,166,.4),rgba(232,209,166,.12));border-color:#f0d6a6}
.map__load:focus-visible{outline:2px solid #f0d6a6;outline-offset:3px}
.map__load svg{width:18px;height:18px}
.map__legal{display:block;margin-top:10px;font-size:.75rem;color:rgba(255,248,236,.65);max-width:40ch}
.map__frame{position:absolute;inset:0;z-index:4;display:none}
.map__frame iframe{width:100%;height:100%;border:0}
.map.is-loaded .map__frame{display:block}
@media (max-width:1023px){
  .map{aspect-ratio:4/3;min-height:0}
  .map__preview::after{background:linear-gradient(0deg,rgba(24,19,17,.88) 0%,rgba(24,19,17,.55) 30%,rgba(24,19,17,.08) 46%,rgba(24,19,17,0) 60%)}
  .map__pin{--px:48.2%;--py:50%}
  .map__card{left:clamp(20px,4vw,40px);right:clamp(20px,4vw,40px);width:auto;bottom:clamp(20px,4vw,40px)}
}
@media (max-width:767px){
  .map{aspect-ratio:3/5}
  .map__preview::after{background:linear-gradient(0deg,rgba(24,19,17,.9) 0%,rgba(24,19,17,.6) 34%,rgba(24,19,17,.1) 50%,rgba(24,19,17,0) 62%)}
  .map__pin{--px:46%;--py:46%}
}

/* ---------- Bauträger ---------- */
.dev{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(36px,6vw,104px);align-items:center}
.dev__media{position:relative;aspect-ratio:4/5;border-radius:999px 999px 3px 3px;overflow:hidden;box-shadow:var(--sh-2);background:#d9cdb8}
.dev__media img{width:100%;height:100%;object-fit:cover}
.dev__logo{width:clamp(170px,18vw,220px);height:auto;margin-bottom:var(--s4)}
.dev .lead{margin-top:var(--s3)}
.dev-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:var(--s5);border-top:1px solid rgba(196,162,115,.45)}
.dev-fact{padding:var(--s3) 12px 0 0}
.dev-fact+.dev-fact{padding-left:clamp(12px,2vw,24px);border-left:1px solid rgba(196,162,115,.3)}
.dev-fact b{display:block;font-family:var(--ff-serif);font-weight:300;font-size:clamp(2.4rem,4.4vw,3.8rem);line-height:1;white-space:nowrap}
.dev-fact b .n{background:var(--g-gold-text);-webkit-background-clip:text;background-clip:text;color:transparent;display:inline-block;font-variant-numeric:lining-nums tabular-nums}
.dev-fact b small{font-size:.42em;color:var(--gold-2);margin-left:.12em}
.dev-fact>span{display:block;font-size:.86rem;color:var(--taupe);margin-top:8px;line-height:1.45}
@media (max-width:899px){.dev{grid-template-columns:1fr}.dev__media{width:min(100%,420px);margin-inline:auto}}
@media (max-width:420px){.dev-fact b{font-size:2.1rem}}

/* ---------- Abschluss ---------- */
.s-final{position:relative;min-height:100svh;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;overflow:hidden;isolation:isolate;padding-block:clamp(96px,14vw,180px)}
.final-bg{position:absolute;inset:0;z-index:-2}
.final-bg img{width:100%;height:100%;object-fit:cover;transform:scale(1.12);will-change:transform}
.s-final::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(80% 70% at 50% 50%,rgba(22,18,16,.52),rgba(22,18,16,.78)),linear-gradient(180deg,rgba(22,18,16,.35),rgba(22,18,16,.65))}
.final-in{max-width:900px;padding-inline:var(--gutter)}
.s-final .h2{color:#fff8ec;font-size:clamp(2.6rem,6vw,5.4rem)}
.s-final .lead{color:rgba(255,248,236,.88);margin:var(--s3) auto 0}
.s-final .vis-note{position:absolute;right:var(--gutter);bottom:20px}

/* ---------- Footer ---------- */
.ftr{padding:clamp(56px,7vw,88px) 0 clamp(96px,9vw,40px)}
.ftr__top{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:var(--s5);align-items:start}
.ftr .brand{align-items:flex-start;color:#f4ebdd}
.ftr__addr{margin-top:var(--s3);font-size:.92rem;color:rgba(239,230,216,.72);line-height:1.7}
.ftr__by{font-size:.85rem;color:rgba(239,230,216,.62)}
.ftr__by img{width:170px;height:auto;margin-top:12px}
.ftr__links{display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.ftr__links a,.ftr__links button{all:unset;cursor:pointer;font-size:.92rem;color:#efe5d5;position:relative;padding-block:4px}
.ftr__links a:focus-visible,.ftr__links button:focus-visible{outline:2px solid var(--gold-1);outline-offset:3px}
.ftr__links a::after,.ftr__links button::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .5s var(--ease)}
.ftr__links a:hover::after,.ftr__links button:hover::after{transform:scaleX(1);transform-origin:left}
.ftr__bottom{margin-top:var(--s5);padding-top:var(--s3);border-top:1px solid rgba(214,186,138,.2);font-size:.78rem;line-height:1.6;color:rgba(239,230,216,.55)}
@media (max-width:767px){.ftr__top{grid-template-columns:1fr}.ftr__links{align-items:flex-start}.ftr{padding-bottom:120px}}

/* ---------- Sticky CTA (mobil) ---------- */
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:40;padding:14px 16px calc(14px + env(safe-area-inset-bottom));background:linear-gradient(180deg,rgba(246,242,234,0),rgba(246,242,234,.9) 38%,rgba(240,233,221,.97));transform:translateY(115%);transition:transform .6s var(--ease);display:none}
.sticky-cta .btn{width:100%}
.sticky-cta.is-visible{transform:none}
@media (max-width:767px){.sticky-cta{display:block}}

/* ---------- Cookie-Banner ---------- */
.cc{position:fixed;z-index:70;left:16px;right:16px;bottom:16px;max-width:520px;padding:24px;border-radius:10px;background:radial-gradient(70% 60% at 100% 0%,rgba(222,196,152,.25),rgba(222,196,152,0)),var(--noise),var(--g-ivory);color:var(--ink);box-shadow:0 30px 80px -30px rgba(30,24,20,.55),0 4px 14px rgba(30,24,20,.12);border:1px solid rgba(196,162,115,.35);transform:translateY(20px);opacity:0;transition:opacity .5s var(--ease),transform .6s var(--ease-out)}
.cc.is-open{opacity:1;transform:none}
.cc[hidden]{display:none}
.cc h2{font-family:var(--ff-serif);font-weight:400;font-size:1.6rem;line-height:1.15;color:var(--espresso)}
.cc p{margin-top:8px;font-size:.88rem;line-height:1.6}
.cc a{color:var(--gold-3)}
.cc__opts{margin-top:14px;display:grid;gap:10px}
.cc__opts[hidden]{display:none}
.cc__opt{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:12px 14px;border-radius:8px;background:linear-gradient(135deg,rgba(255,255,255,.85),rgba(255,255,255,.5));border:1px solid rgba(196,162,115,.25)}
.cc__opt strong{display:block;font-weight:500;font-size:.9rem;color:var(--espresso)}
.cc__opt span{display:block;font-size:.78rem;color:var(--taupe);line-height:1.45}
.switch{position:relative;width:46px;height:26px;flex:0 0 auto}
.switch input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer;z-index:1}
.switch i{position:absolute;inset:0;border-radius:999px;background:linear-gradient(180deg,#d9cfbf,#cbbfa9);transition:background .3s}
.switch i::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.25);transition:transform .35s var(--ease)}
.switch input:checked+i{background:var(--g-gold)}
.switch input:checked+i::after{transform:translateX(20px)}
.switch input:focus-visible+i{outline:2px solid var(--gold-2);outline-offset:2px}
.switch input:disabled{cursor:not-allowed}
.switch input:disabled+i{opacity:.7}
.cc__btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.cc__btn{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;justify-content:center;min-height:48px;padding:0 14px;border-radius:999px;font-weight:500;font-size:.92rem;letter-spacing:.03em;text-align:center;transition:transform .4s var(--ease),box-shadow .4s}
.cc__btn:focus-visible{outline:2px solid var(--gold-2);outline-offset:3px}
.cc__btn--accept{background:var(--g-gold);color:#2b2219;box-shadow:var(--sh-gold)}
.cc__btn--deny{background:linear-gradient(180deg,#453c37,#2c2624);color:#f5ecde;box-shadow:0 12px 26px -12px rgba(30,24,20,.6)}
.cc__btn:hover{transform:translateY(-1px)}
.cc__more{all:unset;cursor:pointer;display:inline-block;margin-top:12px;font-size:.85rem;color:var(--gold-3);text-decoration:underline;text-underline-offset:3px}
.cc__more:focus-visible{outline:2px solid var(--gold-2);outline-offset:2px}
.cc__save{grid-column:1/-1}
.cc__btn[hidden],.cc__more[hidden]{display:none}
@media (min-width:768px){.cc{left:24px;bottom:24px;right:auto}}

/* ---------- Funnel-Seiten ---------- */
.mini-hdr{position:absolute;inset:0 0 auto;z-index:5;height:var(--hdr-h);display:flex;align-items:center;justify-content:center;color:var(--espresso)}
.funnel{min-height:100svh;display:flex;align-items:center;padding:calc(var(--hdr-h) + 32px) var(--gutter) 64px}
.funnel__in{width:100%;max-width:1120px;margin-inline:auto;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,6vw,96px);align-items:center}
.funnel__media{aspect-ratio:4/5;border-radius:999px 999px 3px 3px;overflow:hidden;box-shadow:var(--sh-2);background:#d9cdb8}
.funnel__media img{width:100%;height:100%;object-fit:cover}
.funnel h1{font-family:var(--ff-serif);font-weight:300;font-size:clamp(2.4rem,5vw,4.2rem);line-height:1.04;color:var(--espresso);text-wrap:balance}
.funnel .lead{margin-top:var(--s3)}
.progress{margin-top:var(--s5)}
.progress__top{display:flex;justify-content:space-between;align-items:baseline;font-size:.9rem;color:var(--taupe)}
.progress__top b{font-family:var(--ff-serif);font-weight:300;font-size:2.6rem;line-height:1;color:var(--gold-3)}
.progress__track{margin-top:10px;height:10px;border-radius:999px;background:linear-gradient(180deg,rgba(196,162,115,.18),rgba(196,162,115,.3));overflow:hidden;box-shadow:inset 0 1px 2px rgba(48,40,32,.12)}
.progress__bar{height:100%;width:100%;border-radius:999px;background:var(--g-gold);transform-origin:left;transform:scaleX(.9)}
.js .progress__bar{transform:scaleX(0);transition:transform 1.8s var(--ease-out) .2s}
.js .progress.in .progress__bar{transform:scaleX(.9)}
.steps{display:grid;gap:12px;margin-top:var(--s5)}
.step{display:grid;grid-template-columns:44px 1fr;gap:16px;align-items:center;padding:14px 18px;border-radius:8px;color:var(--taupe);background:linear-gradient(135deg,rgba(255,255,255,.6),rgba(255,255,255,.25));border:1px solid rgba(196,162,115,.2)}
.step__ic{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-family:var(--ff-serif);font-size:1.3rem;border:1px solid rgba(196,162,115,.5);color:var(--gold-3)}
.step__ic svg{width:20px;height:20px}
.step strong{display:block;font-weight:500;color:var(--espresso);font-size:1rem}
.step--done .step__ic{background:var(--g-gold);border-color:transparent;color:#2b2219;box-shadow:var(--sh-gold)}
.step--now{padding:22px 22px;background:linear-gradient(135deg,#fffdf8,#f6efe2);border:1px solid rgba(196,162,115,.65);box-shadow:var(--sh-2);color:var(--ink)}
.step--now strong{font-family:var(--ff-serif);font-weight:400;font-size:clamp(1.4rem,2.2vw,1.8rem);line-height:1.2}
.step--now .step__ic{background:linear-gradient(180deg,#453c37,#2c2624);color:#f2dfb9;border-color:transparent;animation:pulse 2.4s var(--ease) infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(196,162,115,.45)}50%{box-shadow:0 0 0 10px rgba(196,162,115,0)}}
.hint{margin-top:var(--s4);display:flex;gap:14px;align-items:flex-start;font-size:.92rem;line-height:1.6;color:var(--ink);padding:16px 18px;border-radius:8px;background:linear-gradient(135deg,rgba(232,209,166,.28),rgba(232,209,166,.1));border:1px solid rgba(196,162,115,.35)}
.hint svg{flex:0 0 22px;width:22px;height:22px;color:var(--gold-3);margin-top:2px}
.funnel .cta{justify-content:flex-start;margin-top:var(--s5)}
.contact-mail{display:block;margin-top:12px;font-size:.9rem;color:var(--taupe)}
.funnel-ftr{position:absolute;left:0;right:0;bottom:0;padding:16px var(--gutter);display:flex;justify-content:center;gap:24px;font-size:.82rem;color:var(--taupe)}
.funnel-ftr a,.funnel-ftr button{all:unset;cursor:pointer}
.funnel-ftr a:hover,.funnel-ftr button:hover{color:var(--espresso)}
.funnel-wrap{position:relative}
@media (max-width:899px){.funnel__in{grid-template-columns:1fr}.funnel__media{display:none}}

/* ---------- Rechtstexte ---------- */
.legal{max-width:780px;margin-inline:auto;padding:calc(var(--hdr-h) + 56px) var(--gutter) 96px}
.legal h1{font-family:var(--ff-serif);font-weight:300;font-size:clamp(2.4rem,5vw,3.6rem);line-height:1.05;color:var(--espresso)}
.legal h2{font-family:var(--ff-serif);font-weight:400;font-size:1.6rem;line-height:1.2;color:var(--espresso);margin-top:var(--s5)}
.legal h3{font-weight:500;font-size:1rem;color:var(--espresso);margin-top:var(--s3)}
.legal p,.legal ul{margin-top:12px;font-size:.98rem;line-height:1.75;overflow-wrap:anywhere;hyphens:auto}
.legal ul{list-style:disc;padding-left:1.2em}
.legal a{color:var(--gold-3)}
.legal .ph{background:rgba(196,162,115,.22);padding:1px 6px;border-radius:3px;font-size:.9em}
.legal-hdr{position:fixed;inset:0 0 auto;z-index:20;height:var(--hdr-h);display:flex;align-items:center;justify-content:center;color:var(--espresso)}
.legal-hdr::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(253,251,247,.95),rgba(246,241,232,.88));backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 1px 0 rgba(167,127,85,.2)}
.legal-hdr .brand{position:relative}

/* ---------- Einblendungen (nur mit JS, einmalig) ---------- */
.js [data-reveal]{opacity:0;transform:translateY(26px);transition:opacity 1s var(--ease),transform 1.1s var(--ease-out);transition-delay:calc(var(--d,0) * 90ms)}
.js [data-reveal].in{opacity:1;transform:none}
.js [data-curtain]{position:relative}
.js [data-curtain]::after{content:"";position:absolute;inset:-1px;z-index:5;background:var(--curtain,linear-gradient(180deg,#f7f3eb,#efe7d9));transform-origin:right center;transform:scaleX(1);transition:transform 1.4s var(--ease-out);pointer-events:none}
.js [data-curtain].in::after{transform:scaleX(0)}
.js [data-curtain] img{transform:scale(1.12);transition:transform 2s var(--ease-out)}
.js [data-curtain].in img{transform:scale(1)}
.js .equip-card[data-reveal].in:nth-child(3n+2){transform:translateY(var(--s6))}
@media (max-width:1023px){.js .equip-card[data-reveal].in:nth-child(3n+2){transform:none}.js .equip-card[data-reveal].in:nth-child(2n){transform:translateY(var(--s5))}}
@media (max-width:767px){.js .equip-card[data-reveal].in:nth-child(2n){transform:none}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;transition-delay:0s!important}
  .js [data-reveal],.js .route .stop{opacity:1;transform:none}
  .js [data-curtain]::after{transform:scaleX(0)}
  .js .hero__mark .ch{transform:none}
}