/* Sezioni 02-03 della home: intro «Sentiti a casa, nel cuore della Puglia»
   e titolo di fascia «Un soggiorno chic e confortevole».
   Valori dagli stili calcolati del sito vivo (sec2_4f35b99, sec3_b446674). */

/* ------------------------------------------------------------ 02 — intro */
.intro{padding-top:115px}

/* l'originale impilava i widget dentro un flex: lo teniamo perche' i margini
   verticali dei blocchi non devono collassare fra loro e perche' il bottone
   a larghezza automatica resti centrato */
.intro__blocchi{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  text-align:center;
}
.intro__intestazione{width:100%}

.intro__testo{
  width:100%;
  padding-inline:28%;      /* 308px sui 1100 della griglia: il testo resta largo 484px */
}
.intro__testo .testo-intro{margin:10px 0}

/* Blocco di azione: prima l'invito che converte, poi l'alternativa, poi la
   prova. I 40px di stacco sopra sono quelli che aveva .intro__azione. */
.intro__azioni{width:100%;margin:40px 0 3px}

/* «Verifica disponibilita'»: era un residuo Elementor con Arial, bordo #636363
   e un verde d'hover (#16724f) che non e' quello del marchio. Ora usa i bottoni
   del sito — stessa famiglia, stesso verde --accento — e diventa l'azione
   primaria della home. L'icona resta, il testo lo maiuscola .bottone. */
.intro__verifica{
  display:inline-flex;
  align-items:center;
  gap:12px;
}
/* proporzioni del glifo Font Awesome sostituito: 448x512 su un em di 512.
   Il calendario e' alto quanto il testo del bottone, non di piu'. */
.intro__icona{flex:none;width:14px;height:16px}


/* -------------------------------------------------- 03 — titolo di fascia */
.fascia-titolo{padding:140px 0 0 4.1%}   /* 4.1% = 59.04px a 1440 */

/* flow-root: trattiene il margine negativo del titolo, altrimenti uscirebbe
   dal blocco e il filo verticale salirebbe di 6px */
.fascia-titolo__blocco{display:flow-root}

.fascia-titolo__titolo{
  margin-top:-6px;
  font-size:46px;
  line-height:59.8px;
  letter-spacing:-1.38px;
}

/* --------------------------------------------------------- schermi stretti */
@media (max-width:1024px){
  .intro{padding-top:80px}
  .intro__testo{padding-inline:10%}
  .fascia-titolo{padding:175px 0 0 55px}
}

@media (max-width:768px){
  .intro{padding-top:90px}
  .intro__testo{padding-inline:0}
  .intro__azioni{margin:0;padding-top:25px}
  .intro .titolo{font-size:45px;line-height:54px;letter-spacing:-1.8px}
  .fascia-titolo{padding:150px 0 0 30px}
  .fascia-titolo__titolo{font-size:40px;line-height:52px;letter-spacing:-1.2px}
}
