/* ==========================================================
   NCN 2026 — CSS PULITO
   File consolidato dalle regole effettivamente in uso.
   Foglio principale consolidato: regole obsolete rimosse.
   ========================================================== */


/* ==========================================================
   AREATOP
   ========================================================== */

/* MODIFICA: variabili generali, larghezza del sito, colori base e scala desktop. */
:root {
    --ncn-max: 1400px;
    --ncn-gap: 6px;
    --ncn-blue: #087ed0;
    --ncn-blue-dark: #002c52;
    --ncn-blue-deep: #001b35;
    --ncn-text: #0b2740;
    --ncn-white: #ffffff;
    --ncn-shadow: 0 14px 40px rgba(0, 25, 55, .20);
    --ncn-desktop-scale: 0.85;
}

/* MODIFICA: comportamento generale del box model. */
* {
    box-sizing: border-box;
}

/* MODIFICA: scorrimento morbido della pagina. */
html {
    scroll-behavior: smooth;
}

/* MODIFICA: sfondo esterno, distanza superiore e font generale del sito. */
body {
    margin: 0;
    padding-top: 35px;
    color: var(--ncn-text);
    font-family: Arial, Helvetica, sans-serif;
    background-color: #2C2B51;
    background-image: url("../assets/img/sfondo-ncn-2026.jpg");
    background-repeat: no-repeat;
    background-position: center top;
    background-attachment: fixed;
    background-size: 100% auto;
}

/* MODIFICA: comportamento generale delle immagini. */
img {
    display: block;
    max-width: 100%;
}

/* MODIFICA: aspetto generale dei link. */
a {
    color: inherit;
    text-decoration: none;
}

/* MODIFICA: gabbia principale del sito e ombra esterna. */
.ncn-page {
    width: min(100%, var(--ncn-max));
    margin: 0 auto;
    min-height: 100vh;
    background: #fff;
    box-shadow: 0 0 30px rgba(0, 14, 38, .32);
}

/* MODIFICA: larghezza neutra dei contenitori principali. */
.ncn-content,
.ncn-section {
    width: 100%;
}

/* MODIFICA: contenitore grafico dell'AreaTop. */
.ncn-top {
    position: relative;
    display: block;
    width: 100%;
    overflow: hidden;
    line-height: 0;
    background: #168fc9;
    isolation: isolate;
}

/* MODIFICA: area cliccabile dell'AreaTop. */
.ncn-top__link {
    position: relative;
    display: block;
    width: 100%;
    line-height: 0;
    overflow: hidden;
}

/* MODIFICA: immagine di sfondo dell'AreaTop. */
.ncn-top__image {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
}

/* MODIFICA: posizione, dimensione e animazione del logo NCN nell'AreaTop. */
.ncn-top__logo {
    position: absolute;
    z-index: 4;
    left: 6%;
    top: 17.0%;
    width: 31.93%;
    max-width: none;
    height: auto;
    margin: 0;
    padding: 0;
    pointer-events: none;
    user-select: none;
    opacity: 0;
    transform-origin: 42% 50%;
    transform: translate3d(0, 5px, 0) scale(.965);
    filter:
        blur(4px)
        drop-shadow(0 3px 3px rgba(0, 25, 58, .22))
        drop-shadow(0 9px 19px rgba(0, 147, 230, .14));
    will-change: opacity, transform, filter;
    animation: ncnLogoReveal 10s cubic-bezier(.18, .76, .22, 1) .28s forwards;
}

/* MODIFICA: riflesso luminoso che attraversa una volta l'AreaTop. */
.ncn-top__shine {
    position: absolute;
    z-index: 5;
    top: -28%;
    left: -32%;
    width: 18%;
    height: 160%;
    pointer-events: none;
    opacity: 0;
    transform: skewX(-18deg);
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, .04) 28%,
        rgba(255, 255, 255, .24) 50%,
        rgba(255, 255, 255, .04) 72%,
        rgba(255, 255, 255, 0) 100%
    );
    filter: blur(5px);
    mix-blend-mode: screen;
    animation: ncnTopShinePass 1.30s ease-in-out 1.55s forwards;
}

/* MODIFICA: onda energetica principale sotto il logo. */
.ncn-top__energy-wave {
    position: absolute;
    z-index: 3;
    left: 7.3%;
    top: 63%;
    width: 30%;
    height: 18%;
    pointer-events: none;
    opacity: 0;
    border-radius: 50%;
    border: 2px solid rgba(84, 218, 255, .58);
    background:
        radial-gradient(
            ellipse at center,
            rgba(63, 210, 255, .18) 0%,
            rgba(34, 169, 255, .10) 34%,
            rgba(17, 110, 220, .04) 58%,
            rgba(0, 80, 190, 0) 74%
        );
    box-shadow:
        0 0 10px rgba(74, 220, 255, .28),
        0 0 22px rgba(0, 166, 255, .20),
        inset 0 0 16px rgba(140, 235, 255, .12);
    filter: blur(.25px);
    transform-origin: center center;
    animation: ncnEnergyWave 4.8s ease-out 1.05s infinite;
}

/* MODIFICA: seconda onda energetica, più morbida e ritardata. */
.ncn-top__energy-wave--soft {
    z-index: 2;
    left: 8.2%;
    top: 64%;
    width: 28%;
    height: 14%;
    border-width: 1px;
    border-color: rgba(110, 224, 255, .28);
    filter: blur(2px);
    box-shadow:
        0 0 18px rgba(0, 176, 255, .16),
        0 0 34px rgba(0, 116, 255, .10);
    animation-delay: 2.55s;
    animation-duration: 5.4s;
}

/* MODIFICA: fotogrammi dell'entrata animata del logo. */
@keyframes ncnLogoReveal {
    0% {
        opacity: 0;
        transform: translate3d(0, 5px, 0) scale(.965);
        filter:
            blur(4px)
            drop-shadow(0 2px 2px rgba(0, 25, 58, .16))
            drop-shadow(0 5px 12px rgba(0, 147, 230, .08));
    }

    58% {
        opacity: .98;
        transform: translate3d(0, 0, 0) scale(1.008);
        filter:
            blur(0)
            drop-shadow(0 3px 3px rgba(0, 25, 58, .24))
            drop-shadow(0 10px 22px rgba(0, 160, 240, .18));
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
        filter:
            blur(0)
            drop-shadow(0 3px 3px rgba(0, 25, 58, .22))
            drop-shadow(0 8px 17px rgba(0, 147, 230, .13));
    }
}

/* MODIFICA: percorso del riflesso luminoso dell'AreaTop. */
@keyframes ncnTopShinePass {
    0%   { left: -32%; opacity: 0; }
    16%  { opacity: .42; }
    72%  { opacity: .30; }
    100% { left: 118%; opacity: 0; }
}

