/* ═══════════════════════════════════════════════════════════════
   BEB Case — template-homepage.css
   CSS specifico della Homepage (caricato solo su questo template)
═══════════════════════════════════════════════════════════════ */

/* ── HERO ─────────────────────────────────────────────────────── */
.hero {
  position:relative;
  min-height:100vh;
  display:flex; flex-direction:column;
  overflow:hidden;
  padding-top:calc(var(--H) + 110px);
}
.hero-bg {
  position:absolute; top:0; left:0; right:0; bottom:0;
  background-size:cover;
  background-position:center 40%;
  filter:brightness(.25) saturate(.7);
}
.hero-inner {
  position:relative; z-index:2;
  padding:3rem 5vw 2rem;
  flex:1;
  display:flex; flex-direction:column; justify-content:center;
}
.hero-eyebrow {
  font-size:.68rem; font-weight:600; letter-spacing:.22em; text-transform:uppercase;
  color:rgba(255,255,255,.5); margin-bottom:1.8rem; display:block;
}
.hero h1 {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(2.8rem,5vw,5rem);
  font-weight:300; line-height:1.08; color:var(--w);
  margin-bottom:1.5rem;
}
.hero h1 strong { font-weight:700; display:block; }
.hero-lead {
  font-size:.96rem; font-weight:300; line-height:1.9;
  color:rgba(255,255,255,.55); max-width:560px; margin-bottom:2.5rem;
}
.hero-ctas { display:flex; gap:1rem; flex-wrap:wrap; }

