/* ===== PDP body layout: left gallery (500px) | right content (1fr) ===== */
.catalog-product-view .column.main{
    display:grid;
    grid-template-columns:500px minmax(0,1fr);
    column-gap:40px;
    align-items:start;
}
/* gallery left, info right (override blank's floats) */
.catalog-product-view .column.main .product.media{order:1;float:none;width:auto;margin:0;max-width:none}
.catalog-product-view .column.main .product-info-main{order:2;float:none;width:auto}
/* everything else (reviews, tabs, related, upsell) spans full width below */
.catalog-product-view .column.main > *:not(.product.media):not(.product-info-main){
    grid-column:1 / -1;
    order:3;
}
/* stack on tablet / mobile */
@media (max-width:980px){
    .catalog-product-view .column.main{grid-template-columns:1fr;column-gap:0}
    .catalog-product-view .column.main .product.media,
    .catalog-product-view .column.main .product-info-main{grid-column:1 / -1}
}

/* ===== Full-width PDP — column.main spans the whole viewport like the homepage =====
   Cap removed (max-width:none) so it's full-width; left/right padding matches the
   homepage blocks (.wrap{padding:0 28px}) so content has the same side gutter. */
.catalog-product-view .page-main,
.catalog-product-view .breadcrumbs{
    max-width:none;
    padding-left:60px;
    padding-right:60px;
    box-sizing:border-box;
}