/**
 * MVP design system (BRAND.md, version 1). Tokens first; everything else pulls from them.
 * Rules carried from BRAND.md:
 * - Square corners everywhere (the app icon is the only exception).
 * - Button text is always Timber on Alpenglow. Never white on Alpenglow.
 * - On light backgrounds, Alpenglow text becomes Alpenglow Deep. Sage is never text on Canvas.
 * - On raised Timber-2 panels, small text is Canvas or Body-on-dark, never Alpenglow or Sage.
 * - Big Shoulders Display 900 for headlines only (uppercase by CSS; typed in sentence case). Archivo for everything people read.
 * - No glow, shadow or gradient on type, except a soft shadow on labels laid directly over photos.
 * - Topo lines only behind headers and section breaks, never behind body text.
 * - One Alpenglow moment per view; one primary button per screen.
 */

/* ---------- Fonts (self-hosted, no Google calls; Kelsey 2026-10-06, DECISIONS 17) ----------
   Latin subsets from Fontsource, SIL Open Font License 1.1 (assets/fonts/OFL-*.txt). */

@font-face {
	font-family: 'Big Shoulders Display';
	font-style: normal;
	font-weight: 900;
	font-display: swap;
	src: url("../fonts/big-shoulders-display-latin-900-normal.woff2") format("woff2");
}

@font-face {
	font-family: 'Archivo';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/archivo-latin-400-normal.woff2") format("woff2");
}

@font-face {
	font-family: 'Archivo';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url("../fonts/archivo-latin-500-normal.woff2") format("woff2");
}

@font-face {
	font-family: 'Archivo';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/archivo-latin-700-normal.woff2") format("woff2");
}

/* ---------- Tokens ---------- */

:root {
	/* Color */
	--mvp-timber:         #22362A; /* primary: backgrounds, type */
	--mvp-timber-2:       #2E4636; /* raised panels on Timber */
	--mvp-timber-line:    #34503F; /* hairlines on Timber */
	--mvp-canvas:         #EDE6D6; /* paper: light backgrounds, type on dark */
	--mvp-canvas-2:       #E4DCC8; /* alternate light section */
	--mvp-white:          #FFFFFF; /* cards, form fields */
	--mvp-sage:           #9DAE8E; /* snowcaps, labels on dark, tags */
	--mvp-alpenglow:      #E8836B; /* the ridge, buttons, highlights on dark */
	--mvp-alpenglow-deep: #A63F27; /* Alpenglow for TEXT on light backgrounds */
	--mvp-body:           #3E5246; /* body text on light */
	--mvp-body-on-dark:   #C9D2C2; /* body text on Timber */

	/* Type */
	--mvp-font-display: 'Big Shoulders Display', Impact, sans-serif; /* 900 only */
	--mvp-font-body:    'Archivo', system-ui, sans-serif;            /* 400, 500, 700 */

	/* Shape */
	--mvp-radius: 0;
	--mvp-border: 1.5px solid var(--mvp-timber);
	--mvp-gutter: 56px;
	--mvp-section-y: 88px;
	--mvp-max: 1328px; /* content width; bands stay full-bleed */
}

@media (max-width: 760px) {
	:root {
		--mvp-gutter: 20px;
		--mvp-section-y: 56px;
	}
}

/* ---------- Base ---------- */

.mvp-site,
.mvp-site * {
	box-sizing: border-box;
}

.mvp-site {
	margin: 0;
	background: var(--mvp-canvas);
	color: var(--mvp-body);
	font: 400 16px/1.6 var(--mvp-font-body);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

/* Base rules carry no weight (:where), so every component's own color and layout always wins.
   (A plain ".mvp-site a" outranked ".mvp-btn--primary" and turned button text light on Alpenglow.) */
:where(.mvp-site) img {
	display: block;
	max-width: 100%;
	height: auto;
}

:where(.mvp-site) a {
	color: inherit;
}

/* Focus ring: Alpenglow Deep on light backgrounds (Alpenglow is only 2.1 on Canvas, under the 3:1 needed),
   Alpenglow on Timber (QA 2026-10-09). */
.mvp-site :focus-visible {
	outline: 3px solid var(--mvp-alpenglow-deep);
	outline-offset: 3px;
}

.mvp-band--timber :focus-visible,
.mvp-header :focus-visible,
.mvp-footer :focus-visible,
.mvp-panel :focus-visible,
.mvp-quote :focus-visible,
.mvp-calc__result :focus-visible,
.mvp-hero :focus-visible {
	outline-color: var(--mvp-alpenglow);
}

.mvp-wrap {
	width: 100%;
	max-width: calc(var(--mvp-max) + 2 * var(--mvp-gutter));
	margin: 0 auto;
	padding: 0 var(--mvp-gutter);
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

/* ---------- Type ---------- */

.mvp-h1,
.mvp-h2,
.mvp-h3,
.mvp-big {
	margin: 0;
	font-family: var(--mvp-font-display);
	font-weight: 900;
	letter-spacing: 0;
	text-transform: uppercase;
	color: var(--mvp-timber);
}

.mvp-h1 {
	font-size: clamp(64px, 9vw, 132px);
	line-height: 0.84;
}

.mvp-h2 {
	font-size: clamp(44px, 5vw, 72px);
	line-height: 0.88;
}

.mvp-h3 {
	font-size: clamp(28px, 2.4vw, 34px);
	line-height: 0.95;
}

.mvp-big {
	font-size: clamp(48px, 4.8vw, 68px);
	line-height: 0.85;
}

.mvp-lead {
	max-width: 60ch;
	margin: 0;
	font-size: clamp(17px, 1.3vw, 19px);
	line-height: 1.55;
}

.mvp-eyebrow {
	display: block;
	margin: 0 0 10px;
	font: 700 13px/1.2 var(--mvp-font-body);
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--mvp-alpenglow-deep); /* on light */
}

.mvp-small {
	font-size: 12px;
	line-height: 1.4;
}

@media (max-width: 760px) {
	.mvp-eyebrow {
		font-size: 12px;
	}
}

/* ---------- Bands (section rhythm: dark and light alternate) ---------- */

.mvp-band {
	position: relative;
	padding: var(--mvp-section-y) 0;
}

.mvp-band--timber {
	background: var(--mvp-timber);
	color: var(--mvp-body-on-dark);
}

.mvp-band--canvas {
	background: var(--mvp-canvas);
}

.mvp-band--canvas-2 {
	background: var(--mvp-canvas-2);
}

.mvp-band--timber .mvp-h1,
.mvp-band--timber .mvp-h2,
.mvp-band--timber .mvp-h3,
.mvp-band--timber .mvp-big {
	color: var(--mvp-canvas);
}

.mvp-band--timber .mvp-eyebrow {
	color: var(--mvp-alpenglow); /* 4.8 on Timber */
}

.mvp-band__head {
	position: relative;
	margin-bottom: 48px;
}

.mvp-band__head .mvp-lead {
	margin-top: 20px;
}

/* Topo lines: quiet, behind section headers only. The header area gets the texture; body content sits outside it. */
.mvp-topo {
	position: relative;
	isolation: isolate;
}

.mvp-topo::before {
	content: "";
	position: absolute;
	z-index: -1;
	inset: -40px -20px -24px -20px;
	background: url("../img/topo.svg") left center / 720px auto no-repeat;
	opacity: 0.16;
	pointer-events: none;
}

.mvp-band--timber .mvp-topo::before {
	background-image: url("../img/topo-dark.svg");
	opacity: 0.22;
}

/* ---------- Buttons ---------- */

.mvp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 15px 24px;
	border: 2px solid transparent;
	border-radius: var(--mvp-radius);
	font: 700 15px/1.1 var(--mvp-font-body);
	letter-spacing: 0.01em;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.15s, color 0.15s, border-color 0.15s;
}

