:root{
  --ink:#1F3D35;
  --ink-soft:#5a655f;
  --gold:#C9962E;
  --gold-deep:#8b6914;
  --paper:#FBF8F2;
  --sand:#EFE6D6;
  --line:rgba(201,150,46,.45);
  --rule:rgba(31,61,53,.12);
  --serif:"Cormorant Garamond", "Playfair Display", Georgia, serif;
  --sans:"Inter", -apple-system, system-ui, sans-serif;
  --tinte:#243029;
  --mono:"Inter", system-ui, -apple-system, sans-serif;
}
/* ---------- skip to content ---------- */
.skip-link{
  position:absolute;top:-100%;left:16px;z-index:200;
  background:var(--gold);color:#fff;
  padding:12px 24px;
  font-family:var(--sans);font-size:13px;font-weight:600;
  letter-spacing:.1em;text-transform:uppercase;
  text-decoration:none;
  border-radius:0 0 4px 4px;
  transition:top .2s ease;
}
.skip-link:focus{top:0}

/* ---------- focus-visible ---------- */
:focus-visible{
  outline:2px solid var(--gold);
  outline-offset:3px;
}
/* on dark backgrounds (nav, footer, hero), use lighter outline */
.nav :focus-visible,
footer :focus-visible,
.hero :focus-visible,
.lightbox :focus-visible,
.mobile-book :focus-visible{
  outline-color:#C9962E;
  outline-offset:3px;
}
/* remove default outline when not focus-visible (mouse clicks) */
:focus:not(:focus-visible){outline:none}

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--sans);
  color:var(--ink);
  background:var(--paper);
  font-weight:400;
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer;padding:0}

/* ---------- typography ---------- */
.eyebrow{
  font-family:var(--sans);
  font-size:11px;
  letter-spacing:.28em;
  text-transform:uppercase;
  font-weight:500;
  color:var(--gold-deep);
}
.display{
  font-family:var(--serif);
  font-weight:400;
  letter-spacing:-.01em;
  line-height:1.05;
  color:var(--ink);
}
.h1{font-size:clamp(40px, 6vw, 84px)}
.h2{font-size:clamp(34px, 4.6vw, 60px)}
.h3{font-size:clamp(24px, 2.4vw, 32px)}
.lede{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(18px,1.6vw,22px);color:var(--ink-soft);line-height:1.5}
.body{font-size:16px;line-height:1.75;color:var(--tinte);max-width:62ch}
.body p + p{margin-top:1em}