/* MODIFICA: espansione e dissolvenza delle onde energetiche. */
@keyframes ncnEnergyWave {
    0% {
        opacity: 0;
        transform: scaleX(.58) scaleY(.34);
    }

    10% {
        opacity: .42;
    }

    34% {
        opacity: .26;
        transform: scaleX(1.08) scaleY(.82);
    }

    60% {
        opacity: .08;
        transform: scaleX(1.48) scaleY(1.22);
    }

    72%,
    100% {
        opacity: 0;
        transform: scaleX(1.72) scaleY(1.42);
    }
}


/* ==========================================================
   MENU
   ========================================================== */

/* MODIFICA: struttura orizzontale e proporzioni delle voci del menu grafico. */
.ncn-menu-grafico {
    width: 100%;
    display: grid;
    grid-template-columns: 25fr repeat(7, 184fr) 87fr;
    line-height: 0;
    overflow: hidden;
    background: #2d4e87;
}

/* MODIFICA: comportamento dei singoli pulsanti del menu. */
.ncn-menu-grafico__start,
.ncn-menu-grafico__item {
    position: relative;
    display: block;
    min-width: 0;
    line-height: 0;
}

/* MODIFICA: dimensione delle immagini normali del menu. */
.ncn-menu-grafico__start img,
.ncn-menu-grafico__item img {
    display: block;
    width: 100%;
    height: auto;
}

/* MODIFICA: immagine hover sovrapposta alle voci del menu. */
.ncn-menu-grafico__item .menu-img--hover {
    position: absolute;
    inset: 0;
    opacity: 0;
    pointer-events: none;
    transition: opacity .14s ease;
}

/* MODIFICA: comparsa dell'immagine chiara al passaggio del mouse o da tastiera. */
.ncn-menu-grafico__item:hover .menu-img--hover,
.ncn-menu-grafico__item:focus-visible .menu-img--hover {
    opacity: 1;
}

/* MODIFICA: bordo di accessibilità quando una voce menu riceve il focus. */
.ncn-menu-grafico__item:focus-visible {
    outline: 2px solid #fff;
    outline-offset: -2px;
}


/* ==========================================================
   MAIN BANNER
   ========================================================== */

/* MODIFICA: sfondo e distanza di 35px dell'area che contiene Main Banner + Hero. */
.ncn-page .primo-piano {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    min-height: 0;
    aspect-ratio: auto;
    margin: 0;
    padding: 35px;
    overflow: visible;
    background-image: url("../assets/img/sfondo-primo-piano.png");
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 100% 100%;
}

/* MODIFICA: contenitore del Main Banner orizzontale sopra l'Hero. */
.ncn-page .primo-piano__banner {
    position: relative;
    display: block;
    width: 100%;
    max-width: none;
    height: auto;
    min-height: 0;
    margin: 0;
    padding: 0;
    overflow: visible;
    line-height: 0;
}

/* MODIFICA: area cliccabile del Main Banner superiore. */
.ncn-page .primo-piano__banner-link {
    display: block;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    line-height: 0;
}

/* MODIFICA: immagine del Main Banner superiore. */
.ncn-page .primo-piano__banner-image,
.ncn-page .primo-piano__banner img {
    display: block;
    width: 100%;
    max-width: none;
    height: auto;
    margin: 0;
    padding: 0;
    border: 0;
}

/* MODIFICA: contenitore del Main Banner orizzontale sotto la Copertina. */
.ncn-page .center-box__banner {
    display: block;
    width: 100%;
    max-width: none;
    height: auto;
    margin: 0;
    padding: 0;
    overflow: visible;
    border: 0;
    background: transparent;
    line-height: 0;
}

/* MODIFICA: area cliccabile e immagine del Main Banner sotto la Copertina. */
.ncn-page .center-box__banner a,
.ncn-page .center-box__banner-image {
    display: block;
    width: 100%;
    max-width: none;
    height: auto;
    margin: 0;
    padding: 0;
    border: 0;
    line-height: 0;
}


/* ==========================================================
   HERO
   ========================================================== */

/* MODIFICA: dimensione 3:2, bordi bianchi e contenitore della notizia Hero. */
.ncn-page .primo-piano .hero {
    position: relative;
    display: block;
    width: 100%;
    max-width: none;
    height: auto;
    min-height: 0;
    aspect-ratio: 3 / 2;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border-left: 6px solid #fff;
    border-right: 6px solid #fff;
    border-bottom: 6px solid #fff;
    border-top: 0;
    background: #071d31;
    box-shadow:
        0 12px 30px rgba(0, 20, 45, .32),
        0 0 0 1px rgba(0, 68, 112, .08);
}

/* MODIFICA: posizione e transizione della singola slide Hero. */
.ncn-page .hero-slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    visibility: hidden;
    transition: opacity .52s ease;
}

/* MODIFICA: rende visibile la notizia Hero attiva. */
.ncn-page .hero-slide.is-active {
    z-index: 1;
    opacity: 1;
    visibility: visible;
}

/* MODIFICA: area cliccabile e foto dell'Hero. */
.ncn-page .hero-slide__link,
.ncn-page .hero-slide__image {
    display: block;
    width: 100%;
    height: 100%;
}

/* MODIFICA: taglio e posizione della foto Hero. */
.ncn-page .hero-slide__image {
    object-fit: cover;
    object-position: center;
    transform: scale(1.001);
}

/* MODIFICA: sfumatura scura e posizione verticale dei testi Hero. */
.hero-slide__shade {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 0 6.2% 5.2%;
    color: #fff;
    background:
        linear-gradient(
            180deg,
            rgba(0, 36, 72, 0) 0%,
            rgba(0, 36, 72, 0) 35%,
            rgba(0, 36, 72, .14) 47%,
            rgba(0, 36, 72, .58) 63%,
            rgba(0, 36, 72, .90) 79%,
            #002448 100%
        );
    pointer-events: none;
}

