/**
 * Page-title band on pages that use Blocksy's built-in title.
 *
 * The store pages -- Cart, Checkout, My Account, Shop -- render their heading through
 * Blocksy's page-title hero (`.hero-section[data-type="type-1"]` with `<h1 class="page-title">`),
 * dropped into the normal content flow. Blocksy then pads that flow with
 * `--theme-content-vertical-spacing` (60px desktop / 50px tablet) top and bottom, and the
 * hero adds its own `--margin-bottom` (40px) under the title. Result: the heading floats in
 * a ~100px void that the site's custom-built pages (Home, About, Contact, Blog) never show,
 * because those have no Blocksy title at all -- their heading lives in the page's own blocks.
 *
 * This tightens only the title band, restoring a deliberate vertical rhythm. Top spacing
 * stays larger than bottom on purpose: the heading should separate from the header above
 * and bind to the content it labels below (proximity). Values sit on an 8px scale.
 *
 * Loaded only on the four store pages (see the plugin's enqueue), so the wrapper selectors
 * are already scoped -- nothing here reaches product pages, the 404 title, or custom pages.
 * Priority 20 lands it after Blocksy's global.css so it wins on equal specificity.
 */

/* Space above the title: the content-flow wrapper's top padding.
   (0,2,0) beats Blocksy's `[data-vertical-spacing*=top]` at (0,1,0); its bottom padding --
   the gap under the whole page, above the footer -- is deliberately left untouched. */
.ct-container-full[data-vertical-spacing*="top"] {
	padding-top: 40px;
}

/* Space below the title, before the content. Blocksy's default is `--margin-bottom: 40px`. */
.hero-section[data-type="type-1"] {
	--margin-bottom: 24px;
}

@media only screen and ( max-width: 999px ) {
	.ct-container-full[data-vertical-spacing*="top"] {
		padding-top: 24px;
	}

	.hero-section[data-type="type-1"] {
		--margin-bottom: 16px;
	}
}

/**
 * Horizontal alignment: keep the block content on the theme grid.
 *
 * The page title (Blocksy's `is-width-constrained` hero) and the classic-shortcode pages
 * (My Account) already sit at the theme content width -- `--theme-block-max-width`, a 123px
 * left edge at desktop. The block Cart and Checkout are `alignwide`, so WooCommerce widens
 * them to the theme *wide* size instead: the cart ends up narrower than the title (its own
 * cap, in cart.css) and the checkout wider, so neither left edge matches the heading and the
 * two pages disagree with each other.
 *
 * Capping both blocks at the content width and centring them puts every store page -- title,
 * cart, checkout, account, and the shop grid -- on the same left edge. The descendant
 * selector (0,2,0) ties WooCommerce's `.is-layout-constrained > .alignwide` and, loading
 * after it, wins on source order. Cart is capped the same way in cart.css, its own home.
 */
.entry-content .wp-block-woocommerce-checkout {
	margin-inline: auto;
	max-width: var( --theme-block-max-width, 1290px );
}

/**
 * Responsive size for the store titles that are page content, not Blocksy's hero.
 *
 * Shop is the only one of the four that still renders Blocksy's `.page-title` hero. Cart,
 * Checkout and My Account carry their heading as an `<h1 class="wp-block-heading">` inside
 * the page's own blocks, so they miss Blocksy's per-title typography entirely and fall back
 * to the global `h1` rule -- a flat 40px with no tablet or mobile step. On a 375px phone
 * that leaves "Оформление заказа" wrapping to two 60px lines, a 120px slab of heading above
 * the form, while the Shop title beside it is 26px and the checkout's own section headings
 * ("Контактная информация" and the rest) are 20px.
 *
 * The steps below are Blocksy's own `woo_categories` title scale -- 40 / 32 / 26 at the
 * theme's 999px and 689px breakpoints -- so these three titles now match the Shop title
 * exactly at every width instead of only at desktop, where they already agreed. Setting
 * `--theme-font-size` rather than `font-size` keeps the theme's own mechanism in play, so
 * line-height and weight continue to come from the global heading rule.
 *
 * `.entry-content > h1` (0,1,1) beats the global `body, h1, h2, ...` rule at (0,0,1), and
 * matches nothing on Shop, whose title lives in `.entry-header` outside the content.
 */
@media only screen and ( max-width: 999px ) {
	.entry-content > h1.wp-block-heading {
		--theme-font-size: 32px;
	}
}

@media only screen and ( max-width: 689px ) {
	.entry-content > h1.wp-block-heading {
		--theme-font-size: 26px;
	}
}