.twz-slider {
    --slider-padding-block: var(--padding-large, 9rem);
    --slider-padding-inline: 5rem;
    --slider-column-gap: 6rem;
    --slider-content-max: 44rem;
    --slider-header-gap: 0.8rem;
    --slider-nav-gap: 0.4rem;
    --slider-actions-gap: 2.4rem;
    --slider-actions-offset: 2.3rem;
    --slider-gallery-gap: 2rem;
    --slider-image-height: 39.6rem;
    --slider-label-color: var(--green-500, #5aad5a);
    --slider-title-color: var(--grey-50, #e5e2e1);
    --slider-nav-color: var(--green-500, #5aad5a);
    --slider-nav-size: 2.4rem;
    --slider-inline-padding: max(
        var(--slider-padding-inline),
        calc((100vw - min(100vw, var(--row-xl, 140rem))) / 2)
    );

    width: 100%;
    overflow: clip;

    @media (max-width: 1024px) {
        --slider-padding-block: var(--padding-medium, 6rem);
        --slider-padding-inline: var(--padding-medium, 3rem);
        --slider-column-gap: 4rem;
        --slider-image-height: 28rem;
    }

    @media (max-width: 767px) {
        --slider-padding-block: var(--padding-medium, 4.5rem);
        --slider-padding-inline: var(--padding-small, 1.5rem);
        --slider-column-gap: 3rem;
        --slider-image-height: 24rem;
    }

    .twz-slider__wrapper {
        padding-block: var(--slider-padding-block);
        padding-inline-start: var(--slider-inline-padding);
    }

    .twz-slider__layout {
        display: grid;
        grid-template-columns: minmax(0, var(--slider-content-max)) minmax(0, 1fr);
        gap: var(--slider-column-gap);
        align-items: start;

        @media (max-width: 1024px) {
            grid-template-columns: 1fr;
        }
    }

    .twz-slider__content {
        display: flex;
        flex-direction: column;
        gap: 2rem;
        min-width: 0;
    }

    .twz-slider__header {
        display: flex;
        flex-direction: column;
        gap: var(--slider-header-gap);
    }

    .twz-slider__label {
        margin: 0;
        color: var(--slider-label-color);
        font-family: var(--font-base);
        font-size: 1.4rem;
        font-weight: 400;
        line-height: 1;
        letter-spacing: 0.1rem;
        text-transform: uppercase;
    }

    .twz-slider__title {
        margin: 0;
        color: var(--slider-title-color);
        font-family: var(--font-special);
        font-size: var(--fs-72, 7.2rem);
        font-weight: 600;
        line-height: 1;
        letter-spacing: -0.144rem;
        text-transform: uppercase;
        word-break: break-word;

        @media (max-width: 1024px) {
            font-size: var(--fs-48, 4.8rem);
        }

        @media (max-width: 767px) {
            font-size: var(--fs-40, 4rem);
        }
    }

    .twz-slider__nav {
        display: inline-flex;
        align-items: center;
        gap: var(--slider-nav-gap);
        color: var(--slider-nav-color);
    }

    .twz-slider__nav-btn {
        --twz-icon-fill: var(--white);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        inline-size: var(--slider-nav-size);
        block-size: var(--slider-nav-size);
        padding: 0;
        border: 0;
        background: transparent;
        color: inherit;
        cursor: pointer;
        transition: opacity 0.25s;

        &:disabled {
            opacity: 0.35;
            cursor: not-allowed;
        }

        &:not(:disabled):is(:hover, :focus-visible) {
            opacity: 0.75;
        }
    }

    .twz-slider__nav-icon {
        display: inline-flex;
        inline-size: 1.6rem;
        block-size: 1.6rem;

        svg {
            inline-size: 100%;
            block-size: 100%;

            path {
                fill: currentcolor;
            }
        }
    }

    .twz-slider__nav-icon--prev {
        rotate: 180deg;
    }

    .twz-slider__counter {
        min-inline-size: 6.2rem;
        color: inherit;
        font-family: var(--font-base);
        font-size: 1.4rem;
        font-weight: 400;
        line-height: 1;
        letter-spacing: 0.1rem;
        text-align: center;
        text-transform: uppercase;
    }

    .twz-slider__actions {
        display: flex;
        flex-wrap: wrap;
        gap: var(--slider-actions-gap);
        padding-block-start: var(--slider-actions-offset);
    }

    .twz-slider__gallery {
        min-width: 0;
        margin-inline-end: calc(-1 * max(0px, (100vw - 100%) / 2));
        overflow: clip;

        @media (max-width: 1024px) {
            margin-inline-end: 0;
        }
    }

    .twz-slider__track {
        block-size: var(--slider-image-height);
    }

    .twz-slider__track .flickity-viewport {
        block-size: 100%;
    }

    .twz-slider__slide {
        block-size: var(--slider-image-height);
        margin-block: 0;
        margin-inline-end: var(--slider-gallery-gap);
        overflow: clip;
    }

    .twz-slider__image {
        display: block;
        block-size: 100%;
        inline-size: auto;
        max-inline-size: none;
        -o-object-fit: cover;
           object-fit: cover;
    }
}

