:root{
  --carta:#ffffff;
  --inchiostro:#111418;
  --grigio:#565c63;
  --filo:#d9dde2;
  --rosso:#14456f;
  --almanacco:#14456f;
  --almanacco-testo:#14456f;
  --velo:rgba(20,69,111,.07);
  --velo-forte:rgba(20,69,111,.14);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --carta:#101316;
    --inchiostro:#eceef1;
    --grigio:#9aa2ab;
    --filo:#2a2f35;
    --rosso:#7fb0dc;
    --almanacco:#16405f;
    --almanacco-testo:#cfe0ef;
    --velo:rgba(127,176,220,.12);
    --velo-forte:rgba(127,176,220,.22);
  }
}
*{box-sizing:border-box}
body{
  margin:0;
  background:var(--carta);
  color:var(--inchiostro);
  font-family:Georgia,"Times New Roman",serif;
  font-size:18px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
.foglio{max-width:720px;margin:0 auto;padding:0 20px}

/* ---- banner ---- */
.banner{display:block;margin:14px 0 0;line-height:0}
.banner img{width:100%;border-radius:2px}

/* ---- testata ---- */
header.testata{padding:22px 0 0;text-align:center}
header.testata h1{
  margin:0;
  font-size:clamp(26px,6vw,36px);
  font-weight:700;
  letter-spacing:.02em;
  text-transform:uppercase;
}
header.testata h1 a{color:inherit;text-decoration:none}
header.testata p.occhiello{
  margin:10px 0 0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--grigio);
}

