/* Kanzlei für Immobilienberatung GmbH – gemeinsames Stylesheet aller Seiten */
:root{--ink:#252c29;--muted:#555e56;--olive:#35473c;--olive-hover:#25362c;--olive-soft:#829084;--bronze:#705b3e;--bronze-light:#d6c6a9;--paper:#faf9f6;--sand:#eeeae2;--line:#d9d9ce;--white:#fff;--serif:Georgia,'Times New Roman',serif;--sans:'Segoe UI',Arial,sans-serif;--gutter:clamp(22px,5vw,72px);--max:1240px;--ease:cubic-bezier(.22,.61,.36,1)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:110px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.65;overflow-wrap:break-word;position:relative;isolation:isolate}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-underline-offset:.25em}
button,summary{font:inherit}
a,button,summary{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--bronze);outline-offset:5px}
h1,h2,h3,h4,p,figure{margin:0}
h1,h2,h3,h4{font-family:var(--serif);font-weight:400;line-height:1.15}
h1{font-size:clamp(40px,4.45vw,64px);letter-spacing:-.045em;max-width:11.3em}
h2{font-size:clamp(35px,3.4vw,49px);letter-spacing:-.035em}
h3{font-size:27px;letter-spacing:-.02em}
::selection{background:#d9dfd1;color:var(--ink)}
.wrap{width:min(100%,var(--max));padding-inline:var(--gutter);margin-inline:auto}
.eyebrow{display:block;color:var(--bronze);font-family:var(--sans);font-size:13px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;line-height:1.6}
.skip{position:fixed;top:-120px;left:16px;padding:12px 20px;z-index:99;background:var(--white);color:var(--ink)}
.skip:focus{top:12px}

/* ---------- Startseite: Hintergrund nach Tageszeit ---------- */
.architecture-background{--scene-opacity:.16;--scene-filter:none;--tint:rgba(255,255,255,0);--veil-a:.84;--veil-b:.62;--veil-c:.10;--veil-m:.66;--read-veil:.74;--read:0;position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:var(--paper)}
.architecture-scene{position:absolute;inset:0;opacity:var(--scene-opacity);filter:var(--scene-filter)}
.architecture-scene img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 48%;opacity:0}
.architecture-scene img[data-light="day"]{opacity:1}
.architecture-tint{position:absolute;inset:0;z-index:2;background:var(--tint)}
.architecture-background::after{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(250,249,246,var(--veil-a)),rgba(250,249,246,var(--veil-b)) 45%,rgba(250,249,246,var(--veil-c)))}
.architecture-background::before{content:'';position:absolute;inset:0;z-index:1;background:rgba(250,249,246,var(--read-veil));opacity:var(--read)}
.architecture-background[data-ready] .architecture-scene,.architecture-background[data-ready] .architecture-tint,.architecture-background[data-ready]::after{transition:opacity 1s linear,filter 1s linear,background 1s linear}
.architecture-background[data-ready]::before{transition:background 1s linear}

