/*
 * Interventi SEO/CRO isolati dal CSS legacy.
 * Gli interventi ADV sono intenzionalmente esclusi perché in standby.
 */

.screen-reader-text,
.open-seo-cro-sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.open-article-meta-after-media {
    margin-top: 0 !important;
    margin-bottom: var(--margin-bottom-news);
}

.open-card-copy-link {
    display: block;
    margin: 0.5rem 0 0;
}

.open-card-copy-link .paragraph-18 {
    margin: 0;
}

/*
 * CRO-D01: avvicina le chip categoria/tag al TopLeft negli articoli senza
 * modificare l'altezza riservata allo slot o il comportamento dell'ADV.
 */
body.single.open-seo-cro-v1 .adv-banner-topleft {
    margin-bottom: 0;
}

/*
 * CRO-D04: nel sorgente il titolo precede la figura. Su desktop conserviamo
 * la composizione visuale legacy; su mobile rispettiamo l'ordine semantico.
 */
.card-news-vertical-content {
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.card-news-vertical-content > h2 {
    width: 100%;
    margin: 0 0 0.75rem;
}

/*
 * Nelle righe desktop il JS uniforma lo spazio riservato ai titoli. Le news
 * affiancate sono marcate dal tema legacy come card-news-vertical, nonostante
 * compongano una riga orizzontale. Il testo flessibile allinea l'autore in
 * basso senza tagliare o limitare il numero di righe del titolo.
 */
@media (min-width: 768px) {
    .card-news-horizontal-content > .card-news-horizontal-content-figure {
        order: -1;
    }

    body.home.open-seo-cro-v1 .card-news-horizontal > .open-card-title-first > .card-news-horizontal-content-text,
    body.home.open-seo-cro-v1 .card-news-vertical > .open-card-title-first > .card-news-vertical-content-text {
        display: flex;
        flex: 1 1 auto;
        flex-direction: column;
    }

    body.home.open-seo-cro-v1 .card-news-horizontal > .open-card-title-first > .card-news-horizontal-content-text > .card-news-horizontal-content-text-info,
    body.home.open-seo-cro-v1 .card-news-vertical > .open-card-title-first > .card-news-vertical-content-text > .card-news-horizontal-content-text-info {
        margin-top: auto;
        padding-top: 0.75rem;
    }
}

@media (max-width: 767px) {
    /*
     * Nelle card in evidenza il solo titolo precede l'immagine; abstract,
     * autore ed eventuali metadati restano sotto. display: contents consente
     * il riordino visuale senza duplicare o alterare il markup editoriale.
     */
    body.home.open-seo-cro-v1 .card-news-horizontal > .open-card-title-first > .card-news-horizontal-content-text {
        display: contents;
    }

    body.home.open-seo-cro-v1 .card-news-horizontal > .open-card-title-first > .card-news-horizontal-content-text > * {
        order: 2;
    }

    body.home.open-seo-cro-v1 .card-news-horizontal > .open-card-title-first > .card-news-horizontal-content-text > h2 {
        order: 0;
        width: 100%;
    }

    body.home.open-seo-cro-v1 .card-news-horizontal-content > .card-news-horizontal-content-figure {
        order: 1;
        margin-bottom: 0.75rem;
    }

    body.home.open-seo-cro-v1 .card-news-vertical > .open-card-title-first {
        flex-direction: column !important;
    }

    body.home.open-seo-cro-v1 .card-news-vertical > .open-card-title-first > .card-news-vertical-content-figure {
        width: 100% !important;
        min-width: 100% !important;
        max-width: none !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
    }

    body.home.open-seo-cro-v1 .card-news-vertical > .open-card-title-first > .card-news-vertical-content-text {
        width: 100% !important;
        min-width: 0;
        padding-left: 0 !important;
        padding-top: 0.75rem;
    }
}