.hg-carousel{
    --hg-carousel-width:85vw;

    position:relative;
    width:var(--hg-carousel-width);
    max-width:1600px;
    overflow:hidden;
    margin:1rem auto 0rem auto;
}

.hg-viewport{
    overflow:hidden;
    width:100%;
    touch-action:pan-y;
}

.hg-track{
    display:flex;
    align-items:center;
    gap:18px;
    transition:transform .35s ease;
    cursor:grab;
    will-change:transform;
}

.hg-track.dragging{
    cursor:grabbing;
    transition:none;
}

.hg-slide{
    flex:0 0 auto;

    display:flex;
    justify-content:center;
    align-items:center;

    /*opacity:.65;*/
    /*transform:scale(.94);*/
    /*transition:opacity .35s ease, transform .35s ease;*/
}

.hg-slide.is-active{
    opacity:1;
    transform:scale(1);
}

.hg-slide img{
    display:block;

    width:auto;
    height:100%;

    max-width:100%;
    max-height:100%;

    object-fit:contain;

    border-radius:0;

    user-select:none;
    -webkit-user-select:none;
    -webkit-user-drag:none;
    pointer-events:none;
}

.hg-arrow{

    position:absolute;
    top:50%;
    transform:translateY(-50%);
    z-index:20;

    width:38px;
    height:38px;

    border:0;
    border-radius:50%;

    background:rgba(255,255,255,.65);
    backdrop-filter:blur(4px);

    color:#555;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:22px;
    font-weight:300;

    cursor:pointer;

    user-select:none;
    -webkit-user-select:none;
    transition:all .2s ease;

}

.hg-arrow:hover{

    background:rgba(255,255,255,.92);
    color:#000;

    transform:translateY(-50%) scale(1.08);

}

.hg-prev{
    left:10px;
}

.hg-next{
    right:10px;
}

.hg-arrow:hover{
    background:#fff;
}

.hg-arrow:disabled{
    opacity:.35;
    cursor:default;
}

@media (hover:none){

    .hg-arrow{
        display:none;
    }

}

.margin-scroll {
    scroll-margin-top: 4rem;
}