/*!
 * Component: Studio split utility (.mw-split)
 *
 * Topic 30 CORR-WP6 — new studio-side two-column split layout for the
 * `/contact` page's routing band (component-file precedent set by WP-5's
 * `_get-in-touch-hub.css`). CSS grid: two equal columns + gap at ≥881px
 * (Claude Design side-by-side), single-column stack ≤880px (WP-specified
 * breakpoint). Delivers the Topic-27-deferred "global split utility"
 * refinement, scoped studio-side.
 *
 * Deliberately namespaced `mw-split*` — lore.css's `.split` / `.split--wide`
 * family is BOTH name-distinct AND enqueue-scoped to the 5 lore templates
 * (contact is not among them). Zero selector overlap; lore rules untouched.
 *
 * No animation/transition on this component, so no reduced-motion block is
 * needed.
 *
 * @package Mystwood_Studios_AB
 * @since   Topic 30 CORR-WP6
 */

/* -----------------------------------------------------------------------
 * Band wrapper — `.mw-section--contact-split` (template-page-contact.php's
 * hand-rolled split band, front-page.php get-in-touch-band precedent).
 * Mirrors the `.mw-section--body` wrapper contract (assets/css/sections/
 * _body.css:16-24: padding-block / .mw-section__inner max-width + centering
 * + padding-inline) so the band gets a containing width for `.mw-split` to
 * lay its grid tracks against — without it the grid has no width ceiling
 * and its `1fr` track free-sizes to content (see track note below).
 * ----------------------------------------------------------------------- */
.mw-section--contact-split {
	padding-block: clamp(2rem, 6vw, var(--mw-space-section, 120px));
}

.mw-section--contact-split .mw-section__inner {
	max-width: var(--mw-content-width, 72rem);
	margin-inline: auto;
	padding-inline: clamp(1rem, 4vw, 2rem);
}

/* -----------------------------------------------------------------------
 * Grid — stacked by default (mobile-first), two equal columns + gap from
 * 881px up. Tracks use `minmax(0, 1fr)`, not bare `1fr` — a bare `1fr`
 * track's implicit minimum is `auto` (its content's min-content width),
 * which lets a long unbreakable run (e.g. the GF email input) blow the
 * track past the container and cause horizontal scroll. `minmax(0, 1fr)`
 * lets the track shrink to the container width and pushes overflow inside
 * (wrapping/ellipsis) instead of outside it.
 * ----------------------------------------------------------------------- */
.mw-split {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	/* Gap + alignment mirror CD's .split--wide (verified against the lore.css
	 * port of the same component: gap clamp(2rem,5vw,4rem), align-items
	 * start). Topic 30 CORR-WP6 rev 5. */
	gap: clamp(2rem, 5vw, 4rem);
	align-items: start;
}

@media (min-width: 881px) {
	.mw-split {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	}
}

/* Belt-and-suspenders (Topic 30 deep-review fold): grid items default to
 * min-width:auto; minmax(0,1fr) already caps the TRACK, but an explicit
 * floor on the item guarantees a future non-wrappable child cannot
 * reintroduce the 320px blowout. */
.mw-split__col {
	min-width: 0;
}

/* -----------------------------------------------------------------------
 * Column content resets — the reused `.mw-section__eyebrow` /
 * `.mw-section__headline` / `.mw-section__intro` / `.mw-section__content`
 * atoms carry centered-band defaults under some section types (card-grid,
 * get-in-touch-hub, body--center). Scoped left-align + margin resets here
 * so the atoms shed those centered defaults INSIDE a split column, without
 * touching any of those other rules' own selectors.
 * ----------------------------------------------------------------------- */
.mw-split .mw-section__eyebrow,
.mw-split .mw-section__headline,
.mw-split .mw-section__intro,
.mw-split .mw-section__content {
	text-align: left;
	margin-inline: 0;
}

