/* ----------------------
/ File: home-slider.css
/ Theme: Artender
/ Developer: sepehrdarvishii
/ Section: Home Slider Style
/ -------------------- */


/* ----------------------
/ Wrapper
/ -------------------- */

.artender-home-hero {
    width: 100%;
    direction: rtl;
    margin-top: 0;
    margin-bottom: var(--artender-home-section-gap, 14px);
}


.artender-home-slider {
    width: 100%;
    max-width: 1300px;
    margin: 0 auto;
    padding: 0 12px;

    position: relative;
    overflow: hidden;

    direction: rtl;
}


/* ----------------------
/ Slider Box
/ -------------------- */

.artender-home-slider-item {

    width: 100%;

    aspect-ratio: 1200 / 430;

    border-radius: 16px;

    overflow: hidden;

    background: #f4f4f4;

    box-shadow:
        0 8px 24px rgba(15,23,42,.12);

}


.artender-home-slider-item a {

    display: block;

    width: 100%;
    height: 100%;

}


.artender-home-slider-item img {

    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    object-position: center;

}



/* ----------------------
/ Animation
/ -------------------- */

.artender-home-slider-item {

    animation:
        artenderSliderFade
        .6s ease;

}


@keyframes artenderSliderFade {

    from {

        opacity: .4;

        transform:
        translateX(20px);

    }


    to {

        opacity: 1;

        transform:
        translateX(0);

    }

}



/* ----------------------
/ Hover Desktop
/ -------------------- */

@media (min-width:992px){


    .artender-home-slider-item {

        transition:
        transform .3s ease,
        box-shadow .3s ease;

    }


    .artender-home-slider-item:hover {

        transform:
        translateY(-3px);

        box-shadow:
        0 14px 35px rgba(15,23,42,.16);

    }

}



/* ----------------------
/ Mobile
/ -------------------- */

@media(max-width:991px){


    .artender-home-slider {

        margin:
        0 auto;

        padding:
        0 8px;

    }


    .artender-home-slider-item {

        border-radius:
        13px;

        aspect-ratio:
        1200 / 430;

    }


}



/* ----------------------
/ Small Mobile
/ -------------------- */

@media(max-width:420px){


    .artender-home-slider {

        padding:
        0 6px;

    }


    .artender-home-slider-item {

        border-radius:
        12px;

    }


}