/* ============================================================
   LA CROCE D'ORO — Unified Design System
   Palette: Stone · Slate · Onyx   Font: Outfit + Helvetica Neue
   ============================================================ */

:root {
  --stone:      #BDB5A7;
  --steel:      #4A4A4A;
  --slate:      #2F353B;
  --onyx-glow:  #E8D9C5;
  --void-dark:  #1A1A1A;
  --void-light: #F5F1EB;
  --gold:       #B8973A;

  /* ── Lodgify search bar theming · brand liquid-glass ──────── */
  --ldg-psb-background:              rgba(255,255,255,0.0);   /* glass comes from the wrap */
  --ldg-psb-border-radius:           16px;
  --ldg-psb-box-shadow:              none;
  --ldg-psb-padding:                 14px;
  --ldg-psb-input-background:        rgba(255,255,255,0.40);
  --ldg-psb-button-border-radius:    12px;
  /* Primary → brand gold (replaces the stock pink) */
  --ldg-psb-color-primary:           #B8973A;
  --ldg-psb-color-primary-lighter:   #CDA94A;
  --ldg-psb-color-primary-darker:    #9C7E2F;
  --ldg-psb-color-primary-contrast:  #1A1A1A;
  --ldg-semantic-color-primary:      #B8973A;
  --ldg-semantic-color-primary-lighter: #CDA94A;
  --ldg-semantic-color-primary-darker:  #9C7E2F;
  --ldg-semantic-color-primary-contrast:#1A1A1A;
  --ldg-component-modal-z-index:     999;

  /* ── Motion ─────────────────────────────────────────────── */
  --ease-premium: cubic-bezier(0.16, 1, 0.3, 1);
}

/* ── Reset ──────────────────────────────────────────────────── */
*,*::before,*::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  font-family:'Outfit',sans-serif;
  background-color:var(--void-light);
  color:var(--slate);
  line-height:1.65;
  letter-spacing:0;
  font-weight:300;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
html { overflow-x:hidden; max-width:100%; }
img { display:block; max-width:100%; }
a { color:inherit; text-decoration:none; }
button:focus,a:focus { outline:0.5px solid var(--slate); outline-offset:3px; }
:focus-visible { outline:2px solid #B8973A; outline-offset:3px; }
.skip-link {
  position:fixed;
  top:0.75rem;
  left:50%;
  z-index:10001;
  transform:translate(-50%,-160%);
  padding:0.75rem 1rem;
  border-radius:10px;
  background:var(--slate);
  color:var(--void-light);
  font-size:0.78rem;
  font-weight:500;
  letter-spacing:0.08rem;
  transition:transform .2s var(--ease-premium);
}
.skip-link:focus { transform:translate(-50%,0); }
/* Luxury detail — brand-tinted text selection */
::selection { background:rgba(184,151,58,0.22); color:var(--slate); }
::-moz-selection { background:rgba(184,151,58,0.22); color:var(--slate); }
@media(prefers-reduced-motion:reduce) {
  * { animation-duration:0.01ms !important; transition-duration:0.01ms !important; }
}

/* ── Reveal: soft fade + rise (text & structural blocks) ────── */
[data-reveal] {
  opacity:0;
  transform:translateY(22px);
  transition:opacity .9s var(--ease-premium),
             transform .9s var(--ease-premium);
}
[data-reveal].revealed { opacity:1; transform:none; }
[data-reveal][data-d="1"] { transition-delay:.10s; }
[data-reveal][data-d="2"] { transition-delay:.20s; }
[data-reveal][data-d="3"] { transition-delay:.30s; }
[data-reveal][data-d="4"] { transition-delay:.40s; }

/* ── Reveal: soft 3D rise for image media ───────────────────── */
[data-reveal-img] {
  opacity:0;
  transform:perspective(1400px) rotateX(7deg) translateY(46px) scale(1.04);
  transform-origin:center 80%;
  transition:opacity 1.15s var(--ease-premium),
             transform 1.15s var(--ease-premium);
  will-change:opacity, transform;
}
[data-reveal-img].revealed {
  opacity:1;
  transform:perspective(1400px) rotateX(0deg) translateY(0) scale(1);
  will-change:auto;
}
[data-reveal-img][data-d="1"] { transition-delay:.10s; }
[data-reveal-img][data-d="2"] { transition-delay:.20s; }
[data-reveal-img][data-d="3"] { transition-delay:.30s; }
[data-reveal-img][data-d="4"] { transition-delay:.40s; }

/* ── Nav · Liquid Glass floating canopy (Apple-style) ────────── */
nav {
  position:fixed;
  top:14px; left:18px; right:18px;
  z-index:1000;
  border-radius:22px;
  background:linear-gradient(180deg, rgba(245,241,235,0.70), rgba(245,241,235,0.55));
  backdrop-filter:blur(30px) saturate(195%) brightness(1.06);
  -webkit-backdrop-filter:blur(30px) saturate(195%) brightness(1.06);
  border:0.5px solid rgba(255,255,255,0.40);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.60),   /* specular top edge */
    inset 0 -1px 0 rgba(255,255,255,0.10),
    0 10px 30px rgba(26,26,26,0.10),
    0 2px 8px rgba(26,26,26,0.06);
  padding:1.1rem 2rem 1.1rem 2.2rem;
  display:flex;
  justify-content:space-between;
  align-items:center;
  transition:background .6s var(--ease-premium),
             box-shadow .6s var(--ease-premium),
             border-color .6s var(--ease-premium);
}
nav.nav--raised {
  background:linear-gradient(180deg, rgba(245,241,235,0.86), rgba(245,241,235,0.72));
  border-color:rgba(255,255,255,0.55);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.75),
    inset 0 -1px 0 rgba(255,255,255,0.12),
    0 16px 44px rgba(26,26,26,0.16),
    0 4px 12px rgba(26,26,26,0.08);
}
.logo {
  font-family:'Archivo','Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:0.85rem;
  font-weight:700;
  letter-spacing:0.24rem;
  color:var(--slate);
  text-transform:uppercase;
  opacity:1;
  transition:opacity .5s var(--ease-premium);
}
.logo:hover { opacity:0.7; }
.logo-gold { color:#B8973A; }
.nav-links { display:flex; align-items:center; gap:0.2rem; }
nav a {
  color:var(--slate);
  text-decoration:none;
  font-size:0.7rem;
  letter-spacing:0.18rem;
  padding:0 1.8rem;
  text-transform:uppercase;
  transition:opacity .6s var(--ease-premium);
  opacity:0.55;
}
/* Apple-style hover capsule on menu links */
.nav-links a {
  position:relative;
  padding:0.55rem 1.15rem;
  border-radius:11px;
  opacity:0.6;
  transition:opacity .45s var(--ease-premium),
             background .45s var(--ease-premium),
             color .45s var(--ease-premium);
}
.nav-links a:hover { opacity:1; background:rgba(47,53,59,0.07); }
.nav-links a.nav--active { opacity:1; background:rgba(47,53,59,0.10); }
.book-btn {
  background:linear-gradient(180deg, rgba(47,53,59,0.06), rgba(47,53,59,0.02));
  border:0.5px solid rgba(47,53,59,0.30);
  padding:0.7rem 1.5rem;
  color:var(--slate);
  cursor:pointer;
  font-family:'Outfit',sans-serif;
  font-size:0.7rem;
  letter-spacing:0.18rem;
  text-transform:uppercase;
  transition:all .5s var(--ease-premium);
  white-space:nowrap;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.5);
}
.book-btn:hover {
  background:var(--slate); color:var(--onyx-glow);
  border-color:var(--slate);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.12), 0 6px 18px rgba(26,26,26,0.18);
}

/* Hamburger */
.nav-burger {
  display:none;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  cursor:pointer;
  background:none;
  border:none;
  width:44px; height:44px;
  padding:0;
  flex-shrink:0;
}
.nav-burger span { display:block; width:20px; height:0.5px; background:var(--slate); }

/* ── Lodgify widget ──────────────────────────────────────────── */
#lodgify-search-bar { width:100%; }

/* Keep the owned booking route visible without adding another system. */
.direct-booking-note { margin:0 auto 3.5rem; max-width:1180px; padding:1.4rem 4rem; display:flex; align-items:center; justify-content:space-between; gap:1.5rem; border-top:1px solid rgba(47,53,59,.18); border-bottom:1px solid rgba(47,53,59,.18); }
.direct-booking-note p { margin:0; max-width:58ch; color:rgba(47,53,59,.74); font-size:.82rem; line-height:1.6; }
.direct-booking-note strong { color:var(--slate); font-weight:500; }
.direct-booking-note a { flex-shrink:0; }
.separate-residence { max-width:1180px; margin:0 auto 5rem; padding:2.2rem 2rem; background:rgba(47,53,59,.045); border:1px solid rgba(47,53,59,.12); }
.separate-residence .section-label { margin-bottom:.7rem; }
.separate-residence h2 { margin:0 0 .7rem; font-size:clamp(1.6rem,3vw,2.4rem); font-weight:300; }
.separate-residence p { max-width:62ch; margin:0 0 1.2rem; color:rgba(47,53,59,.72); line-height:1.7; }
@media (max-width:700px) { .direct-booking-note { align-items:flex-start; flex-direction:column; margin-bottom:2.5rem; padding:1.2rem 1rem; } .direct-booking-note a { width:100%; } .separate-residence { margin:0 1rem 3.5rem; padding:1.5rem 1.2rem; } }

