/**
 * Manufacturing pages (templates/manufacturing-page.php). Loaded after
 * b2b-collection.css and core-page.css; adds the blocks the product pages don't use.
 * Everything is scoped to .mrb-mfg; html[data-theme="night"] swaps the B2B tokens.
 */

/* ---------- Chapter doors: the hub's two chapters with their pages ---------- */
.mrb-mfg .mrb-mfg-doors {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
}
.mrb-mfg .mrb-mfg-door {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border: 1px solid var(--b2b-line);
	border-radius: 18px;
	background: var(--b2b-paper);
	box-shadow: var(--b2b-shadow);
}
.mrb-mfg .mrb-mfg-door__media { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: var(--b2b-soft); }
.mrb-mfg .mrb-mfg-door__media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.mrb-mfg .mrb-mfg-door:hover .mrb-mfg-door__media img { transform: scale(1.03); }
.mrb-mfg .mrb-mfg-door__body { display: flex; flex: 1; flex-direction: column; padding: 26px 28px 28px; }
.mrb-mfg .mrb-mfg-door__title { margin: 0 0 10px; font-size: 26px; line-height: 1.2; }
.mrb-mfg .mrb-mfg-door__title a { color: var(--b2b-title); text-decoration: none; }
.mrb-mfg .mrb-mfg-door__title a:hover { color: var(--cp-link); text-decoration: underline; text-underline-offset: .18em; }
.mrb-mfg .mrb-mfg-door__desc { margin: 0 0 18px; color: var(--b2b-muted); font-size: 15.5px; line-height: 1.6; }
.mrb-mfg .mrb-mfg-door__label {
	margin: 0 0 8px;
	color: var(--b2b-eyebrow);
	font: 700 11.5px/1.35 var(--b2b-mono);
	letter-spacing: .15em;
	text-transform: uppercase;
}
.mrb-mfg .mrb-mfg-door__list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 6px 18px;
	margin: 0 0 20px;
	padding: 0;
	list-style: none;
}
.mrb-mfg .mrb-mfg-door__list li { position: relative; padding-left: 16px; font-size: 15px; line-height: 1.5; }
.mrb-mfg .mrb-mfg-door__list li::before {
	content: "";
	position: absolute;
	top: .62em;
	left: 0;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--b2b-brand);
}
.mrb-mfg .mrb-mfg-door__list a { color: var(--b2b-ink); text-decoration: none; }
.mrb-mfg .mrb-mfg-door__list a:hover { color: var(--cp-link); text-decoration: underline; text-underline-offset: .18em; }
.mrb-mfg .mrb-mfg-door__more { margin-top: auto; }
.mrb-mfg .mrb-mfg-door__more .mrb-cp-link { font-weight: 700; }

/* ---------- Split: section copy beside a photo ---------- */
.mrb-mfg .mrb-mfg-split {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
	gap: 56px;
	align-items: center;
}
.mrb-mfg .mrb-mfg-split.is-reverse > .mrb-mfg-split__media { order: -1; }
.mrb-mfg .mrb-mfg-split .mrb-cp-head { margin-bottom: 26px; }
.mrb-mfg .mrb-mfg-split__media {
	margin: 0;
	overflow: hidden;
	border: 1px solid var(--b2b-line);
	border-radius: 18px;
	background: var(--b2b-soft);
	box-shadow: var(--b2b-shadow);
}
.mrb-mfg .mrb-mfg-split__media img { display: block; width: 100%; height: auto; max-height: 580px; object-fit: cover; }

/* ---------- Check list ---------- */
.mrb-mfg .mrb-mfg-checks { display: grid; gap: 14px; max-width: 70ch; margin: 0; padding: 0; list-style: none; }
.mrb-mfg .mrb-mfg-checks > li { position: relative; padding-left: 36px; color: var(--b2b-muted); font-size: 15.5px; line-height: 1.6; }
.mrb-mfg .mrb-mfg-checks > li::before {
	content: "";
	position: absolute;
	top: .1em;
	left: 0;
	width: 24px;
	height: 24px;
	border: 1px solid var(--b2b-pill-line);
	border-radius: 50%;
	background: var(--b2b-pill-bg);
}
.mrb-mfg .mrb-mfg-checks > li::after {
	content: "";
	position: absolute;
	top: calc(.1em + 6px);
	left: 9px;
	width: 6px;
	height: 10px;
	border: solid var(--b2b-pill-ink);
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}
.mrb-mfg .mrb-mfg-checks strong { color: var(--b2b-title); font-weight: 650; }
.mrb-mfg .mrb-mfg-checks a { color: var(--cp-link); font-weight: 600; text-decoration: underline; text-underline-offset: .2em; }

