/* ============================================================
   simon&co. Immobilien – gemeinsames Stylesheet
   Farben und Schriften angelehnt an Concept Living.
   Fester Dateiname, .htaccess liefert ihn mit must-revalidate aus.
   ============================================================ */

/* ---------- Schriften (selbst gehostet) ---------- */
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/cormorant-garamond-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/cormorant-garamond-latin-ext-500-normal.woff2) format('woff2');unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/cormorant-garamond-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:300;font-display:swap;src:url(fonts/poppins-latin-300-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:300;font-display:swap;src:url(fonts/poppins-latin-ext-300-normal.woff2) format('woff2');unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/poppins-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/poppins-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Poppins';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/poppins-latin-400-italic.woff2) format('woff2')}

/* ---------- Grundwerte ---------- */
:root{
  --ink:#060606;
  --paper:#ffffff;
  --stone:#d6d3cd;      /* warmes Beige-Grau, Hero-Hintergrund */
  --sand:#edebe6;       /* helles Beige */
  --sand-2:#e4e1db;
  --lime:#f8ffa1;       /* Akzent, sparsam */
  --muted:#6d6d68;
  --muted-dark:#a3a39d;
  --hair:#0000001a;
  --hair-dark:#ffffff21;
  --star:#fbbc04;

  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Poppins',-apple-system,'Segoe UI',sans-serif;

  --shell:1240px;
  --gut:clamp(16px,4vw,48px);
  --sec:clamp(64px,8vw,120px);
  --r-lg:clamp(24px,2.6vw,36px);
  --r-md:clamp(18px,2vw,26px);
  --hdr:76px;
  --ease:cubic-bezier(.22,.61,.36,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--hdr) + 16px)}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-weight:300;font-size:16px;line-height:1.65;
  font-synthesis:none;-webkit-font-smoothing:antialiased;overflow-x:clip;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