.mvp-btn--primary {
	background: var(--mvp-alpenglow);
	border-color: var(--mvp-alpenglow);
	color: var(--mvp-timber); /* 4.8. Never white. */
}

.mvp-btn--primary:hover {
	background: var(--mvp-alpenglow-deep);
	border-color: var(--mvp-alpenglow-deep);
	color: var(--mvp-canvas); /* 5.0 */
}

.mvp-btn--outline {
	background: transparent;
	border-color: var(--mvp-timber);
	color: var(--mvp-timber);
}

.mvp-btn--outline:hover {
	background: var(--mvp-timber);
	color: var(--mvp-canvas);
}

.mvp-band--timber .mvp-btn--outline,
.mvp-hero .mvp-btn--outline,
.mvp-header .mvp-btn--outline {
	border-color: var(--mvp-canvas);
	color: var(--mvp-canvas);
}

.mvp-band--timber .mvp-btn--outline:hover,
.mvp-hero .mvp-btn--outline:hover,
.mvp-header .mvp-btn--outline:hover {
	background: var(--mvp-canvas);
	color: var(--mvp-timber);
}

.mvp-link {
	font-weight: 700;
	color: var(--mvp-timber);
	text-decoration: underline;
	text-decoration-color: var(--mvp-alpenglow);
	text-decoration-thickness: 2px;
	text-underline-offset: 4px;
}

.mvp-band--timber .mvp-link {
	color: var(--mvp-canvas);
}

/* Automatic link blocks (SEO.md): "Related", "Keep exploring" and the "Before you reach out" row. */
.mvp-explore__list {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 32px;
	margin: 24px 0 0;
	padding: 0;
	list-style: none;
}

/* Downloads page (2026-10-10): one row per file. */
.mvp-downloads {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: var(--mvp-border);
}

.mvp-downloads__item {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 6px 20px;
	padding: 18px 0;
	border-bottom: var(--mvp-border);
}

.mvp-downloads__file {
	font: 700 18px/1.3 var(--mvp-font-body);
	color: var(--mvp-timber);
	text-decoration: underline;
	text-decoration-color: var(--mvp-alpenglow);
	text-decoration-thickness: 2px;
	text-underline-offset: 4px;
}

.mvp-downloads__meta {
	color: var(--mvp-body);
	font-size: 14px;
}

.mvp-downloads__page {
	margin-left: auto;
	font-size: 15px;
}

.mvp-explore .mvp-actions {
	margin-top: 32px;
}

.mvp-explore--row {
	padding-top: 24px;
	padding-bottom: 24px;
}

.mvp-explore__row {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 12px 32px;
}

.mvp-explore__row .mvp-explore__list {
	margin: 0;
}

.mvp-explore__label {
	margin: 0;
	font-weight: 700;
	color: var(--mvp-body);
}

.mvp-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin-top: 32px;
}

/* ---------- Header ---------- */

.mvp-header {
	position: relative;
	z-index: 10;
	background: var(--mvp-timber);
	border-bottom: 1px solid var(--mvp-timber-line);
}

.mvp-header__bar {
	display: flex;
	align-items: center;
	gap: 32px;
	min-height: 90px;
}

.mvp-header__logo img {
	width: auto;
	height: 58px;
}

.mvp-nav {
	margin-left: auto;
}

