/* ═══════════════════════════════════════════════════════════════
   BEB Case — template-vendere-casa.css
   Caricato solo su questo template
═══════════════════════════════════════════════════════════════ */

/* ── HERO ─────────────────────────────────────────────────────── */
.vendi-hero {
  position:relative;
  min-height:100vh;
  padding-top:var(--H);
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
.vendi-hero-bg {
  position:absolute; inset:0;
  background-size:cover;
  background-position:center 45%;
  filter:brightness(.28) saturate(.7);
}
.vendi-hero-inner {
  position:relative; z-index:2;
  flex:1;
  display:flex; flex-direction:column; justify-content:center;
  padding:4rem 5vw 3rem;
  max-width:860px;
}
.vendi-hero-tag {
  display:inline-flex; align-items:center; gap:.8rem;
  font-size:.68rem; font-weight:600; letter-spacing:.28em;
  text-transform:uppercase; color:var(--y);
  margin-bottom:2rem;
}
.vendi-h1 {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(2.8rem,5.5vw,5.2rem);
  font-weight:300; line-height:1.08; color:var(--w);
  margin-bottom:1.6rem; letter-spacing:-.01em;
}
.vendi-h1 strong { font-weight:700; }
.vendi-h1 em { font-style:italic; color:var(--y); font-weight:300; }
.vendi-hero-lead {
  font-size:1rem; font-weight:300; line-height:1.9;
  color:rgba(255,255,255,.62); max-width:560px; margin-bottom:2.5rem;
}
.vendi-hero-btns { display:flex; flex-wrap:wrap; gap:.8rem; }

.btn-main {
  display:inline-block; background:var(--y); color:var(--k);
  font-size:.74rem; font-weight:600; letter-spacing:.16em;
  text-transform:uppercase; text-decoration:none;
  padding:.95rem 2.2rem;
  transition:background .2s, transform .15s;
  white-space:nowrap;
}
.btn-main:hover { background:#ffc46a; transform:translateY(-2px); }
.btn-wh {
  display:inline-block;
  border:1px solid rgba(255,255,255,.3); color:rgba(255,255,255,.75);
  font-size:.74rem; font-weight:500; letter-spacing:.14em;
  text-transform:uppercase; text-decoration:none;
  padding:.95rem 2.2rem;
  transition:border-color .2s, color .2s;
  white-space:nowrap;
}
.btn-wh:hover { border-color:var(--y); color:var(--y); }

/* Strip numeri in fondo all'hero */
.vendi-hero-numbers {
  position:relative; z-index:2;
  background:rgba(35,31,32,.88);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-top:2px solid var(--y);
  display:grid; grid-template-columns:repeat(4,1fr);
  flex-shrink:0;
}
.hn-item {
  padding:1.5rem 2.5vw;
  border-right:1px solid rgba(247,174,78,.15);
  display:flex; align-items:center; gap:1rem;
}
.hn-item:last-child { border-right:none; }
.hn-val {
  font-family:'Cormorant Garamond',serif;
  font-size:2.2rem; font-weight:700; color:var(--y);
  line-height:1; display:block;
}
.hn-label {
  font-size:.62rem; font-weight:500; letter-spacing:.1em;
  text-transform:uppercase; color:rgba(255,255,255,.4);
  margin-top:.2rem; display:block; line-height:1.3;
}

/* ── TRE RAGIONI ─────────────────────────────────────────────── */
.ragioni { background:var(--w); padding:8rem 0 0; }
.ragioni-intro {
  padding:0 5vw 5rem;
  display:grid; grid-template-columns:1fr 1fr; gap:5rem; align-items:end;
}
.ragioni-intro h2 em { font-style:italic; font-weight:300; color:var(--yd); }
.ragioni-intro .s-body { max-width:none; }

.ragione {
  display:grid;
  grid-template-columns:1fr 1fr;
  min-height:500px;
  overflow:hidden;
}
/* Righe pari: immagine a destra */
.ragione:nth-child(even) { direction:rtl; }
.ragione:nth-child(even) > * { direction:ltr; }

.ragione-visual {
  position:relative; overflow:hidden; background:var(--k);
}
.ragione-visual img {
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .6s ease;
}
.ragione:hover .ragione-visual img { transform:scale(1.03); }
.rag-bg-num {
  position:absolute;
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(10rem,22vw,20rem); font-weight:700;
  color:rgba(255,255,255,.07);
  line-height:1; right:-2vw; bottom:-3vw;
  pointer-events:none; user-select:none; z-index:1;
}
.ragione-copy {
  padding:5rem 5vw;
  display:flex; flex-direction:column; justify-content:center;
  background:var(--w);
}
.rag-num {
  font-family:'Cormorant Garamond',serif;
  font-size:1rem; font-weight:600; color:var(--y);
  letter-spacing:.2em; margin-bottom:1.5rem; display:block;
}
.ragione-copy h3 {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(1.8rem,2.6vw,2.5rem);
  font-weight:600; line-height:1.15; color:var(--k); margin-bottom:1.2rem;
}
.ragione-copy h3 em { font-style:italic; font-weight:300; color:var(--yd); }
.ragione-copy p {
  font-size:.93rem; font-weight:300; line-height:1.9;
  color:var(--mu); max-width:440px;
}
.rag-accent { display:flex; align-items:center; gap:1rem; margin-top:2.5rem; }
.rag-accent-line { height:2px; width:40px; background:var(--y); flex-shrink:0; }
.rag-accent-text {
  font-size:.75rem; font-weight:600; letter-spacing:.15em;
  text-transform:uppercase; color:var(--k);
}
/* Ragione scura */
.ragione.dark .ragione-copy { background:var(--k); }
.ragione.dark h3 { color:var(--w); }
.ragione.dark p { color:rgba(255,255,255,.5); }
.ragione.dark .rag-accent-text { color:rgba(255,255,255,.7); }

/* ── FOTO FULL — banner citazione ────────────────────────────── */
.foto-full { height:480px; position:relative; overflow:hidden; }
.foto-full img {
  width:100%; height:100%; object-fit:cover;
  object-position:center 40%;
  filter:brightness(.45) saturate(.75); display:block;
}
.foto-full-overlay {
  position:absolute; inset:0;
  display:flex; align-items:center;
  padding:0 5vw;
}
.foto-quote {
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(1.7rem,3vw,2.8rem);
  font-style:italic; font-weight:300;
  color:var(--w); line-height:1.35; max-width:680px;
}
.foto-quote em { color:var(--y); font-style:normal; font-weight:600; }
.foto-quote-attr {
  display:block; margin-top:1.2rem;
  font-family:'Barlow',sans-serif;
  font-size:.7rem; font-weight:500;
  letter-spacing:.22em; text-transform:uppercase;
  color:rgba(255,255,255,.4); font-style:normal;
}

/* ── EXPERTISE ───────────────────────────────────────────────── */
.expertise { background:var(--g0); padding:8rem 5vw; }
.exp-top {
  display:grid; grid-template-columns:1fr 1fr;
  gap:4rem; align-items:end; margin-bottom:5rem;
}
.exp-top h2 em { font-style:italic; font-weight:300; color:var(--yd); }
.exp-top .s-body { max-width:none; }
.exp-grid {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1px; background:var(--bd);
}
.exp-card {
  background:var(--w); padding:3rem 2.5rem;
  position:relative; overflow:hidden; transition:background .25s;
}
.exp-card:hover { background:var(--g0); }
.exp-num {
  font-family:'Cormorant Garamond',serif;
  font-size:3.5rem; font-weight:700; color:var(--y);
  line-height:1; margin-bottom:1.5rem; display:block;
}
.exp-card h3 {
  font-family:'Cormorant Garamond',serif;
  font-size:1.32rem; font-weight:600; color:var(--k); margin-bottom:.7rem;
}
.exp-card p { font-size:.86rem; font-weight:300; line-height:1.8; color:var(--mu); }
.exp-card::after {
  content:''; position:absolute; bottom:0; left:0; right:0;
  height:3px; background:var(--y);
  transform:scaleX(0); transform-origin:left;
  transition:transform .3s ease;
}
.exp-card:hover::after { transform:scaleX(1); }

/* ── STRIP NERA ──────────────────────────────────────────────── */
.perche-strip { background:var(--k); padding:6rem 5vw; overflow:hidden; }
.perche-strip-inner { display:grid; grid-template-columns:repeat(3,1fr); }
.pstrip-item {
  padding:2rem 3rem;
  border-right:1px solid rgba(247,174,78,.12);
}
.pstrip-item:first-child { border-left:1px solid rgba(247,174,78,.12); }
.pstrip-item:last-child { border-right:none; }
.pstrip-big {
  font-family:'Cormorant Garamond',serif;
  font-size:5rem; font-weight:700; color:var(--y);
  line-height:1; display:block; margin-bottom:.3rem;
}
.pstrip-label {
  font-size:.68rem; font-weight:600; letter-spacing:.18em;
  text-transform:uppercase; color:rgba(255,255,255,.35);
  margin-bottom:.8rem; display:block;
}
.pstrip-desc {
  font-size:.88rem; font-weight:300; line-height:1.75; color:rgba(255,255,255,.5);
}

/* ── CTA ─────────────────────────────────────────────────────── */
.vendi-cta { background:var(--y); padding:7rem 5vw; overflow:hidden; }
.vendi-cta-inner {
  display:grid; grid-template-columns:1fr auto;
  gap:5rem; align-items:center;
}
.vendi-cta .s-label { color:var(--k); opacity:.6; }
.vendi-cta .s-label::before { background:rgba(35,31,32,.35); }
.vendi-cta h2 { color:var(--k); }
.vendi-cta h2 em { color:var(--w); font-style:italic; font-weight:300; }
.vendi-cta .s-body { color:rgba(35,31,32,.7); max-width:500px; }
.vendi-cta-box {
  background:var(--k); padding:3rem 2.8rem;
  min-width:320px; flex-shrink:0;
}
.vendi-cta-box-ey {
  font-size:.65rem; font-weight:600; letter-spacing:.2em;
  text-transform:uppercase; color:var(--y);
  margin-bottom:1.5rem; display:block;
}


/* ── SEZIONE SEO ZONE / COMUNI ───────────────────────────────── */
.seo-zone {
  background:var(--w);
  padding:7rem 5vw;
  border-top:1px solid var(--bd);
  border-bottom:1px solid var(--bd);
}
.seo-zone-head {
  display:grid; grid-template-columns:1fr 1fr;
  gap:4rem; align-items:end;
  margin-bottom:4rem;
}
.seo-zone-head h2 em { font-style:italic; font-weight:300; color:var(--yd); }
.seo-zone-head .s-body { max-width:none; }

.seo-zone-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:4rem;
}
.seo-col-title {
  font-size:.62rem; font-weight:700; letter-spacing:.22em;
  text-transform:uppercase; color:var(--y);
  display:block; margin-bottom:1.5rem;
  padding-bottom:.8rem;
  border-bottom:2px solid var(--y);
}
.seo-list {
  display:flex; flex-direction:column; gap:0;
}
.seo-list a, .seo-list span {
  display:block;
  font-size:.84rem; font-weight:300;
  color:var(--k);
  text-decoration:none;
  padding:.5rem 0;
  border-bottom:1px solid var(--bd);
  transition:color .15s, padding-left .15s;
  line-height:1.4;
}
.seo-list a:hover {
  color:var(--yd);
  padding-left:.5rem;
}
.seo-list a::before {
  content:'→ ';
  font-size:.72rem;
  color:var(--y);
  opacity:0;
  transition:opacity .15s;
}
.seo-list a:hover::before { opacity:1; }
.seo-list li:last-child a,
.seo-list li:last-child span { border-bottom:none; }

/* Comuni: griglia 2 colonne per lista più fitta */
.seo-comuni-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0 2rem;
}

