/*
 * Compatibilità Elementor per la homepage ricostruita con Elementor.
 * I wrapper dei widget Elementor spezzano i selettori figlio ('>') e i
 * selettori di fratelli adiacenti di style.css: queste regole li replicano
 * in versione discendente / basata sui wrapper. Nessun effetto sulle pagine
 * renderizzate dai template PHP (stessi valori delle regole originali).
 */

/* .heading > h3 (style.css) */
.heading h3 {
    font-size: 43px;
    color: var(--red-color);
    margin-bottom: 0;
    line-height: 1.2;
}
.heading h3 a {
    text-decoration: underline;
}
.heading h3 a:hover {
    text-decoration: none;
    color: var(--primary-color);
}

/* .hero-content-box h1 + p */
.hero-content-box .elementor-widget-heading + .elementor-widget-text-editor {
    margin-top: 37px;
}

/* .ibc-text > h3 / .ibc-text > p */
.ibc-text h3 {
    color: var(--red-color);
    font-size: 43px;
    line-height: 1.21;
    margin-bottom: 34px;
}
.ibc-text p {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 17px;
}

/* .logo-list + * (dentro .ibc-text) */
.ibc-text .elementor-widget-html + .elementor-widget-heading {
    margin-top: 28px;
}

/* h1-h6 base: line-height 1.2 che il reset .elementor-heading-title azzera */
.cta-left h3 {
    line-height: 1.2;
}

/* .tbc-image > img / .ibc-image > img */
.tbc-image img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}
.ibc-image img {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* .news-list + .heading */
.heading.news-heading {
    margin-top: 43px;
    margin-bottom: 0;
}

/* Il gap/margine di default fra widget Elementor non esiste nel template PHP */
.jw-home .elementor-widget:not(:last-child) {
    margin-block-end: 0;
}

/*
 * Nei container row Elementor imposta flex-grow:1 sui widget figli diretti
 * (.e-con.e-flex > .elementor-widget): i widget HTML che contengono solo
 * sfondi assoluti (hero-bg, bg-box) non devono occupare spazio nel flex.
 */
.jw-home.e-con.e-flex > .elementor-widget,
.hero-container.e-con > .elementor-widget,
.cta-container.e-con > .elementor-widget {
    flex-grow: 0;
}

/*
 * I wrapper .elementor-widget sono position:relative: i div assoluti dentro
 * i widget HTML (hero-bg, bg-box, ibc-image-bg, img dentro .ibc-image) si
 * ancorerebbero al wrapper (alto 0) invece che alla sezione. Con static
 * l'ancoraggio torna al container Elementor, come nel template originale.
 */
.jw-home .elementor-widget-html {
    position: static;
}

/*
 * .bg-box (style.css) è absolute senza top/left: nell'originale si appoggia
 * alla posizione statica (primo figlio in alto); dentro il widget Elementor,
 * centrato verticalmente dal flex, erediterebbe un offset a metà sezione.
 * Ancoraggio esplicito: nessun effetto sul template PHP originale.
 */
.cta-container .bg-box {
    top: 0;
    left: 0;
}

/*
 * Solo nell'editor di Elementor: AOS non gira (i widget vengono
 * ri-renderizzati e la classe aos-animate non viene mai applicata), quindi
 * gli elementi [data-aos] resterebbero a opacity:0 e .tbc-image/.ibc-image
 * a scale(0). Qui vengono forzati visibili; il frontend non è toccato.
 */
body.elementor-editor-active [data-aos],
body.elementor-editor-active [data-aos^="fade"] {
    opacity: 1 !important;
    transform: none !important;
}
body.elementor-editor-active .tbc-image,
body.elementor-editor-active .ibc-image {
    transform: scale(1) !important;
}

@media (max-width: 1199.98px) {
    .ibc-text h3 {
        font-size: 40px;
    }
}

@media (max-width: 991.98px) {
    .heading h3 {
        font-size: 40px;
    }
    .hero-content-box .elementor-widget-heading + .elementor-widget-text-editor {
        margin-top: 20px;
    }
    .ibc-text h3 {
        font-size: 30px;
        margin-bottom: 20px;
    }
    .ibc-text p {
        font-size: 16px;
        margin-bottom: 10px;
    }
}

@media (max-width: 767.98px) {
    .heading h3 {
        font-size: 30px;
    }
    .heading.news-heading {
        margin-top: 30px;
    }
}