/* -----------------------------------------------------------------------
 * L2 fold — mirrored typography atoms.
 *
 * No bare `.mw-section__eyebrow` / `.mw-section__headline` rule exists
 * anywhere in the codebase (every declaration is section-type- or
 * page-scoped), so a hand-rolled band's own eyebrow/headline/content would
 * otherwise ship unstyled — eyebrows without uppercase/tracking/violet
 * accent, headlines on the global h2 base instead of the display font +
 * clamp scale. This mirrors the body-section atoms (source-commented below)
 * as a bespoke, band-scoped re-declaration, following the WP-5 precedent of
 * a component owning its own leaf typography instead of borrowing a section
 * type's styling.
 * ----------------------------------------------------------------------- */

/* Mirrors assets/css/sections/_body.css:26-31 (.mw-section--body
 * .mw-section__eyebrow) PLUS the studio violet eyebrow accent from
 * assets/css/sections/_studio.css:145 (.mw-section--body.mw-section--brand-studio
 * .mw-section__eyebrow), restored here to stay within this WP's declared
 * files ( _studio.css itself is untouched). */
.mw-split .mw-section__eyebrow {
	font-size: 0.875rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin-block-end: 0.5rem;
	color: var(--mw-text-accent); /* Topic 33 FIX-WP1 */
}

/* Mirrors assets/css/sections/_body.css:33-38 (.mw-section--body
 * .mw-section__headline) — display font, clamp scale, line-height,
 * title-to-content margin. */
.mw-split .mw-section__headline {
	font-family: var(--mw-font-display, system-ui, sans-serif);
	font-size: clamp(1.75rem, 3.5vw, 2.625rem);
	line-height: 1.2;
	margin-block: 0 var(--mw-space-headline-to-paragraph, 24px);
}

/* Mirrors the FULL assets/css/sections/_body.css:40-48 (.mw-section--body
 * .mw-section__content), including the `> * + *` sibling-rhythm rule, so
 * the relocated routing list + press note keep their body-band rhythm even
 * though `.mw-section--body` never matches inside this band. */
.mw-split .mw-section__content {
	font-size: 1rem;
	line-height: 1.6;
	max-width: 48rem;
	/* The relocated routing list's mailto addresses (e.g.
	 * "careers@mystwoodstudios.com") are long unbreakable runs with no space
	 * to wrap on. In the pre-WP-6 full-width body band there was enough room
	 * for them at any tested breakpoint; inside a ~half-width split column at
	 * narrow viewports there isn't. `overflow-wrap: anywhere` (inherited by
	 * the list/anchors below) lets the address break onto a second line
	 * instead of forcing the column — and the page — wider than the
	 * viewport. */
	overflow-wrap: anywhere;
}

.mw-split .mw-section__content > * + * {
	margin-block-start: 1em;
}

/* -----------------------------------------------------------------------
 * CD contact-hub fidelity (Topic 30 CORR-WP6 rev 5) — the routing rows are
 * the theme's canonical key-facts pattern (dl.mw-key-facts; base styles in
 * assets/css/sections/_key-facts.css, enqueued site-wide). Two dark-band
 * adjustments, scoped here: the global row rule falls back to a black line
 * (--mw-color-rule default rgba(0,0,0,.08)) which vanishes on the violet
 * band — CD shows a faint light separation; and CD's labels read full
 * white, not the global 0.8 opacity.
 * ----------------------------------------------------------------------- */
/* The dt/dd are listed alongside the row because the row is `display: contents`
 * above 32em and paints nothing — so this ratified separator has never actually
 * rendered at desktop width since Topic 30 shipped it. Found by the FIX-WP9
 * sweep; the base partial's half of the fix is in _key-facts.css. */
.mw-split .mw-key-facts__row,
.mw-split .mw-key-facts__label,
.mw-split .mw-key-facts__value {
	border-block-end-color: rgba(255, 255, 255, 0.12);
}

.mw-split .mw-key-facts__label {
	opacity: 1;
}