/* =========================================================================
   Technochem Product Prospectus — Frontend
   Design system inspired by tecnochem.co.za
   ========================================================================= */

:root {
	--tcb-blue: #1974d2;
	--tcb-blue-strong: #125fac;
	--tcb-blue-soft: #e7f0fb;
	--tcb-navy: #0b1628;
	--tcb-navy-2: #16243a;
	--tcb-ink: #0b1220;
	--tcb-slate: #4b5869;
	--tcb-muted: #6b7686;
	--tcb-border: #e3e7ec;
	--tcb-border-strong: #cfd6df;
	--tcb-bg: #ffffff;
	--tcb-bg-soft: #f5f7fa;
	--tcb-bg-alt: #fafbfd;
	--tcb-accent: #f7b500;
	--tcb-radius: 14px;
	--tcb-radius-sm: 8px;
	--tcb-shadow-sm: 0 1px 2px rgba(15, 23, 36, .06), 0 1px 3px rgba(15, 23, 36, .04);
	--tcb-shadow-md: 0 10px 25px -10px rgba(15, 23, 36, .15), 0 4px 12px -4px rgba(15, 23, 36, .08);
	--tcb-shadow-lg: 0 30px 60px -20px rgba(15, 23, 36, .28), 0 12px 25px -8px rgba(15, 23, 36, .12);
	--tcb-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Inter", "Helvetica Neue", Arial, sans-serif;
	--tcb-font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
	--tcb-ease: cubic-bezier(.2, .7, .2, 1);
	--tcb-maxw: 1200px;
	--tcb-maxw-body: 1080px;
}

/* Scope typography on our components (don't poison themes) */
.tcb-archive, .tcb-catalogue, .tcb-single, .tcb-single__sheet-wrap, .tcb-single__callout, .tcb-factsheet, .tcb-card, .tcb-dash, .tcb-related {
	font-family: var(--tcb-font);
	color: var(--tcb-ink);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	box-sizing: border-box;
	line-height: 1.55;
}
.tcb-archive *, .tcb-catalogue *, .tcb-single *, .tcb-single__sheet-wrap *, .tcb-single__callout *, .tcb-factsheet *, .tcb-card *, .tcb-dash *, .tcb-related * { box-sizing: border-box; }

/* Full-bleed helper: escape theme content containers. Applied to the outermost
   plugin wrappers so theme content widths can't squeeze us.
   - 100vw includes the vertical scrollbar on some browsers; we use dvw/svw where
     available and fall back to 100vw.
   - !important on max-width defeats theme "entry-content * { max-width: 620px }"
     rules. */
.tcb-fullbleed {
	position: relative;
	width: 100vw;
	width: 100dvw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	left: 0;
	right: 0;
	max-width: 100vw !important;
	max-width: 100dvw !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* Re-centred inner wrapper used inside full-bleed containers */
.tcb-inner {
	max-width: var(--tcb-maxw);
	margin: 0 auto;
	padding: 0 clamp(1rem, 3vw, 2rem);
}

/* =========================================================================
   Shared elements
   ========================================================================= */

.tcb-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: .55rem;
	margin: 0 0 1rem;
	padding: .4rem .8rem;
	font-size: .72rem;
	letter-spacing: .22em;
	text-transform: uppercase;
	font-weight: 700;
	color: var(--tcb-blue);
	background: var(--tcb-blue-soft);
	border: 1px solid rgba(25, 116, 210, .22);
	border-radius: 999px;
	line-height: 1;
}
.tcb-eyebrow--light {
	color: #d6e4f7;
	background: rgba(255,255,255,.08);
	border-color: rgba(255,255,255,.15);
}

