/* Stile comune a tutte le pagine di quantometto.it.
   Una modifica qui vale per tutte le pagine che caricano questo file; lo stile proprio di una pagina
   resta nel suo <style>, che viene dopo e quindi prevale. I link hanno ?v=versione: il browser tiene
   il file per un anno e scarica quello nuovo a ogni versione (lo controlla pubblica.sh). */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
a { color: var(--blu); }
.contenitore { max-width: var(--larghezza); margin: 0 auto; padding: 0 24px; }
/* intestazione */
.testata { background: #fff; position: sticky; top: 0; z-index: 10; }
.testata .contenitore { display: flex; align-items: center; justify-content: space-between; height: 76px; }
.marchio { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; color: var(--blu); }
.marchio .nome { display: flex; flex-direction: column; font-family: var(--titoli); font-weight: 800; font-size: 22px; line-height: 1.05; letter-spacing: -.02em; color: var(--inchiostro); }
.marchio .nome small { font-family: "Inter", system-ui, sans-serif; font-weight: 600; font-size: 12px; letter-spacing: 0; margin-top: 3px; color: var(--tenue); }
footer .marchio, footer .marchio .nome { color: #fff; }
footer .marchio .nome small { color: rgba(255, 255, 255, .6); }
.testata nav { display: flex; align-items: center; gap: 28px; font-weight: 600; font-size: 15px; }
.menu-pulsante { display: none; background: none; border: 0; padding: 8px; cursor: pointer; color: var(--blu); }
/* fondo pagina */
footer { background: var(--blu-scuro); color: rgba(255, 255, 255, .78); }
/* sostegno volontario al progetto: un link sobrio, fuori dalla stampa */
footer .sostegno { border-top: 1px solid rgba(255, 255, 255, .14); padding-top: 22px; padding-bottom: 22px; font-size: 15px; }
@media print { footer .sostegno { display: none !important; } }
footer .versione { color: var(--oro-chiaro); font-weight: 600; font-variant-numeric: tabular-nums; }
@media (max-width: 900px) {
  .menu-pulsante { display: block; }
  .testata nav {
    display: none; position: absolute; top: 76px; left: 0; right: 0; background: #fff;
    flex-direction: column; align-items: stretch; gap: 0; padding: 8px 24px 20px; box-shadow: 0 12px 24px rgba(0, 0, 0, .08);
  }
  .testata nav.aperto { display: flex; }
}