@import 'product_detail.css';

/* Style 2: Modern Reverse - Info left, image right */
.view-2 {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 4rem;
}

.view-2 .product-gallery {
    grid-column: 2;
    grid-row: 1;
}

.view-2 .product-details {
    grid-column: 1;
    grid-row: 1;
}

@media (max-width: 1024px) {
    .view-2 {
        grid-template-columns: 1fr;
    }

    .view-2 .product-gallery {
        grid-column: 1;
        grid-row: 1;
    }

    .view-2 .product-details {
        grid-column: 1;
        grid-row: 2;
    }
}