/* MODIFICA: categoria azzurra nell'Hero. */
.hero-slide__category {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    margin: 0 0 15px;
    padding: 8px 14px 7px;
    color: #fff;
    background: linear-gradient(180deg, #009fe8 0%, #007bc0 100%);
    border: 1px solid rgba(255, 255, 255, .78);
    border-radius: 3px;
    box-shadow:
        0 3px 9px rgba(0, 24, 45, .32),
        inset 0 1px 0 rgba(255, 255, 255, .22);
    font-family: Arial, Helvetica, sans-serif;
    font-size: clamp(11px, .92vw, 16px);
    line-height: 1;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .075em;
}

/* MODIFICA: titolo principale Hero. */
.hero-slide__title {
    width: 100%;
    margin: 0 0 12px;
    color: #fff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 55px;
    line-height: 1.2;
    font-weight: 900;
    letter-spacing: -.035em;
    text-wrap: balance;
    text-shadow:
        0 3px 2px rgba(0, 0, 0, .78),
        0 7px 15px rgba(0, 0, 0, .48);
}

/* MODIFICA: sottotitolo azzurro Hero. */
.hero-slide__subtitle {
    width: 88%;
    margin: 0;
    color: #36B2EC;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 30px;
    letter-spacing: -.035em;
    line-height: 1.28;
    font-weight: 700;
    text-shadow:
        0 2px 2px rgba(0, 0, 0, .82),
        0 4px 10px rgba(0, 0, 0, .46);
}

/* MODIFICA: nasconde definitivamente frecce e pallini del vecchio slider Hero. */
.hero-arrow,
.hero-nav,
.hero-dot,
.hero__arrow,
.hero__dots,
.hero__pagination,
.hero__prev,
.hero__next {
    display: none;
}

/* MODIFICA: pulsante MODIFICA condiviso per Hero, Primo Piano e News in modalità admin. */
.ncn-admin-edit {
    position: absolute;
    z-index: 20;
    top: 12px;
    right: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 11px;
    border: 1px solid rgba(255, 255, 255, .85);
    border-radius: 4px;
    color: #fff;
    background: rgba(0, 35, 70, .82);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .04em;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .25);
}

/* MODIFICA: colore del pulsante MODIFICA al passaggio del mouse. */
.ncn-admin-edit:hover {
    background: #007fca;
}

/* MODIFICA: posizione e aspetto del pulsante MODIFICA specifico dell'Hero. */
.ncn-admin-edit--hero {
    top: 14px;
    right: 14px;
    min-width: 84px;
    padding: 9px 13px;
    border-color: rgba(255, 255, 255, .82);
    background: rgba(0, 44, 79, .74);
    backdrop-filter: blur(3px);
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
}

/* MODIFICA: messaggio tecnico mostrato quando una sezione non restituisce contenuti. */
.ncn-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: 20px;
    text-align: center;
    color: #fff;
    background: linear-gradient(135deg, #004a80, #002846);
    font-weight: 700;
}


/* ==========================================================
   COPERTINA
   Ex CENTER BOX: le classi .center-box restano per compatibilità.
   ========================================================== */

/* MODIFICA: contenitore generale della Copertina. */
.ncn-page .center-box {
    display: block;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    background: transparent;
}

/* MODIFICA: contenitore interno della Copertina. */
.ncn-page .center-box__inner {
    display: block;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    background: transparent;
}

/* MODIFICA: cornice bianca e area dell'immagine Copertina. */
.ncn-page .center-box__media {
    position: relative;
    display: block;
    width: 100%;
    max-width: none;
    height: auto;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border-top: 6px solid #fff;
    border-left: 6px solid #fff;
    border-right: 6px solid #fff;
    border-bottom: 0;
    background: #071d31;
}

/* MODIFICA: area cliccabile e larghezza dell'immagine Copertina. */
.ncn-page .center-box__link,
.ncn-page .center-box__image {
    display: block;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    line-height: 0;
}

/* MODIFICA: proporzioni dell'immagine Copertina senza taglio forzato. */
.ncn-page .center-box__image {
    height: auto;
    object-fit: contain;
}

/* MODIFICA: altezza, allineamento e sfondo del fallback della Copertina. */
.center-box__fallback {
    min-height: 540px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 60px;
    text-align: center;
    color: #fff;
    background:
        radial-gradient(circle at 50% 35%, rgba(0, 174, 239, .28), transparent 30%),
        linear-gradient(135deg, #003b68 0%, #001a34 100%);
}

/* MODIFICA: etichetta superiore del fallback Copertina. */
.center-box__fallback-kicker {
    margin-bottom: 14px;
    color: #00AEEF;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 15px;
    font-weight: 900;
    letter-spacing: .16em;
    text-transform: uppercase;
}

/* MODIFICA: titolo del fallback Copertina. */
.center-box__fallback-title {
    margin-bottom: 16px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: clamp(30px, 3.1vw, 54px);
    line-height: 1;
    font-weight: 900;
    text-shadow: 0 4px 15px rgba(0, 0, 0, .46);
}

/* MODIFICA: testo descrittivo del fallback Copertina. */
.center-box__fallback-copy {
    max-width: 760px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 18px;
    line-height: 1.4;
    color: rgba(255, 255, 255, .90);
}


/* ==========================================================
   PRIMO PIANO
   ========================================================== */

/* V9: griglia generale 2/3 + 1/3 e altezza delle 8 righe del Primo Piano. */
.ncn-page .main-news-vertical {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
    grid-template-rows: 45px repeat(8, 150px);
    column-gap: 6px;
    row-gap: 6px;
    align-items: stretch;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 6px;
    background: #fff;
}

/* MODIFICA HOME 25/08/2026: testata "Notizie in primo piano", identica alla testata News. */
.ncn-page .main-news-vertical__header {
    grid-column: 1 / -1;
    grid-row: 1;
    width: 100%;
    min-width: 0;
    border-bottom: 0;
}

/* V9: permette alle 8 news e ai 4 banner di condividere la stessa griglia. */
.ncn-page .main-news-vertical__list,
.ncn-page .main-news-vertical__ads {
    display: contents;
}

/* MODIFICA: singola riga del Primo Piano, larghezza miniatura e altezza fissa. */
.ncn-page .main-news-vertical__row {
    position: relative;
    display: grid;
    grid-column: 1;
    grid-template-columns: 240px minmax(0, 1fr);
    min-height: 150px;
    height: 150px;
    align-self: stretch;
    overflow: hidden;
    background: linear-gradient(180deg, #f9fcfe 0%, #edf4f9 100%);
    border: 1px solid #d4e3ed;
}

/* MODIFICA: contenitore della miniatura delle notizie in Primo Piano. */
.main-news-vertical__image-link {
    display: block;
    min-width: 0;
    overflow: hidden;
    background: #082d50;
}

/* MODIFICA: taglio e riempimento della foto delle notizie in Primo Piano. */
.ncn-page .main-news-vertical__image {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 150px;
    object-fit: cover;
    transition: transform .24s ease, filter .24s ease;
}

/* MODIFICA: piccolo zoom della foto al passaggio del mouse. */
.main-news-vertical__row:hover .main-news-vertical__image {
    transform: scale(1.02);
    filter: saturate(1.05) brightness(.95);
}

/* MODIFICA: posizione verticale e spazio interno dei testi in Primo Piano. */
.ncn-page .main-news-vertical__content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    padding: 16px 24px 15px;
}

/* MODIFICA: distanza tra categoria/data e titolo del Primo Piano. */
.ncn-page .main-news-vertical__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 9px;
    margin-bottom: 12px;
    line-height: 1;
}