/* Casa decorativa hero */
.hero-house-deco {
  position:absolute; bottom:-4%; right:2%; z-index:1;
  width:clamp(320px,42vw,560px); opacity:.13; pointer-events:none;
}
.hero-house-deco svg { width:100%; height:auto; display:block; }
.hero-house-deco path { fill:#F7AE4E; }

/* Strip KPI */
.hero-strip {
  position:relative; z-index:2;
  background:rgba(35,31,32,.85);
  border-top:2px solid var(--y);
  display:grid; grid-template-columns:repeat(4,1fr);
  padding:0 5vw;
  backdrop-filter:blur(8px);
}
.strip-num {
  padding:1.8rem 0;
  border-right:1px solid rgba(247,174,78,.12);
  padding-right:3vw; padding-left:1vw;
}
.strip-num:last-child { border-right:none; }
.strip-val {
  font-family:'Cormorant Garamond',serif;
  font-size:2.4rem; font-weight:700; color:var(--y); line-height:1;
  display:block;
}
.strip-label {
  font-size:.62rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:rgba(255,255,255,.38); margin-top:.3rem; display:block;
}

/* ── CHI SIAMO ───────────────────────────────────────────────── */
.chi-siamo {
  display:grid; grid-template-columns:1fr 1fr;
  background:var(--w);
}
.chi-copy {
  padding:8rem 5vw;
  display:flex; flex-direction:column; justify-content:center;
  border-right:1px solid var(--bd);
}
.chi-copy .s-lead { margin-top:1.2rem; margin-bottom:2rem; }
.chi-copy .ctas { display:flex; gap:1rem; flex-wrap:wrap; }
.chi-foto {
  position:relative; overflow:hidden; min-height:500px;
}
.chi-foto img {
  width:100%; height:100%; object-fit:cover; display:block;
  filter:saturate(.82) brightness(.9);
  transition:transform .7s ease;
}
.chi-siamo:hover .chi-foto img { transform:scale(1.03); }

/* ── SERVIZI ─────────────────────────────────────────────────── */
.servizi {
  background:var(--k);
  padding:8rem 5vw;
  position:relative; overflow:hidden;
}
.servizi-top {
  display:grid; grid-template-columns:1fr 1fr;
  gap:4rem; align-items:end;
  margin-bottom:4rem;
  position:relative; z-index:1;
}
.servizi-top h2 { color:var(--w); }
.servizi-top h2 em { color:var(--y); }
.servizi-top .s-lead { color:rgba(255,255,255,.48); }
.servizi-grid {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1px; background:rgba(247,174,78,.1);
  position:relative; z-index:1;
}
.serv-card {
  background:rgba(41,37,38,.85);
  padding:2.8rem;
  position:relative; overflow:hidden;
  transition:background .25s;
}
.serv-card:hover { background:rgba(58,53,54,.9); }
.serv-card::before {
  content:''; position:absolute;
  top:0; left:0; right:0; height:2.5px;
  background:var(--y);
  transform:scaleX(0); transform-origin:left;
  transition:transform .35s ease;
}
.serv-card:hover::before { transform:scaleX(1); }
.serv-num {
  font-family:'Cormorant Garamond',serif;
  font-size:3.5rem; font-weight:700;
  color:rgba(247,174,78,.15); line-height:1;
  display:block; margin-bottom:.6rem;
}
.serv-card h3 {
  font-family:'Cormorant Garamond',serif;
  font-size:1.5rem; font-weight:600; color:var(--w);
  margin-bottom:.8rem; line-height:1.2;
}
.serv-card p {
  font-size:.86rem; font-weight:300; line-height:1.85;
  color:rgba(255,255,255,.42);
}

/* ── GALLERY STRIP ───────────────────────────────────────────── */
.gallery-strip {
  display:grid; grid-template-columns:1.2fr 1fr 1fr;
  height:380px; gap:3px;
}
.gallery-item { overflow:hidden; position:relative; }
.gallery-item img {
  width:100%; height:100%; object-fit:cover; display:block;
  filter:saturate(.85) brightness(.92);
  transition:transform .6s ease, filter .4s ease;
}
.gallery-item:hover img { transform:scale(1.04); filter:saturate(1) brightness(1); }
.gallery-item-label {
  position:absolute; bottom:0; left:0; right:0;
  background:linear-gradient(transparent,rgba(35,31,32,.7));
  padding:1.5rem 1.2rem .8rem;
  font-size:.6rem; font-weight:600; letter-spacing:.18em;
  text-transform:uppercase; color:rgba(255,255,255,.65);
  opacity:0; transition:opacity .3s;
}
.gallery-item:hover .gallery-item-label { opacity:1; }

/* ── IMMOBILI IN EVIDENZA ────────────────────────────────────── */
.immobili {
  background:var(--g0);
  padding:8rem 5vw;
}
.immobili-top {
  display:flex; align-items:flex-end;
  justify-content:space-between; gap:2rem;
  margin-bottom:3.5rem; flex-wrap:wrap;
}
.immobili-top h2 em { color:var(--yd); }
.immobili-grid {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1.5rem;
}
/* Card immobile homepage — più leggera rispetto alla card completa */
.imm-card {
  background:var(--w);
  overflow:hidden;
  transition:box-shadow .25s;
  display:flex; flex-direction:column;
}
.imm-card:hover { box-shadow:0 6px 30px rgba(35,31,32,.1); }
.imm-photo {
  height:220px; overflow:hidden; position:relative;
}
.imm-photo img {
  width:100%; height:100%; object-fit:cover; display:block;
  filter:saturate(.88) brightness(.95);
  transition:transform .5s ease;
}
.imm-card:hover .imm-photo img { transform:scale(1.04); filter:saturate(1) brightness(1); }
.imm-badge {
  position:absolute; top:.8rem; left:.8rem;
  background:var(--k); color:var(--y);
  font-size:.56rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  padding:.22rem .6rem;
}
.imm-body { padding:1.6rem 1.8rem 1.4rem; flex:1; display:flex; flex-direction:column; }
.imm-zone {
  font-size:.6rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--yd); margin-bottom:.4rem; display:block;
}
.imm-title {
  font-family:'Cormorant Garamond',serif;
  font-size:1.2rem; font-weight:600; color:var(--k);
  margin-bottom:.5rem; line-height:1.25;
}
.imm-desc {
  font-size:.8rem; font-weight:300; line-height:1.7; color:var(--mu);
  flex:1; margin-bottom:1rem;
}
.imm-footer {
  display:flex; align-items:center; justify-content:space-between;
  border-top:1px solid var(--bd); padding-top:.9rem;
}
.imm-price {
  font-family:'Cormorant Garamond',serif;
  font-size:1.35rem; font-weight:700; color:var(--k);
}
.imm-link {
  font-size:.7rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase;
  color:var(--yd); text-decoration:none;
  transition:color .2s;
}
.imm-link:hover { color:var(--k); }
.imm-cta-wrap {
  margin-top:2.5rem; text-align:center;
}
.imm-cta-wrap p {
  font-size:.88rem; color:var(--mu); margin-bottom:1rem;
}

