/*
 * MIC Page — Home Golden Reference (R2.1).
 * ------------------------------------------------------------------
 * Layer B: Presentation + Composition + Interaction.
 * Signature: Positioning Statement + Market Tension.
 * Consumes MIC Design Language tokens only (--mic-*); no Core tokens added.
 * Theme-local art direction (--mic-art-capability / --mic-art-tension) belongs
 * to the Experience layer, not Core.
 */

.mic-page-home > section {
	padding-block: var(--page-gap);
}

/* Full-bleed ink bands need their own breathing room. */
.mic-page-home .page-position,
.mic-page-home .page-next {
	padding-block: clamp(5rem, 11vw, 10rem);
}

/* These are true ink bands: the surface must actually invert. */
.mic-page-home .page-position,
.mic-page-home .page-next {
	background: var(--mic-color-authority);
	color: var(--mic-color-ink);
}

/* =================================================================
   1 · POSITION
   ================================================================= */

.page-position__inner {
	max-width: 46rem;
}

.page-position__statement {
	margin: var(--mic-space-5) 0 0;
	max-width: 20ch;
	font-family: var(--mic-font-serif);
	font-size: var(--mic-type-display);
	font-weight: 500;
	line-height: var(--mic-leading-tight);
	letter-spacing: var(--mic-tracking-tight);
}

.page-position__lead {
	margin: var(--mic-space-7) 0 0;
	max-width: var(--page-reading);
	font-size: var(--mic-type-lead);
	line-height: var(--mic-leading-normal);
	color: var(--mic-color-ink-soft);
}

.page-position__actions {
	margin-top: var(--mic-space-8);
}

/* Position thesis — a quiet paper band after the hero. */
.page-position-thesis {
	padding-block: clamp(3.5rem, 7vw, 6rem);
	background: var(--mic-color-paper);
}

.page-position__thesis {
	max-width: 40rem;
	font-size: var(--mic-type-md);
	line-height: var(--mic-leading-relaxed);
	color: var(--mic-color-ink-soft);
}

.page-position__thesis p {
	margin: 0 0 var(--mic-space-5);
}

.page-position__thesis-lead {
	font-family: var(--mic-font-serif);
	font-size: var(--mic-type-h3);
	line-height: var(--mic-leading-snug);
	color: var(--mic-color-ink);
}

.page-position__thesis-close {
	margin-bottom: 0 !important;
	color: var(--mic-color-ink);
}

/* =================================================================
   2 · TENSION (Signature)
   ================================================================= */

.page-tension {
	background: var(--mic-color-canvas);
}

.page-tension__inner {
	max-width: 52rem;
	margin-inline: auto;
}

.page-tension__voice {
	position: relative;
	padding-left: clamp(1.25rem, 3vw, 2.5rem);
}

.page-tension__voice--problem {
	border-left: 3px solid var(--mic-art-tension);
}

.page-tension__voice--standard {
	border-left: 3px solid var(--mic-color-evidence);
}

.page-tension__eyebrow--tension {
	color: var(--mic-art-tension);
}
.page-tension__eyebrow--evidence {
	color: var(--mic-color-evidence-text);
}

.page-tension__statement {
	margin: var(--mic-space-4) 0 0;
	font-family: var(--mic-font-serif);
	font-size: var(--mic-type-statement);
	font-weight: 500;
	line-height: var(--mic-leading-snug);
	letter-spacing: var(--mic-tracking-tight);
	color: var(--mic-color-ink);
}

.page-tension__body {
	margin-top: var(--mic-space-6);
	max-width: var(--page-reading);
	color: var(--mic-color-ink-soft);
	line-height: var(--mic-leading-relaxed);
}

.page-tension__fragment-lead {
	margin: var(--mic-space-7) 0 var(--mic-space-4);
	font-weight: var(--mic-font-weight-semibold);
	color: var(--mic-color-ink);
}

.page-tension__fragments {
	margin: 0;
	padding: 0;
	list-style: none;
	max-width: var(--page-reading);
	color: var(--mic-color-ink-muted);
}

.page-tension__fragments li {
	padding: var(--mic-space-3) 0;
	border-top: var(--page-rule);
	line-height: var(--mic-leading-normal);
}
.page-tension__fragments li:last-child {
	border-bottom: var(--page-rule);
}

