/* ==========================================================================
   VILLA 2030 — design system condiviso
   Villa in vendita, Via G. Borghese 6, Bologna
   ========================================================================== */

:root{
  --bg:            #0f0e0c;
  --bg-1:          #15130f;
  --bg-2:          #1b1810;
  --bg-3:          #221e14;
  --gold:          #c9a877;
  --gold-light:    #e8cd9a;
  --gold-dim:      #8a7148;
  --text:          #f4efe4;
  --text-muted:    #a79d8a;
  --text-faint:    #726a5c;
  --border:        rgba(201,168,119,.16);
  --border-strong: rgba(201,168,119,.32);
  --glass:         rgba(34,30,20,.55);
  --glass-light:   rgba(244,239,228,.06);
  --shadow:        0 20px 60px rgba(0,0,0,.45);
  --radius:        18px;
  --radius-sm:     10px;

  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body:    'DM Sans', system-ui, -apple-system, sans-serif;

  --ease:       cubic-bezier(.22,.61,.36,1);
  --ease-out:   cubic-bezier(.16,1,.3,1);
  --dur:        .7s;

  --nav-h: 84px;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body.villa-2030{
  margin:0;
  background:var(--bg) !important; /* blinda contro CSS per-pagina residuo di Elementor (vedi functions.php) */
  color:var(--text);
  font-family:var(--font-body);
  font-weight:400;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
.villa-2030 img{ max-width:100%; display:block; }
.villa-2030 a{ color:inherit; text-decoration:none; }
.villa-2030 h1,.villa-2030 h2,.villa-2030 h3,.villa-2030 h4{
  font-family:var(--font-display);
  font-weight:500;
  line-height:1.12;
  margin:0 0 .5em;
  color:var(--text);
}
.villa-2030 p{ margin:0 0 1.1em; color:var(--text-muted); }
.villa-2030 .eyebrow{
  display:inline-flex; align-items:center; gap:.6em;
  font-family:var(--font-body); text-transform:uppercase;
  letter-spacing:.28em; font-size:.72rem; color:var(--gold);
  margin-bottom:1.1em;
}
.villa-2030 .eyebrow::before{ content:''; width:28px; height:1px; background:var(--gold); }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .villa-2030 *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}

/* ---------- layout ---------- */
.v-wrap{ max-width:1240px; margin:0 auto; padding:0 clamp(1.25rem,4vw,3rem); }
.v-section{ position:relative; padding:clamp(4rem,9vw,8rem) 0; }
.v-grid{ display:grid; gap:clamp(1.5rem,3vw,3rem); }
.v-grid-2{ grid-template-columns:1fr; }
.v-grid-3{ grid-template-columns:1fr; }
.v-grid-4{ grid-template-columns:repeat(2,1fr); }
@media(min-width:760px){
  .v-grid-2{ grid-template-columns:1fr 1fr; }
  .v-grid-3{ grid-template-columns:repeat(3,1fr); }
  .v-grid-4{ grid-template-columns:repeat(4,1fr); }
}

/* ---------- reveal on scroll ---------- */
.v-reveal{ opacity:0; transform:translateY(34px); transition:opacity 1s var(--ease-out), transform 1s var(--ease-out); }
.v-reveal.is-in{ opacity:1; transform:none; }
.v-reveal-stagger > *{ opacity:0; transform:translateY(28px); transition:opacity .8s var(--ease-out), transform .8s var(--ease-out); }
.v-reveal-stagger.is-in > *{ opacity:1; transform:none; }
.v-reveal-stagger.is-in > *:nth-child(1){ transition-delay:.05s; }
.v-reveal-stagger.is-in > *:nth-child(2){ transition-delay:.14s; }
.v-reveal-stagger.is-in > *:nth-child(3){ transition-delay:.23s; }
.v-reveal-stagger.is-in > *:nth-child(4){ transition-delay:.32s; }
.v-reveal-stagger.is-in > *:nth-child(5){ transition-delay:.41s; }
.v-reveal-stagger.is-in > *:nth-child(6){ transition-delay:.5s; }

/* ---------- buttons ---------- */
.v-btn{
  --btn-bg: var(--gold);
  display:inline-flex; align-items:center; justify-content:center; gap:.6em;
  padding:1em 2.1em; border-radius:100px; font-family:var(--font-body);
  font-size:.92rem; font-weight:600; letter-spacing:.02em; cursor:pointer;
  border:1px solid transparent; background:var(--btn-bg); color:#1a1712;
  transition:transform .45s var(--ease), box-shadow .45s var(--ease), background .3s;
  position:relative; overflow:hidden; isolation:isolate;
}
.v-btn::after{
  content:''; position:absolute; inset:0; z-index:-1;
  background:var(--gold-light); transform:translateX(-101%);
  transition:transform .5s var(--ease);
}
.v-btn:hover::after{ transform:translateX(0); }
.v-btn:hover{ box-shadow:0 12px 34px rgba(201,168,119,.35); transform:translateY(-2px); }
.v-btn.ghost{ background:transparent; color:var(--text); border-color:var(--border-strong); }
.v-btn.ghost::after{ background:var(--glass-light); }
.v-btn.ghost:hover{ box-shadow:none; border-color:var(--gold); }
.v-btn svg{ width:1.1em; height:1.1em; }

/* ---------- nav ---------- */
.v-nav{
  position:fixed; top:0; left:0; right:0; z-index:200;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 clamp(1.25rem,4vw,3rem); height:var(--nav-h);
  background:transparent; border-bottom:1px solid transparent;
  transition:background .5s var(--ease), border-color .5s var(--ease), height .4s var(--ease), backdrop-filter .5s;
}
.v-nav.is-scrolled{
  background:rgba(15,14,12,.72); backdrop-filter:blur(16px) saturate(140%);
  -webkit-backdrop-filter:blur(16px) saturate(140%);
  border-bottom-color:var(--border); height:68px;
}
.v-nav__brand{ display:flex; align-items:center; gap:.7em; font-family:var(--font-display); font-size:1.3rem; color:var(--text); letter-spacing:.02em; }
.v-nav__brand strong{ color:var(--gold); font-weight:600; }
.v-nav__links{ display:none; align-items:center; gap:2.4rem; }
.v-nav__links a{
  font-size:.86rem; text-transform:uppercase; letter-spacing:.14em; color:var(--text-muted);
  position:relative; padding:.4em 0; transition:color .3s;
}
.v-nav__links a::after{ content:''; position:absolute; left:0; right:100%; bottom:0; height:1px; background:var(--gold); transition:right .4s var(--ease); }
.v-nav__links a:hover, .v-nav__links a.is-active{ color:var(--text); }
.v-nav__links a:hover::after, .v-nav__links a.is-active::after{ right:0; }
@media(min-width:960px){ .v-nav__links{ display:flex; } }
.v-nav__cta{ display:flex; align-items:center; gap:1rem; }
.v-nav__phone{ display:none; font-size:.86rem; color:var(--text-muted); letter-spacing:.02em; }
@media(min-width:640px){ .v-nav__phone{ display:inline-flex; align-items:center; gap:.5em; } }
.v-nav__toggle{
  display:flex; align-items:center; justify-content:center;
  width:44px; height:44px; border-radius:50%; border:1px solid var(--border-strong);
  background:transparent; color:var(--text); cursor:pointer;
}
@media(min-width:960px){ .v-nav__toggle{ display:none; } }

.v-mobile-menu{
  position:fixed; inset:0; z-index:199; background:rgba(15,14,12,.98);
  backdrop-filter:blur(20px); display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:2rem; opacity:0; pointer-events:none; transition:opacity .45s var(--ease);
}
.v-mobile-menu.is-open{ opacity:1; pointer-events:auto; }
.v-mobile-menu a{ font-family:var(--font-display); font-size:2rem; color:var(--text); }
.v-mobile-menu a:hover{ color:var(--gold); }

/* ---------- hero ---------- */
.v-hero{
  position:relative; min-height:100svh; display:flex; align-items:flex-end;
  overflow:hidden; background:var(--bg);
}
.v-hero__media{ position:absolute; inset:0; z-index:0; }
.v-hero__media img{ width:100%; height:100%; object-fit:cover; transform:scale(1.08); animation:v-hero-zoom 16s var(--ease-out) forwards; }
@keyframes v-hero-zoom{ from{ transform:scale(1.14); } to{ transform:scale(1.0); } }

/* variante mappa: iframe Google Maps come sfondo, puramente decorativo (niente scroll/zoom intrappolati) */
.v-inline-map{ position:relative; background:var(--bg-2); }
.v-inline-map iframe{
  position:absolute; inset:0; width:100%; height:100%; border:0;
  filter:brightness(.82) contrast(1.05) saturate(1.1);
}
.v-hero__scrim{
  position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(180deg, rgba(15,14,12,.55) 0%, rgba(15,14,12,.25) 32%, rgba(15,14,12,.55) 68%, var(--bg) 100%),
    linear-gradient(90deg, rgba(15,14,12,.55) 0%, transparent 45%);
}
.v-hero__mesh{
  position:absolute; inset:-20%; z-index:1; opacity:.5; mix-blend-mode:screen; pointer-events:none;
  background:
    radial-gradient(38% 30% at 18% 22%, rgba(201,168,119,.28), transparent 70%),
    radial-gradient(30% 26% at 82% 70%, rgba(201,168,119,.16), transparent 70%);
  animation:v-mesh-drift 22s ease-in-out infinite alternate;
}
@keyframes v-mesh-drift{ from{ transform:translate3d(-2%,-1%,0) scale(1); } to{ transform:translate3d(2%,2%,0) scale(1.06); } }
.v-hero__content{ position:relative; z-index:2; width:100%; padding:calc(var(--nav-h) + 2rem) clamp(1.25rem,4vw,3rem) clamp(3rem,7vw,5.5rem); }
.v-hero__kicker{ display:flex; align-items:center; gap:.8em; color:var(--gold-light); letter-spacing:.3em; text-transform:uppercase; font-size:.76rem; margin-bottom:1.4rem; }
.v-hero__kicker .dot{ width:6px; height:6px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 4px rgba(201,168,119,.18); }
.v-hero h1{ font-size:clamp(2.6rem,7vw,5.4rem); max-width:16ch; color:var(--text); }
.v-hero h1 .word{ display:inline-block; overflow:hidden; }
.v-hero h1 .word span{ display:inline-block; transform:translateY(110%); animation:v-word-up .9s var(--ease-out) forwards; }
@keyframes v-word-up{ to{ transform:translateY(0); } }
.v-hero__lead{ max-width:46ch; font-size:1.08rem; color:var(--text-muted); margin-top:1.2rem; }
.v-hero__actions{ display:flex; flex-wrap:wrap; gap:1rem; margin-top:2.2rem; }
.v-hero__scroll{
  position:absolute; right:clamp(1.25rem,4vw,3rem); bottom:2rem; z-index:2;
  display:none; flex-direction:column; align-items:center; gap:.6rem; color:var(--text-faint); font-size:.72rem; letter-spacing:.2em; text-transform:uppercase;
}
@media(min-width:760px){ .v-hero__scroll{ display:flex; } }
.v-hero__scroll .line{ width:1px; height:46px; background:linear-gradient(var(--gold), transparent); animation:v-scroll-line 2s ease-in-out infinite; }
@keyframes v-scroll-line{ 0%,100%{ opacity:.3; } 50%{ opacity:1; } }

/* ---------- stat strip ---------- */
.v-stats{ display:grid; grid-template-columns:repeat(2,1fr); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
@media(min-width:760px){ .v-stats{ grid-template-columns:repeat(4,1fr); } }
.v-stat{ padding:2.4rem 1.5rem; text-align:center; border-right:1px solid var(--border); }
.v-stat:nth-child(2n){ border-right:none; }
@media(min-width:760px){ .v-stat:nth-child(2n){ border-right:1px solid var(--border); } .v-stat:last-child{ border-right:none; } }
.v-stat__num{ font-family:var(--font-display); font-size:clamp(2.2rem,4vw,3.2rem); color:var(--gold-light); display:flex; justify-content:center; align-items:baseline; gap:.15em; }
.v-stat__label{ font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:var(--text-faint); margin-top:.4rem; }

/* ---------- cards ---------- */
.v-card{
  position:relative; background:var(--bg-1); border:1px solid var(--border); border-radius:var(--radius);
  padding:2.2rem; transition:transform .5s var(--ease), border-color .4s, box-shadow .5s;
  transform-style:preserve-3d; will-change:transform;
}
.v-card:hover{ border-color:var(--border-strong); box-shadow:var(--shadow); }
.v-card__icon{ width:46px; height:46px; border-radius:12px; display:flex; align-items:center; justify-content:center; background:rgba(201,168,119,.1); color:var(--gold); margin-bottom:1.4rem; }
.v-card__icon svg{ width:22px; height:22px; }
.v-card h3{ font-size:1.35rem; }
.v-card p{ font-size:.94rem; margin-bottom:0; }

.v-photo-card{ position:relative; border-radius:var(--radius); overflow:hidden; aspect-ratio:4/5; background:var(--bg-1); cursor:pointer; }
.v-photo-card img{ width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease-out); }
.v-photo-card:hover img{ transform:scale(1.08); }
.v-photo-card__overlay{ position:absolute; inset:0; background:linear-gradient(0deg, rgba(15,14,12,.82) 0%, transparent 45%); display:flex; align-items:flex-end; padding:1.3rem; opacity:0; transition:opacity .4s; }
.v-photo-card:hover .v-photo-card__overlay{ opacity:1; }
.v-photo-card__overlay span{ font-family:var(--font-display); font-size:1.15rem; color:var(--text); }

/* ---------- room split section ---------- */
.v-room{ display:grid; gap:2.5rem; align-items:center; padding:clamp(3rem,7vw,5.5rem) 0; border-top:1px solid var(--border); }
@media(min-width:900px){ .v-room{ grid-template-columns:1fr 1fr; gap:4rem; } .v-room.is-rev .v-room__media{ order:2; } }
.v-room__media{ position:relative; border-radius:var(--radius); overflow:hidden; aspect-ratio:6/5; }
.v-room__media img{ width:100%; height:100%; object-fit:cover; }
.v-room__num{ font-family:var(--font-display); font-size:.95rem; color:var(--gold); letter-spacing:.1em; }
.v-room__specs{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.4rem; }
.v-room__specs span{ font-size:.78rem; letter-spacing:.06em; color:var(--text-muted); border:1px solid var(--border); padding:.5em 1em; border-radius:100px; }

/* ---------- room tabs (piano pages) ---------- */
.v-tabs{ display:flex; flex-wrap:wrap; gap:.7rem; margin-bottom:2.6rem; }
.v-tab{
  padding:.75em 1.5em; border-radius:100px; border:1px solid var(--border); background:transparent;
  color:var(--text-muted); font-family:var(--font-body); font-size:.86rem; letter-spacing:.03em; cursor:pointer;
  transition:all .35s var(--ease);
}
.v-tab.is-active, .v-tab:hover{ color:#1a1712; background:var(--gold); border-color:var(--gold); }
.v-tabpanel{ display:none; }
.v-tabpanel.is-active{ display:block; animation:v-fade-in .6s var(--ease-out); }
@keyframes v-fade-in{ from{ opacity:0; transform:translateY(14px); } to{ opacity:1; transform:none; } }

/* ---------- gallery / lightbox ---------- */
.v-gallery{ display:grid; grid-template-columns:repeat(2,1fr); gap:.9rem; }
@media(min-width:640px){ .v-gallery{ grid-template-columns:repeat(3,1fr); } }
.v-gallery figure{ position:relative; margin:0; border-radius:var(--radius-sm); overflow:hidden; aspect-ratio:4/3; cursor:zoom-in; }
.v-gallery figure img{ width:100%; height:100%; object-fit:cover; transition:transform .7s var(--ease-out), filter .5s; }
.v-gallery figure:hover img{ transform:scale(1.06); }
.v-gallery figure::after{ content:'+'; position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:1.6rem; color:var(--text); background:rgba(15,14,12,0); opacity:0; transition:all .35s; }
.v-gallery figure:hover::after{ opacity:1; background:rgba(15,14,12,.35); }

.v-lightbox{ position:fixed; inset:0; z-index:400; background:rgba(9,8,6,.96); display:none; align-items:center; justify-content:center; padding:4vw; }
.v-lightbox.is-open{ display:flex; animation:v-fade-in .35s var(--ease-out); }
.v-lightbox img{ max-width:100%; max-height:88vh; border-radius:8px; box-shadow:0 30px 90px rgba(0,0,0,.6); }
.v-lightbox__close, .v-lightbox__prev, .v-lightbox__next{
  position:absolute; background:rgba(244,239,228,.08); border:1px solid var(--border-strong); color:var(--text);
  width:48px; height:48px; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer;
  transition:background .3s;
}
.v-lightbox__close:hover, .v-lightbox__prev:hover, .v-lightbox__next:hover{ background:rgba(201,168,119,.25); }
.v-lightbox__close{ top:1.5rem; right:1.5rem; }
.v-lightbox__prev{ left:1.5rem; top:50%; transform:translateY(-50%); }
.v-lightbox__next{ right:1.5rem; top:50%; transform:translateY(-50%); }

/* ---------- CTA band ---------- */
.v-cta-band{
  position:relative; border-radius:24px; overflow:hidden; padding:clamp(3rem,7vw,5rem);
  background:var(--bg-2); border:1px solid var(--border); text-align:center;
}
.v-cta-band::before{
  content:''; position:absolute; inset:0;
  background:radial-gradient(60% 80% at 50% 0%, rgba(201,168,119,.16), transparent 70%);
}
.v-cta-band > *{ position:relative; }
.v-cta-band h2{ font-size:clamp(2rem,4vw,2.8rem); max-width:20ch; margin-inline:auto; }
.v-cta-band .v-btn{ margin-top:1.8rem; }

/* ---------- footer ---------- */
.v-footer{ background:var(--bg-1); border-top:1px solid var(--border); padding:4rem 0 2rem; }
.v-footer__top{ display:grid; gap:2.5rem; grid-template-columns:1fr; margin-bottom:3rem; }
@media(min-width:760px){ .v-footer__top{ grid-template-columns:1.3fr 1fr 1fr; } }
.v-footer__brand{ font-family:var(--font-display); font-size:1.5rem; }
.v-footer h4{ font-size:.8rem; text-transform:uppercase; letter-spacing:.16em; color:var(--gold); margin-bottom:1.1rem; }
.v-footer ul{ list-style:none; margin:0; padding:0; display:grid; gap:.7rem; }
.v-footer a{ color:var(--text-muted); font-size:.92rem; transition:color .3s; }
.v-footer a:hover{ color:var(--gold-light); }
.v-footer__bottom{ display:flex; flex-wrap:wrap; gap:1rem; justify-content:space-between; border-top:1px solid var(--border); padding-top:1.6rem; font-size:.8rem; color:var(--text-faint); }

/* ---------- sticky mobile CTA ---------- */
.v-sticky-cta{
  position:fixed; left:0; right:0; bottom:0; z-index:150; display:flex; gap:.6rem;
  padding:.7rem clamp(1rem,4vw,1.5rem); background:rgba(15,14,12,.9); backdrop-filter:blur(14px);
  border-top:1px solid var(--border);
  transform:translateY(0); transition:transform .4s var(--ease);
}
@media(min-width:960px){ .v-sticky-cta{ display:none; } }
.v-sticky-cta .v-btn{ flex:1; padding:.9em 1em; font-size:.84rem; }

/* ---------- section frames ---------- */
.v-divider{ height:1px; background:linear-gradient(90deg, transparent, var(--border-strong), transparent); }
.v-section-head{ max-width:56ch; margin-bottom:clamp(2.4rem,5vw,3.6rem); }
.v-section-head.is-center{ margin-inline:auto; text-align:center; }
.v-section-head h2{ font-size:clamp(2rem,4.4vw,3rem); }

/* ---------- generic entry content (index.php fallback) ---------- */
.v-entry-content p{ margin-bottom:1.3em; }
.v-entry-content a{ color:var(--gold); text-decoration:underline; text-underline-offset:.2em; }
.v-entry-content img{ border-radius:var(--radius-sm); }
.v-entry-content ul, .v-entry-content ol{ padding-left:1.3em; margin-bottom:1.3em; }
.v-entry-content h2, .v-entry-content h3{ margin-top:1.4em; }

/* ---------- utility ---------- */
.v-muted{ color:var(--text-muted); }
.v-gold{ color:var(--gold); }
.v-mt-0{ margin-top:0; }