/* ---------- Timeline: the order journey, step by step ---------- */
.mrb-mfg .mrb-mfg-timeline { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; counter-reset: mfg-step; }
.mrb-mfg .mrb-mfg-timeline > li {
	position: relative;
	display: grid;
	grid-template-columns: 64px minmax(0, 1fr) 200px;
	gap: 0 22px;
	padding: 22px 0 26px;
	border-top: 1px solid var(--b2b-line);
}
.mrb-mfg .mrb-mfg-timeline > li:last-child { border-bottom: 1px solid var(--b2b-line); }
.mrb-mfg .mrb-mfg-timeline > li::before {
	counter-increment: mfg-step;
	content: counter(mfg-step, decimal-leading-zero);
	grid-row: 1 / span 2;
	color: var(--b2b-brand);
	font: 700 30px/1 var(--b2b-display);
	letter-spacing: -.02em;
}
.mrb-mfg .mrb-mfg-timeline h3 { margin: 0 0 8px; color: var(--b2b-title); font-size: 21px; line-height: 1.25; }
.mrb-mfg .mrb-mfg-timeline p { grid-column: 2; margin: 0; color: var(--b2b-muted); font-size: 15.5px; line-height: 1.6; }
.mrb-mfg .mrb-mfg-timeline p + p { margin-top: 6px; }
.mrb-mfg .mrb-mfg-timeline a { color: var(--cp-link); font-weight: 600; text-decoration: underline; text-underline-offset: .2em; }
.mrb-mfg .mrb-mfg-timeline__time {
	grid-column: 3;
	grid-row: 1 / span 2;
	align-self: start;
	justify-self: end;
	padding: 8px 14px;
	border: 1px solid var(--b2b-pill-line);
	border-radius: 999px;
	background: var(--b2b-pill-bg);
	color: var(--b2b-pill-ink);
	font: 600 13px/1.3 var(--b2b-mono);
	white-space: nowrap;
}

/* ---------- Two feature cards side by side / four steps ---------- */
.mrb-mfg .mrb-cp-features.is-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mrb-mfg .mrb-cp-steps.is-four { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* ---------- Note: limits and rules ---------- */
.mrb-mfg .mrb-mfg-note {
	max-width: 880px;
	margin-top: 30px;
	padding: 22px 26px;
	border: 1px solid var(--b2b-line);
	border-left: 4px solid var(--b2b-brand);
	border-radius: var(--cp-radius);
	background: var(--b2b-paper);
}
.mrb-mfg .mrb-mfg-note h3 { margin: 0 0 8px; color: var(--b2b-title); font-size: 18px; line-height: 1.3; }
.mrb-mfg .mrb-mfg-note p { color: var(--b2b-muted); font-size: 15px; }
.mrb-mfg .mrb-mfg-note p + p { margin-top: 8px; }
.mrb-mfg .mrb-mfg-note a { color: var(--cp-link); font-weight: 600; text-decoration: underline; text-underline-offset: .2em; }

/* ---------- Definition list: key facts ---------- */
.mrb-mfg .mrb-mfg-facts {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
	margin: 0;
}
.mrb-mfg .mrb-mfg-facts > div {
	padding: 18px 20px;
	border: 1px solid var(--b2b-line);
	border-radius: var(--cp-radius);
	background: var(--b2b-paper);
}
.mrb-mfg .mrb-mfg-facts dt {
	margin: 0 0 6px;
	color: var(--b2b-eyebrow);
	font: 700 11.5px/1.35 var(--b2b-mono);
	letter-spacing: .15em;
	text-transform: uppercase;
}
.mrb-mfg .mrb-mfg-facts dd { margin: 0; color: var(--b2b-title); font-size: 15.5px; line-height: 1.55; }
.mrb-mfg .mrb-mfg-facts dd a { color: var(--cp-link); text-decoration: underline; text-underline-offset: .2em; }

/* Links inside table cells. */
.mrb-mfg .mrb-cp-table :is(th, td) a { color: var(--cp-link); text-decoration: underline; text-underline-offset: .2em; }

/* ---------- Responsive ---------- */
@media (max-width: 980px) {
	.mrb-mfg .mrb-cp-steps.is-four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.mrb-mfg .mrb-mfg-split { grid-template-columns: 1fr; gap: 34px; }
	.mrb-mfg .mrb-mfg-split.is-reverse > .mrb-mfg-split__media { order: 0; }
	.mrb-mfg .mrb-mfg-split__media { max-width: 640px; }
	.mrb-mfg .mrb-mfg-doors { grid-template-columns: 1fr; }
	.mrb-mfg .mrb-mfg-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.mrb-mfg .mrb-mfg-timeline > li { grid-template-columns: 52px minmax(0, 1fr); }
	.mrb-mfg .mrb-mfg-timeline > li::before { font-size: 24px; }
	.mrb-mfg .mrb-mfg-timeline__time { grid-column: 2; grid-row: auto; justify-self: start; margin-top: 12px; }
}
@media (max-width: 650px) {
	.mrb-mfg .mrb-cp-features.is-two,
	.mrb-mfg .mrb-cp-steps.is-four,
	.mrb-mfg .mrb-mfg-facts,
	.mrb-mfg .mrb-mfg-door__list { grid-template-columns: 1fr; }
	.mrb-mfg .mrb-mfg-note { padding: 18px 20px; }
	.mrb-mfg .mrb-mfg-door__body { padding: 20px 18px 22px; }
	.mrb-mfg .mrb-mfg-door__title { font-size: 22px; }
	/* Page cards are rows here: the card line is the page's meta description, so keep it to three lines. */
	.mrb-mfg .mrb-mfg-hub .mrb-cp-card__desc {
		display: -webkit-box;
		overflow: hidden;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
	}
	.mrb-mfg .mrb-mfg-split__media img { max-height: 420px; }
	.mrb-mfg .mrb-mfg-timeline > li { grid-template-columns: 40px minmax(0, 1fr); gap: 0 14px; }
}