/* ── Hero (index) ────────────────────────────────────────────── */
.hero {
  height:100dvh;
  min-height:640px;
  position:relative;
  overflow:visible; /* let Lodgify modals escape */
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:end;
  column-gap:3rem;
  padding:0 4rem 5rem;
}
/* clip only the bg layer */
.hero::before {
  content:'';
  position:absolute;
  inset:0;
  overflow:hidden;
  pointer-events:none;
}
/* slow luxury light-sheen drifting across the hero (above image, below copy) */
.hero::after {
  content:'';
  position:absolute; inset:0;
  pointer-events:none;
  background:linear-gradient(115deg, transparent 44%, rgba(255,250,240,0.16) 50%, transparent 56%);
  background-size:280% 280%;
  animation:heroSheen 13s ease-in-out infinite;
  mix-blend-mode:soft-light;
}
@keyframes heroSheen {
  0%   { background-position:140% 0%; }
  100% { background-position:-40% 100%; }
}
@keyframes dollyZoom {
  0%   { transform:scale(1.0) perspective(1100px) translateZ(-22px); }
  50%  { transform:scale(1.045) perspective(580px)  translateZ(14px); }
  100% { transform:scale(1.0) perspective(1100px) translateZ(-22px); }
}
@keyframes heroFadeUp {
  from { opacity:0; transform:translateY(18px); }
  to   { opacity:1; transform:translateY(0); }
}
.hero-bg {
  position:absolute; inset:0;
  display:flex;
  animation:dollyZoom 28s ease-in-out infinite;
  will-change:transform;
  overflow:hidden;
  z-index:0;
}
.hero-bg img {
  width:100%; height:100%;
  object-fit:cover; object-position:center;
  display:block;
  transform:scale(1.06);            /* headroom for mouse parallax */
  will-change:transform;
  image-rendering:-webkit-optimize-contrast;
}
.hero-video {
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover; object-position:center;
  transform:scale(1.06);            /* match img headroom so the fade doesn't jump */
  opacity:0;
  transition:opacity 1.4s ease;
  pointer-events:none;
}
.hero-video.is-live { opacity:1; }
/* video runs slightly dimmer than the still — masks source compression and
   keeps hero copy on the legibility floor over bright scenes (basilica) */
.hero-bg.video-live::after {
  background:linear-gradient(to right, rgba(26,26,26,0.62) 0%, rgba(26,26,26,0.22) 65%);
}
/* video supplies its own motion — stop the still-photo dolly-zoom underneath */
.hero-bg.video-live { animation-play-state:paused; }
/* same restrained treatment as .lifestyle-block::after — one clean directional
   gradient, dark where the copy sits, fading out so most of the photo stays untouched */
.hero-bg::after {
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(to right, rgba(26,26,26,0.55) 0%, rgba(26,26,26,0.1) 60%);
}
/* Left column — copy */
.hero-content {
  position:relative; z-index:10;
  transition:transform 0.7s var(--ease-premium);
  will-change:transform;
}
.hero-eyebrow {
  font-size:0.68rem;
  letter-spacing:0.35rem;
  white-space:nowrap;
  text-transform:uppercase;
  color:rgba(232,217,197,0.8);
  margin-bottom:1.5rem;
  text-shadow:0 1px 10px rgba(0,0,0,0.40), 0 1px 2px rgba(0,0,0,0.30);
  animation:heroFadeUp 0.9s var(--ease-premium) 0.2s both;
}
.hero h1 {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:4.2rem;
  font-weight:300;
  letter-spacing:0.06rem;
  color:var(--onyx-glow);
  line-height:1.12;
  margin-bottom:1.8rem;
  /* guarantees legibility over any part of the photo regardless of local
     brightness, independent of the halo — a shadow reads as depth, not a panel */
  text-shadow:0 2px 24px rgba(0,0,0,0.45), 0 1px 4px rgba(0,0,0,0.35);
  animation:heroFadeUp 1.1s var(--ease-premium) 0.4s both;
}
.hero-sub {
  font-size:0.85rem;
  color:rgba(232,217,197,0.65);
  text-shadow:0 1px 10px rgba(0,0,0,0.40), 0 1px 2px rgba(0,0,0,0.30);
  letter-spacing:0.12rem;
  margin-bottom:0;
  animation:heroFadeUp 0.9s var(--ease-premium) 0.65s both;
}
.hero-fallback-link {
  display:inline-block;
  margin-top:1.4rem;
  font-size:0.72rem;
  letter-spacing:0.16rem;
  text-transform:uppercase;
  color:#D4B872;
  text-shadow:0 1px 10px rgba(0,0,0,0.40);
  border-bottom:0.5px solid rgba(212,184,114,0.45);
  padding-bottom:0.2rem;
  transition:color 0.4s var(--ease-premium), border-color 0.4s var(--ease-premium);
  animation:heroFadeUp 0.9s var(--ease-premium) 0.8s both;
}
.hero-fallback-link:hover { color:#F0D89A; border-color:rgba(240,216,154,0.8); }
/* Right column — Lodgify widget */
.hero-widget {
  position:relative;
  z-index:10;
  display:flex;
  align-items:flex-end;
  animation:heroFadeUp 1.0s var(--ease-premium) 0.85s both;
}
.hero-widget-wrap {
  width:100%;
  background:linear-gradient(155deg, rgba(255,255,255,0.60), rgba(255,255,255,0.42));
  backdrop-filter:blur(44px) saturate(190%);
  -webkit-backdrop-filter:blur(44px) saturate(190%);
  border:0.5px solid rgba(255,255,255,0.70);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.9),
    inset 0 -1px 0 rgba(255,255,255,0.28),
    0 2px 8px rgba(20,18,16,0.08),
    0 24px 60px rgba(20,18,16,0.22),
    0 48px 120px rgba(20,18,16,0.16);
  border-radius:26px;
  overflow:hidden;
  animation:widgetFloat 7s ease-in-out 1.6s infinite;
  transition:transform 0.9s var(--ease-premium), box-shadow 0.9s var(--ease-premium);
}
.hero-widget-wrap:hover {
  animation-play-state:paused;
  transform:translateY(-4px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.95),
    inset 0 -1px 0 rgba(255,255,255,0.32),
    0 2px 10px rgba(20,18,16,0.10),
    0 34px 78px rgba(20,18,16,0.30),
    0 60px 140px rgba(20,18,16,0.20);
}
/* light idle bob — reads as a weightless floating object */
@keyframes widgetFloat {
  0%,100% { transform:translateY(0); }
  50%     { transform:translateY(-6px); }
}
@media (prefers-reduced-motion:reduce) {
  .hero-widget-wrap { animation:none; }
}
.hero-scroll {
  position:absolute;
  bottom:2.5rem; left:4rem;
  z-index:10;
  writing-mode:vertical-rl;
  font-size:0.62rem;
  letter-spacing:0.25rem;
  text-transform:uppercase;
  color:rgba(232,217,197,0.45);
  display:flex;
  align-items:center;
  gap:1rem;
}
.hero-scroll::after {
  content:'';
  display:block;
  width:0.5px; height:50px;
  background:rgba(232,217,197,0.3);
}

/* ── Buttons shared ──────────────────────────────────────────── */
.btn-light {
  display:inline-block;
  background:transparent;
  border:0.5px solid rgba(232,217,197,0.6);
  padding:0.9rem 2.4rem;
  color:var(--onyx-glow);
  cursor:pointer;
  font-family:'Outfit',sans-serif;
  font-size:0.7rem;
  letter-spacing:0.22rem;
  text-transform:uppercase;
  text-decoration:none;
  transition:all .8s var(--ease-premium);
  margin-right:1.5rem;
}
.btn-light:hover { background:rgba(232,217,197,0.12); border-color:rgba(232,217,197,1); }
.btn-outline-light {
  display:inline-block;
  border:0.5px solid rgba(232,217,197,0.35);
  padding:0.85rem 2rem;
  color:var(--onyx-glow);
  font-family:'Outfit',sans-serif;
  font-size:0.7rem;
  letter-spacing:0.2rem;
  text-transform:uppercase;
  text-decoration:none;
  cursor:pointer;
  background:transparent;
  transition:all .8s var(--ease-premium);
  align-self:flex-start;
}
.btn-outline-light:hover { background:rgba(232,217,197,0.08); border-color:rgba(232,217,197,0.7); }
.btn-ghost-light {
  display:inline-block;
  border:0.5px solid rgba(232,217,197,0.35);
  padding:0.6rem 1.4rem;
  color:var(--onyx-glow);
  font-family:'Outfit',sans-serif;
  font-size:0.62rem;
  letter-spacing:0.2rem;
  text-transform:uppercase;
  text-decoration:none;
  cursor:pointer;
  background:transparent;
  transition:all .8s var(--ease-premium);
  opacity:0;
  transform:translateY(6px);
}
.btn-ghost-light:hover {
  border-color:rgba(232,217,197,0.7);
  background:rgba(232,217,197,0.05);
}
.btn-dark {
  display:inline-block;
  background:var(--slate);
  border:0.5px solid var(--slate);
  padding:0.9rem 2.4rem;
  color:var(--onyx-glow);
  cursor:pointer;
  font-family:'Outfit',sans-serif;
  font-size:0.7rem;
  letter-spacing:0.22rem;
  text-transform:uppercase;
  text-decoration:none;
  transition:all .6s var(--ease-premium);
  margin-right:1.5rem;
}
.btn-dark:hover { background:var(--void-dark); border-color:var(--void-dark); }
.btn-outline-dark {
  display:inline-block;
  background:transparent;
  border:0.5px solid rgba(47,53,59,0.4);
  padding:0.85rem 2rem;
  color:var(--slate);
  font-family:'Outfit',sans-serif;
  font-size:0.7rem;
  letter-spacing:0.2rem;
  text-transform:uppercase;
  text-decoration:none;
  cursor:pointer;
  transition:all .6s var(--ease-premium);
}
.btn-outline-dark:hover { background:var(--slate); color:var(--onyx-glow); }