/* ---------- gold rule ---------- */
.rule{display:block;width:48px;height:1px;background:var(--gold);border:0;margin:0}
.rule-center{margin:0 auto}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:14px;
  font-family:var(--sans);font-size:12px;font-weight:500;
  letter-spacing:.22em;text-transform:uppercase;
  padding:16px 28px;
  border-radius:2px;
  transition:all .35s ease;
  white-space:nowrap;
  cursor:pointer;
}
.btn-fill{background:var(--ink);color:var(--paper);border:1px solid var(--ink)}
.btn-fill:hover{background:var(--gold);border-color:var(--gold);color:#fff}
.btn-outline{background:transparent;color:var(--ink);border:1px solid var(--gold)}
.btn-outline:hover{background:var(--gold);color:#fff}
.btn-outline-light{background:transparent;color:var(--paper);border:1px solid var(--gold)}
.btn-outline-light:hover{background:var(--gold);color:#fff}
.btn-fill-light{background:var(--gold);color:#fff;border:1px solid var(--gold)}
.btn-fill-light:hover{background:transparent;color:var(--gold)}
.btn .arrow{display:inline-block;transition:transform .35s ease}
.btn:hover .arrow{transform:translateX(4px)}

/* ---------- nav ---------- */
.nav{
  position:sticky;top:0;z-index:50;
  padding:16px 48px;
  display:flex;align-items:center;justify-content:space-between;
  color:#FBF8F2;
  background:linear-gradient(180deg, rgba(20,32,27,.5) 0%, rgba(20,32,27,0) 100%);
  border-bottom:1px solid transparent;
  box-shadow:none;
  transition:background .5s ease, border-color .5s ease, box-shadow .5s ease, padding .4s ease, backdrop-filter .5s ease;
}
.nav.scrolled{
  padding:10px 48px;
  background:rgba(20,32,27,.86);
  backdrop-filter:blur(14px) saturate(140%);
  -webkit-backdrop-filter:blur(14px) saturate(140%);
  border-bottom:1px solid rgba(201,150,46,.16);
  box-shadow:0 12px 30px -18px rgba(0,0,0,.35);
}
.nav > *{position:relative;z-index:1}
.nav-brand{
  display:flex;align-items:center;gap:17px;
  font-family:var(--serif);
  font-size:20px;
  letter-spacing:.02em;
  font-weight:500;
  line-height:1;
}
.nav-brand .amp{color:var(--gold);font-style:italic;font-weight:400}
.nav-brand img{
  height:42px;width:auto;display:block;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.25));
  transition:height .4s ease;
}
.nav-brand .brand-logo{
  height:72px;width:auto;display:block;
  transition:height .4s ease;
}
.nav-menu{display:flex;align-items:center;gap:42px}
.nav-link{
  font-size:11px;letter-spacing:.24em;text-transform:uppercase;font-weight:500;
  position:relative;padding:6px 0;
  transition:color .3s;
}
.nav-link::after{
  content:"";position:absolute;left:50%;right:50%;bottom:0;height:1px;background:var(--gold);
  transition:left .35s ease, right .35s ease;
}
.nav-link:hover::after{left:0;right:0}

/* nav dropdown (Wohnungen) */
.nav-item{position:relative;display:flex;align-items:center}
.nav-dropdown-toggle{display:inline-flex;align-items:center;gap:8px}
.nav-caret{
  width:6px;height:6px;border-right:1.4px solid currentColor;border-bottom:1.4px solid currentColor;
  transform:rotate(45deg) translateY(-2px);opacity:.7;
  transition:transform .35s ease, opacity .3s ease;
}
.nav-item:hover .nav-caret, .nav-item:focus-within .nav-caret{transform:rotate(225deg) translateY(-1px);opacity:1}
.nav-dropdown{
  position:absolute;top:100%;left:50%;
  transform:translateX(-50%) translateY(8px);
  min-width:300px;padding:8px;margin-top:16px;
  background:var(--paper);
  border:1px solid var(--rule);
  box-shadow:0 1px 0 rgba(201,150,46,.25), 0 34px 64px -32px rgba(31,61,53,.55);
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .32s ease, transform .32s ease, visibility .32s;
  z-index:60;
}
.nav-item:hover .nav-dropdown, .nav-item:focus-within .nav-dropdown, .nav-item.dropdown-open .nav-dropdown{
  opacity:1;visibility:visible;pointer-events:auto;
  transform:translateX(-50%) translateY(0);
}
/* invisible bridge so the cursor can cross the gap without closing */
.nav-dropdown::before{content:"";position:absolute;left:0;right:0;top:-18px;height:18px}
.nav-dd-item{
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:14px 18px;text-decoration:none;
  border-left:2px solid transparent;
  transition:background .25s ease, border-color .25s ease;
}
.nav-dd-item + .nav-dd-item{border-top:1px solid var(--rule)}
.nav-dd-item:hover{background:var(--sand);border-left-color:var(--gold)}
.nav-dd-text{display:flex;flex-direction:column;gap:4px}
.nav-dd-name{font-family:var(--serif);font-size:18px;color:var(--ink);font-weight:500;letter-spacing:0;text-transform:none}
.nav-dd-tag{font-family:var(--sans);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft);font-weight:500}
.nav-dd-meta{font-family:var(--mono);font-size:10px;letter-spacing:.14em;color:var(--gold-deep);white-space:nowrap}

.nav-lang{
  display:flex;align-items:center;gap:0;
  font-size:11px;letter-spacing:.18em;font-weight:500;
  border:1px solid rgba(251,248,242,.45);
  border-radius:2px;
  overflow:hidden;
}
.lang-btn{
  padding:10px 14px;min-width:44px;min-height:44px;
  display:inline-flex;align-items:center;justify-content:center;
  transition:background .3s, color .3s;
  letter-spacing:.18em;
}
.lang-btn.active{background:var(--gold);color:#fff}
.nav-burger{display:none;width:28px;height:18px;position:relative}
.nav-burger span{position:absolute;left:0;right:0;height:1px;background:currentColor;transition:.3s}
.nav-burger span:nth-child(1){top:0}
.nav-burger span:nth-child(2){top:8px}
.nav-burger span:nth-child(3){top:16px}

/* ---------- placeholder image ---------- */
.ph{
  position:relative;
  background:
    repeating-linear-gradient(135deg, rgba(31,61,53,.04) 0 2px, transparent 2px 14px),
    linear-gradient(180deg, #e3dccd 0%, #d6cdba 100%);
  overflow:hidden;
  display:flex;align-items:center;justify-content:center;
  color:rgba(31,61,53,.55);
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.08em;
  text-align:center;
  padding:24px;
}
.ph::after{
  content:"";position:absolute;inset:0;
  box-shadow:inset 0 0 80px rgba(31,61,53,.18);
  pointer-events:none;
}
.ph-label{position:relative;z-index:1;max-width:240px;line-height:1.6}
.ph-label .marker{display:block;color:var(--gold-deep);margin-bottom:6px;letter-spacing:.2em;font-size:9px}
.ph-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;z-index:0}
.ph.has-img{background:#1F3D35;padding:0}
.ph.has-img::after{box-shadow:inset 0 0 100px rgba(31,61,53,.28);z-index:2}
.ph.has-img .ph-label{display:none}

/* ---------- hero ---------- */
.hero{
  position:relative;
  height:calc(100svh - var(--nav-h, 113px));min-height:560px;
  display:flex;align-items:flex-end;
  color:#fff;
  overflow:hidden;
}
.hero .ph{position:absolute;inset:0}
.hero .ph::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(18,24,21,.10) 0%, rgba(18,24,21,.02) 42%, rgba(18,24,21,.40) 78%, rgba(18,24,21,.66) 100%);
  z-index:1;
}
.hero-content{
  position:relative;z-index:2;
  padding:0 48px 96px;
  max-width:920px;
}
.hero .eyebrow{color:var(--gold)}
.hero h1{color:#fff;margin:18px 0 22px;font-weight:300}
.hero h1 em{font-style:italic;color:var(--gold);font-weight:300}
.hero p{font-family:var(--serif);font-style:italic;font-size:clamp(20px,1.8vw,26px);line-height:1.4;color:rgba(255,255,255,.88);margin:0 0 40px;max-width:560px;font-weight:300}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap}
.hero .btn-outline{color:#fff;border-color:var(--gold)}
.hero .btn-outline:hover{background:var(--gold);color:#fff}
.hero-meta{
  position:absolute;z-index:2;right:48px;bottom:96px;
  text-align:right;
  font-family:var(--mono);font-size:10px;letter-spacing:.22em;text-transform:uppercase;
  color:rgba(255,255,255,.6);
  display:flex;flex-direction:column;gap:6px;align-items:flex-end;
}
.hero-meta::after{content:"";display:block;width:1px;height:60px;background:var(--gold);margin-top:14px}
.hero-scroll{
  position:absolute;left:48px;bottom:36px;z-index:2;
  font-family:var(--mono);font-size:10px;letter-spacing:.28em;text-transform:uppercase;
  color:rgba(255,255,255,.7);
  display:flex;align-items:center;gap:14px;
}
.hero-scroll::before{content:"";width:36px;height:1px;background:var(--gold)}

/* ---------- section frame ---------- */
section{padding:120px 48px;position:relative;scroll-margin-top:var(--nav-h,113px)}
.section-sand{background:var(--sand)}
.section-dark{background:var(--ink);color:#fff}
.container{max-width:1280px;margin:0 auto}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:48px;margin-bottom:64px;flex-wrap:wrap}
.section-head-left{max-width:680px}
.section-head .eyebrow{display:block;margin-bottom:18px}
.section-head h2{margin:0 0 18px}
.section-head .lede{margin:0}
.section-num{font-family:var(--mono);font-size:11px;letter-spacing:.25em;color:var(--gold-deep);align-self:flex-start;padding-top:8px}

/* ---------- apartment section ---------- */
.apt-grid{
  display:grid;
  grid-template-columns:repeat(12, 1fr);
  grid-auto-rows:170px;
  gap:14px;
  margin-bottom:36px;
}
.apt-grid .ph{cursor:zoom-in;transition:transform .6s ease;position:relative}
.apt-grid .ph:hover{transform:scale(1.01)}
.apt-grid .ph:hover .ph-cap{opacity:1;transform:translateY(0)}
.ph-cap{
  position:absolute;left:14px;bottom:14px;z-index:3;
  font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;
  color:#fff;
  padding:6px 10px;
  background:rgba(31,61,53,.6);
  border-left:1px solid var(--gold);
  opacity:0;transform:translateY(6px);
  transition:opacity .35s, transform .35s;
  pointer-events:none;
}
/* desktop mosaic — 6 hero photos, 12-col grid */
.apt-grid .ph:nth-child(1){grid-column:1 / span 7; grid-row:1 / span 2}
.apt-grid .ph:nth-child(2){grid-column:8 / span 5; grid-row:1}
.apt-grid .ph:nth-child(3){grid-column:8 / span 5; grid-row:2}
.apt-grid .ph:nth-child(4){grid-column:1 / span 4; grid-row:3}
.apt-grid .ph:nth-child(5){grid-column:5 / span 4; grid-row:3}
.apt-grid .ph:nth-child(6){grid-column:9 / span 4; grid-row:3}

/* five-photo variant (second apartment) */
.apt-grid.is-five .ph:nth-child(4){grid-column:1 / span 6; grid-row:3}
.apt-grid.is-five .ph:nth-child(5){grid-column:7 / span 6; grid-row:3}

.gallery-cta{
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  flex-wrap:wrap;
  padding:22px 0 0;
  border-top:1px solid var(--rule);
  margin-bottom:72px;
}
.gallery-cta-meta{
  font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--ink-soft);
}
.gallery-cta-meta .count{color:var(--gold-deep)}
.btn-view-all{
  display:inline-flex;align-items:center;gap:14px;
  font-family:var(--sans);font-size:12px;font-weight:500;
  letter-spacing:.22em;text-transform:uppercase;
  color:var(--ink);
  padding:14px 26px;
  border:1px solid var(--gold);
  background:transparent;
  border-radius:2px;
  cursor:pointer;
  transition:all .35s ease;
}
.btn-view-all:hover{background:var(--gold);color:#fff}
.btn-view-all .grid-icon{
  display:inline-grid;grid-template-columns:repeat(3,4px);gap:2px;
}
.btn-view-all .grid-icon span{width:4px;height:4px;background:currentColor;display:block}

.apt-body{
  display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start;
}
.apt-facts{
  display:grid;grid-template-columns:1fr 1fr;
  border-top:1px solid var(--rule);
}
.fact{
  padding:18px 0;
  border-bottom:1px solid var(--rule);
  display:flex;align-items:center;gap:16px;
  font-size:14px;
}
.fact:nth-child(odd){padding-right:24px}
.fact:nth-child(even){padding-left:24px;border-left:1px solid var(--rule)}
.fact-icon{
  width:28px;height:28px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  color:var(--gold-deep);
}
.fact-icon svg{width:20px;height:20px;stroke-width:1.2}
.fact-label{color:var(--ink);font-weight:400}
.apt-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:36px}

/* ---------- location ---------- */
.loc-grid{
  display:grid;grid-template-columns:1.2fr 1fr;gap:80px;align-items:stretch;
}
.map-frame{
  position:relative;
  background:var(--paper);
  border:1px solid var(--line);
  aspect-ratio:4/3;
  overflow:hidden;
}
.map-canvas{
  position:absolute;inset:0;
  background:
    radial-gradient(circle at 60% 50%, rgba(201,150,46,.18) 0, transparent 50%),
    var(--paper);
}
.map-canvas svg{width:100%;height:100%;display:block}
.map-legend{
  position:absolute;left:20px;bottom:20px;
  font-family:var(--mono);font-size:10px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--gold-deep);
  background:rgba(251,248,242,.92);
  padding:10px 14px;
  border:1px solid var(--line);
}
.map-legend strong{display:block;color:var(--ink);margin-bottom:4px;font-weight:500;letter-spacing:.18em}
.map-rose{
  position:absolute;right:20px;top:20px;
  width:48px;height:48px;
  font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:var(--ink);
}

.loc-list{list-style:none;padding:0;margin:0}
.loc-item{
  border-bottom:1px solid var(--rule);
  position:relative;
}
.loc-item:first-child{border-top:1px solid var(--rule)}
.loc-item-link{
  display:flex;align-items:baseline;justify-content:space-between;gap:24px;
  padding:20px 0;
  text-decoration:none;color:inherit;
  transition:padding-left .35s cubic-bezier(.22,.61,.36,1);
}
.loc-item-link:hover{padding-left:14px}
.loc-item-name{
  font-family:var(--serif);font-size:22px;color:var(--ink);font-weight:500;
  transition:color .3s ease;
}
.loc-item-link:hover .loc-item-name{color:var(--gold-deep)}
.loc-item-ext{
  font-family:var(--sans);font-size:13px;margin-left:9px;color:var(--gold-deep);
  display:inline-block;
  opacity:0;transform:translate(-4px,0);
  transition:opacity .3s ease,transform .3s ease;
}
.loc-item-link:hover .loc-item-ext{opacity:1;transform:translate(0,0)}
.loc-item-meta{font-size:13px;color:var(--ink-soft);font-style:italic}
.loc-item-dist{
  font-family:var(--mono);font-size:11px;letter-spacing:.18em;color:var(--gold-deep);
  white-space:nowrap;
}
.loc-park{
  margin-top:32px;
  padding:22px 26px;
  background:var(--paper);
  border-left:1px solid var(--gold);
  font-size:13px;color:var(--ink-soft);
}
.loc-park strong{display:block;font-family:var(--sans);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink);margin-bottom:6px;font-weight:500}

