/* scuolavox.it — correzioni di impaginazione (25/10/2026). Solo layout: testi, colori e font restano quelli della pagina. */

/* Riquadro «Scuola Evoluta è la divisione Scuola…» sotto le testimonianze: stava fuori dal contenitore e usciva di
   12px a destra (striscia bianca e pagina che scorre di lato). Ora è largo e allineato come il resto della sezione. */
#testimonianze > .row.mt-5 {
  --bs-gutter-x: 0;
  margin-inline: auto;
  width: 100%;
  padding-inline: 12px;
}
@media (min-width: 576px) { #testimonianze > .row.mt-5 { max-width: 540px; } }
@media (min-width: 768px) { #testimonianze > .row.mt-5 { max-width: 720px; } }
@media (min-width: 992px) { #testimonianze > .row.mt-5 { max-width: 960px; } }
@media (min-width: 1200px) { #testimonianze > .row.mt-5 { max-width: 1140px; } }
@media (min-width: 1400px) { #testimonianze > .row.mt-5 { max-width: 1320px; } }

/* Didascalie dei video: nome e ruolo affiancati in colonne strette andavano a capo parola per parola; fino ai
   1400px il ruolo va sotto il nome (come già da telefono). */
@media (max-width: 1399.98px) {
  .reviewer-toggle { flex-wrap: wrap; }
  .reviewer-toggle .role-badge { margin-left: 28px; margin-top: 4px; }
}

/* Recensioni: le virgolette decorative non coprono più la prima riga del testo. */
.testimonial-card i.quote-mark { top: 4px; right: 16px; font-size: 2rem; line-height: 1; }

/* Numeri di telefono mai spezzati a metà. */
a[href^="tel:"] { white-space: nowrap; }

/* Telefono: link del piè di pagina comodi per il dito. */
@media (max-width: 767px) {
  footer a { display: inline-block; padding-block: 0.35rem; }
}

/* Titoli: righe bilanciate, mai una parola sola sull'ultima riga (stesso testo, solo dove va a capo). */
h1, h2, h3 { text-wrap: balance; }

/* «Perché scegliere ScuolaVox?»: i titoli delle quattro schede vanno a capo in modo diverso, quindi le descrizioni
   partivano a quote diverse. Spazio del titolo uguale per tutte le schede della riga: descrizioni allineate. */
@media (min-width: 768px) {
  .feature-box .feature-title { min-height: 2lh; }
  .feature-box p.feature-text { margin-top: 1rem; }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  .feature-box .feature-title { min-height: 3lh; }
}

/* Hero sui portatili (992–1439px, 13" compresi): titolo su 4 righe in una colonna stretta e 9rem di spazio sopra,
   il pulsante «Scegli la comunicazione scolastica moderna» finiva sotto la piega. Spazio sopra e titolo proporzionati,
   testo senza rientro a destra: pulsante sempre visibile. */
@media (min-width: 992px) and (max-width: 1439.98px) {
  .hero { padding-top: 6rem; padding-bottom: 5rem; }
  .hero h1 { font-size: clamp(2rem, 1rem + 1.45vw, 2.6rem); }
  .hero .lead { padding-right: 1rem; }
}
@media (min-width: 992px) and (max-height: 820px) {
  .hero { padding-top: 5rem; padding-bottom: 4rem; }
}
/* Pulsante del hero: sempre dentro la colonna del testo (mai sopra il video); su una riga se ci sta, altrimenti va a
   capo con righe bilanciate. */
.hero .btn-lg.pulse { white-space: nowrap; max-width: 100%; }
@media (min-width: 992px) and (max-width: 1399.98px) {
  .hero .d-lg-block .btn-lg.pulse { font-size: 1rem; padding: 0.7rem 1.25rem; }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  .hero .d-lg-block .btn-lg.pulse { white-space: normal; text-wrap: balance; }
}
@media (max-width: 575.98px) {
  .hero .btn-lg.pulse { font-size: 0.85rem; padding: 0.65rem 0.9rem; }
}
@media (max-width: 389.98px) {
  .hero .btn-lg.pulse { white-space: normal; }
}
/* Da computer testo e video del hero partono alla stessa quota (allineati in alto). */
@media (min-width: 992px) {
  .hero .hero-content > .row.align-items-center { align-items: flex-start !important; }
  .hero .hero-content h1 { margin-top: 0; }
}