/**
 * Hero Section — Layout Styles
 *
 * PHASE 7 — COMPOSABLE SECTIONS (BLOCK ENABLED).
 *
 * Styles ONLY .atb-hero__inner — the layout container this section
 * wraps its composed blocks in. It does NOT style the blocks
 * themselves (.atb-heading, .atb-text, .atb-button); those are owned
 * exclusively by their own CSS files from the Block System phase.
 * Re-styling a block's own classes here would violate "no section
 * styling inside blocks" just as much as the reverse would.
 *
 * ISOLATION RULE: every selector is scoped under
 * [data-atb-section="hero"]. TOKEN-ONLY.
 */

[data-atb-section="hero"] {
	display: block;
}

[data-atb-section="hero"] .atb-hero__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--atb-space-4, 1rem);
	padding: var(--atb-space-16, 4rem) var(--atb-space-6, 1.5rem);
	text-align: center;
}