.single-products {
    padding-top: 102px;

    .container {
        padding: 0 140px;

        /* Tablet */
        @media (max-width: 1024px) {
            padding: 0 60px;
        }

        /* Mobile */
        @media (max-width: 767px) {
            padding: 0 20px;
        }
    }
    
    /* Brand Logo */
    .brand-logo {

        .brand-logo__container {
            display: flex;
            justify-content: center;
            padding-top: 20px;
            padding-bottom: 20px;

            /* Mobile */
            @media (max-width: 767px) {

                img {
                    max-width: 295px;
                    height: auto;
                }
            }
        }
    }

    /* Product Content */
    .product-content {
        padding-bottom: 52px;

        /* Mobile */
        @media (max-width: 767px) {
            padding-top: 20px;
        }
    }

    .product-content__top-container {
        display: flex;
        justify-content: space-between;
        align-items: center;

        /* Mobile */
        @media (max-width: 767px) {
            flex-wrap: wrap;
        }
    }

    .product-content__gallery {
        max-width: 55%;

        /* Mobile */
        @media (max-width: 767px) {
            max-width: 100%;
        }

        .swiper {
            padding-bottom: 40px;

            .swiper-slide  {
                display: flex;
                justify-content: center;
                align-items: center;
    
                img,
                video {
                    max-width: 100%;
                    height: auto;
                    display: block;
                }
            }

            .swiper-slide-thumb-active { 
                display: none; 
            }
    
            .swiper-pagination {
                
                .swiper-pagination-bullet {
                    width: 18px;
                    height: 18px;
                    background-color: #322f2f;
                }
    
                .swiper-pagination-bullet-active {
                    background-color: #888888;
                }
            }
        }
    }

    .product-content__summary-container {
        max-width: 40%;
        padding-top: 52px;

        /* Mobile */
        @media (max-width: 767px) {
            max-width: 100%;
            padding-top: 32px;
        }
    }

    .product-content__summary-title {
        font-size: 45px;
        font-weight: 700;

        span {
            display: block;
            font-size: 26px;
            font-weight: 500;
        }
    }

    .product-content__summary-description {
        margin-top: 32px;

        p,
        a,
        li {
            font-size: 18px;
        }

        ul {
            list-style-type: disc;
            list-style-position: inside;
        }
    }

    .product-content__summary-cta {
        font-size: 22px;
        font-weight: 700;
        color: #fff;
        background-color: #BEC928;
        border-radius: 12px;
        width: max-content;
        padding: 12px 24px;
        margin-top: 60px;
        transition: .2s linear;

        &:hover {
            box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.25);
            transition: .2s linear;
        }

        /* Mobile */
        @media (max-width: 767px) {
            text-align: center;
            width: 100%;
            margin-top: 42px;
        }
    }

    .product-content__bottom-container {
        margin-top: 52px;
        margin-bottom: 32px;
    }

    .product-content__thumbs {
        margin-top: 16px;

        .swiper-slide {
            border-radius: 8px;
            overflow: hidden;
            cursor: pointer;

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

    /*.thumb-video-placeholder {
        width: 100%;
        height: 100%;
        background: #f0f0f0;
        position: relative;
        display: grid;
        place-items: center;
    }
    .thumb-video-placeholder .play-icon {
        width: 0;
        height: 0;
        border-left: 14px solid #444;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
    }*/

    /* Related Products */
    .related-products__header {
        text-align: center;
        padding: 26px;
    }

    .related-products__title {
        font-size: 45px;
        font-weight: 600;

        /* Mobile */
        @media (max-width: 767px) {
            font-size: 36px;
        }
    }

    .related-products__container {
        display: flex;
        justify-content: center;
        gap: 30px;
        padding-top: 42px;
        padding-bottom: 82px;

        /* Mobile */
        @media (max-width: 767px) {
            flex-wrap: wrap;
        }
    }

    .related-products__item {
        position: relative;
        width: 100%;

        &:hover {

            .related-products__img--primary { 
                opacity: 0; 
            }
            .related-products__img--rollover { 
                opacity: 1; 
            }
        }
    }

    .related-products__item-permalink {
        position: absolute;
        inset: 0;
        z-index: 2;
    }

    .related-products__item-image {
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;

        img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: opacity .3s ease;
        }
    }

    .related-products__img--rollover {
        position: absolute;
        inset: 0;
        opacity: 0;
    }

    .related-products__line-divider {
        width: 80%;
        height: 5px;
        border-radius: 6px;
        margin: 0 0 22px 10%;
    }

    .related-products__item-title {
        font-size: 25px;
        font-weight: 700;
        text-align: center;

        span {
            display: block;
            font-weight: 500;
        }
    }

    .related-products__back-cta {
        font-size: 22px;
        font-weight: 700;
        color: #fff;
        background-color: #BEC928;
        border-radius: 12px;
        width: max-content;
        padding: 12px 24px;
        margin: 0px auto 60px;
        transition: .2s linear;

        &:hover {
            box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.25);
            transition: .2s linear;
        }

        /* Mobile */
        @media (max-width: 767px) {
            margin: 0px auto 42px;
        }   
    }
}