.tcb-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .55rem;
	padding: .85rem 1.35rem;
	border-radius: 999px;
	background: var(--tcb-blue);
	color: #fff;
	font-weight: 600;
	font-size: .95rem;
	letter-spacing: .01em;
	text-decoration: none;
	border: none;
	cursor: pointer;
	transition: background .18s var(--tcb-ease), transform .18s var(--tcb-ease), box-shadow .18s var(--tcb-ease);
	box-shadow: 0 6px 18px -6px rgba(25, 116, 210, .5);
	line-height: 1;
}
.tcb-button:hover { background: var(--tcb-blue-strong); transform: translateY(-1px); box-shadow: 0 10px 24px -8px rgba(25, 116, 210, .6); color: #fff; }
.tcb-button:focus-visible { outline: 3px solid rgba(25, 116, 210, .35); outline-offset: 2px; }
.tcb-button--on-dark { box-shadow: 0 6px 20px -6px rgba(0,0,0,.5); }
.tcb-button--on-dark:hover { background: #2b8bdf; }

/* =========================================================================
   Catalogue / Archive hero
   ========================================================================= */

.tcb-archive__hero,
.tcb-dash__hero {
	background:
		radial-gradient(1100px 500px at 85% -10%, rgba(37, 121, 210, .36), transparent 60%),
		radial-gradient(700px 400px at 5% 110%, rgba(25, 116, 210, .22), transparent 60%),
		linear-gradient(180deg, #0b1628 0%, #0f1e35 60%, #0b1628 100%);
	color: #fff;
	padding: clamp(4rem, 8vw, 6rem) clamp(1rem, 3vw, 2rem) clamp(5rem, 9vw, 7rem);
	position: relative;
	overflow: visible;
	isolation: isolate;
}
.tcb-archive__hero::before,
.tcb-dash__hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(60% 50% at 50% 0%, rgba(25,116,210,.25), transparent 60%);
	z-index: -1;
}
.tcb-archive__hero-inner,
.tcb-dash__hero-inner {
	max-width: var(--tcb-maxw);
	margin: 0 auto;
	text-align: center;
}
.tcb-archive__title,
.tcb-dash__title {
	font-size: clamp(2rem, 5.2vw, 3.6rem);
	line-height: 1.05;
	letter-spacing: -.02em;
	font-weight: 800;
	margin: 0 0 1rem;
	color: #fff;
}
.tcb-archive__lead,
.tcb-dash__lead {
	max-width: 640px;
	margin: 0 auto 1.5rem;
	color: #c9d3e0;
	font-size: clamp(1rem, 1.6vw, 1.12rem);
	line-height: 1.6;
}
.tcb-count-chip {
	display: inline-flex;
	align-items: center;
	gap: .65rem;
	padding: .55rem 1rem;
	border-radius: 999px;
	background: rgba(255,255,255,.08);
	border: 1px solid rgba(255,255,255,.15);
	font-weight: 600;
	font-size: .85rem;
	color: #eef4fb;
	letter-spacing: .04em;
}
.tcb-count-chip strong { color: #fff; font-weight: 700; }

/* Catalogue toolbar: floats up into the hero on top of the fade */
.tcb-catalogue__toolbar {
	max-width: var(--tcb-maxw-body);
	width: min(100%, var(--tcb-maxw-body));
	margin: -3.5rem auto 0;
	padding: 0 clamp(1rem, 3vw, 2rem);
	position: relative;
	z-index: 4;
}
.tcb-catalogue__toolbar-inner {
	background: #fff;
	border-radius: var(--tcb-radius);
	padding: 1rem 1.25rem;
	box-shadow: var(--tcb-shadow-md);
	border: 1px solid var(--tcb-border);
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 1rem;
	align-items: center;
}
.tcb-search {
	position: relative;
	display: flex;
	align-items: center;
	min-width: 0;
}
.tcb-search > svg {
	position: absolute;
	left: 1rem;
	color: var(--tcb-muted);
	width: 18px;
	height: 18px;
	pointer-events: none;
}
.tcb-search input {
	width: 100%;
	padding: .7rem 1rem .7rem 2.65rem;
	border: 1px solid var(--tcb-border);
	border-radius: 999px;
	font-size: .95rem;
	font-family: inherit;
	color: var(--tcb-ink);
	background: var(--tcb-bg-alt);
	transition: border-color .15s, background .15s, box-shadow .15s;
}
.tcb-search input:focus { border-color: var(--tcb-blue); background: #fff; outline: none; box-shadow: 0 0 0 3px rgba(25, 116, 210, .15); }
.tcb-catalogue__result-count { color: var(--tcb-muted); font-size: .88rem; white-space: nowrap; }

.tcb-catalogue__body {
	max-width: var(--tcb-maxw-body);
	margin: 2rem auto 4rem;
	padding: 0 clamp(1rem, 3vw, 2rem);
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: clamp(1.75rem, 3vw, 2.5rem);
}
.tcb-catalogue__empty {
	display: none;
	text-align: center;
	color: var(--tcb-muted);
	padding: 3rem 1rem;
	background: var(--tcb-bg-alt);
	border: 1px dashed var(--tcb-border);
	border-radius: var(--tcb-radius);
}

/* =========================================================================
   Product grid + cards
   ========================================================================= */

.tcb-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr));
	gap: clamp(1rem, 2vw, 1.75rem);
	margin: 0;
	padding: 0;
	list-style: none;
}
.tcb-grid--cols-2 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 380px), 1fr)); }
.tcb-grid--cols-4 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); }

