/* ============================================================
   LAS TERAZZAS — Luxus-Immobilien-Website
   Design-System: Bone/Sand/Gold · Marcellus/EB Garamond/Hanken Grotesk
   Scharfe Kanten, monumentale Typografie, ruhiger Schweizer Luxus
   ============================================================ */
:root{
  /* DARK-LUXURY-THEME (2026-07): warmer Nacht-Ton, Gold-Akzente, helle Schrift.
     Token-Namen bleiben (bone/cream = Flächen, ink = Text) — Werte sind jetzt dunkel. */
  --bone:#100e0b; --cream:#16130f; --sand:#221d18; --stone:#2b241b;
  --ink:#f4eee2; --ink-soft:#c6bba6; --ink-faint:#978c7c;
  --gold:#c9a45c; --gold-deep:#b58a45; --gold-soft:#e7ce94;
  --dark:#0b0a07; --dark-2:#181410;
  --surface:#181410; --surface-2:#201a13;
  --line:rgba(236,226,206,.13); --line-soft:rgba(236,226,206,.06);
  --shadow:0 34px 90px -34px rgba(0,0,0,.7);
  --serif:'EB Garamond',Georgia,serif;
  --display:'Marcellus',Georgia,serif;
  --sans:'Hanken Grotesk',system-ui,-apple-system,sans-serif;
  --ease:cubic-bezier(.22,.61,.36,1);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{ -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; scroll-behavior:smooth; }
body{ font-family:var(--sans); background:var(--bone); color:var(--ink); overflow-x:hidden; line-height:1.55; }
img{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;}
::selection{ background:var(--gold-soft); color:#2a2014; }

/* ---------- Reveal ---------- */
.r{ opacity:0; transform:translateY(26px); transition:opacity .9s var(--ease), transform .9s var(--ease); }
.r.vis{ opacity:1; transform:none; }
@media(prefers-reduced-motion:reduce){ .r{ opacity:1; transform:none; transition:none; } }

/* ---------- Nav ---------- */
.nav{ position:fixed; top:0; left:0; width:100%; z-index:1000; display:flex; align-items:center; justify-content:space-between; padding:1.3rem clamp(1.2rem,4vw,3.2rem); transition:background .5s var(--ease), padding .5s var(--ease), box-shadow .5s var(--ease); }
.nav.scrolled, .nav.solid{ background:rgba(250,246,238,.86); -webkit-backdrop-filter:blur(18px) saturate(1.4); backdrop-filter:blur(18px) saturate(1.4); padding-top:.9rem; padding-bottom:.9rem; box-shadow:0 1px 0 var(--line-soft); }
.brand{ font-family:var(--display); font-weight:500; font-size:clamp(1rem,2.4vw,1.2rem); letter-spacing:.26em; padding-left:.26em; white-space:nowrap; color:#fff; transition:color .5s var(--ease); }
.brand small{ display:block; font-family:var(--sans); font-size:.5rem; letter-spacing:.44em; color:var(--gold-soft); margin-top:.15rem; }
.nav.scrolled .brand, .nav.solid .brand{ color:var(--ink); }
.nav.scrolled .brand small, .nav.solid .brand small{ color:var(--gold-deep); }
.nav-links{ display:flex; gap:1.9rem; align-items:center; }
.nav-links a{ font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,.88); position:relative; padding:.3rem 0; transition:color .35s; }
.nav.scrolled .nav-links a, .nav.solid .nav-links a{ color:var(--ink-soft); }
.nav-links a::after{ content:''; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--gold); transition:width .4s var(--ease); }
.nav-links a:hover::after, .nav-links a.active::after{ width:100%; }
.nav-links a.active{ color:#fff; }
.nav.scrolled .nav-links a.active, .nav.solid .nav-links a.active{ color:var(--ink); }
.nav-cta{ font-size:.68rem; letter-spacing:.18em; text-transform:uppercase; color:#fff !important; border:1px solid rgba(255,255,255,.6); padding:.68rem 1.25rem; border-radius:0; transition:all .4s var(--ease); white-space:nowrap; }
.nav.scrolled .nav-cta, .nav.solid .nav-cta{ color:var(--ink) !important; border-color:var(--ink); }
.nav-cta:hover{ background:var(--gold); border-color:var(--gold); color:#fff !important; }
.nav-cta::after{ display:none !important; }
.nav-burger{ display:none; flex-direction:column; gap:5px; padding:8px; z-index:1001; }
.nav-burger span{ width:24px; height:1.5px; background:#fff; transition:.35s var(--ease); }
.nav.scrolled .nav-burger span, .nav.solid .nav-burger span{ background:var(--ink); }
@media(max-width:1080px){
  .nav-links{ position:fixed; inset:0; flex-direction:column; justify-content:center; gap:1.7rem; background:rgba(20,15,8,.97); -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px); transform:translateY(-100%); transition:transform .6s var(--ease); z-index:999; }
  .nav-links.open{ transform:translateY(0); }
  .nav-links a{ font-size:1.05rem; color:#fff !important; }
  .nav-links a.active{ color:var(--gold-soft) !important; }
  .nav-burger{ display:flex; }
  .nav-burger.open span:nth-child(1){ transform:translateY(6.5px) rotate(45deg); background:#fff; }
  .nav-burger.open span:nth-child(2){ opacity:0; }
  .nav-burger.open span:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); background:#fff; }
}

/* ---------- Buttons: scharf, architektonisch ---------- */
.btn{ font-size:.68rem; letter-spacing:.26em; text-transform:uppercase; font-weight:500; padding:1.05rem 2.2rem; border-radius:0; transition:all .45s var(--ease); display:inline-flex; align-items:center; gap:.7rem; border:1px solid transparent; }
.btn .arr{ transition:transform .4s var(--ease); }
.btn:hover .arr{ transform:translateX(4px); }
.btn-light{ background:var(--bone); color:var(--ink); }
.btn-light:hover{ background:var(--gold); color:#fff; transform:translateY(-2px); box-shadow:0 18px 40px -16px rgba(184,148,90,.7); }
.btn-gold{ background:var(--gold); color:#fff; }
.btn-gold:hover{ background:var(--gold-deep); transform:translateY(-2px); box-shadow:0 18px 40px -16px rgba(184,148,90,.8); }
.btn-dark{ background:var(--ink); color:#fff; }
.btn-dark:hover{ background:var(--gold); transform:translateY(-2px); }
.btn-ghost{ border-color:rgba(255,255,255,.55); color:#fff; }
.btn-ghost:hover{ background:rgba(255,255,255,.14); border-color:#fff; transform:translateY(-2px); }
.btn-outline{ border-color:var(--ink); color:var(--ink); }
.btn-outline:hover{ background:var(--ink); color:#fff; transform:translateY(-2px); }
.btn-row{ display:flex; gap:1rem; flex-wrap:wrap; }

/* ---------- Typo / Sections ---------- */
.section{ padding:clamp(4.2rem,9vh,7.5rem) clamp(1.2rem,4vw,3.2rem); max-width:1280px; margin:0 auto; }
.section.wide{ max-width:none; }
.kicker{ display:inline-flex; align-items:center; gap:.8rem; font-size:.62rem; letter-spacing:.42em; text-transform:uppercase; color:var(--gold-deep); margin-bottom:1.2rem; }
.kicker::before{ content:''; width:2.4rem; height:1px; background:var(--gold); }
.sec-title{ font-family:var(--display); font-weight:400; font-size:clamp(2.1rem,4.8vw,3.9rem); line-height:1.08; letter-spacing:.005em; margin-bottom:1.1rem; }
.sec-title .it{ font-family:var(--serif); font-style:italic; letter-spacing:0; }
.sec-lead{ font-size:clamp(.98rem,1.3vw,1.1rem); font-weight:300; color:var(--ink-soft); max-width:62ch; line-height:1.75; }
.sec-head{ margin-bottom:clamp(2.6rem,6vh,4rem); }
@media(min-width:1000px){
  .sec-head:not(.center){ display:grid; grid-template-columns:1.15fr .85fr; column-gap:clamp(2rem,5vw,5rem); align-items:end; }
  .sec-head:not(.center) .kicker{ grid-column:1/-1; }
  .sec-head:not(.center) .sec-title{ margin-bottom:0; }
  .sec-head:not(.center) .sec-lead{ padding-bottom:.5rem; }
}
.center{ text-align:center; }
.center .sec-lead{ margin-left:auto; margin-right:auto; }

/* ---------- Page-Hero (Unterseiten) ---------- */
.phero{ position:relative; min-height:56vh; display:flex; align-items:flex-end; overflow:hidden; }
.phero.tall{ min-height:100svh; }
.phero-bg{ position:absolute; inset:0; background-size:cover; background-position:center; transform:scale(1.08); animation:heroZoom 14s var(--ease) forwards; }
@keyframes heroZoom{ to{ transform:scale(1); } }
@media(prefers-reduced-motion:reduce){ .phero-bg{ animation:none; transform:none; } }
.phero-ov{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(15,11,6,.52) 0%, rgba(15,11,6,.12) 38%, rgba(8,6,2,.78) 100%); }
.phero-inner{ position:relative; z-index:2; width:100%; max-width:1280px; margin:0 auto; padding:clamp(7rem,16vh,10rem) clamp(1.2rem,4vw,3.2rem) clamp(3rem,8vh,5.5rem); color:#fff; text-shadow:0 2px 24px rgba(0,0,0,.5); }
.phero-inner .kicker{ color:var(--gold-soft); }
.phero-inner h1{ font-family:var(--display); font-weight:500; font-size:clamp(2.3rem,6vw,4.6rem); line-height:1.03; letter-spacing:-.01em; margin-bottom:1rem; }
.phero-inner h1 .it{ font-family:var(--serif); font-style:italic; }
.phero-inner p{ font-weight:300; max-width:56ch; color:rgba(255,252,245,.92); font-size:clamp(.98rem,1.4vw,1.15rem); line-height:1.65; }
.phero-inner .btn-row{ margin-top:2rem; }
.hero-list{ list-style:none; display:flex; flex-wrap:wrap; gap:.7rem 1.6rem; margin:1.6rem 0 0; }
.hero-list li{ font-size:.83rem; color:#fff; display:flex; align-items:center; gap:.55rem; }
.hero-list li::before{ content:''; width:7px; height:7px; transform:rotate(45deg); background:var(--gold-soft); flex-shrink:0; }
.hero-scroll{ position:absolute; left:50%; bottom:1.5rem; transform:translateX(-50%); z-index:3; display:flex; flex-direction:column; align-items:center; gap:.55rem; font-size:.56rem; letter-spacing:.3em; text-transform:uppercase; color:rgba(255,255,255,.8); }
.hero-scroll .ln{ width:1px; height:32px; background:linear-gradient(rgba(255,255,255,.7),transparent); animation:drop 2s var(--ease) infinite; }
@keyframes drop{ 0%{transform:scaleY(0);transform-origin:top;} 50%{transform:scaleY(1);transform-origin:top;} 51%{transform-origin:bottom;} 100%{transform:scaleY(0);transform-origin:bottom;} }

/* ---------- Stats: monumental, linksbündig, Haarlinien ---------- */
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(1.5rem,3vw,3rem); padding:clamp(3.2rem,8vh,5.5rem) clamp(1.2rem,4vw,3.2rem); max-width:1280px; margin:0 auto; }
.stat{ text-align:left; border-top:1px solid var(--line); padding-top:1.3rem; }
.s-num{ font-family:var(--display); font-weight:400; font-size:clamp(2.2rem,4.4vw,3.6rem); line-height:1; color:var(--ink); letter-spacing:.01em; }
.s-lbl{ font-size:.6rem; letter-spacing:.3em; text-transform:uppercase; color:var(--ink-faint); margin-top:.8rem; }
@media(max-width:760px){ .stats{ grid-template-columns:repeat(2,1fr); } }

/* ---------- Marquee ---------- */
.marquee{ overflow:hidden; border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft); padding:1rem 0; background:var(--cream); }
.marquee-track{ display:flex; gap:2.6rem; white-space:nowrap; width:max-content; animation:marq 36s linear infinite; }
.marquee-track span{ font-family:var(--serif); font-style:italic; font-size:1.05rem; color:var(--ink-soft); display:inline-flex; align-items:center; gap:2.6rem; }
.marquee-track i{ font-style:normal; color:var(--gold); font-size:.6rem; }
@keyframes marq{ to{ transform:translateX(-50%); } }
@media(prefers-reduced-motion:reduce){ .marquee-track{ animation:none; } }

/* ---------- Karten (Angebot) ---------- */
.res-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(1rem,1.8vw,1.6rem); }
.res-grid.two{ grid-template-columns:repeat(2,1fr); }
@media(max-width:1240px){ .res-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:820px){ .res-grid, .res-grid.two{ grid-template-columns:1fr; max-width:560px; margin-left:auto; margin-right:auto; } }
.res-card{ display:block; position:relative; border-radius:2px; overflow:hidden; aspect-ratio:4/4.4; background:var(--stone); transition:transform .45s var(--ease), box-shadow .45s var(--ease); }
.res-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow); }
.res-img{ position:absolute; inset:0; background-size:cover; background-position:center; transition:transform .8s var(--ease); }
.res-card:hover .res-img{ transform:scale(1.06); }
.res-grad{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,7,3,.06) 30%, rgba(10,7,3,.82) 100%); }
.res-badge{ position:absolute; top:1.1rem; left:1.1rem; z-index:2; font-size:.56rem; letter-spacing:.3em; text-transform:uppercase; font-weight:500; color:#fff; background:rgba(20,15,8,.55); border:1px solid rgba(216,189,140,.55); padding:.5rem .9rem .5rem 1.05rem; border-radius:0; -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
.res-body{ position:absolute; left:0; right:0; bottom:0; z-index:2; padding:1.3rem 1.3rem 1.2rem; color:#fff; }
.res-loc{ font-size:.6rem; letter-spacing:.26em; text-transform:uppercase; color:var(--gold-soft); margin-bottom:.4rem; }
.res-name{ font-family:var(--display); font-size:1.22rem; line-height:1.2; }
.res-meta{ font-size:.74rem; color:rgba(255,255,255,.78); margin-top:.35rem; }
.res-foot{ display:flex; align-items:center; justify-content:space-between; margin-top:.85rem; padding-top:.85rem; border-top:1px solid rgba(255,255,255,.22); }
.res-price{ font-family:var(--display); font-size:1.06rem; color:#fff; }
.res-view{ font-size:.62rem; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-soft); display:inline-flex; align-items:center; gap:.35rem; }

/* ---------- Wohnungsspiegel ---------- */
.spiegel{ overflow-x:auto; border:1px solid var(--line); border-radius:2px; background:#fff; box-shadow:0 24px 60px -44px rgba(60,48,28,.4); }
.units{ width:100%; border-collapse:collapse; min-width:760px; }
.units th{ font-size:.6rem; letter-spacing:.22em; text-transform:uppercase; color:var(--ink-faint); text-align:left; padding:1rem 1.1rem; border-bottom:1px solid var(--line); background:var(--bone); }
.units td{ padding:.9rem 1.1rem; border-bottom:1px solid var(--line-soft); font-size:.86rem; color:var(--ink-soft); }
.units tr:last-child td{ border-bottom:none; }
.units .u-name{ font-family:var(--display); font-size:1rem; color:var(--ink); }
.units .u-price{ font-weight:600; color:var(--ink); }
.units tr:hover td{ background:rgba(232,220,198,.25); }
.status{ display:inline-block; font-size:.58rem; letter-spacing:.16em; text-transform:uppercase; font-weight:600; padding:.34rem .7rem; border-radius:0; }
.status.frei{ background:rgba(184,148,90,.16); color:var(--gold-deep); border:1px solid rgba(184,148,90,.4); }
.status.reserviert{ background:rgba(39,35,29,.05); color:var(--ink-faint); border:1px solid var(--line); }
.status.verkauft{ background:rgba(39,35,29,.08); color:var(--ink-faint); border:1px solid transparent; text-decoration:line-through; }
.spiegel-note{ font-size:.72rem; color:var(--ink-faint); margin-top:1rem; }

/* ---------- Facts / Detailseiten ---------- */
.facts-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:.8rem; }
.fact{ background:#fff; border:1px solid var(--line-soft); border-radius:2px; padding:.9rem 1rem; }
.fk{ display:block; font-size:.58rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:.3rem; }
.fv{ font-family:var(--display); font-size:1.05rem; color:var(--ink); }
.feat-tags{ display:flex; flex-wrap:wrap; gap:.5rem; margin-top:1.4rem; }
.feat-tags span{ font-size:.68rem; letter-spacing:.06em; color:var(--ink-soft); border:1px solid var(--line); border-radius:0; padding:.45rem .85rem; background:#fff; }
.detail-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(1.6rem,3.5vw,3rem); align-items:start; }
@media(max-width:980px){ .detail-grid{ grid-template-columns:1fr; } }
.price-box{ background:var(--dark-2); color:#fff; border-radius:2px; padding:1.7rem 1.6rem; position:sticky; top:96px; }
.price-box .pb-lbl{ font-size:.6rem; letter-spacing:.28em; text-transform:uppercase; color:var(--gold-soft); }
.price-box .pb-price{ font-family:var(--display); font-size:2.1rem; margin:.5rem 0 .2rem; }
.price-box .pb-meta{ font-size:.78rem; color:rgba(255,255,255,.65); margin-bottom:1.2rem; }
.price-box .btn{ width:100%; justify-content:center; margin-bottom:.6rem; }
.price-box .pb-note{ font-size:.62rem; color:rgba(255,255,255,.42); margin-top:.6rem; }
.crumbs{ font-size:.66rem; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:1.2rem; display:flex; gap:.6rem; flex-wrap:wrap; }
.crumbs a:hover{ color:var(--gold-deep); }

/* ---------- Galerie ---------- */
.gal-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(.8rem,1.6vw,1.4rem); }
.gal-grid.four{ grid-template-columns:repeat(4,1fr); }
@media(max-width:980px){ .gal-grid, .gal-grid.four{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:560px){ .gal-grid, .gal-grid.four{ grid-template-columns:1fr; } }
.g-item{ position:relative; border-radius:2px; overflow:hidden; aspect-ratio:4/3; cursor:pointer; background:var(--stone); }
.g-item .gi{ position:absolute; inset:0; background-size:cover; background-position:center; transition:transform .8s var(--ease); }
.g-item:hover .gi{ transform:scale(1.07); }
.g-item .cap{ position:absolute; left:0; right:0; bottom:0; padding:2.2rem 1.1rem .9rem; background:linear-gradient(transparent, rgba(10,7,3,.72)); color:#fff; font-size:.78rem; letter-spacing:.04em; }
.lightbox{ position:fixed; inset:0; z-index:2000; background:rgba(15,11,5,.94); display:flex; align-items:center; justify-content:center; opacity:0; visibility:hidden; transition:opacity .4s var(--ease); padding:4vh 4vw; }
.lightbox.open{ opacity:1; visibility:visible; }
.lightbox img{ max-width:100%; max-height:100%; border-radius:2px; box-shadow:0 40px 120px rgba(0,0,0,.6); }
.lb-close{ position:absolute; top:1.2rem; right:1.6rem; font-size:2rem; color:#fff; line-height:1; padding:.4rem; }

/* ---------- Split / Bild-Text ---------- */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(1.8rem,4vw,3.6rem); align-items:center; }
@media(max-width:980px){ .split{ grid-template-columns:1fr; } }
.split-img{ border-radius:2px; overflow:hidden; aspect-ratio:4/3.4; background-size:cover; background-position:center; box-shadow:var(--shadow); }

/* ---------- Projekt-Blöcke ---------- */
.proj-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(1.2rem,2.4vw,2rem); }
@media(max-width:860px){ .proj-grid{ grid-template-columns:1fr; } }
.proj{ background:#fff; border:1px solid var(--line-soft); border-radius:2px; padding:1.8rem 1.7rem; }
.p-no{ font-family:var(--display); font-size:.95rem; color:var(--gold); margin-bottom:.9rem; }
.proj h4{ font-family:var(--display); font-weight:500; font-size:1.25rem; margin-bottom:.6rem; }
.proj p{ font-size:.9rem; color:var(--ink-soft); font-weight:300; line-height:1.7; }

/* ---------- Team ---------- */
.team-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1.2rem,2.4vw,2rem); }
@media(max-width:900px){ .team-grid{ grid-template-columns:1fr; max-width:560px; margin:0 auto; } }
.member{ display:flex; gap:1.1rem; background:#fff; border:1px solid var(--line-soft); border-radius:2px; padding:1.5rem 1.4rem; }
.ava{ width:54px; height:54px; flex-shrink:0; border-radius:50%; background:linear-gradient(135deg,var(--gold),var(--gold-deep)); color:#fff; display:flex; align-items:center; justify-content:center; font-family:var(--display); font-size:1.05rem; }
.member h4{ font-family:var(--display); font-weight:500; font-size:1.1rem; }
.member .role{ font-size:.62rem; letter-spacing:.22em; text-transform:uppercase; color:var(--gold-deep); margin:.25rem 0 .5rem; }
.member p{ font-size:.82rem; color:var(--ink-soft); font-weight:300; line-height:1.65; }

/* ---------- Rechner ---------- */
.calc{ background:#fff; border:1px solid var(--line); border-radius:2px; padding:1.7rem 1.6rem; box-shadow:0 24px 60px -44px rgba(60,48,28,.4); }
.calc h4{ font-family:var(--display); font-weight:500; font-size:1.3rem; margin-bottom:.3rem; }
.calc-sub{ font-size:.8rem; color:var(--ink-soft); margin-bottom:1.2rem; }
.calc-field{ margin-bottom:.9rem; }
.calc-field label{ display:block; font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:.4rem; }
.calc-input{ display:flex; align-items:center; border:1px solid var(--line); border-radius:2px; overflow:hidden; background:var(--bone); }
.calc-input .cur{ padding:.75rem .8rem; font-size:.72rem; color:var(--ink-faint); border-right:1px solid var(--line-soft); }
.calc-input input{ flex:1; border:none; background:none; padding:.75rem .9rem; font-family:var(--sans); font-size:.95rem; color:var(--ink); outline:none; min-width:0; }
.calc-row{ display:flex; justify-content:space-between; padding:.55rem 0; border-bottom:1px dashed var(--line-soft); font-size:.84rem; }
.calc-row .cl{ color:var(--ink-faint); }
.calc-row .cv{ font-weight:600; }
.calc-verdict{ margin-top:.9rem; font-family:var(--display); font-size:1.05rem; }
.calc-verdict.ok{ color:#5d7a3f; } .calc-verdict.warn{ color:#a3542e; }
.calc-note{ font-size:.62rem; color:var(--ink-faint); margin-top:.8rem; line-height:1.6; }

/* ---------- CTA-Band ---------- */
.cta-band{ position:relative; overflow:hidden; background:var(--dark-2); }
.cta-band .cb-bg{ position:absolute; inset:0; background-size:cover; background-position:center; opacity:.25; }
.cta-band .cb-in{ position:relative; z-index:2; max-width:1280px; margin:0 auto; padding:clamp(4rem,9vh,7rem) clamp(1.2rem,4vw,3.2rem); text-align:center; color:#fff; }
.cta-band .kicker{ color:var(--gold-soft); }
.cta-band h2{ font-family:var(--display); font-weight:500; font-size:clamp(1.9rem,4.4vw,3.2rem); line-height:1.08; margin-bottom:1rem; }
.cta-band h2 .it{ font-family:var(--serif); font-style:italic; }
.cta-band p{ color:rgba(255,252,245,.78); font-weight:300; max-width:56ch; margin:0 auto 2rem; }
.cta-band .btn-row{ justify-content:center; }

/* ---------- Formular ---------- */
.contact-grid{ display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(1.8rem,4vw,3.6rem); align-items:start; }
@media(max-width:980px){ .contact-grid{ grid-template-columns:1fr; } }
.c-lbl{ display:block; font-size:.6rem; letter-spacing:.26em; text-transform:uppercase; color:var(--gold-deep); margin:1.4rem 0 .35rem; }
.c-line{ display:block; font-size:.95rem; color:var(--ink-soft); }
.form{ background:#fff; border:1px solid var(--line); border-radius:2px; padding:1.8rem 1.7rem; box-shadow:0 24px 60px -44px rgba(60,48,28,.4); display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
@media(max-width:640px){ .form{ grid-template-columns:1fr; } }
.field{ display:flex; flex-direction:column; }
.field.full{ grid-column:1/-1; }
.field label{ font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:.4rem; }
.field input, .field select, .field textarea{ border:1px solid var(--line); border-radius:2px; background:var(--bone); padding:.8rem .9rem; font-family:var(--sans); font-size:.92rem; color:var(--ink); outline:none; transition:border .3s; }
.field input:focus, .field select:focus, .field textarea:focus{ border-color:var(--gold); }
.field textarea{ min-height:110px; resize:vertical; }
.form .submit{ grid-column:1/-1; }
.form-success{ display:none; grid-column:1/-1; background:rgba(93,122,63,.1); border:1px solid rgba(93,122,63,.3); color:#4c6534; border-radius:2px; padding:.9rem 1rem; font-size:.85rem; }
.form-success.show{ display:block; }
.discretion{ grid-column:1/-1; font-size:.68rem; color:var(--ink-faint); display:flex; align-items:center; gap:.5rem; }

/* ---------- Footer ---------- */
.footer{ background:var(--dark); color:rgba(255,252,245,.75); margin-top:0; }
.foot-top{ max-width:1280px; margin:0 auto; padding:clamp(3.2rem,7vh,5rem) clamp(1.2rem,4vw,3.2rem) 2.4rem; display:grid; grid-template-columns:1.2fr 2fr; gap:clamp(2rem,5vw,4rem); }
@media(max-width:900px){ .foot-top{ grid-template-columns:1fr; } }
.foot-brand{ font-family:var(--display); letter-spacing:.26em; font-size:1.15rem; color:#fff; margin-bottom:.9rem; }
.foot-tag{ font-size:.84rem; font-weight:300; line-height:1.7; color:rgba(255,252,245,.6); max-width:38ch; }
.foot-cols{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.6rem; }
@media(max-width:640px){ .foot-cols{ grid-template-columns:1fr 1fr; } }
.foot-col h5{ font-size:.62rem; letter-spacing:.26em; text-transform:uppercase; color:var(--gold-soft); margin-bottom:1rem; font-weight:600; }
.foot-col a{ display:block; font-size:.84rem; color:rgba(255,252,245,.65); padding:.28rem 0; transition:color .3s; }
.foot-col a:hover{ color:#fff; }
.foot-bot{ border-top:1px solid rgba(255,255,255,.1); }
.foot-bot-in{ max-width:1280px; margin:0 auto; padding:1.3rem clamp(1.2rem,4vw,3.2rem); display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; font-size:.7rem; color:rgba(255,252,245,.4); }
.foot-bot-in a:hover{ color:#fff; }

/* ---------- Legal ---------- */
.legal{ max-width:820px; margin:0 auto; padding:clamp(8rem,16vh,11rem) clamp(1.2rem,4vw,3.2rem) clamp(4rem,9vh,6rem); }
.legal h1{ font-family:var(--display); font-weight:500; font-size:clamp(2rem,4.6vw,3rem); margin-bottom:1.6rem; }
.legal h2{ font-family:var(--display); font-weight:500; font-size:1.35rem; margin:2.2rem 0 .7rem; }
.legal p, .legal li{ font-size:.92rem; color:var(--ink-soft); font-weight:300; line-height:1.75; }
.legal ul{ padding-left:1.2rem; }

/* ---------- 3D-Sektion ---------- */
.t3d{ position:relative; padding:clamp(4.5rem,9vh,8rem) clamp(1.2rem,4vw,3.2rem); background:radial-gradient(120% 90% at 78% 0%, #3a3122 0%, #241d12 44%, #17120a 100%); overflow:hidden; }
.t3d::before{ content:''; position:absolute; inset:0; background:radial-gradient(60% 40% at 20% 100%, rgba(184,148,90,.14), transparent 70%); pointer-events:none; }
.t3d .sec-head{ position:relative; z-index:2; max-width:1180px; margin:0 auto 2.6rem; }
.t3d .kicker{ color:var(--gold-soft); }
.t3d .sec-title{ color:#fff; }
.t3d .sec-lead{ color:rgba(255,252,245,.72); }
.t3d-wrap{ position:relative; z-index:2; max-width:1280px; margin:0 auto; display:grid; grid-template-columns:1fr 350px; gap:clamp(1.2rem,2.4vw,2rem); align-items:stretch; }
.t3d-stage{ position:relative; border-radius:2px; overflow:hidden; min-height:560px; background:linear-gradient(180deg,#c9d6e4 0%,#e8d9bd 58%,#caa97a 100%); box-shadow:0 40px 90px -40px rgba(0,0,0,.7), inset 0 0 0 1px rgba(255,255,255,.14); }
.t3d-stage canvas{ position:absolute; inset:0; width:100%; height:100%; display:block; touch-action:pan-y; }
.t3d-stage.grabbing canvas{ cursor:grabbing; }
.t3d-tip{ position:absolute; z-index:5; pointer-events:none; transform:translate(-50%,-130%); background:rgba(22,17,9,.88); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); border:1px solid rgba(216,189,140,.4); color:#fff; border-radius:2px; padding:.55rem .85rem; font-size:.72rem; letter-spacing:.03em; opacity:0; transition:opacity .25s var(--ease); white-space:nowrap; }
.t3d-tip .tp{ color:var(--gold-soft); font-weight:600; margin-left:.5rem; }
.t3d-tip.on{ opacity:1; }
.t3d-hud{ position:absolute; left:0; right:0; bottom:0; z-index:4; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.9rem 1.2rem; background:linear-gradient(transparent, rgba(15,11,5,.55)); pointer-events:none; }
.t3d-hint{ display:inline-flex; align-items:center; gap:.5rem; font-size:.62rem; letter-spacing:.22em; text-transform:uppercase; color:rgba(255,255,255,.85); }
.t3d-legend{ display:flex; gap:1rem; }
.t3d-legend span{ display:inline-flex; align-items:center; gap:.42rem; font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.8); }
.lg{ display:inline-block; width:10px; height:10px; border-radius:3px; }
.lg-frei{ background:#e3b96a; box-shadow:0 0 8px rgba(227,185,106,.9); }
.lg-res{ background:#efe7d8; opacity:.75; }
.lg-sold{ background:#8d8168; }
.t3d-load{ position:absolute; inset:0; z-index:6; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1rem; background:linear-gradient(180deg,#2b2416,#1b150c); transition:opacity .7s var(--ease); }
.t3d-load.done{ opacity:0; pointer-events:none; }
.t3d-load span{ font-family:var(--display); letter-spacing:.3em; font-size:.8rem; text-transform:uppercase; color:var(--gold-soft); padding-left:.3em; }
.t3d-load i{ width:150px; height:1px; background:rgba(255,255,255,.15); position:relative; overflow:hidden; }
.t3d-load i::after{ content:''; position:absolute; left:-40%; top:0; height:100%; width:40%; background:var(--gold-soft); animation:t3dLd 1.1s linear infinite; }
@keyframes t3dLd{ to{ left:100%; } }
.t3d-panel{ display:flex; flex-direction:column; background:rgba(255,251,242,.06); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); border:1px solid rgba(216,189,140,.22); border-radius:2px; padding:1.6rem 1.5rem; color:#fff; }
.t3d-avail{ display:inline-flex; align-items:center; gap:.55rem; font-size:.64rem; letter-spacing:.24em; text-transform:uppercase; color:var(--gold-soft); margin-bottom:.9rem; }
.t3d-avail .dot{ width:8px; height:8px; border-radius:50%; background:#e3b96a; box-shadow:0 0 10px rgba(227,185,106,.9); animation:t3dPulse 2s var(--ease) infinite; }
@keyframes t3dPulse{ 0%,100%{ transform:scale(1); opacity:1; } 50%{ transform:scale(1.35); opacity:.7; } }
.t3d-title{ font-family:var(--display); font-weight:500; font-size:1.35rem; line-height:1.15; margin-bottom:1.1rem; }
.t3d-list{ display:flex; flex-direction:column; gap:.55rem; margin-bottom:1.1rem; }
.t3d-item{ text-align:left; border:1px solid rgba(255,255,255,.14); border-radius:2px; padding:.85rem 1rem; transition:all .35s var(--ease); background:rgba(255,255,255,.03); }
.t3d-item:hover{ border-color:rgba(216,189,140,.55); background:rgba(216,189,140,.08); }
.t3d-item.active{ border-color:var(--gold-soft); background:rgba(216,189,140,.14); box-shadow:0 10px 30px -18px rgba(216,189,140,.6); }
.t3d-item .n{ font-size:.86rem; font-weight:500; display:flex; justify-content:space-between; gap:.6rem; }
.t3d-item .n b{ font-weight:600; color:var(--gold-soft); white-space:nowrap; }
.t3d-item .m{ font-size:.7rem; color:rgba(255,255,255,.62); margin-top:.25rem; letter-spacing:.02em; }
.t3d-detail{ border-top:1px solid rgba(216,189,140,.25); padding-top:1.1rem; margin-top:.2rem; }
.t3d-d-name{ font-family:var(--display); font-size:1.12rem; }
.t3d-d-meta{ font-size:.74rem; color:rgba(255,255,255,.66); margin-top:.3rem; }
.t3d-d-price{ font-family:var(--display); font-size:1.5rem; color:var(--gold-soft); margin:.7rem 0 1rem; }
.t3d-d-ctas{ display:flex; flex-direction:column; gap:.55rem; }
.t3d-cta{ display:inline-flex; align-items:center; justify-content:center; gap:.5rem; font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; font-weight:600; padding:.9rem 1.2rem; border-radius:0; transition:all .4s var(--ease); }
.t3d-cta.gold{ background:var(--gold); color:#fff; }
.t3d-cta.gold:hover{ background:var(--gold-deep); transform:translateY(-2px); box-shadow:0 14px 34px -14px rgba(184,148,90,.8); }
.t3d-cta.ghost{ border:1px solid rgba(255,255,255,.4); color:#fff; }
.t3d-cta.ghost:hover{ border-color:#fff; background:rgba(255,255,255,.1); }
.t3d-note{ margin-top:auto; padding-top:1rem; font-size:.62rem; letter-spacing:.06em; color:rgba(255,255,255,.42); }
@media(max-width:1040px){
  .t3d-wrap{ grid-template-columns:1fr; }
  .t3d-stage{ min-height:56vh; }
  .t3d-hud{ flex-direction:column; align-items:flex-start; gap:.5rem; }
}

/* ---------- Scrollgesteuerte Hero-Sequenz ---------- */
.xps{ display:none; position:relative; height:1100vh; background:#0d0a06; }
body.xps-on .xps{ display:block; }
body.xps-on .hero-static{ display:none; }
.xps-sticky{ position:sticky; top:0; height:100vh; height:100svh; overflow:hidden; background:#0d0a06; }
.xps-video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.xps-poster{ position:absolute; inset:0; background-size:cover; background-position:center; transition:opacity 1s var(--ease); }
.xps-poster.hide{ opacity:0; }
.xps-tint{ position:absolute; inset:0; background:radial-gradient(70% 60% at 50% 44%, rgba(8,6,2,.14), rgba(8,6,2,0) 70%), linear-gradient(180deg, rgba(10,7,3,.5) 0%, rgba(10,7,3,.06) 30%, rgba(10,7,3,.12) 62%, rgba(8,6,2,.7) 100%); }
.xps-stage{ position:absolute; inset:0; pointer-events:none; }
.xps-scene{ position:absolute; left:0; right:0; bottom:clamp(4.5rem,13vh,9rem); padding:0 clamp(1.4rem,6vw,7rem); max-width:1160px; margin:0 auto; color:#fff; opacity:0; transform:translateY(30px); text-shadow:0 2px 28px rgba(0,0,0,.55); will-change:opacity,transform; }
.xps-scene.mid{ top:0; bottom:0; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; }
.xps-scene .kicker{ color:var(--gold-soft); margin-bottom:1.1rem; }
.xps-h{ font-family:var(--display); font-weight:500; font-size:clamp(2.4rem,6.6vw,5.6rem); line-height:1.02; letter-spacing:-.012em; }
.xps-h .it{ font-family:var(--serif); font-style:italic; }
.xps-sub{ font-size:clamp(1rem,1.4vw,1.2rem); font-weight:300; line-height:1.65; margin-top:1.1rem; max-width:46ch; color:rgba(255,252,245,.94); }
.xps-scene.mid .xps-sub{ margin-left:auto; margin-right:auto; }
.xps-facts{ list-style:none; display:flex; gap:.7rem 1.7rem; flex-wrap:wrap; margin-top:1.4rem; }
.xps-scene.mid .xps-facts{ justify-content:center; }
.xps-facts li{ font-size:.82rem; color:#fff; display:flex; align-items:center; gap:.55rem; }
.xps-facts li::before{ content:''; width:7px; height:7px; transform:rotate(45deg); background:var(--gold-soft); flex-shrink:0; }
.xps-scene .btn-row{ margin-top:2rem; pointer-events:auto; justify-content:center; }
.xps-progress{ position:absolute; left:0; bottom:0; width:100%; height:2px; background:rgba(255,255,255,.14); }
.xps-progress i{ display:block; height:100%; width:0%; background:var(--gold-soft); }
.xps-hint{ position:absolute; left:50%; bottom:1.6rem; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:.55rem; font-size:.56rem; letter-spacing:.3em; text-transform:uppercase; color:rgba(255,255,255,.85); transition:opacity .5s; }
.xps-hint .ln{ width:1px; height:32px; background:linear-gradient(rgba(255,255,255,.7),transparent); animation:drop 2s var(--ease) infinite; }
.xps-load{ position:absolute; right:1.4rem; bottom:1.4rem; display:flex; align-items:center; gap:.6rem; font-size:.58rem; letter-spacing:.24em; text-transform:uppercase; color:rgba(255,255,255,.75); transition:opacity .6s; }
.xps-load i{ width:60px; height:1px; background:rgba(255,255,255,.2); position:relative; overflow:hidden; display:block; }
.xps-load i::after{ content:''; position:absolute; left:0; top:0; height:100%; width:var(--p,0%); background:var(--gold-soft); }
.xps-load.done{ opacity:0; }

/* Nav über dunkler Sequenz transparent halten */
.nav.dark-hold{ background:transparent !important; box-shadow:none !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; }
.nav.dark-hold .brand, .nav.dark-hold .nav-links a{ color:#fff !important; }
.nav.dark-hold .brand small{ color:var(--gold-soft) !important; }
.nav.dark-hold .nav-cta{ color:#fff !important; border-color:rgba(255,255,255,.6) !important; }
.nav.dark-hold .nav-burger span{ background:#fff !important; }

/* ---------- Scroll-Fortschritt (global) ---------- */
.scroll-progress{ position:fixed; top:0; left:0; height:2px; width:0%; background:linear-gradient(90deg,var(--gold),var(--gold-soft)); z-index:1200; pointer-events:none; }

/* ---------- Sticky-CTA ---------- */
.sticky-cta{ position:fixed; right:clamp(1rem,2.4vw,1.8rem); bottom:clamp(1rem,2.4vw,1.8rem); z-index:1100; display:inline-flex; align-items:center; gap:.55rem; background:var(--ink); color:#fff; font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; font-weight:600; padding:.95rem 1.5rem; border-radius:0; box-shadow:0 22px 50px -18px rgba(23,18,10,.65); opacity:0; visibility:hidden; transform:translateY(14px); transition:all .5s var(--ease); }
.sticky-cta .dot{ width:7px; height:7px; border-radius:50%; background:#e3b96a; box-shadow:0 0 8px rgba(227,185,106,.9); animation:t3dPulse 2s var(--ease) infinite; }
.sticky-cta.show{ opacity:1; visibility:visible; transform:none; }
.sticky-cta:hover{ background:var(--gold); transform:translateY(-2px); }

/* ---------- Premium-Reveals (Mask statt simplem Fade) ---------- */
.split-img.r, .g-item.r{ clip-path:inset(10% 6% 10% 6% round 2px); transform:translateY(26px) scale(1.03); transition:clip-path 1.1s var(--ease), transform 1.1s var(--ease), opacity .9s var(--ease); }
.split-img.r.vis, .g-item.r.vis{ clip-path:inset(0 0 0 0 round 2px); transform:none; }
h2.sec-title.r, h1.sec-title.r{ clip-path:inset(0 0 100% 0); transform:translateY(34px); transition:clip-path 1s var(--ease), transform 1s var(--ease), opacity .8s var(--ease); }
h2.sec-title.r.vis, h1.sec-title.r.vis{ clip-path:inset(0 0 -8% 0); transform:none; }
@media(prefers-reduced-motion:reduce){
  .split-img.r, .g-item.r, h2.sec-title.r, h1.sec-title.r{ clip-path:none; transform:none; transition:none; }
}

/* Parallax-Layer (JS setzt transform) */
[data-plx]{ will-change:transform; }

/* ---------- Preloader ---------- */
#preloader{ position:fixed; inset:0; z-index:9999; background:radial-gradient(120% 120% at 70% 20%,#fff7e9,#f3ead9 45%,#e7d8bd); display:flex; align-items:center; justify-content:center; flex-direction:column; transition:opacity .9s var(--ease), visibility .9s var(--ease); }
#preloader.done{ opacity:0; visibility:hidden; }
.pl-word{ font-family:var(--display); font-weight:500; letter-spacing:.34em; font-size:clamp(1.1rem,3.4vw,1.8rem); color:var(--ink); padding-left:.34em; animation:plIn 1.1s var(--ease) both; }
.pl-line{ margin-top:1.3rem; width:min(220px,58vw); height:1px; background:rgba(26,21,13,.14); position:relative; overflow:hidden; }
.pl-line i{ position:absolute; left:0; top:0; height:100%; width:0%; background:var(--gold); transition:width .3s; }
@keyframes plIn{ from{ opacity:0; transform:translateY(14px);} to{ opacity:1; transform:none;} }

/* ============================================================
   High-End-Pass: Marcellus führt nur ein Gewicht (400).
   Alle Display-Elemente explizit auf 400, kein Faux-Bold.
   ============================================================ */
.sec-title, .res-name, .res-price, .phero-inner h1, .xps-h, .t3d-title, .t3d-d-name, .t3d-d-price,
.calc h4, .price-box .pb-price, .s-num, .brand, .pl-word, .foot-brand, .proj h4, .member h4,
.legal h1, .legal h2, .cta-band h2, .units .u-name, .fv{ font-weight:400; }

/* Nav: leiser, breiter gesperrt */
.nav-links a{ font-size:.64rem; letter-spacing:.3em; }
.nav-links{ gap:2.2rem; }
.brand{ letter-spacing:.3em; }

/* Preise monumental */
.price-box .pb-price{ font-size:clamp(2rem,3vw,2.6rem); letter-spacing:.01em; }
.res-price{ font-size:1.12rem; }

/* Karten: Haarlinie statt schwebender Schatten im Ruhezustand */
.proj, .member, .calc, .fact, .form{ box-shadow:none; }
.proj:hover, .member:hover{ border-color:var(--line); }

/* Feature-Tags: eckig, luftiger */
.feat-tags span{ padding:.5rem 1rem; letter-spacing:.12em; text-transform:uppercase; font-size:.6rem; }

/* Formulareingaben: ruhige Linienführung */
.field input, .field select, .field textarea, .calc-input{ border-radius:0; }
.calc-input .cur{ letter-spacing:.1em; }

/* Statuschips im Wohnungsspiegel: typografisch statt Pill */
.status{ border-radius:0; letter-spacing:.24em; padding:.4rem .75rem; }

/* Galerie-Captions: Label-Stil */
.g-item .cap{ font-size:.64rem; letter-spacing:.22em; text-transform:uppercase; }

/* Hero-Listen: feiner */
.hero-list li::before, .xps-facts li::before{ width:5px; height:5px; }

/* Sticky-CTA: architektonisch statt Pill */
.sticky-cta{ border-radius:0; border:1px solid rgba(216,189,140,.4); letter-spacing:.24em; font-weight:500; padding:1rem 1.6rem; }

/* Marquee in Garamond-Kursive */
.marquee-track span{ font-size:1.15rem; letter-spacing:.02em; }

/* Grosse Displays auf Dunkel: mehr Luft in der Zeile */
.cta-band h2, .t3d .sec-title, .xps-h{ line-height:1.12; }

/* Zentrierte Kontexte: Kicker ohne führende Linie (Balance) */
.xps-scene.mid .kicker::before, .center .kicker::before, .cta-band .kicker::before{ display:none; }
.xps-scene.mid .kicker, .center .kicker, .cta-band .kicker{ gap:0; }

/* ============================================================
   Scroll-Film-Kapitel (K2 „Der Weg hinein", K3 „Die Wohnung")
   Desktop: 260vh Scrub-Strecke. Mobile/Fallback: statische Kino-Tafel.
   ============================================================ */
.chap{ position:relative; height:100svh; background:#0d0a06; }
.chap.chap-on{ height:780vh; } /* 15s-Filme: gleiches Scrub-Tempo wie der 15s-Aussenhero */
#kap2.chap-on{ height:990vh; } /* Kapitel 2 = 6-Raum-Tour (~19s), längere Scroll-Strecke fürs gleiche Tempo */
.chap-sticky{ position:sticky; top:0; height:100vh; height:100svh; overflow:hidden; background:#0d0a06; }
.chap video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.chap-poster{ position:absolute; inset:0; background-size:cover; background-position:center; transition:opacity 1s var(--ease); }
.chap-poster.hide{ opacity:0; }
.chap-tint{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,7,3,.42) 0%, rgba(10,7,3,.05) 32%, rgba(10,7,3,.1) 62%, rgba(8,6,2,.6) 100%); }
.chap-text{ position:absolute; left:0; right:0; bottom:clamp(4rem,12vh,8rem); padding:0 clamp(1.4rem,6vw,7rem); max-width:1160px; margin:0 auto; color:#fff; text-shadow:0 2px 26px rgba(0,0,0,.55); }
.chap-text .kicker{ color:var(--gold-soft); }
.chap-text h2{ font-family:var(--display); font-weight:400; font-size:clamp(2.2rem,5.6vw,4.6rem); line-height:1.06; }
.chap-text h2 .it{ font-family:var(--serif); font-style:italic; }
.chap-text p{ font-size:clamp(.98rem,1.35vw,1.15rem); font-weight:300; line-height:1.65; margin-top:1rem; max-width:48ch; color:rgba(255,252,245,.94); }
.chap-progress{ position:absolute; left:0; bottom:0; width:100%; height:2px; background:rgba(255,255,255,.14); opacity:0; transition:opacity .6s; }
.chap.chap-live .chap-progress{ opacity:1; }
.chap-progress i{ display:block; height:100%; width:0%; background:var(--gold-soft); }
/* Mobile/ohne Scrub: Text immer sichtbar */
.chap:not(.chap-on) .chap-text{ opacity:1 !important; transform:none !important; }

/* ============================================================
   VOLLAUSBAU-PASS (Audit 2026-07): Barrierefreiheit, Kontraste,
   Conversion-Zustände, Lightbox-Navigation, Mobile-Feinschliff.
   Bewusst als Override-Block am Ende — Basis bleibt unangetastet.
   ============================================================ */

/* --- Tastatur-Fokus: Haarlinien-Ring im Systemstil --- */
:focus-visible{ outline:1px solid var(--gold-deep); outline-offset:3px; border-radius:0; }
.footer :focus-visible, .t3d :focus-visible, .cta-band :focus-visible,
.lightbox :focus-visible, .price-box :focus-visible, .nav.dark-hold :focus-visible,
.xps :focus-visible, .chap :focus-visible{ outline-color:var(--gold-soft); }
.field input:focus-visible, .field select:focus-visible, .field textarea:focus-visible,
.calc-input input:focus-visible{ outline:none; box-shadow:0 0 0 1px var(--gold-deep); border-color:var(--gold-deep); }

/* --- Kontraste: Labels tragen über Grösse/Sperrung, nicht über Blässe --- */
.kicker{ color:var(--ink-soft); }
.s-lbl, .units th, .spiegel-note, .fk, .crumbs, .field label,
.calc-row .cl, .calc-field label, .calc-note, .status.reserviert{ color:var(--ink-soft); }
.member .role, .c-lbl{ color:var(--ink-soft); }
.p-no{ color:var(--gold-deep); }
.brand small{ font-size:.56rem; }
.foot-bot-in{ color:rgba(255,252,245,.58); }

/* --- Gold-CTAs: dunkle Schrift auf Messing (6.8:1) statt Weiss (2.8:1) --- */
.btn-gold{ color:var(--dark); }
.btn-gold:hover{ background:var(--gold-soft); color:var(--dark); }
.t3d-cta.gold{ color:var(--dark); font-weight:600; }
.t3d-cta.gold:hover{ background:var(--gold-soft); color:var(--dark); }
.nav-cta:hover{ background:var(--gold-soft); border-color:var(--gold-soft); color:var(--dark) !important; }

/* --- Monogramm-Kacheln statt Gold-Verlauf-Kreis --- */
.ava{ border-radius:2px; background:var(--dark-2); color:var(--gold-soft); border:1px solid rgba(184,148,90,.45); letter-spacing:.08em; }

/* --- Wohnungsspiegel: Haarlinie statt Dauerschatten, erste Spalte fixiert --- */
.spiegel{ box-shadow:none; }
.units th:first-child, .units td:first-child{ position:sticky; left:0; background:#fff; z-index:2; }
.units th:first-child{ background:var(--bone); }
.units tr:hover td:first-child{ background:#fff; }
.spiegel-hint{ display:none; font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-soft); margin-top:.7rem; }
@media(max-width:900px){ .spiegel-hint{ display:block; } }
.u-link{ font-size:.62rem; letter-spacing:.18em; text-transform:uppercase; color:var(--gold-deep); white-space:nowrap; border-bottom:1px solid rgba(154,122,68,.4); padding-bottom:.1rem; }
.u-link:hover{ color:var(--ink); border-color:var(--ink); }

/* --- Legende-Swatch ins Kantenraster --- */
.lg{ border-radius:0; }

/* --- 3D-Sektion: Kopf und Bühne fluchten --- */
.t3d .sec-head{ max-width:1280px; }

/* --- Filmtexte auf das Section-Raster (ein Gutter-System) --- */
.xps-scene, .chap-text{ padding:0 clamp(1.2rem,4vw,3.2rem); max-width:1280px; }

/* --- Formular: Fehler- und Erfolgs-Zustände, Consent, Honeypot --- */
.field.error input, .field.error select, .field.error textarea{ border-color:#a3542e; background:rgba(163,84,46,.05); }
.field .f-err{ display:none; font-size:.68rem; color:#a3542e; margin-top:.35rem; letter-spacing:.03em; }
.field.error .f-err{ display:block; }
.form-error{ display:none; grid-column:1/-1; background:rgba(163,84,46,.08); border:1px solid rgba(163,84,46,.35); color:#8a4526; border-radius:2px; padding:.9rem 1rem; font-size:.85rem; }
.form-error.show{ display:block; }
.consent{ grid-column:1/-1; display:flex; align-items:flex-start; gap:.65rem; font-size:.8rem; color:var(--ink-soft); line-height:1.55; }
.consent input{ margin-top:.25rem; width:15px; height:15px; accent-color:var(--gold-deep); flex-shrink:0; }
.consent a{ border-bottom:1px solid var(--gold); transition:color .3s; }
.consent a:hover{ color:var(--gold-deep); }
.consent.error{ color:#a3542e; }
.hp-field{ position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden; }
.btn[disabled]{ opacity:.5; pointer-events:none; }

/* --- Kontakt-Links als erkennbare Links --- */
.c-line a{ border-bottom:1px solid var(--line); transition:color .3s, border-color .3s; }
.c-line a:hover{ color:var(--gold-deep); border-color:var(--gold); }

/* --- Lightbox: Navigation, Caption, Zähler --- */
.lightbox figure{ position:relative; margin:0; max-width:100%; max-height:100%; display:flex; flex-direction:column; align-items:center; gap:.9rem; }
.lightbox img{ max-height:82vh; }
.lb-cap{ font-size:.66rem; letter-spacing:.24em; text-transform:uppercase; color:rgba(255,252,245,.85); text-align:center; }
.lb-cap .lb-count{ color:var(--gold-soft); margin-left:.9rem; letter-spacing:.14em; }
.lb-prev, .lb-next{ position:absolute; top:50%; transform:translateY(-50%); z-index:3; width:52px; height:52px; display:flex; align-items:center; justify-content:center; color:#fff; font-size:1.5rem; line-height:1; border:1px solid rgba(255,255,255,.28); background:rgba(15,11,5,.35); transition:all .35s var(--ease); }
.lb-prev{ left:1rem; } .lb-next{ right:1rem; }
.lb-prev:hover, .lb-next:hover{ border-color:var(--gold-soft); color:var(--gold-soft); background:rgba(15,11,5,.6); }
.lb-close:hover{ color:var(--gold-soft); }
@media(max-width:640px){ .lb-prev{ left:.4rem; } .lb-next{ right:.4rem; } .lb-prev,.lb-next{ width:44px; height:44px; } }

/* --- Mobile-Menü: Scroll-Lock, sauberes Verstecken, Sticky-CTA weicht --- */
body.menu-open{ overflow:hidden; }
body.menu-open .sticky-cta{ opacity:0; visibility:hidden; }
@media(max-width:1080px){
  .nav-links{ visibility:hidden; transition:transform .6s var(--ease), visibility 0s .6s; }
  .nav-links.open{ visibility:visible; transition:transform .6s var(--ease), visibility 0s 0s; }
  .nav-links a{ padding:.6rem 0; }
}

/* --- Touch-Ziele --- */
.nav-burger{ padding:12px; }
.crumbs a{ display:inline-block; padding:.45rem 0; margin:-.45rem 0; }
.foot-col a{ padding:.45rem 0; }
.t3d-cta{ padding:1.05rem 1.2rem; }

/* --- Sticky-CTA: Safe-Area, Footer-Kollision --- */
.sticky-cta{ bottom:calc(clamp(1rem,2.4vw,1.8rem) + env(safe-area-inset-bottom, 0px)); }
@media(max-width:760px){ .foot-bot-in{ padding-bottom:5.4rem; } }

/* --- Projekt-Film (echtes Drohnenmaterial) --- */
.video-frame{ position:relative; border-radius:2px; overflow:hidden; box-shadow:var(--shadow); background:var(--dark); }
.video-frame video{ width:100%; display:block; }
.video-note{ font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--ink-soft); margin-top:.9rem; }

/* --- 3D auf Touch: erst auf Wunsch laden (11 MB) --- */
.t3d-start{ position:absolute; inset:0; z-index:7; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1.1rem; background:linear-gradient(180deg, rgba(43,36,22,.86), rgba(27,21,12,.92)); text-align:center; padding:1.4rem; }
.t3d-start p{ font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,252,245,.8); max-width:30ch; line-height:1.8; }
.t3d-start .t3d-start-btn{ border:1px solid rgba(216,189,140,.55); color:var(--gold-soft); font-size:.7rem; letter-spacing:.26em; text-transform:uppercase; padding:1.05rem 1.8rem; transition:all .4s var(--ease); }
.t3d-start .t3d-start-btn:hover{ background:rgba(216,189,140,.12); border-color:var(--gold-soft); }

/* --- Lage: Inline-Grid ersetzt durch Systemklasse --- */
.stats.inline{ border:none; padding:2.4rem 0 0; max-width:none; grid-template-columns:repeat(3,1fr); }
@media(max-width:760px){ .stats.inline{ grid-template-columns:repeat(3,1fr); gap:1.2rem; } }
@media(max-width:420px){ .stats.inline{ grid-template-columns:1fr 1fr; } }

/* --- iOS: 16px-Inputs gegen Auto-Zoom --- */
@media(max-width:900px){
  .field input, .field select, .field textarea, .calc-input input{ font-size:1rem; }
}

/* --- reduced-motion: verbleibende autonome Animationen aus --- */
@media(prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  .hero-scroll .ln, .xps-hint .ln{ animation:none; }
  .t3d-avail .dot, .sticky-cta .dot{ animation:none; }
}

/* --- svh-Fallback --- */
.phero.tall{ min-height:100vh; min-height:100svh; }

/* --- Mobile-Typografie: Lesbarkeit unter 600/420px --- */
@media(max-width:600px){
  .kicker{ font-size:.66rem; letter-spacing:.34em; }
  .fk, .s-lbl, .res-badge{ font-size:.62rem; }
  .pb-note, .calc-note, .t3d-note{ font-size:.7rem; }
}
@media(max-width:420px){
  .phero-inner h1{ font-size:2rem; }
  .s-num{ font-size:1.9rem; }
  .stats{ gap:1.2rem 1rem; }
  .btn{ padding:.95rem 1.4rem; letter-spacing:.2em; }
  .sec-title{ font-size:1.9rem; }
}
.phero-inner h1, .sec-title, .chap-text h2, .cta-band h2{ hyphens:auto; -webkit-hyphens:auto; }

/* --- Plan-Animation (2D-Grundriss → 3D-Modell) --- */
.planvid{ max-width:600px; margin:0 auto; border-radius:16px; overflow:hidden; border:1px solid rgba(201,164,92,.32); box-shadow:0 34px 90px -34px rgba(0,0,0,.7); background:#efe9dd; }
.planvid video{ display:block; width:100%; height:auto; }
.planvid-note{ text-align:center; font-size:.62rem; letter-spacing:.24em; text-transform:uppercase; color:var(--ink-soft); margin-top:1.1rem; }
.planvid.r{ clip-path:inset(6% 4% 6% 4% round 16px); transform:translateY(24px) scale(1.02); transition:clip-path 1.1s var(--ease), transform 1.1s var(--ease), opacity .9s var(--ease); }
.planvid.r.vis{ clip-path:inset(0 0 0 0 round 16px); transform:none; }
@media(prefers-reduced-motion:reduce){ .planvid.r{ clip-path:none; transform:none; } }

/* --- Plan leicht angeschraegt (nicht nur Draufsicht) --- */
.planvid.tilt{ transform-origin:center 64%; margin-top:1.6rem; margin-bottom:2.6rem; box-shadow:0 46px 96px -40px rgba(0,0,0,.78); }
.planvid.tilt.r{ transform:perspective(1600px) rotateX(21deg) translateY(30px) scale(1.04); }
.planvid.tilt.r.vis{ transform:perspective(1600px) rotateX(21deg) scale(1.04); }
@media(prefers-reduced-motion:reduce){ .planvid.tilt.r, .planvid.tilt.r.vis{ transform:perspective(1600px) rotateX(21deg) scale(1.04); } }

/* --- Raum-Legende zum Grundriss --- */
.planvid-legend{ list-style:none; max-width:640px; margin:1.7rem auto .2rem; display:grid; grid-template-columns:repeat(2,1fr); gap:.7rem 1.8rem; }
.planvid-legend li{ display:flex; align-items:flex-start; gap:.7rem; font-size:.92rem; color:var(--ink-soft); line-height:1.4; }
.planvid-legend .n{ flex:0 0 auto; width:1.6rem; height:1.6rem; border-radius:50%; background:var(--gold); color:var(--dark); font-size:.82rem; font-weight:600; display:flex; align-items:center; justify-content:center; margin-top:.05rem; }
.planvid-legend b{ color:var(--ink); font-weight:600; }
@media(max-width:640px){ .planvid-legend{ grid-template-columns:1fr; } }

/* --- Lage der Wohnung im Gebäude (Rauszoom) --- */
.planvid-pos{ max-width:620px; margin:2.6rem auto 0; }
.planvid-pos img{ width:100%; height:auto; display:block; border-radius:14px; border:1px solid var(--line); box-shadow:0 30px 74px -34px rgba(0,0,0,.62); }
.planvid-pos .planvid-note{ margin-top:.9rem; }

/* ============================================================
   DARK-LUXURY-THEME (2026-07) — nach Referenz: dunkler warmer Grund,
   Gold-Pills, gerundete Karten, cineastische Bildbühnen.
   Letzter Block → gewinnt die Kaskade.
   ============================================================ */
::selection{ background:var(--gold); color:#17120a; }
body{ background:var(--bone); color:var(--ink); }

/* Sanfter Verlauf im Seitengrund für Tiefe */
body::before{ content:''; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:radial-gradient(120% 80% at 78% -10%, rgba(201,164,92,.10), transparent 55%),
             radial-gradient(90% 60% at 10% 110%, rgba(201,164,92,.05), transparent 60%); }

/* ---- Nav: dunkles Glas beim Scrollen ---- */
.nav.scrolled, .nav.solid{ background:rgba(14,12,9,.82); box-shadow:0 1px 0 var(--line-soft); }
.nav.scrolled .brand, .nav.solid .brand{ color:var(--ink); }
.nav.scrolled .nav-links a, .nav.solid .nav-links a{ color:var(--ink-soft); }
.nav.scrolled .nav-links a.active, .nav.solid .nav-links a.active{ color:var(--ink); }
.nav.scrolled .nav-cta, .nav.solid .nav-cta{ color:var(--ink) !important; border-color:var(--gold); }
.nav.scrolled .nav-burger span, .nav.solid .nav-burger span{ background:var(--ink); }

/* ---- Buttons: Gold-Pills (primär) + Outline-Pills (sekundär) ---- */
.btn{ border-radius:999px; padding:1.05rem 2.1rem; }
.btn-gold, .btn-light, .btn-dark{ background:var(--gold); color:#17120a; border-color:transparent; }
.btn-gold:hover, .btn-light:hover, .btn-dark:hover{ background:var(--gold-soft); color:#17120a; transform:translateY(-2px); box-shadow:0 18px 44px -16px rgba(201,164,92,.55); }
.btn-ghost, .btn-outline{ background:transparent; border-color:rgba(236,226,206,.32); color:var(--ink); }
.btn-ghost:hover, .btn-outline:hover{ background:rgba(201,164,92,.1); border-color:var(--gold); color:var(--ink); transform:translateY(-2px); }
.nav-cta{ border-radius:999px; }
.nav-cta:hover{ background:var(--gold); border-color:var(--gold); color:#17120a !important; }
.sticky-cta{ border-radius:999px; background:var(--gold); color:#17120a; border-color:transparent; }
.sticky-cta:hover{ background:var(--gold-soft); color:#17120a; }
.sticky-cta .dot{ background:#17120a; box-shadow:none; }

/* ---- Flächen/Karten: dunkle Surfaces, weiche Ecken, Haarlinie ---- */
.marquee{ background:var(--cream); border-color:var(--line-soft); }
.res-card{ border-radius:16px; background:var(--surface); }
.res-badge{ background:rgba(11,10,7,.6); border-color:rgba(201,164,92,.5); border-radius:999px; }
/* Verkauft-Karten dezent zurücknehmen */
.res-card.sold .res-img{ filter:grayscale(.9) brightness(.6); }
.res-card.sold .res-badge{ background:rgba(11,10,7,.74); border-color:var(--line); color:var(--ink-soft); }
.res-card.sold .res-price{ color:var(--ink-faint); font-weight:500; letter-spacing:.02em; }
.res-card.sold:hover{ transform:none; box-shadow:none; }
.spiegel{ background:var(--surface); border-color:var(--line); border-radius:16px; }
.units th{ background:var(--surface-2); color:var(--ink-faint); border-color:var(--line); }
.units td{ color:var(--ink-soft); border-color:var(--line-soft); }
.units .u-name, .units .u-price{ color:var(--ink); }
.units tr:hover td{ background:rgba(201,164,92,.07); }
.units th:first-child{ background:var(--surface-2); }
.units td:first-child{ background:var(--surface); }
.units tr:hover td:first-child{ background:var(--surface); }
.fact{ background:var(--surface); border-color:var(--line); border-radius:12px; }
.feat-tags span{ background:var(--surface); border-color:var(--line); color:var(--ink-soft); border-radius:999px; }
.proj, .member, .calc, .form{ background:var(--surface); border-color:var(--line); border-radius:16px; }
.proj:hover, .member:hover{ border-color:rgba(201,164,92,.4); }
.calc-input{ background:var(--surface-2); border-color:var(--line); border-radius:999px; overflow:hidden; }
.calc-input input{ color:var(--ink); }
.calc-input .cur{ color:var(--ink-faint); border-color:var(--line); }
.field input, .field select, .field textarea{ background:var(--surface-2); border-color:var(--line); color:var(--ink); border-radius:10px; }
.field input::placeholder, .field textarea::placeholder{ color:var(--ink-faint); }
.field select option{ background:#1a1610; color:var(--ink); }
.price-box{ background:var(--surface-2); border:1px solid rgba(201,164,92,.28); border-radius:16px; }
.split-img{ border-radius:16px; }
.g-item{ border-radius:12px; background:var(--stone); }
.calc, .spiegel{ box-shadow:none; }

/* ---- Galerie/Lightbox Detail ---- */
.g-item.r{ clip-path:inset(10% 6% 10% 6% round 12px); }
.g-item.r.vis{ clip-path:inset(0 0 0 0 round 12px); }

/* ---- 3D-Sektion: Bühne + Panel abrunden ---- */
.t3d-stage{ border-radius:16px; }
.t3d-panel{ border-radius:16px; }
.t3d-item{ border-radius:12px; }
.t3d-cta{ border-radius:999px; }
.t3d-cta.gold{ background:var(--gold); color:#17120a; }
.t3d-cta.gold:hover{ background:var(--gold-soft); color:#17120a; }

/* ---- Formular-Zustände auf Dunkel lesbar ---- */
.form-success{ background:rgba(120,150,90,.14); border-color:rgba(150,180,110,.35); color:#cfe0a8; }
.form-error{ background:rgba(190,110,70,.14); border-color:rgba(190,110,70,.4); color:#f0b596; }
.field.error input, .field.error select, .field.error textarea{ border-color:#d07a4e; background:rgba(190,110,70,.08); }
.calc-verdict.ok{ color:#bcd68f; } .calc-verdict.warn{ color:#f0b596; }
.field .f-err{ color:#f0b596; }

/* ---- Projekt-Film-Rahmen abrunden ---- */
.video-frame{ border-radius:16px; }

/* ---- Preloader dunkel ---- */
#preloader{ background:radial-gradient(120% 120% at 70% 20%, #1b1710, #100e0b 55%, #0b0a07); }
.pl-word{ color:var(--ink); }
.pl-line{ background:rgba(236,226,206,.14); }

/* ---- Marquee-Diamanten in Gold ---- */
.marquee-track i{ color:var(--gold); }

/* ---- Hover-Schatten auf Karten (dunkel, tief) ---- */
.res-card:hover{ box-shadow:0 34px 90px -34px rgba(0,0,0,.8); }

/* ============================================================
   HIGH-END-PASS II (2026-07) — Real-Estate-Politur & Konversion.
   Additiv am Ende → gewinnt die Kaskade. Basis bleibt unberührt.
   ============================================================ */

/* --- Typo-Balance auf Displays, Pretty im Fliesstext --- */
.phero-inner h1, .sec-title, .chap-text h2, .cta-band h2, .xps-h, .t3d-title,
.res-name, .foot-brand, .legal h1, .legal h2{ text-wrap:balance; }
.sec-lead, .phero-inner p, .xps-sub, .chap-text p, .proj p, .member p, .step span{ text-wrap:pretty; }

/* --- Marquee: weiche Randkanten statt harter Cut --- */
.marquee{ -webkit-mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
          mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent); }

/* --- Galerie-Captions wieder lesbar (kein gesperrtes Caps auf Fliesstext) --- */
.g-item .cap{ font-size:.74rem; letter-spacing:.04em; text-transform:none; color:rgba(255,252,245,.92); font-weight:400; padding:2.2rem 1.1rem .95rem; }

/* --- Karten: feiner Gold-Ring beim Hover, an die Gold-Sprache angeschlossen --- */
.res-card:hover{ box-shadow:0 34px 90px -34px rgba(0,0,0,.8), inset 0 0 0 1px rgba(201,164,92,.5); }
.res-card.sold:hover{ box-shadow:none; }
.g-item{ transition:transform .45s var(--ease), box-shadow .4s var(--ease); }
.g-item:hover{ box-shadow:inset 0 0 0 1px rgba(201,164,92,.4); }

/* --- Tastatur-Fokus auf Bild-/Kartenelementen deutlich sichtbar --- */
.res-card:focus-visible, .g-item:focus-visible{ outline:2px solid var(--gold-soft); outline-offset:3px; box-shadow:0 0 0 4px rgba(11,10,7,.65); }

/* --- Breadcrumb: aktuelle Seite hebt sich ab --- */
.crumbs a{ color:var(--ink-faint); } .crumbs > span:last-child{ color:var(--ink-soft); }

/* --- Positionsbild = 16px wie Planvideo (ein Radius-System) --- */
.planvid-pos img{ border-radius:16px; }

/* --- Facts-Grid: ruhiges 2-Spalten-Raster + kräftigere Werte --- */
.facts-grid{ grid-template-columns:repeat(2,1fr); }
@media(max-width:380px){ .facts-grid{ grid-template-columns:1fr; } }
.fv{ font-size:clamp(1.15rem,1.6vw,1.35rem); }
.fact{ padding:1.05rem 1.15rem; }
.fact--hero{ border-color:rgba(201,164,92,.55); background:rgba(201,164,92,.07); }
.fact--hero .fv{ color:var(--gold-soft); font-size:clamp(1.3rem,1.9vw,1.55rem); }
.fact--hero .fk{ color:var(--gold-deep); }

/* --- Galerie: Schlüsselbild als Wide-Hero-Kachel --- */
.g-item--wide{ grid-column:span 2; aspect-ratio:16/9; }
@media(max-width:560px){ .g-item--wide{ grid-column:span 1; aspect-ratio:4/3; } }

/* --- Price-Box: Status, Preis/m², Verknappung, gestaffelte CTAs --- */
.pb-status{ display:inline-flex; align-items:center; gap:.45rem; font-size:.58rem; letter-spacing:.22em; text-transform:uppercase; font-weight:600; padding:.36rem .85rem; border-radius:999px; margin-bottom:.9rem; }
.pb-status.ready{ background:rgba(140,170,90,.16); color:#bcd68f; border:1px solid rgba(150,180,110,.4); }
.pb-status.free{ background:rgba(201,164,92,.16); color:var(--gold-soft); border:1px solid rgba(201,164,92,.42); }
.pb-status .dot{ width:7px; height:7px; border-radius:50%; background:currentColor; }
.pb-persqm{ font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-soft); margin:-.05rem 0 .15rem; }
.pb-avail{ display:flex; align-items:center; gap:.55rem; font-size:.72rem; letter-spacing:.03em; color:rgba(255,252,245,.82); margin:.4rem 0 1.15rem; }
.pb-avail .dot{ width:7px; height:7px; border-radius:50%; background:#e3b96a; box-shadow:0 0 8px rgba(227,185,106,.9); flex:none; }
.pb-check{ display:inline-flex; align-items:center; gap:.4rem; font-size:.68rem; letter-spacing:.08em; color:var(--gold-soft); margin:.1rem 0 1.1rem; }
.pb-check:hover{ color:var(--gold-soft); text-decoration:underline; text-underline-offset:3px; }
.pb-links{ display:flex; gap:1.3rem; flex-wrap:wrap; margin-top:.5rem; padding-top:.9rem; border-top:1px solid rgba(255,255,255,.12); }
.pb-textlink{ display:inline-flex; align-items:center; gap:.4rem; font-size:.64rem; letter-spacing:.18em; text-transform:uppercase; color:rgba(255,252,245,.68); transition:color .3s; }
.pb-textlink:hover{ color:#fff; }

/* --- Trust-Streifen (echte Fakten, keine Testimonials) --- */
.trust-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem 2rem; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:1.8rem 0; }
@media(max-width:760px){ .trust-row{ grid-template-columns:1fr; gap:1rem; } }
.trust-item{ display:flex; gap:.85rem; align-items:flex-start; }
.trust-item .ti-ic{ flex:none; width:36px; height:36px; border-radius:50%; border:1px solid rgba(201,164,92,.45); color:var(--gold-soft); display:flex; align-items:center; justify-content:center; font-size:.85rem; }
.trust-item b{ display:block; font-family:var(--display); font-weight:400; font-size:1.02rem; color:var(--ink); margin-bottom:.2rem; }
.trust-item span{ font-size:.8rem; color:var(--ink-soft); line-height:1.55; }

/* --- Kaufprozess-Schritte + FAQ --- */
.steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-bottom:1.8rem; }
@media(max-width:760px){ .steps{ grid-template-columns:1fr; } }
.step{ border:1px solid var(--line); border-radius:12px; padding:1.3rem 1.35rem; background:var(--surface); }
.step .sn{ font-family:var(--display); color:var(--gold); font-size:.92rem; letter-spacing:.1em; }
.step b{ display:block; font-family:var(--display); font-weight:400; font-size:1.12rem; margin:.45rem 0 .35rem; color:var(--ink); }
.step span{ font-size:.84rem; color:var(--ink-soft); line-height:1.6; }
.faq{ display:flex; flex-direction:column; gap:.7rem; max-width:840px; margin:0 auto; }
.faq details{ border:1px solid var(--line); border-radius:12px; background:var(--surface); overflow:hidden; }
.faq summary{ list-style:none; cursor:pointer; padding:1.05rem 1.35rem; font-family:var(--display); font-size:1.06rem; color:var(--ink); display:flex; justify-content:space-between; align-items:center; gap:1rem; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:'+'; color:var(--gold); font-size:1.35rem; line-height:1; transition:transform .3s var(--ease); }
.faq details[open] summary::after{ transform:rotate(45deg); }
.faq details p{ padding:0 1.35rem 1.2rem; font-size:.9rem; color:var(--ink-soft); line-height:1.7; max-width:70ch; }

/* --- Nav: Touch-Ziele im Mobil-Menü >=44px --- */
@media(max-width:1080px){
  .nav-links a{ padding:.9rem 1.4rem; min-height:44px; display:flex; align-items:center; justify-content:center; }
}

/* --- Price-Box im gestapelten Layout nicht mehr sticky --- */
@media(max-width:980px){ .price-box{ position:static; } }

/* --- Wohnungsspiegel: Sticky-Kante sichtbar (scrollbar erkennbar) --- */
.units td:first-child, .units th:first-child{ box-shadow:6px 0 12px -8px rgba(0,0,0,.55); }

/* --- Grundriss-Neigung auf Mobile flacher (lesbar, clip-sicher) --- */
@media(max-width:640px){
  .planvid.tilt.r, .planvid.tilt.r.vis{ transform:perspective(2200px) rotateX(9deg) scale(1) !important; }
  .planvid.tilt{ margin-bottom:1.8rem; }
}

/* --- Lesbare Zeilenlänge auf Legal/Projekt --- */
.legal p, .legal li{ max-width:68ch; } .proj p{ max-width:46ch; }

/* --- Unterseiten-Hero im Mobil-Querformat nicht gequetscht --- */
@media(max-height:520px) and (orientation:landscape){
  .phero{ min-height:100svh; } .phero-inner{ padding-top:clamp(4.5rem,14vh,7rem); padding-bottom:2rem; }
}

/* --- 3D-Item auf sehr schmalen Screens umbrechen statt clippen --- */
@media(max-width:400px){ .t3d-item .n{ flex-direction:column; align-items:flex-start; gap:.15rem; } }

/* --- Scroll-Hero-Text: stärkerer unterer Scrim für Kontrast auf hellen Frames --- */
.xps-tint{ background:radial-gradient(70% 60% at 50% 44%, rgba(8,6,2,.14), rgba(8,6,2,0) 70%), linear-gradient(180deg, rgba(10,7,3,.5) 0%, rgba(10,7,3,.06) 28%, rgba(10,7,3,.16) 58%, rgba(8,6,2,.84) 100%); }
.xps-sub{ text-shadow:0 2px 30px rgba(0,0,0,.7); }

/* --- Angebot-Teaser (index): 3 Spalten + Flaggschiff-Auszeichnung --- */
.res-grid.three{ grid-template-columns:repeat(3,1fr); }
@media(max-width:820px){ .res-grid.three{ grid-template-columns:1fr; max-width:560px; margin-inline:auto; } }
.res-badge.flag{ background:var(--gold); color:#17120a; border-color:var(--gold); }
.res-card.flag-card{ box-shadow:inset 0 0 0 1px rgba(201,164,92,.5); }
.res-card.flag-card:hover{ box-shadow:0 34px 90px -34px rgba(0,0,0,.8), inset 0 0 0 1px rgba(201,164,92,.8); }

/* --- Stat-Highlight: Verknappungs-Signal in Gold --- */
.stat.hot{ border-top-color:var(--gold); }
.stat.hot .s-num{ color:var(--gold-soft); }

/* --- Hero-Angebotszeile (Preis-/Verfügbarkeits-Anker above the fold) --- */
.hero-offer{ display:inline-flex; align-items:center; gap:.7rem; flex-wrap:wrap; margin-top:1.3rem; font-size:.82rem; letter-spacing:.04em; color:#fff; }
.hero-offer .dot{ width:7px; height:7px; border-radius:50%; background:#e3b96a; box-shadow:0 0 8px rgba(227,185,106,.9); }
.hero-offer b{ color:var(--gold-soft); font-weight:600; }
.hero-offer .sep{ width:1px; height:14px; background:rgba(255,255,255,.3); }

/* --- Vergleichbare Wohnungen (C2-verkauft) --- */
.altgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
@media(max-width:760px){ .altgrid{ grid-template-columns:1fr; } }
.altcard{ display:block; border:1px solid var(--line); border-radius:14px; background:var(--surface); padding:1.3rem 1.4rem; transition:border-color .35s var(--ease), transform .35s var(--ease); }
.altcard:hover{ border-color:rgba(201,164,92,.5); transform:translateY(-3px); }
.altcard .ac-loc{ font-size:.6rem; letter-spacing:.24em; text-transform:uppercase; color:var(--gold-soft); }
.altcard .ac-name{ font-family:var(--display); font-size:1.2rem; color:var(--ink); margin:.4rem 0 .2rem; }
.altcard .ac-meta{ font-size:.8rem; color:var(--ink-soft); }
.altcard .ac-foot{ display:flex; justify-content:space-between; align-items:center; margin-top:1rem; padding-top:.9rem; border-top:1px solid var(--line); }
.altcard .ac-price{ font-family:var(--display); font-size:1.1rem; color:#fff; }
.altcard .ac-view{ font-size:.62rem; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-soft); }

/* ============================================================
   PREMIUM-REFINEMENT (2026-07) — Agentur-Feinschliff:
   exponentielle Motion, Zahlen-Typografie, Tiefe, Mobile-Ordnung.
   Additiv am Ende → gewinnt die Kaskade.
   ============================================================ */
:root{
  --ease-expo:cubic-bezier(.16,1,.3,1);
  /* Tiefe über zwei Schatten-Ebenen (Nah + Fern) = wertiger */
  --shadow:0 2px 8px -3px rgba(0,0,0,.45), 0 34px 90px -34px rgba(0,0,0,.72);
}

/* Zahlen professionell ausrichten (Preise, Flächen, Stats, Tabelle) */
.pb-price, .pb-persqm, .res-price, .s-num, .fv, .units td, .units .u-price,
.t3d-d-price, .ac-price, .calc-row .cv, .calc-input input{ font-variant-numeric:tabular-nums; }

/* Fliesstext: ruhiger Umbruch, keine Waisen */
.sec-lead, .phero-inner p, .proj p, .member p, .step span, .faq details p,
.trust-item span, .legal p, .legal li, .pb-avail{ text-wrap:pretty; }
.phero-inner h1, .sec-title, .xps-h, .cta-band h2, .chap-text h2{ hanging-punctuation:first; }

/* Display straffer & selbstbewusster bei grossen Graden */
.phero-inner h1{ letter-spacing:-.018em; }
.xps-h{ letter-spacing:-.02em; }
.sec-title{ letter-spacing:-.006em; }

/* Motion: exponentielles Ausklingen (edler „Settle" statt linearem Stopp) */
.r, .split-img.r, .g-item.r, h1.sec-title.r, h2.sec-title.r, .planvid.r, .planvid.tilt.r,
.res-card, .res-img, .g-item .gi, .altcard, .btn, .btn .arr, .nav-links a::after{ transition-timing-function:var(--ease-expo); }

/* Edler, dezenter Scrollbalken statt System-Grau (Dark-Theme) */
*{ scrollbar-width:thin; scrollbar-color:rgba(201,164,92,.4) transparent; }
::-webkit-scrollbar{ width:11px; height:11px; }
::-webkit-scrollbar-thumb{ background:rgba(201,164,92,.34); border-radius:99px; border:3px solid var(--bone); }
::-webkit-scrollbar-thumb:hover{ background:rgba(201,164,92,.52); }
::-webkit-scrollbar-track{ background:transparent; }

/* Exposé-Film: breite Kino-Variante der Plan-Animation (ohne Tilt) */
.planvid.wide{ max-width:980px; }

/* ============================================================
   EDITORIAL-LUXUS-PASS (2026-07): weg vom Template-Look.
   Film-Korn, atmende Bilder, Hairline-Editorial statt Karten-Boxen,
   Gold mit Leben. CSS-only, additiv — gewinnt die Kaskade.
   ============================================================ */

/* --- 1) Film-Korn über allem: nimmt die digitale Glätte raus --- */
body::after{
  content:''; position:fixed; inset:-40px; z-index:3000; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
  background-size:240px 240px; opacity:.05;
}

/* --- 2) Bilder leben: langsames Atmen/Push-in statt Standbild --- */
@keyframes lxBreathe{ from{ transform:scale(1); } to{ transform:scale(1.05); } }
@keyframes lxBreatheSoft{ from{ transform:scale(1); } to{ transform:scale(1.028); } }
.phero-bg{ animation:lxBreathe 26s ease-in-out infinite alternate; }
.split-img.r.vis{ animation:lxBreathe 24s ease-in-out infinite alternate; }
.planvid-pos img{ animation:lxBreatheSoft 30s ease-in-out infinite alternate; }

/* --- 3) Heroes: feine Rand-Vignette = Kino statt Flat --- */
.phero-ov{ background:
  radial-gradient(140% 120% at 50% 40%, rgba(8,6,2,0) 55%, rgba(8,6,2,.38) 100%),
  linear-gradient(180deg, rgba(15,11,6,.52) 0%, rgba(15,11,6,.12) 38%, rgba(8,6,2,.78) 100%); }

/* --- 4) Bildflächen gerahmt wie gehängte Werke --- */
.split-img, .g-item, .planvid, .video-frame, .planvid-pos img, .res-card{
  box-shadow:inset 0 0 0 1px rgba(236,226,206,.09), var(--shadow); }
.res-card:hover{ box-shadow:inset 0 0 0 1px rgba(201,164,92,.5), 0 34px 90px -34px rgba(0,0,0,.8); }
.res-card.sold, .res-card.sold:hover{ box-shadow:inset 0 0 0 1px rgba(236,226,206,.07); }

/* --- 5) Fakten: Spezifikations-Tafel statt Kacheln (entboxt) --- */
.fact{ background:transparent; border:0; border-bottom:1px solid var(--line-soft); border-radius:0; padding:.85rem .1rem .9rem; }
.fv{ font-size:clamp(1.3rem,1.9vw,1.6rem); letter-spacing:.01em; }
.fk{ margin-bottom:.4rem; }
.fact--hero{ background:transparent; border:0; border-bottom:1px solid rgba(201,164,92,.65); }
.fact--hero .fv{ color:var(--gold-soft); font-size:clamp(1.45rem,2.1vw,1.8rem); }
.facts-grid{ gap:.2rem 2.4rem; }

/* --- 6) Kaufprozess: editoriale Spalten statt Karten --- */
.step{ background:transparent; border:0; border-top:1px solid var(--line); border-radius:0; padding:1.4rem .15rem 0; }
.step .sn{ font-size:1.7rem; font-style:italic; font-family:var(--serif); color:var(--gold); letter-spacing:0; }
.step b{ font-size:1.2rem; margin:.55rem 0 .4rem; }

/* --- 7) FAQ: Hairlines statt Boxen --- */
.faq details{ background:transparent; border:0; border-bottom:1px solid var(--line); border-radius:0; }
.faq details:first-child{ border-top:1px solid var(--line); }
.faq summary{ padding:1.15rem .1rem; }
.faq details p{ padding:0 .1rem 1.25rem; }

/* --- 8) Projekt-/Lage-/Team-Blöcke: entboxt, Serif-Ziffern --- */
.proj, .member{ background:transparent; border:0; border-top:1px solid var(--line); border-radius:0; padding:1.5rem .15rem 0; }
.proj:hover, .member:hover{ border-color:rgba(201,164,92,.5); }
.p-no{ font-family:var(--serif); font-style:italic; font-size:1.5rem; color:var(--gold); margin-bottom:.7rem; }

/* --- 9) Preis als Monument --- */
.price-box .pb-price{ font-size:clamp(2.3rem,3.4vw,3rem); letter-spacing:.005em; line-height:1.05; }

/* --- 10) Gold lebt: Schimmer auf Kicker-Linien, Sheen auf Gold-Buttons, Puls-Punkte --- */
@keyframes lxSheenLine{ to{ background-position:200% 0; } }
.kicker::before{ background:linear-gradient(90deg, var(--gold-deep), var(--gold-soft) 50%, var(--gold-deep)); background-size:200% 100%; animation:lxSheenLine 3.6s linear infinite; }
.btn{ position:relative; overflow:hidden; }
.btn-gold::after{ content:''; position:absolute; top:0; bottom:0; left:-70%; width:45%; background:linear-gradient(105deg, transparent, rgba(255,255,255,.28), transparent); transform:skewX(-18deg); transition:left .7s var(--ease-expo); pointer-events:none; }
.btn-gold:hover::after{ left:125%; }
.pb-status .dot, .pb-avail .dot, .hero-offer .dot{ animation:t3dPulse 2.4s var(--ease) infinite; }

/* --- 11) Footer: Marke monumental --- */
.foot-brand{ font-size:clamp(1.4rem,2.6vw,2rem); letter-spacing:.34em; }

/* --- reduced-motion: alles Neue respektiert die Einstellung --- */
@media(prefers-reduced-motion:reduce){
  .phero-bg, .split-img.r.vis, .planvid-pos img{ animation:none; }
  .kicker::before{ animation:none; }
  .pb-status .dot, .pb-avail .dot, .hero-offer .dot{ animation:none; }
  .btn-gold::after{ display:none; }
}

/* ============================================================
   MOBILE-FEINAUSRICHTUNG (2026-07): Reihenfolge, Tap-Ziele,
   Rhythmus — nur Layout, keine neuen Assets.
   ============================================================ */

/* Preis zuerst: im gestapelten Layout rückt die Preis-Box direkt
   unter den Hero (wichtigste Info oben, wie im Exposé-Brief) */
@media(max-width:980px){
  .detail-grid > .price-box{ order:-1; }
}

/* Tap-Ziele überall ≥44px + lesbare Mikro-Navigation */
@media(max-width:900px){
  .crumbs{ font-size:.72rem; }
  .crumbs a{ padding:.8rem 0; margin:-.8rem 0; }
  .pb-check{ padding:.85rem 0; margin:.1rem 0 .55rem; }
  .pb-links{ gap:.2rem 1.6rem; padding-top:.55rem; }
  .pb-textlink{ padding:.85rem 0; }
  .foot-col a{ padding:.8rem 0; }
  .foot-bot-in{ font-size:.74rem; }
  .foot-bot-in a{ display:inline-block; padding:.7rem .15rem; }
  .c-line a{ display:inline-block; padding:.4rem 0; }
  .u-link{ display:inline-block; padding:.5rem 0; }
  .feat-tags{ gap:.45rem; }
  .feat-tags span{ padding:.6rem 1rem; }
  .faq summary{ padding:1.25rem .1rem; }
}

/* Sehr schmale Geräte: Hero ruhiger stapeln */
@media(max-width:480px){
  .hero-offer{ gap:.45rem .8rem; font-size:.78rem; }
  .hero-offer .sep{ display:none; }
  .hero-list{ gap:.55rem 1.2rem; }
  .phero-inner{ padding-bottom:3.4rem; }
}

/* Mobile: mehr Luft, saubere Ordnung, gestapelte CTAs mit vollen Tap-Zielen */
@media(max-width:640px){
  .sec-lead{ font-size:1rem; line-height:1.72; }
  .sec-head{ margin-bottom:2rem; }
  .price-box{ padding:1.5rem 1.4rem; }
  .planvid-legend{ gap:.6rem 1rem; }
  .trust-row{ padding:1.4rem 0; }
}
@media(max-width:480px){
  .btn-row{ flex-direction:column; align-items:stretch; }
  .btn-row .btn{ width:100%; justify-content:center; }
}

/* ===== VERKAUFSPROGRAMM 07/2026: Stats-Text, Lageplan-Marker ===== */
.s-num--text{ font-size:clamp(1.65rem,2.7vw,2.55rem); white-space:nowrap; padding-top:.34em; }
@media(max-width:820px){ .s-num--text{ font-size:1.5rem; padding-top:.2em; } }

.lagemap{ position:relative; border-radius:14px; overflow:hidden; box-shadow:0 30px 70px -30px rgba(0,0,0,.55); }
.lagemap img{ display:block; width:100%; height:auto; }
.lm-box{ position:absolute; left:var(--x); top:var(--y); width:var(--w); height:var(--h);
  border:2px solid rgba(231,206,148,.95); background:rgba(201,164,92,.10); border-radius:6px;
  transition:background .35s ease, box-shadow .35s ease; }
a.lm-box:hover, a.lm-box:focus-visible{ background:rgba(201,164,92,.24); box-shadow:0 0 0 5px rgba(201,164,92,.16); outline:none; }
.lm-box > span{ position:absolute; left:-2px; top:-1.7rem; background:rgba(23,18,10,.94); color:var(--gold-soft);
  font-family:var(--sans); font-size:.72rem; font-weight:600; letter-spacing:.14em; padding:.24rem .6rem;
  border-radius:5px 5px 0 0; white-space:nowrap; }
.lm-box.dim{ opacity:.38; border-style:dashed; }
.lagemap-note{ margin-top:.9rem; font-size:.86rem; color:var(--muted,#8d7f68); text-align:center; }
@media(max-width:640px){
  .lm-box > span{ font-size:.58rem; top:-1.42rem; padding:.18rem .45rem; letter-spacing:.1em; }
  .lm-box{ border-width:1.5px; }
}
@media (prefers-reduced-motion: reduce){ .lm-box{ transition:none; } }

/* A4 Zwei-Ebenen-Pläne */
.level-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(1rem,2vw,1.8rem); align-items:start; }
@media(max-width:820px){ .level-grid{ grid-template-columns:1fr; } }
.level-card{ background:#fff; border-radius:12px; overflow:hidden; box-shadow:0 24px 60px -28px rgba(0,0,0,.45); }
.level-card img{ display:block; width:100%; height:auto; }
.level-card figcaption{ padding:.9rem 1.1rem 1rem; font-size:.9rem; color:#5d5240; border-top:1px solid rgba(23,18,10,.08); }
.level-card figcaption b{ display:block; font-family:var(--display); font-size:1.02rem; letter-spacing:.04em; color:#241c10; margin-bottom:.15rem; }

/* ===== TYPO-KICK & CTA-LIEBE (Nico 07/2026) ===== */
/* Akzent-Kursive: Cormorant Display-Schnitt statt EB Garamond */
.sec-title .it, .phero-inner h1 .it, .cta-band h2 .it, .xps-h .it, .chap-text h2 .it,
h1 .it, h2 .it, .foot-brand .it{
  font-family:'Cormorant',Georgia,serif; font-style:italic; font-weight:500;
  font-size:1.07em; line-height:1; letter-spacing:.004em;
  font-feature-settings:"liga" 1,"kern" 1;
}
/* ===== HERO-POLISH 20.07. — Kino-Typo + gefasste Offer-Pille (taste/emil/impeccable) ===== */
.xps-h{ font-size:clamp(2.7rem,7.6vw,6.5rem); letter-spacing:-.022em; line-height:1.0; }
.xps-scene.mid .xps-h{ font-size:clamp(3rem,8.4vw,7rem); }        /* Wortmarke & Schluss-Szene monumentaler */
.hero-offer{
  padding:.62rem 1.15rem;
  border:1px solid rgba(201,164,92,.34);
  border-radius:999px;
  background:rgba(18,14,9,.42);
  backdrop-filter:blur(7px); -webkit-backdrop-filter:blur(7px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  gap:.7rem;
}
.xps-scene.mid .hero-offer{ margin-left:auto; margin-right:auto; }

/* Hero-Ebene: Champagner-Gold-Verlauf (Fallback = Champagner-Ton) */
.xps-h .it, .phero-inner h1 .it, .cta-band h2 .it, .chap-text h2 .it{
  color:#ecd7a4;
  background:linear-gradient(103deg,#f6e6ba 6%,#ddc18e 46%,#c19a5c 92%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
  padding-right:.07em; padding-bottom:.03em;
}
/* Sektions-Titel: satter Champagner statt blassem Weiss */
.sec-title .it{ color:var(--gold-soft); }

/* Besichtigung-Pill in der Navigation: gefüllt, Gold, mit Glow */
.nav-cta, .nav.scrolled .nav-cta, .nav.solid .nav-cta, .nav.dark-hold .nav-cta{
  background:linear-gradient(120deg,#eed9a6 0%,#d3ae6e 55%,#c09455 100%) !important;
  color:#1d150a !important; border:1px solid rgba(255,255,255,.28) !important;
  border-radius:999px; padding:.72rem 1.45rem; font-weight:700; letter-spacing:.16em;
  box-shadow:0 10px 28px -10px rgba(201,164,92,.55), inset 0 1px 0 rgba(255,255,255,.45);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), filter .35s var(--ease);
}
.nav-cta:hover, .nav-cta:focus-visible{
  background:linear-gradient(120deg,#f6e6ba 0%,#ddc18e 55%,#c9a45c 100%) !important;
  color:#1d150a !important; transform:translateY(-1px);
  box-shadow:0 16px 36px -12px rgba(201,164,92,.75), inset 0 1px 0 rgba(255,255,255,.55);
  filter:saturate(1.05);
}

/* Gold-Buttons: Verlauf, innere Lichtkante, satterer Hover */
.btn-gold{
  background:linear-gradient(120deg,#eed9a6 0%,#d3ae6e 55%,#c09455 100%);
  color:#1d150a; border:1px solid rgba(255,255,255,.25);
  box-shadow:0 14px 34px -14px rgba(201,164,92,.55), inset 0 1px 0 rgba(255,255,255,.4);
}
.btn-gold:hover{
  background:linear-gradient(120deg,#f6e6ba 0%,#e0c692 55%,#c9a45c 100%);
  color:#1d150a; transform:translateY(-2px);
  box-shadow:0 22px 48px -16px rgba(201,164,92,.8), inset 0 1px 0 rgba(255,255,255,.5);
}

/* Sticky-CTA: goldene Pille mit Glow statt dunkler Kachel */
.sticky-cta{
  background:linear-gradient(120deg,#eed9a6 0%,#d3ae6e 55%,#c09455 100%);
  color:#1d150a; border:1px solid rgba(255,255,255,.3); border-radius:999px;
  font-weight:700; letter-spacing:.18em;
  box-shadow:0 18px 44px -14px rgba(201,164,92,.65), inset 0 1px 0 rgba(255,255,255,.45);
}
.sticky-cta:hover{
  transform:translateY(-2px);
  box-shadow:0 24px 54px -16px rgba(201,164,92,.85), inset 0 1px 0 rgba(255,255,255,.55);
  color:#1d150a;
}
.sticky-cta .dot{ background:#1d150a; box-shadow:0 0 0 0 rgba(29,21,10,.35); }

@media (prefers-reduced-motion: reduce){
  .nav-cta, .btn-gold, .sticky-cta{ transition:none; }
  .nav-cta:hover, .btn-gold:hover, .sticky-cta:hover{ transform:none; }
}
/* Spezifitäts-Konter: dunkle Schrift auf der Gold-Pill in JEDEM Nav-Zustand */
.nav-links a.nav-cta, .nav .nav-links a.nav-cta,
.nav.dark-hold .nav-links a.nav-cta, .nav.scrolled .nav-links a.nav-cta, .nav.solid .nav-links a.nav-cta{
  color:#1d150a !important; border-color:rgba(255,255,255,.28) !important;
}

/* ===== NICO-FEEDBACK 07/2026 II ===== */
/* Minuten-Stats & Co. nie umbrechen */
.s-num{ white-space:nowrap; }
/* Formular fresher: weichere Felder, Gold-Fokus, ruhigere Platzhalter */
.form input[type=text], .form input[type=email], .form input[type=tel], .form textarea, .form select{
  background:rgba(255,255,255,.045); border:1px solid rgba(231,206,148,.22); border-radius:10px;
  padding:.95rem 1.05rem; transition:border-color .3s ease, background .3s ease, box-shadow .3s ease;
}
.form input:hover, .form textarea:hover, .form select:hover{ border-color:rgba(231,206,148,.4); }
.form input:focus-visible, .form textarea:focus-visible, .form select:focus-visible{
  outline:none; border-color:var(--gold); background:rgba(255,255,255,.07);
  box-shadow:0 0 0 4px rgba(201,164,92,.15);
}
.form ::placeholder{ color:rgba(244,238,226,.32); }

/* ===== AUDIT-FIXES 19.07. ===== */
/* KRITISCH: langes Kontakt-Select sprengte Mobile in horizontales Scrollen */
.field{ min-width:0; }
.field select, .field input, .field textarea, .form select{ width:100%; min-width:0; max-width:100%; box-sizing:border-box; }
/* Lageplan: Höhe reservieren, sonst kollabiert der Container und die Marker rendern mit 0 Höhe */
.lagemap{ aspect-ratio:1756 / 945; }
/* Platzhalter-Kontrast anheben (war ~2.5:1, jetzt lesbar) */
.form ::placeholder{ color:rgba(244,238,226,.55); }
/* Tap-Targets >= 44px */
.u-link{ padding:.7rem 0; }
@media(max-width:640px){
  .lm-box{ min-height:44px; }
  .nav-burger{ min-height:44px; min-width:44px; box-sizing:border-box; }
}