/* ---------- about ---------- */
.about-grid{
  display:grid;grid-template-columns:1fr 1.1fr;gap:96px;align-items:center;
}
.about-img{
  aspect-ratio:4/5;
  position:relative;
}
.about-img .ph{position:absolute;inset:0}
.about-img::after{
  content:"";position:absolute;left:-18px;top:-18px;right:18px;bottom:18px;
  border:1px solid var(--gold);
  z-index:-1;
}
.review-badges{display:flex;flex-direction:column;gap:20px;margin-top:48px}
.review-badge{
  display:grid;grid-template-columns:78px 1fr;align-items:center;gap:24px;
  padding:22px 32px;
  border:1px solid var(--line);
  background:var(--paper);
  width:min(420px,100%);
}
.review-score{
  font-family:var(--serif);
  font-size:44px;line-height:1;color:var(--ink);font-weight:400;
}
.review-score em{color:var(--gold);font-style:normal;font-weight:300;font-size:30px;margin:0 4px}
.review-meta{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft);line-height:1.7}
.review-meta strong{color:var(--ink);font-weight:500;display:block}
.review-stars{color:var(--gold);font-family:var(--mono);letter-spacing:.1em;font-size:14px;margin-top:4px;letter-spacing:.18em}

/* ---------- CTA dark ---------- */
.cta{
  text-align:center;padding:140px 48px;
}
.cta .eyebrow{color:var(--gold);margin-bottom:22px;display:block}
.cta h2{color:var(--gold);font-family:var(--serif);font-style:italic;font-weight:400;margin:0 0 18px}
.cta p{color:rgba(251,248,242,.65);font-size:14px;letter-spacing:.06em;margin:0 0 48px}
.cta-actions{display:flex;gap:18px;justify-content:center;flex-wrap:wrap}
.cta .btn{padding:20px 40px}