/* ── Apple-style rounded corners on interactive elements ─────── */
.book-btn,
.btn-light,
.btn-outline-light,
.btn-ghost-light,
.btn-dark,
.btn-outline-dark,
.form-submit,
.form__submit { border-radius:10px; }
/* Subtle luxury lift on primary CTAs */
.btn-light:hover,
.btn-outline-light:hover,
.btn-dark:hover,
.btn-outline-dark:hover { transform:translateY(-2px); }

/* ── Booking strip ───────────────────────────────────────────── */
.booking-strip {
  background:var(--void-light);
  padding:4rem 4rem 4.5rem;
  border-bottom:0.5px solid rgba(189,181,167,0.3);
}
.booking-strip__inner { max-width:1100px; margin:0 auto; }
.booking-strip__label {
  font-size:0.62rem;
  letter-spacing:0.35rem;
  text-transform:uppercase;
  color:var(--stone);
  margin-bottom:1.8rem;
  display:block;
}

/* ── Intro ───────────────────────────────────────────────────── */
.intro {
  display:grid;
  grid-template-columns:1fr 1fr;
  min-height:80vh;
}
.intro-text {
  background:var(--void-light);
  padding:8rem 5rem;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.section-label {
  font-size:0.62rem;
  letter-spacing:0.35rem;
  text-transform:uppercase;
  color:#B8973A;
  margin-bottom:2rem;
  display:block;
}
.intro-text h2 {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:2.8rem;
  font-weight:300;
  letter-spacing:0.03rem;
  color:var(--slate);
  line-height:1.25;
  margin-bottom:2.5rem;
}
.intro-text p {
  font-size:0.9rem;
  color:var(--steel);
  line-height:1.7;
  letter-spacing:0.04rem;
  margin-bottom:1.2rem;
  max-width:420px;
}
.intro-image { overflow:hidden; }
.intro-image img {
  width:100%; height:100%;
  object-fit:cover; display:block;
  transition:transform 12s ease-out;
}
.intro-image:hover img { transform:scale(1.04); }

/* ── Features strip ──────────────────────────────────────────── */
.features-strip {
  background:var(--stone);
  padding:5rem 4rem;
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:0;
}
.feature-item {
  padding:2.5rem 2rem;
  border-right:0.5px solid rgba(47,53,59,0.12);
  text-align:center;
  transition:transform 0.6s var(--ease-premium);
}
.feature-item:last-child { border-right:none; }
.feature-item:hover { transform:translateY(-5px); }
.feature-item .icon-line { width:28px; height:0.5px; background:var(--slate); opacity:0.4; margin:0 auto 1.5rem; }
.feature-item h4 {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:0.65rem;
  font-weight:500;
  letter-spacing:0.2rem;
  text-transform:uppercase;
  color:var(--slate);
  line-height:1.6;
}

/* ── Lifestyle block ─────────────────────────────────────────── */
.lifestyle-block { position:relative; height:70vh; overflow:hidden; }
.lifestyle-block img { width:100%; height:100%; object-fit:cover; object-position:center 30%; display:block; }
.lifestyle-block::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(to right, rgba(26,26,26,0.55) 0%, rgba(26,26,26,0.1) 60%);
}
.lifestyle-caption {
  position:absolute; bottom:4rem; left:5rem;
  z-index:10; max-width:460px;
}
.lifestyle-caption h2 {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:2.2rem; font-weight:300;
  letter-spacing:0.04rem;
  color:var(--onyx-glow); line-height:1.3;
  margin-bottom:1.2rem;
}
.lifestyle-caption p { font-size:0.82rem; color:rgba(232,217,197,0.78); letter-spacing:0.08rem; line-height:1.9; }

/* ── Properties (index) ──────────────────────────────────────── */
.properties { background:var(--void-light); padding:8rem 4rem; }
.section-header { margin-bottom:4rem; }
.section-header h2 {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:2.2rem; font-weight:300;
  letter-spacing:0.04rem; color:var(--slate);
  margin-top:0.8rem;
}
/* ── Slideshow (apartment galleries) ─────────────────────────── */
.slideshow { position:relative; width:100%; height:100%; overflow:hidden; }
.slideshow .slide {
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; display:block;
  opacity:0; visibility:hidden;
  transition:opacity 1.2s var(--ease-premium),
             transform 1.6s var(--ease-premium),
             visibility 0s linear 1.2s;
  will-change:opacity;
}
.slideshow .slide.is-active {
  opacity:1; visibility:visible;
  transition:opacity 1.2s var(--ease-premium),
             transform 1.6s var(--ease-premium);
}
.slideshow .dots {
  position:absolute; z-index:3; left:0; right:0;
  display:flex; gap:14px; justify-content:center;
  pointer-events:none;
}
.slideshow .dot {
  position:relative;
  width:6px; height:6px; border-radius:50%; padding:0;
  background:rgba(255,255,255,0.45);
  border:0.5px solid rgba(0,0,0,0.08);
  cursor:pointer; pointer-events:auto;
  transition:background .5s var(--ease-premium), transform .5s var(--ease-premium), width .5s var(--ease-premium);
  -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
}
/* Invisible hit-area extension — visually small dot, real tap target.
   Width capped at 19px (dot 6px + gap 14px = 20px pitch) so adjacent hit-areas
   NEVER overlap horizontally — overlapping 44px zones caused mis-taps in testing.
   Height stays 44px (vertical space is uncontested). */
.slideshow .dot::before {
  content:''; position:absolute;
  top:50%; left:50%; transform:translate(-50%,-50%);
  width:19px; height:44px;
}
.slideshow .dot.is-active { background:rgba(255,255,255,0.98); width:18px; border-radius:3px; }
.slideshow .dot:hover { background:rgba(255,255,255,0.85); }

.properties-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem; }
.property-card {
  position:relative; overflow:hidden; cursor:pointer;
  border-radius:18px;
  box-shadow:0 1px 2px rgba(26,26,26,0.04);
}
.property-card .slideshow { aspect-ratio:3/4; }
.property-card .dots { top:1.2rem; }
.property-card img {
  width:100%; aspect-ratio:3/4; object-fit:cover; display:block;
  transition:transform 1.4s var(--ease-premium);
}
.property-card:hover img,
.property-card:hover .slide { transform:scale(1.06); }
.property-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(26,26,26,0.8) 0%, rgba(26,26,26,0) 55%);
  display:flex; flex-direction:column;
  justify-content:flex-end; padding:2.5rem;
}
.property-tag { font-size:0.6rem; letter-spacing:0.28rem; text-transform:uppercase; color:rgba(232,217,197,0.6); margin-bottom:0.8rem; }
.property-overlay h3 {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:1.1rem; font-weight:300;
  letter-spacing:0.12rem; color:var(--onyx-glow);
  margin-bottom:0.5rem; text-transform:uppercase;
}
.property-detail { font-size:0.72rem; color:rgba(232,217,197,0.55); letter-spacing:0.08rem; margin-bottom:1.2rem; }
.property-card:hover .btn-ghost-light { opacity:1; transform:translateY(0); }

/* ── Palazzo feature ─────────────────────────────────────────── */
.palazzo-feature { display:grid; grid-template-columns:1fr 1fr; min-height:85vh; }
.palazzo-img { overflow:hidden; order:2; }
.palazzo-img img { width:100%; height:100%; object-fit:cover; display:block; }
.palazzo-text {
  background:var(--slate);
  padding:8rem 5rem;
  display:flex; flex-direction:column; justify-content:center;
  order:1;
}
.palazzo-text .section-label { color:rgba(232,217,197,0.4); }
.palazzo-text h2 {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:2.4rem; font-weight:300;
  letter-spacing:0.03rem; color:var(--onyx-glow);
  line-height:1.25; margin-bottom:1rem;
}
.palazzo-stats {
  display:flex; gap:3rem;
  margin:2.5rem 0; padding:2rem 0;
  border-top:0.5px solid rgba(232,217,197,0.12);
  border-bottom:0.5px solid rgba(232,217,197,0.12);
}
.stat-num { font-family:'Helvetica Neue',Helvetica,Arial,sans-serif; font-size:2rem; font-weight:300; color:var(--onyx-glow); letter-spacing:0.04rem; }
.stat-label { font-size:0.62rem; letter-spacing:0.2rem; text-transform:uppercase; color:rgba(232,217,197,0.4); }
.palazzo-text p { font-size:0.85rem; color:rgba(232,217,197,0.72); line-height:1.7; letter-spacing:0.04rem; margin-bottom:2.5rem; max-width:400px; }

/* ── Portrait interlude ──────────────────────────────────────── */
.portrait-interlude { display:grid; grid-template-columns:1fr 1fr; gap:1.25rem; background:var(--stone); padding:1.25rem; }
.portrait-img { overflow:hidden; position:relative; border-radius:18px; }
.portrait-img img {
  width:100%; height:100%; min-height:60vh; object-fit:cover; display:block;
  filter:none;
  transition:filter 1s ease, transform 1.2s var(--ease-premium);
}
.portrait-img:hover img { filter:sepia(0%) contrast(1); transform:scale(1.04); }

