/* ═══════════════ single-news.css — ESCLUSIVO del single "news" (gz_news) ═══════════════
 * SCHELETRO strutturale (1 lug 2026, modello B). Dipende da single-base.css (cornice hero
 * condivisa: .article-hero-card, ecc.).
 *
 * Stila SOLO il corpo-prosa .news-body: la news è satira di NOTIZIA a CORPO LIBERO
 * (the_content dell'editor), a differenza di pollata/rumor che sono box ACF. base.css
 * azzera i margini (* { margin:0 }) → qui il ritmo di lettura minimo, dentro la colonna
 * .article-container (max 960px). Colori/token dal sistema (--cat-color = sezione
 * sull'archivio, default verde sul single non-tassonomico).
 *
 * ⚠️ Confine di voce: i BOX satirici veri della news (l'equivalente di traduzioni/
 * verdetto/poll della pollata) e il loro CSS si definiscono in sessione VOCE e
 * cresceranno in QUESTO file. Oggi = solo prosa. */

.news-body { margin-top: 28px; color: var(--text-secondary); }
.news-body > * + * { margin-top: 1.15em; }                 /* ritmo verticale (base.css azzera i margini dei figli) */
.news-body p { line-height: 1.7; font-size: 1.1rem; }   /* = .article-content della pollata (allineamento) */
.news-body h2 { color: var(--text-primary); font-size: 1.4rem; line-height: 1.3; margin-top: 1.6em; }
.news-body h3 { color: var(--text-primary); font-size: 1.15rem; line-height: 1.3; margin-top: 1.4em; }
.news-body a { color: var(--cat-color); text-decoration: underline; text-underline-offset: 2px; transition: text-shadow 0.2s ease; }
.news-body a:hover { text-shadow: 0 0 10px var(--cat-glow); }
.news-body ul, .news-body ol { margin-left: 1.25em; }
.news-body li + li { margin-top: 0.4em; }
.news-body strong { color: var(--text-primary); }
.news-body img { max-width: 100%; height: auto; border-radius: var(--radius-sm); }
.news-body blockquote {
	border-left: 3px solid var(--cat-color); padding-left: 16px;
	color: var(--text-muted-strong); font-style: italic;
}

/* ── «Il fatto vero» — ancoraggio al fatto verificato ──
   Stile CALMO/sobrio DI PROPOSITO: niente neon --cat-color, accento grigio. In mezzo
   alla satira segnala "questa è la parte vera" → parodia palese (il lettore separa reale
   da esagerato). Deadpan visivo. */
.fatto-vero {
	margin-top: 32px; padding: 20px 22px;
	background: var(--surface); border: 1px solid var(--border);
	border-left: 3px solid var(--text-secondary);   /* accento SOBRIO, non neon */
	border-radius: 0 var(--radius-md) var(--radius-md) 0;
}
.fatto-vero-label {
	display: inline-flex; align-items: center; gap: 6px; margin-bottom: 10px;
	font-family: 'Space Mono', monospace; font-size: 0.7rem; font-weight: 700;
	text-transform: uppercase; letter-spacing: 1px; color: var(--text-secondary);
}
.fatto-vero-label .icon-svg svg { width: 14px; height: 14px; }
.fatto-vero-testo { color: var(--text-primary); line-height: 1.65; font-size: 0.98rem; }
.fatto-vero-testo > * + * { margin-top: 0.8em; }
.fatto-vero-fonte {
	display: inline-block; margin-top: 12px;
	font-family: 'Space Mono', monospace; font-size: 0.72rem; color: var(--text-muted-strong);
	text-decoration: none;
}
a.fatto-vero-fonte:hover { color: var(--cat-color); }
/* Rimando all'articolo GEMELLO di Tech-Zone (la "versione seria" della stessa storia) — cross-promo
   Double Agent, mostrato solo se il campo ACF tz_url è compilato (vuoto finché i siti non sono live).
   Sta sotto la fonte: NON è una fonte, è il ponte all'altro sito. Colore-categoria per distinguerlo. */
a.fatto-vero-tz {
	display: block; margin-top: 8px;
	font-family: 'Space Mono', monospace; font-size: 0.72rem; font-weight: 700;
	color: var(--cat-color); text-decoration: none; transition: text-shadow 0.2s ease;
}
a.fatto-vero-tz:hover { text-shadow: 0 0 10px var(--cat-glow); }

/* ── Punti (quick-facts) + Traduzioni (decode) ────────────────────────────────
   Classi COPIATE da single-pollata.css (.points-box, .point-item, .translation): identiche,
   ma single-pollata.css NON è caricato sul single news → servono qui. Se restano identiche
   sono candidate a promozione in single-base.css (dedup, "un fatto una casa"). NB: colori
   punti = base (secondary/primary/yellow); niente override per-sezione (il single news non è
   term-colored) e niente animazione fadeInUp (resta esclusiva della pollata). */
