.recent-wins {
    width: 100%;
    overflow: hidden;
    color: var(--color-white);
    background-color: #375E62;
    scroll-margin-top: 140px;

    .wrapper {
        width: min(calc(100% - 2rem), 80rem);
        margin-inline: auto;

        .recent-wins__heading {
            width: 100%;
            margin: 0 0 3rem;
            color: #d4edb5;
            font-family: var(--font-switzer-extrabold);
            font-size: clamp(3rem, calc(2.6479rem + 1.5023vw), 4rem);
            line-height: 1;
            text-align: center;
            @media (min-width: 768px) {
                text-align: left;
            }
        }

        .item-list {
            position: relative;
            width: 100%;
            visibility: visible;

            .splide__track {
                overflow: hidden;
                transition: height 0.35s ease;
            }

            .items {
                width: 100%;
                margin: 0;
                padding: 0;
                list-style: none;

                .win {
                    width: 100%;
                    min-width: 0;
                    margin: 0;
                    padding: 0;
                    list-style: none;

                    .win__image {
                        display: block;
                        width: 100%;
                        max-width: none;
                        height: auto;
                        aspect-ratio: 2 / 1;
                        object-fit: cover;
                        object-position: center;
                    }

                    .win__content {
                        margin-top: 2rem;

                        h3 {
                            margin: 0 0 0.25rem;
                            color: #d4edb5;
                            font-family: var(--font-switzer-semibold);
                            font-size: 2rem;
                            line-height: 1.25;
                        }

                        .blocktext {
                            color: var(--color-white);
                            font-family: var(--font-switzer-medium);
                            font-size: clamp(1rem, calc(0.956rem + 0.1878vw), 1.25rem);
                            line-height: 1.4;
                            opacity: 0.9;

                            & > :first-child {
                                margin-top: 0;
                            }

                            & > :last-child {
                                margin-bottom: 0;
                            }

                            p {
                                margin: 0;
                                color: inherit;
                                font: inherit;

                                & + p {
                                    margin-top: 1.5rem;
                                }
                            }
                        }
                    }
                }
            }

            .splide__arrows {
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 0.75rem;
                margin-top: 5rem;
                transition: margin-top 0.4s ease;

                @media (min-width: 768px) {
                    justify-content: left;
                    margin-top: 2rem;
                }

                .splide__arrow {
                    display: grid;
                    flex: 0 0 2.5rem;
                    width: 2.5rem;
                    height: 2.5rem;
                    margin: 0;
                    padding: 0;
                    appearance: none;
                    place-items: center;
                    color: inherit;
                    background: transparent;
                    border: 0;
                    border-radius: 0;
                    cursor: pointer;
                    opacity: 1;
                    transition: opacity 0.2s ease;

                    svg {
                        display: block;
                        width: 2.5rem;
                        height: 2.5rem;
                    }

                    &.splide__arrow--prev {
                        svg {
                            transform: rotate(180deg);
                        }
                    }

                    &:disabled {
                        cursor: default;
                        opacity: 0.35;
                    }

                    &:focus-visible {
                        outline: 2px solid var(--color-white);
                        outline-offset: 0.25rem;
                    }
                }
            }

            &:not(.is-initialized) {
                .items {
                    .win {
                        &:not(:first-child) {
                            display: none;
                        }
                    }
                }

                .splide__arrows {
                    display: none;
                }
            }

            &.is-initialized {
                .items {
                    display: flex;
                    align-items: flex-start;

                    .win {
                        flex: 0 0 100%;
                    }
                }
            }
        }

        .recent-wins__empty {
            margin: 0;
        }
    }

    @media (min-width: 768px) {

        .wrapper {
            .recent-wins__heading {
                position: relative;
                z-index: 2;
                width: 44.702%;
                min-height: 8rem;
                margin: 0;
            }

            .item-list {
                display: grid;
                grid-template-columns: 49.669% 45.364%;
                justify-content: space-between;
                min-height: max(30.75rem, calc(var(--recent-wins-arrow-top, 20.25rem) + 2.5rem));
                margin-top: -8rem;

                .splide__track {
                    grid-row: 1;
                    grid-column: 1 / -1;
                }

                .items {
                    .win {
                        display: grid;
                        grid-template-columns: 49.669% 45.364%;
                        justify-content: space-between;
                        align-items: start;
                        min-height: 30.75rem;

                        .win__image {
                            grid-column: 1;
                            margin-top: 12rem;
                        }

                        .win__content {
                            grid-column: 2;
                            margin-top: 5rem;
                        }
                    }
                }

                .splide__arrows {
                    grid-row: 1;
                    grid-column: 2;
                    align-self: start;
                    z-index: 2;
                    margin-top: var(--recent-wins-arrow-top, 20.25rem);
                }
            }
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .wrapper {
            .item-list {
                .splide__track,
                .splide__arrows,
                .splide__arrows .splide__arrow {
                    transition: none;
                }
            }
        }
    }
}