/* ── Amenities ───────────────────────────────────────────────── */
.amenities { background:var(--void-light); padding:8rem 4rem; }
.amenities-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-top:4rem; }
.amenity-card { position:relative; cursor:pointer; }
.amenity-card .amenity-media {
  overflow:hidden; border-radius:18px;
  box-shadow:0 1px 2px rgba(26,26,26,0.04);
  aspect-ratio:4/3;
}
.amenity-card img {
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform 1.4s var(--ease-premium);
  filter:none;
}
.amenity-card:hover img { transform:scale(1.06); filter:grayscale(0%); }
.amenity-info { padding:1.6rem 0 0.5rem; background:transparent; }
.amenity-tag { font-size:0.6rem; letter-spacing:0.28rem; text-transform:uppercase; color:var(--stone); margin-bottom:0.6rem; }
.amenity-info h3 {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:1rem; font-weight:400;
  letter-spacing:0.12rem; color:var(--slate); text-transform:uppercase;
}
.amenity-meta {
  margin-top:0.7rem; font-size:0.72rem; letter-spacing:0.06rem;
  color:var(--steel); font-variant-numeric:tabular-nums;
}

/* ── CTA banner ──────────────────────────────────────────────── */
.cta-banner { position:relative; height:60vh; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.cta-banner img {
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:center 25%;
  transform:scale(1.04);
  transition:transform 12s var(--ease-premium), filter 1s var(--ease-premium);
}
.cta-banner:hover img { transform:scale(1.08); filter:brightness(0.9); }
.cta-banner::after { content:''; position:absolute; inset:0; background:rgba(26,26,26,0.6); }
.cta-content { position:relative; z-index:10; text-align:center; max-width:600px; padding:0 2rem; }
.cta-content h2 {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:2.4rem; font-weight:300;
  letter-spacing:0.06rem; color:var(--onyx-glow);
  margin-bottom:1rem; line-height:1.3;
}
.cta-content p { font-size:0.82rem; color:rgba(232,217,197,0.75); letter-spacing:0.1rem; margin-bottom:3rem; }

/* ── Footer ──────────────────────────────────────────────────── */
footer { background:var(--slate); padding:5rem 4rem 3rem; }
.footer-top {
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr;
  gap:4rem;
  padding-bottom:4rem;
  border-bottom:0.5px solid rgba(232,217,197,0.1);
}
.footer-brand .logo {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:0.85rem; font-weight:500;
  letter-spacing:0.3rem; color:var(--onyx-glow);
  text-transform:uppercase; margin-bottom:1.2rem;
  display:block;
}
.footer-brand p { font-size:0.78rem; color:rgba(232,217,197,0.62); line-height:1.9; letter-spacing:0.04rem; max-width:240px; }
footer h5 {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:0.62rem; font-weight:500;
  letter-spacing:0.25rem; text-transform:uppercase;
  color:rgba(232,217,197,0.35); margin-bottom:1.5rem;
}
footer address { font-style:normal; font-size:0.78rem; color:rgba(232,217,197,0.68); line-height:1.9; letter-spacing:0.04rem; }
.footer-links { display:flex; flex-direction:column; gap:0.1rem; }
.footer-links a { display:inline-block; padding:0.7rem 0; font-size:0.78rem; color:rgba(232,217,197,0.65); text-decoration:none; letter-spacing:0.06rem; transition:color .6s var(--ease-premium); }
.footer-links a:hover { color:var(--onyx-glow); }
.footer-bottom { padding-top:2.5rem; display:flex; justify-content:space-between; align-items:center; }
.footer-bottom p { font-size:0.68rem; color:rgba(232,217,197,0.5); letter-spacing:0.08rem; }
.footer-bottom a { display:inline-flex; align-items:center; min-height:44px; font-size:0.68rem; color:rgba(232,217,197,0.5); text-decoration:none; letter-spacing:0.08rem; }
.footer-bottom a:hover { color:rgba(232,217,197,0.6); }
.footer-bottom-row { display:flex; align-items:center; gap:1.5rem; flex-wrap:wrap; }
.credit-badge {
  display:inline-flex; align-items:center; gap:0.5rem;
  padding:0.5rem 1rem;
  border:1px solid rgba(184,151,58,0.45);
  border-radius:999px;
  font-size:0.66rem; letter-spacing:0.08rem; text-transform:uppercase;
  color:rgba(232,217,197,0.55);
  text-decoration:none;
  transition:border-color .5s var(--ease-premium), color .5s var(--ease-premium), background-color .5s var(--ease-premium);
  white-space:nowrap;
}
.credit-badge:hover {
  border-color:rgba(184,151,58,0.9);
  color:var(--onyx-glow);
  background:rgba(184,151,58,0.08);
}
.credit-badge span { color:var(--gold, #B8973A); }

/* ── Page hero (inner pages) ─────────────────────────────────── */
.page-hero {
  height:55vh;
  min-height:360px;
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:0 4rem 4rem;
  margin-top:98px; /* floating nav offset */
}
.page-hero-bg { position:absolute; inset:0; }
.page-hero-bg img {
  width:100%; height:100%; object-fit:cover; display:block;
  /* opacity-only intro: transform belongs to the scroll-parallax (--plx) — two
     writers on one property caused a visible scale-snap when the intro ended */
  animation:heroImgFadeIn 1.2s var(--ease-premium) 0.1s both;
  transform-origin:center center;
}
@keyframes heroImgFadeIn { from { opacity:0; } to { opacity:1; } }
.page-hero-bg::after {
  content:''; position:absolute; inset:0;
  background:
    linear-gradient(to top, rgba(20,18,16,0.80) 0%, rgba(20,18,16,0.30) 55%, rgba(20,18,16,0.15) 100%),
    linear-gradient(to right, rgba(20,18,16,0.35) 0%, rgba(20,18,16,0) 50%);
}
.page-hero-content { position:relative; z-index:10; max-width:680px; }
/* The breadcrumb is a <nav>, so it must NOT inherit the floating, fixed,
   glass styling applied to the bare `nav` (main navigation) selector. */
nav.page-breadcrumb {
  position:static; inset:auto;
  display:block;
  padding:0; border:0; border-radius:0;
  background:none;
  -webkit-backdrop-filter:none; backdrop-filter:none;
  box-shadow:none;
  z-index:auto;
}
.page-breadcrumb {
  font-size:0.62rem; letter-spacing:0.3rem;
  text-transform:uppercase; color:rgba(232,217,197,0.45);
  margin-bottom:1.5rem;
  animation:heroFadeUp 0.8s var(--ease-premium) 0.3s both;
}
nav.page-breadcrumb a { padding:0; opacity:1; border-radius:0; background:none; }
.page-breadcrumb a { color:rgba(232,217,197,0.45); }
.page-breadcrumb a:hover { color:rgba(232,217,197,0.8); }
.page-hero h1 {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:3.2rem; font-weight:300;
  letter-spacing:0.06rem; color:var(--onyx-glow);
  line-height:1.12;
  animation:heroFadeUp 1.0s var(--ease-premium) 0.5s both;
}
.page-hero p {
  font-size:0.85rem; color:rgba(232,217,197,0.78); letter-spacing:0.1rem;
  line-height:1.9; margin-top:1.2rem; max-width:500px;
  animation:heroFadeUp 0.9s var(--ease-premium) 0.7s both;
}

/* ── Inner page sections ─────────────────────────────────────── */
.content-section { padding:8rem 4rem; background:var(--void-light); }
.content-section--dark { background:var(--slate); }
.content-section--stone { background:var(--stone); }
.content-section--mid { background:#EDE8E1; }

/* ── Residence list ──────────────────────────────────────────── */
.res-list { padding:8rem 4rem; background:var(--void-light); }
.res-item {
  display:grid;
  grid-template-columns:420px 1fr;
  gap:0;
  border-bottom:0.5px solid rgba(74,74,74,0.1);
  margin-bottom:6rem;
  padding-bottom:6rem;
  transition:transform 0.8s var(--ease-premium);
}
.res-item:hover { transform:translateY(-4px); }
.res-item:last-child { border-bottom:none; margin-bottom:0; padding-bottom:0; }
.res-item__img { overflow:hidden; height:520px; border-radius:20px; }
.res-item__img img { width:100%; height:100%; object-fit:cover; display:block; transition:transform 1.4s var(--ease-premium); }
.res-item__img .dots { bottom:1.2rem; }
.res-item:hover .res-item__img img,
.res-item:hover .res-item__img .slide { transform:scale(1.04); }
.res-item__body {
  padding:3rem 3.5rem 3rem 4rem;
  display:flex; flex-direction:column; justify-content:center;
}
/* Alternate rows: image on the right (residences.html) */
.res-item--flip { grid-template-columns:1fr 420px; }
.res-item--flip .res-item__img  { order:2; }
.res-item--flip .res-item__body { order:1; padding:3rem 4rem 3rem 3.5rem; }
.res-item__num { font-size:0.62rem; letter-spacing:0.35rem; text-transform:uppercase; color:var(--stone); margin-bottom:1.5rem; }
.res-item__name {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:1.8rem; font-weight:300;
  letter-spacing:0.06rem; color:var(--slate);
  line-height:1.2; margin-bottom:0.6rem;
}
.res-item__loc { font-size:0.72rem; letter-spacing:0.2rem; text-transform:uppercase; color:var(--stone); margin-bottom:2rem; }
.res-item__desc { font-size:0.88rem; color:var(--steel); line-height:1.7; letter-spacing:0.04rem; margin-bottom:2rem; max-width:460px; }
.res-specs {
  display:flex; gap:3rem;
  padding:1.8rem 0;
  border-top:0.5px solid rgba(74,74,74,0.1);
  border-bottom:0.5px solid rgba(74,74,74,0.1);
  margin-bottom:2.5rem;
}
.res-spec__num { font-family:'Helvetica Neue',Helvetica,Arial,sans-serif; font-size:1.6rem; font-weight:300; color:var(--slate); letter-spacing:0.04rem; }
.res-spec__lbl { font-size:0.6rem; letter-spacing:0.2rem; text-transform:uppercase; color:var(--stone); margin-top:0.2rem; }

/* ── Services page ───────────────────────────────────────────── */
.svc-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.5rem;
  margin-top:4rem;
}
.svc-card {
  position:relative; overflow:hidden; cursor:pointer;
  border-radius:18px;
  box-shadow:0 1px 2px rgba(26,26,26,0.04);
}
.svc-card--wide { grid-column:1/-1; }
.svc-card img {
  width:100%; height:420px;
  object-fit:cover; display:block;
  transition:transform 1.4s var(--ease-premium);
  filter:none;
}
.svc-card--wide img { height:480px; }
.svc-card:hover img { transform:scale(1.06); filter:grayscale(0%); }
.svc-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(20,18,16,0.85) 0%, rgba(20,18,16,0.15) 55%);
  display:flex; flex-direction:column;
  justify-content:flex-end; padding:3rem;
}
.svc-overlay__num { font-size:0.6rem; letter-spacing:0.3rem; text-transform:uppercase; color:rgba(232,217,197,0.5); margin-bottom:0.8rem; }
.svc-overlay h3 {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:1.4rem; font-weight:300;
  letter-spacing:0.1rem; color:var(--onyx-glow);
  text-transform:uppercase; margin-bottom:0.8rem;
}
.svc-overlay p { font-size:0.8rem; color:rgba(232,217,197,0.6); letter-spacing:0.06rem; line-height:1.8; max-width:520px; }
.svc-meta {
  display:flex; flex-wrap:wrap; gap:2rem;
  margin-top:1.5rem; padding-top:1.5rem;
  border-top:0.5px solid rgba(232,217,197,0.15);
}
.svc-meta__item {}
.svc-meta__lbl { font-size:0.55rem; letter-spacing:0.25rem; text-transform:uppercase; color:rgba(232,217,197,0.35); }
.svc-meta__val { font-size:0.75rem; color:rgba(232,217,197,0.7); letter-spacing:0.08rem; margin-top:0.2rem; }

/* Process steps */
.process { padding:8rem 4rem; background:var(--void-light); }
.steps-row {
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:0; margin-top:5rem;
  position:relative;
}
.steps-row::before {
  content:''; position:absolute;
  top:14px; left:7%; width:86%; height:0.5px;
  background:rgba(189,181,167,0.5);
}
.step-item { text-align:center; padding:0 2rem; }
.step-num {
  width:28px; height:28px;
  border:0.5px solid rgba(189,181,167,0.6);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  margin:0 auto 2rem;
  font-size:0.6rem; letter-spacing:0.15rem;
  color:var(--stone); background:var(--void-light);
  position:relative; z-index:1;
}
.step-item h4 {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:0.75rem; font-weight:500;
  letter-spacing:0.18rem; text-transform:uppercase;
  color:var(--slate); margin-bottom:1rem;
}
.step-item p { font-size:0.8rem; color:var(--steel); letter-spacing:0.04rem; line-height:1.8; }

/* ── Location page ───────────────────────────────────────────── */
.loc-split {
  display:grid; grid-template-columns:1fr 1fr;
  min-height:70vh;
}
.loc-text {
  padding:8rem 5rem;
  background:var(--void-light);
  display:flex; flex-direction:column; justify-content:center;
}
.loc-text h2 {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:2.4rem; font-weight:300;
  letter-spacing:0.04rem; color:var(--slate);
  line-height:1.25; margin-bottom:2rem;
}
.loc-text p { font-size:0.88rem; color:var(--steel); line-height:1.7; letter-spacing:0.04rem; margin-bottom:1.2rem; max-width:420px; }
.loc-details { margin-top:2.5rem; display:flex; flex-direction:column; gap:0.4rem; }
.loc-details li {
  display:flex; gap:1.5rem;
  font-size:0.82rem; color:var(--steel); letter-spacing:0.04rem;
  padding:1rem 0; border-bottom:0.5px solid rgba(74,74,74,0.1); list-style:none;
}
.loc-details li:last-child { border-bottom:none; }
.loc-details li strong { color:var(--stone); font-weight:400; font-size:0.62rem; letter-spacing:0.2rem; text-transform:uppercase; min-width:80px; flex-shrink:0; margin-top:2px; }
.loc-details li a { color:var(--slate); transition:color .4s; }
.loc-details li a:hover { color:var(--stone); }
.loc-map-frame {
  overflow:hidden; position:relative;
  background:linear-gradient(135deg,#EDE8E1 0%,#D4CEC6 100%);
  display:flex; align-items:center; justify-content:center;
}
.loc-map-frame::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 60% 50% at 40% 40%, rgba(189,181,167,0.3), transparent); }
.loc-map-pin { text-align:center; position:relative; z-index:1; }
.loc-map-pin svg { color:var(--slate); margin:0 auto 1rem; opacity:0.5; }
.loc-map-pin p { font-size:0.68rem; letter-spacing:0.25rem; text-transform:uppercase; color:var(--stone); line-height:1.9; }