/* ---- menu ---- */
nav{
  margin-top:24px;
  border-top:1px solid var(--filo);
  border-bottom:1px solid var(--filo);
  padding:12px 0;
  text-align:center;
}
nav a{
  display:inline-block;
  margin:4px 3px;
  padding:8px 14px;
  border-radius:6px;
  background:var(--velo);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:12.5px;
  letter-spacing:.12em;
  text-transform:uppercase;
  text-decoration:none;
  color:var(--inchiostro);
  transition:background .12s ease, color .12s ease;
}
nav a:hover{background:var(--velo-forte);color:var(--rosso)}
nav a.attiva{background:var(--almanacco);color:#fff}
nav a.attiva:hover{background:var(--almanacco);color:#fff}

/* ---- righe di servizio ---- */
.riga{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:12px;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--grigio);
  margin:0 0 6px;
}
.riga .sezione{color:var(--rosso)}

/* ---- firma ---- */
.firma{
  margin:10px 0 0 !important;
  font-size:15px;
  font-style:italic;
  color:var(--grigio);
}

/* ---- immagini ---- */
.figura{display:block;margin:14px 0 14px}
.figura img{width:100%;border-radius:2px}
figure.figura{margin:16px 0 16px}
figure.figura figcaption{
  margin-top:8px;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:12.5px;
  line-height:1.45;
  color:var(--grigio);
}

/* ---- apertura ---- */
.apertura{padding:34px 0 30px;border-bottom:1px solid var(--filo)}
.apertura h2{
  margin:0 0 4px;
  font-size:clamp(30px,6.2vw,40px);
  font-weight:700;
  line-height:1.14;
  letter-spacing:-.01em;
}
.apertura h2 a{color:inherit;text-decoration:none}
.apertura h2 a:hover{color:var(--rosso)}
.apertura p{margin:0;color:var(--grigio);font-size:19px;line-height:1.45}

/* ---- elenco ---- */
.elenco{padding:8px 0 0}
article.voce{padding:28px 0;border-bottom:1px solid var(--filo)}
article.voce h3{
  margin:0 0 4px;
  font-size:26px;
  font-weight:700;
  line-height:1.18;
  letter-spacing:-.01em;
}
article.voce h3 a{color:inherit;text-decoration:none}
article.voce h3 a:hover{color:var(--rosso)}
article.voce p{margin:0;color:var(--grigio);font-size:17px;line-height:1.45}

/* ---- pagina di testo e articolo ---- */
.testo{padding:36px 0 10px}
.testo h2{
  margin:0 0 6px;
  font-size:clamp(30px,6vw,40px);
  font-weight:700;
  line-height:1.14;
  letter-spacing:-.01em;
}
.testo h3{
  margin:36px 0 12px;
  font-size:21px;
  font-weight:700;
  letter-spacing:.01em;
  color:var(--inchiostro);
}
.testo p{margin:0 0 20px}
.testo p.sommario{
  font-size:20px;
  color:var(--grigio);
  line-height:1.5;
  margin:0 0 10px;
}
.testo p.firma{margin-bottom:28px !important}
.testo a{color:var(--inchiostro);text-decoration:none;border-bottom:1px solid var(--filo)}
.testo a:hover{color:var(--rosso);border-bottom-color:var(--rosso)}

.fonti{
  margin:44px 0 0;
  padding:22px 0 0;
  border-top:1px solid var(--filo);
}
.fonti h4{
  margin:0 0 10px;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:11.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-weight:700;
  color:var(--grigio);
}
.fonti ol{margin:0;padding-left:20px}
.fonti li{font-size:15.5px;color:var(--grigio);margin-bottom:7px;line-height:1.5}
.fonti a{color:var(--grigio)}

.correzione{
  margin:30px 0 0;
  padding:16px 18px;
  border-left:3px solid var(--rosso);
  background:rgba(20,69,111,.06);
  font-size:16px;
  color:var(--grigio);
}

/* ---- piede ---- */
footer{padding:44px 0 60px;text-align:center}
footer p{
  margin:0 0 10px;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:12.5px;
  line-height:1.8;
  color:var(--grigio);
}
footer a{color:var(--grigio);text-decoration:none;border-bottom:1px solid var(--filo)}
footer a:hover{color:var(--rosso)}
.gerenza{font-size:11.5px !important;letter-spacing:.04em}

/* ---- video ---- */
.elencovideo{display:grid;grid-template-columns:1fr 1fr;gap:28px 22px;padding:10px 0 20px}
@media (max-width:620px){ .elencovideo{grid-template-columns:1fr} }
.video .avvia,
.videonotizia .avvia{
  position:relative;
  display:block;
  width:100%;
  padding:0;
  border:0;
  border-radius:2px;
  background:#000;
  cursor:pointer;
  overflow:hidden;
  line-height:0;
}
.video .avvia img,
.videonotizia .avvia img{width:100%;height:auto;display:block;transition:opacity .15s}
.video .avvia:hover img,
.videonotizia .avvia:hover img{opacity:.82}
.video .triangolo,
.videonotizia .triangolo{
  position:absolute;
  left:50%;top:50%;
  width:60px;height:42px;
  margin:-21px 0 0 -30px;
  border-radius:8px;
  background:rgba(17,20,24,.72);
}
.video .triangolo::after,
.videonotizia .triangolo::after{
  content:"";
  position:absolute;
  left:24px;top:12px;
  width:0;height:0;
  border-top:9px solid transparent;
  border-bottom:9px solid transparent;
  border-left:15px solid #fff;
}
.video .avvia:hover .triangolo,
.videonotizia .avvia:hover .triangolo{background:rgba(20,69,111,.85)}
.video p.titolo,
.videonotizia p.titolo{
  margin:10px 0 0;
  font-size:17px;
  line-height:1.25;
  font-weight:700;
}
.video p.fuori,
.videonotizia p.fuori{
  margin:6px 0 0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:12.5px;
}
.video p.fuori a,
.videonotizia p.fuori a{color:var(--grigio);text-decoration:none;border-bottom:1px solid var(--filo)}
.riquadro{position:relative;width:100%;aspect-ratio:16/9;border-radius:2px;overflow:hidden;background:#000}
.riquadro iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* riquadro della video notizia dentro l'articolo */
.videonotizia{
  margin:4px 0 26px;
  padding:16px 0 0;
  border-top:1px solid var(--filo);
}
.videonotizia .riga{margin:0 0 10px}
@media (min-width:860px){
  .videonotizia{
    float:right;
    width:300px;
    margin:6px 0 18px 26px;
    padding-top:0;
    border-top:0;
  }
}

/* ---- colonna di richiamo (spalla) ---- */
.foglio.larga{max-width:1060px}
.foglio.larga > footer{margin-left:280px}
.foglio.larga > header.testata,
.foglio.larga > nav{margin-left:280px}

/* la cima: riquadro della data a sinistra, striscione a destra */
.cima{display:grid;grid-template-columns:240px minmax(0,1fr);gap:0 40px;align-items:stretch}
.cima .banner{grid-column:2;margin-top:14px}
.datario{
  grid-column:1;
  padding:14px 24px 0 0;
  border-right:1px solid var(--filo);
  text-align:center;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:10px;
  overflow:hidden;
}
.datario p{margin:0}

/* riquadro pieno della data */
.datario .quando{
  background:var(--almanacco);
  color:#fff;
  border-radius:6px;
  padding:12px 8px 14px;
}
.datario .giorno{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:11px;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(255,255,255,.82);
}
.datario .numero{
  font-size:46px;
  line-height:1;
  font-weight:700;
  letter-spacing:-.02em;
  margin:4px 0 2px;
}
.datario .mese{font-size:15px;color:rgba(255,255,255,.88)}

/* riquadro chiaro dell'ora */
.datario .adesso{
  background:var(--velo);
  border-radius:6px;
  padding:9px 8px 10px;
}
.datario .ora{
  font-size:22px;
  line-height:1.1;
  letter-spacing:.06em;
  font-variant-numeric:tabular-nums;
  color:var(--almanacco-testo);
  min-height:24px;
}
.datario .luogo{
  margin:3px 0 0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:10px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--grigio);
}

/* marchio nella colonna */
.datario .sigillo{line-height:0;display:flex;justify-content:center}
.datario .sigillo img{
  width:64px;
  height:64px;
  border-radius:12px;
}

/* piastrelle dei canali */
.datario .canali{margin:0;padding:0;border-top:0}
.datario .canali .cappello{
  margin:0 0 7px;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:10px;
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--grigio);
}
.datario .canali ul{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:1fr 1fr;gap:7px;
}
.datario .canali li{margin:0}
.datario .canali a{
  display:flex;
  align-items:center;
  justify-content:center;
  height:46px;
  border-radius:9px;
  text-decoration:none;
  color:#fff;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:12px;
  font-weight:600;
  text-align:center;
  box-shadow:0 1px 3px rgba(17,20,24,.18);
  transition:transform .12s ease, box-shadow .12s ease;
}
.datario .canali a:hover{transform:translateY(-2px);box-shadow:0 4px 10px rgba(17,20,24,.26)}
.datario .canali a.fb{background:#1877f2}
.datario .canali a.yt{background:#e8262a}
.datario .canali a.tt{background:#111418}
.datario .canali a.ig{background:linear-gradient(140deg,#7b3fb0 0%,#d6356a 48%,#f6a23c 100%)}
.doppia{display:grid;grid-template-columns:240px minmax(0,1fr);gap:0 40px;align-items:start}
.doppia > .principale{grid-column:2;grid-row:1;min-width:0}
.spalla{
  grid-column:1;grid-row:1;
  padding:40px 24px 0 0;
  border-right:1px solid var(--filo);
}
.spalla .cappello{
  margin:0 0 14px;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:11.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-weight:700;
  color:var(--rosso);
  padding-bottom:8px;
  border-bottom:1px solid var(--filo);
}
.spalla .richiami{list-style:none;margin:0 0 34px;padding:0}
.spalla .richiami li{padding:0 0 16px;margin:0 0 16px;border-bottom:1px solid var(--filo)}
.spalla .richiami li:last-child{border-bottom:0;margin-bottom:0}
.spalla .richiami a{display:block;text-decoration:none;color:inherit}
.spalla .richiami img{width:100%;border-radius:2px;margin:0 0 8px}
.spalla .dove{
  display:block;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:10.5px;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--grigio);
  margin:0 0 3px;
}
.spalla .titolo{display:block;font-size:15.5px;line-height:1.3;font-weight:700}
.spalla .richiami a:hover .titolo{color:var(--rosso)}
.spalla .tutti{
  margin:-20px 0 34px;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.spalla .tutti a{color:var(--grigio);text-decoration:none;border-bottom:1px solid var(--filo)}
.spalla .tutti a:hover{color:var(--rosso)}

@media (max-width:980px){
  .foglio.larga{max-width:720px}
  .foglio.larga > header.testata,
  .foglio.larga > nav,
  .foglio.larga > footer{margin-left:0}
  .cima{display:block}
  .cima .banner{margin-top:14px}
  .datario{
    display:block;
    border-right:0;
    border-bottom:1px solid var(--filo);
    padding:12px 0 12px;
    text-align:center;
    overflow:visible;
  }
  .datario .quando,
  .datario .adesso{
    display:inline-flex;
    align-items:baseline;
    justify-content:center;
    gap:8px;
    background:none;
    color:inherit;
    border-radius:0;
    padding:0;
  }
  .datario .adesso{margin-left:8px;padding-left:9px;border-left:1px solid var(--filo)}
  .datario .giorno{color:var(--rosso)}
  .datario .numero{font-size:17px;font-weight:400;margin:0;color:var(--grigio)}
  .datario .mese{font-size:17px;color:var(--grigio)}
  .datario .ora{font-size:17px;min-height:0;color:var(--grigio)}
  .datario .luogo{display:none}
  .datario .canali{margin:12px 0 0}
  .datario .canali .cappello{display:none}
  .datario .canali ul{
    display:flex;justify-content:center;gap:9px;
    max-width:300px;margin:0 auto;
  }
  .datario .canali li{flex:0 0 66px}
  .datario .canali a{height:44px;font-size:11px;border-radius:10px}
  .doppia{display:block}
  .spalla{
    border-right:0;
    border-top:1px solid var(--filo);
    margin-top:36px;
    padding:30px 0 0;
  }
  .spalla .richiami{display:grid;grid-template-columns:1fr 1fr;gap:0 22px}
  .spalla .richiami li:last-child{border-bottom:1px solid var(--filo)}
}
@media (max-width:560px){
  .spalla .richiami{grid-template-columns:1fr}
}

/* ---- richiamo discreto alle statistiche ---- */
a.segno{
  display:inline-block;
  margin-left:10px;
  padding:0 4px;
  border-bottom:0 !important;
  color:var(--filo) !important;
  opacity:.5;
  text-decoration:none;
}
a.segno:hover{color:var(--rosso) !important;opacity:1}

/* ---- riquadro pubblicitario ---- */
.reclame{
  margin:0 0 34px;
  padding:16px 0 0;
  border-top:1px solid var(--filo);
  border-bottom:1px solid var(--filo);
  padding-bottom:16px;
}
.reclame .avviso{
  color:var(--grigio);
  border-bottom:0;
  padding-bottom:0;
  margin:0 0 10px;
  font-size:10.5px;
  letter-spacing:.2em;
}
.reclame .offerta{display:block;text-decoration:none;color:inherit}
.reclame .offerta img{width:100%;border-radius:2px;margin:0 0 8px}
.reclame .dove{
  display:block;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:10.5px;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--rosso);
  margin:0 0 3px;
}
.reclame .titolo{display:block;font-size:15.5px;line-height:1.3;font-weight:700}
.reclame .offerta:hover .titolo{color:var(--rosso)}
.reclame .riga{
  display:block;
  margin:5px 0 0;
  font-size:14px;
  line-height:1.4;
  font-weight:400;
  letter-spacing:0;
  text-transform:none;
  color:var(--grigio);
}
.reclame .altri{list-style:none;margin:12px 0 0;padding:0}
.reclame .altri li{margin:0 0 5px}
.reclame .altri a{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:12.5px;
  color:var(--grigio);
  text-decoration:none;
  border-bottom:1px solid var(--filo);
}
.reclame .altri a:hover{color:var(--rosso);border-bottom-color:var(--rosso)}
.reclame .nota{
  margin:14px 0 0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:11px;
  line-height:1.4;
  color:var(--grigio);
  opacity:.85;
}
@media (max-width:980px){
  .reclame{max-width:420px}
}

/* ---- striscia di ritorno in fondo all'articolo ---- */
.ritorno{
  margin:40px 0 0;
  padding:18px 0 0;
  border-top:1px solid var(--filo);
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px 22px;
}
.ritorno a{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:12.5px;
  letter-spacing:.1em;
  text-transform:uppercase;
  text-decoration:none;
  border-bottom:0 !important;
  color:var(--grigio);
}
.ritorno a:hover{color:var(--rosso)}
.ritorno a.indietro{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:9px 16px 9px 13px;
  border-radius:6px;
  background:var(--velo);
  color:var(--almanacco-testo);
  font-weight:700;
}
.ritorno a.indietro::before{content:"\2190";font-size:15px;line-height:1}
.ritorno a.indietro:hover{background:var(--almanacco);color:#fff}

/* occhiello di sezione cliccabile */
.testo a.sezione{
  color:var(--rosso);
  text-decoration:none;
  border-bottom:0 !important;
}
.testo a.sezione:hover{border-bottom:1px solid var(--rosso) !important}

/* ---- casella del titolo di pagina ---- */
.insegna{
  background:var(--almanacco);
  color:#fff;
  border-radius:6px;
  padding:20px 24px 22px;
  margin:0 0 6px;
}
.insegna h2{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:clamp(19px,2.6vw,25px);
  font-weight:700;
  line-height:1.15;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:#fff;
}
.insegna p{
  margin:10px 0 0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:14.5px;
  line-height:1.5;
  color:rgba(255,255,255,.84);
}
.insegna + .testo{padding-top:26px}
.insegna + .elenco,
.insegna + .elencovideo{padding-top:26px}

/* ---- striscia di ritorno in cima ---- */
.ritorno.sopra{
  margin:30px 0 0;
  padding:0;
  border-top:0;
}
.ritorno.sopra + .insegna{margin-top:22px}
.ritorno.sopra + .testo{padding-top:22px}
