/*
 * Enterprise Minded content: the Altitude system's components.
 *
 * Every value here is read from the design files (designs/site/*.html, 1440px
 * desktop + 390px mobile comps). Colours and font families are theme.json
 * presets; component-specific display sizes are clamps between the mobile and
 * desktop comp values.
 *
 * Breakpoint: 781px/782px, WordPress's own column-stacking point.
 */

/* ── Sky colours: one class per band. The sky darkens as you descend and text
   flips to light at ground level. --em-muted is the band's secondary text
   colour (all pass 4.5:1 on their band); --em-rule its hairline. ── */
.em-sky-stratosphere { background-color: var(--wp--preset--color--stratosphere); color: var(--wp--preset--color--night); --em-muted: var(--wp--custom--muted--stratosphere); --em-rule: var(--wp--custom--rule--stratosphere); }
.em-sky-boardroom { background-color: var(--wp--preset--color--boardroom); color: var(--wp--preset--color--night); --em-muted: var(--wp--custom--muted--boardroom); --em-rule: var(--wp--preset--color--night); }
.em-sky-architecture { background-color: var(--wp--preset--color--architecture); color: var(--wp--preset--color--night); --em-muted: var(--wp--custom--muted--architecture); --em-rule: var(--wp--preset--color--night); }
.em-sky-delivery { background-color: var(--wp--preset--color--delivery); color: var(--wp--preset--color--night); --em-muted: var(--wp--custom--muted--delivery); --em-rule: var(--wp--preset--color--night); }
.em-sky-code { background-color: var(--wp--preset--color--ground); color: var(--wp--preset--color--paper); --em-muted: var(--wp--custom--muted--ground); --em-rule: var(--wp--custom--rule--ground); }
.em-sky-night { background-color: var(--wp--preset--color--night); color: var(--wp--preset--color--frost); --em-muted: var(--wp--custom--muted--night); --em-rule: var(--wp--custom--rule--night); }
.em-sky-bedrock { background-color: var(--wp--preset--color--bedrock); color: var(--wp--preset--color--paper); --em-muted: var(--wp--custom--muted--ground); --em-rule: var(--wp--custom--rule--bedrock); }

/* ── Gauge ── */
.em-gauge { display: block; flex-shrink: 0; width: 14px; height: 53px; margin-top: 6px; }

/* ── Essay row: gauge | title, standfirst, meta. The title link's ::after
   covers the row so the whole thing is clickable. ── */