.mvp-nav ul {
	display: flex;
	gap: 28px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.mvp-nav a {
	font: 500 15px/1.2 var(--mvp-font-body);
	color: var(--mvp-canvas);
	text-decoration: none;
}

.mvp-nav a:hover {
	text-decoration: underline;
	text-decoration-color: var(--mvp-alpenglow);
	text-decoration-thickness: 2px;
	text-underline-offset: 6px;
}

/* Menu groups (2026-10-10): a button opens each group's list (nav.js); hover and keyboard focus open it too. */
.mvp-nav__group {
	position: relative;
}

.mvp-nav__toggle {
	padding: 0;
	border: 0;
	background: none;
	color: var(--mvp-canvas);
	font: 500 15px/1.2 var(--mvp-font-body);
	white-space: nowrap;
	cursor: pointer;
}

.mvp-nav__toggle::after {
	content: "";
	display: inline-block;
	width: 6px;
	height: 6px;
	margin-left: 8px;
	border-right: 2px solid var(--mvp-alpenglow);
	border-bottom: 2px solid var(--mvp-alpenglow);
	transform: translateY(-3px) rotate(45deg);
}

.mvp-nav .mvp-nav__sub {
	display: none;
	position: absolute;
	top: calc(100% + 14px);
	left: -20px;
	z-index: 20;
	flex-direction: column;
	gap: 0;
	min-width: 240px;
	padding: 10px 0;
	background: var(--mvp-timber);
	border: 1px solid var(--mvp-timber-line);
}

.mvp-nav__label { /* Projects: a plain link on desktop; the heading and list are for the phone menu. */
	display: none;
}

.mvp-nav__sub::before { /* Bridges the gap so the list stays open on the way down. */
	content: "";
	position: absolute;
	top: -15px;
	left: 0;
	right: 0;
	height: 15px;
}

.mvp-nav__sub a {
	display: block;
	padding: 9px 20px;
}

.mvp-nav__group:hover .mvp-nav__sub,
.mvp-nav__group:focus-within .mvp-nav__sub,
.mvp-nav__toggle[aria-expanded="true"] + .mvp-nav__sub {
	display: flex;
}

.mvp-header .mvp-header__phone {
	font: 700 15px/1.2 var(--mvp-font-body);
	color: var(--mvp-canvas);
	text-decoration: none;
	white-space: nowrap;
}

.mvp-header__menu {
	display: none;
	order: 3;
	margin-left: auto;
	cursor: pointer;
	padding: 10px 12px;
	border: 2px solid var(--mvp-canvas);
	background: transparent;
	color: var(--mvp-canvas);
	font: 700 14px/1 var(--mvp-font-body);
}

.mvp-nav a,
.mvp-header__cta {
	white-space: nowrap;
}

@media (max-width: 1280px) {
	.mvp-nav ul {
		gap: 20px;
	}
	.mvp-header .mvp-header__phone {
		display: none;
	}
}

/* Below 1120 the nav moves into the menu (the button opens it; nav.js). */
@media (max-width: 1120px) {
	.mvp-header__bar {
		flex-wrap: wrap;
	}
	.mvp-header__menu {
		display: inline-block;
	}
	.mvp-header__cta {
		margin-left: auto;
	}
	.mvp-header__menu {
		margin-left: 12px;
	}
	.mvp-nav {
		display: none;
		order: 10;
		flex-basis: 100%;
		margin: 0;
		padding: 8px 0 20px;
		border-top: 1px solid var(--mvp-timber-line);
	}
	.mvp-header.is-open .mvp-nav {
		display: block;
	}
	.mvp-nav ul {
		flex-direction: column;
		gap: 0;
	}
	.mvp-nav a {
		display: block;
		padding: 12px 0;
		font-size: 17px;
	}
	/* In the open menu every group is listed in full under its name. */
	.mvp-nav__toggle {
		display: block;
		padding: 18px 0 4px;
		font: 700 12px/1.2 var(--mvp-font-body);
		letter-spacing: 0.18em;
		text-transform: uppercase;
		color: var(--mvp-sage);
		cursor: default;
		pointer-events: none;
	}
	.mvp-nav__toggle::after {
		display: none;
	}
	/* A one-page group (Projects) is listed like the others: its heading, then "All projects" (Kelsey 2026-10-12). */
	.mvp-nav .mvp-nav__top-link {
		display: none;
	}
	.mvp-nav .mvp-nav__label {
		display: block;
		padding: 18px 0 4px;
		font: 700 12px/1.2 var(--mvp-font-body);
		letter-spacing: 0.18em;
		text-transform: uppercase;
		color: var(--mvp-sage);
	}
	.mvp-nav .mvp-nav__top .mvp-nav__sub {
		display: flex;
	}
	.mvp-nav .mvp-nav__sub {
		display: flex;
		position: static;
		min-width: 0;
		padding: 0;
		border: 0;
	}
	.mvp-nav__sub::before {
		display: none;
	}
	.mvp-nav__sub a {
		padding: 10px 0;
	}
}

@media (max-width: 760px) {
	.mvp-header__bar {
		min-height: 68px;
		gap: 16px;
	}
	.mvp-header__logo img {
		height: 40px;
	}
	.mvp-header__cta {
		display: none;
	}
	.mvp-header__menu {
		margin-left: auto;
	}
}

/* ---------- Hero ---------- */

.mvp-hero {
	position: relative;
	display: grid;
	/* Height follows the width (47.5vw is close to the renders' 2.36:1), so the image is cropped little and the
	   browser's srcset choice (sizes="100vw") is the copy actually needed: nothing is stretched (DECISIONS 15). */
	min-height: clamp(560px, 47.5vw, min(88vh, 860px));
	background: var(--mvp-timber);
	color: var(--mvp-body-on-dark);
	overflow: hidden;
}

.mvp-hero .mvp-hero__img,
.mvp-hero .mvp-hero__img img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 70% 50%;
}

/* Timber gradient on the text side only (BRAND.md imagery: 95% to 0%). */
.mvp-hero::before {
	content: "";
	position: absolute;
	z-index: 1;
	inset: 0;
	background: linear-gradient(90deg, rgba(34, 54, 42, 0.95) 0%, rgba(34, 54, 42, 0.86) 34%, rgba(34, 54, 42, 0) 66%);
}

.mvp-hero__body {
	position: relative;
	z-index: 2;
	align-self: center;
	padding-top: 72px;
	padding-bottom: 96px;
}

.mvp-hero .mvp-h1 {
	max-width: 7.2em;
	color: var(--mvp-canvas);
}

.mvp-hero .mvp-eyebrow {
	color: var(--mvp-alpenglow);
}

.mvp-hero .mvp-lead {
	max-width: 34em;
	margin-top: 28px;
	color: var(--mvp-body-on-dark);
}

.mvp-hero .mvp-tag {
	z-index: 2;
}

@media (max-width: 760px) {
	.mvp-hero {
		min-height: 0;
		grid-template-rows: auto auto;
	}
	.mvp-hero::before {
		display: none;
	}
	.mvp-hero .mvp-hero__img {
		position: relative;
		order: 2;
		aspect-ratio: 4 / 3;
	}
	.mvp-hero .mvp-hero__img img {
		object-position: 72% 50%;
	}
	.mvp-hero__body {
		padding-top: 44px;
		padding-bottom: 40px;
	}
}

/* ---------- Image tags (every image carries one) ---------- */

.mvp-figure {
	position: relative;
	margin: 0;
}

.mvp-tag {
	position: absolute;
	right: 10px;
	bottom: 10px;
	padding: 3px 9px;
	background: rgba(34, 54, 42, 0.88);
	color: var(--mvp-canvas);
	font: 400 12px/1.4 var(--mvp-font-body);
	text-shadow: 0 1px 1px rgba(0, 0, 0, 0.25); /* The one allowed text shadow: labels over photos. */
}

@media (max-width: 760px) {
	.mvp-tag {
		font-size: 11px;
	}
}

/* ---------- Stat bar ---------- */

.mvp-stats {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0;
	margin: 0;
	padding: 0;
	border-top: 2px solid var(--mvp-alpenglow);
	list-style: none;
}

.mvp-stats li {
	padding: 28px 28px 8px 0;
}

.mvp-stats li + li {
	padding-left: 28px;
	border-left: 1px solid var(--mvp-timber-line);
}

.mvp-stats .mvp-big {
	display: block;
	color: var(--mvp-canvas);
}

.mvp-stats__label {
	display: block;
	margin-top: 12px;
	font-size: 15px;
	line-height: 1.45;
	color: var(--mvp-body-on-dark);
}

@media (max-width: 760px) {
	.mvp-stats {
		grid-template-columns: 1fr 1fr;
	}
	.mvp-stats li,
	.mvp-stats li + li {
		padding: 22px 16px 18px 0;
		border-left: 0;
	}
	.mvp-stats li:nth-child(even) {
		padding-left: 16px;
		border-left: 1px solid var(--mvp-timber-line);
	}
	.mvp-stats li:nth-child(n+3) {
		border-top: 1px solid var(--mvp-timber-line);
	}
}