.points-box { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 28px 0 36px; }
.point-item {
	display: flex; flex-wrap: wrap; align-items: center; column-gap: 8px; row-gap: 4px;
	border-left: 3px solid var(--pt);
	background: color-mix(in srgb, var(--pt) 5%, transparent);
	border-radius: 0; padding: 12px 16px; font-family: 'Space Mono', monospace;
}
.point-item:nth-child(1) { --pt: var(--text-secondary); }
.point-item:nth-child(2) { --pt: var(--primary); }
.point-item:nth-child(3) { --pt: var(--yellow); }
.point-label { order: 1; font-size: 0.66rem; color: var(--pt); text-transform: uppercase; letter-spacing: 0.5px; }
.point-icon { order: 2; margin-left: auto; display: inline-flex; align-items: center; }
.point-icon .icon-svg { color: var(--pt); }
.point-icon .icon-svg svg { width: 18px; height: 18px; }
.point-value { order: 3; flex-basis: 100%; font-weight: 700; color: #fff; font-size: 1.1rem; margin-top: 2px; }
.point-comment { order: 4; flex-basis: 100%; font-size: 0.8rem; color: var(--text-muted); font-style: italic; line-height: 1.3; }

.news-traduzioni { margin: 24px 0; }
.trad-claim { color: var(--text-primary); font-weight: 600; margin-bottom: 4px; }
.translation {
	background: color-mix(in srgb, var(--cat-color) 4%, transparent);
	border-left: 3px solid var(--cat-color); border-radius: 0;
	padding: 8px 14px 8px 16px; margin: 8px 0 24px 0;
	font-size: 0.95rem; color: var(--cat-color); font-family: 'Space Mono', monospace; position: relative;
}
.translation .icon-svg { vertical-align: -2px; margin-right: 4px; }
.translation .icon-svg svg { width: 15px; height: 15px; }

/* ── "La Mossa Anti-Pollo" — allineamento 4 lug (parità pollata/rumor): callout giallo + mascot
   gallina a sx, spigoli vivi. Scopato a .single-gz_news; base .anti-pollo-box, bottone spento
   --off e .anti-pollo-disclosure = single-base.css (già caricato: dipendenza di gz-single-news).
   Giallo brand-wide ("non fate i polli"), non il colore-categoria. ── */
.single-gz_news .anti-pollo-box {
	display: flex; align-items: center; gap: 26px; text-align: left;
	max-width: none; margin: 88px auto 0;                              /* de-box → stacco a sola aria (come pollata/rumor) + full-width */
	background: color-mix(in srgb, var(--yellow) 5%, transparent);     /* velo giallo tenue */
	border: 0; border-left: 3px solid var(--yellow); border-radius: 0; /* barra-accento + spigoli vivi */
	padding: 22px 26px; box-shadow: none;
}
.single-gz_news .anti-pollo-box::before { display: none; }   /* via il gradiente del box pieno */
.single-gz_news .anti-pollo-box:hover { transform: none; }   /* niente lift: callout statico */
.single-gz_news .anti-pollo-mascot {
	height: 96px; width: auto; flex-shrink: 0; align-self: center;
	filter: drop-shadow(0 0 5px var(--yellow-glow)) drop-shadow(0 0 16px var(--yellow-glow)); /* glow giallo */
}
.single-gz_news .anti-pollo-body { text-align: left; }
.single-gz_news .anti-pollo-title { margin-bottom: 8px; }    /* compatta nel callout */
.single-gz_news .anti-pollo-box p { margin-bottom: 16px; }
.single-gz_news .anti-pollo-cta { animation: none; }         /* via il pulse su callout raw */

/* ── Poll — MODELLO NUOVO (9 lug): la news adotta il poll de-box di rumor/pollata (prima era
   rimasta al modello base a colonne, l'unico single ancora "vecchio"). Copiato dal rumor ("si
   copia, non si linka"): barra-accento a sx, etichetta a sx, icona arco-del-pollo a dx (SVG 26px,
   colore-categoria come la pollata), % rivelata al voto. Contatore "voti" tolto (parità, 9 lug).
   FIX icona a dx: `align-content: center` → l'icona sta sempre al centro verticale del riquadro,
   a prescindere da quante righe ha l'etichetta (prima il default `stretch` la spostava). */
.single-gz_news .poll-box { background: transparent; border: 0; border-radius: 0; padding: 0; margin: 56px 0; }
.single-gz_news .poll-header, .single-gz_news .poll-question { padding-left: 19px; }
.single-gz_news .poll-question { margin-bottom: 28px; font-size: 1.25rem; }
.single-gz_news .poll-options { gap: 14px; margin-bottom: 16px; }
.single-gz_news .poll-option {
	flex-direction: row; flex-wrap: wrap; align-items: center; align-content: center; text-align: left;
	column-gap: 8px; row-gap: 0;
	background: color-mix(in srgb, var(--cat-color) 4%, transparent);
	border: 0; border-left: 3px solid var(--cat-color); border-radius: 0;
	padding: 12px 16px;
}
.single-gz_news .poll-option:hover { background: color-mix(in srgb, var(--cat-color) 9%, transparent); }
.single-gz_news .poll-label { order: 1; font-size: 0.66rem; text-transform: uppercase; letter-spacing: 0.5px; color: var(--cat-color); }
.single-gz_news .poll-emoji { order: 2; margin-left: auto; display: inline-flex; align-items: center; font-size: 1.3rem; color: var(--cat-color); }
.single-gz_news .poll-emoji .icon-svg svg { width: 26px; height: 26px; }
.single-gz_news .poll-percent { order: 3; flex-basis: 100%; font-size: 1.15rem; max-height: 0; overflow: hidden; opacity: 0; margin-top: 0; transition: max-height 0.35s ease, opacity 0.3s ease, margin-top 0.35s ease; }
.single-gz_news .poll-box.revealed .poll-percent { max-height: 2em; opacity: 1; margin-top: 4px; }
.single-gz_news .poll-option.voted { background: color-mix(in srgb, var(--cat-color) 16%, transparent); color: inherit; box-shadow: 0 0 18px var(--cat-glow); }
.single-gz_news .poll-option.voted .poll-label,
.single-gz_news .poll-option.voted .poll-percent { color: var(--cat-color); }
/* Fix icona v2 (9 lug): `align-content` non è bastato a video. La griglia rende i riquadri di pari
   altezza (stretch) → ancoro l'icona in ASSOLUTO al centro verticale del box, identica su tutte le
   opzioni a prescindere dalle righe dell'etichetta. Hover: preservo translate + scale. */
.single-gz_news .poll-option { position: relative; }
.single-gz_news .poll-emoji { position: absolute; top: 50%; right: 16px; transform: translateY(-50%); margin-left: 0; }
.single-gz_news .poll-option:hover .poll-emoji { transform: translateY(-50%) scale(1.1); }
.single-gz_news .poll-label { padding-right: 34px; }   /* spazio a dx: il testo non finisce sotto l'icona assoluta */

/* Correlati "read next" — wrapper. La lista .correlati-list/-row e .sidebar-title sono in
   single-base, ma lì .correlati-list è VERTICALE (flex column): la pollata la sovrascrive a
   griglia 3-col nel suo CSS esclusivo, quindi qui serve lo stesso override (dedup-candidate). */
.correlati-readnext { margin-top: 40px; }
.correlati-readnext .correlati-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }

