/* Guide e blog: indice degli articoli. Il resto viene da site.css, prodotti.css e lavora.css. */
.guide-testata { padding-top: 140px !important; }
.guide-testata .segnale { max-width: 13em; font-size: clamp(38px, 4.8vw, 70px); }
.guide-testata .cerca { margin-top: 26px; max-width: 560px; }
.filtri { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.filtro {
  cursor: pointer; height: 36px; padding: 0 15px; border-radius: 100px;
  background: var(--pillola); border: 1px solid var(--bordo); color: var(--acciaio);
  font: 400 13px/1 var(--sans); transition: color .2s ease, border-color .2s ease, background .2s ease;
}
.filtro:hover { color: var(--testo); border-color: var(--bordo-forte); }
.filtro.attivo { color: #fff; border-color: var(--blu); background: rgba(63, 169, 255, 0.14); }
#indice { padding-top: 60px !important; }
.categoria-blog { margin-bottom: 56px; }
.categoria-blog.nascosta, .articolo.nascosta { display: none; }
.cat-titolo { margin: 0 0 18px; color: var(--testo); font: 600 clamp(24px, 2.6vw, 32px)/1.2 var(--display); letter-spacing: -0.02em; }
.cat-titolo small { margin-left: 10px; font: 400 12px/1 var(--mono); letter-spacing: 1px; text-transform: uppercase; color: var(--tenue); }
.articoli { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.articolo { padding: 22px 22px 20px; display: flex; flex-direction: column; min-height: 170px; }
.articolo .tipo { margin-bottom: 12px; font: 400 11px/1 var(--mono); letter-spacing: 1.2px; text-transform: uppercase; color: var(--blu); }
.articolo h3 { margin: 0 0 16px; color: var(--testo); font: 600 18px/1.35 var(--display); letter-spacing: -0.01em; }
.articolo .in-arrivo { margin-top: auto; font: 400 11px/1 var(--mono); letter-spacing: 1.2px; text-transform: uppercase; color: var(--tenue); }
@media (max-width: 960px) { .articoli { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .articoli { grid-template-columns: 1fr; } }

/* Guide già pubblicate: tutta la scheda porta all'articolo */
.articolo.pronto { position: relative; transition: border-color .2s ease, background .2s ease; }
.articolo.pronto:hover { border-color: var(--bordo-forte); background: rgba(63, 169, 255, 0.06); }
.articolo.pronto h3 a { color: inherit; text-decoration: none; }
.articolo.pronto h3 a::after { content: ''; position: absolute; inset: 0; border-radius: inherit; }
.articolo.pronto h3 a:focus-visible { outline: none; }
.articolo.pronto:focus-within { outline: 2px solid var(--blu); outline-offset: 2px; }
.articolo .leggi { margin-top: auto; font: 500 11px/1 var(--mono); letter-spacing: 1.2px; text-transform: uppercase; color: var(--blu); }

/* Pagina della singola guida */
.guida-testata { padding-top: 140px !important; }
.briciole { display: flex; flex-wrap: wrap; gap: 8px 14px; margin-bottom: 22px; font: 400 12px/1.4 var(--mono); letter-spacing: 1px; text-transform: uppercase; color: var(--tenue); }
.briciole a { color: var(--acciaio); text-decoration: none; }
.briciole a:hover { color: var(--blu); }
.guida-testata .segnale { max-width: 18em; font-size: clamp(34px, 4.4vw, 60px); margin-bottom: 22px; }
.articolo-immagine { margin: 8px 0 44px; border-radius: 18px; overflow: hidden; border: 1px solid var(--bordo); }
.articolo-immagine img { display: block; width: 100%; height: auto; }
.testo-articolo { font-size: 17px; line-height: 1.75; }
.testo-articolo h2 { font-size: clamp(24px, 2.4vw, 30px); margin-top: 56px; }
.testo-articolo h3 { font-size: 20px; margin-top: 36px; }
.testo-articolo img { max-width: 100%; height: auto; border-radius: 14px; }
.testo-articolo figure { margin: 32px 0; }
.testo-articolo figcaption { margin-top: 10px; font-size: 14px; color: var(--tenue); }
.testo-articolo blockquote { margin: 28px 0; padding: 4px 0 4px 22px; border-left: 2px solid var(--blu); color: var(--testo); }
.guida-chiamata { margin: 64px 0 0; padding: clamp(26px, 4vw, 40px); max-width: 720px; }
.guida-chiamata h2 { margin: 0 0 10px; color: var(--testo); font: 600 clamp(22px, 2.4vw, 28px)/1.25 var(--display); letter-spacing: -0.01em; }
.guida-chiamata p { margin: 0 0 22px; color: var(--acciaio); line-height: 1.6; }
.altre-guide { margin-top: 80px; padding-bottom: 40px; }

/* Pagina non trovata */
.non-trovata { min-height: 70vh; padding-bottom: 96px !important; }
.non-trovata .intro { margin-bottom: 30px; }

/* Blocco "Guide su questo tema" nelle pagine prodotto, home e Contatti (inserito dal plugin) */
.guide-pagina { margin-top: 0; padding-bottom: 0; }
.guide-pagina .cat-titolo { margin-bottom: 22px; }
.tutte-le-guide { margin: 24px 0 0; }