/* ---------- Grids and panels ---------- */

.mvp-grid {
	display: grid;
	gap: 24px;
}

.mvp-grid--3 {
	grid-template-columns: repeat(3, 1fr);
}

.mvp-grid--2 {
	grid-template-columns: repeat(2, 1fr);
}

.mvp-grid--4 {
	grid-template-columns: repeat(4, 1fr);
}

@media (max-width: 1100px) {
	.mvp-grid--4 {
		grid-template-columns: repeat(2, 1fr);
	}
	.mvp-grid--3 {
		grid-template-columns: 1fr 1fr;
	}
}

/* Unit card rows need about 1,300 px for four cards (a card's name and size figure can't shrink below about 280 px), so
   they go to two columns sooner instead of running off the right edge at 1110 to 1300 px. 1340 leaves room for a
   desktop scrollbar. (Cody A Smith LLC patch, 2026-10-15.) */
@media (min-width: 761px) and (max-width: 1340px) {
	.mvp-units__row.mvp-grid--4 {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 760px) {
	.mvp-grid--2,
	.mvp-grid--3,
	.mvp-grid--4 {
		grid-template-columns: 1fr;
	}
}

/* Raised panel on Timber: labels here are Canvas or Body-on-dark only. */
.mvp-panel {
	display: flex;
	flex-direction: column;
	background: var(--mvp-timber-2);
	color: var(--mvp-body-on-dark);
}

/* Every card image the same shape, renders and placeholders alike (crop only). */
.mvp-panel .mvp-figure img,
.mvp-panel .mvp-placeholder,
.mvp-season .mvp-figure img,
.mvp-project .mvp-figure img,
.mvp-project .mvp-placeholder {
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
}

.mvp-panel__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 14px;
	padding: 24px 24px 28px;
}

.mvp-panel__label {
	font: 700 12px/1.2 var(--mvp-font-body);
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--mvp-canvas);
}

.mvp-panel p {
	margin: 0;
}

.mvp-panel .mvp-link {
	margin-top: auto;
}

/* ---------- Proof (real projects) ---------- */

.mvp-proof {
	display: grid;
	grid-template-columns: 1.35fr 1fr;
	gap: 24px;
}

.mvp-proof__side {
	display: grid;
	gap: 24px;
	align-content: start;
}

.mvp-project {
	background: var(--mvp-white);
	border: var(--mvp-border);
}

.mvp-project__body {
	padding: 20px 22px 24px;
}

.mvp-project__body p {
	margin: 8px 0 0;
}

.mvp-quote {
	margin: 0;
	padding: 28px;
	background: var(--mvp-timber);
	color: var(--mvp-body-on-dark);
}

.mvp-quote p {
	margin: 0;
	font-size: 17px;
	line-height: 1.55;
	color: var(--mvp-canvas);
}

.mvp-quote footer {
	margin-top: 16px;
	font: 700 13px/1.2 var(--mvp-font-body);
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--mvp-alpenglow);
}

.mvp-placeholder {
	display: grid;
	place-items: center;
	aspect-ratio: 4 / 3;
	padding: 24px;
	background: var(--mvp-canvas-2) repeating-linear-gradient(-45deg, transparent 0 14px, rgba(34, 54, 42, 0.05) 14px 15px);
	border: 1.5px dashed var(--mvp-timber);
	text-align: center;
	color: var(--mvp-timber);
}

@media (max-width: 980px) {
	.mvp-proof {
		grid-template-columns: 1fr;
	}
}

/* ---------- Unit cards ---------- */

.mvp-units__row + .mvp-units__row {
	margin-top: 56px;
}

.mvp-units__label {
	display: flex;
	align-items: baseline;
	gap: 16px;
	margin: 0 0 18px;
	padding-bottom: 10px;
	border-bottom: var(--mvp-border);
}

.mvp-units__intro {
	margin: -6px 0 18px;
	color: var(--mvp-body);
}

.mvp-unit {
	display: flex;
	flex-direction: column;
	background: var(--mvp-white);
	border: var(--mvp-border);
}

.mvp-unit .mvp-figure img,
.mvp-unit .mvp-placeholder {
	aspect-ratio: 3 / 2;
	width: 100%;
	object-fit: cover;
}

.mvp-unit__body {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 6px 16px;
	flex: 1;
	padding: 20px 22px 22px;
}

.mvp-unit__name {
	font-size: 36px;
	line-height: 0.95;
}

.mvp-unit__sqft {
	grid-row: span 2;
	text-align: right;
}

.mvp-unit__sqft .mvp-big {
	display: block;
}

.mvp-unit__sqft small {
	display: block;
	margin-top: 4px;
	font-size: 12px;
	color: var(--mvp-body);
}

.mvp-unit__specs {
	margin: 0;
	font-size: 14px;
	line-height: 1.5;
}

.mvp-unit__mix {
	grid-column: 1 / -1;
	margin: 0;
	font-size: 14px;
}

/* "Coming soon": name and badge only. */
.mvp-unit--soon .mvp-unit__body {
	grid-template-columns: 1fr;
}

.mvp-unit__soon {
	margin: 4px 0 0;
}

