/**
 * La Pietra Scartata - responsive typography
 *
 * Loaded after the parent responsive styles. Keep selectors scoped to the
 * affected components: plugin-generated headings are not globally reset.
 */

:root {
    --lps-font-size-hero: clamp(2rem, calc(1.05rem + 4.75vw), 5.5rem);
    /* The parent theme uses a 14px root below desktop and 15px above it. */
    --lps-font-size-page-title: clamp(1.7857rem, calc(1.65rem + 0.55vw), 2.1333rem);
    --lps-font-size-article-title: clamp(2rem, calc(1.68rem + 1.35vw), 2.6667rem);
    --lps-font-size-section-title: clamp(1.7143rem, calc(1.52rem + 0.72vw), 2.1333rem);
    --lps-font-size-loop-heading: clamp(1.4286rem, calc(1.36rem + 0.3vw), 1.6rem);
    --lps-font-size-card-title: clamp(1.2857rem, calc(1.18rem + 0.35vw), 1.4667rem);
    --lps-font-size-chess-title: clamp(1.8571rem, calc(1.58rem + 0.55vw), 2.1429rem);
    --lps-line-height-display: 1.08;
    --lps-line-height-title: 1.16;
    --lps-line-height-heading: 1.3;
}

/* Theme page/archive title: preserves the current 25-32px visual range. */
h1.sc_layouts_title_caption {
    max-width: 100%;
    font-size: var(--lps-font-size-page-title);
    line-height: 1.2;
    overflow-wrap: anywhere;
    word-break: normal;
    hyphens: auto;
}

/* Homepage hero: removes the 135px -> 50px discontinuity at 1440px. */
body.home .preghiera-carousel h1.elementor-heading-title {
    max-width: 100%;
    font-size: var(--lps-font-size-hero);
    line-height: var(--lps-line-height-display);
    overflow-wrap: anywhere;
    word-break: normal;
    hyphens: auto;
}

/* Editorial H1: fluid size and proportional leading at every breakpoint. */
body.single-post h1.post_title.entry-title {
    max-width: 100%;
    font-size: var(--lps-font-size-article-title);
    line-height: var(--lps-line-height-title);
    overflow-wrap: anywhere;
    word-break: normal;
    hyphens: auto;
}

/* True editorial H2: replaces the global 20px Simple CSS override. */
body.single-post .post_content h2 {
    max-width: 100%;
    font-size: var(--lps-font-size-section-title) !important;
    line-height: var(--lps-line-height-heading) !important;
    overflow-wrap: anywhere;
    word-break: normal;
    hyphens: auto;
}

/* Some loop excerpts are incorrectly emitted as H2: keep them card-sized. */
body.archive .post_item h2,
body.blog .post_item h2 {
    max-width: 100%;
    font-size: var(--lps-font-size-loop-heading) !important;
    line-height: var(--lps-line-height-heading) !important;
    overflow-wrap: anywhere;
    word-break: normal;
    hyphens: auto;
}

/*
 * Homepage section titles: match the visual treatment used by "Il grido".
 * Simple CSS contains a global h2 rule, so these component-scoped values
 * need !important to keep every ThemeREX title consistent.
 */
body.home .elementor-widget-trx_sc_title h2.sc_item_title {
    max-width: 100%;
    font-family: "Montserrat", sans-serif !important;
    font-size: var(--lps-font-size-page-title) !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    overflow-wrap: anywhere;
    word-break: normal;
    hyphens: auto;
}

/*
 * Elementor widget IDs are stable; the generated trx_sc_services_* IDs are
 * not. These two homepage carousels otherwise render primary titles at 14px.
 */
body.home :is(
    .elementor-element-4cee5ab,
    .elementor-element-8f4e9c2
) .sc_services_item_title {
    max-width: 100%;
    font-size: var(--lps-font-size-card-title) !important;
    line-height: 1.3 !important;
    overflow-wrap: anywhere;
    word-break: normal;
    hyphens: auto;
}

body.home :is(
    .elementor-element-4cee5ab,
    .elementor-element-8f4e9c2
) .sc_services_item_title a {
    font-size: inherit !important;
    line-height: inherit !important;
}

