/* Ingombri dei prodotti commerciali, indipendenti dai vecchi segnaposto .ad.
   JS sceglie una misura che entra davvero. L'unica eccezione e' la prova
   esplicita del PNG 990x250 proporzionale su tablet, mai un iframe GAM. */
.advert-slot { min-width: 0; max-width: 100%; margin: 20px 0; text-align: center; clear: both; }
.advert-slot-label { color: #555; font: 11px/1.4 var(--nav); padding: 0 4px 6px; overflow-wrap: anywhere; }
.header-band .advert-slot-label { display: inline-block; color: #333; background: #fff; padding: 3px 6px; margin-bottom: 6px; }
.advert-creative { width: 300px; height: 250px; max-width: 100%; margin-inline: auto; }
/* Il riquadro segue la misura visualizzata. Il clipping contiene soltanto
   l'ingombro CSS non trasformato: l'intera creativita' scalata resta visibile. */
.advert-viewport { position: relative; max-width: 100%; margin-inline: auto; overflow: clip; }
.advert-viewport > .advert-creative { position: absolute; inset: 0 auto auto 0; margin: 0; max-width: none; transform-origin: top left; }
.advert-creative img { display: block; width: auto; max-width: none; height: auto; }
.advert-slot[data-advert-scaled] .advert-creative img { width: 100%; height: 100%; }
.advert-slot--compact .advert-creative, .advert-slot--leaderboard .advert-creative, .advert-slot--feature .advert-creative { height: 100px; }
.advert-slot--rail-small .advert-creative { width: 180px; height: 150px; }
.advert-slot[data-unavailable] { display: none; }
.advertising-footer:empty { display: none; }
.local-advertising-control { padding-block: 8px; font: 13px/1.4 var(--nav); color: #333; }
.local-advertising-control label { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.local-advertising-control output { display: block; }
.local-advertising-control details { margin-top: 6px; }
.local-advertising-control summary { cursor: pointer; }
.local-advertising-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-block: 8px; }
.local-advertising-actions button { font: inherit; padding: 4px 8px; cursor: pointer; }
.local-advertising-table-scroll { overflow-x: auto; max-width: 100%; max-height: 360px; }
.local-advertising-table { width: 100%; min-width: 950px; border-collapse: collapse; text-align: left; }
.local-advertising-table th, .local-advertising-table td { padding: 6px; border-bottom: 1px solid #ccc; vertical-align: top; overflow-wrap: anywhere; }
.local-advertising-table th { position: sticky; top: 0; background: #eee; white-space: nowrap; }
.local-advertising-table td:nth-child(3) { white-space: nowrap; }
.local-advertising-control textarea { box-sizing: border-box; width: 100%; font: 12px/1.4 monospace; }
.advert-anchor:empty { display: none; }
.home-page > .top-ad:has(.advert-slot) { display: block; }
.home-other > .advert-slot, .home-grid > .advert-slot, .video-grid > .advert-slot, .cartoon-grid > .advert-slot { grid-column: 1 / -1; }
.home-other > .advert-anchor { grid-column: 1 / -1; min-width: 0; }
/* Lasciare crescere il flusso evita sovrapposizioni con le righe nominate della home. */
.home-grid > .advert-slot[data-advert-position="pre-obituaries"] { grid-row: 4; }
.home-grid:has(> .advert-slot) > .home-obituaries { grid-row: 5; }
.news-sidebar > .advert-stack { min-width: 0; }
.advert-stack:empty { display: none; }
.news-sidebar > .advert-slot { grid-column: 1 / -1; }
.news-sidebar > .advert-stack--full { grid-column: 1 / -1; }
.advert-stack > .advert-slot:first-child { margin-top: 0; }
/* Due posizioni gia' esistenti prima della fascia regionale. Si affiancano
   solo se entrano due creativita' da 300px, senza ridurle per farle stare. */
.home-regional-adverts, .home-local-adverts { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 0 24px; min-width: 0; }
.home-regional-adverts { grid-column: 1 / -1; }
.home-local-adverts { grid-column: 2; grid-row: 4; }
.home-regional-adverts:empty, .home-local-adverts:empty { display: none; }
.home-primary:has(> .home-local-adverts > .advert-slot) > .home-local { grid-row: 5; }
@media (min-width: 1100px) {
    .advert-slot--skyscraper .advert-creative { width: 160px; height: 600px; }
    .advert-slot--leaderboard .advert-creative, .advert-slot--feature .advert-creative { width: 728px; height: 90px; }
    .advert-slot--opening .advert-creative, .advert-slot--footer .advert-creative { width: min(990px, 100%); }
    .home-primary:has(> .home-local-adverts > .advert-slot) > .home-editorials { grid-row: 2 / span 4; }
}
@media (min-width: 768px) and (max-width: 1099px) {
    /* A 768px i margini editoriali da 24px lascerebbero meno di 728px.
       Le fasce header usano margini piu' stretti: nessun taglio. */
    .header-leaderboard:has(> .advert-slot) { width: calc(100% - 16px); }
    .header-leaderboard .advert-creative { width: 728px; height: 90px; }
    .advert-slot--opening .advert-creative, .advert-slot--footer .advert-creative { width: 100%; max-width: 990px; height: auto; aspect-ratio: 990 / 250; }
    .home-right > .advert-anchor { min-width: 0; }
    .home-local-adverts { grid-column: 1; }
    .home-primary:has(> .home-local-adverts > .advert-slot) > .home-editorials { grid-row: 6; }
}
@media (max-width: 1099px) {
    /* Protezione anche prima dell'avvio JS; il client esclude lo slot da GAM. */
    .home-page .advert-slot--rail-small { display: none; }
}
@media (min-width: 768px) and (max-width: 1099px) and (orientation: portrait) {
    .home-grid > .advert-slot[data-advert-position="pre-obituaries"] { grid-row: 8; }
    .home-grid:has(> .advert-slot) > .home-obituaries { grid-row: 9; }
    /* La primary e' display:contents nel tablet verticale: la nuova riga
       appartiene quindi alla griglia esterna, prima della fascia Altre notizie. */
    .home-grid:has(.home-local-adverts > .advert-slot) > .home-right { grid-row: 2 / span 5; }
    .home-grid:has(.home-local-adverts > .advert-slot) > .home-other { grid-row: 7; }
    .home-grid:has(.home-local-adverts > .advert-slot) > .home-notebook { grid-row: 8; }
    .home-grid:has(.home-local-adverts > .advert-slot) > [data-advert-position="pre-obituaries"] { grid-row: 9; }
    .home-grid:has(.home-local-adverts > .advert-slot) > .home-obituaries { grid-row: 10; }
}
@media (max-width: 767px) {
    /* Un telefono da 320px lascia 288px al testo, ma il formato minimo e' 300px. */
    .advert-slot { width: calc(100% + 32px); max-width: none; margin-inline: -16px; }
    .home-grid .advert-slot { width: calc(100% + 32px); max-width: none; }
    /* Il contenitore scompare dal layout flex mobile: i due nodi originali
       si alternano alle sezioni, invece di formare una coppia consecutiva. */
    .home-regional-adverts, .home-local-adverts { display: contents; }
    .home-regional-adverts > [data-advert-position="regional-before-1"] { order: 4; }
    .home-local-adverts > [data-advert-position="local-before-1"] { order: 4; }
    .home-cartoon { order: 5; }
    .home-regional-adverts > [data-advert-position="regional-before-2"] { order: 6; }
    .home-local { order: 7; }
    .home-local-adverts > [data-advert-position="local-before-2"] { order: 8; }
    .home-editorials { order: 9; }
    /* Un solo nodo per slot: i due formati della prima colonna si separano
       nel flusso mobile, senza accodarsi alle quattro L3 gia' ricollocate. */
    .home-editorials { display: contents; }
    .home-editorial-content { order: 9; width: 100%; min-width: 0; }
    .home-editorials > .advert-slot--skyscraper { order: 3; }
    /* Il piccolo formato e' escluso sotto 1100px; after-top-news precede
       Top news, mentre after-latest segue la sesta voce di Altre notizie. */
    /* Senza vignetta RET-2 non deve finire a contatto con RET-5: lo separa
       il box editoriale/Edizioni locali, prima delle Opinioni. */
    .home-grid:not(:has(.home-cartoon)) .home-local-adverts > [data-advert-position="local-before-1"] { order: 9; }
    .home-opinions { order: 10; }
    .home-other { order: 11; }
    .home-catalan { order: 12; }
    .home-top { order: 13; }
    .home-notebook { order: 14; }
    .home-grid > .advert-slot[data-advert-position="pre-obituaries"] { order: 15; }
    .home-grid:has(> .advert-slot) > .home-obituaries { order: 16; }
    .home-obituaries { order: 16; }
    .advert-creative { max-width: none; }
}
@media print { .advert-slot { display: none !important; } }
