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

/* Telefono, tablet e portatili piccoli: il testo giustificato in colonne strette lascia buchi tra le parole; allineato a sinistra. */
@media (max-width: 1199.98px) {
  .prodotto-box p { text-align: left; }
}

/* Bottone fisso «Prenota consulenza gratuita»: lascia posto al pulsante privacy (Iubenda) in basso a destra,
   che prima ci finiva sopra. */
@media (max-width: 991.98px) {
  body:has(.iubenda-tp-btn) .sticky-mobile-cta { padding-right: 68px; }
}

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

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

/* Recensioni: niente spazio vuoto in fondo alle schede (margine dell'ultimo paragrafo + margine sotto la scheda,
   che con l'altezza al 100% la faceva sporgere oltre la colonna e disallineava la riga). */
.testimonial-box { margin-bottom: 0; }
.testimonial-box > p:last-child, .testimonial-box > :last-child { margin-bottom: 0; }

/* «Soluzioni»: quattro schede (Campanella, ScuolaVox, Academy, Mamelio). Griglia con righe condivise (subgrid): in ogni
   riga di schede loghi, titoli, sottotitoli, testi e pulsanti partono alla stessa quota e le schede hanno la stessa
   altezza. Una colonna da telefono, 2×2 da tablet e portatili (13" compresi), 4 affiancate da 1400px. */
#soluzioni {
  display: grid; grid-template-columns: minmax(0, 1fr); column-gap: 1.5rem; row-gap: 1.5rem;
  margin-left: 0; margin-right: 0;
}
@media (min-width: 768px) { #soluzioni { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1400px) { #soluzioni { grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: 1.25rem; } }
#soluzioni > [class*="col-"] {
  width: auto; max-width: none; padding: 0; margin: 0;
  display: grid; grid-row: span 4; grid-template-rows: subgrid; row-gap: 0;
}
#soluzioni .prodotto-box {
  grid-row: span 4; display: grid; grid-template-rows: subgrid; row-gap: 0;
  height: auto; margin-bottom: 0;
}
#soluzioni .prodotto-box > div { display: contents; }
#soluzioni .prodotto-box img { width: 100%; height: 150px; object-fit: contain; align-self: center; }
/* Il logo di Mamelio ha molto margine bianco dentro il file: stessa altezza visiva degli altri loghi. */
#soluzioni #mamelio-ai .prodotto-box img { transform: scale(1.3); }
#soluzioni .prodotto-box { overflow: clip; }
@media (max-width: 767.98px) { #soluzioni #mamelio-ai .prodotto-box img { transform: scale(1.15); } }
#soluzioni .prodotto-box h3 { align-self: start; }
#soluzioni .prodotto-box p { text-align: left; }
/* Pulsanti tutti alla stessa altezza e alla stessa quota, testo centrato. */
#soluzioni .prodotto-box > .btn { align-self: stretch; display: flex; align-items: center; justify-content: center; }
@media (min-width: 1400px) {
  /* Quattro affiancate: nomi su una o due righe, il sottotitolo parte sempre alla stessa quota. */
  #soluzioni .prodotto-box h3 strong { min-height: 2lh; display: flex; align-items: flex-end; justify-content: center; }
  #soluzioni .prodotto-box { padding: 1.75rem 1.5rem; }
  #soluzioni .prodotto-box img { height: 130px; }
}

/* Icone animate di sfondo: quelle vicine al bordo destro non allargano mai la pagina (niente scorrimento di lato). */
#svg-background-container { overflow: hidden; width: 100%; }