/* ---------- contact ---------- */
.contact-grid{
  display:grid;grid-template-columns:1.3fr 1fr;gap:96px;align-items:start;
}
.form{display:flex;flex-direction:column;gap:28px}
.field label{
  display:block;
  font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft);
  margin-bottom:10px;font-weight:500;
}
.field input, .field textarea{
  width:100%;
  background:transparent;
  border:none;
  border-bottom:1px solid rgba(31,61,53,.35);
  padding:10px 0;
  font:inherit;color:var(--ink);
  font-size:16px;
  transition:border-color .3s;
  outline:none;
  resize:none;
  border-radius:0;
}
.field input:focus, .field textarea:focus{border-bottom-color:var(--gold)}
.field textarea{min-height:120px;line-height:1.6}
.contact-info{
  border-left:1px solid var(--gold);
  padding:6px 0 6px 36px;
}
.contact-info h3{font-family:var(--serif);font-size:28px;font-weight:500;margin:0 0 18px;color:var(--ink)}
.contact-info p{font-size:14px;line-height:1.8;color:var(--ink-soft);margin:0 0 24px}
.contact-info a{color:var(--ink);border-bottom:1px solid var(--gold);transition:color .3s}
.contact-info a:hover{color:var(--gold-deep)}
.contact-info .lang-list{
  font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-deep);
  margin-top:32px;padding-top:20px;border-top:1px solid var(--rule);
}

