/* ===========================
   J-Net Carousel
=========================== */

.hero-carousel{
    display:flex;
    justify-content:flex-end;
    align-items:center;
    width:100%;
}

#carousel-container{
    position:relative;
    width:100%;
    max-width:860px;
    height:560px;
    border-radius:28px;
    overflow:hidden;
    box-shadow:0 25px 50px rgba(0,0,0,.20);
}

.sc-carousel{
    position:relative;
    width:100%;
    height:100%;
}

.sc-slide{
    position:absolute;
    inset:0;
    opacity:0;
    transition:opacity .6s ease;
}

.sc-slide.active{
    opacity:1;
    z-index:2;
}

.sc-slide img{
    width:100%;
    height:100%;
    display:block;

    object-fit:cover;
    object-position:center center;

    user-select:none;
    -webkit-user-drag:none;

    backface-visibility:hidden;
    -webkit-backface-visibility:hidden;

    transform:translateZ(0);
}

.sc-btn{
    position:absolute;
    top:50%;
    transform:translateY(-50%);

    width:54px;
    height:54px;

    border:none;
    border-radius:50%;

    background:rgba(0,0,0,.35);
    color:#fff;

    font-size:30px;
    cursor:pointer;

    transition:.25s;
    z-index:10;
}

.sc-btn:hover{
    background:rgba(0,0,0,.55);
}

.sc-prev{
    left:18px;
}

.sc-next{
    right:18px;
}

/* ===========================
   Tablet
=========================== */

@media (max-width:1100px){

    #carousel-container{
        height:500px;
    }

}

/* ===========================
   Mobile
=========================== */

@media (max-width:900px){

    .hero-carousel{
        justify-content:center;
    }

    #carousel-container{
        width:100%;
        max-width:100%;
        height:500px;
        border-radius:22px;
    }

    .sc-btn{
        width:46px;
        height:46px;
        font-size:26px;
    }

}

/* ===========================
   Small Phones
=========================== */

@media (max-width:480px){

    #carousel-container{
        width:100%;
        height:460px;
    }

    .sc-btn{
        width:42px;
        height:42px;
        font-size:22px;
    }

}