.mvp-badge {
	display: inline-block;
	padding: 4px 10px;
	font: 700 12px/1.3 var(--mvp-font-body);
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.mvp-badge--soon {
	background: var(--mvp-sage);
	color: var(--mvp-timber); /* 5.5 on Sage. Never white or Canvas on Sage (BRAND.md). */
}

.mvp-unit .mvp-link {
	grid-column: 1 / -1;
	align-self: end;
	margin-top: 10px;
	font-size: 14px;
}

/* ---------- Seasons ---------- */

.mvp-seasons {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
}

.mvp-season__body {
	padding: 22px 0 0;
}

.mvp-season__body p {
	margin: 10px 0 0;
}

@media (max-width: 760px) {
	.mvp-seasons {
		grid-template-columns: 1fr;
	}
}

/* ---------- Steps (How it works) ---------- */

.mvp-steps {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 32px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.mvp-step__num {
	display: flex;
	align-items: center;
	gap: 14px;
	font: 900 54px/0.9 var(--mvp-font-display);
	color: var(--mvp-alpenglow);
}

.mvp-step__num::after {
	content: "";
	flex: 1;
	height: 1px;
	background: var(--mvp-timber-line);
}

.mvp-step__name {
	margin: 18px 0 10px;
	font: 900 32px/0.95 var(--mvp-font-display);
	text-transform: uppercase;
	color: var(--mvp-canvas);
}

.mvp-step p {
	margin: 0;
}

@media (max-width: 1100px) {
	.mvp-steps {
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 760px) {
	.mvp-steps {
		grid-template-columns: 1fr;
		gap: 36px;
	}
}

.mvp-split {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 56px;
	align-items: center;
	margin-top: 64px;
}

@media (max-width: 980px) {
	.mvp-split {
		grid-template-columns: 1fr;
		gap: 28px;
	}
}

/* ---------- Form ---------- */

.mvp-formwrap {
	display: grid;
	grid-template-columns: 1fr 1.6fr;
	gap: 64px;
}

.mvp-formwrap__aside p {
	margin: 0 0 16px;
}

.mvp-form__contact a {
	font-weight: 700;
	color: var(--mvp-timber);
}

.mvp-form {
	background: var(--mvp-white);
	border: var(--mvp-border);
	padding: 32px;
}

.mvp-form__req {
	margin: 0 0 20px;
	font-size: 13px;
}

.mvp-form__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 22px 24px;
}

.mvp-field--wide,
.mvp-field--notes {
	grid-column: 1 / -1;
}

.mvp-field fieldset {
	margin: 0;
	padding: 0;
	border: 0;
}

.mvp-field__label {
	display: block;
	margin: 0 0 8px;
	padding: 0;
	font: 700 12px/1.3 var(--mvp-font-body);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--mvp-timber);
}

.mvp-field__req {
	color: var(--mvp-alpenglow-deep);
}

.mvp-field__hint,
.mvp-field__note {
	margin: -2px 0 8px;
	font-size: 13px;
	line-height: 1.45;
}

.mvp-field__note {
	margin: 8px 0 0;
	padding: 10px 12px;
	background: var(--mvp-canvas);
	border-left: 3px solid var(--mvp-sage);
	color: var(--mvp-timber);
}

.mvp-field input[type="text"],
.mvp-field input[type="email"],
.mvp-field input[type="tel"],
.mvp-field input[type="number"],
.mvp-field select,
.mvp-field textarea {
	width: 100%;
	min-height: 46px;
	padding: 11px 12px;
	border: var(--mvp-border);
	border-radius: var(--mvp-radius);
	background: var(--mvp-white);
	color: var(--mvp-timber);
	font: 400 14px/1.4 var(--mvp-font-body);
	appearance: none;
}

.mvp-field select {
	padding-right: 36px;
	background: var(--mvp-white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%2322362A' stroke-width='2'/%3E%3C/svg%3E") right 14px center no-repeat;
}

.mvp-field textarea {
	min-height: 120px;
	resize: vertical;
}

.mvp-choices {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.mvp-choice {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 8px 14px;
	border: var(--mvp-border);
	background: var(--mvp-white);
	font-size: 14px;
	color: var(--mvp-timber);
	cursor: pointer;
}

.mvp-choice input {
	width: 16px;
	height: 16px;
	margin: 0;
	accent-color: var(--mvp-timber);
}

.mvp-choice:has(input:checked) {
	background: var(--mvp-canvas);
	box-shadow: inset 0 0 0 1.5px var(--mvp-timber);
}

.mvp-field.has-error input,
.mvp-field.has-error select,
.mvp-field.has-error textarea {
	border-color: var(--mvp-alpenglow-deep);
	box-shadow: inset 0 0 0 1px var(--mvp-alpenglow-deep);
}

.mvp-field__error {
	margin: 0 0 8px;
	font-size: 13px;
	font-weight: 700;
	color: var(--mvp-alpenglow-deep);
}

.mvp-form__errors {
	margin: 0 0 24px;
	padding: 16px 18px;
	border-left: 4px solid var(--mvp-alpenglow-deep);
	background: var(--mvp-canvas);
	color: var(--mvp-timber);
}

.mvp-form__errors ul {
	margin: 8px 0 0;
	padding-left: 20px;
}

.mvp-form__errors a {
	color: var(--mvp-alpenglow-deep);
	font-weight: 700;
}

.mvp-form__actions {
	margin: 28px 0 0;
}

/* Honeypot: off screen; never display:none (some bots skip hidden fields). */
.mvp-form__hp {
	position: absolute;
	left: -10000px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

@media (max-width: 980px) {
	.mvp-formwrap {
		grid-template-columns: 1fr;
		gap: 32px;
	}
}

@media (max-width: 760px) {
	.mvp-form {
		padding: 22px 18px;
	}
	.mvp-form__grid {
		grid-template-columns: 1fr;
	}
	.mvp-form .mvp-btn {
		width: 100%;
	}
}

/* ---------- Footer ---------- */

.mvp-footer {
	padding: 64px 0 40px;
	background: var(--mvp-timber);
	color: var(--mvp-body-on-dark);
	border-top: 1px solid var(--mvp-timber-line);
}

.mvp-footer__grid {
	display: grid;
	grid-template-columns: auto repeat(6, 1fr); /* Seal, the five menu groups, Contact (2026-10-10). */
	gap: 32px;
	align-items: start;
}

.mvp-footer__seal img {
	width: 120px;
	height: 120px;
}

.mvp-footer h2 {
	margin: 0 0 14px;
	font: 700 12px/1.2 var(--mvp-font-body);
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--mvp-sage); /* 5.5 on Timber */
}

.mvp-footer ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.mvp-footer li {
	margin: 0 0 8px;
}

.mvp-footer a {
	color: var(--mvp-canvas);
	text-decoration: none;
}

.mvp-footer a:hover {
	text-decoration: underline;
	text-decoration-color: var(--mvp-alpenglow);
	text-underline-offset: 4px;
}

.mvp-footer address {
	font-style: normal;
}

.mvp-footer__legal {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 12px;
	margin-top: 48px;
	padding-top: 20px;
	border-top: 1px solid var(--mvp-timber-line);
	font-size: 13px;
}

@media (max-width: 1280px) {
	.mvp-footer__grid {
		grid-template-columns: repeat(3, 1fr);
	}
	.mvp-footer__seal {
		grid-column: 1 / -1;
	}
}

@media (max-width: 980px) {
	.mvp-footer__grid {
		grid-template-columns: 1fr 1fr;
	}
	.mvp-footer__seal {
		grid-column: 1 / -1;
	}
}

@media (max-width: 560px) {
	.mvp-footer__grid {
		grid-template-columns: 1fr;
		gap: 32px;
	}
	.mvp-footer__seal img {
		width: 96px;
		height: 96px;
	}
}

/* ---------- Copy markers, in brand colors ---------- */

.mvp-site .mvp-marker {
	display: inline-block;
	padding: 1px 6px;
	font: 700 11px/1.5 var(--mvp-font-body);
	letter-spacing: 0.04em;
	text-transform: none;
	vertical-align: middle;
	outline: 0;
}

.mvp-site .mvp-marker--draft {
	background: var(--mvp-sage);
	color: var(--mvp-timber); /* 5.5 */
}

.mvp-site .mvp-marker--kelsey {
	background: var(--mvp-alpenglow-deep);
	color: var(--mvp-white);
}

.mvp-h1 .mvp-marker,
.mvp-h2 .mvp-marker,
.mvp-h3 .mvp-marker,
.mvp-big .mvp-marker {
	font-size: 11px;
	vertical-align: top;
}

.mvp-demo .mvp-marker {
	display: none;
}

/* "Stackable" tag on unit cards (Ridgeline and Dakota only, Kelsey 2026-10-07). Timber on Sage: 5.5 (BRAND.md). */
.mvp-unit__tags {
	margin: 8px 0 0;
}

.mvp-badge--tag {
	background: var(--mvp-sage);
	color: var(--mvp-timber);
}

/* ---------- Revenue calculator ([mvp_revenue_calculator], DECISIONS D33 to D35) ---------- */

.mvp-calc {
	display: grid;
	grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
	border: var(--mvp-border);
	background: var(--mvp-white);
}

.mvp-calc [hidden] {
	display: none !important;
}

.mvp-calc__form {
	padding: 32px;
}

.mvp-calc__after {
	margin: 8px 0 0;
}

.mvp-calc__result {
	display: flex;
	flex-direction: column;
	padding: 32px;
	background: var(--mvp-timber);
	color: var(--mvp-body-on-dark);
}

.mvp-calc__result .mvp-eyebrow {
	color: var(--mvp-sage);
}

.mvp-calc__empty {
	margin: 16px 0 0;
	font-size: 15px;
}

.mvp-calc__nums {
	margin: 16px 0 0;
	padding: 0;
	list-style: none;
}

.mvp-calc__nums li {
	padding: 16px 0;
	border-top: 1px solid var(--mvp-timber-line);
}

.mvp-calc__nums li:first-child {
	border-top: 2px solid var(--mvp-alpenglow);
}

.mvp-calc__big {
	display: block;
	font: 900 44px/1 var(--mvp-font-display);
	letter-spacing: 0.01em;
	color: var(--mvp-canvas);
}

.mvp-calc__lbl {
	display: block;
	margin-top: 6px;
	font-size: 14px;
	line-height: 1.4;
}

.mvp-calc__how,
.mvp-calc__src {
	margin: 12px 0 0;
	font-size: 13px;
	line-height: 1.5;
}

.mvp-calc__src:empty {
	display: none;
}

.mvp-calc__legal {
	margin: 16px 0 0;
	padding: 10px 12px;
	border-left: 3px solid var(--mvp-sage);
	background: var(--mvp-timber-2);
	color: var(--mvp-canvas);
	font-size: 14px;
	line-height: 1.45;
}

.mvp-calc__cta {
	margin: 20px 0 0;
}

.mvp-calc__cta .mvp-btn {
	width: 100%;
}

.mvp-calc__carry {
	margin: 10px 0 0;
	color: var(--mvp-body-on-dark);
	font-size: 14px;
	text-align: center;
}

@media (max-width: 860px) {
	.mvp-calc {
		grid-template-columns: 1fr;
	}

	.mvp-calc__form,
	.mvp-calc__result {
		padding: 20px;
	}

	.mvp-calc .mvp-form__grid {
		grid-template-columns: 1fr;
	}
}

/* ---------- Plain MVP pages (templates/page.php) ---------- */

.mvp-page-lines {
	margin: 20px 0 0;
}

.mvp-page-lines p {
	max-width: 46em;
}

/* ---------- Timeline (templates/page.php "steps": Payment schedule and How it works, D37) ---------- */

.mvp-timeline {
	margin: 0 0 0 7px;
	padding: 0;
	list-style: none;
	border-left: 2px solid var(--mvp-timber);
}

.mvp-timeline__step {
	position: relative;
	display: grid;
	grid-template-columns: 150px minmax(0, 1fr);
	gap: 24px;
	align-items: start;
	padding: 28px 0 28px 36px;
}

.mvp-timeline__step + .mvp-timeline__step {
	border-top: 1px solid rgba(34, 54, 42, 0.18);
}

.mvp-timeline__step::before {
	content: "";
	position: absolute;
	top: 38px;
	left: -9px;
	width: 16px;
	height: 16px;
	background: var(--mvp-timber);
}

.mvp-timeline__step:last-child::before {
	background: var(--mvp-alpenglow);
}

.mvp-timeline__mark {
	font: 900 clamp(48px, 4.8vw, 68px)/0.85 var(--mvp-font-display);
	color: var(--mvp-timber);
}

.mvp-timeline__name {
	margin: 4px 0 8px;
	font: 900 clamp(26px, 2.2vw, 32px)/1 var(--mvp-font-display);
	text-transform: uppercase;
	color: var(--mvp-timber);
}

.mvp-timeline__body p {
	max-width: 40em;
	margin: 0;
	font-size: 17px;
	line-height: 1.55;
}

.mvp-timeline__body a {
	color: var(--mvp-alpenglow-deep);
	font-weight: 700;
}

.mvp-timeline__after { /* "Covered after you open" under the How it works steps (D75). */
	max-width: 46em;
	margin: 40px 0 0;
	padding: 20px 24px;
	border-left: 3px solid var(--mvp-alpenglow);
	background: var(--mvp-white);
}

.mvp-timeline__after p {
	margin: 6px 0 0;
}

.mvp-timeline__body p + p {
	margin-top: 10px;
}

.mvp-timeline__notes {
	max-width: 46em;
	margin: 40px 0 0;
	padding: 20px 24px;
	border-left: 3px solid var(--mvp-sage);
	background: var(--mvp-white);
}

.mvp-timeline__notes p {
	margin: 0;
	color: var(--mvp-timber);
}

.mvp-timeline__notes p + p {
	margin-top: 10px;
}

@media (max-width: 760px) {
	.mvp-timeline__step {
		grid-template-columns: 1fr;
		gap: 8px;
		padding: 22px 0 22px 24px;
	}

	.mvp-timeline__step::before {
		top: 30px;
	}

	.mvp-timeline__notes {
		padding: 16px 18px;
	}
}

.mvp-page-cta {
	text-align: center;
}

/* ---------- Page sections (includes/class-mvp-sections.php, D39) ---------- */

.mvp-hero--page {
	min-height: clamp(460px, 38vw, min(72vh, 680px));
}

.mvp-projects [hidden] {
	display: none !important;
}

/* A big pull quote on Timber. */
.mvp-sec__quote {
	max-width: 52em;
	padding: 0;
	background: none;
}

.mvp-sec__quote p {
	font: 900 clamp(30px, 3.2vw, 46px)/1.05 var(--mvp-font-display);
	text-transform: uppercase;
}

/* Text, with the seal or a photo beside it. */
.mvp-sec__text--side {
	display: grid;
	grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
	gap: 48px;
	align-items: center;
}

.mvp-sec__paras p {
	max-width: 40em;
	margin: 0 0 16px;
	font-size: 18px;
	line-height: 1.6;
}

.mvp-sec__paras a {
	color: var(--mvp-alpenglow-deep);
	font-weight: 700;
}

.mvp-sec__seal {
	justify-self: center;
	width: 200px;
	height: auto;
	background: var(--mvp-timber);
	border-radius: 50%;
	padding: 18px;
}

/* Lists (When modular fits). */
.mvp-sec__list {
	max-width: 46em;
	margin: 0;
	padding: 0;
	list-style: none;
}

.mvp-sec__list li {
	position: relative;
	padding: 14px 0 14px 28px;
	border-top: 1px solid rgba(34, 54, 42, 0.18);
	font-size: 18px;
	color: var(--mvp-timber);
}

.mvp-sec__list li::before {
	content: "";
	position: absolute;
	top: 23px;
	left: 0;
	width: 10px;
	height: 10px;
	background: var(--mvp-timber);
}

.mvp-sec__note {
	max-width: 46em;
	margin: 24px 0 0;
	font-size: 18px;
	font-weight: 700;
	color: var(--mvp-timber);
}

/* Tables (markets, plan comparison). */
.mvp-table-wrap {
	overflow-x: auto;
	border: var(--mvp-border);
	background: var(--mvp-white);
}

.mvp-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 15px;
}

.mvp-table th,
.mvp-table td {
	padding: 14px 16px;
	text-align: left;
	border-bottom: 1px solid rgba(34, 54, 42, 0.15);
	color: var(--mvp-timber);
	vertical-align: top;
}

.mvp-table thead th {
	font: 700 12px/1.3 var(--mvp-font-body);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	background: var(--mvp-canvas);
	border-bottom: 1.5px solid var(--mvp-timber);
}

.mvp-table tbody th {
	font-weight: 700;
}

.mvp-table a {
	color: var(--mvp-alpenglow-deep);
}

.mvp-table__src {
	margin: 12px 0 0;
	font-size: 13px;
}

.mvp-table--compare {
	min-width: 760px;
}

/* Projects filter. */
.mvp-filter__bar {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 0 28px;
}

.mvp-filter__btn {
	min-height: 44px;
	padding: 10px 16px;
	border: var(--mvp-border);
	border-radius: var(--mvp-radius);
	background: var(--mvp-white);
	color: var(--mvp-timber);
	font: 700 14px/1 var(--mvp-font-body);
	cursor: pointer;
}

.mvp-filter__btn[aria-pressed="true"] {
	background: var(--mvp-timber);
	color: var(--mvp-canvas);
}

.mvp-filter__none {
	margin: 0;
	font-size: 16px;
}

/* Plan pages. */
.mvp-plan__about { /* A few lines about the plan, above the specs (D102). */
	max-width: 68ch;
	margin: 0 0 40px;
}

.mvp-plan__about p {
	margin: 0 0 12px;
}

.mvp-plan__note { /* Under the floor plan (Sierra hot tub, D103). */
	margin: 8px 0 0;
	font-size: 14px;
}

.mvp-plan {
	display: grid;
	grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
	gap: 48px;
	align-items: start;
}

.mvp-specs {
	margin: 0;
	border-top: 2px solid var(--mvp-alpenglow);
}

.mvp-specs > div {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding: 12px 0;
	border-bottom: 1px solid rgba(34, 54, 42, 0.18);
}

.mvp-specs dt {
	font: 700 12px/1.6 var(--mvp-font-body);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--mvp-timber);
}

.mvp-specs dd {
	margin: 0;
	text-align: right;
	color: var(--mvp-timber);
}

.mvp-plan__h {
	margin: 32px 0 14px;
	font: 900 26px/1 var(--mvp-font-display);
	text-transform: uppercase;
	color: var(--mvp-timber);
}

.mvp-plan__floor .mvp-plan__h {
	margin-top: 0;
}

.mvp-plan__h--cs {
	margin-top: 64px;
}

.mvp-plan__uses {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.mvp-plan__floor .mvp-figure + .mvp-figure {
	margin-top: 20px;
}

.mvp-plan__floor img {
	background: var(--mvp-white);
}

/* Contact details. */
.mvp-contact {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	margin: 0;
}

.mvp-contact dt {
	margin: 0 0 8px;
	font: 700 12px/1.3 var(--mvp-font-body);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--mvp-timber);
}

.mvp-contact dd {
	margin: 0;
	font-size: 18px;
	line-height: 1.5;
	color: var(--mvp-timber);
}

.mvp-contact a {
	color: var(--mvp-timber);
	font-weight: 700;
}

@media (max-width: 860px) {
	.mvp-sec__text--side,
	.mvp-plan,
	.mvp-contact {
		grid-template-columns: 1fr;
	}

	.mvp-sec__text--side {
		gap: 28px;
	}
}

/* Tables stack into one block per row on phones. */
@media (max-width: 760px) {
	.mvp-table-wrap {
		overflow: visible;
	}

	.mvp-table--stack,
	.mvp-table--stack tbody,
	.mvp-table--stack tr,
	.mvp-table--stack th,
	.mvp-table--stack td {
		display: block;
		min-width: 0;
	}

	.mvp-table--stack thead {
		display: none;
	}

	.mvp-table--stack tr {
		padding: 12px 16px;
		border-bottom: 1.5px solid var(--mvp-timber);
	}

	.mvp-table--stack tr:last-child {
		border-bottom: 0;
	}

	.mvp-table--stack th,
	.mvp-table--stack td {
		padding: 6px 0;
		border: 0;
	}

	.mvp-table--stack tbody th {
		font-size: 17px;
	}

	.mvp-table--stack td {
		display: flex;
		justify-content: space-between;
		gap: 16px;
		text-align: right;
	}

	.mvp-table--stack td::before {
		content: attr(data-label);
		font: 700 11px/1.6 var(--mvp-font-body);
		letter-spacing: 0.14em;
		text-transform: uppercase;
		text-align: left;
	}
}

/* FAQ (section "faq", D40). */
.mvp-faq {
	max-width: 52em;
	border-top: 1.5px solid var(--mvp-timber);
}

.mvp-faq__item {
	border-bottom: 1px solid rgba(34, 54, 42, 0.2);
}

.mvp-faq__item summary {
	position: relative;
	padding: 18px 40px 18px 0;
	font-size: 18px;
	font-weight: 700;
	color: var(--mvp-timber);
	cursor: pointer;
	list-style: none;
}

.mvp-faq__item summary::-webkit-details-marker {
	display: none;
}

.mvp-faq__item summary::after {
	content: "+";
	position: absolute;
	top: 12px;
	right: 4px;
	font: 900 28px/1 var(--mvp-font-display);
}

.mvp-faq__item[open] summary::after {
	content: "\2013";
}

.mvp-faq__a p {
	margin: 0 0 20px;
	max-width: 44em;
	font-size: 17px;
	line-height: 1.6;
}

.mvp-faq__a a {
	color: var(--mvp-alpenglow-deep);
	font-weight: 700;
}

.mvp-faq__group + .mvp-faq__group {
	margin-top: 56px;
}

.mvp-faq__h {
	margin: 0 0 16px;
	font: 900 clamp(26px, 2.4vw, 34px)/1 var(--mvp-font-display);
	text-transform: uppercase;
	color: var(--mvp-timber);
}

/* Two ways to build and Zip Kit callouts (D44). MVP colors and fonts only. */
.mvp-two__panel .mvp-h3 {
	color: var(--mvp-canvas);
}

.mvp-two__panel .mvp-btn--outline {
	border-color: var(--mvp-canvas);
	color: var(--mvp-canvas);
}

.mvp-two__panel .mvp-btn--outline:hover {
	background: var(--mvp-canvas);
	color: var(--mvp-timber);
}

.mvp-two__panel .mvp-actions {
	margin-top: auto;
}

.mvp-zipkit {
	max-width: 46em;
	padding: 24px;
	border-left: 3px solid var(--mvp-sage);
	background: var(--mvp-white);
}

.mvp-zipkit__text {
	margin: 0 0 16px;
	font-size: 18px;
	color: var(--mvp-timber);
}

.mvp-zipkit .mvp-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 18px;
	margin: 0;
}