/* ---------- footer ---------- */
footer{
  padding:44px 48px 26px;
  background:var(--ink);color:rgba(251,248,242,.7);
  font-size:13px;
}
.footer-row{
  max-width:1280px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;gap:40px;flex-wrap:wrap;
  padding-bottom:32px;
  border-bottom:1px solid rgba(201,150,46,.18);
  padding-bottom:20px;
}
.footer-brand{display:flex;align-items:center;gap:14px;color:#fff}
.footer-brand .amp{color:var(--gold);font-style:italic}
.footer-brand img{height:38px;width:auto;display:block}
.footer-brand .brand-logo{height:52px;width:auto;display:block}
.footer-links{display:flex;gap:36px}
.footer-links a{font-size:12px;letter-spacing:.16em;text-transform:uppercase;transition:color .3s;padding:12px 0;min-height:44px;display:inline-flex;align-items:center}
.footer-links a:hover{color:var(--gold)}
.footer-bottom{
  max-width:1280px;margin:0 auto;
  padding-top:24px;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;
  font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:rgba(251,248,242,.65);
}

/* ---------- lightbox ---------- */
.lightbox{
  position:fixed;inset:0;background:rgba(31,61,53,.94);z-index:100;
  display:none;align-items:center;justify-content:center;
  padding:48px;
  opacity:0;transition:opacity .35s ease;
}
.lightbox.open{display:flex;opacity:1}
.lightbox-stage{
  position:relative;width:100%;max-width:1100px;height:80vh;
  background:var(--sand);
}
.lightbox-stage .ph{transition:opacity .25s ease}
.lightbox-stage.is-loading .ph{opacity:.35}
.lightbox-stage.is-loading::before{
  content:"";
  position:absolute;top:50%;left:50%;
  width:36px;height:36px;
  margin:-18px 0 0 -18px;
  border:1px solid rgba(201,150,46,.3);
  border-top-color:var(--gold);
  border-radius:50%;
  animation:lb-spin .8s linear infinite;
  z-index:5;pointer-events:none;
}
@keyframes lb-spin{to{transform:rotate(360deg)}}
.lightbox .ph{position:absolute;inset:0}
.lightbox-close{
  position:absolute;top:24px;right:24px;
  width:48px;height:48px;
  border:1px solid var(--gold);
  color:var(--gold);
  display:flex;align-items:center;justify-content:center;
  font-size:18px;
  transition:background .3s, color .3s;
}
.lightbox-close:hover{background:var(--gold);color:#fff}
.lightbox-arrow{
  position:absolute;top:50%;transform:translateY(-50%);
  width:54px;height:54px;
  border:1px solid var(--gold);
  color:var(--gold);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--serif);font-size:22px;
  transition:background .3s, color .3s;
}
.lightbox-arrow:hover{background:var(--gold);color:#fff}
.lightbox-arrow.prev{left:24px}
.lightbox-arrow.next{right:24px}
.lightbox-counter{
  position:absolute;bottom:-36px;left:0;right:0;text-align:center;
  font-family:var(--mono);font-size:11px;letter-spacing:.24em;color:var(--gold);
}

/* ---------- reveal animation ---------- */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .9s ease, transform .9s ease}
.reveal.in{opacity:1;transform:translateY(0)}

/* ---------- iteration A additions ---------- */
@keyframes ken-burns{
  from{transform:scale(1.02)}
  to{transform:scale(1.10)}
}
.hero .ph-img{
  animation:ken-burns 30s ease-out forwards;
  transform-origin:50% 55%;
}

.hero-link{
  display:inline-flex;align-items:center;gap:12px;
  font-family:var(--sans);font-size:12px;font-weight:500;
  letter-spacing:.22em;text-transform:uppercase;color:#fff;
  padding:16px 4px;
  border-bottom:1px solid rgba(201,150,46,.55);
  transition:color .35s ease, border-color .35s ease;
  background:transparent;align-self:center;
}
.hero-link:hover{color:var(--gold);border-bottom-color:var(--gold)}
.hero-link .arrow{transition:transform .35s ease}
.hero-link:hover .arrow{transform:translateX(4px)}

.nav-link.active{color:var(--gold)}
.nav-link.active::after{left:0;right:0}

.apt-divider{
  display:flex;align-items:center;gap:20px;
  margin:24px 0 60px;
}
.apt-divider .section-num{padding:0;white-space:nowrap}
.apt-divider hr{flex:1;height:1px;border:0;background:var(--rule);margin:0}

.cta-quote{
  font-family:var(--serif);
  font-style:italic;
  font-weight:500;
  font-size:clamp(26px,3vw,38px);
  line-height:1.3;
  color:var(--ink);
  max-width:880px;
  margin:0 auto;
  text-wrap:balance;
  padding:0 12px;
}
/* ---- rotating guest voices ---- */
.cta-quotes{
  display:grid;
  max-width:904px;
  margin:0 auto 30px;
}
.cta-quotes .cta-quote{
  grid-area:1 / 1;
  opacity:0;
  transform:translateY(14px);
  transition:opacity .9s ease, transform .9s ease;
  pointer-events:none;
}
.cta-quotes .cta-quote.is-active{
  opacity:1;
  transform:none;
  pointer-events:auto;
}
@media (prefers-reduced-motion: reduce){
  .cta-quotes .cta-quote{transition:none}
}
.cta-dots{
  display:flex;justify-content:center;gap:11px;
  margin:0 0 40px;
}
.cta-dot{
  width:7px;height:7px;border-radius:50%;
  background:transparent;
  border:1px solid var(--gold-deep);
  opacity:.5;
  padding:0;cursor:pointer;position:relative;
  transition:opacity .35s ease, background-color .35s ease, transform .35s ease;
}
/* 44px touch target without changing visual dot size */
.cta-dot::before{content:"";position:absolute;top:50%;left:50%;width:44px;height:44px;transform:translate(-50%,-50%)}
.cta-dot:hover{opacity:.85}
.cta-dot.is-active{
  background:var(--gold);
  border-color:var(--gold);
  opacity:1;
  transform:scale(1.05);
}
.cta-attr{
  display:flex;flex-direction:column;gap:6px;align-items:center;
}
.cta-attr-row{
  display:flex;justify-content:center;gap:56px;flex-wrap:wrap;
  margin-bottom:48px;
}
.cta-score{
  font-family:var(--serif);
  font-size:30px;color:var(--gold);font-weight:400;letter-spacing:.04em;
}
.cta-source{
  font-family:var(--mono);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft);
}
.quote-src{
  display:block;font-family:var(--sans);font-style:normal;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:12px;font-weight:600;
}


