.build-page {
	background:
		linear-gradient(180deg, rgba(246, 249, 254, .9), rgba(255, 255, 255, 0) 28rem),
		var(--c-bg, #fff);
	color: var(--c-text, #263042);
}

.build-hero,
.build-section,
.build-preview,
.build-cta {
	width: 100%;
	max-width: var(--container, 1200px);
	margin-inline: auto;
	padding: clamp(3rem, 2rem + 4vw, 6rem) var(--gutter, 1.25rem);
}

.build-section {
	padding-block: clamp(2.4rem, 1.7rem + 2.8vw, 4.5rem);
}

.build-index .build-section {
	padding-bottom: clamp(1.5rem, 1.1rem + 1.8vw, 2.75rem);
}

.build-index .build-section + .build-section {
	padding-top: clamp(1.75rem, 1.2rem + 2.4vw, 3.25rem);
}

.build-cta {
	padding-top: clamp(1.5rem, 1rem + 2vw, 3rem);
	padding-bottom: clamp(3rem, 2rem + 3.4vw, 5.25rem);
}

.build-hero__inner {
	display: grid;
	grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr);
	gap: clamp(1.5rem, 3vw, 3.5rem);
	align-items: center;
}

.build-eyebrow {
	margin: 0 0 .7rem;
	color: var(--c-accent, #F26B22);
	font-size: .78rem;
	font-weight: 800;
	letter-spacing: .16em;
	text-transform: uppercase;
}

.build-hero__title {
	max-width: 14ch;
	margin: 0;
	color: var(--c-ink, #1B2547);
	font-size: clamp(2.15rem, 1.5rem + 3.4vw, 4.8rem);
	line-height: 1.04;
	font-weight: 800;
}

.build-hero__lead {
	max-width: 58rem;
	margin: 1.25rem 0 0;
	color: var(--c-text-mute, #667085);
	font-size: clamp(1rem, .95rem + .3vw, 1.2rem);
	line-height: 1.9;
}

.build-actions {
	display: flex;
	flex-wrap: wrap;
	gap: .85rem;
	margin-top: 1.6rem;
}

.build-hero__panel {
	display: grid;
	gap: .85rem;
	padding: 1rem;
	background: rgba(255, 255, 255, .72);
	border: 1px solid var(--c-border, #D7DCE6);
	border-radius: 8px;
	box-shadow: var(--shadow-2, 0 12px 32px rgba(27, 37, 71, .08));
	backdrop-filter: blur(16px);
}

.build-stat {
	padding: 1rem;
	background: var(--c-paper, #fff);
	border: 1px solid var(--c-border-soft, #E6EAF2);
	border-radius: 8px;
}

.build-stat__value {
	display: block;
	color: var(--c-ink, #1B2547);
	font-size: clamp(1.75rem, 1.3rem + 2vw, 3rem);
	line-height: 1;
	font-weight: 800;
}

.build-stat__label {
	display: block;
	margin-top: .4rem;
	color: var(--c-text-mute, #667085);
	font-size: .82rem;
	font-weight: 700;
}

.build-section__head {
	max-width: 46rem;
	margin-bottom: 1.7rem;
}

.build-section__head h2,
.build-section h2,
.build-preview h2,
.build-cta h2 {
	margin: 0;
	color: var(--c-ink, #1B2547);
	font-size: clamp(1.55rem, 1.2rem + 1.6vw, 2.5rem);
	line-height: 1.25;
	font-weight: 800;
}

.build-section__head p,
.build-cta p,
.build-note p {
	color: var(--c-text-mute, #667085);
	line-height: 1.85;
}

.build-decision-grid,
.build-service-grid {
	display: grid;
	gap: 1rem;
}

.build-decision-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.build-service-grid {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.build-info-card,
.build-service-card,
.build-faq details {
	background: var(--c-paper, #fff);
	border: 1px solid var(--c-border-soft, #E6EAF2);
	border-radius: 8px;
	box-shadow: 0 8px 22px rgba(27, 37, 71, .045);
}

.build-info-card,
.build-service-card {
	padding: clamp(1rem, 2vw, 1.35rem);
}

.build-info-card__number {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	margin-bottom: 1rem;
	color: var(--c-accent, #F26B22);
	background: var(--c-accent-soft, #FFF0E8);
	border-radius: 999px;
	font-size: .78rem;
	font-weight: 800;
}

.build-info-card h3,
.build-service-card h3,
.build-process h3 {
	margin: 0;
	color: var(--c-ink, #1B2547);
	font-size: 1.05rem;
	line-height: 1.45;
	font-weight: 800;
}

.build-info-card p,
.build-service-card p,
.build-process p,
.build-faq p {
	margin: .65rem 0 0;
	color: var(--c-text-mute, #667085);
	line-height: 1.75;
}

.build-process {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1rem;
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: build-process;
}

.build-process li {
	position: relative;
	padding: clamp(1rem, 2vw, 1.35rem);
	background: var(--c-paper, #fff);
	border: 1px solid var(--c-border-soft, #E6EAF2);
	border-radius: 8px;
	box-shadow: 0 8px 22px rgba(27, 37, 71, .045);
	counter-increment: build-process;
}

.build-process li::before {
	display: block;
	margin-bottom: .85rem;
	color: var(--c-accent, #F26B22);
	font-size: .78rem;
	font-weight: 800;
	letter-spacing: .12em;
	content: "STEP " counter(build-process, decimal-leading-zero);
}

.build-faq {
	display: grid;
	gap: .75rem;
}

.build-faq details {
	padding: 1rem 1.15rem;
}

.build-faq summary {
	color: var(--c-ink, #1B2547);
	cursor: pointer;
	font-weight: 800;
	line-height: 1.55;
}

.build-faq summary::marker {
	color: var(--c-accent, #F26B22);
}

.build-thumb-table {
	overflow-x: auto;
	margin-bottom: 1.25rem;
	background: var(--c-paper, #fff);
	border: 1px solid var(--c-border, #D7DCE6);
	border-radius: 8px;
	box-shadow: 0 10px 28px rgba(27, 37, 71, .06);
}

.build-thumb-table table {
	width: 100%;
	min-width: 980px;
	border-collapse: collapse;
	table-layout: fixed;
}

.build-thumb-table__col-thumb {
	width: 7.25rem;
}

.build-thumb-table__col-sample {
	width: 38%;
}

.build-thumb-table__col-fit {
	width: 22%;
}

.build-thumb-table__col-price {
	width: 11.5rem;
}

.build-thumb-table__col-action {
	width: 4.75rem;
}

.build-thumb-table th,
.build-thumb-table td {
	padding: .95rem;
	text-align: left;
	vertical-align: middle;
	border-bottom: 1px solid var(--c-border-soft, #E6EAF2);
}

.build-thumb-table th {
	color: var(--c-text-dim, #7B8496);
	background: rgba(246, 249, 254, .84);
	font-size: .78rem;
	font-weight: 800;
}

.build-thumb-table tr:last-child td {
	border-bottom: 0;
}

.build-thumb-table strong,
.build-thumb-table small {
	display: block;
}

.build-thumb-table strong {
	margin-top: .45rem;
	color: var(--c-ink, #1B2547);
	line-height: 1.45;
}

.build-thumb-table small {
	margin-top: .35rem;
	color: var(--c-text-mute, #667085);
	font-size: .82rem;
	line-height: 1.65;
}

.build-thumb-table__image {
	width: 7.25rem;
}

.build-thumb-table__fit {
	color: var(--c-text, #263042);
	line-height: 1.7;
}

.build-thumb-table__price strong {
	white-space: nowrap;
}

.build-thumb-table__action {
	text-align: center;
}

.build-thumb-table__image a {
	display: block;
	width: 5.5rem;
	aspect-ratio: 2 / 3;
	overflow: hidden;
	background: #F6F9FE;
	border: 1px solid var(--c-border-soft, #E6EAF2);
	border-radius: 8px;
}

.build-thumb-table__image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top center;
	transition: transform .2s var(--ease, ease);
}

.build-thumb-table__image a:hover img {
	transform: scale(1.04);
}

.build-text-link {
	color: var(--c-ink, #1B2547);
	font-weight: 800;
	text-decoration: underline;
	text-underline-offset: .22em;
}

.build-cost-basis {
	margin: 0 0 1.75rem;
	padding: clamp(1.2rem, 2.4vw, 1.6rem);
	background: rgba(255, 240, 232, .7);
	border: 1px solid rgba(242, 107, 34, .24);
	border-radius: 8px;
}

.build-cost-basis h3 {
	margin: 0;
	color: var(--c-ink, #1B2547);
	font-size: 1.25rem;
	line-height: 1.35;
}

.build-cost-basis p,
.build-cost-basis li {
	color: var(--c-text, #263042);
	line-height: 1.8;
}

.build-cost-basis ul {
	display: grid;
	gap: .45rem;
	margin: .9rem 0;
	padding-left: 1.2rem;
}

.build-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
}

.build-card {
	display: flex;
	min-height: 17.5rem;
	flex-direction: column;
	padding: 1.25rem;
	color: inherit;
	background: var(--c-paper, #fff);
	border: 1px solid var(--c-border, #D7DCE6);
	border-radius: 8px;
	box-shadow: 0 8px 22px rgba(27, 37, 71, .05);
	text-decoration: none;
	transition: transform .2s var(--ease, ease), box-shadow .2s var(--ease, ease), border-color .2s var(--ease, ease);
}

.build-card:hover {
	color: inherit;
	border-color: var(--c-ink, #1B2547);
	box-shadow: 0 16px 34px rgba(27, 37, 71, .12);
	transform: translateY(-3px);
}

.build-card__cat {
	align-self: flex-start;
	padding: .28rem .58rem;
	color: var(--c-accent-deep, #B94A13);
	background: var(--c-accent-soft, #FFF0E8);
	border-radius: 6px;
	font-size: .72rem;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.build-card__title {
	margin: 1rem 0 .55rem;
	color: var(--c-ink, #1B2547);
	font-size: 1.18rem;
	line-height: 1.45;
}

.build-card__summary {
	margin: 0;
	color: var(--c-text-mute, #667085);
	font-size: .94rem;
	line-height: 1.8;
}

.build-card__meta {
	display: block;
	margin-top: auto;
	padding-top: 1rem;
	color: var(--c-text-dim, #7B8496);
	font-size: .82rem;
	border-top: 1px dashed var(--c-border-soft, #E6EAF2);
}

.build-card__link {
	margin-top: .7rem;
	color: var(--c-ink, #1B2547);
	font-weight: 800;
}

.build-cta__inner,
.build-note {
	padding: clamp(1.5rem, 2.8vw, 2.5rem);
	color: #fff;
	background:
		radial-gradient(circle at 92% 12%, rgba(242, 107, 34, .24), transparent 34%),
		linear-gradient(135deg, #1B2547, #10172B 64%, #0B1020);
	border-radius: 8px;
}

.build-cta h2,
.build-cta p,
.build-note h2,
.build-note p {
	color: #fff;
}

.build-cta .build-eyebrow,
.build-note .build-eyebrow {
	color: #FFB17D;
}

.build-brief dl {
	display: grid;
	gap: .85rem;
	margin: 0;
}

.build-brief div {
	padding: .95rem;
	background: var(--c-paper, #fff);
	border: 1px solid var(--c-border-soft, #E6EAF2);
	border-radius: 8px;
}

.build-brief dt {
	color: var(--c-text-dim, #7B8496);
	font-size: .78rem;
	font-weight: 800;
}

.build-brief dd {
	margin: .25rem 0 0;
	color: var(--c-ink, #1B2547);
	font-weight: 800;
}

.build-preview__frame {
	position: relative;
	overflow: hidden;
	height: min(78vh, 860px);
	min-height: 520px;
	background: #111827;
	border: 1px solid var(--c-border, #D7DCE6);
	border-radius: 8px;
	box-shadow: 0 18px 45px rgba(27, 37, 71, .16);
}

.build-preview__frame iframe {
	display: block;
	width: 100%;
	height: 100%;
	background: #fff;
	border: 0;
}

.build-preview__actions {
	display: flex;
	justify-content: flex-end;
	margin-top: 1rem;
}

.build-section--split {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
	align-items: start;
}

.build-list {
	display: grid;
	gap: .7rem;
	margin: 1rem 0 0;
	padding: 0;
	list-style: none;
}

.build-list li {
	position: relative;
	padding: .85rem 1rem .85rem 2.15rem;
	background: var(--c-paper, #fff);
	border: 1px solid var(--c-border-soft, #E6EAF2);
	border-radius: 8px;
	line-height: 1.7;
}

.build-list li::before {
	position: absolute;
	top: .95rem;
	left: .9rem;
	width: .55rem;
	height: .55rem;
	background: var(--c-accent, #F26B22);
	border-radius: 50%;
	content: "";
}

.build-list--muted li::before {
	background: var(--c-text-dim, #7B8496);
}

.build-grid--related {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

html[data-theme="dark"] .build-page {
	background:
		linear-gradient(180deg, rgba(16, 23, 43, .7), rgba(16, 23, 43, 0) 28rem),
		var(--c-bg, #0F1424);
}

html[data-theme="dark"] .build-hero__panel,
html[data-theme="dark"] .build-card,
html[data-theme="dark"] .build-stat,
html[data-theme="dark"] .build-brief div,
html[data-theme="dark"] .build-list li,
html[data-theme="dark"] .build-info-card,
html[data-theme="dark"] .build-service-card,
html[data-theme="dark"] .build-process li,
html[data-theme="dark"] .build-faq details,
html[data-theme="dark"] .build-thumb-table {
	background: rgba(17, 24, 39, .82);
}

html[data-theme="dark"] .build-thumb-table th {
	background: rgba(27, 37, 71, .9);
}

html[data-theme="dark"] .build-cost-basis {
	background: rgba(242, 107, 34, .11);
}

@media (max-width: 980px) {
	.build-hero__inner,
	.build-section--split {
		grid-template-columns: 1fr;
	}

	.build-decision-grid,
	.build-service-grid,
	.build-process {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.build-grid,
	.build-grid--related {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 640px) {
	.build-hero,
	.build-section,
	.build-preview,
	.build-cta {
		padding-block: 3rem;
	}

	.build-section {
		padding-block: 2.25rem;
	}

	.build-index .build-section {
		padding-bottom: 1.5rem;
	}

	.build-cta {
		padding-top: 1.5rem;
		padding-bottom: 3rem;
	}

	.build-grid,
	.build-grid--related,
	.build-decision-grid,
	.build-service-grid,
	.build-process {
		grid-template-columns: 1fr;
	}

	.build-card {
		min-height: auto;
	}

	.build-preview__frame {
		height: 68vh;
		min-height: 420px;
	}
}