/* =========================
   Van4Opportunity (v4o) - HERO
   ========================= */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@600;800;900&display=swap');

/* >>> MODIFICA: HERO RESPONSIVE (desktop + mobile) <<< */
.v4o-hero{
  position:relative;
  /* invece di 100vh fisso, si adatta meglio a desktop e mobile */
  min-height: clamp(520px, 78vh, 900px);

  display:flex;
  align-items:flex-end;

  /* padding più responsive */
  padding: clamp(70px, 10vh, 140px) 16px clamp(50px, 8vh, 90px);

  background:#000;
  color:#fff;
  overflow:hidden;
}

.v4o-hero-bg{
  position:absolute;
  inset:0;

  background-size:cover;
  background-position:center;

  /* zoom leggero ok, ma rendiamolo più stabile */
  transform:scale(1.02);
  will-change: transform;
}
/* >>> FINE MODIFICA <<< */

.v4o-hero-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(to bottom, rgba(0,0,0,.35), rgba(0,0,0,.85));
}

.v4o-hero-inner{
  position:relative;
  max-width:1100px;
  margin:0 auto;
  text-align:center;
}

.v4o-title{
  font-size:clamp(34px,4vw,56px);
  line-height:1.05;
  margin:0 0 18px;
}

/* SOTTOTITOLO: "La curiosità è la madre..." (desktop) */
.v4o-sub{
  max-width:820px;
  margin:0 auto 26px;
  font-size: clamp(15px, 1.25vw, 17px); /* prima 18px */
  line-height: 1.5;
  opacity:.9;
}

/* Smartphone: più piccolo + interlinea ridotta */
@media (max-width: 768px){
  .v4o-sub{
    font-size: clamp(14px, 3.8vw, 15px);
    line-height: 1.25; /* interlinea ridotta */
  }
}

/* ===== CTA HERO ===== */
/* NON ridefinire .v4o-btn globale qui: lo gestisce v4o-btn-test.css */
/* Qui al massimo aggiungiamo micro-regole SOLO per l'hero */

.v4o-hero .v4o-btn{
  /* lascia display/padding/line-height al file v4o-btn-test.css */
  border-radius: 10px; /* se vuoi mantenerla più “squadrata” nell’hero */
}

/* Variante GHOST in hero: non cambiare padding/line-height, solo look */
.v4o-hero .v4o-btn.v4o-btn--ghost{
  background: rgba(255,255,255,0.06);
  color: #fff;
  border: 1px solid rgba(255,255,255,0.22);
  box-shadow: none;
  filter: none;
}

.v4o-hero .v4o-btn.v4o-btn--ghost:hover{
  background: rgba(255,255,255,0.10);
  border-color: rgba(255,255,255,0.35);
  filter: none;
}