/* ======== Another Pages - Hero =========
 ======================================== */
.hero-section {
    position: relative;
    display: flex;
    align-items: center;
    color: var(--white-color);
    height: 380px;
    width: 100%;
}

.hero-section h1 {
    font-size: 48px;
    font-weight: 700;
    margin-bottom: 16px;
    line-height: 66px;
    text-transform: capitalize;
}

.hero-section p {
    line-height: 30px;
}

.hero-section img.hero-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
[dir="rtl"] .hero-section img.hero-image
{
    transform: scaleX(-1);
}

.hero-section::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, #2d2b53 0%, #2d2b5300 100%);
    z-index: 7;
}
[dir="rtl"] .hero-section::before
{
    background: linear-gradient(to left, #2d2b53 0%, #2d2b5300 100%);
}

.hero-section .hero-content {
    position: absolute;
    z-index: 10;
    max-width: 70%;
    left: 5vw;
    right: 5vw;
}

.hero-section .swiper-button-next:after,
.hero-section .swiper-button-prev:after {
    display: none !important;
}

.hero-section .swiper-button-next.swiper-button-disabled,
.hero-section .swiper-button-prev.swiper-button-disabled {
    opacity: 1 !important;
}

.hero-section .hero-pattern {
    width: 170px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 6;
}

[dir="rtl"] .hero-section .hero-pattern {
    left: unset;
    right: 0;
}

.hero-section .hero-pattern img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
[dir="rtl"] .hero-section .hero-pattern img {
    transform: scaleX(-1);
}