/* ---------- Kopfbereich ---------- */
.site-header{position:sticky;top:0;z-index:30;background:var(--white);border-bottom:1px solid var(--line)}
.header-inner{min-height:100px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:block;flex:none;width:181px}
.brand img{width:181px;height:auto}
.nav-links{display:flex;align-items:center;gap:27px;font-size:14px}
.nav-links a{text-decoration:none;padding-block:12px;position:relative}
.nav-links a:not(.nav-contact)::after{content:'';position:absolute;left:0;right:0;bottom:6px;height:1px;background:var(--bronze);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.nav-links a:not(.nav-contact):hover::after,.nav-links a[aria-current="page"]::after{transform:scaleX(1)}
.nav-links a[aria-current="page"]{color:var(--olive)}
.nav-links .nav-contact{border:1px solid var(--olive);padding:10px 20px;color:var(--olive);transition:background .18s,color .18s}
.nav-links .nav-contact:hover,.nav-links .nav-contact[aria-current="page"]{background:var(--olive);color:#fff}
.mobile-menu{display:none;position:relative}
.mobile-menu summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--line);font-size:16px}
.mobile-menu summary::-webkit-details-marker{display:none}
.menu-symbol{width:17px;height:10px;border-top:1px solid;border-bottom:1px solid;display:inline-block}
.mobile-menu nav{position:absolute;right:0;top:calc(100% + 12px);width:min(280px,calc(100vw - 44px));padding:12px 22px;background:var(--white);border:1px solid var(--line);box-shadow:0 12px 32px #252c2914}
.mobile-menu nav a{display:block;padding:12px 0;text-decoration:none;border-bottom:1px solid var(--sand)}
.mobile-menu nav a:last-child{border:0}
.mobile-menu nav a[aria-current="page"]{color:var(--bronze)}
.mobile-menu nav a.sub{padding-left:16px;font-size:15px;color:var(--muted)}

/* ---------- Startseite: Einstieg ---------- */
.hero{display:grid;grid-template-columns:1.5fr .65fr;gap:56px;align-items:end;padding-top:72px;padding-bottom:74px}
.hero h1 .eyebrow{margin-bottom:25px;letter-spacing:.15em;color:#54442d}
.hero h1 .line{display:block}
.hero-intro{font-size:17px;line-height:1.8;max-width:44ch;margin-top:27px;color:#3b433e}
.actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:29px}
.button{display:inline-flex;justify-content:center;align-items:center;gap:14px;min-height:49px;padding:13px 22px;background:var(--olive);color:#fff;text-decoration:none;font-size:14px;font-weight:500;border:1px solid var(--olive);transition:background .18s,border-color .18s,color .18s}
.button:hover{background:var(--olive-hover);border-color:var(--olive-hover)}
.button-outline{color:var(--olive);background:transparent}
.button-outline:hover{color:#fff}
.button-light{background:#fff;color:var(--olive);border-color:#fff}
.button-light:hover{background:var(--bronze-light);border-color:var(--bronze-light);color:var(--ink)}
.text-link{font-size:14px;white-space:nowrap;padding-block:12px}
.hero-place{display:flex;gap:9px;align-items:center;margin-top:34px;color:#3b433e;font-size:13px;letter-spacing:.045em}
.hero-place::before{content:'';width:27px;height:1px;background:var(--bronze)}
.hero-statement{border-top:1px solid var(--bronze);padding:23px 18px 20px;margin-bottom:5px;max-width:350px;background:transparent}
.hero-statement p{font-family:var(--serif);font-size:29px;line-height:1.35}
.hero-statement span{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);display:block;margin-top:14px;line-height:1.9}

.service-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(250,249,246,.84)}
.strip-inner{display:flex;justify-content:space-between;gap:20px;padding-block:22px;font-size:14px;color:var(--muted);list-style:none;margin-block:0}
.strip-inner li{display:flex;align-items:center;gap:12px}
.strip-inner li::before{content:'';flex:none;width:7px;height:7px;background:var(--bronze);transform:rotate(45deg)}

/* Startseite: Bereiche */
.areas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.area{position:relative;display:flex;flex-direction:column;min-height:250px;padding:30px 28px 26px;background:rgba(255,255,255,.74);border:1px solid var(--line);text-decoration:none;transition:background .35s var(--ease),border-color .35s var(--ease),transform .35s var(--ease)}
.area::before{content:'';position:absolute;left:-1px;right:-1px;top:-1px;height:2px;background:var(--bronze);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.area:hover{background:rgba(255,255,255,.94);border-color:#c5c8ba;transform:translateY(-3px)}
.area:hover::before,.area:focus-visible::before{transform:scaleX(1)}
.area-number{font-family:var(--serif);color:var(--bronze);font-size:18px}
.area h3{margin-top:16px;font-size:28px}
.area p{margin-top:12px;color:var(--muted);line-height:1.75;flex:1}
.area-more{display:inline-flex;align-items:center;gap:10px;margin-top:22px;font-size:14px;color:var(--olive)}
.arrow{display:inline-block;transition:transform .35s var(--ease)}
a:hover .arrow,a:focus-visible .arrow{transform:translateX(5px)}
.area-dark{background:rgba(53,71,60,.95);border-color:var(--olive);color:#fff}
.area-dark:hover{background:var(--olive-hover);border-color:var(--olive-hover)}
.area-dark .area-number,.area-dark .area-more{color:var(--bronze-light)}
.area-dark p{color:#e0e5dc}

.home-offer{text-decoration:none;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:stretch;background:rgba(255,255,255,.78);border:1px solid var(--line)}
.home-offer figure{position:relative;overflow:hidden;min-height:260px}
.home-offer img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(100%);transition:transform 1.2s var(--ease)}
.home-offer:hover img{transform:scale(1.03)}
.home-offer-body{padding:clamp(26px,4vw,46px);align-self:center}
.home-offer-body h3{font-size:clamp(26px,2.4vw,34px);margin-top:14px}
.home-offer-list{list-style:none;padding:0;margin:22px 0 0;border-top:1px solid var(--line)}
.home-offer-list li{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);font-size:15px}
.home-offer-list li span:last-child{color:var(--muted);font-size:13px;letter-spacing:.08em;text-transform:uppercase}

/* ---------- Unterseiten: Seitenkopf ---------- */
.page-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:center;padding-block:62px 64px}
.crumbs{display:flex;flex-wrap:wrap;gap:10px;align-items:center;font-size:13px;color:var(--muted);margin-bottom:26px;list-style:none;padding:0}
.crumbs li+li::before{content:'';display:inline-block;width:5px;height:5px;margin-right:10px;background:var(--bronze);transform:rotate(45deg) translateY(-2px)}
.crumbs a{text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.page-hero h1{font-size:clamp(40px,4.3vw,60px)}
.page-hero h1 .eyebrow{margin-bottom:22px}
.lead{font-size:17px;line-height:1.8;max-width:46ch;margin-top:26px;color:#3b433e}
.hero-art{width:100%;max-width:440px;justify-self:end}
.hero-art svg{display:block;width:100%;height:auto;overflow:visible}
.band-dark{background:var(--olive);color:#fff}
.band-dark .eyebrow,.band-dark .crumbs li+li::before{color:var(--bronze-light)}
.band-dark .crumbs li+li::before{background:var(--bronze-light)}
.band-dark .crumbs{color:#c9d2c7}
.band-dark .lead{color:#e0e5dc}

/* Abschnitte allgemein */
.section{padding-block:84px}
.section-tight{padding-top:0}
.section-top{display:grid;grid-template-columns:1fr .85fr;gap:55px;align-items:end;margin-bottom:46px}
.section-top .eyebrow{margin-bottom:16px}
.section-top>p{color:var(--muted);max-width:46ch;font-size:16px}

/* Leistungen */
.services{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:48px;row-gap:38px}
.service{display:grid;grid-template-columns:42px 1fr;gap:8px;border-top:1px solid var(--line);padding-top:25px;position:relative}
.service::before{content:'';position:absolute;left:0;top:-1px;height:1px;width:100%;background:var(--bronze);transform:scaleX(0);transform-origin:left;transition:transform 1.1s var(--ease) .15s}
.service.is-visible::before{transform:scaleX(.18)}
.service-number{font-family:var(--serif);color:var(--bronze);font-size:20px;padding-top:3px}
.service h3{margin-bottom:13px}
.service p{font-size:16px;color:var(--muted);max-width:48ch;line-height:1.8}
.service-links{display:flex;flex-wrap:wrap;gap:4px 22px;margin-top:16px}
.service-links a{font-size:14px;color:var(--olive);padding-block:5px}

.occasions{margin-top:64px;background:rgba(255,255,255,.72);border:1px solid var(--line);padding:clamp(26px,4vw,46px)}
.occasions-head{display:grid;grid-template-columns:1fr .85fr;gap:40px;align-items:end}
.occasions-head .eyebrow{margin-bottom:12px}
.occasions-head h2,.occasions-head h3{font-size:clamp(28px,2.6vw,36px);letter-spacing:-.03em}
.occasions-head>p{color:var(--muted);max-width:46ch}
.occasion-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px;margin-top:34px}
.occasion{border-top:1px solid var(--bronze);padding-top:20px}
.occasion h3,.occasion h4{font-size:24px;letter-spacing:-.02em;margin-bottom:10px}
.occasion p{color:var(--muted);line-height:1.8}
.occasion-note{margin-top:30px;padding-top:20px;border-top:1px solid var(--line);font-size:14px;color:var(--muted);max-width:80ch}

/* Kaufbegleitung: Ablauf */
.steps{position:relative;list-style:none;margin:0;padding:0 0 0 64px;max-width:860px;--progress:0}
.steps::before,.steps::after{content:'';position:absolute;left:19px;top:10px;bottom:10px;width:1px;background:var(--line)}
.steps::after{width:2px;margin-left:-.5px;background:var(--bronze);transform-origin:top;transform:scaleY(var(--progress))}
.step{position:relative;padding-bottom:54px}
.step:last-child{padding-bottom:0}
.step-marker{position:absolute;left:-64px;top:0;width:39px;height:39px;display:grid;place-items:center;background:var(--paper);border:1px solid var(--line);font:18px var(--serif);color:var(--bronze);z-index:1;transition:border-color .6s var(--ease),background .6s var(--ease),color .6s var(--ease)}
.step.is-active .step-marker{border-color:var(--bronze);background:var(--bronze);color:#fff}
.step .eyebrow{margin-bottom:8px;font-size:12px}
.step h3{font-size:clamp(26px,2.4vw,32px);margin-bottom:12px}
.step p{color:var(--muted);line-height:1.85;max-width:62ch}
.step-list{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:18px 0 0}
.step-list li{font-size:13px;padding:5px 11px;border:1px solid var(--line);background:rgba(255,255,255,.75);color:var(--muted)}
.result-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:22px}
.result-options div{border-top:1px solid var(--bronze);padding-top:12px;font-size:15px}
.result-options strong{display:block;font-family:var(--serif);font-weight:400;font-size:20px;margin-bottom:4px}
.result-options span{color:var(--muted);font-size:14px}

/* Verwaltung */
.management{background:rgba(53,71,60,.97);color:#fff;position:relative}
.management .eyebrow{color:var(--bronze-light)}
.management-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:72px;align-items:center}
.management h2{margin-top:19px;font-size:clamp(35px,3.5vw,50px)}
.management-intro{color:#e0e5dc;max-width:48ch;margin-top:24px;font-size:16px;line-height:1.8}
.property-types{font-size:13px;margin-top:26px;color:#e2ddcf;line-height:1.8;max-width:43ch}
.term{border-top:1px solid var(--olive-soft);border-bottom:1px solid var(--olive-soft);padding-block:29px}
.term-numbers{display:flex;align-items:baseline;gap:20px;line-height:1}
.term-numbers strong{font-family:var(--serif);font-weight:400;letter-spacing:-.06em;font-size:clamp(58px,7vw,91px)}
.term-numbers span{color:var(--bronze-light);font-family:var(--serif);font-size:26px;font-style:italic}
.term-label{margin-top:13px;color:#eee9dd;font-size:14px;letter-spacing:.05em}
.term-note{margin-top:14px;color:#c9d2c7;font-size:13px}
.handover{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px;margin-top:54px;padding:0;list-style:none}
.handover li{border-top:1px solid var(--olive-soft);padding-top:22px;position:relative}
.handover li::before{content:'';position:absolute;top:-4px;left:0;width:7px;height:7px;background:var(--bronze-light);transform:rotate(45deg)}
.handover .step-label{font-size:12px;color:var(--bronze-light);letter-spacing:.12em;text-transform:uppercase}
.handover h3{margin-block:12px;font-size:24px}
.handover p{font-size:16px;line-height:1.8;color:#e0e5dc}
.management-link{display:inline-block;margin-top:31px;font-size:14px;padding:8px 0;color:#fff}
.handover-light li{border-color:var(--line)}
.handover-light li::before{background:var(--bronze)}
.handover-light .step-label{color:var(--bronze)}
.handover-light p{color:var(--muted)}

.ring-art{position:relative}
.ring-art .ring-seg{fill:none;stroke:rgba(255,255,255,.16);stroke-width:14;transition:stroke .5s var(--ease)}
.ring-art .ring-seg.on{stroke:var(--bronze-light)}
.ring-art .ring-seg.on.second{stroke:#b7a582}
.ring-center{position:absolute;inset:0;display:grid;place-content:center;text-align:center;pointer-events:none}
.ring-center strong{font-family:var(--serif);font-weight:400;font-size:clamp(64px,7vw,96px);line-height:1;letter-spacing:-.05em}
.ring-center span{display:block;margin-top:6px;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--bronze-light)}
.term-switch{display:inline-flex;margin-top:30px;border:1px solid var(--olive-soft)}
.term-switch button{appearance:none;background:transparent;color:#e0e5dc;border:0;padding:11px 20px;font-size:14px;cursor:pointer;transition:background .25s,color .25s}
.term-switch button+button{border-left:1px solid var(--olive-soft)}
.term-switch button[aria-pressed="true"]{background:var(--bronze-light);color:var(--ink)}
.term-switch button:focus-visible{outline-offset:2px}
.term-caption{margin-top:14px;font-size:13px;color:#c9d2c7;max-width:44ch;min-height:3.4em}
.task-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.conditions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.condition{background:rgba(255,255,255,.8);border:1px solid var(--line);border-top:2px solid var(--bronze);padding:30px 28px}
.condition h3{font-size:28px;margin:14px 0 10px}
.condition p{color:var(--muted);line-height:1.8;max-width:48ch}
@media(max-width:620px){.conditions{grid-template-columns:minmax(0,1fr);gap:16px}.condition{padding:24px 20px}}
.task{background:rgba(255,255,255,.74);border:1px solid var(--line);padding:26px 24px}
.task h3{font-size:22px;margin-bottom:10px}
.task p{color:var(--muted);font-size:15px;line-height:1.75}

/* Team */
.team-layout{display:grid;grid-template-columns:.93fr 1.07fr;gap:68px}
.team-layout .eyebrow{margin-bottom:17px}
.team-layout h2{max-width:13ch}
.team-copy{color:var(--muted);font-size:16px;line-height:1.8;max-width:44ch;margin-top:23px}
.people{border-top:1px solid var(--line)}
.person{display:grid;grid-template-columns:62px 1fr;gap:20px;align-items:center;padding-block:28px;border-bottom:1px solid var(--line)}
.initials{width:62px;height:62px;background:var(--sand);display:grid;place-items:center;color:var(--bronze);font:24px var(--serif);transition:background .4s var(--ease),color .4s var(--ease)}
.person:hover .initials{background:var(--olive);color:#fff}
.person h3{font-size:29px}
.person .role{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--bronze);margin-top:8px;font-weight:600}
.person .bio{font-size:15px;color:var(--muted);margin-top:4px;line-height:1.7}
.people-contact{display:inline-block;margin-top:21px;padding-block:8px;font-size:14px;color:var(--olive)}
.values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}
.value{border-top:1px solid var(--bronze);padding-top:22px}
.value h3{font-size:26px;margin-bottom:10px}
.value p{color:var(--muted);line-height:1.8}
.quote{max-width:28ch;font-family:var(--serif);font-size:clamp(28px,3vw,40px);line-height:1.3;letter-spacing:-.02em}
.quote-wrap{display:grid;grid-template-columns:auto 1fr;gap:34px;align-items:start;border-top:1px solid var(--line);padding-top:44px}
.quote-mark{font-family:var(--serif);font-size:90px;line-height:.7;color:var(--bronze)}

/* Immobilien */
.properties{background:rgba(238,234,226,.77);padding-block:58px}
.property-layout{display:grid;grid-template-columns:1fr .85fr;gap:62px;align-items:center}
.properties .eyebrow{margin-bottom:16px}
.properties h2{font-size:clamp(34px,3vw,43px)}
.properties p{max-width:47ch;color:var(--muted);margin-top:20px;font-size:16px;line-height:1.8}
.property-contact{border-left:1px solid #c5c8ba;padding-left:39px}
.property-contact h3{font-size:24px}
.property-contact p{margin-top:12px;margin-bottom:21px}
.offer-list{display:grid;gap:32px}
.property-card{border:1px solid var(--line);background:#fff;min-width:0;border-radius:8px;overflow:hidden}
.property-card-body{padding:28px}
.property-card h3{font-size:1.65rem}
.property-facts{margin:20px 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 24px}
.property-facts div{border-top:1px solid var(--line);padding-top:8px}
.property-facts dt{font:.875rem/1.5 Arial,sans-serif;color:var(--muted)}
.property-facts dd{margin:0;font-size:1rem}
.property-price{font-size:1.65rem;margin:18px 0 8px}
.property-price span{display:block;font:.875rem/1.5 Arial,Helvetica,sans-serif;color:var(--muted);margin-top:5px}
.property-commission{font-size:1rem;margin-top:16px}
.property-overview{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}
.property-cover{margin:0;padding:28px 0 28px 28px}
.property-cover img{width:100%;height:auto}
.property-cover figcaption{font:.875rem/1.5 Arial,Helvetica,sans-serif;color:var(--muted);padding-top:12px}
.property-featured .eyebrow{font-size:.75rem;line-height:1.7;letter-spacing:.1em;margin-bottom:14px}
.property-featured h3{margin-bottom:20px}
.property-supplement{padding:0 28px 28px}
.property-energy{border-top:1px solid var(--line);padding-top:18px;font-size:.9375rem}
.property-energy h4{font-size:1.1rem;font-weight:400;margin:0 0 16px}
.property-energy .property-facts{grid-template-columns:repeat(3,minmax(0,1fr));margin:0 0 22px}
.property-energy .property-facts dd{font-size:.9375rem}
.property-details{border-top:1px solid var(--line);padding-top:16px}
.property-details summary{cursor:pointer;padding:7px 0;text-underline-offset:.22em;font-weight:600}
.property-details summary:hover{text-decoration:underline}
.property-provision-note{font-size:.9375rem;color:var(--muted);margin:20px 0 0}
.property-coming{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.property-coming-image{margin:0;background:#e7e7e7;overflow:hidden}
.property-coming-image img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:50% 65%;filter:grayscale(100%);transition:transform 1.2s var(--ease)}
.property-coming:hover .property-coming-image img{transform:scale(1.03)}
.property-coming-body{padding:clamp(24px,4vw,48px);align-self:center}
.property-coming-status{display:inline-block;margin:0 0 22px;padding:6px 12px;border:1px solid #bbb;background:#f1f1ef;color:#555;font:12px/1.5 Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase}
.property-coming-body h3{margin:0 0 16px;font-size:clamp(1.5rem,2.5vw,2rem);line-height:1.25}
.property-coming-body>p:last-child{margin:0;color:#626262}
.property-card.property-reserved{background:#ededed;border-color:#c4c4c4}
.property-reserved .property-cover img{filter:grayscale(100%)}
.reserved-photo{position:relative;overflow:hidden}
.reserved-photo-label{position:absolute;z-index:1;left:50%;top:50%;transform:translate(-50%,-50%);padding:14px 28px;border:1px solid #686868;border-radius:3px;background:rgba(70,70,70,.93);color:#fff;font:600 15px/1.4 Arial,Helvetica,sans-serif;letter-spacing:.1em;text-transform:uppercase;pointer-events:none}

/* Kontakt */
.contact{padding-block:78px 70px}
.contact-header{display:flex;justify-content:space-between;align-items:end;gap:45px;margin-bottom:43px}
.contact .eyebrow{margin-bottom:17px}
.contact h2{max-width:18ch}
.contact-header>p{color:var(--muted);font-size:16px;max-width:37ch}
.contact-grid{display:grid;grid-template-columns:1fr 1fr 1.12fr;gap:26px;border-top:1px solid var(--line);padding-top:30px}
.contact-label{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);display:block;margin-bottom:11px}
.contact-value{font-family:var(--serif);font-size:clamp(21px,2.1vw,27px);text-decoration:none;display:inline-block;padding-block:4px}
.contact-value:hover{text-decoration:underline}
.contact-hint{display:block;font-size:13px;color:var(--muted);margin-top:4px}
.contact address{font-style:normal;font-size:14px;line-height:1.9}
.contact address strong{font-weight:500}
.topics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.topic{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:18px 20px;background:rgba(255,255,255,.78);border:1px solid var(--line);text-decoration:none;transition:border-color .3s,background .3s}
.topic:hover{border-color:var(--bronze);background:#fff}
.topic strong{font-family:var(--serif);font-weight:400;font-size:20px}
.topic span:last-child{color:var(--olive);font-size:14px;white-space:nowrap}
.map-caption{margin-top:10px;font-size:12px;color:var(--muted);text-align:right}

/* Abschluss-Band und Weiter-Navigation */
.cta-band{background:var(--olive);color:#fff}
.cta-inner{display:flex;justify-content:space-between;align-items:center;gap:40px;padding-block:60px}
.cta-inner .eyebrow{color:var(--bronze-light);margin-bottom:14px}
.cta-inner h2{font-size:clamp(30px,3vw,42px);max-width:20ch}
.cta-actions{display:flex;gap:18px;align-items:center;flex-wrap:wrap;flex:none}
.cta-actions .text-link{color:#fff}
.page-next{display:flex;justify-content:space-between;align-items:center;gap:24px;padding-block:34px;border-top:1px solid var(--line)}
.page-next a{text-decoration:none;display:flex;flex-direction:column;gap:4px}
.page-next a:last-child{text-align:right;align-items:flex-end}
.page-next span{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.page-next strong{font-family:var(--serif);font-weight:400;font-size:clamp(22px,2.2vw,28px);display:inline-flex;gap:12px;align-items:center}
.page-next a:hover strong{text-decoration:underline;text-decoration-thickness:1px}
a:hover .arrow-back{transform:translateX(-5px)}

/* Fußzeile */
.site-footer{padding-block:34px 27px;background:rgba(233,232,224,.95);border-top:1px solid var(--line)}
.footer-top{display:flex;justify-content:space-between;align-items:start;gap:30px;padding-bottom:22px;margin-bottom:20px;border-bottom:1px solid var(--line)}
.footer-sitemap{display:flex;flex-wrap:wrap;gap:6px 26px;font-size:14px}
.footer-sitemap a{text-decoration:none;padding-block:6px}
.footer-sitemap a:hover{text-decoration:underline}
.footer-contact{font-size:14px;line-height:1.8;text-align:right}
.footer-contact a{text-decoration:none}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:22px}
.footer-name{font-family:var(--serif);font-size:16px}
.footer-note{font-size:12px;color:var(--muted);margin-top:3px}
.footer-links{display:flex;gap:24px;flex-wrap:wrap;font-size:13px}
.footer-links a{padding-block:10px}

/* Impressum und Datenschutz */
.legal{padding-block:20px 80px}
.legal-inner{max-width:800px}
.legal h2{font:600 16px var(--sans);letter-spacing:0;margin-top:34px;margin-bottom:10px}
.legal p,.legal address,.legal li{font-size:16px;line-height:1.8;font-style:normal}
.legal p+p{margin-top:13px}
.legal a{overflow-wrap:anywhere}

/* ---------- Seitenspezifische Hintergründe ---------- */
.backdrop{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;background:var(--paper)}
/* Leistungen: feines Planraster */
.backdrop-plan::before{content:'';position:absolute;inset:-64px;background-image:linear-gradient(rgba(53,71,60,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(53,71,60,.07) 1px,transparent 1px),linear-gradient(rgba(53,71,60,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(53,71,60,.035) 1px,transparent 1px);background-size:128px 128px,128px 128px,32px 32px,32px 32px;-webkit-mask-image:radial-gradient(ellipse 70% 60% at 78% 18%,#000 0%,transparent 75%);mask-image:radial-gradient(ellipse 70% 60% at 78% 18%,#000 0%,transparent 75%)}
/* Kaufbegleitung: ruhige Papierfläche mit Randlinien */
.backdrop-paper{background:linear-gradient(180deg,var(--paper),#f4f1ea)}
.backdrop-paper::before{content:'';position:absolute;inset:0;background-image:repeating-linear-gradient(180deg,transparent 0 35px,rgba(112,91,62,.06) 35px 36px);-webkit-mask-image:linear-gradient(90deg,transparent 40%,#000 85%);mask-image:linear-gradient(90deg,transparent 40%,#000 85%)}
/* Über uns, Kontakt: warmes, langsam wanderndes Licht */
.backdrop-warm{background:#f7f4ee}
.backdrop-warm::before,.backdrop-warm::after{content:'';position:absolute;width:70vmax;height:70vmax;border-radius:50%;filter:blur(20px)}
.backdrop-warm::before{top:-30vmax;right:-20vmax;background:radial-gradient(circle,rgba(214,198,169,.45),rgba(214,198,169,0) 65%)}
.backdrop-warm::after{bottom:-35vmax;left:-25vmax;background:radial-gradient(circle,rgba(130,144,132,.22),rgba(130,144,132,0) 65%)}
/* Immobilien */
.backdrop-sand{background:linear-gradient(180deg,#f6f3ed 0,var(--paper) 60%)}

/* ---------- Zeichnungen (SVG) ---------- */
.ln{fill:none;stroke:var(--olive);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ln-thin{stroke-width:1}
.ln-bronze{stroke:var(--bronze)}
.ln-faint{stroke:#b9bdb0}
.ln-light{stroke:var(--bronze-light)}
.dash{stroke-dasharray:3 5}
.svg-label{font-family:var(--serif);font-size:12px;fill:var(--bronze)}
.svg-caps{font-family:var(--sans);font-size:9px;letter-spacing:.16em;fill:var(--muted);text-transform:uppercase}
.svg-town{font-family:var(--serif);font-size:15px;fill:var(--ink)}
.svg-town-sm{font-family:var(--serif);font-size:12px;fill:var(--muted)}
.cell{fill:var(--olive);opacity:.1}
.win{fill:var(--line)}
.win.lit{fill:var(--bronze-light)}
.rook{fill:var(--ink);stroke:none}
.rook-shadow{fill:var(--ink);opacity:.12}
.pin{fill:var(--olive)}
.pin-core{fill:#fff}
.pulse{fill:none;stroke:var(--olive);stroke-width:1}
.region{fill:rgba(255,255,255,.55);stroke:var(--line);stroke-width:1}
.water{fill:none;stroke:#a9b7b8;stroke-width:1.5;stroke-linecap:round}
.check{fill:none;stroke:var(--bronze);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.sheet{fill:rgba(255,255,255,.9);stroke:var(--olive);stroke-width:1.5;stroke-linejoin:round}
.lens{fill:rgba(250,249,246,.35);stroke:var(--olive);stroke-width:2}
.stamp{fill:none;stroke:var(--bronze);stroke-width:1.2}
.wall{stroke-width:3.2;stroke:var(--ink)}
.sheet-fill{fill:#fff}
.ink{stroke:var(--ink)}
.board-edge{fill:rgba(255,255,255,.6)}
.handle{stroke-width:7}
.hero-art-emblem{max-width:540px}
.edge{fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.emb-ring{fill:none;stroke:#6a6d6c;stroke-width:1;opacity:.45}
.road{fill:none;stroke:var(--bronze);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.road-major{stroke-width:2.2}
.sheen{opacity:0}
.section-label{margin-bottom:30px}
.contact h2.section-label{max-width:none}

/* ---------- Bewegung (nur wenn nicht reduziert gewünscht) ---------- */
@media (prefers-reduced-motion:no-preference){
  main{animation:page-in .7s var(--ease) both}
  @keyframes page-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

  .js .reveal{opacity:0;transform:translateY(16px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
  .js .reveal.is-visible{opacity:1;transform:none}
  .js .reveal-group>.reveal:nth-child(2){transition-delay:.08s}
  .js .reveal-group>.reveal:nth-child(3){transition-delay:.16s}
  .js .reveal-group>.reveal:nth-child(4){transition-delay:.24s}
  .js .reveal-group>.reveal:nth-child(5){transition-delay:.32s}
  .js .reveal-group>.reveal:nth-child(6){transition-delay:.4s}

  .draw{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 2.2s var(--ease) forwards}
  .draw.dash{stroke-dasharray:3 5;stroke-dashoffset:0;animation:fade 1.2s ease both}
  .fade{animation:fade 1.2s ease both}
  .pop{transform-box:fill-box;transform-origin:center;animation:pop .7s var(--ease) both}
  @keyframes draw{to{stroke-dashoffset:0}}
  @keyframes fade{from{opacity:0}}
  @keyframes pop{from{opacity:0;transform:scale(.6)}}
  .d1{animation-delay:.2s}.d2{animation-delay:.5s}.d3{animation-delay:.8s}.d4{animation-delay:1.1s}.d5{animation-delay:1.4s}.d6{animation-delay:1.7s}.d7{animation-delay:2s}.d8{animation-delay:2.3s}.d9{animation-delay:2.6s}.d10{animation-delay:2.9s}.d11{animation-delay:3.2s}.d12{animation-delay:3.5s}
  .cell.fade{animation-name:fade-cell}
  @keyframes fade-cell{from{opacity:0}to{opacity:.1}}

  .backdrop-plan::before{animation:plan-drift 90s linear infinite}
  @keyframes plan-drift{to{transform:translate(64px,64px)}}
  .backdrop-warm::before{animation:float-a 38s ease-in-out infinite alternate}
  .backdrop-warm::after{animation:float-b 46s ease-in-out infinite alternate}
  @keyframes float-a{to{transform:translate(-14vmax,10vmax)}}
  @keyframes float-b{to{transform:translate(12vmax,-8vmax)}}

  .float{animation:float 7s ease-in-out infinite alternate}
  @keyframes float{from{transform:translate(0,0)}to{transform:translate(-14px,-10px)}}
  .lens-group{animation:fade 1s ease 1.6s both,lens 9s ease-in-out 2.6s infinite alternate}
  @keyframes lens{from{transform:translate(0,0)}50%{transform:translate(-36px,-58px)}to{transform:translate(-58px,-14px)}}
  .pulse{transform-box:fill-box;transform-origin:center;animation:pulse 3.6s ease-out infinite}
  .pulse.p2{animation-delay:1.2s}.pulse.p3{animation-delay:2.4s}
  @keyframes pulse{from{transform:scale(.3);opacity:.7}to{transform:scale(2.4);opacity:0}}
  .win.glow{animation:glow 14s ease-in-out infinite}
  .win.glow.g2{animation-delay:-4s}.win.glow.g3{animation-delay:-9s}.win.glow.g4{animation-delay:-11.5s}
  @keyframes glow{0%,30%{fill:var(--line)}40%,85%{fill:var(--bronze-light)}95%,100%{fill:var(--line)}}
  .sheen{opacity:1;animation:sheen 9s ease-in-out 3s infinite both}
  .emb-rook{animation:settle 1.6s var(--ease) 1.3s both}
  @keyframes settle{from{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:none}}
  .rook-sheen{animation:rook-sheen 10s ease-in-out 3.6s infinite}
  @keyframes rook-sheen{0%{transform:translateX(0)}30%,100%{transform:translateX(170px)}}
  @keyframes sheen{0%{transform:translateX(-260px)}45%,100%{transform:translateX(260px)}}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

/* ---------- Responsiv ---------- */
@media(max-width:1080px){
  .nav-links{gap:18px;font-size:13px}
  .hero{grid-template-columns:1.45fr .65fr;gap:36px;padding-block:60px}
  .hero h1{font-size:clamp(38px,4.5vw,50px)}
  .hero-intro{font-size:16px}
  .hero-statement p{font-size:27px}
  .actions{gap:15px}
  .button{padding-inline:18px}
  .management-grid{gap:44px}
  .team-layout{gap:42px}
  .contact-grid{grid-template-columns:1fr 1fr}
  .contact-grid address{grid-column:1/-1}
  .areas{grid-template-columns:repeat(2,minmax(0,1fr))}
  .task-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:820px){
  html{scroll-padding-top:92px}
  .header-inner{min-height:80px}
  .brand,.brand img{width:150px}
  .desktop-nav{display:none}
  .mobile-menu{display:block}
  .hero{grid-template-columns:1.35fr .65fr;gap:30px;padding-block:50px}
  .hero h1{font-size:clamp(40px,5.4vw,48px);letter-spacing:-.04em}
  .hero h1 .eyebrow{font-size:12px;margin-bottom:18px}
  .hero-intro{margin-top:22px}
  .actions{gap:16px}
  .hero-place{font-size:12px;margin-top:22px}
  .hero-statement p{font-size:24px}
  .hero-statement span{letter-spacing:.07em}
  .strip-inner{gap:12px 22px;flex-wrap:wrap;font-size:13px}
  .page-hero{grid-template-columns:1fr;gap:34px;padding-block:44px 48px}
  .hero-art{justify-self:start;max-width:380px}
  .section{padding-block:62px}
  .section-top{gap:30px;grid-template-columns:1fr 1fr}
  .services{column-gap:28px;row-gap:28px}
  .service{grid-template-columns:30px 1fr}
  .service h3{font-size:24px}
  .occasions-head{grid-template-columns:1fr;gap:16px}
  .occasion-grid{grid-template-columns:1fr;gap:22px}
  .management-grid{grid-template-columns:1fr 1fr;gap:28px}
  .handover{gap:23px}
  .team-layout{gap:30px;grid-template-columns:1fr 1fr}
  .person{grid-template-columns:49px 1fr;gap:15px}
  .initials{width:49px;height:49px;font-size:20px}
  .person h3{font-size:25px}
  .property-layout{gap:30px}
  .property-contact{padding-left:26px}
  .property-overview{grid-template-columns:minmax(0,1fr)}
  .property-cover{padding:20px 20px 0}
  .property-supplement{padding:0 20px 20px}
  .property-energy .property-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .home-offer{grid-template-columns:1fr}
  .result-options{grid-template-columns:1fr}
  .values{grid-template-columns:1fr;gap:24px}
  .contact{padding-block:60px}
  .contact-header{gap:28px}
  .cta-inner{flex-direction:column;align-items:flex-start;gap:26px;padding-block:48px}
  .footer-top{flex-direction:column}
  .footer-contact{text-align:left}
  .footer-inner{align-items:start;flex-direction:column;gap:12px}
}
@media(max-width:700px){
  .property-coming{grid-template-columns:minmax(0,1fr)}
  .property-coming-body{padding:24px}
  .property-card-body{padding:20px}
}
@media(max-width:620px){
  .architecture-scene img{object-position:61% center}
  .architecture-background::after{background:rgba(250,249,246,var(--veil-m))}
  .hero{grid-template-columns:1fr;gap:33px;padding-top:42px;padding-bottom:38px}
  .hero h1{font-size:clamp(40px,9.3vw,57px);max-width:12ch;letter-spacing:-.035em}
  .hero h1 .eyebrow{max-width:30ch}
  .actions{gap:19px;margin-top:24px}
  .hero-place{margin-top:20px}
  .hero-statement{max-width:100%;padding:19px 18px 16px;margin:0}
  .hero-statement p{font-size:25px}
  .hero-statement p br{display:none}
  .hero-statement span{margin-top:10px}
  .strip-inner{flex-direction:column;gap:10px;padding-block:19px}
  .page-hero h1{font-size:clamp(38px,9vw,50px)}
  .lead{font-size:16px}
  .hero-art{max-width:260px}
  .section{padding-block:52px}
  .section-top{grid-template-columns:1fr;gap:22px;margin-bottom:31px}
  .section-top .eyebrow{margin-bottom:13px}
  .areas{grid-template-columns:1fr;gap:16px}
  .area{min-height:0}
  .services{grid-template-columns:1fr;gap:27px}
  .service{grid-template-columns:34px 1fr;padding-top:23px}
  .service h3{font-size:27px}
  .occasions{margin-top:44px}
  .steps{padding-left:52px}
  .steps::before,.steps::after{left:15px}
  .step-marker{left:-52px;width:31px;height:31px;font-size:15px}
  .step{padding-bottom:42px}
  .management-grid{grid-template-columns:1fr;gap:29px}
  .management h2{max-width:14ch}
  .property-types{margin-top:19px;font-size:12px}
  .term{padding-block:22px}
  .term-numbers strong{font-size:73px}
  .handover{grid-template-columns:1fr;gap:24px;margin-top:31px}
  .handover h3{font-size:26px}
  .handover p{max-width:46ch}
  .management-link{margin-top:22px}
  .task-grid{grid-template-columns:1fr;gap:16px}
  .team-layout{grid-template-columns:1fr;gap:28px}
  .team-layout h2{max-width:15ch}
  .team-copy{margin-top:20px}
  .person{padding-block:23px;grid-template-columns:57px 1fr;gap:18px}
  .initials{width:57px;height:57px;font-size:23px}
  .person h3{font-size:28px}
  .people-contact{margin-top:16px}
  .quote-wrap{grid-template-columns:1fr;gap:6px}
  .quote-mark{font-size:70px}
  .properties{padding-block:45px}
  .property-layout{grid-template-columns:1fr;gap:27px}
  .property-contact{border-left:0;border-top:1px solid #c5c8ba;padding-left:0;padding-top:25px}
  .contact{padding-block:50px}
  .contact-header{display:block;margin-bottom:29px}
  .contact-header>p{margin-top:20px;max-width:45ch}
  .contact-grid{grid-template-columns:1fr;gap:22px;padding-top:24px}
  .contact-grid address{grid-column:auto}
  .contact-label{margin-bottom:5px}
  .contact-value{font-size:27px}
  .contact address{font-size:16px}
  .topics{grid-template-columns:minmax(0,1fr)}
  .topic{flex-wrap:wrap;gap:4px 18px}
  .topic strong{min-width:0;hyphens:auto}
  .page-next{flex-direction:column;align-items:stretch}
  .page-next a:last-child{text-align:left;align-items:flex-start}
  .footer-links{gap:25px}
  .legal{padding-bottom:50px}
}
@media(max-width:400px){.property-facts,.property-energy .property-facts{grid-template-columns:minmax(0,1fr)}}
@media print{
  html{scroll-padding-top:0}
  .architecture-background,.backdrop,.hero-art,.desktop-nav,.mobile-menu,.actions,.button,.footer-links,.footer-sitemap,.skip,.page-next,.cta-band,.term-switch{display:none}
  .site-header{position:static}
  .hero{grid-template-columns:1.5fr .65fr;padding-block:30px}
  .page-hero{grid-template-columns:1fr;padding-block:24px}
  .band-dark,.management{background:#fff;color:#000}
  .band-dark p,.band-dark .eyebrow,.management p,.management .eyebrow,.management .step-label,.term-label,.term-note{color:#333}
  .section{padding-block:28px}
  .occasions{background:#fff}
  .term,.handover li{border-color:#777}
  h2,h3,h4{break-after:avoid}
  .service,.person,.handover li,.occasion,.step{break-inside:avoid}
  .site-footer{background:#fff}
  .wrap{padding-inline:0}
}