/* MODIFICA: etichetta categoria delle notizie in Primo Piano. */
.main-news-vertical__category {
    display: inline-flex;
    padding: 5px 8px 4px;
    border-radius: 3px;
    color: #fff;
    background: linear-gradient(180deg, #009fe8 0%, #007bc0 100%);
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}

/* MODIFICA: data delle notizie in Primo Piano. */
.main-news-vertical__date {
    color: #5a7487;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    line-height: 1;
    font-weight: 700;
}

/* MODIFICA: grandezza, interlinea e spaziatura del titolo in Primo Piano. */
.ncn-page .main-news-vertical__title {
    margin: 0 0 10px;
    color: #082d50;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 20px;
    line-height: 1.50;
    font-weight: 800;
    letter-spacing: -.024em;
}

/* MODIFICA: colore del titolo in Primo Piano al passaggio del mouse. */
.main-news-vertical__title a:hover {
    color: #007fc3;
}

/* MODIFICA: sottotitolo delle notizie in Primo Piano. */
.ncn-page .main-news-vertical__subtitle {
    margin: 0;
    color: #3a5669;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height: 1.42;
    font-weight: 500;
}

/* MODIFICA: posizione del pulsante MODIFICA nelle notizie in Primo Piano. */
.main-news-vertical__edit {
    top: 8px;
    right: 8px;
    font-size: 8px;
    padding: 6px 8px;
}


/* ==========================================================
   BANNER PRIMO PIANO
   ========================================================== */

/* V9: aspetto comune dei 4 banner verticali a destra del Primo Piano. */
.ncn-page .main-news-vertical__ad-box {
    display: block;
    width: 100%;
    height: auto;
    min-height: 0;
    overflow: hidden;
    background: #000;
    text-decoration: none;
}

/* MODIFICA: primo banner, allineato alle prime 2 notizie. */
.ncn-page .main-news-vertical__ad-box:nth-of-type(1) {
    grid-column: 2;
    grid-row: 2 / span 2;
}

/* MODIFICA: secondo banner, allineato alle notizie 3 e 4. */
.ncn-page .main-news-vertical__ad-box:nth-of-type(2) {
    grid-column: 2;
    grid-row: 4 / span 2;
}

/* MODIFICA: terzo banner, allineato alle notizie 5 e 6. */
.ncn-page .main-news-vertical__ad-box:nth-of-type(3) {
    grid-column: 2;
    grid-row: 6 / span 2;
}

/* V9: quarto banner, allineato alle notizie 7 e 8. */
.ncn-page .main-news-vertical__ad-box:nth-of-type(4) {
    grid-column: 2;
    grid-row: 8 / span 2;
}

/* V9: riempimento della foto nei 4 banner del Primo Piano. */
.ncn-page .main-news-vertical__ad-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}


/* ==========================================================
   NEWS
   ========================================================== */

/* MODIFICA: struttura 2/3 News + 1/3 Sidebar e distanza fra le due colonne. */
.ncn-page .editorial-layout {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
    gap: 6px;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0 6px 6px;
    background: #fff;
}

/* MODIFICA: larghezza minima della colonna News e della Sidebar. */
.ncn-page .editorial-news,
.ncn-page .editorial-sidebar {
    min-width: 0;
    width: 100%;
}

/* MODIFICA: testata azzurra "NEWS / Ultime notizie". */
.editorial-news__header {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 45px;
    padding: 10px 14px;
    color: #fff;
    background: linear-gradient(180deg, #087fc4 0%, #05689f 100%);
    border-bottom: 6px solid #fff;
}

/* MODIFICA: etichetta NEWS nella testata delle ultime notizie. */
.editorial-news__kicker {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 54px;
    padding: 5px 9px 4px;
    border: 1px solid rgba(255, 255, 255, .72);
    color: #fff;
    background: rgba(0, 37, 67, .32);
    font-family: Arial, Helvetica, sans-serif;
    font-size: 10px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: .12em;
}

/* MODIFICA: titolo "Ultime notizie" della testata. */
.editorial-news__title {
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 24px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: -.02em;
}

/* MODIFICA: disposizione verticale delle singole news. */
.editorial-news__list {
    display: flex;
    flex-direction: column;
    gap: 6px;
    background: #fff;
}

/* MODIFICA HOME 25/08/2026:
   le news dell'elenco usano la stessa identica grafica delle righe "Notizie in primo piano". */

.ncn-page .news-list-card {
    position: relative;
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    min-height: 150px;
    height: 150px;
    align-items: stretch;
    overflow: hidden;
    background: linear-gradient(180deg, #f9fcfe 0%, #edf4f9 100%);
    border: 1px solid #d4e3ed;
}

.news-list-card__image-link {
    display: block;
    width: auto;
    height: 100%;
    min-width: 0;
    margin: 0;
    overflow: hidden;
    background: #082d50;
    align-self: stretch;
}

.ncn-page .news-list-card__image {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 150px;
    object-fit: cover;
    transition: transform .24s ease, filter .24s ease;
}

.news-list-card:hover .news-list-card__image {
    transform: scale(1.02);
    filter: saturate(1.05) brightness(.95);
}

.ncn-page .news-list-card__content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    padding: 16px 24px 15px;
}

.ncn-page .news-list-card__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 9px;
    margin-bottom: 12px;
    line-height: 1;
}

