.products {
    margin-top: calc(170 / 16 * 1rem);
}

.products__title {
    text-align: center;
    font-size: calc(60 / 16 * 1rem);
    margin-bottom: 1rem;
    color: var(--main);
    font-weight: bold;
}
html:lang(en) .products__title {
    font-size: calc(50 / 16 * 1rem);
}

.products__desc {
    text-align: center;
    font-size: calc(20 / 16 * 1rem);
    color: var(--main);
    max-width: calc(610 / 16 * 1rem);
    margin: auto;
    margin-bottom: calc(60 / 16 * 1rem);
}

.sliders-wrapper {
    position: relative;
}

.slider {
    margin-bottom: 1.5rem;
    height: fit-content;
}

.swiper-slide {
    border-radius: 1.2rem;
    width: calc(380 / 16 * 1rem) !important;
    height: calc(240 / 16 * 1rem) !important;
    opacity: 1;
    border-radius: 20px;

    overflow: hidden;
}

.swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Fade Layers */
.fade-layer {
    position: absolute;
    top: 0;
    width: 9rem;
    height: 100%;
    z-index: 10;
    pointer-events: none;
}

/* الشمال */
.fade-layer.left {
    left: 0;
    background: linear-gradient(
        to right,
        #ffffff 0%,
        rgba(255, 255, 255, 0.85) 30%,
        rgba(255, 255, 255, 0.4) 60%,
        rgba(255, 255, 255, 0) 100%
    );
}

/* اليمين */
.fade-layer.right {
    right: 0;
    background: linear-gradient(
        to left,
        #ffffff 0%,
        rgba(255, 255, 255, 0.85) 30%,
        rgba(255, 255, 255, 0.4) 60%,
        rgba(255, 255, 255, 0) 100%
    );
}

/* Responsive */
@media (max-width: 992px) {
    .swiper-slide {
        width: 20rem !important;
        height: 12 rem !important;
    }
}

@media (max-width: 768px) {
    .swiper-slide {
        width: 15rem !important;
        height: 11rem !important;
    }
}

@media (max-width: 480px) {
    .swiper-slide {
        width: 13rem !important;
        height: 10rem !important;
    }
}