.landmarks-grid {
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:0.5px; background:rgba(189,181,167,0.3);
  margin-top:4rem;
}
.landmark {
  background:var(--void-light); padding:2.5rem 2rem; text-align:center;
  transition:transform 0.6s var(--ease-premium), box-shadow 0.6s var(--ease-premium);
}
.landmark:hover { transform:translateY(-4px); box-shadow:0 8px 24px rgba(47,53,59,0.08); }
.landmark__dist { font-size:0.62rem; letter-spacing:0.28rem; text-transform:uppercase; color:var(--stone); margin-bottom:0.6rem; }
.landmark__name {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:0.78rem; font-weight:400;
  letter-spacing:0.1rem; text-transform:uppercase; color:var(--slate); margin-bottom:0.3rem;
}
.landmark__note { font-size:0.68rem; color:var(--stone); letter-spacing:0.06rem; }

.nbhd-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2px; margin-top:4rem; }
.nbhd-card { padding:3rem 2.5rem; background:var(--void-light); border-top:0.5px solid rgba(189,181,167,0.4); }
.nbhd-card h4 {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:0.75rem; font-weight:500;
  letter-spacing:0.2rem; text-transform:uppercase;
  color:var(--slate); margin-bottom:1rem;
}
.nbhd-card p { font-size:0.82rem; color:var(--steel); line-height:1.9; letter-spacing:0.04rem; }

/* ── Contact page ────────────────────────────────────────────── */
.contact-page { display:grid; grid-template-columns:1fr 1fr; min-height:calc(100vh - 88px); }
.contact-info-panel {
  background:var(--slate);
  padding:8rem 5rem;
  display:flex; flex-direction:column; justify-content:center;
}
.contact-info-panel .section-label { color:rgba(232,217,197,0.4); }
.contact-info-panel h2 {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:2.4rem; font-weight:300;
  letter-spacing:0.04rem; color:var(--onyx-glow);
  line-height:1.25; margin-bottom:1.5rem;
}
.contact-info-panel>p { font-size:0.85rem; color:rgba(232,217,197,0.72); line-height:1.7; letter-spacing:0.04rem; max-width:380px; margin-bottom:3rem; }
.contact-details { list-style:none; }
.contact-details li {
  display:flex; align-items:flex-start; gap:1.5rem;
  padding:1.2rem 0; border-bottom:0.5px solid rgba(232,217,197,0.08);
  font-size:0.82rem; color:rgba(232,217,197,0.68); letter-spacing:0.04rem;
}
.contact-details li:last-child { border-bottom:none; }
.contact-details li strong { font-size:0.62rem; letter-spacing:0.2rem; text-transform:uppercase; color:rgba(232,217,197,0.3); font-weight:400; min-width:72px; flex-shrink:0; margin-top:2px; }
.contact-details li a { color:rgba(232,217,197,0.7); transition:color .4s; }
.contact-details li a:hover { color:var(--onyx-glow); }
.contact-form-panel {
  background:var(--void-light);
  padding:8rem 5rem;
  display:flex; flex-direction:column; justify-content:center;
}
.form-hdr { margin-bottom:3.5rem; }
.form-hdr h3 {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:1.5rem; font-weight:300;
  letter-spacing:0.05rem; color:var(--slate); margin-bottom:0.5rem;
}
.form-hdr p { font-size:0.8rem; color:var(--stone); letter-spacing:0.06rem; }