.page-tension__fragment-close {
	margin: var(--mic-space-5) 0 0;
	max-width: var(--page-reading);
	color: var(--mic-color-ink-soft);
}

/* Hinge — the equation that converts conflict into method. */
.page-tension__hinge {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: var(--mic-space-3);
	margin: clamp(3rem, 6vw, 5rem) 0;
	padding: var(--mic-space-6) 0;
	border-top: var(--page-rule);
	border-bottom: var(--page-rule);
	font-size: var(--mic-type-eyebrow);
	font-weight: var(--mic-font-weight-semibold);
	text-transform: uppercase;
	letter-spacing: var(--mic-tracking-eyebrow);
	color: var(--mic-color-ink);
}
.page-tension__hinge i {
	font-style: normal;
	color: var(--mic-color-evidence);
}

/* =================================================================
   3 · PROOF (live)
   ================================================================= */

.page-proof {
	background: var(--mic-color-surface-sunken);
}

.page-proof__head {
	max-width: var(--page-reading);
	margin-bottom: var(--mic-space-9);
}

.page-proof__title {
	margin: var(--mic-space-4) 0 0;
	font-size: var(--mic-type-h2);
	line-height: var(--mic-leading-snug);
}

.page-proof__band {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: var(--mic-space-8);
}

.page-proof__item {
	margin: 0;
	padding-top: var(--mic-space-6);
	border-top: 2px solid var(--mic-color-ink);
}

.page-proof__metric {
	display: block;
	font-size: var(--mic-type-metric);
	font-weight: var(--mic-font-weight-semibold);
	line-height: 1;
	color: var(--mic-color-evidence-text);
}

.page-proof__context {
	margin: var(--mic-space-4) 0 var(--mic-space-5);
	color: var(--mic-color-ink-soft);
	line-height: var(--mic-leading-normal);
}

.page-proof__source {
	font-size: var(--mic-type-small);
	font-weight: var(--mic-font-weight-semibold);
	text-transform: uppercase;
	letter-spacing: var(--mic-tracking-wide);
	color: var(--mic-color-ink);
	text-decoration: none;
}
.page-proof__source:hover {
	color: var(--mic-color-evidence-text);
}

/* =================================================================
   4 · CAPABILITIES
   ================================================================= */

.page-capabilities__head {
	max-width: 40rem;
	margin-bottom: var(--mic-space-9);
}

.page-capabilities__title {
	margin: var(--mic-space-4) 0 0;
	font-size: var(--mic-type-h2);
	line-height: var(--mic-leading-snug);
}

.page-capabilities__register {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--mic-space-8) var(--mic-space-9);
}

.page-capability {
	padding-top: var(--mic-space-5);
	border-top: 2px solid var(--mic-art-capability);
}

.page-capability__no {
	display: block;
	font-size: var(--mic-type-caption);
	font-weight: var(--mic-font-weight-bold);
	letter-spacing: var(--mic-tracking-eyebrow);
	color: var(--mic-art-capability);
}

.page-capability__title {
	margin: var(--mic-space-3) 0 var(--mic-space-4);
	font-size: var(--mic-type-h3);
	line-height: var(--mic-leading-snug);
}

.page-capability__body {
	margin: 0;
	max-width: 34rem;
	color: var(--mic-color-ink-soft);
	line-height: var(--mic-leading-relaxed);
}

/* =================================================================
   5 · EXPERIENCE (live)
   ================================================================= */

.page-experience {
	background: var(--mic-color-canvas);
}

.page-experience__head {
	max-width: 44rem;
	margin-bottom: var(--mic-space-9);
}

.page-experience__title {
	margin: var(--mic-space-4) 0 0;
	font-size: var(--mic-type-h2);
	line-height: var(--mic-leading-snug);
}

.page-experience__intro {
	margin: var(--mic-space-5) 0 0;
	max-width: var(--page-reading);
	font-size: var(--mic-type-md);
	color: var(--mic-color-ink-soft);
	line-height: var(--mic-leading-relaxed);
}

.page-experience__list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--mic-space-6);
}

.page-work {
	background: var(--mic-color-surface);
	border: var(--page-rule);
	transition: box-shadow var(--mic-duration-base) var(--mic-ease-standard);
}
.page-work:hover {
	box-shadow: var(--mic-shadow-lg);
}

