.hero {
    position: relative;
    background: var(--alabaster);
    padding: 1.875rem 0rem 4.375rem 0rem;
}

.hero-slider {
    position: inherit !important;
    overflow: hidden;
}

.hero-slide {
    display: flex !important;
    align-items: center;
    gap: 3.625rem;
}

.hero-slide-image {
    flex: 0 0 31.875rem;
}

.hero-slide-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1.875rem;
}

.hero-slide-subtitle {
    font-family: var(--second-family);
    font-weight: 400;
    font-size: 1.125rem;
    line-height: 1.2;
    letter-spacing: 1%;
    text-transform: uppercase;
    color: var(--soft-orange);
}

.hero-slide-title {
    font-weight: 400;
    font-size: 5.5rem;
    line-height: 1.1;
    letter-spacing: 3%;
    text-transform: capitalize;
    color: var(--dark);
}

.hero-slide-title span {
    color: var(--soft-orange);
}

.hero-btn {
    margin-bottom: 1.875rem;
}

.swiper-pagination {
    z-index: 1 !important;
}

.swiper-pagination-bullet {
    width: 1rem !important;
    height: 1rem !important;
    margin: 0rem 0.625rem !important;
    background: none !important;
    box-sizing: border-box !important;
    border: 0.0625rem solid var(--dark) !important;
    opacity: 1 !important;
}

.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {
    position: relative !important;
    bottom: 0 !important;
}

.swiper-pagination-bullet-active {
    background: var(--dark) !important;
}

@media (max-width: 68.75rem) {
    .hero-slide-title {
        font-size: 4.5rem;
        line-height: 1;
    }
    .hero-slide-image {
        flex: 0 1 100%;
    }
    .hero-slide-content {
        gap: 0.9375rem;
    }
    .swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {
        bottom: 2.5rem !important;
    }
}

@media (max-width: 62.5rem) {
    .hero-slide-title {
        font-size: 4rem;
    }
}

@media (max-width: 48rem) {
    .hero-slide {
        flex-direction: column;
    }
    .hero-slide-image {
        width: 60%;
    }
    .hero-slide-content {
        max-width: 70%;
        margin: 0 auto;
    }
    .swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {
        bottom: 1.25rem !important;
    }
    .hero-slide-title {
        font-size: 3rem;
    }
}

@media (max-width: 37.5rem) {
    .hero-slide-content {
        max-width: 100%;
    }
    .hero-slide-image {
        width: 80%;
    }
}