/* Nota SEO discreta in fondo */
.seo-note {
  margin-top:3rem;
  padding-top:1.5rem;
  border-top:1px solid var(--bd);
  font-size:.74rem; font-weight:300;
  color:var(--mu); line-height:1.7;
  max-width:780px;
}

@media (max-width:960px) {
  .seo-zone-head { grid-template-columns:1fr; gap:2rem; }
  .seo-zone-grid { grid-template-columns:1fr; gap:3rem; }
  .seo-comuni-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width:480px) {
  .seo-comuni-grid { grid-template-columns:1fr; }
  .seo-zone { padding:5rem 4vw; }
}

/* ── RESPONSIVE ──────────────────────────────────────────────── */
@media (max-width:1024px) {
  .ragioni-intro { grid-template-columns:1fr; gap:2rem; }
  .ragione { grid-template-columns:1fr; min-height:auto; direction:ltr !important; }
  .ragione > * { direction:ltr !important; }
  .ragione-visual { min-height:300px; }
  .ragione-copy { padding:3.5rem 5vw; }
  .exp-top { grid-template-columns:1fr; gap:2rem; }
  .exp-grid { grid-template-columns:repeat(2,1fr); }
  .perche-strip-inner { grid-template-columns:1fr 1fr; }
  .pstrip-item:first-child { border-left:none; }
  .pstrip-item:nth-child(2) { border-right:none; }
  .pstrip-item:last-child { grid-column:1/-1; border-top:1px solid rgba(247,174,78,.12); border-right:none; border-left:none; }
  .vendi-cta-inner { grid-template-columns:1fr; gap:3rem; }
  .vendi-cta-box { min-width:auto; width:100%; max-width:520px; }
  .vendi-hero-numbers { grid-template-columns:repeat(2,1fr); }
  .hn-item:nth-child(2) { border-right:none; }
  .hn-item:nth-child(3) { border-top:1px solid rgba(247,174,78,.1); }
  .hn-item:nth-child(4) { border-right:none; border-top:1px solid rgba(247,174,78,.1); }
}
@media (max-width:768px) {
  .ragione-visual { min-height:260px; }
  .exp-grid { grid-template-columns:1fr; }
  .perche-strip-inner { grid-template-columns:1fr; }
  .pstrip-item { border-right:none; border-left:none !important; border-bottom:1px solid rgba(247,174,78,.12); padding:2rem 0; }
  .pstrip-item:last-child { border-bottom:none; grid-column:auto; }
  .foto-full { height:380px; }
}
@media (max-width:480px) {
  .vendi-hero-inner { padding:3rem 4vw 2.5rem; }
  .vendi-hero-btns { flex-direction:column; }
  .btn-main, .btn-wh { text-align:center; width:100%; }
  .vendi-hero-numbers { display:none; }
  .ragioni { padding:5rem 0 0; }
  .ragioni-intro { padding:0 4vw 3.5rem; }
  .ragione-visual { min-height:220px; }
  .ragione-copy { padding:2.5rem 4vw; }
  .ragione-copy h3 { font-size:1.7rem; }
  .exp-card { padding:2.2rem 1.8rem; }
  .pstrip-big { font-size:3.8rem; }
  .vendi-cta { padding:5rem 4vw; }
  .vendi-cta-box { padding:2.2rem 1.8rem; }
  .foto-full { height:300px; }
}