.em-essay-row { position: relative; display: flex; gap: 18px; align-items: flex-start; }
.em-essay-row__body { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.em-essay-row__title { margin: 0; font-family: var(--wp--preset--font-family--body); font-size: var(--wp--preset--font-size--x-large); font-weight: 700; line-height: 1.2; letter-spacing: -0.01em; text-wrap: balance; }
.em-essay-row__title a { color: inherit; text-decoration: none; }
.em-essay-row__title a::after { content: ""; position: absolute; inset: 0; }
.em-essay-row:hover .em-essay-row__title a { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.em-essay-row__excerpt { margin: 0; font-size: 18px; line-height: 1.55; color: var(--em-muted); text-wrap: pretty; }
.em-essay-row__meta { margin: 0; font-size: var(--wp--preset--font-size--small); line-height: 1.5; color: var(--em-muted); }

/* ── Home altitude band: label column | two essays ── */
.em-band {
	display: grid;
	grid-template-columns: 340px minmax(0, 1fr);
	gap: 64px;
	margin-block: 0;
	padding: 64px var(--wp--style--root--padding-right, 96px) 72px var(--wp--style--root--padding-left, 96px);
}
.em-band__intro { display: flex; flex-direction: column; gap: 10px; }
.em-band__heading { margin: 0; display: flex; flex-direction: column; gap: 10px; }
.em-band__label { font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: clamp(4.5rem, 4.2rem + 1.14vw, 5.25rem); line-height: 0.9; white-space: nowrap; }
.em-band__title { font-family: var(--wp--preset--font-family--body); font-size: 22px; font-weight: 700; line-height: 1.3; }
.em-band__audience { margin: 0; font-size: 17px; line-height: 1.5; font-style: italic; color: var(--em-muted); }
.em-band__more { margin-top: 10px; font-size: 16px; font-weight: 700; color: inherit; }
.em-band__essays { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 56px; align-content: center; }
.em-band__empty { margin: 0; font-size: 18px; font-style: italic; color: var(--em-muted); }

/* ── Altitude navigation ── */
.em-altitude-nav a { text-decoration: none; border: 1.5px solid var(--wp--preset--color--night); border-radius: 6px; }
.em-altitude-nav a:hover { text-decoration: underline; text-underline-offset: 3px; }

.em-altitude-nav.is-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.em-altitude-nav.is-chips a { display: flex; align-items: center; gap: 10px; padding: 12px 18px; font-size: 16px; font-weight: 700; }
.em-altitude-nav.is-chips .em-gauge { width: 7px; height: 26.5px; margin-top: 3px; }
.em-altitude-nav__lead { margin-right: 6px; font-size: 16px; font-weight: 700; }

.em-altitude-nav.is-stack { display: flex; flex-direction: column; gap: 10px; }
.em-altitude-nav.is-stack a { display: grid; grid-template-columns: 120px 1fr; gap: 16px; align-items: center; padding: 14px 18px; }
.em-altitude-nav.is-stack .em-altitude-nav__label { font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: 26px; line-height: 1; white-space: nowrap; }
.em-altitude-nav.is-stack .em-altitude-nav__title { font-size: 15px; }
.em-altitude-nav.is-stack a[aria-current="page"] { background-color: var(--wp--preset--color--night); color: var(--wp--preset--color--frost); }

.em-altitude-nav.is-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.em-altitude-nav.is-grid a { display: flex; flex-direction: column; gap: 4px; padding: 20px 24px; }
.em-altitude-nav.is-grid .em-altitude-nav__label { font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: 40px; line-height: 1; }
.em-altitude-nav.is-grid .em-altitude-nav__title { font-size: 15px; }

/* ── Altitude archive: heading ── */
.em-altitude-hero { display: flex; flex-direction: column; gap: 18px; }
.em-altitude-hero__heading { margin: 0; display: flex; flex-direction: column; gap: 20px; }
.em-altitude-hero__label { font-family: var(--wp--preset--font-family--display); font-weight: 900; font-size: var(--wp--preset--font-size--altitude); line-height: 0.82; white-space: nowrap; }
.em-altitude-hero__title { font-family: var(--wp--preset--font-family--body); font-size: clamp(1.5rem, 1.3rem + 0.8vw, 1.875rem); font-weight: 700; line-height: 1.2; }
.em-altitude-hero__audience { margin: 0; font-size: 22px; line-height: 1.5; font-style: italic; color: var(--em-muted); }
.em-altitude-hero__intro p { margin: 0; max-width: 720px; font-size: var(--wp--preset--font-size--large); line-height: 1.6; }

/* ── Altitude archive: filed here | passing through ── */
.em-altitude-listing { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 96px; align-items: start; }
.em-altitude-listing.is-single { grid-template-columns: minmax(0, 1fr); }
.em-altitude-listing h2 { margin: 0; font-family: var(--wp--preset--font-family--display); font-weight: 800; line-height: 1; }
.em-altitude-listing__filed { display: flex; flex-direction: column; }
.em-altitude-listing__filed > h2 { margin-bottom: 12px; font-size: 44px; }
.em-altitude-listing__filed > .em-essay-row { padding: 32px 0; border-top: 1.5px solid currentColor; }
.em-altitude-listing__filed .em-essay-row__title { font-size: clamp(1.375rem, 1.1rem + 1vw, 2rem); }
.em-altitude-listing__empty { margin: 0; padding: 32px 0; border-top: 1.5px solid currentColor; font-size: 18px; font-style: italic; color: var(--em-muted); }
.em-altitude-listing__passing { display: flex; flex-direction: column; padding: 20px 24px 8px; border-radius: 8px; background-color: var(--wp--preset--color--stratosphere); color: var(--wp--preset--color--night); --em-muted: var(--wp--custom--muted--stratosphere); }
.em-altitude-listing__passing > h2 { font-size: 32px; }
.em-altitude-listing__note { margin: 6px 0 16px; font-size: 16px; line-height: 1.5; color: var(--em-muted); }
.em-altitude-listing__passing > .em-essay-row { padding: 28px 0; border-top: 1px solid var(--wp--custom--rule--passing); }
.em-altitude-listing__passing .em-essay-row__title { font-size: clamp(1.25rem, 1.1rem + 0.6vw, 1.625rem); }

/* ── Topic archive: essays banded by altitude ── */
.em-topic-band {
	display: grid;
	grid-template-columns: 240px minmax(0, 1fr);
	gap: 64px;
	padding: 44px var(--wp--style--root--padding-right, 96px) 48px var(--wp--style--root--padding-left, 96px);
}
.em-topic-band__heading { margin: 0; display: flex; flex-direction: column; gap: 4px; }
.em-topic-band__label { font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: clamp(2.75rem, 2.5rem + 0.9vw, 3.25rem); line-height: 0.95; white-space: nowrap; }
.em-topic-band__title { font-family: var(--wp--preset--font-family--body); font-size: 15px; font-weight: 400; font-style: italic; color: var(--em-muted); }
.em-topic-band__essays { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px; align-content: center; }
.em-topic-band__essays .em-essay-row__title { font-size: clamp(1.375rem, 1.19rem + 0.57vw, 1.75rem); }
.em-topic-band__empty { margin: 0; font-size: 18px; font-style: italic; color: var(--em-muted); }

/* ── Essay: filed line, byline, descent nav ── */
.em-essay-filed { display: flex; align-items: center; gap: 14px; font-size: 16px; font-weight: 700; line-height: 1.5; }
.em-essay-filed p { margin: 0; }
.em-essay-filed .em-gauge { margin-top: 0; }
.em-essay-filed__range { display: block; }
.em-essay-filed__topic { font-weight: 500; color: inherit; }
.em-essay-byline { margin: 0; font-size: 16px; color: var(--em-muted, inherit); }

.em-descent { padding: 26px 28px; border: 1.5px solid var(--wp--preset--color--night); border-radius: 8px; background-color: var(--wp--preset--color--white); color: var(--wp--preset--color--night); }
.em-descent summary { font-size: 17px; font-weight: 700; }
.em-descent ol { margin: 16px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 16px; }
.em-descent li { display: grid; grid-template-columns: 20px 1fr; gap: 14px; align-items: start; }
.em-descent__swatch { width: 14px; height: 14px; margin-top: 5px; border: 1.5px solid var(--wp--preset--color--night); border-radius: 3px; }
.em-descent a { display: flex; flex-direction: column; gap: 2px; color: inherit; text-decoration: none; }
.em-descent__altitude { font-size: 16px; font-weight: 700; }
.em-descent__heading { font-size: 16px; line-height: 1.4; text-decoration: underline; text-underline-offset: 3px; }
.em-descent a:hover .em-descent__heading { text-decoration-thickness: 2px; }
@media (min-width: 782px) {
	/* On wide screens the list is always shown: the summary is just its title. */
	.em-descent summary { list-style: none; pointer-events: none; }
	.em-descent summary::-webkit-details-marker { display: none; }
	.em-descent__count { display: none; }
}

/* ── Essay: altitude sections (full-bleed bands) ── */
.em-section {
	display: grid;
	grid-template-columns: 300px minmax(0, 720px);
	column-gap: 96px;
	margin-block: 0;
	padding: 80px var(--wp--style--root--padding-right, 96px) 88px var(--wp--style--root--padding-left, 96px);
}
.em-section__label { display: flex; flex-direction: column; gap: 6px; padding-top: 6px; }
.em-section__label p { margin: 0; }
.em-section__altitude { font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: clamp(3rem, 2.7rem + 1.15vw, 3.75rem); line-height: 0.9; white-space: nowrap; }
.em-section__title { font-size: 16px; font-style: italic; color: var(--em-muted); }
.em-section__body { display: flex; flex-direction: column; gap: 24px; font-size: var(--wp--preset--font-size--large); line-height: 1.7; }
.em-section__body > * { margin-block: 0; }
.em-section__body h2 { font-family: var(--wp--preset--font-family--body); font-size: var(--wp--preset--font-size--xx-large); font-weight: 700; line-height: 1.2; letter-spacing: -0.01em; }
.em-section__body h3 { font-family: var(--wp--preset--font-family--body); font-size: 24px; font-weight: 700; line-height: 1.25; }
.em-section__body a { color: inherit; }
.em-section__body .wp-block-quote { margin-block: 16px; padding: 0 0 0 28px; border-left: 6px solid currentColor; }
.em-section__body .wp-block-quote p { margin: 0; font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: clamp(2.25rem, 1.9rem + 1.5vw, 3.25rem); line-height: 1; text-wrap: balance; }
.em-section__body .wp-block-code { margin-block: 8px; padding: 24px 28px; border: 0; border-radius: 8px; background-color: var(--wp--preset--color--bedrock); color: var(--wp--preset--color--paper); font-family: var(--wp--preset--font-family--mono); font-size: 16px; line-height: 1.7; overflow-x: auto; }
.em-section__body ul, .em-section__body ol { padding-left: 1.25em; }

/* ── Essay: where next ── */
.em-where-next { display: flex; flex-direction: column; gap: 28px; }
.em-where-next__title { margin: 0; font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: 44px; line-height: 1; }
.em-where-next__essays { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 56px; }
.em-where-next .em-essay-row__title { font-size: clamp(1.375rem, 1.19rem + 0.38vw, 1.625rem); }

/* ── Subscribe form ── */
.em-subscribe { display: flex; flex-direction: column; gap: 10px; }
.em-subscribe label { font-size: 15px; font-weight: 700; }
.em-subscribe__row { display: flex; gap: 12px; }
.em-subscribe input { flex-grow: 1; min-width: 0; height: 58px; box-sizing: border-box; padding: 0 18px; border: 2px solid currentColor; border-radius: 6px; background: transparent; color: inherit; font-family: var(--wp--preset--font-family--body); font-size: 17px; }
.em-subscribe input::placeholder { color: var(--em-muted, currentColor); opacity: 1; }
.em-subscribe button { height: 58px; padding: 0 28px; border: 0; border-radius: 6px; background-color: var(--wp--preset--color--window-light); color: var(--wp--preset--color--bedrock); font-family: var(--wp--preset--font-family--body); font-size: 17px; font-weight: 700; cursor: pointer; }
.em-subscribe button:disabled { cursor: not-allowed; }
.em-subscribe__note { margin: 0; font-size: 14px; font-style: italic; color: var(--em-muted, inherit); }

/* ── Phones and small tablets: everything stacks, per the 390px comps ── */
@media (max-width: 781px) {
	.em-gauge { width: 11px; height: 42px; margin-top: 5px; }
	.em-essay-row { gap: 14px; }
	.em-essay-row__body { gap: 8px; }
	.em-essay-row__excerpt { font-size: 16px; line-height: 1.5; }
	.em-essay-row__meta { font-size: 14px; }

	.em-band { display: flex; flex-direction: column; gap: 28px; padding-top: 40px; padding-bottom: 44px; }
	.em-band__intro, .em-band__heading { gap: 6px; }
	.em-band__title { font-size: 19px; }
	.em-band__audience { font-size: 15px; }
	.em-band__more { margin-top: 4px; }
	.em-band__essays { grid-template-columns: minmax(0, 1fr); gap: 28px; }

	.em-altitude-nav.is-chips { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
	.em-altitude-nav.is-chips a { min-height: 48px; padding: 0 14px; font-size: 15px; box-sizing: border-box; }
	.em-altitude-nav__lead { display: none; }
	.em-altitude-nav.is-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.em-altitude-nav.is-grid a { padding: 16px 18px; }
	.em-altitude-nav.is-grid .em-altitude-nav__label { font-size: 32px; }

	.em-altitude-listing { grid-template-columns: minmax(0, 1fr); gap: 48px; }
	.em-altitude-listing__filed > h2 { font-size: 36px; }

	.em-topic-band { display: flex; flex-direction: column; gap: 24px; padding-top: 40px; padding-bottom: 44px; }
	.em-topic-band__essays { grid-template-columns: minmax(0, 1fr); gap: 28px; }

	.em-descent { padding: 0 16px; }
	.em-descent summary { min-height: 52px; display: flex; align-items: center; gap: 8px; cursor: pointer; font-size: 16px; }
	.em-descent summary::before { content: ""; width: 0; height: 0; border-left: 6px solid currentColor; border-block: 5px solid transparent; transition: transform 0.15s ease; }
	.em-descent[open] summary::before { transform: rotate(90deg); }
	.em-descent summary { list-style: none; }
	.em-descent summary::-webkit-details-marker { display: none; }
	.em-descent ol { margin: 0; padding-bottom: 12px; gap: 0; }
	.em-descent li { min-height: 44px; align-items: center; gap: 12px; }
	.em-descent__swatch { margin-top: 0; }
	.em-descent a { flex-direction: row; flex-wrap: wrap; gap: 6px; padding-block: 10px; }

	.em-section { display: flex; flex-direction: column; gap: 16px; padding-top: 40px; padding-bottom: 44px; }
	.em-section__altitude { font-size: 48px; }
	.em-section__body { gap: 16px; font-size: 18px; line-height: 1.65; }
	.em-section__body .wp-block-code { padding: 18px; font-size: 14px; }
	.em-section__body .wp-block-quote { padding-left: 18px; border-left-width: 5px; }

	.em-where-next__title { font-size: 36px; }
	.em-where-next__essays { grid-template-columns: minmax(0, 1fr); gap: 32px; }
}

@media (prefers-reduced-motion: reduce) {
	.em-descent summary::before { transition: none; }
}