.page-work--lead {
	grid-column: 1 / -1;
}

.page-work__link {
	display: block;
	padding: clamp(1.75rem, 4vw, 3.25rem);
	color: inherit;
	text-decoration: none;
}

.page-work__metric {
	display: block;
	margin-bottom: var(--mic-space-5);
	font-size: var(--mic-type-small);
	font-weight: var(--mic-font-weight-bold);
	letter-spacing: var(--mic-tracking-eyebrow);
	text-transform: uppercase;
	color: var(--mic-color-evidence-text);
}

.page-work__title {
	margin: 0;
	font-family: var(--mic-font-serif);
	font-size: var(--mic-type-h3);
	line-height: var(--mic-leading-snug);
}

.page-work--lead .page-work__title {
	font-size: var(--mic-type-h1);
	max-width: 24ch;
}

.page-work__summary {
	margin: var(--mic-space-5) 0 0;
	max-width: var(--page-reading);
	color: var(--mic-color-ink-soft);
	line-height: var(--mic-leading-relaxed);
}

.page-work__cta {
	display: inline-block;
	margin-top: var(--mic-space-6);
	font-size: var(--mic-type-small);
	font-weight: var(--mic-font-weight-semibold);
	text-transform: uppercase;
	letter-spacing: var(--mic-tracking-wide);
	color: var(--mic-color-ink);
}
.page-work__link:hover .page-work__cta {
	color: var(--mic-color-evidence-text);
}

/* =================================================================
   6 · WAYS TO WORK
   ================================================================= */

.page-ways__head {
	max-width: 44rem;
	margin-bottom: var(--mic-space-9);
}

.page-ways__title {
	margin: var(--mic-space-4) 0 0;
	font-family: var(--mic-font-serif);
	font-size: var(--mic-type-h2);
	line-height: var(--mic-leading-snug);
}
.page-ways__intro {
	margin: var(--mic-space-5) 0 0;
	color: var(--mic-color-ink-soft);
}

.page-ways__process {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--mic-space-8);
	margin: 0 0 var(--mic-space-10);
	padding: 0;
	list-style: none;
}

.page-ways__step {
	padding-top: var(--mic-space-5);
	border-top: 2px solid var(--mic-color-ink);
}

.page-ways__step-no {
	display: block;
	font-size: var(--mic-type-caption);
	font-weight: var(--mic-font-weight-bold);
	letter-spacing: var(--mic-tracking-eyebrow);
	color: var(--mic-color-ink-muted);
}

.page-ways__step-title {
	margin: var(--mic-space-3) 0 var(--mic-space-3);
	font-size: var(--mic-type-h4);
}

.page-ways__step-body {
	margin: 0;
	color: var(--mic-color-ink-soft);
	line-height: var(--mic-leading-normal);
}

/* .page-ways__offers + .page-offer* moved to offers-block.css (shared, Home + What We Do). */

.page-ways__route a {
	font-weight: var(--mic-font-weight-semibold);
	color: var(--mic-color-ink);
	text-decoration: none;
}
.page-ways__route a:hover {
	color: var(--mic-color-evidence-text);
}

.page-ways__fit {
	max-width: 46rem;
	padding-top: var(--mic-space-8);
	border-top: var(--page-rule);
}

.page-ways__fit-lead {
	margin: var(--mic-space-4) 0 var(--mic-space-6);
	font-family: var(--mic-font-serif);
	font-size: var(--mic-type-h3);
	line-height: var(--mic-leading-snug);
}

.page-ways__fit-list {
	margin: 0;
	padding: 0;
	list-style: none;
	color: var(--mic-color-ink-soft);
	line-height: var(--mic-leading-relaxed);
}
.page-ways__fit-list li {
	padding: var(--mic-space-2) 0 var(--mic-space-2) var(--mic-space-6);
	position: relative;
}
.page-ways__fit-list li::before {
	content: "—";
	position: absolute;
	left: 0;
	color: var(--mic-color-evidence);
}

.page-ways__fit-note {
	margin: var(--mic-space-6) 0 0;
	color: var(--mic-color-ink-muted);
	font-size: var(--mic-type-small);
	line-height: var(--mic-leading-normal);
}

/* =================================================================
   7 · NEXT STEP + SIGNATURE
   ================================================================= */

.page-next__inner {
	max-width: 46rem;
}