/* ---------- iteration B additions ---------- */
.scroll-progress{
  position:fixed;top:0;left:0;height:2px;width:0;
  background:var(--gold);z-index:60;
  transition:width .12s linear;
  pointer-events:none;
}

/* staggered reveal (animation-based so it doesn't fight hover transitions) */
.stagger > *{opacity:0;transform:translateY(22px)}
.stagger.in > *{
  animation:stagger-in .8s cubic-bezier(.2,.7,.2,1) both;
  animation-delay:var(--d,0ms);
}
@keyframes stagger-in{
  from{opacity:0;transform:translateY(22px)}
  to{opacity:1;transform:translateY(0)}
}

/* gallery tile hover polish */
.apt-grid .ph{
  transition:box-shadow .45s ease;
}
.apt-grid .ph .ph-img{
  transition:transform .9s cubic-bezier(.2,.7,.2,1);
}
.apt-grid .ph:hover{
  box-shadow:inset 0 0 0 1px rgba(201,150,46,.6), 0 22px 44px -22px rgba(31,61,53,.45);
}
.apt-grid .ph:hover .ph-img{transform:scale(1.05)}

/* form field gold check on valid */
.field-check{
  position:absolute;right:2px;bottom:14px;
  font-family:var(--mono);font-size:14px;color:var(--gold);
  opacity:0;transform:translateY(4px);
  transition:opacity .4s ease, transform .4s ease;
  pointer-events:none;
}
.field-check.show{opacity:1;transform:translateY(0)}

/* magnetic buttons — will-change hint */
.btn{will-change:transform}

/* map walking-distance pulse */
.map-pulse{
  transform-box:fill-box;
  transform-origin:center;
  animation:map-pulse 2.8s ease-out infinite;
}
@keyframes map-pulse{
  0%{transform:scale(1);opacity:.55}
  100%{transform:scale(3.6);opacity:0}
}

/* ---------- iteration C additions ---------- */
.text-link{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--sans);font-size:12px;font-weight:500;
  letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft);
  padding:16px 2px;
  border-bottom:1px solid var(--line);
  transition:color .35s ease, border-color .35s ease;
  background:transparent;
  align-self:center;
}
.text-link:hover{color:var(--gold-deep);border-bottom-color:var(--gold)}
.text-link .arrow{transition:transform .35s ease}
.text-link:hover .arrow{transform:translateX(4px)}

.section-next{
  display:flex;align-items:center;gap:24px;
  margin-top:96px;padding-top:28px;
  border-top:1px solid var(--rule);
  font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--ink-soft);
  transition:color .35s ease;
}
.section-next:hover{color:var(--gold-deep)}
.section-next-label{color:var(--gold-deep);min-width:60px}
.section-next-target{
  flex:1;color:var(--ink);
  font-family:var(--serif);font-style:italic;
  text-transform:none;letter-spacing:0;
  font-size:clamp(22px,2.2vw,28px);font-weight:500;
  line-height:1;
  transition:color .35s ease;
}
.section-next:hover .section-next-target{color:var(--gold-deep)}
.section-next .arrow{color:var(--gold-deep);font-size:14px;transition:transform .35s ease}
.section-next:hover .arrow{transform:translateY(4px)}

