.labels-section {
    position: relative;
    background-color: var(--black);
    color: white;
    padding-bottom: 6.25rem;
}

.label-main-image-wrapper {
    img {
        width: stretch;
        width: -webkit-fill-available;
        width: -moz-available;
        height: stretch;
        height: -webkit-fill-available;
        height: -moz-available;
        max-height: 982px;
        object-fit: cover;
        margin-inline: auto;
        border-radius: 0 0 32px 32px;
    }
}

.labels__heading {
    margin-top: 8.75rem;
    margin-bottom: 2.06rem;
}

.labels-text-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 70px;
}

.labels-text-col--secondary {
    color: #C3C3C3; 
}

.labels__visit-us-button {
    margin-top: 2.19rem
}

/* liquid glass bar */
.labels-section {
    .liquid-glass-wrapper {
        margin-top: 6.25rem;
        max-width: 87.5rem;
    }

    .glass-text-bar__text-wrapper {
        transform: translateX(1rem);
        width: fit-content;
    }
}

/* slider */
.labels-slider-container {
    margin-top: 6.25rem;
}

.labels-swiper {
    border-radius: 32px;
    height: 360px;
}

.labels-swiper-slide {
    img {
        width: 100%;
        height: 360px;
        object-fit: cover;
    }
}

.labels-swiper-controls-wrapper {
    position: absolute;
    bottom: 26px;
    left: 26px;
    z-index: 5;
    padding-inline: 16px;
    height: 48px;
    gap: 16px;
    border-radius: 32px;
    background-color: rgba(255, 255, 255, 0.3);
    display: flex;
    align-items: center;

    .labels-swiper-pagination {
        display: flex;
        align-items: center;
    }

    .swiper-pagination-bullet {
        background-color: #5f5f5f;
        width: 7px;
        height: 7px;
    }

    .swiper-pagination-bullet-active {
        background-color: white;
        width: 9px;
        height: 9px;
    }
}

.labels-slider-pause-button {
    background-color: transparent;
    border: none;
    width: 14px;
    cursor: pointer;

    .labels-slider-pause-icon {
        height: 16px;
    }

    .labels-slider-play-icon {
        height: 24px;
        transform: translateX(-5px);
    }
}

/* mobile styles */
@media (max-width: 806px) {
    .labels-section {
        .liquid-glass-wrapper {
            margin: 0;
            transform: translateY(-50%);
        }
    }
    .labels-text-grid {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }

    .labels__heading { 
        margin-top: calc(8.75rem -  (5.75rem / 2));
    }

    .label-main-image-wrapper {
        background-color: white;
        width: 100%;
        overflow: hidden;
        height: 671px;

        img {
            height: 670px;
            transform: translateY(1px);
            max-height: none;
            background-color: white;
            border-radius: 64px 64px 0 0;
        }
    }

    .labels-swiper {
        height: 552px;
    }

    .labels-swiper-slide {
        img {
            height: 552px;
        }
    }
}