.page-next__statement {
	margin: var(--mic-space-5) 0 0;
	max-width: 26ch;
	font-family: var(--mic-font-serif);
	font-size: var(--mic-type-h1);
	line-height: var(--mic-leading-tight);
	letter-spacing: var(--mic-tracking-tight);
}

.page-next__lead {
	margin: var(--mic-space-6) 0 0;
	max-width: var(--page-reading);
	font-size: var(--mic-type-lead);
	color: var(--mic-color-ink-soft);
}

.page-next__actions {
	margin-top: var(--mic-space-8);
}

.page-signature {
	padding-block: var(--mic-space-11);
	background: var(--mic-color-authority);
	text-align: center;
}

.page-signature__mark {
	margin: 0;
	font-size: var(--mic-type-eyebrow);
	font-weight: var(--mic-font-weight-bold);
	text-transform: uppercase;
	letter-spacing: var(--mic-tracking-eyebrow);
	color: var(--mic-color-evidence);
}

.page-signature__line {
	margin: var(--mic-space-5) auto 0;
	max-width: 32ch;
	font-family: var(--mic-font-serif);
	font-size: var(--mic-type-h3);
	line-height: var(--mic-leading-snug);
	color: var(--mic-color-paper);
}

/* =================================================================
   GUARD — the theme's homepage heading contract (.entry-content hN)
   must not leak into a MIC Page Experience. Declared before the
   responsive overrides so mobile sizing can still win.
   ================================================================= */

.mic-page-home .page-position__statement {
	font-family: var(--mic-font-serif);
	font-size: var(--mic-type-display);
	line-height: var(--mic-leading-tight);
	letter-spacing: var(--mic-tracking-tight);
}
.mic-page-home .page-tension__statement {
	font-family: var(--mic-font-serif);
	font-size: var(--mic-type-statement);
	line-height: var(--mic-leading-snug);
	letter-spacing: var(--mic-tracking-tight);
}
.mic-page-home .page-next__statement {
	font-size: var(--mic-type-h1);
	line-height: var(--mic-leading-tight);
	letter-spacing: var(--mic-tracking-tight);
}
.mic-page-home .page-ways__title {
	font-family: var(--mic-font-serif);
	font-size: var(--mic-type-h2);
	line-height: var(--mic-leading-snug);
}
.mic-page-home .page-proof__title,
.mic-page-home .page-capabilities__title,
.mic-page-home .page-experience__title {
	font-size: var(--mic-type-h2);
	line-height: var(--mic-leading-snug);
}
.mic-page-home .page-capability__title,
.mic-page-home .page-work__title,
.mic-page-home .page-offer__title,
.mic-page-home .page-ways__step-title,
.mic-page-home .page-ways__fit-lead {
	font-size: var(--mic-type-h3);
	line-height: var(--mic-leading-snug);
}
.mic-page-home .page-work--lead .page-work__title {
	font-size: var(--mic-type-h1);
}

/* =================================================================
   RESPONSIVE — 1024 → 768 → 430
   ================================================================= */

@media (max-width: 1024px) {
	.page-capabilities__register {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--mic-space-8) var(--mic-space-9);
	}
	.page-ways__process {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--mic-space-7);
	}
	.page-ways__offers {
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 768px) {
	.page-position__statement {
		max-width: none;
	}
	.page-capabilities__register {
		grid-template-columns: 1fr;
		gap: var(--mic-space-8);
	}
	.page-tension__inner {
		max-width: none;
	}
	.page-tension__hinge {
		gap: var(--mic-space-2);
		font-size: var(--mic-font-size-2xs);
	}
	.page-experience__list {
		grid-template-columns: 1fr;
	}
	.page-work--lead .page-work__title {
		max-width: none;
	}
	.page-ways__process {
		grid-template-columns: 1fr;
	}
	.page-ways__offers {
		grid-template-columns: 1fr;
	}
	.page-next__statement {
		max-width: none;
	}
}

@media (max-width: 430px) {
	.page-position__inner,
	.page-position__thesis,
	.page-tension__inner,
	.page-next__inner {
		max-width: none;
	}
	.mic-page-home .page-position__statement {
		font-size: var(--mic-font-size-2xl);
	}
	.mic-page-home .page-tension__statement {
		font-size: var(--mic-font-size-xl);
	}
}