/* Responsive: punti e correlati in colonna singola su mobile (come la pollata). */
@media (max-width: 640px) {
	.points-box { grid-template-columns: 1fr; gap: 20px; }
	.correlati-readnext .correlati-list { grid-template-columns: 1fr; }
}

/* ── #4 Fade-in a cascata (come la pollata) — points-box + corpo + traduzioni entrano
   scivolando dall'alto, in sequenza. Keyframe fadeInUp = single-base.css (condiviso).
   opacity:0 + forwards: sotto prefers-reduced-motion (base.css spegne l'anim a 0.01ms) il
   blocco resta comunque a opacity 1 → contenuto SEMPRE visibile (nessun blocco invisibile).
   fatto-vero/poll/correlati NON animati (come le sezioni basse della pollata). */
.points-box,
.news-body > *,
.news-traduzioni > * { animation: fadeInUp 0.6s ease forwards; opacity: 0; }
.points-box { animation-delay: 0.10s; }
.news-body > *:nth-child(1) { animation-delay: 0.20s; }
.news-body > *:nth-child(2) { animation-delay: 0.26s; }
.news-body > *:nth-child(3) { animation-delay: 0.32s; }
.news-body > *:nth-child(4) { animation-delay: 0.38s; }
.news-body > *:nth-child(5) { animation-delay: 0.44s; }
.news-body > *:nth-child(n+6) { animation-delay: 0.50s; }
.news-traduzioni > *:nth-child(1) { animation-delay: 0.34s; }
.news-traduzioni > *:nth-child(2) { animation-delay: 0.40s; }
.news-traduzioni > *:nth-child(3) { animation-delay: 0.46s; }
.news-traduzioni > *:nth-child(n+4) { animation-delay: 0.52s; }