.s-product{
    padding-top:1.25rem;
    padding-bottom:2.5rem;
}
.single-content{
    display:flex;
    flex-direction:column-reverse;
    flex-wrap:wrap;
    gap:3.75rem;
}
.single-content aside{
    width:100%;
}
.single-content article{
    width:100%;
}
.single-content aside .aside-content{
    position:relative;
    display:flex;
    flex-wrap:nowrap;
    flex-direction:row;
    align-items:flex-start;
    align-content:flex-start;
    justify-content:flex-start;
    width:100%;
    max-width:100%;
    height:100%;
    min-height:inherit;
}
.single-content aside .aside-content .top-sticky{
    position:sticky;
    position:-webkit-sticky;
    flex-basis:calc(100% - .063rem);
    width:calc(100% - .063rem);
    top:0;
}
.single-content aside .inner{
    padding:1.25rem 0 0;
}
.single-content aside .inner > div+div{
    margin-top:5rem;
}
.product-desc{
    line-height:var(--lh-base);
    letter-spacing:var(--ls-base);
}
.product-details{
    letter-spacing:var(--ls-base);
}
.product-details h4{
    font-size:var(--fs-base);
}
.product-details > *{
    margin-bottom:.938rem;
    padding-bottom:.938rem;
    border-bottom:.063rem solid var(--hex-primary);
}
.product-details dl{
    display:flex;
    gap:1.25rem;
}
.primary-btn a{
    width:100%;
}
.product-imgs > div+div{
    margin-top:1.25rem;
}
.product-img{
    line-height:0;
}
.product-img a{
    display:inline-block;
    width:100%;
    overflow:hidden;
}
.product-img a img{
    transition:transform .6s ease;
}
.photo-lightbox{
    position:fixed;
    z-index:99999;
    display:flex;
    align-items:center;
    justify-content:center;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,.85);
    visibility:hidden;
    opacity:0;
}
.photo-lightbox.active{
    visibility:visible;
}
.photo-lightbox-inner{
    position:relative;
    max-width:90vw;
    max-height:90vh;
    display:flex;
    align-items:center;
    justify-content:center;
}
.photo-lightbox-img{
    max-width:100%;
    max-height:90vh;
    object-fit:contain;
    opacity:0;
    transform:scale(0.9);
}
.photo-lightbox-close{
    position:absolute;
    top:20px;
    right:30px;
    width:50px;
    height:50px;
    cursor:pointer;
    z-index:100000;
    opacity:0;
}
.photo-lightbox-close::before,
.photo-lightbox-close::after{
    content:'';
    position:absolute;
    top:50%;
    left:50%;
    width:1.875rem;
    height:.125rem;
    background:var(--hex-background);
}
.photo-lightbox-close::before{
    transform:translate(-50%,-50%) rotate(45deg);
}
.photo-lightbox-close::after{
    transform:translate(-50%,-50%) rotate(-45deg);
}
.photo-lightbox-close:hover::before,
.photo-lightbox-close:hover::after{
    background:var(--hex-background);
}
.photo-lightbox-nav{
    position:absolute;
    display:flex;
    align-items:center;
    justify-content:center;
    top:50%;
    transform:translateY(-50%);
    width:3.125rem;
    height:3.125rem;
    cursor:pointer;
    z-index:100000;
    opacity:0;
}
.photo-lightbox-prev{
    left:1.25rem;
}
.photo-lightbox-next{
    right:1.25rem;
}
.photo-lightbox-nav::before{
    content:'';
    width:.938rem;
    height:.938rem;
    border-left:.125rem solid var(--hex-background);
    border-bottom:.125rem solid var(--hex-background);
}
.photo-lightbox-prev::before{
    transform:rotate(45deg);
    margin-left:.313rem;
}
.photo-lightbox-next::before{
    transform:rotate(-135deg);
    margin-right:.313rem;
}
.photo-lightbox-nav:hover::before{
    border-color:var(--hex-background);
}
.photo-lightbox-counter{
    font-size:var(--fs-base);
    position:absolute;
    bottom:1.25rem;
    left:50%;
    transform:translateX(-50%);
    color:var(--hex-background);
    opacity:0;
}
.photo-lightbox-loader{
    position:absolute;
    width:2.5rem;
    height:2.5rem;
    border:.125rem solid rgba(255,255,255,.2);
    border-top-color:var(--hex-background);
    border-radius:50%;
    animation:lightbox-spin 0.8s linear infinite;
    opacity:0;
    visibility:hidden;
}
.photo-lightbox-loader.active{
    opacity:1;
    visibility:visible;
}
/*-- Media Queries --*/
@media screen and  (min-width: 64rem){
    .single-content{
        flex-wrap:nowrap;
        flex-direction:row-reverse;
    }
    .single-content aside{
        width:35%;
    }
    .single-content article {
        width:65%;
    }
    .s-product{
        padding-top:2.5rem;
    }
}
/*-- keyframes --*/
@keyframes lightbox-spin{
    to{
        transform:rotate(360deg);
    }
}