/* Form */
.form__row { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; margin-bottom:1.5rem; }
.form__field { display:flex; flex-direction:column; gap:0.6rem; margin-bottom:1.5rem; }
.form__field label { font-size:0.62rem; letter-spacing:0.25rem; text-transform:uppercase; color:var(--stone); }
.form__field input,
.form__field textarea,
.form__field select {
  background:transparent;
  border:none;
  border-bottom:0.5px solid rgba(74,74,74,0.2);
  padding:0.8rem 0;
  color:var(--slate);
  font-family:'Outfit',sans-serif;
  font-size:0.88rem;
  font-weight:300;
  letter-spacing:0.04rem;
  outline:none;
  width:100%;
  transition:border-color .4s;
  -webkit-appearance:none;
  border-radius:0;
}
.form__field input::placeholder,
.form__field textarea::placeholder { color:rgba(74,74,74,0.3); }
.form__field input:focus,
.form__field textarea:focus,
.form__field select:focus { border-bottom-color:var(--slate); }
.form__field select option { background:var(--void-light); }
.form__field textarea { resize:vertical; min-height:100px; }
.form__field--error input,
.form__field--error textarea,
.form__field--error select { border-bottom-color:rgba(220,80,80,0.5); }
/* error state must win even while the invalid field is focused */
.form__field--error input:focus,
.form__field--error textarea:focus,
.form__field--error select:focus { border-bottom-color:rgba(200,80,80,0.85); }
.field__error { font-size:0.68rem; color:rgba(200,80,80,0.8); letter-spacing:0.06rem; min-height:1em; }
.form__check { display:flex; align-items:flex-start; gap:1rem; margin:1.8rem 0; cursor:pointer; }
.form__check input { width:14px; height:14px; flex-shrink:0; accent-color:var(--slate); margin-top:3px; }
.form__check span { font-size:0.78rem; color:var(--steel); letter-spacing:0.04rem; line-height:1.7; }
.form__submit {
  width:100%; padding:1.1rem 2rem;
  background:var(--slate); color:var(--onyx-glow);
  font-family:'Outfit',sans-serif;
  font-size:0.7rem; font-weight:400;
  letter-spacing:0.25rem; text-transform:uppercase;
  border:none; cursor:pointer;
  transition:background .6s var(--ease-premium);
  margin-top:1.5rem;
}
.form__submit:hover:not(:disabled) { background:var(--void-dark); }
.form__submit:disabled { opacity:0.5; cursor:not-allowed; }
.form__status { margin-top:1.5rem; padding:1rem 0; font-size:0.78rem; letter-spacing:0.06rem; }
.form__status--success { color:rgba(60,130,60,0.9); }
.form__status--error { color:rgba(180,80,80,0.9); }

/* ── Book page ───────────────────────────────────────────────── */
.book-page {
  min-height:calc(100vh - 88px);
  display:grid; grid-template-columns:1fr 1fr;
}
.book-panel {
  position:relative; overflow:hidden;
  min-height:60vh;
}
.book-panel-bg { position:absolute; inset:0; }
.book-panel-bg img { width:100%; height:100%; object-fit:cover; display:block; }
.book-panel-bg::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(20,18,16,0.9) 0%, rgba(20,18,16,0.5) 100%);
}
.book-panel-content {
  position:relative; z-index:10;
  padding:6rem 4rem;
  display:flex; flex-direction:column; justify-content:flex-end;
  height:100%;
}
.book-panel-content .section-label { color:rgba(232,217,197,0.4); }
.book-panel-content h2 {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:2.2rem; font-weight:300;
  color:var(--onyx-glow); letter-spacing:0.05rem; line-height:1.25;
  margin-bottom:1.5rem;
}
.book-panel-content p { font-size:0.85rem; color:rgba(232,217,197,0.72); letter-spacing:0.06rem; line-height:1.9; max-width:380px; margin-bottom:2.5rem; }
.book-benefits { list-style:none; margin-bottom:3rem; }
.book-benefits li {
  display:flex; align-items:flex-start; gap:1.2rem;
  padding:0.8rem 0; border-bottom:0.5px solid rgba(232,217,197,0.08);
  font-size:0.78rem; color:rgba(232,217,197,0.7); letter-spacing:0.04rem;
}
.book-benefits li:last-child { border-bottom:none; }
.book-benefits li::before { content:'—'; color:rgba(232,217,197,0.3); flex-shrink:0; }
.book-form-panel {
  background:var(--void-light);
  padding:6rem 4rem;
  display:flex; flex-direction:column; justify-content:center;
  overflow-y:auto;
}