/* Keep the editorial titles shown on the homepage consistently bold. */
body.home :is(
    .post_title.entry-title,
    .sc_blogger_item_title.entry-title,
    .sc_services_item_title
),
body.home :is(
    .post_title.entry-title,
    .sc_blogger_item_title.entry-title,
    .sc_services_item_title
) a {
    font-weight: 700;
}

/* Keep every homepage section CTA consistent with the dark "Leggi tutte" style. */
body.home .elementor-415 .elementor-widget-trx_sc_button a.sc_button,
body.home .elementor.elementor-415 .elementor-element.elementor-element-d236c64 a.sc_button {
    color: #fff !important;
    background-color: #252525 !important;
    border-color: #252525 !important;
}

body.home .elementor-415 .elementor-widget-trx_sc_button a.sc_button:hover,
body.home .elementor-415 .elementor-widget-trx_sc_button a.sc_button:focus-visible,
body.home .elementor.elementor-415 .elementor-element.elementor-element-d236c64 a.sc_button:hover,
body.home .elementor.elementor-415 .elementor-element.elementor-element-d236c64 a.sc_button:focus-visible {
    color: #fff !important;
    background-color: #145f8c !important;
    border-color: #145f8c !important;
}

/* Accessible interaction colors for the light Approfondimento cards. */
body.home .elementor-element-8f4e9c2 .sc_services_item:hover .sc_services_item_title a,
body.home .elementor-element-8f4e9c2 .sc_services_item_title a:hover,
body.home .elementor-element-8f4e9c2 .sc_services_item_title a:focus-visible {
    color: #145f8c !important;
}

/* Yellow CTAs: dark text at rest, high-contrast blue feedback on interaction. */
a.sc_button.color_style_link2 {
    color: #252525 !important;
}

a.sc_button.color_style_link2:hover,
a.sc_button.color_style_link2:focus-visible {
    color: #fff !important;
    background-color: #145f8c !important;
    border-color: #145f8c !important;
}

/* Keep post-title emphasis consistent across all WordPress archives. */
body.archive .post_title.entry-title,
body.archive .post_title.entry-title a {
    font-weight: 700;
}

/*
 * Chess cards need their original unclipped content layout, but their title
 * can scale continuously instead of jumping from 26px to 30px at 1025px.
 */
@media (min-width: 768px) and (max-width: 1366px) {
    body .post_layout_chess .post_title {
        max-width: 100%;
        font-size: var(--lps-font-size-chess-title) !important;
        line-height: 1.2 !important;
        overflow-wrap: anywhere !important;
        word-break: normal !important;
        hyphens: auto !important;
    }
}

@supports (text-wrap: balance) {
    body.home .preghiera-carousel h1.elementor-heading-title,
    body.single-post h1.post_title.entry-title,
    h1.sc_layouts_title_caption,
    body .post_layout_chess .post_title {
        text-wrap: balance;
    }
}

/*
 * The parent gives direct Elementor children a -25px inline margin to
 * compensate its desktop column gap. Below 1024px that gap is smaller, so
 * the unchanged negative margin makes the homepage wider than the viewport.
 */
@media (max-width: 1024px) {
    body.home .post_content > .elementor.elementor-415 {
        width: 100%;
        max-width: 100%;
        margin-right: 0;
        margin-left: 0;
    }

    body.home .elementor-415 :is(
        .elementor-column,
        .elementor-widget-wrap,
        .elementor-widget,
        .elementor-widget-container
    ) {
        min-width: 0;
    }
}

/* Remove the residual 20px ThemeREX grid compensation on stacked cards. */
@media (max-width: 767px) {
    body.home .elementor-415 :is(
        .sc_blogger_columns_wrap,
        .sc_icons_columns_wrap
    ).trx_addons_columns_wrap {
        margin-right: 0;
    }

    body.home .elementor-415 :is(
        .sc_blogger_columns_wrap,
        .sc_icons_columns_wrap
    ) > [class*="trx_addons_column-"] {
        padding-right: 0;
    }
}

