/*
 * Coastal Supply — Product category archive overrides.
 *
 * The auto-generated breadcrumb / title / term description are removed in
 * inc/category-page.php so a Category Content entry (rendered into
 * `.coastal-category-content`) can serve as the entire category header.
 *
 * Astra wraps category archives in `.ast-container` with a 1440px max-width.
 * The product grid should keep that cap, but the linked CMS block must be
 * able to span the full viewport (e.g. full-bleed hero banner) the same way
 * Coastal Supply blocks render on Pages where Astra runs in page-builder
 * layout.
 *
 * The pattern: keep Astra's constrained container for everything else and
 * use a negative-margin escape hatch on `.coastal-category-content` only.
 * `50% - 50vw` stretches the box to the viewport edges regardless of
 * container width or padding, and individual blocks self-cap via their
 * own `__inner` (Hero Banner, Brand Section, etc.) so content stays
 * readable while backgrounds go edge-to-edge.
 *
 * Note on the parent chain: WooCommerce's archive-product template emits a
 * `<header class="woocommerce-products-header">` wrapper. Even when the
 * `<h1>` is suppressed by `woocommerce_show_page_title=false`, that
 * `<header>` still wraps the archive_description hook and therefore wraps
 * `.coastal-category-content`. The CSS below collapses the empty header to
 * a transparent layout box and resets its default rhythm so the CMS block
 * sits flush against the products grid.
 */

/* Astra's default `#primary { margin: 4em 0; }` adds vertical breathing
 * room above the page title — but since the title is now suppressed and a
 * full-bleed CMS block takes its place, the top margin creates a band of
 * white above the hero. Zero it out so the CMS block butts up against
 * the header, and the bottom margin too so the products grid sits flush
 * with the section spacing each block manages on its own. */
#primary {
	margin: 0;
}

.ast-woocommerce-container .woocommerce-products-header {
	margin: 0;
	padding: 0;
	text-align: inherit;
}

.coastal-category-content {
	width: auto;
	max-width: none;
	margin: 0 calc(50% - 50vw);
}

/* WooCommerce's empty-category notice and product loop stay inside the
 * parent .ast-container's 1440px cap — no override needed there. */
