/* Schermata unica: solo quando la finestra è abbastanza grande da mostrare
   tutto (almeno 1024px di larghezza e 820px di altezza): la pagina sta in una
   videata e NON scorre. Sotto quelle misure — iPhone, iPad in verticale,
   portatili o finestre basse, zoom alto — la pagina scorre normalmente e le
   certificazioni si leggono per intero, descrizione compresa (scelta di Irene). */
@media (min-width: 1024px) and (min-height: 820px) {
  html, body { height: 100%; overflow: hidden; }
  .page { height: 100%; padding: 14px; display: flex; }
  .shell { flex: 1; min-height: 0; display: flex; flex-direction: column; }

  .header { height: 54px; flex: none; }
  .hero { flex: none; margin: 12px 12px 10px; padding: 18px 24px 16px; min-height: 0; gap: 20px; }
  .info { flex: none; }
  .footer { flex: none; padding: 9px 0; }

  /* La sezione certificazioni è l'unica elastica: prende lo spazio che avanza. */
  .content { flex: 1; min-height: 0; display: flex; flex-direction: column; padding: 4px 26px 14px; }
  .sectionhead { flex: none; margin: 4px 0 10px; }
  /* Se un domani le certificazioni diventano molte, scorrono QUI dentro:
     la pagina intera resta comunque ferma. */
  .certs { flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; align-content: start; padding: 4px; margin: -4px; }
  .instagram { flex: none; margin-top: 10px; }

  /* Le certificazioni sono già tutte a schermo: il link perde senso. */
  #vediTutte { display: none; }
}