/* ThemeREX keeps its desktop carousel geometry on some 768-1024px devices. */
@media (max-width: 1024px) {
    /*
     * Prayer and insight carousels are configured for several narrow slides.
     * On phones and touch tablets, expose them as swipeable, single-card rows
     * instead of clipping titles into narrow two-column cards.
     */
    body.home :is(
        .elementor-element-4cee5ab,
        .elementor-element-8f4e9c2
    ) :is(
        .sc_services,
        .sc_services_slider,
        .slider_container
    ) {
        width: 100% !important;
        max-width: none !important;
    }

    body.home :is(
        .elementor-element-4cee5ab,
        .elementor-element-8f4e9c2
    ) .slider_container {
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-inline: contain;
        scroll-behavior: smooth;
        scroll-snap-type: inline mandatory;
        scrollbar-width: none;
        touch-action: pan-x;
    }

    body.home :is(
        .elementor-element-4cee5ab,
        .elementor-element-8f4e9c2
    ) .slider_container::-webkit-scrollbar {
        display: none;
    }

    body.home :is(
        .elementor-element-4cee5ab,
        .elementor-element-8f4e9c2
    ) .swiper-wrapper {
        display: flex !important;
        gap: 0;
        width: 100% !important;
        height: auto !important;
        padding: 0.35rem 0 1.5rem !important;
        transform: none !important;
    }

    body.home :is(
        .elementor-element-4cee5ab,
        .elementor-element-8f4e9c2
    ) .swiper-slide-duplicate {
        display: none !important;
    }

    body.home :is(
        .elementor-element-4cee5ab,
        .elementor-element-8f4e9c2
    ) .swiper-slide {
        flex: 0 0 100% !important;
        width: 100% !important;
        height: auto !important;
        scroll-snap-align: start;
    }

    body.home :is(
        .elementor-element-4cee5ab,
        .elementor-element-8f4e9c2
    ) .sc_services_item {
        display: flex;
        flex-direction: column;
        box-sizing: border-box;
        width: 100%;
        height: 100% !important;
        min-height: 0;
        overflow: hidden;
        border: 1px solid transparent;
        border-radius: 12px;
    }

    body.home :is(
        .elementor-element-4cee5ab,
        .elementor-element-8f4e9c2
    ) .sc_services_item_header {
        float: none !important;
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 16 / 9;
        background-position: center !important;
        background-repeat: no-repeat !important;
        background-size: cover !important;
    }

    body.home :is(
        .elementor-element-4cee5ab,
        .elementor-element-8f4e9c2
    ) .sc_services_item_content {
        position: static !important;
        box-sizing: border-box;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        padding: 1rem 1.25rem 1.125rem !important;
        overflow: visible;
        transform: none !important;
    }

    body.home :is(
        .elementor-element-4cee5ab,
        .elementor-element-8f4e9c2
    ) .sc_services_item_title {
        display: block !important;
        margin: 0;
        overflow: visible;
        letter-spacing: -0.01em;
        line-height: 1.3 !important;
    }

    body.home :is(
        .elementor-element-4cee5ab,
        .elementor-element-8f4e9c2
    ) .sc_services_item_title a {
        display: block;
        color: inherit !important;
        line-height: inherit !important;
    }

    /* Dark editorial card used by La preghiera. */
    body.home .elementor-element-4cee5ab .sc_services_item {
        color: #fff;
        background: #263740;
        border-color: rgba(255, 255, 255, 0.14);
        box-shadow: 0 12px 30px rgba(0, 0, 0, 0.24);
    }

    body.home .elementor-element-4cee5ab .sc_services_item_content {
        color: #fff;
        background: #263740 !important;
        border-top: 1px solid rgba(255, 255, 255, 0.12);
    }

    /* Light editorial card used by L'approfondimento. */
    body.home .elementor-element-8f4e9c2 .sc_services_item {
        color: #252525;
        background: #f4f7f8;
        border-color: #dce4e8;
        box-shadow: 0 12px 30px rgba(37, 37, 37, 0.14);
    }

    body.home .elementor-element-8f4e9c2 .sc_services_item_content {
        color: #252525;
        background: #f4f7f8 !important;
        border-top: 1px solid #dce4e8;
    }

    body.home :is(
        .elementor-element-4cee5ab,
        .elementor-element-8f4e9c2
    ) :is(
        .sc_services_item_subtitle,
        .sc_services_item_text,
        .sc_services_item_button,
        .slider_controls_wrap
    ) {
        display: none !important;
    }
}