.mvp-zipkit__link {
	font-size: 14px;
	color: var(--mvp-timber);
}

.mvp-faq__cta {
	margin: -8px 0 20px;
}

.mvp-faq__cta .mvp-btn {
	min-height: 40px;
	padding: 10px 16px;
	font-size: 14px;
}

.mvp-sec__h {
	margin: 40px 0 14px;
	font: 900 clamp(26px, 2.4vw, 34px)/1 var(--mvp-font-display);
	text-transform: uppercase;
	color: var(--mvp-timber);
}

.mvp-sec__paras > .mvp-sec__h:first-child {
	margin-top: 0;
}

/* Branded 404 (QA 2026-10-09). */
.mvp-404 {
	min-height: 60vh;
}

.mvp-404__title {
	color: var(--mvp-timber);
}

.mvp-404__links {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 28px;
	margin: 24px 0;
	padding: 0;
	list-style: none;
	font-weight: 700;
}

.mvp-404__links a {
	color: var(--mvp-timber);
	text-decoration: underline;
	text-decoration-color: var(--mvp-alpenglow);
	text-underline-offset: 4px;
}

/* Plan page: the spec sheet download (Part B, 2026-10-09). */
.mvp-plan__download {
	margin: 24px 0 0;
}

/* Dakota card: "From 341" (D62). "From" is set smaller so the number stays on one line. */
.mvp-big__from {
	font-size: 0.45em;
	vertical-align: 0.15em;
}

