/* Gutenberg page groups and WooCommerce classic shortcodes. Content remains in WP. */
.yy-b2b { background: var(--yy-white); color: var(--yy-body); }
.yy-b2b h1, .yy-b2b h2, .yy-b2b h3 { color: var(--yy-heading); }
.yy-b2b a { color: var(--yy-accent); }
.yy-b2b .yy-button, .yy-b2b .wp-block-button__link { background: var(--yy-accent); color: var(--yy-on-red); border-radius: .25rem; font-weight: 700; }
.yy-b2b .yy-button:hover, .yy-b2b .wp-block-button__link:hover { background: var(--yy-brand-red-hover); color: var(--yy-on-red); }
.yy-b2b .yy-hero { background: var(--yy-charcoal); border-bottom: 1px solid var(--yy-line); padding: clamp(4rem, 9vw, 9rem) clamp(1.25rem, 5vw, 5rem); }
.yy-b2b .yy-hero h1, .yy-b2b .yy-hero h2 { color: var(--yy-on-dark); }
.yy-b2b .yy-hero h1 { max-width: 18ch; font-size: clamp(2.4rem, 5vw, 4.8rem); line-height: 1.06; }
.yy-b2b .yy-hero p { color: var(--yy-on-dark-muted); }
.yy-b2b .yy-hero .yy-kicker { color: var(--yy-on-dark-muted); }
.yy-b2b .yy-section { max-width: 1240px; padding: clamp(2.5rem, 5vw, 5rem) clamp(1.25rem, 4vw, 3rem); }
.yy-b2b .yy-kicker { color: var(--yy-accent); text-transform: uppercase; font-size: .76rem; font-weight: 700; letter-spacing: .16em; }
.yy-b2b .yy-section-intro { max-width: 62ch; }
.yy-b2b .yy-products form { display: grid; grid-template-columns: minmax(12rem, 2fr) minmax(10rem, 1fr) auto; align-items: end; gap: .8rem; }
.yy-b2b .yy-products form label { grid-row: 1; }
.yy-b2b .yy-products form input, .yy-b2b .yy-products form select { grid-row: 2; width: 100%; min-height: 3rem; background: var(--yy-white); color: var(--yy-heading); border: 1px solid var(--yy-field-line); border-radius: .25rem; }
.yy-b2b .yy-products form button { grid-row: 2; min-height: 3rem; padding-inline: 1.4rem; background: var(--yy-accent); color: var(--yy-on-red); border: 0; border-radius: .25rem; font-weight: 700; }
.yy-b2b .yy-product-card, .yy-b2b .yy-card, .yy-b2b .woocommerce ul.products li.product { background: var(--yy-white); color: var(--yy-body); border: 1px solid var(--yy-edge); border-radius: .35rem; overflow: hidden; padding: 1rem; }
.yy-b2b .yy-product-card h2, .yy-b2b .yy-card h2, .yy-b2b .woocommerce ul.products li.product .woocommerce-loop-product__title { color: var(--yy-heading); font-size: 1.2rem; }
.yy-b2b .yy-product-card img, .yy-b2b .yy-card img, .yy-b2b .woocommerce ul.products li.product img { width: 100%; aspect-ratio: 4 / 3; object-fit: contain; background: var(--yy-surface); margin: 0 0 1rem; }
.yy-b2b .yy-product-card a, .yy-b2b .yy-card a, .yy-b2b .woocommerce ul.products li.product a { color: var(--yy-accent); }
.yy-b2b .woocommerce ul.products { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.2rem; margin: 0; }
.yy-b2b .woocommerce ul.products::before, .yy-b2b .woocommerce ul.products::after { display: none; }
.yy-b2b .woocommerce ul.products li.product { width: auto; margin: 0; float: none; }
.yy-b2b .woocommerce ul.products li.product .price, .yy-b2b .woocommerce ul.products li.product .button { display: none; }
.yy-b2b .yy-card-grid, .yy-b2b .yy-product-grid { display: grid; gap: 1.2rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.yy-b2b .yy-breadcrumbs { color: var(--yy-muted); }

/* WooCommerce's classic single-product template owns the gallery and data. */
body.single-product .site-content { background: var(--yy-white); color: var(--yy-body); }
body.single-product .site-content h1, body.single-product .site-content h2, body.single-product .site-content h3 { color: var(--yy-heading); }
body.single-product .site-content a { color: var(--yy-accent); }
body.single-product .woocommerce div.product { padding: clamp(1.25rem, 4vw, 3rem) 0; }
body.single-product .woocommerce div.product div.images img { background: var(--yy-surface); border: 1px solid var(--yy-edge); border-radius: .35rem; object-fit: contain; }
body.single-product .woocommerce div.product .product_title { font-size: clamp(2rem, 4vw, 3.5rem); line-height: 1.08; }
body.single-product .woocommerce div.product .woocommerce-product-details__short-description { max-width: 62ch; }
body.single-product .yy-product-specs, body.single-product .yy-product-video, body.single-product .yy-related, body.single-product .yy-enquiry { clear: both; background: var(--yy-panel); border: 1px solid var(--yy-edge); border-radius: .35rem; padding: clamp(1.25rem, 3vw, 2rem); margin-block: 1.4rem; }
body.single-product .yy-product-specs { overflow-x: auto; }
body.single-product .yy-product-specs table { width: 100%; min-width: 28rem; border-collapse: collapse; }
body.single-product .yy-product-specs th, body.single-product .yy-product-specs td { padding: .7rem; border-bottom: 1px solid var(--yy-edge); color: var(--yy-body); text-align: left; }
body.single-product .yy-enquiry input:not([type=checkbox]), body.single-product .yy-enquiry textarea { background: var(--yy-white); color: var(--yy-heading); border: 1px solid var(--yy-field-line); }
body.single-product .woocommerce div.product p.price, body.single-product .woocommerce div.product span.price, body.single-product .woocommerce div.product form.cart { display: none; }
body.single-product .woocommerce-tabs, body.single-product .related.products { clear: both; }
body.single-product .woocommerce-tabs .panel, body.single-product .woocommerce-tabs ul.tabs li { background: var(--yy-panel); color: var(--yy-mist); }
body.single-product .related.products ul.products { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.2rem; }
body.single-product .related.products ul.products li.product { width: auto; float: none; margin: 0; }

@media (max-width: 921px) {
  .yy-b2b .yy-card-grid, .yy-b2b .yy-product-grid, .yy-b2b .woocommerce ul.products, body.single-product .related.products ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .yy-b2b .yy-card-grid, .yy-b2b .yy-product-grid, .yy-b2b .woocommerce ul.products, body.single-product .related.products ul.products { grid-template-columns: minmax(0, 1fr); }
  .yy-b2b .yy-products form { display: flex; flex-direction: column; align-items: stretch; }
  .yy-b2b .yy-products form > * { width: 100%; }
  .yy-b2b .yy-hero { min-height: 0; }
  body.single-product .yy-product-specs table { font-size: .88rem; }
}