b,strong{font-weight:500}
h1,h2,h3,h4,.float__num,.fact b,.gbadge__score em,.step__n,.fdone__steps b,.fnperson__tel a{font-variant-numeric:lining-nums}
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;letter-spacing:0;margin:0;text-wrap:balance}
h1{font-size:clamp(2.2rem,4.2vw,3.6rem);line-height:1.06}
h2{font-size:clamp(1.7rem,2.8vw,2.45rem);line-height:1.12}
h3{font-size:clamp(1.15rem,1.5vw,1.35rem);line-height:1.22}
p{margin:0}
.shell{width:100%;max-width:calc(var(--shell) + 2*var(--gut));margin:0 auto;padding:0 var(--gut)}
.sec{padding:var(--sec) 0;overflow:clip}
.sec--sand{background:var(--sand)}
.sec--stone{background:var(--stone)}
.sec--ink{background:var(--ink);color:var(--paper)}
.kicker{display:inline-flex;align-items:center;gap:10px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.kicker::before{content:"";width:22px;height:1px;background:currentColor}
.sec--ink .kicker{color:var(--muted-dark)}
.lead{font-size:clamp(1rem,1.2vw,1.08rem);line-height:1.75;color:#4b4b47;max-width:60ch}
.sec--ink .lead{color:#c9c9c3}
.head{display:grid;gap:18px;max-width:760px;margin-bottom:clamp(36px,4.4vw,64px)}
.head--center{margin-left:auto;margin-right:auto;text-align:center;justify-items:center}
.skip{position:absolute;left:-9999px}
.skip:focus{left:16px;top:16px;z-index:200;background:var(--paper);padding:10px 16px;border-radius:10px}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.sec--ink :focus-visible{outline-color:var(--paper)}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  border-radius:999px;padding:15px 26px;font-size:14.5px;font-weight:400;line-height:1.2;
  border:1px solid transparent;cursor:pointer;white-space:nowrap;
  transition:background .3s ease,color .3s ease,border-color .3s ease,transform .3s var(--ease);
}
.btn svg{width:16px;height:16px;flex:none;transition:transform .3s var(--ease)}
.btn:hover svg{transform:translateX(3px)}
.btn--ink{background:var(--ink);color:var(--paper)}
.btn--ink:hover{background:#2a2a28}
.btn--lime{background:var(--lime);color:var(--ink)}
.btn--lime:hover{background:#eef78a}
.btn--light{background:var(--paper);color:var(--ink)}
.btn--light:hover{background:var(--lime)}
.btn--line{border-color:#00000033;color:var(--ink)}
.btn--line:hover{border-color:var(--ink)}
.sec--ink .btn--line{border-color:#ffffff40;color:var(--paper)}
.sec--ink .btn--line:hover{border-color:var(--paper)}
.btns{display:flex;flex-wrap:wrap;gap:12px}

/* ---------- Kopfzeile ---------- */
.hdr{
  position:fixed;inset:0 0 auto;z-index:80;height:var(--hdr);
  transition:background .35s ease,box-shadow .35s ease;
}
.hdr.solid{background:#ffffffeb;backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);box-shadow:0 1px 0 var(--hair)}
.hdr .shell{height:100%;display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{display:block;flex:none}
.logo img{height:44px;width:auto}
.nav{display:flex;align-items:center;gap:clamp(18px,2.2vw,34px);font-size:14px}
.nav>a:not(.btn){position:relative;opacity:.86;transition:opacity .25s}
.nav>a:not(.btn):hover,.nav>a[aria-current]{opacity:1}
.nav>a[aria-current]::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:1px;background:currentColor}
.nav .btn{padding:12px 20px;font-size:13.5px}
.nav__tel{display:inline-flex;align-items:center;gap:8px}
.nav__tel svg{width:15px;height:15px}
.burger{display:none;width:46px;height:46px;border-radius:50%;border:1px solid var(--hair);background:var(--paper);cursor:pointer;place-items:center}
.burger i,.burger i::before,.burger i::after{display:block;width:18px;height:1.5px;background:var(--ink);border-radius:2px;transition:transform .3s var(--ease),opacity .2s}
.burger i{position:relative}
.burger i::before,.burger i::after{content:"";position:absolute;left:0}
.burger i::before{top:-6px}.burger i::after{top:6px}
.menu-open .burger i{background:transparent}
.menu-open .burger i::before{transform:translateY(6px) rotate(45deg)}
.menu-open .burger i::after{transform:translateY(-6px) rotate(-45deg)}
.mnav{
  position:fixed;inset:var(--hdr) 0 0;z-index:79;background:var(--paper);
  padding:28px var(--gut) 40px;display:flex;flex-direction:column;gap:6px;
  opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .3s ease,transform .3s var(--ease),visibility .3s;
  overflow-y:auto;
}
.mnav a:not(.btn){font-family:var(--serif);font-size:2rem;line-height:1.3;padding:6px 0;border-bottom:1px solid var(--hair)}
.mnav .btn{margin-top:22px}
.mnav__kontakt{margin-top:auto;padding-top:28px;font-size:14px;color:var(--muted);display:grid;gap:4px}
.menu-open .mnav{opacity:1;visibility:visible;transform:none}
.menu-open{overflow:hidden}
@media (max-width:980px){
  .nav{display:none}
  .burger{display:grid}
  :root{--hdr:68px}
  .logo img{height:38px}
}

/* ---------- Hero Startseite ---------- */
.hero{background:var(--stone);padding:calc(var(--hdr) + clamp(36px,6vw,90px)) 0 clamp(56px,7vw,110px);position:relative;overflow:clip}
.hero__grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(32px,5vw,80px);align-items:center}
.hero h1 em{font-style:italic}
.hero .lead{margin-top:24px;color:#3f3f3b}
.hero .btns{margin-top:34px}
.hero__proof{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;margin-top:38px}
.hero__media{position:relative}
.hero__img{border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/5;background:var(--sand-2)}
.hero__img img{width:100%;height:100%;object-fit:cover}
.float{
  position:absolute;background:var(--paper);border-radius:20px;padding:14px 18px;
  box-shadow:0 28px 60px -30px #0000006b;display:flex;align-items:center;gap:12px;
  font-size:12.5px;line-height:1.4;animation:schweben 7s ease-in-out infinite;
}
.float b{display:block;font-size:13.5px}
.float--a{left:-34px;bottom:14%}
.float--b{right:-22px;top:9%;animation-delay:-3.5s;background:var(--ink);color:var(--paper)}
.float--b span{color:var(--muted-dark)}
.float__num{font-family:var(--serif);font-size:34px;line-height:1;font-weight:500}
.float__ico{width:40px;height:40px;border-radius:50%;background:var(--lime);display:grid;place-items:center;flex:none}
.float__ico svg{width:19px;height:19px}
@keyframes schweben{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@media (max-width:980px){
  .hero__grid{grid-template-columns:1fr}
  .hero__img{aspect-ratio:4/3.4}
  .float--a{left:12px;bottom:-22px}
  .float--b{right:12px;top:-18px}
}

/* ---------- Google-Siegel ---------- */
.gbadge{
  display:inline-flex;align-items:center;gap:12px;background:var(--paper);
  border-radius:16px;padding:11px 16px 11px 12px;box-shadow:0 18px 40px -26px #00000059;
  transition:transform .3s var(--ease);
}
a.gbadge:hover{transform:translateY(-2px)}
.gbadge img{width:28px;height:28px}
.gbadge__t{font-size:12px;line-height:1.35;color:var(--muted)}
.gbadge__t b{display:block;font-size:13px;color:var(--ink)}
.gbadge__score{display:flex;align-items:center;gap:7px}
.gbadge__score em{font-style:normal;font-family:var(--serif);font-size:24px;line-height:1;color:var(--ink);font-weight:600}
.stars{display:inline-flex;gap:2px}
.stars svg{width:14px;height:14px;fill:var(--star)}
.gbadge--dark{background:#ffffff12;box-shadow:none;border:1px solid var(--hair-dark)}
.gbadge--dark .gbadge__t{color:var(--muted-dark)}
.gbadge--dark .gbadge__t b,.gbadge--dark .gbadge__score em{color:var(--paper)}
.proofline{display:flex;align-items:center;gap:10px;font-size:13px;color:#4b4b47}
.proofline i{width:22px;height:22px;border-radius:50%;background:var(--ink);color:var(--paper);display:grid;place-items:center;flex:none}
.proofline i svg{width:12px;height:12px}

/* ---------- Kennzahlen ---------- */
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--hair);border-radius:var(--r-md);overflow:hidden}
.fact{background:var(--paper);padding:clamp(22px,2.6vw,36px)}
.fact b{display:block;font-family:var(--serif);font-weight:500;font-size:clamp(2.2rem,3.6vw,3.2rem);line-height:1}
.fact span{display:block;margin-top:10px;font-size:13.5px;color:var(--muted);line-height:1.5}
@media (max-width:760px){.facts{grid-template-columns:1fr 1fr}}

/* ---------- Vorteile ---------- */
.why{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.6vw,22px)}
.why__card{background:var(--paper);border-radius:var(--r-md);padding:clamp(24px,2.4vw,32px);display:grid;gap:14px;align-content:start;border:1px solid var(--hair)}
.sec--sand .why__card{border-color:transparent}
.sec--ink .why__card{background:#ffffff0d;border-color:var(--hair-dark)}
.ico{width:52px;height:52px;border-radius:50%;background:#ededed;color:var(--ink);display:grid;place-items:center;flex:none}
.ico svg{width:22px;height:22px}
.sec--ink .ico{background:#ffffff14;color:var(--paper)}
.sec--sand .ico{background:var(--paper)}
.why__card p{font-size:14.5px;color:var(--muted);line-height:1.6}
.sec--ink .why__card p{color:var(--muted-dark)}
@media (max-width:1080px){.why{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.why{grid-template-columns:1fr}}

/* ---------- Zweispaltig mit Bild ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5.5vw,96px);align-items:center}
.split__img{border-radius:var(--r-lg);overflow:hidden;aspect-ratio:5/6;background:var(--sand-2)}
.split__img img{width:100%;height:100%;object-fit:cover}
.split__txt{display:grid;gap:20px;align-content:start}
.split--flip .split__img{order:2}
.sign{display:flex;align-items:center;gap:14px;margin-top:10px}
.sign img{width:54px;height:54px;border-radius:50%;object-fit:cover}
.sign b{display:block;font-size:14.5px}
.sign span{font-size:13px;color:var(--muted)}
@media (max-width:900px){.split{grid-template-columns:1fr}.split--flip .split__img{order:0}.split__img{aspect-ratio:4/3.3}}

/* ---------- Ablauf ---------- */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.6vw,22px);counter-reset:s}
.step{border-top:1px solid #00000040;padding-top:22px;display:grid;gap:12px;align-content:start}
.sec--ink .step{border-color:#ffffff40}
.step__n{font-family:var(--serif);font-size:15px;color:var(--muted)}
.sec--ink .step__n{color:var(--muted-dark)}
.step p{font-size:14.5px;color:var(--muted);line-height:1.6}
.sec--ink .step p{color:var(--muted-dark)}
.steps--3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){.steps,.steps--3{grid-template-columns:1fr 1fr;gap:34px 20px}}
@media (max-width:540px){.steps,.steps--3{grid-template-columns:1fr}}

/* ---------- Referenzen ---------- */
.refs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.6vw,22px)}
.refs--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.ref{display:grid;gap:14px;align-content:start}
.ref__img{position:relative;border-radius:var(--r-md);overflow:hidden;aspect-ratio:4/3.1;background:var(--sand-2)}
.ref__img img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.ref:hover .ref__img img{transform:scale(1.04)}
.sold{
  position:absolute;left:0;top:16px;background:var(--ink);color:var(--paper);
  border-radius:0 8px 8px 0;padding:7px 14px 7px 12px;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;line-height:1;
}
.ref__t{font-family:var(--serif);font-size:1.22rem;line-height:1.2}
.ref__m{font-size:13px;color:var(--muted);line-height:1.5;margin-top:3px}
.sec--ink .ref__m{color:var(--muted-dark)}
.ref__tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.ref__tags span{font-size:11.5px;border:1px solid var(--hair);border-radius:999px;padding:3px 10px;color:#4b4b47}
.sec--sand .ref__tags span{border-color:#00000024}
@media (max-width:1080px){.refs,.refs--3{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.refs,.refs--3{grid-template-columns:1fr}}
/* Waagerechter Lauf auf dem Handy */
@media (max-width:760px){
  .refs--lauf{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;margin:0 calc(-1*var(--gut));padding:0 var(--gut) 6px;scrollbar-width:none}
  .refs--lauf::-webkit-scrollbar{display:none}
  .refs--lauf .ref{flex:0 0 78%;scroll-snap-align:start}
}

/* ---------- FAQ ---------- */
.faq{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,5vw,90px);align-items:start}
.faq__side{position:sticky;top:calc(var(--hdr) + 30px);display:grid;gap:20px}
.qa{border-bottom:1px solid #00000024}
.qa summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;align-items:center;padding:22px 0;font-family:var(--serif);font-size:clamp(1.15rem,1.6vw,1.35rem);line-height:1.3}
.qa summary::-webkit-details-marker{display:none}
.qa summary i{width:32px;height:32px;border-radius:50%;border:1px solid #00000026;flex:none;position:relative;transition:background .3s,transform .3s var(--ease)}
.qa summary i::before,.qa summary i::after{content:"";position:absolute;left:50%;top:50%;width:11px;height:1.3px;background:currentColor;transform:translate(-50%,-50%)}
.qa summary i::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .3s var(--ease)}
.qa[open] summary i{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.qa[open] summary i::after{transform:translate(-50%,-50%) rotate(0)}
.qa p{padding:0 0 24px;font-size:15px;color:#4b4b47;max-width:64ch}
@media (max-width:900px){.faq{grid-template-columns:1fr}.faq__side{position:static}}

/* ---------- CTA-Band ---------- */
.cta{background:var(--ink);color:var(--paper);border-radius:var(--r-lg);padding:clamp(34px,5vw,72px);display:grid;grid-template-columns:minmax(0,1.3fr) auto;gap:30px 50px;align-items:center;position:relative;overflow:hidden}
.cta::after{content:"&";position:absolute;right:-20px;bottom:-110px;font-family:var(--serif);font-size:380px;line-height:1;color:#ffffff08;pointer-events:none}
.cta h2{max-width:20ch}
.cta p{color:#c9c9c3;margin-top:16px;max-width:54ch}
.cta .btns{position:relative;z-index:1}
@media (max-width:860px){.cta{grid-template-columns:1fr}}

/* ---------- Seitenkopf Unterseiten ---------- */
.phead{background:var(--stone);padding:calc(var(--hdr) + clamp(40px,6vw,90px)) 0 clamp(44px,5vw,80px)}
.phead .lead{margin-top:20px}

/* ---------- Fußzeile ---------- */
.ftr{background:var(--ink);color:var(--paper);padding:clamp(56px,6vw,90px) 0 28px;font-size:14px}
.ftr__top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:36px}
.ftr__logo{height:46px;width:auto;filter:invert(1)}
.ftr__claim{margin-top:20px;color:var(--muted-dark);max-width:34ch;line-height:1.6}
.ftr h4{font-family:var(--sans);font-weight:400;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-dark);margin-bottom:16px}
.ftr ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ftr a{opacity:.86;transition:opacity .25s}
.ftr a:hover{opacity:1}
.ftr__bot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:clamp(40px,5vw,70px);padding-top:22px;border-top:1px solid var(--hair-dark);color:var(--muted-dark);font-size:12.5px}
@media (max-width:900px){.ftr__top{grid-template-columns:1fr 1fr}.ftr__brand{grid-column:1/-1}}
@media (max-width:480px){.ftr__top{grid-template-columns:1fr}}

/* ---------- Fester Knopf auf dem Handy ---------- */
.sticky{
  position:fixed;left:12px;right:12px;bottom:12px;z-index:70;display:none;
  align-items:center;justify-content:space-between;gap:12px;background:var(--ink);color:var(--paper);
  border-radius:999px;padding:8px 8px 8px 22px;box-shadow:0 20px 50px -18px #00000080;
  transform:translateY(140%);transition:transform .45s var(--ease);
}
.sticky span{font-size:13px;line-height:1.3}
.sticky .btn{padding:12px 18px;font-size:13px}
.sticky.on{transform:none}
@media (max-width:760px){.sticky{display:flex}}

/* ---------- Rechtstexte ---------- */
.legal{max-width:780px}
.legal h2{font-size:clamp(1.5rem,2.4vw,2rem);margin:2.4rem 0 .8rem}
.legal h3{font-size:1.2rem;margin:1.8rem 0 .5rem}
.legal p,.legal li{font-size:15px;color:#3f3f3b;margin-bottom:.8rem}
.legal a{text-decoration:underline;text-underline-offset:3px}

/* ---------- Datenschutz-Hinweis ---------- */
.hinweis{
  position:fixed;left:16px;bottom:16px;z-index:95;max-width:380px;background:var(--paper);
  border-radius:20px;padding:18px 20px;box-shadow:0 30px 70px -24px #00000059;border:1px solid var(--hair);
  font-size:13px;line-height:1.55;color:#4b4b47;display:grid;gap:12px;
  animation:hin .5s var(--ease) both;
}
.hinweis a{text-decoration:underline}
.hinweis .btn{justify-self:start;padding:10px 18px;font-size:13px}
@keyframes hin{from{opacity:0;transform:translateY(16px)}}
@media (max-width:760px){.hinweis{left:12px;right:12px;bottom:12px;max-width:none}}

/* ---------- Scroll-Animationen ---------- */
.rv{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv[data-d="1"]{transition-delay:.08s}.rv[data-d="2"]{transition-delay:.16s}.rv[data-d="3"]{transition-delay:.24s}
@supports (animation-timeline:view()){
  .zoom img{animation:zoomin linear both;animation-timeline:view();animation-range:entry 0% cover 60%}
  @keyframes zoomin{from{transform:scale(1.12)}to{transform:scale(1)}}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition-duration:.001ms!important}
  html{scroll-behavior:auto}
  .rv{opacity:1;transform:none}
}

/* ============================================================
   ANKAUFS-FUNNEL
   ============================================================ */
.fnpage{background:var(--sand);padding:calc(var(--hdr) + clamp(28px,4vw,64px)) 0 clamp(56px,6vw,96px);position:relative;overflow:clip}
.fnpage::after{content:"";position:absolute;left:0;right:0;bottom:0;height:40%;background:linear-gradient(to bottom,transparent,var(--sand));pointer-events:none}
.fnpage>.shell{position:relative;z-index:1}
.fnticker{display:inline-flex;align-items:center;gap:9px;background:var(--paper);border-radius:999px;padding:7px 14px 7px 10px;font-size:12.5px;margin-bottom:22px;box-shadow:0 14px 30px -22px #00000059}
.fnticker i{width:8px;height:8px;border-radius:50%;background:#2fb36b;box-shadow:0 0 0 0 #2fb36b80;animation:puls 2s infinite}
@keyframes puls{70%{box-shadow:0 0 0 8px #2fb36b00}100%{box-shadow:0 0 0 0 #2fb36b00}}
.fngrid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(30px,4.4vw,72px);align-items:start}
.fnside{position:sticky;top:calc(var(--hdr) + 24px)}
.fnside h1{font-size:clamp(2rem,3.4vw,2.9rem);line-height:1.08}
.fnside__sub{margin-top:18px;color:#3f3f3b;font-size:1rem;line-height:1.7;max-width:46ch}
.fnplus{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:12px}
.fnplus li{display:flex;align-items:flex-start;gap:12px;font-size:14.5px;line-height:1.5}
.fnplus li b{display:block}
.fnplus li span{color:#4b4b47}
.fnplus i{flex:none;width:22px;height:22px;border-radius:50%;background:var(--ink);color:var(--paper);display:grid;place-items:center;margin-top:1px}
.fnplus i svg{width:12px;height:12px}
.fntrust{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:28px}
.fntrust .gbadge{width:100%}
.fnmini{background:var(--paper);border-radius:16px;padding:11px 16px;box-shadow:0 18px 40px -26px #00000059;display:flex;align-items:center;gap:12px;font-size:12px;line-height:1.35;color:var(--muted)}
.fnmini b{display:block;color:var(--ink);font-size:13px}
.fnmini .float__num{font-size:26px;color:var(--ink)}
.fnperson{margin-top:12px;background:var(--ink);color:var(--paper);border-radius:18px;padding:14px 16px;display:flex;align-items:center;gap:14px}
.fnperson img{width:52px;height:52px;border-radius:50%;object-fit:cover;object-position:50% 20%;flex:none}
.fnperson__t{min-width:0;font-size:12.5px;color:var(--muted-dark);line-height:1.45}
.fnperson__t b{display:block;color:var(--paper);font-size:13.5px}
.fnperson__tel{margin-left:auto;text-align:right;flex:none}
.fnperson__tel span{display:block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted-dark)}
.fnperson__tel a{font-family:var(--serif);font-size:18px;color:var(--lime);white-space:nowrap}

.fn{background:var(--paper);border-radius:var(--r-lg);box-shadow:0 44px 96px -40px #00000066;overflow:hidden}
.fn__head{padding:clamp(20px,2.2vw,28px) clamp(20px,2.8vw,40px) 0}
.fn__meta{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:12px}
.fn__step{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.fn__time{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:var(--muted)}
.fn__time svg{width:13px;height:13px}
.fn__bar{height:4px;border-radius:999px;background:#00000012;overflow:hidden}
.fn__bar i{display:block;height:100%;width:16.6%;border-radius:999px;background:var(--ink);transition:width .55s var(--ease)}
.fn__body{padding:clamp(22px,2.6vw,34px) clamp(20px,2.8vw,40px) clamp(24px,2.6vw,34px)}
.fstep{display:none;animation:fnin .5s var(--ease) both}
.fstep.is-on{display:block}
@keyframes fnin{from{opacity:0;transform:translateY(14px)}}
.fstep__h{font-size:clamp(1.4rem,2.1vw,1.8rem);line-height:1.16}
.fstep__p{margin-top:.7rem;font-size:14.4px;color:var(--muted);line-height:1.6;max-width:52ch}
.fstep__grp{margin-top:clamp(20px,2.2vw,26px)}
.fstep__lbl{font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.ftiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:clamp(20px,2.2vw,28px)}
.ftile{position:relative}
.ftile input,.fopt input{position:absolute;opacity:0;width:0;height:0}
.ftile label{
  display:flex;flex-direction:column;gap:12px;cursor:pointer;height:100%;
  border:1px solid #00000017;border-radius:18px;padding:18px 18px 16px;background:var(--paper);min-height:128px;
  transition:border-color .3s,background .3s,transform .35s var(--ease),box-shadow .35s var(--ease);
}
.ftile label:hover{transform:translateY(-2px);box-shadow:0 18px 38px -22px #00000047;border-color:#00000026}
.ftile input:checked+label{border-color:var(--ink);background:var(--lime)}
.ftile input:focus-visible+label,.fopt input:focus-visible+label{outline:2px solid var(--ink);outline-offset:3px}
.ftile__ico{width:34px;height:34px}
.ftile__ico svg{width:100%;height:100%}
.ftile b{font-size:14.8px;line-height:1.25;display:block}
.ftile small{display:block;font-size:12px;color:var(--muted);line-height:1.4;margin-top:3px}
.ftile input:checked+label small{color:#4a4a44}
.fopts{display:flex;flex-wrap:wrap;gap:9px}
.fopt{position:relative}
.fopt label{display:inline-flex;align-items:center;cursor:pointer;border:1px solid #00000017;border-radius:999px;padding:10px 17px;font-size:13.8px;line-height:1.3;transition:all .25s ease;background:var(--paper)}
.fopt label:hover{border-color:#00000038}
.fopt input:checked+label{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.fgr{display:grid;grid-template-columns:1fr 1fr;gap:clamp(13px,1.4vw,18px)}
.fgr .full{grid-column:1/-1}
.ffield label{display:block;font-size:12.8px;margin-bottom:.42rem}
.ffield label em{font-style:normal;color:var(--muted)}
.fn input[type=text],.fn input[type=email],.fn input[type=tel],.fn select,.fn textarea{
  width:100%;border:1px solid #0000001f;border-radius:12px;background:var(--paper);
  padding:.85em 1em;font-family:inherit;font-weight:300;font-size:16px;color:var(--ink);
  transition:border-color .25s,box-shadow .25s;
}
.fn textarea{min-height:96px;resize:vertical}
.fn select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 20px) 53%,calc(100% - 14px) 53%;background-size:6px 6px;background-repeat:no-repeat;padding-right:2.6em}
.fn :is(input,select,textarea):focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 3px #0000000d}
.fn :is(input,select,textarea).err{border-color:#c0392b;box-shadow:0 0 0 3px #c0392b1a}
.fn input::placeholder,.fn textarea::placeholder{color:#b2b2ad}
.fsuffix{position:relative;display:block}
.fsuffix input{padding-right:3.2em}
.fsuffix span{position:absolute;right:15px;top:50%;transform:translateY(-50%);font-size:12.6px;color:var(--muted);pointer-events:none}
.fcheck{display:flex;gap:.7rem;align-items:flex-start;font-size:12.8px;color:#5b5b5b;line-height:1.55;margin-top:18px;cursor:pointer}
.fcheck input{width:18px;height:18px;margin:2px 0 0;flex:none;accent-color:var(--ink)}
.fcheck a{text-decoration:underline}
.fcheck.err{color:#c0392b}
.ferr{color:#c0392b;font-size:13px;margin-top:14px;min-height:0}
.ferr:empty{display:none}
.fnav{display:flex;flex-wrap:wrap;align-items:center;gap:14px 18px;margin-top:clamp(22px,2.4vw,30px)}
.fback{background:none;border:0;cursor:pointer;font-size:13.5px;color:var(--muted);display:inline-flex;align-items:center;gap:6px;padding:8px 4px}
.fback:hover{color:var(--ink)}
.fback svg{width:14px;height:14px}
.fnote{display:flex;align-items:flex-start;gap:9px;margin-top:20px;padding-top:18px;border-top:1px solid var(--hair);font-size:12.4px;color:var(--muted);line-height:1.5}
.fnote svg{width:15px;height:15px;flex:none;margin-top:1px}
.fdone{text-align:center;padding:clamp(12px,2vw,24px) 0}
.fdone__ico{width:72px;height:72px;margin:0 auto 22px;border-radius:50%;background:var(--ink);color:var(--paper);display:grid;place-items:center}
.fdone__ico svg{width:32px;height:32px}
.fdone p{color:var(--muted);margin:14px auto 0;max-width:46ch;font-size:15px}
.fdone__steps{display:grid;gap:10px;text-align:left;max-width:420px;margin:26px auto 0}
.fdone__steps div{display:flex;gap:12px;align-items:flex-start;background:var(--sand);border-radius:14px;padding:12px 14px;font-size:13.5px;line-height:1.5}
.fdone__steps b{font-family:var(--serif);font-size:18px;line-height:1.2}
@media (max-width:1000px){
  .fngrid{grid-template-columns:1fr}
  .fnside{position:static}
  .fnproof{order:3}
  .fnside{display:contents}
  .fnlead{order:1}
  .fn{order:2}
}
@media (max-width:520px){
  .ftiles{grid-template-columns:1fr;gap:10px}
  .ftile label{flex-direction:row;align-items:center;padding:14px 16px;min-height:0;gap:14px}
  .ftile__ico{width:30px;height:30px;flex:none}
  .fgr{grid-template-columns:1fr}
  .fntrust{grid-template-columns:1fr}
  .fnperson__tel span{display:none}
}

/* ============================================================
   GOOGLE-BEWERTUNGEN – wie bei Concept Living
   Überschrift, große 5,0, zwei gegenläufige Bänder mit dunklen
   Karten; am Telefon eine Reihe zum Wischen (seite.js rückt weiter).
   ============================================================ */
.gsec{padding:var(--sec) 0;overflow:clip}
.ghead{text-align:center;max-width:760px;margin:0 auto}
.ghead h2{margin-bottom:clamp(14px,1.6vw,24px)}
.gscore{display:flex;align-items:center;justify-content:center;gap:clamp(16px,2vw,30px);flex-wrap:wrap}
.gscore__logo{width:clamp(26px,2.6vw,36px);height:auto}
.gscore__num{font-family:var(--serif);font-weight:500;font-size:clamp(2.8rem,5vw,4.2rem);line-height:.88;font-variant-numeric:lining-nums}
.gscore__meta{text-align:left}
.gscore__stars{display:flex;gap:.3rem;margin-bottom:.5rem}
.gscore__stars svg{width:17px;height:17px;fill:var(--star);opacity:0;transform:scale(.4) rotate(-25deg);transition:opacity .5s var(--ease),transform .6s var(--ease)}
.ghead.in .gscore__stars svg{opacity:1;transform:none}
.ghead.in .gscore__stars svg:nth-child(2){transition-delay:.09s}
.ghead.in .gscore__stars svg:nth-child(3){transition-delay:.18s}
.ghead.in .gscore__stars svg:nth-child(4){transition-delay:.27s}
.ghead.in .gscore__stars svg:nth-child(5){transition-delay:.36s}
.gscore__meta span{color:var(--muted);font-size:.95rem}
.ghead .btn{margin-top:clamp(18px,1.8vw,26px)}
.revwrap{position:relative;margin-top:clamp(26px,2.6vw,38px);overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.revwrap+.revwrap{margin-top:10px}
.revtrack{display:flex;gap:10px;width:max-content;animation:revslide 70s linear infinite}
.revtrack--back{animation-direction:reverse;animation-duration:84s}
.revwrap:hover .revtrack{animation-play-state:paused}
@keyframes revslide{to{transform:translateX(-50%)}}
.grev{flex:0 0 clamp(250px,22vw,310px);margin:0;border-radius:14px;min-height:196px;
  background:#0c0c0c;border:1px solid #0c0c0c;color:#fff;box-shadow:0 22px 44px -26px #00000073;
  padding:clamp(16px,1.5vw,22px);display:flex;flex-direction:column;gap:.7rem;
  transition:transform .5s var(--ease),background .5s var(--ease)}
.grev:hover{transform:translateY(-4px);background:#151515}
.grev__top{display:flex;align-items:center;gap:.75rem}
.grev__ava{width:34px;height:34px;border-radius:50%;background:#ffffff1a;color:#fff;display:grid;place-items:center;font-size:1rem;font-weight:500;flex:none}
.grev__who{min-width:0;flex:1}
.grev__who b{display:block;font-weight:500;font-size:.9rem;white-space:nowrap}
.grev__who i{font-style:normal;font-size:.78rem;color:#ffffff80}
.grev__g{width:18px;height:18px;flex:none}
.grev__stars{display:flex;gap:.15rem}
.grev__stars svg{width:13px;height:13px;fill:var(--star)}
.grev p{color:#fff;font-size:.89rem;line-height:1.62;flex:1;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.gfoot{margin-top:clamp(22px,2.6vw,38px);padding-top:clamp(18px,2vw,28px);border-top:1px solid #0000001f;
  display:flex;align-items:flex-start;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;font-size:.86rem}
.gfoot__link{text-decoration:underline;text-underline-offset:3px;text-decoration-color:#00000059;padding:4px 0}
.gfoot__link:hover{text-decoration-color:var(--ink)}
.gfoot__note{color:#00000099;max-width:46ch}
.gfoot__note b{display:block;color:var(--ink);font-weight:500;margin-bottom:.2rem}
.sec--stone .gfoot,.sec--sand .gfoot{border-top-color:#00000026}
@media (max-width:620px){
  .gscore{gap:12px}
  .gscore__num{font-size:2.9rem}
  .revwrap{overflow-x:auto;overflow-y:hidden;-webkit-mask-image:none;mask-image:none;
    margin:22px calc(-1*var(--gut)) 0;padding:2px var(--gut) 18px;
    scroll-snap-type:x mandatory;scroll-padding-inline:var(--gut);scrollbar-width:none}
  .revwrap::-webkit-scrollbar{display:none}
  .revwrap+.revwrap{display:none}
  .revtrack{animation:none!important;transform:none!important;width:auto;gap:12px}
  .revtrack .grev[aria-hidden]{display:none}
  .grev{flex:0 0 84%;min-height:0;scroll-snap-align:start;padding:18px 18px 20px;border-radius:16px;gap:.8rem}
  .grev:hover{transform:none}
  .grev p{-webkit-line-clamp:8;font-size:.92rem}
  .gfoot{flex-direction:column;gap:14px}
}

/* Google-Zeile im Kopfbereich (wie Concept Living) */
.gline{display:inline-flex;flex-wrap:wrap;align-items:center;gap:.55rem;row-gap:.4rem;font-size:.95rem;line-height:1;color:var(--ink)}
.gline img{width:22px;height:22px;flex:none}
.gline .stars svg{width:16px;height:16px}
.gline b{font-weight:500;font-size:1.08rem;margin-left:.15rem}
.gline i{width:1px;height:1.15em;background:#00000038;margin-inline:.5rem}
.gline:hover span{text-decoration:underline;text-underline-offset:3px}

/* Google-Karte im Funnel (wie Concept Living) */
.gcard{display:block;background:var(--paper);border-radius:18px;overflow:hidden;border-top:4px solid var(--lime);color:var(--ink);
  box-shadow:0 20px 44px -26px #00000052;transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.gcard:hover{transform:translateY(-2px);box-shadow:0 26px 52px -26px #0000005e}
.gcard__top{display:flex;align-items:center;gap:clamp(13px,1.6vw,18px);padding:clamp(15px,1.8vw,19px) clamp(16px,1.9vw,20px) clamp(13px,1.5vw,16px)}
.gcard__g{flex:none;width:clamp(38px,4.2vw,46px);height:auto}
.gcard__main{display:block;min-width:0;flex:1 1 auto}
.gcard__main b{display:block;font-weight:500;font-size:clamp(14px,1.5vw,15.4px);line-height:1.2}
.gcard__score{display:flex;align-items:center;gap:9px;margin-top:6px;flex-wrap:wrap}
.gcard__score em{font-family:var(--serif);font-style:normal;font-weight:500;font-size:clamp(1.5rem,2.4vw,1.85rem);line-height:1;font-variant-numeric:lining-nums}
.gcard__score .stars svg{width:15px;height:15px}
.gcard__score i{font-style:normal;font-size:12.4px;color:var(--muted)}
.gcard__go{flex:none;width:30px;height:30px;border-radius:50%;border:1px solid var(--hair);display:grid;place-items:center;color:var(--muted);transition:background .35s,color .35s,border-color .35s,transform .4s var(--ease)}
.gcard__go svg{width:14px;height:14px}
.gcard:hover .gcard__go{background:var(--ink);color:var(--paper);border-color:var(--ink);transform:translateX(2px)}
.gcard__fuss{display:flex;flex-wrap:wrap;align-items:baseline;gap:3px 10px;margin:0 clamp(16px,1.9vw,20px);padding:11px 0 13px;border-top:1px solid var(--hair);font-size:12.4px;color:var(--muted);line-height:1.4}
.gcard__fuss b{font-weight:500;color:var(--ink)}
.gcard__fuss>span{margin-left:auto;font-size:11.4px;white-space:nowrap}

/* Kontaktkarte im gleichen Stil */
.kcard{display:flex;align-items:center;gap:14px;background:var(--paper);border-radius:18px;padding:14px 18px;box-shadow:0 20px 44px -26px #00000052}
.kcard img{width:52px;height:52px;border-radius:50%;object-fit:cover;object-position:50% 20%;flex:none}
.kcard__t{min-width:0;font-size:12.4px;color:var(--muted);line-height:1.45}
.kcard__t b{display:block;color:var(--ink);font-weight:500;font-size:13.5px}
.kcard__tel{margin-left:auto;text-align:right;flex:none}
.kcard__tel span{display:block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.kcard__tel a{font-family:var(--serif);font-size:18px;white-space:nowrap;font-variant-numeric:lining-nums}
.kcard__tel a:hover{text-decoration:underline;text-underline-offset:3px}
.fntrust{display:grid;grid-template-columns:1fr;gap:12px;margin-top:28px}
@media (max-width:520px){
  .gcard__top{gap:11px;padding:14px 14px 11px}
  .gcard__g{width:34px}
  .gcard__go{display:none}
  .gcard__fuss{margin-inline:14px}
  .gcard__fuss>span{margin-left:0;flex:1 0 100%;font-size:11px}
  .kcard{padding:12px 14px}
  .kcard__tel span{display:none}
  .kcard__tel a{font-size:16px}
}

/* ============================================================
   ABLAUF – Kreise, Schritt-Marken und geschwungene Pfeile
   (wie „So geht es weiter“ bei Concept Living)
   ============================================================ */
.wie{display:grid;align-items:start;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);gap:clamp(6px,1vw,16px)}
.wie__i{text-align:center;min-width:0;display:flex;flex-direction:column;align-items:center}
.wie__marke{display:inline-block;font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--muted);border:1px solid #00000026;border-radius:999px;padding:5px 13px}
.wie__kreis{display:grid;place-items:center;margin-top:clamp(16px,1.8vw,22px);width:clamp(88px,8.6vw,112px);aspect-ratio:1;border-radius:50%;
  border:1px solid #00000014;background:var(--paper);box-shadow:0 18px 38px -28px #00000080;
  color:var(--ink);line-height:1;transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.wie__kreis svg{width:clamp(30px,3vw,38px);height:auto}
.wie__i:hover .wie__kreis{transform:translateY(-4px) rotate(-4deg);box-shadow:0 24px 44px -26px #0000008c}
.wie__t{margin:clamp(16px,1.8vw,22px) 0 0;font-size:clamp(1.08rem,1.35vw,1.25rem)}
.wie__strich{display:block;width:56px;height:1px;background:#00000020;margin:13px 0}
.wie__i p{font-size:14px;line-height:1.66;color:var(--muted);max-width:30ch}
.wie__pfeil{align-self:start;color:#00000047;width:clamp(36px,4.4vw,72px);margin-top:calc(clamp(16px,1.8vw,22px) + clamp(44px,4.3vw,56px) + 17px)}
.wie__pfeil svg{display:block;width:100%;height:24px}
.wie__pfeil path{stroke-dasharray:120;stroke-dashoffset:120;transition:stroke-dashoffset 1.1s var(--ease) .3s}
.wie__pfeil.in path{stroke-dashoffset:0}
.sec--ink .wie__marke{color:var(--muted-dark);border-color:#ffffff33}
.sec--ink .wie__kreis{background:#ffffff0f;border-color:#ffffff1f;color:var(--paper)}
.sec--ink .wie__strich{background:#ffffff26}
.sec--ink .wie__i p{color:var(--muted-dark)}
.sec--ink .wie__pfeil{color:#ffffff4d}
@media (max-width:900px){
  .wie{grid-template-columns:minmax(0,1fr);gap:0;justify-items:center}
  .wie__i p{max-width:40ch}
  .wie__pfeil{width:64px;height:64px;display:grid;place-items:center;align-self:center;margin:14px 0}
  .wie__pfeil svg{width:64px;transform:rotate(90deg)}
}

/* ============================================================
   ANKAUF-CTA auf der Startseite
   ============================================================ */
.ankauf{background:var(--ink);color:var(--paper);border-radius:var(--r-lg);padding:clamp(28px,4.4vw,64px);
  display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(28px,4vw,64px);align-items:center;position:relative;overflow:hidden}
.ankauf::after{content:"&";position:absolute;right:-30px;top:-120px;font-family:var(--serif);font-size:420px;line-height:1;color:#ffffff07;pointer-events:none}
.ankauf h2{max-width:18ch}
.ankauf .lead{color:#c9c9c3;margin-top:14px}
.atiles{display:grid;gap:10px;margin-top:clamp(22px,2.6vw,32px);position:relative;z-index:1}
.atile{display:flex;align-items:center;gap:16px;border:1px solid #ffffff21;background:#ffffff0a;border-radius:18px;padding:14px 18px;transition:background .3s,border-color .3s,transform .35s var(--ease)}
.atile:hover{background:var(--lime);border-color:var(--lime);color:var(--ink);transform:translateX(4px)}
.atile__ico{width:34px;height:34px;flex:none}
.atile__ico svg{width:100%;height:100%}
.atile b{display:block;font-weight:500;font-size:15px}
.atile small{display:block;font-size:12.4px;color:var(--muted-dark)}
.atile:hover small{color:#4a4a44}
.atile__go{margin-left:auto;width:34px;height:34px;border-radius:50%;border:1px solid #ffffff33;display:grid;place-items:center;flex:none;transition:all .3s}
.atile__go svg{width:15px;height:15px}
.atile:hover .atile__go{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.ankauf__side{display:grid;gap:12px;position:relative;z-index:1}
.ankauf__side .fnplus li,.ankauf__side .fnplus li span{color:#e4e4de}
.ankauf__side .fnplus i{background:var(--paper);color:var(--ink)}
.ankauf__side .kcard{color:var(--ink)}
@media (max-width:900px){.ankauf{grid-template-columns:1fr}}

/* Seitenkopf mit Foto (Referenzen) */
.phead--bild .phead__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,80px);align-items:center}
.phead__img{border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/3.2;position:relative;box-shadow:0 40px 80px -46px #00000080}
.phead__img img{width:100%;height:100%;object-fit:cover}
.phead__img .sold{top:22px}
@media (max-width:900px){.phead--bild .phead__grid{grid-template-columns:1fr}}

/* Funnel: Karte so hoch wie die linke Spalte, Hinweis unten bündig */
@media (min-width:1001px){
  .fngrid{align-items:stretch}
  .fn{display:flex;flex-direction:column}
  .fn__body{flex:1;display:flex;flex-direction:column}
  .fn__body form{flex:1;display:flex;flex-direction:column}
  .fstep.is-on{display:flex;flex-direction:column;flex:1}
  .fstep .fnote{margin-top:auto}
  .fstep .fnav+.fnote,.fstep .ferr+.fnote{margin-top:auto}
}

/* ============================================================
   KOPFBEREICH – schwarze Karte vor großem Foto
   ============================================================ */
.hx{background:var(--stone);padding:calc(var(--hdr) + clamp(20px,3vw,44px)) 0 clamp(48px,6vw,90px)}
.hx__grid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);align-items:center}
.hx__panel{grid-column:1;grid-row:1;position:relative;z-index:2;background:var(--ink);color:var(--paper);border-radius:var(--r-lg);
  padding:clamp(28px,3.6vw,52px);margin-right:clamp(-120px,-8vw,-60px);box-shadow:0 44px 96px -46px #000000d9}
.hx__panel h1{color:var(--paper)}
.hx__panel .lead{color:#b4b4ae;margin-top:20px;max-width:44ch}
.hx__panel .btns{margin-top:28px}
.hx__panel .btn--line{border-color:#ffffff40;color:var(--paper)}
.hx__panel .btn--line:hover{border-color:var(--paper);background:#ffffff14}
.hx__panel .gline{color:var(--paper);margin-bottom:22px}
.hx__panel .gline i{background:#ffffff4d}
.hx__note{margin-top:26px;padding-top:20px;border-top:1px solid var(--hair-dark);font-size:12.5px;color:#8f8f8a}
.hx__media{grid-column:2;grid-row:1;position:relative;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:5/4.4;box-shadow:0 40px 80px -46px #00000080}
.hx__media img{width:100%;height:100%;object-fit:cover}
.hx__chip{position:absolute;right:18px;bottom:18px;display:flex;align-items:center;gap:12px;background:var(--paper);border-radius:16px;padding:10px 16px 10px 10px;box-shadow:0 20px 40px -22px #00000080;font-size:12.5px;line-height:1.35;color:var(--muted)}
.hx__chip img{width:44px;height:44px;border-radius:10px;object-fit:cover}
.hx__chip b{display:block;color:var(--ink);font-weight:500;font-size:13.5px}
.hx__lime{position:absolute;left:clamp(80px,9vw,140px);top:22px;background:var(--lime);color:var(--ink);border-radius:999px;padding:9px 16px;font-size:12.5px;font-weight:500;box-shadow:0 16px 30px -20px #00000080}
@media (max-width:980px){
  .hx__grid{grid-template-columns:1fr}
  .hx__panel{margin:0;grid-row:2;margin-top:-70px;margin-inline:12px}
  .hx__media{grid-column:1;grid-row:1;aspect-ratio:4/3.3}
  .hx__lime{left:16px;top:16px}
  .hx__chip{right:auto;left:16px;bottom:auto;top:62px}
}
@media (max-width:520px){.hx__panel{margin-inline:0;padding:24px 20px}.hx__chip{display:none}}

/* ============================================================
   VORTEILE – vier Karten mit kleinen Mockups (Farben wie im Muster)
   ============================================================ */
.vk__head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:clamp(28px,3vw,44px)}
.vk__nav{display:flex;gap:10px}
.vk__nav button{width:46px;height:46px;border-radius:50%;border:1px solid #00000033;background:transparent;cursor:pointer;display:grid;place-items:center;transition:background .25s,color .25s}
.vk__nav button:hover{background:var(--ink);color:var(--paper)}
.vk__nav svg{width:16px;height:16px}
.vk{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.vkc{position:relative;border-radius:var(--r-md);padding:clamp(22px,2.2vw,30px) clamp(20px,2vw,26px) 0;background:var(--sand-2);display:flex;flex-direction:column;overflow:hidden;min-height:430px;
  box-shadow:0 26px 50px -36px #00000059;transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.vkc:hover{transform:translateY(-6px);box-shadow:0 36px 64px -34px #00000073}
.vkc--ink{background:var(--ink);color:var(--paper)}
.vkc--lime{background:var(--lime)}
.vkc__nr{font-size:11px;letter-spacing:.14em;color:var(--muted)}
.vkc--ink .vkc__nr{color:var(--muted-dark)}
.vkc h3{margin-top:12px;font-size:clamp(1.2rem,1.6vw,1.4rem)}
.vkc p{margin-top:10px;font-size:13.8px;line-height:1.6;color:#55554f}
.vkc--ink p{color:#b4b4ae}
.vkc--lime p{color:#4a4a3c}
.vkc__mock{margin-top:auto;padding-top:22px;transform:translateY(14px);transition:transform .5s var(--ease)}
.vkc:hover .vkc__mock{transform:translateY(4px)}
.mk{background:var(--paper);color:var(--ink);border-radius:16px 16px 0 0;padding:16px 16px 22px;box-shadow:0 -10px 30px -18px #00000040;font-size:12.5px}
.mk__row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--hair)}
.mk__row:last-child{border-bottom:0}
.mk__row s{color:var(--muted)}
.mk__row--sum{font-weight:500;font-size:13.5px}
.mk__zero{font-family:var(--serif);font-size:30px;line-height:1;font-variant-numeric:lining-nums}
.mk__check{display:flex;align-items:center;gap:10px;padding:7px 0}
.mk__check i{width:18px;height:18px;border-radius:5px;background:var(--ink);color:var(--paper);display:grid;place-items:center;flex:none}
.mk__check i svg{width:11px;height:11px}
.mk__by{margin-top:10px;font-size:11px;color:var(--muted)}
.mk__foto{position:relative;border-radius:12px;overflow:hidden;aspect-ratio:4/2.6}
.mk__foto img{width:100%;height:100%;object-fit:cover}
.mk__stempel{position:absolute;right:10px;bottom:10px;background:var(--ink);color:var(--paper);border-radius:999px;padding:6px 12px;font-size:11px;display:inline-flex;align-items:center;gap:6px;transform:rotate(-4deg)}
.mk__stempel svg{width:11px;height:11px}
.mk__tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.mk__tags span{border:1px solid var(--hair);border-radius:999px;padding:4px 10px;font-size:11px}
.mk__vertrag small{display:block;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.mk__vertrag b{display:block;font-family:var(--serif);font-weight:500;font-size:20px;margin:4px 0 12px}
.mk__linie{height:7px;border-radius:4px;background:var(--sand);margin:6px 0}
.mk__unterschrift{display:flex;align-items:center;justify-content:space-between;margin-top:14px;padding-top:12px;border-top:1px dashed #00000033}
.mk__unterschrift span{font-family:var(--serif);font-style:italic;font-size:20px}
.mk__unterschrift em{font-style:normal;background:var(--ink);color:var(--paper);border-radius:999px;padding:5px 10px;font-size:10.5px}
@media (max-width:1080px){
  .vk{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;margin:0 calc(-1*var(--gut));padding:4px var(--gut) 30px;scrollbar-width:none}
  .vk::-webkit-scrollbar{display:none}
  .vkc{flex:0 0 min(78%,320px);scroll-snap-align:start;min-height:410px}
}
@media (min-width:1081px){.vk__nav{display:none}}

/* ============================================================
   VERGLEICH – interaktiv mit Umschalter
   ============================================================ */
.vx{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4vw,64px);align-items:start}
.vx__toggle{position:relative;display:inline-grid;grid-template-columns:1fr 1fr;background:var(--sand-2);border-radius:999px;padding:5px;box-shadow:inset 0 1px 3px #0000001a}
.vx__toggle button{position:relative;z-index:1;border:0;background:none;cursor:pointer;padding:12px 22px;border-radius:999px;font-size:14px;color:var(--muted);transition:color .35s}
.vx__toggle button[aria-selected=true]{color:var(--paper)}
.vx__thumb{position:absolute;top:5px;bottom:5px;left:5px;width:calc(50% - 5px);border-radius:999px;background:var(--ink);box-shadow:0 10px 20px -10px #000000a6;transition:transform .45s var(--ease)}
.vx[data-m=wir] .vx__thumb{transform:translateX(100%)}
.vx__stats{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}
.vx__stat{background:var(--paper);border-radius:18px;padding:16px 18px;box-shadow:0 20px 40px -30px #00000066}
.vx__stat small{display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.vx__stat b{display:block;margin-top:6px;font-family:var(--serif);font-weight:500;font-size:clamp(1.4rem,2.2vw,1.8rem);line-height:1.05;font-variant-numeric:lining-nums}
.vx__stat--wide{grid-column:1/-1}
.vx__bar{display:block;height:8px;border-radius:9px;background:var(--sand);margin-top:12px;overflow:hidden}
.vx__bar i{display:block;height:100%;border-radius:9px;background:var(--ink);width:100%;transition:width .8s var(--ease)}
.vx[data-m=wir] .vx__bar i{width:16%;background:var(--ink)}
.vx[data-m=wir] .vx__stat--wide{background:var(--lime)}
.vx [data-zeige]{display:none}
.vx[data-m=makler] [data-zeige=makler],.vx[data-m=wir] [data-zeige=wir]{display:revert}
.vx__side .btn{margin-top:22px}
.vx__karte{position:relative;background:var(--paper);border-radius:var(--r-lg);padding:clamp(24px,3vw,40px);box-shadow:0 44px 90px -50px #00000080;min-height:100%}
.vx[data-m=wir] .vx__karte{background:var(--ink);color:var(--paper)}
.vx__badge{position:absolute;top:-13px;right:24px;background:var(--lime);color:var(--ink);border-radius:999px;padding:7px 14px;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:500}
.vx__karte h3{font-size:clamp(1.3rem,1.9vw,1.6rem)}
.vx__karte ol{list-style:none;margin:18px 0 0;padding:0}
.vx__karte li{position:relative;padding:0 0 14px 30px;font-size:14.5px;line-height:1.5;opacity:0;transform:translateY(8px);animation:vxRein .45s var(--ease) forwards;animation-delay:calc(var(--i) * 55ms)}
.vx__karte li::before{content:"";position:absolute;left:0;top:.45em;width:10px;height:10px;border-radius:50%;background:currentColor}
.vx__karte li::after{content:"";position:absolute;left:4.5px;top:1.3em;bottom:-.25em;width:1px;background:currentColor;opacity:.2}
.vx__karte li:last-child::after{display:none}
.vx__karte li small{display:block;font-size:12px;opacity:.6}
.vx__karte li.vx__fazit{padding-top:6px;font-weight:500}
.vx__karte li.vx__fazit::before{display:none}
.vx__fazit svg{position:absolute;left:-3px;top:.45em;width:18px;height:18px}
.vx__fazit span{display:block;font-weight:300;opacity:.75}
@keyframes vxRein{to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.vx__karte li{opacity:1;transform:none}}
@media (max-width:900px){.vx{grid-template-columns:minmax(0,1fr)}.vx__toggle{display:grid;width:100%}.vx__toggle button{padding:12px 10px}}

/* ============================================================
   HOMESTORY – eine Bewertung mit Gesicht und Objekt
   ============================================================ */
.story{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,4.4vw,72px);align-items:center;margin-top:clamp(30px,3.4vw,50px)}
.story__bild{position:relative}
.story__objekt{border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/3.4;box-shadow:0 44px 90px -50px #00000080}
.story__objekt img{width:100%;height:100%;object-fit:cover}
.story__person{position:absolute;right:-18px;bottom:-26px;width:clamp(110px,12vw,150px);aspect-ratio:1;border-radius:50%;overflow:hidden;border:6px solid var(--paper);box-shadow:0 24px 50px -24px #00000080;background:var(--ink);color:var(--paper);display:grid;place-items:center;font-family:var(--serif);font-size:48px}
.sec--sand .story__person{border-color:var(--sand)}
.story__person img{width:100%;height:100%;object-fit:cover}
.story .sold{top:22px}
.story__zitat{font-family:var(--serif);font-weight:500;font-size:clamp(1.45rem,2.3vw,2rem);line-height:1.28;margin:16px 0 0;text-wrap:pretty}
.story__text{margin-top:16px;color:#4b4b47;font-size:15px;line-height:1.7}
.story__wer{display:flex;align-items:center;gap:14px;margin-top:26px;padding-top:20px;border-top:1px solid #00000020}
.story__wer img{width:24px;height:24px}
.story__wer b{display:block;font-weight:500}
.story__wer span{font-size:13px;color:var(--muted)}
@media (max-width:900px){.story{grid-template-columns:minmax(0,1fr)}.story__person{right:12px}}
.story__g{position:absolute;left:clamp(-24px,-2vw,-12px);bottom:clamp(28px,4vw,48px);width:min(270px,70%);background:var(--paper);border-radius:18px;padding:14px 16px;box-shadow:0 28px 56px -26px #00000080;animation:schweben 7s ease-in-out infinite}
.story__gtop{display:flex;align-items:center;justify-content:space-between}
.story__gtop img{width:20px;height:20px}
.story__g p{font-family:var(--serif);font-size:17px;line-height:1.3;margin-top:8px}
.story__g b{display:block;margin-top:8px;font-weight:500;font-size:12.5px;color:var(--muted)}
@media (max-width:900px){.story__g{left:12px;bottom:auto;top:56px;width:min(250px,64%)}}

/* ============================================================
   KURZBEWERTUNGEN unter der Homestory
   ============================================================ */
.krevs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:14px;margin-top:clamp(40px,4.4vw,64px)}
.krev{margin:0;background:var(--paper);border-radius:20px;padding:20px 20px 22px;display:flex;flex-direction:column;gap:12px;
  box-shadow:0 24px 48px -34px #00000066;border:1px solid #0000000d;transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.krev:hover{transform:translateY(-4px);box-shadow:0 32px 60px -34px #00000073}
.sec:not(.sec--sand):not(.sec--stone) .krev:not(.krev--alle){background:var(--sand)}
.krev__top{display:flex;align-items:center;gap:12px}
.krev__top img{width:20px;height:20px;margin-left:auto}
.krev__ava{width:38px;height:38px;border-radius:50%;background:var(--ink);color:var(--paper);display:grid;place-items:center;font-family:var(--serif);font-size:18px;flex:none}
.krev__wer b{display:block;font-weight:500;font-size:14px}
.krev__wer i{font-style:normal;font-size:12px;color:var(--muted)}
.krev__sterne{display:flex;gap:2px}
.krev__sterne svg{width:14px;height:14px;fill:var(--star)}
.krev blockquote{margin:0}
.krev p{font-size:14px;line-height:1.65;color:#3f3f3b;display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}
.krev--alle{background:var(--ink);color:var(--paper);border-color:var(--ink);justify-content:center;gap:10px;position:relative}
.krev--alle img{width:34px;height:34px}
.krev__note{font-family:var(--serif);font-size:44px;line-height:1;font-variant-numeric:lining-nums}
.krev--alle>span:not(.krev__note):not(.krev__sterne):not(.krev__go){font-size:14px;color:#c9c9c3;max-width:22ch}
.krev__go{position:absolute;right:18px;bottom:18px;width:36px;height:36px;border-radius:50%;background:var(--lime);color:var(--ink);display:grid;place-items:center;transition:transform .35s var(--ease)}
.krev__go svg{width:15px;height:15px}
.krev--alle:hover .krev__go{transform:translateX(4px)}

/* ============================================================
   KONTAKTFORMULAR (wie Concept Living, für den Wohnungsverkauf)
   ============================================================ */
.kf{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(18px,2.4vw,32px);align-items:stretch}
.kf__bild{position:relative;border-radius:var(--r-lg);overflow:hidden;min-height:420px;box-shadow:0 40px 80px -48px #00000080}
.kf__bild img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:42% 30%}
.kf__karte{position:absolute;left:16px;bottom:16px;background:var(--paper);border-radius:16px;padding:12px 16px;font-size:12.5px;color:var(--muted);line-height:1.4;box-shadow:0 20px 40px -22px #00000080}
.kf__karte b{display:block;color:var(--ink);font-weight:500;font-size:14px}
.kf__karte a{display:block;margin-top:6px;font-family:var(--serif);font-size:19px;color:var(--ink);font-variant-numeric:lining-nums}
.kf__form{background:var(--paper);border-radius:var(--r-lg);padding:clamp(22px,3vw,40px);box-shadow:0 40px 80px -50px #00000073}
.sec:not(.sec--sand):not(.sec--stone) .kf__form{background:var(--sand)}
.kf__form h3{font-size:clamp(1.3rem,1.8vw,1.55rem)}
.kf__sub{margin:6px 0 20px;font-size:14px;color:var(--muted)}
.kf__form :is(input[type=text],input[type=email],input[type=tel],select,textarea){width:100%;border:1px solid #0000001f;border-radius:12px;background:var(--paper);padding:.85em 1em;font:inherit;font-weight:300;font-size:16px;color:var(--ink)}
.kf__form select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 20px) 53%,calc(100% - 14px) 53%;background-size:6px 6px;background-repeat:no-repeat;padding-right:2.6em}
.kf__form textarea{min-height:110px;resize:vertical}
.kf__form :is(input,select,textarea):focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 3px #0000000d}
.kf__form .err{border-color:#c0392b!important}
.kf__oder{display:flex;align-items:center;gap:14px;margin:22px 0 14px;font-size:12px;color:var(--muted)}
.kf__oder::before,.kf__oder::after{content:"";flex:1;height:1px;background:#0000001f}
.kf__wa{display:flex;align-items:center;justify-content:center;gap:10px;border:1px solid #00000026;border-radius:999px;padding:13px 20px;font-size:14px;transition:background .25s,border-color .25s}
.kf__wa:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.kf__wa svg{width:18px;height:18px}
@media (max-width:900px){.kf{grid-template-columns:minmax(0,1fr)}.kf__bild{min-height:300px}}

/* Kopfbereich auf Unterseiten */
.hx--seite .hx__media{aspect-ratio:5/3.9}
.hx__quote{margin-top:22px;font-family:var(--serif);font-size:clamp(1.15rem,1.5vw,1.35rem);line-height:1.35;color:#e4e4de}

/* Fußzeile ohne Werbetext */
@media (min-width:901px){.ftr__top{grid-template-columns:1fr 1fr 1fr 1.3fr}}

.hx__media .sold{left:auto;right:0;top:22px;border-radius:8px 0 0 8px;padding:7px 12px 7px 14px}

/* ============================================================
   VORHER / NACHHER – Schieber
   ============================================================ */
.bas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2vw,28px)}
.ba__fig{margin:0}
.ba{position:relative;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:3/2;box-shadow:0 40px 80px -46px #00000080;--pos:50%;user-select:none;-webkit-user-select:none;touch-action:pan-y}
.ba img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.ba__vor{clip-path:inset(0 calc(100% - var(--pos)) 0 0)}
.ba__linie{position:absolute;top:0;bottom:0;left:var(--pos);width:2px;margin-left:-1px;background:var(--paper);box-shadow:0 0 0 1px #0000001a;pointer-events:none}
.ba__griff{position:absolute;top:50%;left:var(--pos);width:52px;height:52px;margin:-26px 0 0 -26px;border-radius:50%;background:var(--paper);color:var(--ink);display:grid;place-items:center;box-shadow:0 14px 30px -10px #00000080;pointer-events:none;transition:transform .25s var(--ease)}
.ba__griff svg{width:22px;height:22px}
.ba:hover .ba__griff,.ba:focus-within .ba__griff{transform:scale(1.08)}
.ba input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize}
.ba input:focus-visible+.ba__griff{outline:2px solid var(--ink);outline-offset:3px}
.ba__lbl{position:absolute;top:16px;background:var(--ink);color:var(--paper);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;padding:7px 12px;line-height:1;pointer-events:none}
.ba__lbl--vor{left:0;border-radius:0 8px 8px 0}
.ba__lbl--nach{right:0;border-radius:8px 0 0 8px;background:var(--lime);color:var(--ink)}
.ba__fig figcaption{display:flex;justify-content:space-between;gap:12px;margin-top:14px;font-size:14px}
.ba__fig figcaption b{font-family:var(--serif);font-weight:500;font-size:1.2rem}
.ba__fig figcaption span{color:var(--muted)}
@media (max-width:820px){.bas{grid-template-columns:minmax(0,1fr)}}

/* ============================================================
   ZEITSTRAHL – vom Bestand zur fertigen Wohnung
   ============================================================ */
.zs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;position:relative;padding-top:34px}
.zs::before{content:"";position:absolute;left:10%;right:10%;top:9px;height:1px;background:#00000033}
.zs__i{position:relative;text-align:left}
.zs__i::before{content:"";position:absolute;left:50%;top:-31px;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:var(--ink);box-shadow:0 0 0 5px var(--sand)}
.sec:not(.sec--sand) .zs__i::before{box-shadow:0 0 0 5px var(--paper)}
.zs__i:last-child::before{background:var(--lime);border:1px solid var(--ink)}
.zs__bild{border-radius:var(--r-md);overflow:hidden;aspect-ratio:4/5;box-shadow:0 26px 50px -36px #00000073}
.zs__bild img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.zs__i:hover .zs__bild img{transform:scale(1.05)}
.zs__nr{display:block;margin-top:14px;font-size:11px;letter-spacing:.14em;color:var(--muted)}
.zs__i h3{margin-top:6px;font-size:1.15rem}
.zs__i p{margin-top:6px;font-size:13.5px;line-height:1.6;color:var(--muted)}
@media (max-width:980px){
  .zs{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 calc(-1*var(--gut));padding:34px var(--gut) 8px;scrollbar-width:none}
  .zs::-webkit-scrollbar{display:none}
  .zs::before{left:var(--gut);right:auto;width:calc(5 * 72% + 4 * 16px - 40%)}
  .zs__i{flex:0 0 72%;scroll-snap-align:start}
}
.story__person{overflow:visible}
.story__person img{border-radius:50%}
.story__sym{position:absolute;left:50%;bottom:-26px;transform:translateX(-50%);white-space:nowrap;font-family:var(--sans);font-size:10.5px;letter-spacing:.06em;color:var(--muted)}

/* Kopf: Hinweis unten rechts, beige statt gelb */
.hx__tag{position:absolute;right:18px;bottom:18px;display:flex;align-items:center;gap:10px;background:var(--sand);color:var(--ink);border-radius:999px;padding:8px 16px 8px 8px;font-size:13px;font-weight:500;box-shadow:0 18px 36px -20px #00000080}
.hx__tag i{width:30px;height:30px;border-radius:50%;background:var(--stone);display:grid;place-items:center}
.hx__tag svg{width:15px;height:15px}

/* ============================================================
   VERGLEICH – schlichte Gegenüberstellung
   ============================================================ */
.vt{max-width:980px;margin:0 auto;position:relative}
.vt__kopf,.vt__z,.vt__fuss{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr);align-items:center}
.vt__kopf>span,.vt__z>span,.vt__fuss>span{padding:16px 22px}
.vt__z{border-top:1px solid #0000001a}
.vt__l{font-size:15px}
.vt__m,.vt__w{display:flex;align-items:center;gap:10px;font-size:15px}
.vt__m{color:var(--muted)}
.vt__m svg{width:14px;height:14px;flex:none;opacity:.55}
.vt__w svg{width:16px;height:16px;flex:none}
.vt__w{background:var(--ink);color:var(--paper);font-weight:500}
.vt__kopf .vt__m{font-family:var(--serif);font-size:1.3rem;color:var(--ink)}
.vt__kopf .vt__w{border-radius:var(--r-md) var(--r-md) 0 0;padding-top:26px;flex-direction:column;align-items:flex-start;gap:6px;position:relative}
.vt__kopf .vt__w b{font-family:var(--serif);font-weight:500;font-size:1.45rem}
.vt__kopf .vt__w em{font-style:normal;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;background:var(--sand);color:var(--ink);border-radius:999px;padding:5px 10px}
.vt__z .vt__w{border-top:1px solid #ffffff1f}
.vt__fuss .vt__w{border-radius:0 0 var(--r-md) var(--r-md);padding-bottom:24px;box-shadow:0 40px 60px -40px #00000080}
.vt__fuss .btn{width:100%;white-space:normal;text-align:center}
@media (max-width:700px){
  .vt__kopf,.vt__z,.vt__fuss{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .vt__kopf>span:first-child,.vt__fuss>span:first-child{display:none}
  .vt__z{border-top:0}
  .vt__l{grid-column:1/-1;padding:16px 4px 6px!important;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
  .vt__kopf>span,.vt__z>span,.vt__fuss>span{padding:12px 14px}
  .vt__m,.vt__w{font-size:14px}
  .vt__z .vt__m{border-top:1px solid #0000001a}
  .vt__fuss>span:nth-child(2){display:none}
  .vt__fuss{grid-template-columns:minmax(0,1fr)}
  .vt__fuss .vt__w{border-radius:0 0 var(--r-md) var(--r-md)}
  .vt__z .vt__w{border-radius:0}
}

/* Statement statt großem Foto */
.stm{max-width:860px;margin:0 auto;text-align:center}
.stm h2{font-size:clamp(1.7rem,3vw,2.5rem);line-height:1.18}
.stm .lead{margin:22px auto 0}
.stm__sign{display:inline-flex;align-items:center;gap:14px;margin-top:30px;text-align:left}
.stm__sign img{width:64px;height:64px;border-radius:50%;object-fit:cover;object-position:50% 22%;box-shadow:0 14px 30px -16px #00000080}
.stm__sign b{display:block;font-weight:500}
.stm__sign span span{font-size:13px;color:var(--muted)}

/* Partnerschaften mit kleinem Mockup */
.pt{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,5vw,80px);align-items:center}
.pt__txt .lead{margin-top:18px}
.pt__txt .fnplus{margin-top:22px}
.pt__mock{position:relative;background:var(--sand);border-radius:var(--r-lg);padding:clamp(26px,3.4vw,48px);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px}
.pt__karte{background:var(--paper);border-radius:20px;padding:20px;box-shadow:0 24px 48px -32px #00000073;display:grid;gap:4px}
.pt__karte--ink{background:var(--ink);color:var(--paper)}
.pt__karte b{font-weight:500;font-size:15px;margin-top:10px}
.pt__karte>span:last-child{font-size:12.5px;color:var(--muted)}
.pt__karte--ink>span:last-child{color:var(--muted-dark)}
.pt__ico{width:44px;height:44px;border-radius:50%;background:#ededed;color:var(--ink);display:grid;place-items:center}
.pt__karte--ink .pt__ico{background:#ffffff14;color:var(--paper)}
.pt__ico svg{width:22px;height:22px}
.pt__und{font-family:var(--serif);font-size:64px;line-height:1}
.pt__ergebnis{grid-column:1/-1;display:flex;align-items:center;gap:14px;background:var(--paper);border-radius:999px;padding:12px 20px 12px 12px;margin-top:6px;box-shadow:0 24px 48px -32px #00000073;font-size:12.5px;color:var(--muted);line-height:1.35}
.pt__ergebnis svg{width:40px;height:40px;padding:10px;border-radius:50%;background:var(--ink);color:var(--paper);flex:none}
.pt__ergebnis b{display:block;color:var(--ink);font-weight:500;font-size:14px}
@media (max-width:900px){.pt{grid-template-columns:minmax(0,1fr)}}
@media (max-width:460px){.pt__mock{grid-template-columns:minmax(0,1fr)}.pt__und{text-align:center;font-size:48px}}

/* Homestory: Verkauft-Label etwas größer */
.story .sold{font-size:12px;padding:9px 16px 9px 14px;top:24px}

/* WhatsApp in WhatsApp-Grün */
.kf__wa{background:#25d366;border-color:#25d366;color:#fff;font-weight:500}
.kf__wa:hover{background:#1ebe5a;border-color:#1ebe5a;color:#fff}
/* ============================================================
   VERGLEICH – Verkauf mit Makler / Verkauf an simon&co.
   ============================================================ */
.vgl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,2vw,28px);align-items:start;max-width:1040px;margin:0 auto}
.vgl__col{position:relative;border-radius:var(--r-lg);padding:clamp(26px,3vw,40px) clamp(16px,2.4vw,32px) clamp(20px,2.6vw,34px);text-align:center}
.vgl__col--makler{background:var(--sand-2)}
.vgl__col--wir{background:var(--ink);color:var(--paper)}
.vgl__badge{position:absolute;top:-13px;right:clamp(18px,2.4vw,30px);background:var(--lime);color:var(--ink);border-radius:999px;padding:7px 14px;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:500;line-height:1}
.vgl__ico{width:68px;height:68px;margin:0 auto;border-radius:50%;background:var(--paper);color:var(--ink);display:grid;place-items:center;box-shadow:0 14px 30px -22px #00000080}
.vgl__ico svg{width:30px;height:30px}
.vgl__col--wir .vgl__ico{background:#ffffff14;color:var(--paper);box-shadow:none}
.vgl__col h3{margin-top:18px;font-size:clamp(1.35rem,2vw,1.75rem)}
.vgl__kosten{margin-top:8px;font-size:15px}
.vgl__kosten b{font-weight:500}
.vgl__col--wir .vgl__kosten{color:#d4d4ce}
.vgl__list{list-style:none;margin:clamp(18px,2vw,26px) 0 0;background:var(--paper);color:var(--ink);border-radius:var(--r-md);padding:clamp(22px,2.4vw,32px) clamp(18px,2.2vw,30px) clamp(8px,1vw,14px);text-align:left}
.vgl__list li{position:relative;padding:0 0 17px 30px;font-size:14.5px;line-height:1.55}
.vgl__list li::before{content:"";position:absolute;left:0;top:.42em;width:10px;height:10px;border-radius:50%;background:var(--ink)}
.vgl__list li::after{content:"";position:absolute;left:4.5px;top:1.25em;bottom:-.3em;width:1px;background:#00000024}
.vgl__list li:last-child::after{display:none}
.vgl__list li small{display:block;font-size:12px;color:var(--muted);margin-top:2px}
.vgl__list li.vgl__fazit{padding-bottom:20px}
.vgl__list li.vgl__fazit::before{display:none}
.vgl__fazit svg{position:absolute;left:-3px;top:.1em;width:18px;height:18px}
.vgl__fazit b{font-weight:500}
.vgl__fazit mark{background:var(--lime);color:var(--ink);padding:0 4px;border-radius:4px}
.vgl__col .btn{margin-top:clamp(18px,2vw,26px)}
@media (max-width:760px){
  .vgl{grid-template-columns:minmax(0,1fr);gap:26px}
  .vgl .btn{white-space:normal;text-align:center}
  .vgl__col--wir{order:-1}
}

/* Vergleich: Schatten, Handy, weniger Gelb */
.vgl__col{box-shadow:0 40px 80px -50px #00000073;transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.vgl__col:hover{transform:translateY(-6px);box-shadow:0 50px 90px -46px #00000080}
.vgl__col--wir{box-shadow:0 50px 100px -40px #000000a6}
.vgl__list{box-shadow:0 20px 40px -32px #00000059}
.vgl__badge{background:var(--sand);box-shadow:0 10px 24px -12px #00000080}
.vgl__fazit mark{background:var(--sand-2)}
.vgl__list li{transition:padding-left .3s var(--ease)}
.vgl__list li:hover{padding-left:34px}
@media (max-width:760px){.vgl{grid-template-columns:minmax(0,1fr)}.vgl .btn{white-space:normal;text-align:center}}

/* Kopf: rundes Siegel oben rechts */
.hx__siegel{position:absolute;right:22px;top:22px;width:118px;height:118px;border-radius:50%;background:var(--sand);color:var(--ink);display:grid;place-items:center;box-shadow:0 20px 40px -20px #00000080}
.hx__siegel svg{position:absolute;inset:0;width:100%;height:100%;animation:drehen 22s linear infinite}
.hx__siegel text{font-family:var(--sans);font-size:9.6px;letter-spacing:.16em;text-transform:uppercase;fill:var(--ink)}
.hx__siegel b{font-family:var(--serif);font-weight:500;font-size:34px;line-height:1;font-variant-numeric:lining-nums}
.hx__siegel small{font-size:16px;margin-left:1px}
@keyframes drehen{to{transform:rotate(360deg)}}
@media (max-width:520px){.hx__siegel{width:92px;height:92px;right:14px;top:14px}.hx__siegel b{font-size:26px}}
/* Kopf: beim Scrollen fährt die Karte hoch, das Bild runter */
.hx__panel,.hx__media{will-change:transform}
/* Unterschrift im Statement */
.stm__unterschrift{display:block;width:min(240px,60%);height:auto;margin:22px auto -6px;mix-blend-mode:multiply}
.hx .rv.in{transition:opacity .9s var(--ease)}

/* Kontaktbereich wie Concept Living: Bild hinten, Formular schiebt sich darüber */
.kf{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:center;gap:0}
.kf__bild{aspect-ratio:3/4;min-height:0;box-shadow:0 30px 66px #00000029}
.kf__bild img{object-position:center 60%}
.kf__form{margin-left:clamp(-90px,-6vw,-30px);position:relative;z-index:2;box-shadow:0 34px 80px #0000001f}
.sec:not(.sec--sand):not(.sec--stone) .kf__form{background:var(--paper)}
.kf__form.in .fgr>div{animation:feldRein .7s var(--ease) both}
.kf__form.in .fgr>div:nth-child(2){animation-delay:.06s}
.kf__form.in .fgr>div:nth-child(3){animation-delay:.12s}
.kf__form.in .fgr>div:nth-child(4){animation-delay:.18s}
.kf__form.in .fgr>div:nth-child(5){animation-delay:.24s}
.kf__form.in .fgr>div:nth-child(6){animation-delay:.3s}
.kf__form.in .fgr>div:nth-child(7){animation-delay:.36s}
@keyframes feldRein{from{opacity:0;transform:translateY(12px)}}
@media (max-width:900px){.kf{grid-template-columns:minmax(0,1fr)}.kf__bild{aspect-ratio:16/11}.kf__form{margin-left:0;margin-top:-40px;margin-inline:10px}}
@media (max-width:520px){.kf__form{margin-inline:0}}
/* Kurzbewertungen: drei Spalten, Google-Karte rechts */
@media (min-width:861px){.krevs{grid-template-columns:repeat(3,minmax(0,1fr))}}
.krevs--extra{margin-top:14px}

/* Vergleich: Gelb dort, wo es zählt */
.vgl__kosten mark{background:var(--lime);color:var(--ink);padding:1px 7px;border-radius:5px;font-weight:500}
.vgl__badge{background:var(--lime);font-size:12px;padding:10px 18px;top:-17px;letter-spacing:.14em;box-shadow:0 14px 30px -12px #00000099;display:inline-flex;align-items:center;gap:8px}
.vgl__badge::before{content:"★";font-size:13px;letter-spacing:0}
.vgl__fazit mark{background:var(--lime)}

/* Menü: größerer Knopf */
.nav .nav__cta{padding:14px 24px;font-size:14.5px;gap:10px}
.nav .nav__cta svg{width:15px;height:15px}

/* Statement: Porträt, Name und Unterschrift in einer Zeile */
.stm__sign{gap:18px}
.stm__sign .stm__unterschrift{width:150px;margin:0 0 0 10px;padding-left:22px;border-left:1px solid #0000001f}
@media (max-width:520px){.stm__sign{flex-wrap:wrap;justify-content:center}.stm__sign .stm__unterschrift{margin:6px 0 0;padding-left:0;border-left:0;width:130px}}

/* Vergleich: drehendes Siegel „Die beste Option“ */
.vgl__badge{display:none}
.vgl__siegel{position:absolute;right:-22px;top:-30px;width:108px;height:108px;border-radius:50%;background:var(--lime);color:var(--ink);display:grid;place-items:center;box-shadow:0 18px 36px -16px #000000a6;z-index:2}
.vgl__siegel svg{position:absolute;inset:0;width:100%;height:100%;animation:drehen 22s linear infinite}
.vgl__siegel text{font-family:var(--sans);font-size:10px;letter-spacing:.16em;text-transform:uppercase;fill:var(--ink)}
.vgl__siegel b{font-family:var(--serif);font-weight:500;font-size:26px;line-height:1}
@media (max-width:760px){.vgl__siegel{right:10px;top:-34px;width:92px;height:92px}.vgl__siegel b{font-size:22px}}
/* Dauer: rotes X bei Makler, grüner Haken bei simon&co. */
.vgl__fazit svg{width:22px;height:22px;left:-5px;top:-1px;padding:4px;border-radius:50%;color:#fff}
.vgl__fazit--nein svg{background:#d93a3a}
.vgl__fazit--ja svg{background:#22a55a}
.stm__sign .stm__unterschrift{height:auto;border-radius:0;box-shadow:none;object-fit:contain}

/* Schwebender WhatsApp-Knopf (wie Concept Living) */
.wa-float{position:fixed;right:22px;bottom:22px;z-index:75;width:60px;height:60px;border-radius:50%;background:#25d366;color:#fff;display:grid;place-items:center;box-shadow:0 16px 34px -10px #25d36699,0 8px 20px -10px #00000066;transition:transform .3s var(--ease)}
.wa-float svg{width:30px;height:30px}
.wa-float::before{content:"";position:absolute;inset:0;border-radius:50%;background:#25d366;animation:waPuls 2.6s ease-out infinite;z-index:-1}
@keyframes waPuls{0%{transform:scale(1);opacity:.55}80%,100%{transform:scale(1.55);opacity:0}}
.wa-float span{position:absolute;right:72px;top:50%;transform:translateY(-50%) translateX(6px);white-space:nowrap;background:var(--ink);color:var(--paper);font-size:13px;padding:8px 14px;border-radius:999px;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s var(--ease)}
.wa-float:hover{transform:scale(1.06)}
.wa-float:hover span{opacity:1;transform:translateY(-50%)}
@media (max-width:760px){.wa-float{right:16px;width:54px;height:54px}.sticky~.wa-float,.sticky+.wa-float{bottom:92px}}

/* Funnel: drehendes Siegel „Kostenfrei“ an der Karte */
.fn{position:relative;overflow:visible}
.fn__head{border-radius:var(--r-lg) var(--r-lg) 0 0}
.fn__siegel{position:absolute;right:-26px;top:-34px;z-index:3;width:104px;height:104px;border-radius:50%;background:var(--lime);color:var(--ink);display:grid;place-items:center;box-shadow:0 18px 36px -16px #00000080}
.fn__siegel svg{position:absolute;inset:0;width:100%;height:100%;animation:drehen 20s linear infinite}
.fn__siegel text{font-family:var(--sans);font-size:9.6px;letter-spacing:.16em;text-transform:uppercase;fill:var(--ink)}
.fn__siegel b{font-family:var(--serif);font-weight:500;font-size:24px;line-height:1;font-variant-numeric:lining-nums}
@media (max-width:1000px){.fn__siegel{right:10px;top:-40px;width:88px;height:88px}.fn__siegel b{font-size:20px}}
@media (min-width:1001px){.fn__siegel{top:52px;right:-40px}}
@media (max-width:1000px){.fn__siegel{top:-30px;right:-6px}}
@media (max-width:1000px){.fn__meta{padding-right:76px}}

/* ============================================================
   HANDY-FEINSCHLIFF
   ============================================================ */
@media (max-width:760px){
  /* wischbare Reihen: erste Karte mit Abstand zum Rand */
  .refs--lauf,.vk{scroll-padding-inline:var(--gut)}
  .vkc{min-height:350px;flex-basis:min(80%,300px)}
  .vkc__mock{padding-top:16px}
  /* Kurzbewertungen als wischbare Reihe */
  .krevs{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin-inline:calc(-1*var(--gut));padding:4px var(--gut) 14px;scroll-padding-inline:var(--gut);scrollbar-width:none}
  .krevs::-webkit-scrollbar{display:none}
  .krev{flex:0 0 84%;scroll-snap-align:start}
  .krev--alle{flex-basis:60%}
  .krevs--extra{margin-top:0}
  /* Fußzeile zweispaltig */
  .ftr__top{grid-template-columns:1fr 1fr;gap:30px 20px}
  .ftr__top>div:last-child{grid-column:1/-1}
}
@media (max-width:520px){
  /* Google-Zeile im Kopf in eine Zeile */
  .gline{font-size:.84rem;gap:.35rem;flex-wrap:nowrap}
  .gline img{width:18px;height:18px}
  .gline .stars svg{width:12px;height:12px}
  .gline b{font-size:.95rem}
  .gline i{margin-inline:.3rem}
  /* Statement: Porträt und Name nebeneinander, Unterschrift darunter */
  .stm__sign{display:grid;grid-template-columns:auto auto;justify-content:center;align-items:center;column-gap:12px;text-align:left}
  .stm__sign .stm__unterschrift{grid-column:1/-1;justify-self:center;margin:4px 0 0;width:120px}
  /* Formulare: Namen nebeneinander */
  .js-kontakt .fgr{grid-template-columns:1fr 1fr;gap:12px}
  .js-kontakt .fgr>.ffield:has(input[type=email]),.js-kontakt .fgr>.ffield:has(select),.js-kontakt .fgr>.ffield:has(textarea),.js-kontakt .fgr>.full{grid-column:1/-1}
  .fn .js-kontakt .fgr>.ffield:has(input[type=tel]){grid-column:1/-1}
  .js-kontakt .ffield label{font-size:12px}
  /* Partner-Mockup kompakt nebeneinander */
  .pt__mock{grid-template-columns:1fr auto 1fr;padding:18px;gap:8px}
  .pt__karte{padding:14px;border-radius:16px}
  .pt__karte b{font-size:13px;margin-top:6px}
  .pt__karte>span:last-child{display:none}
  .pt__ico{width:34px;height:34px}
  .pt__ico svg{width:17px;height:17px}
  .pt__und{font-size:40px;text-align:center}
}

/* Statement wie ein Briefschluss: Unterschrift in Tinte, darunter Porträt und Name */
.stm__unterschrift{display:block;width:min(230px,62%);height:auto;margin:30px auto 0;filter:grayscale(1) brightness(.25) contrast(1.6);mix-blend-mode:multiply}
.stm__sign{display:inline-flex;align-items:center;gap:14px;margin-top:6px;padding-top:16px;border-top:1px solid #0000001a;text-align:left}
.stm__sign img{width:56px;height:56px}
@media (max-width:520px){
  .stm__sign{display:inline-flex;grid-template-columns:none;gap:12px}
  .stm__unterschrift{width:180px;margin-top:24px}
}
@media (max-width:520px){.stm__sign{flex-wrap:nowrap;max-width:100%}.stm__sign>span{min-width:0}.stm__sign span span{font-size:12px}}

/* Drehende Siegel: auch am Handy und bei „Bewegung reduzieren“ (langsame, ruhige Drehung) */
.hx__siegel svg,.vgl__siegel svg,.fn__siegel svg{transform-origin:50% 50%;-webkit-transform-origin:50% 50%;will-change:transform;-webkit-animation:drehen 22s linear infinite;animation:drehen 22s linear infinite}
@-webkit-keyframes drehen{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){
  .hx__siegel svg,.vgl__siegel svg,.fn__siegel svg{-webkit-animation:drehen 22s linear infinite!important;animation:drehen 22s linear infinite!important;animation-duration:22s!important;animation-iteration-count:infinite!important}
}

/* Ablauf am Handy: mittig untereinander mit Pfeil nach unten (wie Concept Living) */
@media (max-width:900px){
  .wie__kreis{width:84px}
  .wie__kreis svg{width:30px}
  .wie__i p{max-width:34ch}
  .wie__pfeil{width:56px;height:56px;margin:10px 0}
  .wie__pfeil svg{width:56px}
}