/* Regole del tema per le parti che i mockup non coprivano: link di salto,
   liste articoli e corpo dell'articolo. Usa i token del design system,
   quindi resta coerente col resto del sito. Caricato sempre, per ultimo. */

.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.screen-reader-text:focus{position:fixed;top:12px;left:12px;z-index:9999;width:auto;height:auto;margin:0;clip:auto;white-space:normal;padding:12px 18px;border-radius:var(--pill);background:var(--primary);color:var(--on-primary);font-weight:700;box-shadow:var(--sh-float)}

.post-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:8px}
@media (max-width:820px){.post-list{grid-template-columns:minmax(0,1fr)}}

.post-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r-lg);padding:26px 26px 22px;box-shadow:var(--sh-card)}
.post-card h2{margin:0 0 6px}
.post-card h2 a{color:var(--ink);text-decoration:none}
.post-card h2 a:hover{color:var(--primary)}
.post-card p{margin:0 0 14px}

.meta{font-size:12.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}

.entry{max-width:72ch}
.entry h2,.entry h3{margin-top:1.6em}
.entry p,.entry ul,.entry ol{margin-bottom:1.1em}
.entry a{color:var(--primary)}
.entry img{max-width:100%;height:auto;border-radius:var(--r-md)}
.entry blockquote{margin:1.4em 0;padding:2px 0 2px 20px;border-left:3px solid var(--primary);color:var(--muted)}

/* Stacco fra fondo scuro e superficie chiara.
   Nei mockup lo stacco e' <div class="zone zone-fade fade-hero" aria-hidden="true">
   e due regole del design system dipendono da quell'attributo:
     .zone-fade[aria-hidden]           { height:120px !important }
     .zone-fade.fade-hero[aria-hidden] { background:#140023 }
   Elementor free non puo' aggiungere attributi personalizzati ai contenitori
   (e' una funzione Pro), quindi qui le replichiamo sulla sola classe.
   Il min-height e' innocuo sui due .zone-fade che invece hanno contenuto:
   quel contenuto e' molto piu' alto di 120px. */
.zone-fade{min-height:120px}
.zone-fade.fade-hero{background:#140023}