.footer-cta{
  display:flex;align-items:center;gap:14px;
  font-family:var(--mono);font-size:10px;letter-spacing:.22em;text-transform:uppercase;
  color:rgba(251,248,242,.5);
}
.footer-cta a{
  color:#fff;border-bottom:1px solid var(--gold);transition:color .3s;
  letter-spacing:0;text-transform:none;font-family:var(--sans);font-size:13px;
  padding-bottom:1px;
}
.footer-cta a:hover{color:var(--gold)}

.mobile-book{
  position:fixed;bottom:0;left:0;right:0;z-index:55;
  background:var(--ink);
  border-top:1px solid var(--gold);
  padding:14px 24px;
  display:none;
  transform:translateY(110%);
  transition:transform .45s cubic-bezier(.2,.7,.2,1);
}
.mobile-book.show{transform:translateY(0)}
.mobile-book a{
  display:flex;align-items:center;justify-content:space-between;
  color:var(--gold);
  font-family:var(--sans);font-size:12px;font-weight:500;
  letter-spacing:.22em;text-transform:uppercase;
}
.mobile-book .arrow{transition:transform .35s ease}
.mobile-book a:hover .arrow{transform:translateX(4px)}

/* ---------- mobile menu ---------- */
.nav-overlay{
  display:none;position:fixed;inset:0;z-index:49;
  background:rgba(18,24,21,.55);
  opacity:0;transition:opacity .35s ease;
}
.nav-overlay.show{display:block;opacity:1}

