.elementor-widget-product-box {
    --accent-color: var(--e-global-color-accent, #364151);
    --title-color: var(--e-global-color-primary, #364151);
    --text-color: var(--e-global-color-text, #0F172A);

    width: 100%;

    .container {
        display: flex;
        flex-direction: column;
        gap: 20px;

        .title {
            margin: 0;
            color: var(--title-color);
            font-size: 24px;
            font-weight: 600;
            line-height: normal;
            font-family: 'Poppins', serif;
        }

        .subtitle {
            margin: 0;
            color: var(--text-color);
            font-size: 18px;
            font-weight: 600;
            line-height: normal;
            font-family: 'Poppins', serif;
        }

        .container-content {
            display: flex;
            gap: 20px;

            .content-left {
                flex: 1;
                box-shadow: 0 0 10px 0 rgba(0,0,0,.15);
                border-radius: 15px;
                background-color: #f3f3f3;
                transition: all 0.3s;
                cursor: pointer;
                overflow: hidden;

                &:hover {
                    box-shadow: 0 0 30px 0 rgba(0,0,0,.15);

                    .image {
                        transform: scale(1.05);
                    }
                }

                .image {
                    width: 100%;
                    height: 100%;
                    object-fit: contain;
                    transition: all 0.3s;
                }
            }

            .content-right {
                flex: 1;
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                gap: 20px;
            }
        }
    }

    @media (max-width: 1024px) {
        .container-content {
            flex-direction: column !important;
        }

        .title {
            font-size: 18px !important;
        }
    }
}