html,
body {
    overflow-x: clip;
}

.cosmos-slide,
.cosmos-slide * {
    box-sizing: border-box;
}

.elementor-widget-cosmos_slide_scrollytelling,
.elementor-widget-cosmos_slide_scrollytelling > .elementor-widget-container {
    position: relative !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
}

.cosmos-slide {
    --cosmos-header-offset: 0px;
    --cosmos-top-gap: 18px;
    --cosmos-slide-height: min(72vh, 710px);
    --cosmos-scroll-step: 85px;

    position: relative;
    width: 100vw;
    max-width: none;
    margin: 0;
    padding: 0;
    overflow: visible;
}

/*
 * Altezza = altezza visiva + distanza necessaria per cambiare slide.
 * In questo modo recensioni e footer iniziano realmente dopo lo scrollytelling.
 */
.cosmos-slide__spacer {
    position: relative;
    width: 100%;
    height: calc(
        var(--cosmos-slide-height) +
        (var(--cosmos-count) - 1) * var(--cosmos-scroll-step)
    );
    min-height: calc(
        520px +
        (var(--cosmos-count) - 1) * var(--cosmos-scroll-step)
    );
    margin: 0;
    padding: 0;
}

.cosmos-slide__viewport {
    position: sticky;
    top: calc(var(--cosmos-header-offset) + var(--cosmos-top-gap));
    width: 100%;
    height: var(--cosmos-slide-height);
    min-height: 500px;
    max-height: 710px;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border-radius: 0 !important;
    z-index: 5;
}

.cosmos-slide__stage {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.cosmos-slide__item {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateX(6%);
    transition:
        opacity 420ms ease,
        transform 540ms cubic-bezier(.22, 1, .36, 1),
        visibility 420ms ease;
}

.cosmos-slide__item.is-active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(0);
}

.cosmos-slide--fade .cosmos-slide__item {
    transform: none;
}

.cosmos-slide--zoom .cosmos-slide__item {
    transform: scale(1.04);
}

.cosmos-slide--zoom .cosmos-slide__item.is-active {
    transform: scale(1);
}

.cosmos-slide__image,
.cosmos-slide__overlay {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    border-radius: 0 !important;
}

.cosmos-slide__image {
    display: block;
    object-fit: cover;
}

.cosmos-slide__overlay {
    pointer-events: none;
}

.cosmos-slide__item--left {
    justify-content: flex-start;
}

.cosmos-slide__item--center {
    justify-content: center;
}

.cosmos-slide__item--right {
    justify-content: flex-end;
}

.cosmos-slide__content {
    position: relative;
    z-index: 3;
    width: min(35vw, 540px);
    max-width: calc(100% - 56px);
    max-height: calc(100% - 42px);
    margin: 21px clamp(26px, 4vw, 64px);
    padding: clamp(20px, 1.8vw, 28px);
    overflow: auto;
    border-radius: 22px;
    box-shadow: 0 16px 42px rgba(0, 0, 0, .14);
}

.cosmos-slide__number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    margin-bottom: 13px;
    border: 1px solid currentColor;
    border-radius: 50%;
    font-size: 11px;
    font-weight: 700;
}

.cosmos-slide__title {
    margin: 0 0 13px;
    font-size: clamp(29px, 2.8vw, 48px);
    line-height: 1.03;
    letter-spacing: -.035em;
}

.cosmos-slide__text {
    font-size: clamp(15px, .95vw, 17px);
    line-height: 1.5;
}

.cosmos-slide__text > :first-child {
    margin-top: 0;
}

.cosmos-slide__text > :last-child {
    margin-bottom: 0;
}

.cosmos-slide__dots {
    position: absolute;
    right: 20px;
    bottom: 18px;
    z-index: 10;
    display: flex;
    gap: 8px;
}

.cosmos-slide__dot {
    width: 9px;
    height: 9px;
    padding: 0;
    border: 0;
    border-radius: 99px;
    background: rgba(255,255,255,.55);
    cursor: pointer;
    transition: width 220ms ease, background 220ms ease;
}

.cosmos-slide__dot.is-active {
    width: 28px;
    background: #fff;
}

@media (max-width: 1024px) {
    .cosmos-slide {
        --cosmos-slide-height: min(68vh, 650px);
        --cosmos-scroll-step: 75px;
    }

    .cosmos-slide__content {
        width: min(46vw, 500px);
    }
}

@media (max-width: 767px) {
    .cosmos-slide--mobile-cards .cosmos-slide__spacer {
        height: auto;
        min-height: 0;
    }

    .cosmos-slide--mobile-cards .cosmos-slide__viewport {
        position: relative;
        top: auto;
        height: auto;
        min-height: 0;
        max-height: none;
        overflow: visible;
    }

    .cosmos-slide--mobile-cards .cosmos-slide__stage {
        display: grid;
        gap: 16px;
        height: auto;
        padding: 14px;
        overflow: visible;
    }

    .cosmos-slide--mobile-cards .cosmos-slide__item {
        position: relative;
        inset: auto;
        min-height: 62vh;
        opacity: 1;
        visibility: visible;
        transform: none !important;
        pointer-events: auto;
        overflow: hidden;
        border-radius: 18px;
    }

    .cosmos-slide--mobile-cards .cosmos-slide__image,
    .cosmos-slide--mobile-cards .cosmos-slide__overlay {
        border-radius: 18px !important;
    }

    .cosmos-slide--mobile-cards .cosmos-slide__dots {
        display: none;
    }

    .cosmos-slide__content {
        width: calc(100% - 28px);
        max-width: none;
        margin: 14px;
        padding: 20px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cosmos-slide__item,
    .cosmos-slide__dot {
        transition: none !important;
    }
}


/* Versione 7.1: riduce al minimo lo spazio dopo lo scrollytelling */
.cosmos-slide__spacer {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.cosmos-slide {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.elementor-widget-cosmos_slide_scrollytelling,
.elementor-widget-cosmos_slide_scrollytelling > .elementor-widget-container {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}


/* Versione 7.2: nessuna fascia tra scrollytelling e sezione successiva */
.cosmos-slide,
.cosmos-slide__spacer,
.elementor-widget-cosmos_slide_scrollytelling,
.elementor-widget-cosmos_slide_scrollytelling > .elementor-widget-container {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.elementor-widget-cosmos_slide_scrollytelling + .elementor-element,
.elementor-widget-cosmos_slide_scrollytelling + .e-con {
    margin-top: 0 !important;
}

/* Evita una riga vuota dovuta alla baseline del widget */
.elementor-widget-cosmos_slide_scrollytelling {
    line-height: 0;
}

.elementor-widget-cosmos_slide_scrollytelling .cosmos-slide {
    line-height: normal;
}