/* ---------- responsive ---------- */
@media (max-width: 960px){
  .nav{padding:14px 24px;--nav-h:60px}
  .nav.scrolled{padding:10px 24px}
  .nav-brand .wordmark{display:none}
  .nav-brand img{height:36px}
  .nav-menu{
    display:none;
    /* open state styles — activated by .nav.open */
    flex-direction:column;
    position:fixed;top:0;right:0;
    width:min(320px, 85vw);height:100vh;height:100dvh;
    background:var(--ink);color:var(--paper);
    padding:90px 32px 40px;
    gap:0;overflow-y:auto;
    box-shadow:-20px 0 60px rgba(0,0,0,.4);
    transform:translateX(100%);
    transition:transform .4s cubic-bezier(.22,.61,.36,1);
    z-index:51;
  }
  .nav.open .nav-menu{
    display:flex;
    transform:translateX(0);
  }
  .nav.open .nav-burger span:nth-child(1){transform:rotate(45deg) translate(6px,6px)}
  .nav.open .nav-burger span:nth-child(2){opacity:0}
  .nav.open .nav-burger span:nth-child(3){transform:rotate(-45deg) translate(6px,-6px)}
  .nav-burger{display:block;z-index:52}

  /* mobile menu links */
  .nav-menu .nav-link{
    font-size:13px;letter-spacing:.18em;
    padding:18px 0;
    border-bottom:1px solid rgba(201,150,46,.18);
    color:var(--paper);
  }
  .nav-menu .nav-link::after{display:none}
  .nav-menu .nav-link:hover{color:var(--gold)}

  /* mobile dropdown — always expanded inline */
  .nav-menu .nav-item{flex-direction:column;align-items:stretch}
  .nav-menu .nav-dropdown-toggle{padding:18px 0;border-bottom:1px solid rgba(201,150,46,.18)}
  .nav-menu .nav-caret{display:none}
  .nav-menu .nav-dropdown{
    position:static;transform:none;
    opacity:1;visibility:visible;pointer-events:auto;
    min-width:0;padding:0;margin:0;
    background:transparent;border:none;box-shadow:none;
    display:flex;flex-direction:column;
  }
  .nav-menu .nav-dropdown::before{display:none}
  .nav-menu .nav-dd-item{
    padding:14px 16px;border-left:none;
    border-bottom:1px solid rgba(201,150,46,.12);
  }
  .nav-menu .nav-dd-item:hover{background:rgba(201,150,46,.12);border-left:none}
  .nav-menu .nav-dd-item + .nav-dd-item{border-top:none}
  .nav-menu .nav-dd-name{color:var(--paper);font-size:16px}
  .nav-menu .nav-dd-tag{color:rgba(251,248,242,.5)}
  .nav-menu .nav-dd-meta{color:var(--gold)}
  section{padding:80px 24px}
  .hero-content{padding:0 24px 80px}
  .hero-meta{display:none}
  .hero-scroll{left:24px}
  .apt-grid{
    grid-template-columns:repeat(2,1fr);
    grid-auto-rows:170px;
  }
  .apt-grid .ph{grid-column:auto !important;grid-row:auto !important}
  .apt-grid .ph:nth-child(1){grid-column:1 / span 2 !important;grid-row:span 2 !important}
  .apt-body, .loc-grid, .about-grid, .contact-grid{grid-template-columns:1fr;gap:48px}
  .apt-facts{grid-template-columns:1fr}
  .fact:nth-child(even){padding-left:0;border-left:0}
  .fact:nth-child(odd){padding-right:0}
  .about-img{max-width:420px;margin:0 auto}
  .footer-row{flex-direction:column;align-items:flex-start}
  .footer-cta{order:3}
  footer{padding:36px 24px 24px}
  .mobile-book{display:block}
  body{padding-bottom:60px}
  .section-next{margin-top:64px}
  .section-next-target{font-size:20px}
}
/* ---------- wordmark / brand ---------- */
.brand-mark{display:block;width:58px;height:58px;flex:none;transition:width .4s ease, height .4s ease}
.brand-mark svg{width:100%;height:100%;display:block}
.nav.scrolled .brand-mark{width:48px;height:48px}
.wordmark{display:inline-flex;flex-direction:column;line-height:1;font-family:var(--serif)}
.wm-main{font-size:31px;font-weight:600;letter-spacing:.005em;display:inline-flex;align-items:baseline}
.wm-met{color:var(--ink)}
.wm-split{
  background:linear-gradient(90deg,var(--ink) 50%, var(--gold) 50.5%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.wm-mir{color:var(--gold)}
.wm-homes{font-family:var(--sans);font-size:10px;font-weight:600;letter-spacing:.34em;text-transform:uppercase;color:var(--ink-soft);margin-top:5px;padding-left:2px}
.wordmark-on-dark .wm-met{color:var(--paper)}
.wordmark-on-dark .wm-split{background:linear-gradient(90deg,var(--paper) 50%, var(--gold) 50.5%);-webkit-background-clip:text;background-clip:text;color:transparent}
.wordmark-on-dark .wm-mir{color:var(--gold)}
.wordmark-on-dark .wm-homes{color:rgba(251,248,242,.62)}

/* ========== HOMEPAGE — property cards ========== */
.properties-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:36px;
}
.prop-card{
  position:relative;text-decoration:none;color:inherit;
  overflow:hidden;background:var(--paper);
  border:1px solid var(--rule);
  transition:box-shadow .45s ease, transform .45s ease;
  display:flex;flex-direction:column;
}
.prop-card:hover{
  box-shadow:inset 0 0 0 1px rgba(201,150,46,.5), 0 28px 56px -28px rgba(31,61,53,.45);
  transform:translateY(-4px);
}
.prop-card-img{position:relative;display:block;aspect-ratio:16/10;overflow:hidden}
.prop-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.prop-card:hover .prop-card-img img{transform:scale(1.04)}
.prop-card-body{padding:32px 34px 36px;flex:1;display:flex;flex-direction:column}
.prop-card-eyebrow{
  font-family:var(--sans);font-size:10px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--ink-soft);font-weight:500;margin-bottom:10px;
}
.prop-card-name{font-family:var(--serif);font-size:30px;font-weight:600;color:var(--ink);margin-bottom:10px}
.prop-card-specs{
  font-family:var(--mono);font-size:11px;letter-spacing:.18em;
  color:var(--gold-deep);text-transform:uppercase;margin-bottom:14px;
}
.prop-card-desc{font-size:15px;color:var(--ink-soft);line-height:1.7;margin-bottom:auto}
.prop-card-cta{
  display:inline-flex;align-items:center;gap:10px;
  margin-top:24px;
  font-size:11px;letter-spacing:.22em;text-transform:uppercase;
  font-weight:600;color:var(--gold-deep);
  transition:gap .3s ease;
}
.prop-card:hover .prop-card-cta{gap:16px}
.prop-card-cta .arrow{transition:transform .3s ease}
.prop-card:hover .prop-card-cta .arrow{transform:translateX(4px)}
.prop-card-badge{
  position:absolute;top:18px;right:18px;z-index:3;
  background:rgba(31,61,53,.88);color:#FBF8F2;
  padding:8px 14px;font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  backdrop-filter:blur(6px);
}
/* responsive */
@media(max-width:960px){
  .properties-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:540px){
  .properties-grid{grid-template-columns:1fr}
}
/* single remaining apartment — centered, intentional width */
.properties-grid.properties-grid--single{grid-template-columns:minmax(0,560px);justify-content:center}
/* two apartments — centered pair, intentional width */
.properties-grid.properties-grid--duo{grid-template-columns:repeat(2,minmax(0,520px));justify-content:center}
@media(max-width:960px){
  .properties-grid.properties-grid--duo{grid-template-columns:minmax(0,520px)}
}

/* coming-soon card — not yet bookable */
.prop-card--soon{cursor:default}
.prop-card--soon:hover{box-shadow:none;transform:none}
.prop-card--soon .prop-card-img img{filter:grayscale(.35) brightness(.96)}
.prop-card--soon:hover .prop-card-img img{transform:none}
.prop-card-badge--soon{
  background:rgba(201,150,46,.95);color:#fff;
}
.prop-card-cta--soon{color:var(--ink-soft);cursor:default}
.prop-card--soon:hover .prop-card-cta{gap:10px}

/* ========== HOMEPAGE — trust strip ========== */
.trust-strip{
  display:flex;align-items:center;justify-content:center;gap:40px;flex-wrap:wrap;
  padding:48px 0;text-align:center;
}
.trust-item{display:flex;flex-direction:column;align-items:center;gap:6px}
.trust-num{font-family:var(--serif);font-size:42px;font-weight:600;color:var(--ink)}
.trust-label{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft)}

/* ========== PROPERTY PAGE — back to home ========== */
.back-home{
  display:inline-flex;align-items:center;gap:8px;
  font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;
  color:var(--gold-deep);margin-bottom:16px;
  transition:gap .3s ease;
}
.back-home:hover{gap:12px}