/* Homepage: the Zip Kit line under the form (2026-10-10, D67). */
.mvp-zipkit-line {
	margin: 32px 0 0;
	font-size: 15px;
	color: var(--mvp-body);
}

.mvp-zipkit-line a {
	color: var(--mvp-alpenglow-deep);
	font-weight: 700;
}

/* What's included (D68): one card per group, then the on-site panel. */
.mvp-incl__intro {
	margin: 0 0 32px;
}

.mvp-incl__group {
	padding: 28px;
	background: var(--mvp-white);
	border: var(--mvp-border);
}

.mvp-incl__group .mvp-h3 {
	margin: 0 0 12px;
}

.mvp-incl__site {
	margin-top: 32px;
	padding: 28px;
	background: var(--mvp-timber);
	color: var(--mvp-body-on-dark);
}

.mvp-incl__site .mvp-h3 {
	margin: 0 0 10px;
	color: var(--mvp-canvas);
}

.mvp-incl__site p {
	margin: 0;
}

/* Menu sub-items and draft marks (Kelsey 2026-10-13, D92). A tool sits under its page, indented. */
.mvp-nav .mvp-nav__subitem a {
	padding-left: 36px;
	font-size: 0.92em;
}

.mvp-nav .mvp-nav__subitem a::before {
	content: "\21B3\00A0"; /* ↳ */
	color: var(--mvp-sage);
}