.tcb-card {
	position: relative;
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--tcb-border);
	border-radius: var(--tcb-radius);
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	transition: transform .25s var(--tcb-ease), box-shadow .25s var(--tcb-ease), border-color .25s var(--tcb-ease);
	box-shadow: var(--tcb-shadow-sm);
	min-height: 100%;
}
.tcb-card::before {
	content: "";
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 3px;
	background: linear-gradient(90deg, var(--tcb-blue), #4aa3f0);
	opacity: 0;
	transition: opacity .25s var(--tcb-ease);
	z-index: 3;
}
.tcb-card:hover { transform: translateY(-4px); box-shadow: var(--tcb-shadow-lg); border-color: rgba(25, 116, 210, .35); }
.tcb-card:hover::before { opacity: 1; }
.tcb-card:focus-within { outline: 3px solid rgba(25, 116, 210, .3); outline-offset: 2px; }

.tcb-card__media {
	position: relative;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: linear-gradient(135deg, #0f1e35 0%, #1a365d 100%);
}
.tcb-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .45s var(--tcb-ease);
	display: block;
}
.tcb-card:hover .tcb-card__media img { transform: scale(1.06); }
.tcb-card__media-fallback {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: rgba(255,255,255,.45);
}
.tcb-card__media-fallback svg { width: 56px; height: 56px; }
.tcb-badge {
	position: absolute;
	top: 1rem;
	left: 1rem;
	padding: .35rem .7rem;
	background: rgba(25, 116, 210, .95);
	color: #fff;
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	border-radius: 999px;
	z-index: 2;
	backdrop-filter: blur(6px);
}
.tcb-card__body {
	padding: 1.2rem 1.25rem 1.4rem;
	display: flex;
	flex-direction: column;
	gap: .7rem;
	flex: 1;
}
.tcb-card__title {
	font-size: 1.08rem;
	line-height: 1.3;
	font-weight: 700;
	margin: 0;
	color: var(--tcb-ink);
	letter-spacing: -.005em;
}
.tcb-card__excerpt {
	color: var(--tcb-slate);
	font-size: .9rem;
	line-height: 1.5;
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.tcb-card__specs {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: .5rem;
	margin-top: .25rem;
	padding-top: .85rem;
	border-top: 1px dashed var(--tcb-border);
}
.tcb-card__spec-label {
	font-size: .62rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--tcb-muted);
	font-weight: 700;
	margin: 0 0 .15rem;
}
.tcb-card__spec-value {
	font-size: .82rem;
	color: var(--tcb-ink);
	margin: 0;
	line-height: 1.4;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.tcb-card__highlight {
	margin: .25rem 0 0;
	padding: .55rem .7rem;
	background: var(--tcb-blue-soft);
	color: var(--tcb-blue-strong);
	border-radius: var(--tcb-radius-sm);
	font-size: .78rem;
	font-weight: 600;
	line-height: 1.4;
	border-left: 3px solid var(--tcb-blue);
}
.tcb-card__cta {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	margin-top: .35rem;
	color: var(--tcb-blue);
	font-weight: 600;
	font-size: .9rem;
}
.tcb-card__cta svg { transition: transform .25s var(--tcb-ease); }
.tcb-card:hover .tcb-card__cta svg { transform: translateX(4px); }

/* Card link wrapper (the whole card is clickable) */
.tcb-card__link {
	display: flex;
	flex-direction: column;
	text-decoration: none;
	color: inherit;
	height: 100%;
}
.tcb-card__link:hover, .tcb-card__link:focus { color: inherit; }

/* Existing dl/dt/dd spec markup */
.tcb-card__specs { margin: 0; padding: 0; }
.tcb-card__spec { margin: 0; }
.tcb-card__spec dt {
	font-size: .62rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--tcb-muted);
	font-weight: 700;
	margin: 0 0 .15rem;
}
.tcb-card__spec dd {
	font-size: .82rem;
	color: var(--tcb-ink);
	margin: 0;
	line-height: 1.4;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Renderer uses .tcb-card__badge and .tcb-card__reveal */
.tcb-card__badge {
	position: absolute;
	top: 1rem;
	left: 1rem;
	padding: .35rem .7rem;
	background: rgba(25, 116, 210, .95);
	color: #fff;
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	border-radius: 999px;
	z-index: 2;
	backdrop-filter: blur(6px);
}
.tcb-card__reveal {
	margin: .25rem 0 0;
	padding: .55rem .7rem;
	background: var(--tcb-blue-soft);
	color: var(--tcb-blue-strong);
	border-radius: var(--tcb-radius-sm);
	font-size: .78rem;
	font-weight: 600;
	line-height: 1.4;
	border-left: 3px solid var(--tcb-blue);
}
.tcb-card__cta-arrow { transition: transform .25s var(--tcb-ease); }
.tcb-card:hover .tcb-card__cta-arrow { transform: translateX(4px); }

/* Grid column count helper classes used by render_grid_html() */
.tcb-grid--1 { grid-template-columns: 1fr; }
.tcb-grid--2 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 380px), 1fr)); }
.tcb-grid--3 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); }
.tcb-grid--4 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); }
.tcb-grid--5, .tcb-grid--6 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); }