/* ── QUOTE BANNER ───────────────────────────────────────────── */
.quote-banner {
  height:420px; position:relative; overflow:hidden;
}
.quote-banner img {
  width:100%; height:100%; object-fit:cover;
  object-position:center 60%;
  filter:brightness(.35) saturate(.6); display:block;
}
.quote-overlay {
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  padding:0 5vw; text-align:center;
}
.q-text {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(1.6rem,3vw,2.6rem);
  font-style:italic; font-weight:300;
  color:var(--w); line-height:1.35; max-width:720px;
}
.q-text em { color:var(--y); font-style:normal; font-weight:600; }
.q-attr {
  display:block; margin-top:1rem;
  font-size:.65rem; font-weight:500; letter-spacing:.22em; text-transform:uppercase;
  color:rgba(255,255,255,.38);
}

/* ── CTA CONTATTI ───────────────────────────────────────────── */
.contatti {
  background:var(--y);
  padding:7rem 5vw;
  position:relative; overflow:hidden;
}
.contatti-house-deco {
  position:absolute; bottom:-4%; left:-1%;
  width:clamp(240px,28vw,400px); opacity:.12; pointer-events:none;
}
.contatti-house-deco svg { width:100%; height:auto; display:block; }
.contatti-house-deco path { fill:#231F20; }
.contatti-inner {
  display:grid; grid-template-columns:1fr auto;
  gap:5rem; align-items:center;
  position:relative; z-index:1;
}
.contatti-inner h2 { color:var(--k); }
.contatti-inner h2 em { color:var(--w); font-style:italic; font-weight:300; }
.contatti-inner .s-lead { color:rgba(35,31,32,.65); max-width:480px; }

/* ── RESPONSIVE ─────────────────────────────────────────────── */
@media (max-width:1024px) {
  .chi-siamo { grid-template-columns:1fr; }
  .chi-foto  { height:340px; min-height:auto; }
  .chi-copy  { border-right:none; border-bottom:1px solid var(--bd); }
  .servizi-top { grid-template-columns:1fr; gap:2rem; }
  .servizi-grid { grid-template-columns:repeat(2,1fr); }
  .immobili-grid { grid-template-columns:repeat(2,1fr); }
  .gallery-strip { grid-template-columns:1fr 1fr; height:300px; }
  .gallery-strip .gallery-item:nth-child(3) { display:none; }
  .hero-strip { grid-template-columns:repeat(2,1fr); }
  .contatti-inner { grid-template-columns:1fr; gap:3rem; }
}
@media (max-width:640px) {
  .hero { padding-top:calc(var(--H) + 80px); }
  .chi-copy { padding:4rem 4vw; }
  .servizi { padding:5rem 4vw; }
  .servizi-grid { grid-template-columns:1fr; }
  .immobili { padding:5rem 4vw; }
  .immobili-grid { grid-template-columns:1fr; }
  .gallery-strip { height:240px; grid-template-columns:1fr; }
  .gallery-strip .gallery-item:nth-child(2),
  .gallery-strip .gallery-item:nth-child(3) { display:none; }
  .quote-banner { height:280px; }
  .contatti { padding:4rem 4vw; }
  .hero-strip { grid-template-columns:repeat(2,1fr); }
}