.mvp-footer .mvp-nav__subitem {
	padding-left: 14px;
}

/* "draft": only a logged-in editor ever sees it (the page is unpublished). Canvas on Timber, never Sage text. */
.mvp-nav__draft {
	display: inline-block;
	margin-left: 6px;
	padding: 1px 6px;
	font: 700 10px/1.4 var(--mvp-font-body);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	vertical-align: middle;
	color: var(--mvp-timber);
	background: var(--mvp-canvas);
}

/* Image slots waiting for a photo or rendering (Kelsey 2026-10-13, D93; IMAGES-NEEDED.md). Never on a live page:
   `wp mvp validate --launch` fails while one is left. */
.mvp-slot {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 12px;
	width: 100%;
	min-height: 220px;
	padding: 24px;
	background: var(--mvp-canvas-2) repeating-linear-gradient(-45deg, transparent 0 14px, rgba(34, 54, 42, 0.06) 14px 15px);
	border: 2px dashed var(--mvp-timber);
	color: var(--mvp-timber);
	font: 400 14px/1.45 var(--mvp-font-body);
	overflow: hidden;
}

.mvp-slot--hero {
	margin-top: 32px;
	max-height: 560px;
}

.mvp-slot__name {
	font: 700 12px/1.3 var(--mvp-font-body);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--mvp-alpenglow-deep);
}

.mvp-slot dl {
	display: grid;
	gap: 6px;
	margin: 0;
}

.mvp-slot dl div {
	display: grid;
	grid-template-columns: 130px 1fr;
	gap: 12px;
}

.mvp-slot dt {
	font-weight: 700;
}

.mvp-slot dd {
	margin: 0;
}

@media (max-width: 760px) {
	.mvp-slot {
		aspect-ratio: auto !important; /* The details need the room on a phone. */
	}

	.mvp-slot dl div {
		grid-template-columns: 1fr;
		gap: 0;
	}
}

/* The privacy policy line under the intake form (Kelsey 2026-10-13, D97). */
.mvp-form__privacy {
	margin: 12px 0 0;
	font-size: 14px;
}

.mvp-footer__legal a {
	margin-left: 12px;
}

.mvp-timeline__photos { /* D98 */
	margin-top: 48px;
}

.mvp-timeline__photos .mvp-figure img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}