/* Hide card if filtered */
.tcb-card[hidden] { display: none !important; }

/* Renderer uses .tcb-single__hero-text + .tcb-single__hero-placeholder */
.tcb-single__hero-text { max-width: 580px; }
.tcb-single__hero-placeholder {
	position: absolute; inset: 0;
	display: flex; align-items: center; justify-content: center;
	color: rgba(255,255,255,.25);
}
.tcb-single__hero-placeholder svg { width: 120px; height: 120px; }

/* Renderer's chip uses <p><span>…</span>value</p> */
.tcb-single__chip span {
	font-size: .65rem;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: #b9c7da;
	font-weight: 700;
	white-space: nowrap;
	margin-right: .75rem;
	display: inline-block;
}

/* Bullet list wrapper */
.tcb-item-list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: .6rem;
}

/* Link wrap (label next to link) */
.tcb-item--link-wrap {
	display: flex;
	align-items: center;
	gap: .75rem;
	flex-wrap: wrap;
	padding: .4rem 0;
}
.tcb-item--link-wrap > .tcb-item__label {
	font-size: .7rem;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--tcb-muted);
	font-weight: 700;
}
.tcb-item--link-wrap .tcb-sep { display: none; }

/* Hero count chip used by renderer as <p class="tcb-archive__count"> */
.tcb-archive__count {
	display: inline-flex;
	align-items: center;
	gap: .65rem;
	padding: .55rem 1rem;
	border-radius: 999px;
	background: rgba(255,255,255,.08);
	border: 1px solid rgba(255,255,255,.15);
	font-weight: 600;
	font-size: .85rem;
	color: #eef4fb;
	letter-spacing: .04em;
	margin: 0;
}
.tcb-archive__count strong { color: #fff; font-weight: 700; }

/* Pagination */
.tcb-pagination { margin-top: 3rem; display: flex; justify-content: center; }
.tcb-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.5rem; height: 2.5rem;
	padding: 0 .75rem;
	margin: 0 .2rem;
	border-radius: 999px;
	color: var(--tcb-ink);
	background: #fff;
	border: 1px solid var(--tcb-border);
	text-decoration: none;
	font-weight: 600;
	font-size: .9rem;
	transition: all .18s;
}
.tcb-pagination .page-numbers.current { background: var(--tcb-blue); color: #fff; border-color: var(--tcb-blue); }
.tcb-pagination .page-numbers:hover:not(.current) { border-color: var(--tcb-blue); color: var(--tcb-blue); }

/* =========================================================================
   Single product page
   ========================================================================= */

.tcb-single { color: var(--tcb-ink); background: var(--tcb-bg); }

.tcb-single__hero {
	background:
		radial-gradient(1100px 500px at 85% -10%, rgba(37, 121, 210, .4), transparent 60%),
		radial-gradient(700px 400px at 5% 110%, rgba(25, 116, 210, .22), transparent 60%),
		linear-gradient(180deg, #0b1628 0%, #0f1e35 60%, #0b1628 100%);
	color: #fff;
	padding: clamp(3rem, 7vw, 5.5rem) clamp(1rem, 3vw, 2rem) clamp(3.5rem, 7vw, 5rem);
	position: relative;
	overflow: hidden;
	isolation: isolate;
}
.tcb-single__hero-inner {
	max-width: var(--tcb-maxw);
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1.15fr 1fr;
	gap: clamp(2rem, 4vw, 4rem);
	align-items: center;
}
.tcb-single__hero-copy { max-width: 580px; }
.tcb-single__title {
	font-size: clamp(2.2rem, 5.5vw, 3.8rem);
	line-height: 1.05;
	letter-spacing: -.025em;
	font-weight: 800;
	margin: 0 0 1.2rem;
	color: #fff;
}
.tcb-single__lead {
	color: #d6dfe9;
	font-size: clamp(1.02rem, 1.6vw, 1.15rem);
	line-height: 1.65;
	margin: 0 0 1.75rem;
	max-width: 520px;
}
.tcb-single__hero-block {
	margin-top: 1.25rem;
	max-width: 520px;
	padding: 1rem 1.15rem;
	background: rgba(255, 255, 255, 0.07);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 14px;
}
.tcb-single__hero-block-label {
	margin: 0 0 0.5rem;
	font-size: 0.65rem;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	font-weight: 800;
	color: rgba(255, 255, 255, 0.55);
}
.tcb-single__hero-block-text {
	margin: 0;
	color: #e8edf4;
	font-size: 0.95rem;
	line-height: 1.6;
}
.tcb-single__chip {
	display: inline-flex;
	align-items: stretch;
	gap: .9rem;
	max-width: 480px;
	background: rgba(255,255,255,.06);
	border: 1px solid rgba(255,255,255,.12);
	border-radius: 14px;
	padding: .85rem 1.1rem;
	backdrop-filter: blur(6px);
}
.tcb-single__chip-label {
	font-size: .65rem;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: #b9c7da;
	font-weight: 700;
	white-space: nowrap;
	align-self: center;
}
.tcb-single__chip-value {
	color: #fff;
	font-size: .95rem;
	line-height: 1.5;
	margin: 0;
}
.tcb-single__hero-media {
	position: relative;
	aspect-ratio: 4 / 3;
	border-radius: 20px;
	overflow: hidden;
	background: linear-gradient(135deg, rgba(25,116,210,.3) 0%, rgba(15,30,53,.3) 100%);
	border: 1px solid rgba(255,255,255,.08);
	box-shadow: 0 30px 80px -20px rgba(0,0,0,.6);
}
.tcb-single__hero-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tcb-single__hero-media-fallback {
	position: absolute; inset: 0;
	display: flex; align-items: center; justify-content: center;
	color: rgba(255,255,255,.25);
}
.tcb-single__hero-media-fallback svg { width: 72px; height: 72px; }

/* Shared light sheet: feature cards + product specification (one background block) */
.tcb-single__sheet-wrap {
	background: var(--tcb-bg-alt);
	border-top: 1px solid var(--tcb-border);
	padding: clamp(2.5rem, 5vw, 4rem) clamp(1rem, 3vw, 2rem) clamp(2.5rem, 5vw, 4rem);
}

/* Body layout (inside sheet wrap) */
.tcb-single__body {
	max-width: var(--tcb-maxw-body);
	margin: 0 auto;
	padding: 0;
}

.tcb-single__callout {
	margin: 0 0 clamp(2rem, 4vw, 3rem);
}
.tcb-single__callout-inner {
	background: linear-gradient(165deg, #0d1830 0%, #0b1628 100%);
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 16px;
	padding: 1.35rem 1.5rem 1.5rem;
	box-shadow: var(--tcb-shadow-md);
	max-width: var(--tcb-maxw-body);
	margin-left: auto;
	margin-right: auto;
}
.tcb-single__callout-kicker {
	margin: 0 0 0.65rem;
	font-size: 0.68rem;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	font-weight: 800;
	color: rgba(255, 255, 255, 0.55);
}
.tcb-single__callout-text {
	color: #e8edf4;
	font-size: 1rem;
	line-height: 1.6;
	margin: 0;
}
.tcb-single__callout-text p {
	margin: 0 0 0.65rem;
}
.tcb-single__callout-text p:last-child {
	margin-bottom: 0;
}

/* --- Feature tiles (replaces the boring Value/Vs/Green table) --- */
.tcb-features {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
	gap: clamp(1rem, 2vw, 1.5rem);
	margin: 0 0 clamp(2.5rem, 5vw, 4rem);
}
.tcb-feature {
	position: relative;
	background: #fff;
	border: 1px solid var(--tcb-border);
	border-radius: 18px;
	padding: clamp(1.5rem, 2.5vw, 2rem);
	box-shadow: var(--tcb-shadow-sm);
	transition: transform .25s var(--tcb-ease), box-shadow .25s var(--tcb-ease), border-color .25s var(--tcb-ease);
	overflow: hidden;
}
.tcb-feature::before {
	content: "";
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 3px;
	background: linear-gradient(90deg, var(--tcb-blue), #4aa3f0);
	opacity: .85;
}
.tcb-feature:hover { transform: translateY(-3px); box-shadow: var(--tcb-shadow-md); border-color: rgba(25,116,210,.35); }
.tcb-feature__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 52px; height: 52px;
	border-radius: 14px;
	background: var(--tcb-blue-soft);
	color: var(--tcb-blue);
	margin-bottom: 1rem;
}
.tcb-feature__eyebrow {
	font-size: .7rem;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--tcb-blue);
	font-weight: 700;
	margin: 0 0 .5rem;
}
.tcb-feature__title {
	font-size: 1.25rem;
	font-weight: 700;
	margin: 0 0 .65rem;
	color: var(--tcb-ink);
	letter-spacing: -.01em;
	line-height: 1.25;
}
.tcb-feature__body {
	font-size: .97rem;
	line-height: 1.65;
	color: var(--tcb-slate);
	margin: 0;
}
.tcb-feature__body p {
	margin: 0 0 .65rem;
}
.tcb-feature__body p:last-child {
	margin-bottom: 0;
}

/* Feature tiles sit below the specification table — extra separation from factsheet */
.tcb-factsheet + .tcb-features.tcb-features--below-spec {
	margin-top: clamp(2rem, 4.5vw, 3.25rem);
}

/* --- CTA banner (dark mini hero in the middle of the body) --- */
.tcb-cta-banner {
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: center;
	gap: clamp(1.25rem, 3vw, 2.5rem);
	padding: clamp(1.75rem, 3vw, 2.5rem) clamp(1.75rem, 3vw, 2.5rem);
	border-radius: 22px;
	background:
		radial-gradient(600px 200px at 100% 0%, rgba(25,116,210,.35), transparent 55%),
		linear-gradient(135deg, #0b1628 0%, #1a365d 100%);
	color: #fff;
	margin: 0 0 clamp(2.5rem, 5vw, 4rem);
	box-shadow: var(--tcb-shadow-lg);
	overflow: hidden;
	position: relative;
}
.tcb-cta-banner__copy .tcb-eyebrow { margin-bottom: .75rem; }
.tcb-cta-banner__title {
	font-size: clamp(1.3rem, 2.6vw, 1.9rem);
	font-weight: 800;
	line-height: 1.2;
	margin: 0 0 .5rem;
	color: #fff;
	letter-spacing: -.01em;
}
.tcb-cta-banner__lead { color: #c9d3e0; font-size: 1rem; margin: 0; max-width: 560px; line-height: 1.55; }

/* --- Prospectus sections (premium look) --- */
.tcb-sections {
	display: flex;
	flex-direction: column;
	gap: clamp(1.25rem, 2vw, 1.75rem);
}
.tcb-section {
	background: #fff;
	border: 1px solid var(--tcb-border);
	border-radius: 20px;
	padding: clamp(1.5rem, 3vw, 2.5rem) clamp(1.5rem, 3vw, 2.75rem);
	box-shadow: var(--tcb-shadow-sm);
	transition: box-shadow .25s var(--tcb-ease);
}
.tcb-section:hover { box-shadow: var(--tcb-shadow-md); }
.tcb-section__header {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin: 0 0 clamp(1.25rem, 2.5vw, 1.75rem);
	padding-bottom: 1.25rem;
	border-bottom: 1px solid var(--tcb-border);
}
.tcb-section__accent {
	flex: 0 0 auto;
	width: 5px;
	height: 32px;
	background: linear-gradient(180deg, var(--tcb-blue), #4aa3f0);
	border-radius: 3px;
}
.tcb-section__title {
	font-size: clamp(1.35rem, 2.5vw, 1.75rem);
	font-weight: 800;
	margin: 0;
	color: var(--tcb-ink);
	letter-spacing: -.015em;
	line-height: 1.2;
}
.tcb-section__items {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

/* Item variants */
.tcb-item { margin: 0; padding: 0; }
.tcb-item--text {
	display: grid;
	grid-template-columns: minmax(140px, 200px) 1fr;
	gap: clamp(.75rem, 2vw, 1.5rem);
	padding: .9rem 0;
	border-bottom: 1px dashed var(--tcb-border);
	align-items: baseline;
}
.tcb-item--text:last-child { border-bottom: none; padding-bottom: 0; }
.tcb-item__label {
	font-size: .7rem;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--tcb-muted);
	font-weight: 700;
	margin: 0;
}
.tcb-item__value { color: var(--tcb-ink); font-size: 1.02rem; line-height: 1.6; margin: 0; }

.tcb-item--bullet {
	display: flex;
	gap: .85rem;
	padding: .35rem 0;
	align-items: baseline;
}
.tcb-item--bullet::before {
	content: "";
	flex: 0 0 auto;
	width: 8px; height: 8px;
	background: var(--tcb-blue);
	border-radius: 50%;
	margin-top: .55rem;
	box-shadow: 0 0 0 4px rgba(25,116,210,.15);
}
.tcb-item--bullet .tcb-item__label {
	font-size: 1.02rem;
	letter-spacing: normal;
	text-transform: none;
	font-weight: 600;
	color: var(--tcb-ink);
	white-space: nowrap;
	margin-right: .35rem;
}
.tcb-item--bullet .tcb-item__label::after {
	content: ":";
	margin-left: 2px;
	color: var(--tcb-muted);
	font-weight: 500;
}
.tcb-item--bullet .tcb-item__value { font-size: 1rem; }
.tcb-item--bullet.tcb-item--bullet-only .tcb-item__label::after { display: none; }

.tcb-item--link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1rem 1.2rem;
	background: var(--tcb-bg-alt);
	border: 1px solid var(--tcb-border);
	border-radius: 12px;
	text-decoration: none;
	color: var(--tcb-ink);
	transition: border-color .18s, background .18s, transform .18s;
}
.tcb-item--link:hover { border-color: var(--tcb-blue); background: var(--tcb-blue-soft); transform: translateX(3px); color: var(--tcb-blue-strong); }
.tcb-item--link .tcb-item__label { color: var(--tcb-muted); font-size: .7rem; }
.tcb-item--link .tcb-item__value { font-weight: 600; font-size: 1rem; }
.tcb-item--link::after {
	content: "→";
	color: var(--tcb-blue);
	font-size: 1.2rem;
	font-weight: 700;
	transition: transform .2s;
}
.tcb-item--link:hover::after { transform: translateX(3px); }

/* =========================================================================
   Product specification / fact sheet (second output on single product)
   ========================================================================= */

.tcb-factsheet {
	background: transparent;
	margin: 0;
	padding: clamp(1.75rem, 3vw, 2.5rem) 0 0;
	border: 0;
}
.tcb-factsheet__inner {
	max-width: var(--tcb-maxw-body);
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	padding: 0;
}
.tcb-factsheet__head {
	margin-bottom: 1.5rem;
	text-align: left;
}
.tcb-factsheet__kicker {
	margin: 0 0 .5rem;
	font-size: .72rem;
	letter-spacing: .2em;
	text-transform: uppercase;
	font-weight: 700;
	color: var(--tcb-blue);
}
.tcb-factsheet__title {
	margin: 0 0 .5rem;
	font-size: clamp(1.35rem, 2.5vw, 1.75rem);
	font-weight: 800;
	letter-spacing: -.02em;
	color: var(--tcb-ink);
}
.tcb-factsheet__lede {
	margin: 0;
	color: var(--tcb-slate);
	font-size: .95rem;
	max-width: 48rem;
}
.tcb-factsheet__box {
	background: #fff;
	border: 1px solid var(--tcb-border);
	border-radius: var(--tcb-radius);
	box-shadow: var(--tcb-shadow-sm);
	overflow: hidden;
}
.tcb-factsheet__table {
	width: 100%;
	border-collapse: collapse;
	font-size: .92rem;
}
.tcb-factsheet__table th,
.tcb-factsheet__table td {
	padding: .75rem 1.1rem;
	text-align: left;
	vertical-align: top;
	border-bottom: 1px solid var(--tcb-border);
}
.tcb-factsheet__table tr:last-child th,
.tcb-factsheet__table tr:last-child td {
	border-bottom: none;
}
.tcb-factsheet__table th[scope="row"] {
	width: 32%;
	max-width: 14rem;
	font-weight: 600;
	color: var(--tcb-slate);
	background: var(--tcb-bg-soft);
	border-right: 1px solid var(--tcb-border);
	font-size: .82rem;
	letter-spacing: .02em;
}
.tcb-factsheet__table td {
	color: var(--tcb-ink);
	line-height: 1.55;
}
.tcb-factsheet__table td p {
	margin: 0 0 .5rem;
}
.tcb-factsheet__table td p:last-child {
	margin-bottom: 0;
}
.tcb-factsheet__band th {
	background: #f0f4f8;
	color: var(--tcb-ink);
	font-size: .8rem;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
	text-align: left;
	border-bottom: 1px solid var(--tcb-border-strong);
	border-right: none;
	width: auto;
	max-width: none;
	padding: .65rem 1.1rem;
}
.tcb-factsheet__a {
	color: var(--tcb-blue);
	font-weight: 600;
	text-decoration: none;
}
.tcb-factsheet__a:hover { text-decoration: underline; }
.tcb-factsheet__img {
	display: block;
	max-width: min(100%, 360px);
	height: auto;
	border-radius: var(--tcb-radius-sm);
	border: 1px solid var(--tcb-border);
}

/* =========================================================================
   Related products
   ========================================================================= */

.tcb-related {
	background: var(--tcb-bg-soft);
	padding: clamp(3rem, 6vw, 5rem) clamp(1rem, 3vw, 2rem);
	border-top: 1px solid var(--tcb-border);
}
.tcb-related__inner { max-width: var(--tcb-maxw); margin: 0 auto; }
.tcb-related__head { text-align: center; margin-bottom: 2.5rem; }
.tcb-related__title {
	font-size: clamp(1.75rem, 3.5vw, 2.4rem);
	font-weight: 800;
	margin: 0;
	color: var(--tcb-ink);
	letter-spacing: -.02em;
}

/* =========================================================================
   Responsive
   ========================================================================= */

@media (max-width: 900px) {
	.tcb-single__hero-inner {
		grid-template-columns: 1fr;
		gap: 2rem;
	}
	.tcb-single__hero-media { max-width: 480px; margin: 0 auto; width: 100%; }
	.tcb-catalogue__toolbar-inner { grid-template-columns: 1fr; }
	.tcb-cta-banner { grid-template-columns: 1fr; text-align: left; }
	.tcb-item--text { grid-template-columns: 1fr; gap: .25rem; }
	.tcb-item--text .tcb-item__label { margin-bottom: .1rem; }
}

@media (max-width: 600px) {
	.tcb-archive__title, .tcb-dash__title, .tcb-single__title { font-size: clamp(1.75rem, 7vw, 2.2rem); }
	.tcb-section { padding: 1.25rem 1.1rem; }
	.tcb-feature { padding: 1.25rem; }
	.tcb-card__body { padding: 1rem 1.1rem 1.2rem; }
	.tcb-card__specs { grid-template-columns: 1fr; }
	.tcb-factsheet__table th[scope="row"],
	.tcb-factsheet__table td {
		display: block;
		width: 100%;
		border-right: none;
	}
	.tcb-factsheet__table th[scope="row"] {
		padding-bottom: .35rem;
		border-bottom: none;
	}
	.tcb-factsheet__table td {
		padding-top: 0;
		padding-bottom: 1rem;
		border-bottom: 1px solid var(--tcb-border);
	}
	.tcb-factsheet__band th {
		display: block;
		width: 100%;
	}

	/* Catalogue (mobile): space under search strip, centered toolbar copy, single-column grid */
	.tcb-catalogue__toolbar {
		margin-top: -2.35rem;
	}
	.tcb-catalogue__body {
		gap: clamp(1.75rem, 5vw, 2.75rem);
	}
	.tcb-catalogue__toolbar-inner {
		justify-items: center;
		text-align: center;
	}
	.tcb-catalogue__toolbar-inner .tcb-catalogue__result-count {
		justify-self: center;
		text-align: center;
		white-space: normal;
	}
	/* Archive template: toolbar has no inner wrapper */
	.tcb-archive__body.tcb-catalogue__body > .tcb-catalogue__toolbar {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 0.65rem;
	}
	.tcb-archive__body.tcb-catalogue__body > .tcb-catalogue__toolbar .tcb-search {
		width: 100%;
	}
	.tcb-archive__body.tcb-catalogue__body > .tcb-catalogue__toolbar .tcb-catalogue__result-count {
		width: 100%;
		text-align: center;
		white-space: normal;
	}
	.tcb-catalogue__body > .tcb-grid {
		grid-template-columns: 1fr;
		justify-items: center;
		width: 100%;
		gap: clamp( 0.75rem, 3vw, 1.15rem );
	}
	.tcb-catalogue__body > .tcb-grid > .tcb-card {
		max-width: min( 19rem, 88vw );
		width: 100%;
		border-radius: var(--tcb-radius-sm);
	}
	.tcb-catalogue .tcb-card__media { aspect-ratio: 16 / 10; }
	.tcb-catalogue .tcb-card__media-fallback svg { width: 44px; height: 44px; }
	.tcb-catalogue .tcb-card__body {
		padding: 0.82rem 0.92rem 0.95rem;
		gap: 0.45rem;
	}
	.tcb-catalogue .tcb-card__title { font-size: 0.96rem; }
	.tcb-catalogue .tcb-card__excerpt {
		font-size: 0.8rem;
		line-height: 1.42;
	}
	.tcb-catalogue .tcb-card__specs {
		padding-top: 0.65rem;
		margin-top: 0.15rem;
		gap: 0.4rem;
	}
	.tcb-catalogue .tcb-card__spec-label { font-size: 0.58rem; margin: 0 0 0.08rem; }
	.tcb-catalogue .tcb-card__spec-value { font-size: 0.76rem; line-height: 1.35; }
	.tcb-catalogue .tcb-card__highlight {
		font-size: 0.72rem;
		padding: 0.42rem 0.55rem;
		margin-top: 0.1rem;
	}
	.tcb-catalogue .tcb-card__cta { font-size: 0.8rem; margin-top: 0.2rem; }
	.tcb-catalogue .tcb-badge {
		top: 0.62rem;
		left: 0.62rem;
		padding: 0.26rem 0.52rem;
		font-size: 0.58rem;
	}