/* ── Responsive ──────────────────────────────────────────────── */
@media(max-width:1200px) {
  .res-item { grid-template-columns:360px 1fr; }
  .res-item--flip { grid-template-columns:1fr 360px; }
}
@media(max-width:1024px) {
  .features-strip { grid-template-columns:repeat(3,1fr); }
  .properties-grid { grid-template-columns:1fr 1fr; }
  .landmarks-grid { grid-template-columns:repeat(2,1fr); }
  .nbhd-grid { grid-template-columns:1fr 1fr; }
  .steps-row { grid-template-columns:repeat(2,1fr); }
  .steps-row::before { display:none; }
  .book-page { grid-template-columns:1fr; }
  .book-panel { min-height:45vh; }
}
@media(max-width:900px) {
  .res-item, .res-item--flip { grid-template-columns:1fr; }
  .res-item--flip .res-item__img  { order:1; }
  .res-item--flip .res-item__body { order:2; }
  .res-item__img { height:360px; }
  .res-item__body, .res-item--flip .res-item__body { padding:2.5rem 2rem; }
  .loc-split { grid-template-columns:1fr; }
  .loc-map-frame { min-height:320px; }
  .contact-page { grid-template-columns:1fr; }
  .contact-info-panel { padding:5rem 3rem; }
  .contact-form-panel { padding:5rem 3rem; }
  .svc-grid { grid-template-columns:1fr; }
  .svc-card--wide { grid-column:1; }
}
@media(max-width:768px) {
  body.nav-open { overflow:hidden; }
  .hero-eyebrow { white-space:normal; }
  .book-btn, .btn-ghost-light { min-height:44px; display:inline-flex; align-items:center; justify-content:center; }
  /* Form controls land at 43.6px from padding alone — pull them to a true 44px
     touch target (Apple HIG / WCAG 2.5.5). Applies to both languages. */
  .form-field input, .form-field select, .form-submit { min-height:44px; }
  nav {
    top:10px; left:10px; right:10px; padding:0.9rem 1.1rem; border-radius:18px;
    backdrop-filter:blur(16px) saturate(170%) brightness(1.04);
    -webkit-backdrop-filter:blur(16px) saturate(170%) brightness(1.04);
  }
  .logo { font-size:0.7rem; letter-spacing:0.16rem; white-space:nowrap; }
  /* Tracking/padding tightened so longer labels fit the mobile nav without
     clipping — "PRENOTA ORA" (IT) needs ~102px where "BOOK NOW" (EN) needs 85. */
  .book-btn { padding:0.6rem 0.7rem; font-size:0.62rem; letter-spacing:0.05rem; white-space:nowrap; flex-shrink:0; }
  .nav-links { display:none; }
  .nav-burger { display:flex; }
  .nav-links--open {
    display:flex; flex-direction:column;
    position:fixed; top:78px; left:10px; right:10px;
    background:linear-gradient(180deg, rgba(245,241,235,0.98), rgba(245,241,235,0.94));
    backdrop-filter:blur(30px) saturate(190%);
    -webkit-backdrop-filter:blur(30px) saturate(190%);
    padding:1rem 1.2rem; gap:0;
    border:0.5px solid rgba(255,255,255,0.4);
    border-radius:20px;
    box-shadow:inset 0 1px 0 rgba(255,255,255,0.6), 0 16px 40px rgba(26,26,26,0.18);
    z-index:999;
  }
  .nav-links--open a { padding:0.9rem 0.6rem; border-bottom:0.5px solid rgba(74,74,74,0.08); border-radius:0; }
  .nav-links--open a:last-child { border-bottom:none; }
  .hero {
    grid-template-columns:1fr;
    height:auto;
    min-height:100dvh;
    padding:9rem 2rem 4rem;
    row-gap:2.5rem;
  }
  .hero h1 { font-size:2.6rem; }
  /* lighter + cheaper on mobile GPUs: less blur, no continuous background
     animation running underneath it (see .hero-bg/.hero::after below) */
  .hero-widget { align-items:flex-start; }
  .hero-widget-wrap {
    backdrop-filter:blur(18px) saturate(160%);
    -webkit-backdrop-filter:blur(18px) saturate(160%);
  }
  .hero-scroll { display:none; }
  /* Phones scroll past the hero in under a second and rarely benefit from a
     perpetual dolly-zoom + light sheen — cut both to save battery/GPU. */
  .hero-bg { animation:none; }
  .hero::after { animation:none; }
  .hero-bg::after {
    background:linear-gradient(to top, rgba(26,26,26,0.7) 0%, rgba(26,26,26,0.15) 55%);
  }
  #lodgify-search-bar { max-width:100%; }
  .property-card .btn-ghost-light { opacity:1; }
  .intro,.palazzo-feature { grid-template-columns:1fr; }
  .palazzo-img { order:1; }
  .palazzo-text { order:2; padding:4rem 2rem; }
  .intro-text { padding:4rem 2rem; }
  .features-strip { grid-template-columns:1fr 1fr; padding:3rem 2rem; }
  .properties-grid { grid-template-columns:1fr; }
  .properties { padding:5rem 2rem; }
  .amenities { padding:5rem 2rem; }
  .amenities-grid { grid-template-columns:1fr; }
  .portrait-interlude { grid-template-columns:1fr; }
  footer { padding:4rem 1.5rem 2.5rem; }
  .footer-top { grid-template-columns:1fr 1fr; gap:2.5rem; }
  .footer-brand { grid-column:1/-1; }
  .booking-strip { padding:3rem 2rem; }
  .content-section { padding:5rem 2rem; }
  .res-list { padding:5rem 2rem; }
  .process { padding:5rem 2rem; }
  .page-hero { padding:0 2rem 3rem; }
  .page-hero h1 { font-size:2.2rem; }
  .steps-row { grid-template-columns:1fr; }
  .nbhd-grid { grid-template-columns:1fr; }
  .landmarks-grid { grid-template-columns:1fr 1fr; }
  .form__row { grid-template-columns:1fr; }
  .book-form-panel,.book-panel-content { padding:4rem 2rem; }
}
@media(max-width:480px) {
  .footer-top { grid-template-columns:1fr; gap:2rem; }
  .landmarks-grid { grid-template-columns:1fr; }
}
/* gold eyebrows must survive contextual `.x p { color }` rules (0,1,1 ties, last wins) */
p.section-label { color:#B8973A; }
.palazzo-text p.section-label,
.contact-info-panel p.section-label,
.book-panel-content p.section-label { color:rgba(232,217,197,0.4); }

/* ── Class aliases — single-dash ↔ double-underscore ────────────
   HTML pages use .form-row, .form-field etc; aliases map them
   to the same declarations already defined above.
   ──────────────────────────────────────────────────────────────── */
.form-row  { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; margin-bottom:1.5rem; }
.form-field { display:flex; flex-direction:column; gap:0.6rem; margin-bottom:1.5rem; }
.form-field label { font-size:0.62rem; letter-spacing:0.25rem; text-transform:uppercase; color:var(--stone); }
.form-field input,
.form-field textarea,
.form-field select {
  background:transparent;
  border:none;
  border-bottom:0.5px solid rgba(74,74,74,0.2);
  padding:0.8rem 0;
  color:var(--slate);
  font-family:'Outfit',sans-serif;
  font-size:0.88rem;
  font-weight:300;
  letter-spacing:0.04rem;
  outline:none;
  width:100%;
  transition:border-color .4s;
  -webkit-appearance:none;
  border-radius:0;
}
.form-field input::placeholder,
.form-field textarea::placeholder { color:rgba(74,74,74,0.3); }
.form-field input:focus,
.form-field textarea:focus,
.form-field select:focus { border-bottom-color:var(--slate); }
.form-field select option { background:var(--void-light); }
.form-field textarea { resize:vertical; min-height:100px; }
.field-error { font-size:0.68rem; color:rgba(200,80,80,0.8); letter-spacing:0.06rem; min-height:1em; }
.form-check { display:flex; align-items:flex-start; gap:1rem; margin:1.8rem 0; cursor:pointer; }
.form-check input { width:14px; height:14px; flex-shrink:0; accent-color:var(--slate); margin-top:3px; }
.form-check span { font-size:0.78rem; color:var(--steel); letter-spacing:0.04rem; line-height:1.7; }
.form-submit {
  width:100%; padding:1.1rem 2rem;
  background:var(--slate); color:var(--onyx-glow);
  font-family:'Outfit',sans-serif;
  font-size:0.7rem; font-weight:400;
  letter-spacing:0.25rem; text-transform:uppercase;
  border:none; cursor:pointer;
  transition:background .6s var(--ease-premium);
  margin-top:1.5rem;
}
.form-submit:hover:not(:disabled) { background:var(--void-dark); }
.form-submit:disabled { opacity:0.5; cursor:not-allowed; }
.form__status--ok  { color:rgba(60,130,60,0.9); }
.form__status--err { color:rgba(180,80,80,0.9); }

/* Active nav link */
nav a.nav--active { opacity:1; }

/* Book button active state (on book.html) */
.book-btn--active {
  background:var(--slate);
  color:var(--onyx-glow);
  border-color:var(--slate);
}

/* Book panel — BEM __modifier aliases */
.book-panel__bg { position:absolute; inset:0; }
.book-panel__bg img { width:100%; height:100%; object-fit:cover; display:block; }
.book-panel__bg::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(20,18,16,0.92) 0%, rgba(20,18,16,0.55) 100%);
}
.book-panel__content {
  position:relative; z-index:10;
  padding:6rem 4rem;
  display:flex; flex-direction:column; justify-content:flex-end;
  height:100%;
}
.book-panel__content h1 {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:2.4rem; font-weight:300;
  color:var(--onyx-glow); letter-spacing:0.05rem; line-height:1.25;
  margin-bottom:1.2rem;
}
.book-panel__content p { font-size:0.85rem; color:rgba(232,217,197,0.72); letter-spacing:0.06rem; line-height:1.9; max-width:380px; margin-bottom:2.5rem; }
.book-panel__contact {
  margin-top:2.5rem;
  padding-top:2rem;
  border-top:0.5px solid rgba(232,217,197,0.1);
  display:flex; flex-direction:column; gap:0.8rem;
}
.book-panel__contact p { font-size:0.6rem; letter-spacing:0.28rem; text-transform:uppercase; color:rgba(232,217,197,0.35); margin-bottom:0; }
.book-panel__contact a { font-size:0.82rem; color:rgba(232,217,197,0.65); letter-spacing:0.06rem; transition:color .4s; }
.book-panel__contact a:hover { color:var(--onyx-glow); }

/* Book form panel / Lodgify strip */
.book-form-panel { background:var(--void-light); padding:6rem 4rem; display:flex; flex-direction:column; justify-content:flex-start; overflow-y:auto; gap:3rem; }
.book-form-panel h2 { font-family:'Helvetica Neue',Helvetica,Arial,sans-serif; font-size:1.6rem; font-weight:300; color:var(--slate); letter-spacing:0.05rem; }
.book-form-panel>div>p { font-size:0.82rem; color:var(--stone); letter-spacing:0.06rem; line-height:1.8; margin-top:0.5rem; }
.book-lodgify { padding-bottom:1.5rem; border-bottom:0.5px solid rgba(189,181,167,0.35); }
.book-lodgify .section-label { margin-bottom:1.5rem; }

/* Residence list — hud inline stats */
.res-item__hud {
  display:flex; flex-wrap:wrap; gap:2.5rem;
  padding:1.8rem 0; margin-bottom:0.5rem;
  border-top:0.5px solid rgba(74,74,74,0.1);
  border-bottom:0.5px solid rgba(74,74,74,0.1);
  margin-top:1.5rem;
}
.res-item__hud div { display:flex; flex-direction:column; gap:0.25rem; }
.res-item__hud span { font-size:0.58rem; letter-spacing:0.22rem; text-transform:uppercase; color:var(--stone); }
.res-item__hud strong { font-family:'Helvetica Neue',Helvetica,Arial,sans-serif; font-size:0.88rem; font-weight:300; color:var(--slate); letter-spacing:0.06rem; }
/* secondary row under the booking CTA: listing link + CIN (Italian STR registration) */
.res-item__aux {
  display:flex; flex-wrap:wrap; align-items:baseline; gap:0.4rem 1.6rem;
  margin-top:1.1rem;
  font-size:0.74rem; letter-spacing:0.06rem;
}
.res-item__aux a {
  color:#9C7E2F;
  border-bottom:0.5px solid rgba(156,126,47,0.4);
  padding-bottom:1px;
  transition:opacity .4s var(--ease-premium);
}
.res-item__aux a:hover { opacity:0.65; }
.res-cin {
  font-size:0.62rem; letter-spacing:0.14rem;
  color:rgba(74,74,74,0.55);
}

/* Services page wrapper */
.svc-section { padding:6rem 4rem; background:var(--void-light); }

/* svc-card inner layout (used on services.html) */
.svc-card__img { position:relative; overflow:hidden; border-radius:18px 18px 0 0; }
.svc-card__img img {
  width:100%; height:320px; object-fit:cover; display:block;
  transition:transform 1.4s var(--ease-premium);
  filter:none;
}
.svc-card:hover .svc-card__img img { transform:scale(1.06); filter:grayscale(0%); }
.svc-card__body { padding:2.5rem 2rem; background:var(--void-light); border-radius:0 0 18px 18px; }
.svc-card__body h2,
.svc-card__body h3 {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:1rem; font-weight:400;
  letter-spacing:0.12rem; text-transform:uppercase;
  color:var(--slate); margin-bottom:1rem; line-height:1.4;
}
.svc-card__body>p { font-size:0.82rem; color:var(--steel); line-height:1.9; letter-spacing:0.04rem; margin-bottom:1.5rem; }
.svc-meta { list-style:none; display:flex; flex-direction:column; gap:0.5rem; }
.svc-meta li { display:flex; gap:1rem; align-items:baseline; font-size:0.78rem; }
.svc-meta li span { font-size:0.58rem; letter-spacing:0.22rem; text-transform:uppercase; color:var(--stone); min-width:68px; flex-shrink:0; }
.svc-meta li strong { color:var(--slate); font-weight:400; letter-spacing:0.04rem; }
.svc-perk { margin-top:1rem; padding-top:1rem; border-top:1px solid rgba(184,151,58,0.25); font-size:0.75rem; letter-spacing:0.03rem; }
.svc-perk a { color:var(--stone); text-decoration:none; transition:color 0.2s ease; }
.svc-perk a:hover, .svc-perk a:focus-visible { color:var(--gold); }
.svc-perk strong { color:var(--gold); letter-spacing:0.08rem; }