.news-list-card__category {
    display: inline-flex;
    padding: 5px 8px 4px;
    border-radius: 3px;
    color: #fff;
    background: linear-gradient(180deg, #009fe8 0%, #007bc0 100%);
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.news-list-card__date {
    color: #5a7487;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    line-height: 1;
    font-weight: 700;
}

.ncn-page .news-list-card__title {
    margin: 0 0 10px;
    color: #082d50;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 20px;
    line-height: 1.50;
    font-weight: 800;
    letter-spacing: -.024em;
}

.news-list-card__title a:hover {
    color: #007fc3;
}

.ncn-page .news-list-card__subtitle {
    margin: 0;
    color: #3a5669;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height: 1.42;
    font-weight: 500;
}

.news-list-card__edit {
    top: 8px;
    right: 8px;
    font-size: 8px;
    padding: 6px 8px;
}


/* MODIFICA: area di attesa durante il caricamento di altre News. */
.news-stream__loader {
    min-height: 76px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    border-top: 6px solid #fff;
    color: #4a687d;
    background: #f3f7fa;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: 800;
}

/* MODIFICA: nasconde il loader quando non è attivo. */
.news-stream__loader[hidden] {
    display: none !important;
}

/* MODIFICA: rotellina del caricamento News. */
.news-stream__spinner {
    width: 22px;
    height: 22px;
    border: 3px solid #cbdde8;
    border-top-color: #008fd2;
    border-radius: 50%;
    animation: ncn-spin .75s linear infinite;
}

/* MODIFICA: animazione della rotellina di caricamento. */
@keyframes ncn-spin {
    to {
        transform: rotate(360deg);
    }
}

/* MODIFICA: dimensione, margini e aspetto del pulsante "CARICA ALTRE NOTIZIE". */
.news-stream__more {
    display: block;
    width: calc(100% - 24px);
    max-width: 250px;
    margin: 22px auto 26px;
    padding: 14px 18px 13px;
    border: 2px solid #0088cc;
    border-radius: 4px;
    color: #fff;
    background: linear-gradient(180deg, #2E4B67 0%, #007bc0 100%);
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: .055em;
    cursor: pointer;
    box-shadow: 0 4px 13px rgba(0, 74, 117, .18);
}

/* MODIFICA: effetto hover del pulsante "CARICA ALTRE NOTIZIE". */
.news-stream__more:hover {
    filter: brightness(1.06);
}

/* MODIFICA: aspetto del pulsante mentre sta caricando. */
.news-stream__more:disabled {
    opacity: .55;
    cursor: wait;
}

/* MODIFICA: nasconde il pulsante "CARICA ALTRE NOTIZIE" quando il JavaScript lo disattiva definitivamente. */
.news-stream__more[hidden] {
    display: none !important;
}


/* ==========================================================
   SIDEBAR
   ========================================================== */

/* MODIFICA: struttura verticale e distanza fra i moduli dati della Sidebar. */
.ncn-page .editorial-sidebar.ncn-data-sidebar {
    display: flex;
    flex-direction: column;
    gap: 18px;
    width: 100%;
    min-width: 0;
    padding: 0;
    background: #fff;
    align-self: start;
}

/* MODIFICA: cornice, angoli e ombra di ogni modulo dati Sidebar. */
.sidebar-data-card {
    width: 100%;
    overflow: hidden;
    border: 1px solid #cddbe8;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 5px 16px rgba(0, 39, 78, .10);
}

/* MODIFICA: altezza, colore e grandezza del titolo di ogni modulo Sidebar. */
.ncn-page .sidebar-data-card__header {
    min-height: 52px;
    display: flex;
    align-items: center;
    gap: 0;
    padding: 0 16px;
    color: #fff;
    background: linear-gradient(180deg, #07518c 0%, #053969 100%);
    border-bottom: 3px solid #0aa6e8;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 18px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: -.015em;
}

/* MODIFICA: testo piccolo a destra nei titoli dei moduli Sidebar. */
.ncn-page .sidebar-data-card__header small {
    margin-left: auto;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: .05em;
    opacity: .90;
}

/* MODIFICA: eventuale icona azzurra nei titoli Sidebar. */
.sidebar-data-card__icon {
    color: #75dcff;
    font-size: 15px;
}

/* MODIFICA: bollino Napoli usato nei moduli dati. */
.sidebar-data-card__napoli-dot {
    width: 27px;
    height: 27px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #fff;
    border: 2px solid rgba(255, 255, 255, .82);
    background: #069fe3;
    box-shadow: 0 0 10px rgba(0, 174, 239, .38);
    font-family: Georgia, serif;
    font-size: 17px;
    font-weight: 700;
}

/* MODIFICA: contenitore orizzontale delle tabelle Sidebar. */
.sidebar-data-card__table-wrap {
    width: 100%;
    overflow: hidden;
}

/* MODIFICA: font, colori e struttura generale di tutte le tabelle Sidebar. */
.ncn-page .sidebar-data-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    color: #082d50;
    background: #fff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    line-height: 1.20;
}

/* MODIFICA: altezza, padding e font delle intestazioni tabelle Sidebar. */
.ncn-page .sidebar-data-table th {
    height: 32px;
    padding: 7px 5px;
    color: #073d70;
    background: #d8ecfa;
    border-right: 1px solid #b9d2e5;
    border-bottom: 1px solid #b9d2e5;
    text-align: center;
    font-size: 11.5px;
    font-weight: 900;
}

/* MODIFICA: altezza, padding e comportamento delle celle Sidebar. */
.ncn-page .sidebar-data-table td {
    height: 31px;
    padding: 7px 5px;
    border-right: 1px solid #c6d8e7;
    border-bottom: 1px solid #c6d8e7;
    text-align: center;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* MODIFICA: alternanza dei colori delle righe delle tabelle Sidebar. */
.sidebar-data-table tbody tr:nth-child(odd) td {
    background: #f7fbfe;
}

.sidebar-data-table tbody tr:nth-child(even) td {
    background: #e8f4fc;
}

/* MODIFICA: allineamento a sinistra delle celle che lo richiedono. */
.sidebar-data-table .is-left {
    text-align: left;
}

/* MODIFICA: peso dei nomi squadra nelle classifiche. */
.sidebar-data-table .sidebar-team {
    font-weight: 900;
}

/* MODIFICA: evidenza dei punti in classifica. */
.sidebar-data-table .is-points {
    font-weight: 900;
    color: #005ca5;
}

/* MODIFICA: evidenza della riga Napoli nelle tabelle. */
.sidebar-data-table tr.is-napoli td {
    color: #003c70;
    background: #9ed8fb;
    font-weight: 900;
}

/* MODIFICA: grandezza dei nomi di squadre e giocatori nelle tabelle Sidebar. */
.ncn-page .sidebar-data-table .sidebar-team,
.ncn-page .sidebar-data-table--calendar td:nth-child(2),
.ncn-page .sidebar-data-table--calendar td:nth-child(3),
.ncn-page .sidebar-data-table--scorers td:nth-child(2),
.ncn-page .sidebar-data-table--scorers td:nth-child(3),
.ncn-page .sidebar-data-table--azzurri td:nth-child(2) {
    font-size: 13.5px;
}

/* MODIFICA: larghezze delle colonne della CLASSIFICA. */
.sidebar-data-table--standings th:nth-child(1),
.sidebar-data-table--standings td:nth-child(1) {
    width: 8%;
}

.sidebar-data-table--standings th:nth-child(2),
.sidebar-data-table--standings td:nth-child(2) {
    width: 44%;
}

.sidebar-data-table--standings th:nth-child(n+3),
.sidebar-data-table--standings td:nth-child(n+3) {
    width: 9.6%;
}

/* MODIFICA: grandezza font e larghezze delle colonne del CALENDARIO. */
.ncn-page .sidebar-data-table--calendar {
    font-size: 12.5px;
}

.sidebar-data-table--calendar th:nth-child(1),
.sidebar-data-table--calendar td:nth-child(1) {
    width: 22%;
}

.sidebar-data-table--calendar th:nth-child(2),
.sidebar-data-table--calendar td:nth-child(2),
.sidebar-data-table--calendar th:nth-child(3),
.sidebar-data-table--calendar td:nth-child(3) {
    width: 29%;
}

.sidebar-data-table--calendar th:nth-child(4),
.sidebar-data-table--calendar td:nth-child(4) {
    width: 20%;
}

/* MODIFICA: larghezze delle colonne della CLASSIFICA MARCATORI. */
.sidebar-data-table--scorers th:nth-child(1),
.sidebar-data-table--scorers td:nth-child(1),
.sidebar-data-table--azzurri th:nth-child(1),
.sidebar-data-table--azzurri td:nth-child(1) {
    width: 9%;
}

.sidebar-data-table--scorers th:nth-child(2),
.sidebar-data-table--scorers td:nth-child(2) {
    width: 48%;
}

.sidebar-data-table--scorers th:nth-child(3),
.sidebar-data-table--scorers td:nth-child(3) {
    width: 30%;
}

.sidebar-data-table--scorers th:nth-child(4),
.sidebar-data-table--scorers td:nth-child(4) {
    width: 13%;
}

/* MODIFICA: larghezze delle colonne dei MARCATORI AZZURRI. */
.sidebar-data-table--azzurri th:nth-child(2),
.sidebar-data-table--azzurri td:nth-child(2) {
    width: 76%;
}

.sidebar-data-table--azzurri th:nth-child(3),
.sidebar-data-table--azzurri td:nth-child(3) {
    width: 15%;
}

/* MODIFICA: altezza e font dei pulsanti di cambio giornata nel Calendario. */
.ncn-page .sidebar-calendar-tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    background: #edf6fc;
    border-bottom: 1px solid #bfd7e8;
}

.ncn-page .sidebar-calendar-tab {
    min-height: 39px;
    border: 0;
    border-right: 1px solid #bfd7e8;
    color: #073d70;
    background: #eef7fd;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: 900;
    cursor: pointer;
}

/* MODIFICA: elimina il bordo destro dell'ultimo tab Calendario. */
.sidebar-calendar-tab:last-child {
    border-right: 0;
}

/* MODIFICA: colore del tab Calendario attivo. */
.sidebar-calendar-tab.is-active {
    color: #fff;
    background: linear-gradient(180deg, #0aa6e8 0%, #0784c8 100%);
}

/* MODIFICA: rende visibile il pannello Calendario attivo. */
.sidebar-calendar-panel.is-active {
    display: block;
}

/* MODIFICA: nasconde sempre i pannelli Calendario marcati come hidden. */
.sidebar-calendar-panel[hidden] {
    display: none !important;
}

/* MODIFICA: altezza e font del footer "DETTAGLI" dei moduli Sidebar. */
.ncn-page .sidebar-data-card__footer {
    min-height: 38px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 13px;
    color: #fff;
    background: #063d70;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11.5px;
    font-weight: 900;
    letter-spacing: .035em;
}

/* MODIFICA: colore hover del footer "DETTAGLI" dei moduli Sidebar. */
.sidebar-data-card__footer:hover {
    background: #087fc4;
}

/* MODIFICA: messaggio quando un modulo Sidebar non ha dati. */
.sidebar-data-empty {
    padding: 26px 18px;
    color: #60798d;
    background: #f8fbfd;
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    line-height: 1.4;
    font-weight: 700;
}

/* MODIFICA: messaggio di errore della sorgente dati Sidebar. */
.sidebar-excel-error {
    padding: 16px;
    color: #7b1f1f;
    border: 1px solid #e5aaaa;
    background: #fff0f0;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    line-height: 1.4;
}

/* MODIFICA: titolo in grassetto del messaggio errore Sidebar. */
.sidebar-excel-error strong {
    display: block;
    margin-bottom: 4px;
}

/* MODIFICA: data e ora dell'ultimo aggiornamento dati Sidebar. */
.ncn-page .sidebar-excel-stamp {
    order: 2147483647;
    margin-top: 0;
    padding: 2px 4px 0;
    color: #61788a;
    text-align: right;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: .025em;
}

/* MODIFICA: mantiene visivamente pulite le righe vuote della Top 10 marcatori. */
.ncn-page .sidebar-data-table--scorers td:empty::after {
    content: "\00a0";
}


/* ==========================================================
   FOOTER
   ========================================================== */

/* MODIFICA: contenitore dell'immagine Footer. */
.ncn-page .ncn-footer {
    width: 100%;
    min-height: 0;
    display: block;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    overflow: hidden;
}

/* MODIFICA: dimensione dell'immagine Footer. */
.ncn-page .ncn-footer__image {
    display: block;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
}

/* MODIFICA: spazio finale di 35px dopo il Footer, con sfondo del body visibile. */
.ncn-bottom-space {
    height: 35px;
}


/* ==========================================================
   RESPONSIVE
   ========================================================== */

/* MODIFICA: scala visiva desktop al 75% mantenendo la gabbia logica da 1400px. */
@media (min-width: 901px) {
    .ncn-page {
        width: var(--ncn-max);
        max-width: var(--ncn-max);
        zoom: var(--ncn-desktop-scale);
    }
}

/* MODIFICA: sottilissimo bordo laterale della gabbia sui monitor molto larghi. */
@media (min-width: 1401px) {
    .ncn-page {
        border-left: 1px solid rgba(255, 255, 255, .18);
        border-right: 1px solid rgba(255, 255, 255, .18);
    }
}

/* MODIFICA: comportamento generale su tablet e smartphone fino a 900px. */
@media (max-width: 900px) {
    body {
        background-attachment: scroll;
    }

    .ncn-page {
        width: 100%;
        max-width: 100%;
        zoom: 1;
    }

    .hero-slide__shade {
        padding: 0 5.5% 6%;
    }

    .hero-slide__category {
        margin-bottom: 9px;
        padding: 6px 10px;
    }

    .hero-slide__title {
        width: 90%;
        margin-bottom: 7px;
        font-size: clamp(21px, 5vw, 36px);
    }

    .hero-slide__subtitle {
        width: 88%;
        font-size: clamp(12px, 2.4vw, 17px);
    }

    .center-box__fallback {
        min-height: 360px;
        padding: 35px 22px;
    }

    .center-box__fallback-copy {
        font-size: 15px;
    }

    .ncn-page .main-news-vertical {
        grid-template-columns: 1fr;
        grid-template-rows: none;
    }

    .ncn-page .main-news-vertical__list,
    .ncn-page .main-news-vertical__ads {
        display: block;
    }

    .ncn-page .main-news-vertical__row {
        grid-template-columns: 34% minmax(0, 1fr);
        height: auto;
        min-height: 150px;
    }

    .ncn-page .main-news-vertical__ad-box {
        height: 180px;
        margin-top: 6px;
    }

    .ncn-page .editorial-layout {
        grid-template-columns: 1fr;
    }

    .ncn-page .news-list-card {
        grid-template-columns: 34% minmax(0, 1fr);
        height: auto;
        min-height: 150px;
    }
}

/* MODIFICA: adattamenti aggiuntivi per smartphone fino a 560px. */
@media (max-width: 560px) {
    .hero-slide__shade {
        padding: 0 5% 8%;
        background:
            linear-gradient(
                180deg,
                rgba(0, 36, 72, 0) 0%,
                rgba(0, 36, 72, .16) 35%,
                rgba(0, 36, 72, .80) 62%,
                #002448 100%
            );
    }

    .hero-slide__title {
        width: 84%;
        font-size: clamp(18px, 5.8vw, 29px);
        line-height: 1.03;
    }

    .hero-slide__subtitle {
        display: none;
    }

    .ncn-admin-edit--hero {
        top: 9px;
        right: 9px;
        min-width: auto;
        padding: 7px 9px;
        font-size: 9px;
    }

    .center-box__fallback {
        min-height: 260px;
    }

    .center-box__fallback-kicker {
        font-size: 11px;
    }

    .center-box__fallback-title {
        font-size: 28px;
    }

    .ncn-page .main-news-vertical__row {
        grid-template-columns: 125px minmax(0, 1fr);
    }

    .ncn-page .main-news-vertical__content {
        padding: 12px;
    }

    .ncn-page .main-news-vertical__subtitle {
        display: none;
    }

    .ncn-page .news-list-card {
        grid-template-columns: 125px minmax(0, 1fr);
    }

    .ncn-page .news-list-card__content {
        padding: 12px;
    }

    .ncn-page .news-list-card__subtitle {
        display: none;
    }
}

/* MODIFICA: disattiva le animazioni AreaTop per chi preferisce meno movimento. */
@media (prefers-reduced-motion: reduce) {
    .ncn-top__logo {
        opacity: 1;
        transform: none;
        filter:
            drop-shadow(0 3px 3px rgba(0, 25, 58, .22))
            drop-shadow(0 8px 17px rgba(0, 147, 230, .13));
        animation: none;
    }

    .ncn-top__shine,
    .ncn-top__energy-wave {
        display: none;
        animation: none;
    }
}

/* ==========================================================================
   SFONDO LATERALE — NCN 2026 — VERSIONE UNICA
   Maradona a sinistra, Napoli/Vesuvio a destra.
   Questa è l'unica regola attiva per il comportamento laterale.
   ========================================================================== */

body {
    position: relative;
    overflow-x: hidden;
    isolation: isolate;
}

/*
   Le immagini sorgente sono panoramiche.
   Per renderle grandi NON usiamo contain: le portiamo all'altezza
   del pannello e lasciamo che la parte eccedente venga tagliata.
*/
body::before,
body::after {
    content: "";
    position: fixed;
    z-index: 0;
    top: 85px;
    bottom: 55px;
    width: clamp(390px, 32vw, 570px);
    pointer-events: none;
    opacity: .34;

    background-repeat: no-repeat;
    background-size: auto 100%;

    -webkit-mask-image: radial-gradient(
        ellipse 92% 80% at center,
        #000 0%,
        #000 48%,
        rgba(0, 0, 0, .82) 63%,
        rgba(0, 0, 0, .38) 79%,
        transparent 100%
    );

    mask-image: radial-gradient(
        ellipse 92% 80% at center,
        #000 0%,
        #000 48%,
        rgba(0, 0, 0, .82) 63%,
        rgba(0, 0, 0, .38) 79%,
        transparent 100%
    );

    filter:
        saturate(.96)
        contrast(.96)
        brightness(1.04);
}

body::before {
    left: 0;
    background-image: url("../assets/img/bg-maradona-left.png");
    background-position: left center;
}

body::after {
    right: 0;
    background-image: url("../assets/img/bg-maradona-right.png");
    background-position: right center;
}

/* La gabbia pubblica resta sempre sopra agli overlay laterali. */
.ncn-page {
    position: relative;
    z-index: 2;
}

/* Monitor meno larghi: riduciamo solo la presenza, non la scala interna. */
@media (max-width: 1600px) {
    body::before,
    body::after {
        width: clamp(330px, 29vw, 470px);
        opacity: .29;
    }
}

@media (max-width: 1380px) {
    body::before,
    body::after {
        width: 360px;
        opacity: .23;
    }
}

@media (max-width: 1280px) {
    body::before,
    body::after {
        display: none;
    }
}


/* ==========================================================
   TORNA SU
   ========================================================== */
html {
    scroll-behavior: smooth;
}

.ncn-backtop-wrap {
    width: 100%;
    margin: 0;
}

.ncn-backtop {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 62px;
    padding: 14px 22px;
    color: #ffffff;
    text-decoration: none;
    background: linear-gradient(180deg, #0f5f8c 0%, #0b486c 52%, #093754 100%);
    border-top: 6px solid #ffffff;
    border-bottom: 6px solid #ffffff;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.14);
    transition: filter .18s ease, transform .18s ease;
}

.ncn-backtop::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 50% 18%, rgba(255,255,255,.16) 0%, rgba(255,255,255,0) 38%),
        linear-gradient(180deg, rgba(255,255,255,.10) 0%, rgba(255,255,255,0) 38%);
    pointer-events: none;
}

.ncn-backtop:hover,
.ncn-backtop:focus-visible {
    filter: brightness(1.06);
}

.ncn-backtop__label {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 20px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: .01em;
    text-shadow: 0 1px 0 rgba(0, 23, 39, .30);
}

.ncn-backtop__label::before {
    content: "↑";
    display: inline-block;
    font-size: 21px;
    line-height: 1;
    transform: translateY(-1px);
}

@media (max-width: 900px) {
    .ncn-backtop {
        min-height: 56px;
        padding: 12px 16px;
    }

    .ncn-backtop__label {
        font-size: 18px;
    }

    .ncn-backtop__label::before {
        font-size: 19px;
    }
}

/* ================================================================
   INTRANEWS V1.0
   Sfondo unico 3/3 + banner opzionale in overlay sul terzo destro.
   ================================================================ */
.ncn-page .intranews {
    width: 100%;
    margin: 0;
    padding: 0;
    border: 6px solid #fff;
    border-top: 0;
    box-sizing: border-box;
    background: #fff;
}

.intranews__stage {
    position: relative;
    width: 100%;
    overflow: hidden;
    line-height: 0;
    background: #071d32;
}

.intranews__background {
    display: block;
    width: 100%;
    height: auto;
    margin: 0;
}

/* Se l'immagine principale ha un link, tutta la tela resta cliccabile.
   Quando il banner è attivo, il banner (z-index 2) intercetta il suo terzo. */
.intranews__main-link {
    position: absolute;
    z-index: 1;
    inset: 0;
    display: block;
    background: transparent;
}

/* Stessa larghezza matematica della sidebar dell'editorial-layout.
   I 6px del gap rimangono parte dello sfondo continuo, non diventano bianchi. */
.intranews__banner {
    position: absolute;
    z-index: 2;
    top: 0;
    right: 0;
    bottom: 0;
    width: calc((100% - 6px) / 3);
    overflow: hidden;
    background: transparent;
}

.intranews__banner-link,
.intranews__banner-image {
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
}

.intranews__banner-image {
    object-fit: cover;
    object-position: center center;
}

.intranews__banner-link.is-static {
    cursor: default;
}

@media (max-width: 900px) {
    /* Su mobile il banner resta un overlay laterale: la grafica di fondo
       continua comunque su tutta la larghezza. */
    .intranews__banner {
        width: 33.333333%;
    }
}



/* ==========================================================
   NCN 31/08/2026 - RISULTATI LIVE SIDEBAR
   ========================================================== */
.ncn-page .sidebar-data-card__title-link{
    display:flex;
    align-items:center;
    min-width:0;
    color:inherit;
    text-decoration:none;
}
.ncn-page .sidebar-data-card__title-link:hover{color:#bfeeff}

.ncn-page .sidebar-calendar-tab{
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0 8px;
    box-sizing:border-box;
    text-align:center;
    text-decoration:none;
}
.ncn-page .sidebar-calendar-tab:hover{
    color:#fff;
    background:#159dd8;
}

.ncn-page .sidebar-live-card-badge{
    margin-left:auto;
    display:inline-flex;
    align-items:center;
    gap:5px;
    padding:5px 8px;
    border-radius:999px;
    color:#fff;
    background:#df2338;
    box-shadow:0 0 14px rgba(223,35,56,.42);
    font-size:10px;
    font-weight:900;
    letter-spacing:.05em;
}
.ncn-page .sidebar-live-card-badge[hidden]{display:none!important}
.ncn-page .sidebar-live-card-badge i{
    width:7px;height:7px;border-radius:50%;
    background:#fff;
    animation:ncnSidebarLivePulse 1.25s ease-in-out infinite;
}

.ncn-page .sidebar-data-table--calendar tr.is-live-match td{
    color:#071f35;
    background:#fff0f2!important;
    font-weight:900;
}
.ncn-page .sidebar-data-table--calendar tr.is-live-match .sidebar-live-value{
    color:#d71936;
    white-space:normal;
    line-height:1.05;
}
.ncn-page .sidebar-data-table--calendar tr.is-finished-match .sidebar-live-value{
    color:#005ca5;
    font-weight:900;
}
.ncn-page .sidebar-data-table--calendar .sidebar-live-value{
    font-size:11px;
    letter-spacing:-.01em;
}
@keyframes ncnSidebarLivePulse{
    0%,100%{opacity:1;transform:scale(1)}
    50%{opacity:.42;transform:scale(.72)}
}
@media(prefers-reduced-motion:reduce){
    .ncn-page .sidebar-live-card-badge i{animation:none}
}

/* Sidebar home */
.ncn-page .sidebar-data-card__header{position:relative;justify-content:center;text-align:center}
.ncn-page .sidebar-data-card__header>small{position:absolute;right:16px;margin-left:0}
.ncn-page .sidebar-data-card__title-link{justify-content:center;text-align:center;width:100%}
.ncn-page .sidebar-live-card-badge{position:absolute;right:12px;margin-left:0}
.ncn-page button.sidebar-calendar-tab{border:0;font:inherit;cursor:pointer}
.ncn-page .sidebar-data-table--calendar .sidebar-live-value{font-size:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit}
.ncn-page .sidebar-data-table--calendar tr.is-finished-match .sidebar-live-value{font-size:inherit}

/* ==========================================================
   NCN 19/09/2026 - LIVE SIDEBAR AZZURRO / SOFT PULSE
   ========================================================== */
.ncn-page .sidebar-live-card-badge{
    color:#fff!important;background:#0b9fc5!important;box-shadow:0 0 12px rgba(11,159,197,.25)!important;
    font-size:9px!important;padding:4px 7px!important;
}
.ncn-page .sidebar-live-card-badge i{background:#dff8ff!important;animation:ncnSidebarLiveSoftPulse 3.2s ease-in-out infinite!important}
.ncn-page .sidebar-data-table--calendar tr.is-live-match td{background:#f2fbfe!important;color:#173f55!important;font-weight:800!important}
.ncn-page .sidebar-data-table--calendar tr.is-live-match .sidebar-live-value{
    color:#078fbd!important;white-space:nowrap!important;font-size:10px!important;font-weight:900!important;letter-spacing:-.01em!important;line-height:1.15!important;
    animation:ncnSidebarLiveResultGlow 3.2s ease-in-out infinite!important;
}
.sidebar-live-legend{display:flex;align-items:center;justify-content:flex-end;gap:6px;padding:7px 10px 2px;color:#68828f;font:700 9px/1.2 Arial,Helvetica,sans-serif}
.sidebar-live-legend__dot{width:7px;height:7px;border-radius:50%;background:#0b9fc5;box-shadow:0 0 7px rgba(11,159,197,.35);animation:ncnSidebarLiveSoftPulse 3.2s ease-in-out infinite}
@keyframes ncnSidebarLiveSoftPulse{0%,100%{opacity:.48;box-shadow:0 0 3px rgba(11,159,197,.18)}50%{opacity:1;box-shadow:0 0 10px rgba(11,159,197,.5)}}
@keyframes ncnSidebarLiveResultGlow{0%,100%{opacity:.62;text-shadow:0 0 0 rgba(11,159,197,0)}50%{opacity:1;text-shadow:0 0 8px rgba(11,159,197,.30)}}
@media(prefers-reduced-motion:reduce){.ncn-page .sidebar-live-card-badge i,.ncn-page .sidebar-data-table--calendar tr.is-live-match .sidebar-live-value,.sidebar-live-legend__dot{animation:none!important;opacity:1!important}}