/* Services process (uses .step / .step__n selectors) */
.step { text-align:center; padding:0 2rem; }
.step__n {
  width:28px; height:28px;
  border:0.5px solid rgba(189,181,167,0.6);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  margin:0 auto 2rem;
  font-size:0.6rem; letter-spacing:0.15rem;
  color:var(--stone); background:var(--void-light);
  position:relative; z-index:1;
}
.step h4 {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:0.75rem; font-weight:500;
  letter-spacing:0.18rem; text-transform:uppercase;
  color:var(--slate); margin-bottom:1rem;
}
.step p { font-size:0.8rem; color:var(--steel); letter-spacing:0.04rem; line-height:1.8; }
.process { padding:8rem 4rem; background:var(--stone); }
.process__hdr { text-align:center; margin-bottom:5rem; }
.process__hdr h2 {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  font-size:2rem; font-weight:300; letter-spacing:0.05rem; color:var(--slate);
  margin-top:0.8rem; line-height:1.25;
}

/* Location page aliases */
.loc-address { list-style:none; margin-top:2.5rem; display:flex; flex-direction:column; }
.loc-address li {
  display:flex; gap:1.5rem;
  font-size:0.82rem; color:var(--steel); letter-spacing:0.04rem;
  padding:1rem 0; border-bottom:0.5px solid rgba(74,74,74,0.1);
}
.loc-address li:last-child { border-bottom:none; }
.loc-address li strong { color:var(--stone); font-weight:400; font-size:0.62rem; letter-spacing:0.2rem; text-transform:uppercase; min-width:80px; flex-shrink:0; margin-top:2px; }
.loc-address li a { color:var(--slate); transition:color .4s; }
.loc-address li a:hover { color:var(--stone); }
.loc-map-placeholder { text-align:center; position:relative; z-index:1; }
.loc-map-placeholder svg { color:var(--stone); margin:0 auto 1rem; opacity:0.6; }
.loc-map-placeholder p { font-size:0.68rem; letter-spacing:0.25rem; text-transform:uppercase; color:var(--stone); line-height:1.9; }

/* Neighbourhood cards dark variant */
.nbhd-card--dark { background:transparent; border-top:0.5px solid rgba(232,217,197,0.1); }
.nbhd-card--dark h4 { color:var(--onyx-glow); }
.nbhd-card--dark p { color:rgba(232,217,197,0.68); }

/* Responsive additions for aliases */
@media(max-width:768px) {
  .form-row  { grid-template-columns:1fr; }
  .svc-section { padding:5rem 2rem; }
  .book-panel__content { padding:4rem 2rem; }
  .book-form-panel { padding:4rem 2rem; }
  .process { padding:5rem 2rem; }
}

/* ── Form validation error state — authoritative (last, wins cascade) ──
   The base inputs set border-bottom via shorthand; the error color must
   override it in every state (incl. :focus), so we anchor it here. ───── */
.form-field--error input,  .form-field--error textarea,  .form-field--error select,
.form__field--error input, .form__field--error textarea, .form__field--error select,
.form-field--error input:focus,  .form-field--error textarea:focus,  .form-field--error select:focus,
.form__field--error input:focus, .form__field--error textarea:focus, .form__field--error select:focus {
  border-bottom-color: rgba(200,80,80,0.9) !important;
}

/* ── FAQ (book page) — visible Q&A for humans + AI answer engines ─────── */
.faq { background:var(--void-light); padding:6rem 4rem; }
.faq-inner { max-width:820px; margin:0 auto; }
.faq .section-label { color:var(--gold); }
.faq h2 { font-family:'Helvetica Neue',Helvetica,Arial,sans-serif; font-weight:300;
  font-size:clamp(1.6rem,4vw,2.3rem); color:var(--slate); margin:.4rem 0 2.4rem; letter-spacing:-.01em; }
.faq-list { display:flex; flex-direction:column; }
.faq details { border-top:1px solid rgba(47,53,59,0.14); }
.faq details:last-child { border-bottom:1px solid rgba(47,53,59,0.14); }
.faq summary {
  list-style:none; cursor:pointer; padding:1.35rem 2.5rem 1.35rem 0; position:relative;
  font-size:1.02rem; color:var(--slate); font-weight:500; letter-spacing:.005em;
  transition:color .4s var(--ease-premium);
}
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after {
  content:''; position:absolute; right:.4rem; top:50%; width:11px; height:11px;
  border-right:1.5px solid var(--gold); border-bottom:1.5px solid var(--gold);
  transform:translateY(-70%) rotate(45deg); transition:transform .35s var(--ease-premium);
}
.faq details[open] summary::after { transform:translateY(-30%) rotate(-135deg); }
.faq summary:hover { color:var(--void-dark); }
.faq details p {
  margin:0; padding:0 2.5rem 1.5rem 0; color:var(--steel);
  font-size:.96rem; line-height:1.8; max-width:64ch;
}
.faq summary:focus-visible { outline:2px solid var(--gold); outline-offset:3px; border-radius:3px; }
@media(max-width:768px){ .faq { padding:4rem 1.5rem; } }

/* ── Contact lede + instant-booking note (final pass) ─────────── */
.contact-lede { font-size:0.88rem; color:rgba(232,217,197,0.75); line-height:1.9; letter-spacing:0.02rem; max-width:44ch; margin-bottom:1.2rem; }
.contact-lede a { text-decoration:underline; text-underline-offset:3px; text-decoration-color:rgba(184,151,58,0.5); }
.book-instant-note { font-size:0.82rem; color:var(--steel); line-height:1.7; margin:-0.6rem 0 1rem; }

/* ═══════════════════════════════════════════════════════════════
   FINAL PASS — Wow layer (motion & micro-interactions)
   Append-only. All effects transform/opacity/clip based and gated
   by the global prefers-reduced-motion kill-switch at the top.
   ═══════════════════════════════════════════════════════════════ */

/* Smooth anchor scrolling, offset for the floating nav */
html { scroll-behavior:smooth; scroll-padding-top:110px; }
/* Guard: a pre-existing ~20px grid bleed (intro/palazzo image columns) made
   scrollWidth exceed the viewport; clip (not hidden) preserves sticky/reveal. */
html, body { overflow-x:clip; }

/* C1 · Editorial clip-reveal layered onto the existing 3D image rise */
[data-reveal-img] { clip-path:inset(6% 3% 6% 3% round 18px); }
[data-reveal-img].revealed {
  clip-path:inset(0 0 0 0 round 18px);
  transition:opacity 1.15s var(--ease-premium),
             transform 1.15s var(--ease-premium),
             clip-path 1.25s var(--ease-premium);
}

/* C2 · CTA sheen-sweep — a single gold light pass on hover */
.book-btn, .form-submit, .btn-ghost-light, .btn-outline-dark {
  position:relative; overflow:hidden;
}
.book-btn::after, .form-submit::after,
.btn-ghost-light::after, .btn-outline-dark::after {
  content:''; position:absolute; top:0; bottom:0; left:-80%; width:60%;
  background:linear-gradient(105deg, transparent 0%,
             rgba(232,217,197,0.28) 45%, rgba(184,151,58,0.20) 55%, transparent 100%);
  transform:skewX(-18deg);
  transition:left .8s var(--ease-premium);
  pointer-events:none;
}
.book-btn:hover::after, .form-submit:hover::after,
.btn-ghost-light:hover::after, .btn-outline-dark:hover::after { left:120%; }

/* C2 · Nav links — gold underline that grows from the left */
.nav-links a { position:relative; }
.nav-links a::after {
  content:''; position:absolute; left:1.1rem; right:1.1rem; bottom:0.35rem;
  height:1px; background:var(--gold);
  transform:scaleX(0); transform-origin:left;
  transition:transform .45s var(--ease-premium);
}
.nav-links a:hover::after { transform:scaleX(1); }
.nav-links a.nav--active::after { transform:scaleX(1); opacity:.55; }

/* C2 · Residence & service cards — heading nudge + gold arrow on hover */
.res-item__body h2, .svc-card__body h2 {
  transition:transform .6s var(--ease-premium);
}
.res-item:hover .res-item__body h2,
.svc-card:hover .svc-card__body h2 { transform:translateX(4px); }

/* C2 · Form focus — gold accent on active field */
#contact-form input:focus, #contact-form select:focus, #contact-form textarea:focus {
  border-color:var(--gold) !important;
  outline:none;
  box-shadow:0 1px 0 0 var(--gold);
  transition:border-color .3s var(--ease-premium), box-shadow .3s var(--ease-premium);
}

/* C3 · FAQ — answer eases in when opened */
.faq details[open] p {
  animation:faqOpen .5s var(--ease-premium) both;
}
@keyframes faqOpen {
  from { opacity:0; transform:translateY(-6px); }
  to   { opacity:1; transform:none; }
}

/* C1 · Count-up targets get tabular numerals so digits don't jitter */
.res-item__hud strong { font-variant-numeric:tabular-nums; }

/* Parallax media: JS sets --plx; transform stays compositor-only.
   .cta-banner img excluded — its hover zoom owns transform (one writer per property). */
.lifestyle-block img, .page-hero-bg img {
  transform:translateY(var(--plx, 0px)) scale(1.1); /* scale = headroom so the shift never exposes edges */
  will-change:transform;
}
@media(max-width:768px){
  .lifestyle-block img, .cta-banner img, .page-hero-bg img { transform:none; will-change:auto; }
}
