/* =========================================================================
   3CBusiness School, main stylesheet
   Hand-authored, no build step. Sections:
   1 tokens · 2 reset · 3 typography · 4 layout · 5 buttons · 6 header
   7 footer · 8 hero · 9 cards · 10 sections · 11 stats · 12 accordion
   13 forms · 14 nav bits · 15 placeholders · 16 motion · 17 responsive
   ========================================================================= */

/* 1 · TOKENS ------------------------------------------------------------ */

:root {
	--brand-900: #0E1E4A;
	--brand-800: #14275E;
	--brand-700: #1B2C5E;
	--brand-600: #2A3D75;
	--brand-500: #3D5290;
	--accent-600: #C98620;
	--accent-500: #E8A33D;
	--accent-400: #F0B45C;
	--accent-300: #F7D9A6;

	--ink-900: #12203F;
	--ink-700: #3A4560;
	--ink-500: #646E8A;
	--line: #E3E7F0;
	--cloud: #EEF1F8;
	--mist: #F5F7FB;
	--cream: #FFFDF6;
	--sand: #FAF6EC;
	--white: #FFFFFF;

	--g-brand: linear-gradient(135deg, #14275E 0%, #2A3D75 100%);
	--g-brand-deep: linear-gradient(135deg, #0E1E4A 0%, #14275E 55%, #2A3D75 100%);
	--g-gold: linear-gradient(135deg, #C98620 0%, #E8A33D 55%, #F0B45C 100%);
	/* Gold for text on white, where the bright stops fall under 3:1. */
	--g-gold-ink: linear-gradient(135deg, #96610F 0%, #B0741A 100%);

	--shadow-soft: 0 1px 2px rgba(20, 39, 94, .06), 0 12px 32px rgba(20, 39, 94, .10);
	--shadow-lift: 0 2px 4px rgba(20, 39, 94, .09), 0 20px 48px rgba(20, 39, 94, .14);

	--r-sm: 8px;
	--r-md: 16px;
	--r-lg: 24px;
	--r-pill: 999px;

	--container: 1200px;
	--container-wide: 1360px;
	--gutter: 24px;
	--section-y: clamp(4rem, 8vw, 7rem);
	--header-h: 76px;

	--font-display: Sora, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
	--font-body: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
	--font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

	--ease: cubic-bezier(.22, .61, .36, 1);
}

/* 2 · RESET ------------------------------------------------------------- */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 24px); }

body {
	margin: 0;
	background: var(--white);
	color: var(--ink-700);
	font-family: var(--font-body);
	font-size: 1.0625rem;
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}

img, svg, video { max-width: 100%; height: auto; display: block; }
svg { flex-shrink: 0; }

a { color: var(--brand-800); text-underline-offset: 3px; }
a:hover { color: var(--brand-900); }

button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }

/* Navy, not gold: a focus ring is a UI component boundary and must clear 3:1
   against the page. Gold #E8A33D is only 2.2:1 on white; navy #14275E is 14.2:1. */
:focus-visible {
	outline: 3px solid var(--brand-800);
	outline-offset: 2px;
	border-radius: 3px;
}

/* 3 · TYPOGRAPHY -------------------------------------------------------- */

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-display);
	color: var(--ink-900);
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: -.02em;
	margin: 0 0 .6em;
	text-wrap: balance;
}

h1 { font-size: clamp(2.5rem, 1.6rem + 3.2vw, 4rem); }
h2 { font-size: clamp(2rem, 1.5rem + 1.8vw, 3rem); }
h3 { font-size: clamp(1.375rem, 1.2rem + .7vw, 1.75rem); }
h4 { font-size: clamp(1.125rem, 1.05rem + .35vw, 1.25rem); font-weight: 600; }

p { margin: 0 0 1.15em; }
p:last-child { margin-bottom: 0; }

.tcbs-lead {
	font-size: clamp(1.125rem, 1.05rem + .35vw, 1.25rem);
	line-height: 1.6;
	color: var(--ink-700);
}

.tcbs-prose { max-width: 68ch; overflow-wrap: break-word; }
.tcbs-prose h2 { margin-top: 1.8em; }
.tcbs-prose h3 { margin-top: 1.6em; }
.tcbs-prose ul, .tcbs-prose ol { padding-left: 1.25em; margin: 0 0 1.15em; }
.tcbs-prose li { margin-bottom: .45em; }
.tcbs-prose blockquote {
	margin: 2rem 0;
	padding: 1.25rem 0 1.25rem 1.75rem;
	border-left: 3px solid var(--accent-500);
	font-family: var(--font-display);
	font-size: 1.25rem;
	line-height: 1.5;
	color: var(--ink-900);
}

.tcbs-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--brand-800);
	margin: 0 0 1rem;
}

.tcbs-eyebrow::before {
	content: "";
	width: 24px;
	height: 2px;
	background: var(--g-gold);
	border-radius: 2px;
}

.tcbs-gradient-text {
	background: var(--g-brand);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

/* 4 · LAYOUT ------------------------------------------------------------ */

.tcbs-container {
	width: min(100% - (var(--gutter) * 2), var(--container));
	margin-inline: auto;
}

.tcbs-container--wide { width: min(100% - (var(--gutter) * 2), var(--container-wide)); }

.tcbs-main { display: block; }

.tcbs-section { padding-block: var(--section-y); }
.tcbs-section--tight { padding-block: clamp(2.5rem, 5vw, 4rem); }
.tcbs-section--mist { background: var(--mist); }
.tcbs-section--cloud { background: var(--cloud); }
.tcbs-section--cream { background: var(--cream); }
.tcbs-section--sand { background: var(--sand); }

/* Full-bleed navy band. Gold is legible here (6.6:1), so headings may take it. */
.tcbs-section--navy {
	position: relative;
	overflow: hidden;
	background: var(--g-brand-deep);
	color: rgba(255, 255, 255, .88);
	isolation: isolate;
}

.tcbs-section--navy h1,
.tcbs-section--navy h2,
.tcbs-section--navy h3 { color: var(--accent-500); }
.tcbs-section--navy .tcbs-eyebrow { color: var(--accent-400); }
.tcbs-section--navy .tcbs-eyebrow::before { background: var(--accent-500); }
.tcbs-section--navy strong { color: var(--white); }
.tcbs-section--navy a:not(.tcbs-btn) { color: var(--accent-400); }
.tcbs-section--navy .tcbs-lead { color: rgba(255, 255, 255, .9); }

.tcbs-section--navy::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		radial-gradient(30rem 20rem at 12% 0%, rgba(232, 163, 61, .16), transparent 62%),
		radial-gradient(26rem 18rem at 92% 100%, rgba(61, 82, 144, .5), transparent 60%);
}

.tcbs-section__head { max-width: 760px; margin-bottom: clamp(2.5rem, 5vw, 3.5rem); }
.tcbs-section__head--center { margin-inline: auto; text-align: center; }
.tcbs-section__head--center .tcbs-eyebrow { justify-content: center; }
.tcbs-section__title { margin-bottom: .4em; }

.tcbs-grid { display: grid; gap: 24px; }
.tcbs-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tcbs-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.tcbs-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.tcbs-grid--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }

.tcbs-split {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(2rem, 5vw, 4.5rem);
	align-items: center;
}

.tcbs-split--flip > *:first-child { order: 2; }

.tcbs-skip {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 200;
	padding: .75rem 1.25rem;
	background: var(--brand-800);
	color: var(--white);
	border-radius: 0 0 var(--r-sm) 0;
	text-decoration: none;
}

.tcbs-skip:focus { left: 0; color: var(--brand-900); }

/* 5 · BUTTONS ----------------------------------------------------------- */

.tcbs-btn {
	display: inline-flex;
	max-width: 100%;
	align-items: center;
	justify-content: center;
	gap: .55rem;
	padding: .875rem clamp(1rem, 4vw, 1.75rem);
	border: 1px solid transparent;
	white-space: normal;
	text-align: center;
	border-radius: var(--r-sm);
	font-weight: 600;
	font-size: 1rem;
	line-height: 1.2;
	text-decoration: none;
	transition: transform .18s var(--ease), box-shadow .18s var(--ease), background .18s var(--ease), color .18s var(--ease);
}

.tcbs-btn--sm { padding: .625rem clamp(.75rem, 3vw, 1.15rem); font-size: .9375rem; }

.tcbs-btn--primary {
	background: var(--brand-800);
	color: var(--white);
	box-shadow: 0 1px 2px rgba(20, 39, 94, .2), 0 8px 20px rgba(20, 39, 94, .18);
}

.tcbs-btn--primary:hover {
	background: var(--brand-900);
	color: var(--white);
	transform: translateY(-2px);
	box-shadow: 0 2px 4px rgba(20, 39, 94, .26), 0 14px 30px rgba(20, 39, 94, .24);
}

/* Gold button, for navy backgrounds only, where gold clears 6.6:1. */
.tcbs-btn--gold {
	background: var(--accent-500);
	color: var(--brand-900);
	box-shadow: 0 1px 2px rgba(14, 30, 74, .24), 0 8px 20px rgba(232, 163, 61, .28);
}

.tcbs-btn--gold:hover {
	background: var(--accent-400);
	color: var(--brand-900);
	transform: translateY(-2px);
}

.tcbs-btn--outline {
	background: transparent;
	border-color: var(--line);
	color: var(--brand-900);
}

.tcbs-btn--outline:hover {
	border-color: var(--accent-600);
	background: var(--mist);
	color: var(--brand-900);
	transform: translateY(-2px);
}

.tcbs-btn--ghost { background: rgba(255, 255, 255, .12); color: var(--white); border-color: rgba(255, 255, 255, .34); }
.tcbs-btn--ghost:hover { background: rgba(255, 255, 255, .2); color: var(--white); }

.tcbs-arrowlink {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	font-weight: 600;
	color: var(--brand-800);
	text-decoration: none;
}

.tcbs-arrowlink svg { transition: transform .2s var(--ease); }
.tcbs-arrowlink:hover svg, a:hover .tcbs-arrowlink svg { transform: translateX(4px); }

.tcbs-actions { display: flex; flex-wrap: wrap; gap: .875rem; align-items: center; }

/* 6 · HEADER ------------------------------------------------------------ */

.tcbs-header {
	position: sticky;
	top: 0;
	z-index: 100;
	background: rgba(255, 255, 255, .88);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border-bottom: 1px solid transparent;
	transition: border-color .25s var(--ease), box-shadow .25s var(--ease);
}

.tcbs-header.is-stuck {
	border-bottom-color: var(--line);
	box-shadow: 0 1px 24px rgba(20, 39, 94, .06);
}

.tcbs-header__inner {
	width: min(100% - (var(--gutter) * 2), var(--container-wide));
	margin-inline: auto;
	min-height: var(--header-h);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1.5rem;
	transition: height .25s var(--ease);
}

.tcbs-header.is-stuck .tcbs-header__inner { min-height: 64px; }

.tcbs-header__brand { flex-shrink: 1; min-width: 0; }
.tcbs-header__actions { margin-left: auto; display: flex; align-items: center; gap: .75rem; }

.tcbs-logo {
	display: inline-flex;
	align-items: center;
	gap: .625rem;
	text-decoration: none;
	color: var(--ink-900);
}

.tcbs-logo__mark { transition: transform .3s var(--ease); }
.tcbs-logo:hover .tcbs-logo__mark { transform: rotate(-6deg) scale(1.04); }

.tcbs-logo__mark--img {
	display: block;
	width: clamp(40px, 8vw, 52px);
	height: auto;
	aspect-ratio: 1;
	object-fit: contain;
	flex-shrink: 0;
}

/* A circular emblem with lettering in it reads wrong when rotated. */
.tcbs-logo:hover .tcbs-logo__mark--img { transform: scale(1.05); }

.tcbs-logo__text {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: clamp(1rem, 3.6vw, 1.1875rem);
	letter-spacing: -.02em;
	overflow-wrap: anywhere;
	min-width: 0;
}

.tcbs-logo__3c {
	background: var(--g-gold);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.custom-logo { max-height: 48px; width: auto; }

/* nav */

.tcbs-nav { display: block; }

.tcbs-nav__list {
	display: flex;
	align-items: center;
	gap: .25rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.tcbs-nav__list > li { position: relative; display: flex; align-items: center; }

.tcbs-nav__list > li > a {
	display: block;
	padding: .5rem .75rem;
	font-size: .9375rem;
	font-weight: 500;
	color: var(--ink-700);
	text-decoration: none;
	border-radius: var(--r-sm);
	white-space: nowrap;
	transition: color .18s var(--ease), background .18s var(--ease);
}

.tcbs-nav__list > li > a:hover,
.tcbs-nav__list > li.current-menu-item > a,
.tcbs-nav__list > li.current-menu-ancestor > a { color: var(--brand-800); background: var(--mist); }

.tcbs-nav__toggle {
	display: inline-flex;
	align-items: center;
	padding: .25rem;
	margin-left: -.4rem;
	background: none;
	border: 0;
	color: var(--ink-500);
	border-radius: var(--r-sm);
}

.tcbs-nav__toggle svg { transition: transform .2s var(--ease); }
.tcbs-nav__toggle[aria-expanded="true"] svg { transform: rotate(180deg); }

.tcbs-nav__panel {
	position: absolute;
	top: calc(100% + 10px);
	left: -.5rem;
	min-width: 260px;
	padding: .5rem;
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--r-md);
	box-shadow: var(--shadow-lift);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-8px);
	transition: opacity .2s var(--ease), transform .2s var(--ease), visibility .2s;
}

.tcbs-nav__list > li:hover > .tcbs-nav__panel,
.tcbs-nav__toggle[aria-expanded="true"] + .tcbs-nav__panel {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.tcbs-nav__panel::before {
	content: "";
	position: absolute;
	top: -10px;
	left: 0;
	right: 0;
	height: 10px;
}

.tcbs-nav__sub { list-style: none; margin: 0; padding: 0; }

.tcbs-nav__sub a {
	display: block;
	padding: .625rem .875rem;
	font-size: .9375rem;
	color: var(--ink-700);
	text-decoration: none;
	border-radius: var(--r-sm);
	transition: background .16s var(--ease), color .16s var(--ease);
}

.tcbs-nav__sub a:hover { background: var(--mist); color: var(--brand-800); }

/* burger + drawer */

.tcbs-burger {
	display: none;
	padding: .5rem;
	background: none;
	border: 1px solid var(--line);
	border-radius: var(--r-sm);
	color: var(--ink-900);
}

.tcbs-burger__close { display: none; }
.tcbs-burger[aria-expanded="true"] .tcbs-burger__open { display: none; }
.tcbs-burger[aria-expanded="true"] .tcbs-burger__close { display: block; }

.tcbs-drawer {
	display: none;
	border-top: 1px solid var(--line);
	background: var(--white);
	max-height: calc(100dvh - var(--header-h));
	overflow-y: auto;
}

.tcbs-drawer__inner { padding: 1.25rem var(--gutter) 2rem; }
.tcbs-drawer .tcbs-nav__list { flex-direction: column; align-items: stretch; gap: 0; }
.tcbs-drawer .tcbs-nav__list > li { flex-wrap: wrap; border-bottom: 1px solid var(--line); }
.tcbs-drawer .tcbs-nav__list > li > a { flex: 1; padding: .9rem .25rem; font-size: 1.0625rem; }
.tcbs-drawer .tcbs-nav__toggle { padding: .9rem .5rem; margin: 0; }

.tcbs-drawer .tcbs-nav__panel {
	position: static;
	display: none;
	width: 100%;
	min-width: 0;
	padding: 0 0 .75rem .75rem;
	border: 0;
	box-shadow: none;
	opacity: 1;
	visibility: visible;
	transform: none;
}

.tcbs-drawer .tcbs-nav__toggle[aria-expanded="true"] + .tcbs-nav__panel { display: block; }
.tcbs-drawer__cta { width: 100%; margin-top: 1.5rem; }

/* 7 · FOOTER ------------------------------------------------------------ */

.tcbs-footer { background: var(--mist); border-top: 1px solid var(--line); }

.tcbs-footer__motto {
	background: var(--g-brand-deep);
	color: var(--white);
	text-align: center;
	padding: 2.25rem 0;
}

.tcbs-footer__motto p:first-child {
	font-family: var(--font-display);
	font-size: clamp(1.0625rem, .95rem + .55vw, 1.5rem);
	font-weight: 600;
	margin-bottom: .5rem;
	letter-spacing: -.01em;
}

.tcbs-footer__tagline {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: .75rem;
	font-size: .9375rem;
	color: var(--accent-300);
	margin: 0;
}

.tcbs-dot { width: 5px; height: 5px; border-radius: 50%; background: var(--accent-400); }

.tcbs-footer__cols {
	display: grid;
	grid-template-columns: 1.6fr 1fr 1fr 1.2fr;
	gap: clamp(2rem, 4vw, 3.5rem);
	padding-block: clamp(3rem, 6vw, 4.5rem);
}

.tcbs-footer__blurb { margin-top: 1.15rem; font-size: .9375rem; color: var(--ink-500); max-width: 34ch; }

.tcbs-footer__title {
	font-family: var(--font-body);
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--ink-900);
	margin-bottom: 1.15rem;
}

.tcbs-footer__list { list-style: none; margin: 0 0 1.25rem; padding: 0; display: grid; gap: .7rem; }

.tcbs-footer__list a { font-size: .9375rem; color: var(--ink-700); text-decoration: none; overflow-wrap: anywhere; min-width: 0; }
.tcbs-footer__list a:hover { color: var(--brand-800); text-decoration: underline; }

.tcbs-footer__list--contact li { display: flex; flex-wrap: wrap; align-items: center; gap: .625rem; font-size: .9375rem; min-width: 0; }
.tcbs-footer__list--contact svg { color: var(--brand-800); }

.tcbs-todo {
	font-size: .8125rem;
	color: var(--ink-500);
	font-style: italic;
	border-bottom: 1px dashed var(--ink-500);
}

.tcbs-social { display: flex; gap: .5rem; list-style: none; margin: 1.25rem 0 0; padding: 0; }

.tcbs-social a {
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border: 1px solid var(--line);
	border-radius: var(--r-sm);
	color: var(--ink-700);
	background: var(--white);
	transition: all .18s var(--ease);
}

.tcbs-social a:hover { color: var(--white); background: var(--brand-800); border-color: var(--brand-800); transform: translateY(-2px); }

.tcbs-footer__legal { border-top: 1px solid var(--line); padding-block: 1.35rem; }

.tcbs-footer__legal .tcbs-container {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	align-items: center;
	justify-content: space-between;
	font-size: .875rem;
	color: var(--ink-500);
}

.tcbs-footer__legal p { margin: 0; }
.tcbs-footer__legal-list { display: flex; gap: 1.25rem; list-style: none; margin: 0; padding: 0; }
.tcbs-footer__legal-list a { color: var(--ink-500); text-decoration: none; }
.tcbs-footer__legal-list a:hover { color: var(--brand-800); }

/* 8 · HERO -------------------------------------------------------------- */

/* Vertical budget matters here: the h1, the lead and the buttons must all
   clear the fold on a 720px-tall viewport under a 76px sticky header. */
.tcbs-hero {
	position: relative;
	overflow: hidden;
	background: var(--white);
	padding-block: clamp(1.75rem, 3vw, 2.75rem);
	isolation: isolate;
}

.tcbs-hero h1 {
	font-size: clamp(2.125rem, 1.35rem + 2.5vw, 3.25rem);
	margin-bottom: .35em;
}

/* The editor's default block gap is too generous for a hero that has to fit
   a fold. Tighten the vertical rhythm between the stacked text blocks. */
.tcbs-hero .wp-block-group > * + *,
.tcbs-pagehero .wp-block-group > * + * { margin-block-start: .75rem; }

.tcbs-hero .tcbs-eyebrow,
.tcbs-pagehero .tcbs-eyebrow { margin-bottom: .35rem; }

.tcbs-hero .tcbs-lead { max-width: 54ch; }

.tcbs-mesh {
	position: absolute;
	inset: 0;
	z-index: -2;
	background:
		radial-gradient(42rem 30rem at 12% -8%, rgba(6, 182, 212, .14), transparent 60%),
		radial-gradient(38rem 28rem at 92% 4%, rgba(15, 118, 110, .13), transparent 62%),
		radial-gradient(34rem 26rem at 62% 108%, rgba(52, 211, 153, .1), transparent 60%);
}

.tcbs-nodes {
	position: absolute;
	inset: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
	pointer-events: none;
}

.tcbs-hero__grid {
	display: grid;
	grid-template-columns: 1.15fr .85fr;
	gap: clamp(1.5rem, 4vw, 3.25rem);
	align-items: center;
}

.tcbs-hero__rotator {
	display: inline-block;
	background: var(--g-gold-ink);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	min-height: 1.05em;
}

.tcbs-caret {
	display: inline-block;
	width: 3px;
	height: .82em;
	margin-left: .06em;
	background: var(--accent-500);
	vertical-align: -.06em;
	animation: tcbs-blink 1.05s step-end infinite;
	-webkit-text-fill-color: var(--accent-500);
}

@keyframes tcbs-blink { 0%, 100% { opacity: 1; } 50% { opacity: 0; } }

.tcbs-hero__actions { margin-top: 1.5rem; }

.tcbs-trust {
	display: flex;
	flex-wrap: wrap;
	gap: .75rem 2rem;
	margin-top: 1.75rem;
	padding-top: 1.25rem;
	border-top: 1px solid var(--line);
	list-style: none;
	padding-left: 0;
}

.tcbs-trust li { display: flex; align-items: center; gap: .625rem; font-size: .9375rem; color: var(--ink-500); }
.tcbs-trust svg { color: var(--brand-800); }
.tcbs-trust strong { color: var(--ink-900); font-family: var(--font-display); }

/* page hero (interior) */

.tcbs-pagehero {
	position: relative;
	overflow: hidden;
	padding-block: clamp(1.5rem, 2.75vw, 2.5rem) clamp(2rem, 3.5vw, 3rem);
	background: var(--mist);
	border-bottom: 1px solid var(--line);
	isolation: isolate;
}

.tcbs-pagehero .tcbs-mesh { opacity: .8; }

.tcbs-pagehero h1 {
	font-size: clamp(2rem, 1.3rem + 2.2vw, 3rem);
	margin-bottom: .35em;
}
.tcbs-pagehero__lead { max-width: 62ch; }
.tcbs-pagehero__actions { margin-top: 1.35rem; }

.tcbs-pagehero__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
	gap: clamp(1.75rem, 4vw, 3.25rem);
	align-items: center;
}

/* The lead is narrower beside artwork than it is full width. */
.tcbs-pagehero__grid .tcbs-pagehero__lead { max-width: 46ch; }

.tcbs-pagehero__visual { position: relative; min-width: 0; }
.tcbs-pagehero__visual .tcbs-art { box-shadow: var(--shadow-lift); }

/* 9 · CARDS ------------------------------------------------------------- */

.tcbs-card {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--r-md);
	overflow: hidden;
	transition: transform .22s var(--ease), box-shadow .22s var(--ease), border-color .22s var(--ease);
}

.tcbs-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-soft); border-color: rgba(232, 163, 61, .4); }

.tcbs-card__media { display: block; overflow: hidden; background: var(--cloud); }
.tcbs-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s var(--ease); }
.tcbs-card:hover .tcbs-card__media img { transform: scale(1.04); }

.tcbs-card__body { padding: 1.5rem; display: flex; flex-direction: column; gap: .6rem; flex: 1; }
.tcbs-card__title { font-size: 1.1875rem; margin: 0; line-height: 1.3; }
.tcbs-card__title a { color: var(--ink-900); text-decoration: none; overflow-wrap: anywhere; }
.tcbs-card__title a:hover { color: var(--brand-800); }
.tcbs-card__excerpt { font-size: .9375rem; color: var(--ink-500); margin: 0; flex: 1; }
.tcbs-card__body .tcbs-arrowlink { margin-top: .25rem; font-size: .9375rem; }

.tcbs-post-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .45rem;
	font-size: .8125rem;
	color: var(--ink-500);
	margin: 0;
}

.tcbs-post-meta svg { color: var(--brand-600); }
.tcbs-post-meta a { color: var(--brand-800); text-decoration: none; font-weight: 500; }
.tcbs-post-meta a:hover { text-decoration: underline; }

/* icon tile */

.tcbs-tile {
	display: grid;
	place-items: center;
	width: 56px;
	height: 56px;
	border-radius: 14px;
	background: linear-gradient(135deg, rgba(15, 118, 110, .1), rgba(6, 182, 212, .12));
	color: var(--brand-800);
	border: 1px solid rgba(6, 182, 212, .22);
	transition: transform .22s var(--ease);
}

.tcbs-card:hover .tcbs-tile, .tcbs-pillar:hover .tcbs-tile { transform: scale(1.06) rotate(-4deg); }

.tcbs-tile--lg { width: 66px; height: 66px; border-radius: 18px; }

/* feature card */

.tcbs-feature { padding: 1.75rem; display: flex; flex-direction: column; gap: .9rem; }
.tcbs-feature h3 { font-size: 1.1875rem; margin: 0; }
.tcbs-feature p { font-size: .9375rem; color: var(--ink-500); margin: 0; }

/* pillar card with beam border */

@property --tcbs-beam {
	syntax: "<angle>";
	initial-value: 0deg;
	inherits: false;
}

.tcbs-pillar {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 1rem;
	padding: 1.85rem;
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--r-md);
	text-decoration: none;
	transition: transform .22s var(--ease), box-shadow .22s var(--ease);
}

.tcbs-pillar::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	padding: 1px;
	background: conic-gradient(from var(--tcbs-beam), transparent 0deg, var(--accent-400) 45deg, var(--brand-800) 90deg, transparent 165deg, transparent 360deg);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
	opacity: 0;
	transition: opacity .3s var(--ease);
	pointer-events: none;
}

.tcbs-pillar:hover, .tcbs-pillar:focus-within { transform: translateY(-4px); box-shadow: var(--shadow-soft); }
.tcbs-pillar:hover::before, .tcbs-pillar:focus-within::before { opacity: 1; animation: tcbs-beam 3.2s linear infinite; }

@keyframes tcbs-beam { to { --tcbs-beam: 360deg; } }

.tcbs-pillar__num {
	font-family: var(--font-mono);
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .1em;
	color: var(--brand-800);
}

.tcbs-pillar h3 { font-size: 1.25rem; margin: 0; }
.tcbs-pillar__promise { font-size: .9375rem; font-weight: 600; color: var(--brand-800); margin: 0; }
.tcbs-pillar p { font-size: .9375rem; color: var(--ink-500); margin: 0; }



/* resource card */

.tcbs-resource__type {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	padding: .3rem .7rem;
	border-radius: var(--r-pill);
	background: rgba(232, 163, 61, .1);
	color: var(--brand-900);
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .02em;
}

.tcbs-resource__file {
	display: flex;
	align-items: center;
	gap: .5rem;
	font-family: var(--font-mono);
	font-size: .75rem;
	color: var(--ink-500);
	text-transform: uppercase;
	letter-spacing: .05em;
}

.tcbs-resource__soon {
	font-size: .8125rem;
	font-weight: 600;
	color: var(--ink-500);
	padding: .3rem .7rem;
	border: 1px dashed var(--line);
	border-radius: var(--r-pill);
	align-self: flex-start;
}

/* founder card */

.tcbs-founder { text-align: center; padding: 2rem 1.5rem; }
.tcbs-founder img { width: 128px; height: 128px; border-radius: 50%; object-fit: cover; margin: 0 auto 1.25rem; }
.tcbs-founder h3 { font-size: 1.125rem; margin-bottom: .2rem; }
.tcbs-founder__role { font-size: .875rem; color: var(--brand-800); font-weight: 600; margin-bottom: .75rem; }
.tcbs-founder p { font-size: .9375rem; color: var(--ink-500); }

/* logo wall */

.tcbs-logowall { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }

.tcbs-logowall__item {
	display: grid;
	place-items: center;
	gap: .5rem;
	aspect-ratio: 16 / 9;
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--r-md);
	color: var(--ink-500);
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	transition: all .2s var(--ease);
}

.tcbs-logowall__item:hover { border-color: rgba(232, 163, 61, .45); color: var(--brand-800); transform: translateY(-3px); }
.tcbs-logowall__item svg { color: var(--brand-600); opacity: .55; }

.tcbs-disclaimer { text-align: center; font-size: .8125rem; color: var(--ink-500); margin-top: 1.25rem; font-style: italic; }

/* 10 · SECTION BITS ----------------------------------------------------- */

.tcbs-quote {
	text-align: center;
	max-width: 900px;
	margin-inline: auto;
}

.tcbs-quote__lead {
	font-family: var(--font-display);
	font-size: clamp(1.375rem, 1.1rem + 1.1vw, 2rem);
	font-weight: 600;
	color: var(--ink-900);
	line-height: 1.35;
	letter-spacing: -.02em;
	margin-bottom: 1rem;
}

.tcbs-quote__body { font-size: clamp(1rem, .95rem + .3vw, 1.1875rem); color: var(--ink-700); }
.tcbs-quote__attr { margin-top: 1.5rem; font-size: 1.125rem; font-weight: 600; color: var(--brand-800); }

.tcbs-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; counter-reset: step; }

.tcbs-steps li { position: relative; padding-top: 2.75rem; }

.tcbs-steps li::before {
	counter-increment: step;
	content: "0" counter(step);
	position: absolute;
	top: 0;
	left: 0;
	font-family: var(--font-display);
	font-size: 1.5rem;
	font-weight: 700;
	background: var(--g-brand);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.tcbs-steps li::after {
	content: "";
	position: absolute;
	top: 1.85rem;
	left: 3rem;
	right: -12px;
	height: 1px;
	background: linear-gradient(90deg, var(--accent-400), transparent);
}

.tcbs-steps li:last-child::after { display: none; }
.tcbs-steps h3 { font-size: 1.0625rem; margin-bottom: .4rem; }
.tcbs-steps p { font-size: .9375rem; color: var(--ink-500); margin: 0; }

.tcbs-checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: .85rem; }
.tcbs-checklist li { display: flex; gap: .75rem; align-items: flex-start; }

.tcbs-checklist svg {
	flex-shrink: 0;
	margin-top: .18em;
	padding: 3px;
	border-radius: 50%;
	background: var(--accent-500);
	color: var(--brand-900);
}

.tcbs-3c { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }

.tcbs-3c__item {
	position: relative;
	padding: 2rem 1.75rem;
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--r-md);
	border-top: 3px solid transparent;
	border-image: var(--g-brand) 1;
	border-image-slice: 1;
}

.tcbs-3c__step {
	font-family: var(--font-mono);
	font-size: .75rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--brand-800);
	margin-bottom: .6rem;
	display: block;
}

.tcbs-cta {
	position: relative;
	overflow: hidden;
	background: var(--g-brand-deep);
	color: var(--white);
	border-radius: var(--r-lg);
	padding: clamp(2.5rem, 5vw, 4rem);
	text-align: center;
	isolation: isolate;
}

.tcbs-cta::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		radial-gradient(28rem 20rem at 15% 0%, rgba(34, 211, 238, .3), transparent 60%),
		radial-gradient(26rem 18rem at 88% 100%, rgba(232, 163, 61, .22), transparent 60%);
}

.tcbs-cta h2 { color: var(--white); }
.tcbs-cta p { color: rgba(255, 255, 255, .86); max-width: 60ch; margin-inline: auto; }
.tcbs-cta .tcbs-actions { justify-content: center; margin-top: 2rem; }
.tcbs-cta .tcbs-btn--primary { background: var(--white); color: var(--brand-900); box-shadow: none; }
.tcbs-cta .tcbs-btn--primary:hover { background: var(--accent-300); color: var(--brand-900); }

/* 11 · STATS ------------------------------------------------------------ */

.tcbs-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }

.tcbs-stat {
	text-align: center;
	padding: 2rem 1.25rem;
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--r-md);
}

.tcbs-stat__num {
	font-family: var(--font-display);
	font-size: clamp(2.25rem, 1.6rem + 2.2vw, 3.25rem);
	font-weight: 700;
	line-height: 1;
	letter-spacing: -.03em;
	background: var(--g-brand);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	margin-bottom: .5rem;
}

.tcbs-stat__label { font-size: .9375rem; color: var(--ink-500); margin: 0; }

/* 12 · ACCORDION -------------------------------------------------------- */

.tcbs-faq { display: grid; gap: .75rem; max-width: 860px; }

.tcbs-faq__item {
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--r-md);
	overflow: hidden;
	transition: border-color .2s var(--ease);
}

.tcbs-faq__item[open] { border-color: rgba(232, 163, 61, .45); }

.tcbs-faq__q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1.15rem 1.35rem;
	font-family: var(--font-display);
	font-size: 1.0625rem;
	font-weight: 600;
	color: var(--ink-900);
	cursor: pointer;
	list-style: none;
}

.tcbs-faq__q::-webkit-details-marker { display: none; }

.tcbs-faq__q::after {
	content: "";
	flex-shrink: 0;
	width: 11px;
	height: 11px;
	border-right: 2px solid var(--brand-800);
	border-bottom: 2px solid var(--brand-800);
	transform: rotate(45deg) translate(-2px, -2px);
	transition: transform .22s var(--ease);
}

.tcbs-faq__item[open] .tcbs-faq__q::after { transform: rotate(-135deg) translate(-3px, -3px); }
.tcbs-faq__a { padding: 0 1.35rem 1.35rem; font-size: .9375rem; color: var(--ink-700); }
.tcbs-faq__a p:last-child { margin-bottom: 0; }

/* 13 · FORMS ------------------------------------------------------------ */

.tcbs-form-wrap { max-width: 760px; }

.tcbs-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.15rem; }

.tcbs-field { margin: 0; display: flex; flex-direction: column; gap: .4rem; }
.tcbs-field--full { grid-column: 1 / -1; }

.tcbs-field label { font-size: .875rem; font-weight: 600; color: var(--ink-900); }
.tcbs-req { color: var(--brand-800); }

.tcbs-field input, .tcbs-field select, .tcbs-field textarea {
	width: 100%;
	padding: .8rem 1rem;
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--r-sm);
	font-size: 1rem;
	color: var(--ink-900);
	transition: border-color .18s var(--ease), box-shadow .18s var(--ease);
}

.tcbs-field textarea { resize: vertical; min-height: 140px; }

.tcbs-field input:focus, .tcbs-field select:focus, .tcbs-field textarea:focus {
	outline: none;
	border-color: var(--brand-800);
	box-shadow: 0 0 0 4px rgba(232, 163, 61, .18);
}

.tcbs-field [aria-invalid="true"] { border-color: #DC2626; }

.tcbs-error { font-size: .8125rem; color: #B91C1C; font-weight: 500; }

.tcbs-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.tcbs-consent { display: flex; flex-wrap: wrap; gap: .65rem; align-items: flex-start; margin: 1.35rem 0 0; font-size: .9375rem; }
.tcbs-consent input { margin-top: .15rem; width: 24px; height: 24px; accent-color: var(--brand-800); flex-shrink: 0; }
.tcbs-consent label { color: var(--ink-700); }
.tcbs-consent .tcbs-error { flex-basis: 100%; }

.tcbs-form__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin-top: 1.75rem; }
.tcbs-form__note { display: flex; align-items: center; gap: .45rem; font-size: .8125rem; color: var(--ink-500); }

.tcbs-alert { padding: 1rem 1.25rem; border-radius: var(--r-sm); margin-bottom: 1.5rem; font-size: .9375rem; }
.tcbs-alert--ok { background: rgba(52, 211, 153, .12); border: 1px solid rgba(52, 211, 153, .4); color: #065F46; }
.tcbs-alert--ok strong { display: block; color: #064E3B; }
.tcbs-alert--error { background: #FEF2F2; border: 1px solid #FECACA; color: #B91C1C; }

/* contact info panel */

.tcbs-contactlist { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.35rem; }
.tcbs-contactlist li { display: flex; gap: 1rem; align-items: flex-start; }
.tcbs-contactlist h3 { font-size: 1rem; margin: 0 0 .2rem; }
.tcbs-contactlist a { color: var(--ink-700); text-decoration: none; }
.tcbs-contactlist a:hover { color: var(--brand-800); text-decoration: underline; }
.tcbs-contactlist p { font-size: .9375rem; color: var(--ink-500); margin: 0; }

.tcbs-office { padding: 1.75rem; }
.tcbs-office h3 { font-size: 1.0625rem; color: var(--brand-900); margin-bottom: .85rem; }
.tcbs-office address { font-style: normal; font-size: .9375rem; color: var(--ink-500); line-height: 1.65; }
.tcbs-office__contact { margin-top: 1.15rem; padding-top: 1.15rem; border-top: 1px solid var(--line); display: grid; gap: .55rem; }
.tcbs-office__contact div { display: flex; align-items: center; gap: .55rem; font-size: .9375rem; }
.tcbs-office__contact svg { color: var(--brand-800); }

/* 14 · BREADCRUMBS, PAGINATION, SEARCH ---------------------------------- */

.tcbs-crumbs { margin-bottom: 1.25rem; }
.tcbs-crumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; list-style: none; margin: 0; padding: 0; font-size: .8125rem; }
.tcbs-crumbs li { display: flex; align-items: center; gap: .4rem; }
.tcbs-crumbs a { color: var(--ink-500); text-decoration: none; }
.tcbs-crumbs a:hover { color: var(--brand-800); }
.tcbs-crumbs span { color: var(--ink-900); font-weight: 500; }
.tcbs-crumbs__sep { color: var(--line); }

.tcbs-chips { display: flex; flex-wrap: wrap; gap: .55rem; list-style: none; margin: 0 0 2.5rem; padding: 0; }

.tcbs-chip {
	display: inline-block;
	padding: .5rem 1rem;
	border: 1px solid var(--line);
	border-radius: var(--r-pill);
	background: var(--white);
	font-size: .875rem;
	font-weight: 500;
	color: var(--ink-700);
	text-decoration: none;
	transition: all .18s var(--ease);
}

.tcbs-chip:hover { border-color: var(--brand-800); color: var(--brand-800); }
.tcbs-chip.is-active { background: var(--brand-800); border-color: var(--brand-800); color: var(--white); }

.wp-block-query-pagination, .navigation.pagination { margin-top: 3rem; }

.navigation.pagination .nav-links { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; }

.navigation.pagination .page-numbers {
	display: grid;
	place-items: center;
	min-width: 42px;
	height: 42px;
	padding: 0 .75rem;
	border: 1px solid var(--line);
	border-radius: var(--r-sm);
	color: var(--ink-700);
	text-decoration: none;
	font-size: .9375rem;
}

.navigation.pagination .page-numbers:hover { border-color: var(--brand-800); color: var(--brand-800); }
.navigation.pagination .page-numbers.current { background: var(--brand-800); border-color: var(--brand-800); color: var(--white); }

.tcbs-searchform { display: flex; gap: .5rem; max-width: 480px; }
.tcbs-searchform input { flex: 1; padding: .8rem 1rem; border: 1px solid var(--line); border-radius: var(--r-sm); }
.tcbs-searchform input:focus { outline: none; border-color: var(--brand-800); box-shadow: 0 0 0 4px rgba(232, 163, 61, .18); }

/* 15 · ILLUSTRATIONS ---------------------------------------------------- */

.tcbs-art {
	position: relative;
	display: block;
	width: 100%;
	margin: 0;
	border-radius: var(--r-md);
	overflow: hidden;
	background: var(--mist);
	border: 1px solid var(--line);
}

.tcbs-art svg { width: 100%; height: 100%; display: block; }

.tcbs-card__media .tcbs-art { border: 0; border-radius: 0; }
.tcbs-hero__visual .tcbs-art { box-shadow: var(--shadow-lift); }

.tcbs-founder .tcbs-art {
	width: 128px;
	margin: 0 auto 1.25rem;
	border-radius: 50%;
	border: 0;
	background: transparent;
}

/* 16 · MOTION ----------------------------------------------------------- */

/* Hidden only when JavaScript is present to reveal it again, see header.php. */
html.js .tcbs-reveal { opacity: 0; transform: translateY(12px); }

html.js .tcbs-reveal.is-in {
	opacity: 1;
	transform: none;
	transition: opacity .45s var(--ease), transform .45s var(--ease);
}

html.js .tcbs-diagram__draw {
	stroke-dasharray: var(--len, 400);
	stroke-dashoffset: var(--len, 400);
}

.is-drawn .tcbs-diagram__draw { animation: tcbs-draw 1.15s var(--ease) forwards; }

@keyframes tcbs-draw { to { stroke-dashoffset: 0; } }

.tcbs-diagram__pulse { transform-box: fill-box; transform-origin: center; }
.is-drawn .tcbs-diagram__pulse { animation: tcbs-pulse 2.6s ease-in-out infinite; }

@keyframes tcbs-pulse {
	0%, 100% { opacity: .9; transform: scale(1); }
	50% { opacity: 1; transform: scale(1.09); }
}

/* 16a · PATTERN PIECES -------------------------------------------------- */

.tcbs-hero__strap { margin-bottom: .55rem; font-family: var(--font-display); font-weight: 700; font-size: clamp(1.125rem, 1rem + .6vw, 1.4rem); letter-spacing: -.005em; }
.tcbs-hero__visual { position: relative; }

.tcbs-diagram { width: 100%; height: auto; overflow: visible; }
.tcbs-diagram--3c { max-width: 900px; margin: 0 auto; }
.tcbs-diagram--abm { max-width: 460px; margin: 0 auto; }

.tcbs-pillar__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }

/* The block editor wraps patterns in .wp-block-group; neutralise its defaults
   so the theme's own layout classes stay in charge. */
.wp-block-group.tcbs-section,
.wp-block-group.tcbs-hero,
.wp-block-group.tcbs-pagehero { margin-block: 0; }

.tcbs-container > .wp-block-heading,
.tcbs-container > p { max-width: 68ch; }

.tcbs-section__head--center > * { margin-inline: auto; }
.tcbs-section__head--center .wp-block-heading { max-width: 22ch; }

/* 16b · TEMPLATE PIECES ------------------------------------------------- */

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

.tcbs-crumbbar { background: var(--mist); padding-top: .9rem; }
.tcbs-crumbbar .tcbs-crumbs { margin-bottom: 0; }
.tcbs-crumbbar + .tcbs-pagehero { padding-top: .75rem; border-top: 0; }

.tcbs-featured {
	display: grid;
	grid-template-columns: 1.05fr .95fr;
	gap: clamp(1.5rem, 3vw, 2.75rem);
	align-items: center;
	padding: clamp(1.25rem, 2vw, 1.75rem);
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
	box-shadow: var(--shadow-soft);
	margin-bottom: clamp(3rem, 6vw, 4.5rem);
}

.tcbs-featured__media { display: block; border-radius: var(--r-md); overflow: hidden; }
.tcbs-featured__media img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 16 / 10; }
.tcbs-featured__body { display: flex; flex-direction: column; gap: .85rem; align-items: flex-start; }
.tcbs-featured__title { font-size: clamp(1.5rem, 1.2rem + 1.1vw, 2rem); margin: 0; }
.tcbs-featured__title a { color: var(--ink-900); text-decoration: none; }
.tcbs-featured__title a:hover { color: var(--brand-800); }
.tcbs-featured__body p { color: var(--ink-500); margin: 0; }

.tcbs-section__head--row {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	max-width: none;
	margin-bottom: 2rem;
}

.tcbs-section__head--row .tcbs-section__title { margin-bottom: 0; }

.tcbs-article__media { margin-top: -2rem; margin-bottom: 1rem; }
.tcbs-article__media img { width: 100%; border-radius: var(--r-lg); box-shadow: var(--shadow-soft); }
.tcbs-article__tags { margin-top: 2.5rem; margin-bottom: 0; }

.tcbs-resource__panel { position: sticky; top: calc(var(--header-h) + 24px); align-self: start; }
.tcbs-resource__panel .tcbs-card__body { gap: 1rem; align-items: flex-start; }
.tcbs-resource__panel:hover { transform: none; }

.tcbs-pagelinks { margin-top: 2rem; font-size: .9375rem; }

.tcbs-mt-2 { margin-top: 2rem; }
.tcbs-mt-3 { margin-top: 3rem; }
.tcbs-measure { max-width: 56ch; }
.tcbs-h-sm { font-size: 1.25rem; margin: 0; }


/* 16d · RESPONSIVE DIAGRAMS ---------------------------------------------
   The 3C progression is a 900-unit-wide viewBox. Below ~760px its labels
   render at ~5px, which is unreadable, so a stacked variant takes over.
   Both are in the markup; only one is ever displayed. */

.tcbs-diagram--3c-v { display: none; max-width: 340px; margin: 0 auto; }

@media (max-width: 47.5em) {
	.tcbs-diagram--3c { display: none; }
	.tcbs-diagram--3c-v { display: block; }
}

/* The ABM framework labels fall below 11px under ~480px. The five domains are
   listed in full as text alongside it, so nothing is lost by hiding it here. */
@media (max-width: 30em) {
	.tcbs-diagram--abm { display: none; }
}

/* 17 · RESPONSIVE ------------------------------------------------------- */

@media (max-width: 67.5em) {
	.tcbs-grid--4, .tcbs-grid--5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tcbs-logowall { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.tcbs-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tcbs-steps li::after { display: none; }
	.tcbs-footer__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 60em) {
	.tcbs-nav { display: none; }
	.tcbs-burger { display: inline-flex; }
	.tcbs-drawer { display: block; }
	.tcbs-drawer[hidden] { display: none; }
	.tcbs-hero__grid { grid-template-columns: minmax(0, 1fr); }
	.tcbs-pagehero__grid { grid-template-columns: minmax(0, 1fr); }
	.tcbs-pagehero__grid .tcbs-pagehero__lead { max-width: 62ch; }
	.tcbs-split { grid-template-columns: minmax(0, 1fr); }
	.tcbs-split--flip > *:first-child { order: 0; }
	.tcbs-grid--3, .tcbs-3c, .tcbs-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tcbs-header__actions .tcbs-btn { display: none; }
}

@media (max-width: 60em) {
	.tcbs-featured { grid-template-columns: minmax(0, 1fr); }
	.tcbs-resource__panel { position: static; }
}

@media (max-width: 30em) {
	.tcbs-actions { width: 100%; }
	.tcbs-actions > .tcbs-btn { width: 100%; }
}

/* Fold-class cover screens (~280px). The logo wordmark and the burger cannot
   both fit, so the wordmark drops and the badge alone carries the brand. */
@media (max-width: 21.25em) {
	:root { --gutter: 12px; }
	.tcbs-logo__text { display: none; }
	.tcbs-logo__mark { width: 40px; height: 40px; }
	.tcbs-btn { padding: .75rem 1.15rem; font-size: .9375rem; }
	.tcbs-newsletter, .tcbs-cta { padding: 1.25rem; }
	.tcbs-card__body, .tcbs-pillar, .tcbs-feature, .tcbs-office { padding: 1.15rem; }
}

@media (max-width: 45em) {
	:root { --gutter: 16px; }
	.tcbs-article__media { margin-top: -1rem; }
	.tcbs-grid--2, .tcbs-grid--3, .tcbs-grid--4, .tcbs-grid--5,
	.tcbs-3c, .tcbs-stats, .tcbs-steps, .tcbs-form__grid { grid-template-columns: minmax(0, 1fr); }
	.tcbs-logowall { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tcbs-footer__cols { grid-template-columns: minmax(0, 1fr); }
	.tcbs-footer__legal .tcbs-container { flex-direction: column; align-items: flex-start; }
	.tcbs-trust { gap: .75rem 1.25rem; }
}

/* 17b · SHORT VIEWPORTS -------------------------------------------------
   On laptops around 1366×768 the usable viewport is roughly 620px. Tighten
   the hero further so the headline and the call to action still clear the
   fold rather than the buttons sitting just below it. */

@media (min-width: 60.0625em) and (max-height: 760px) {
	.tcbs-hero { padding-block: 1.25rem; }
	.tcbs-hero h1 { font-size: clamp(1.875rem, 1.2rem + 1.9vw, 2.5rem); }
	.tcbs-hero .tcbs-lead { font-size: 1rem; }
	.tcbs-hero__strap { font-size: 1.125rem; }
	.tcbs-hero__actions { margin-top: 1.15rem; }
	.tcbs-trust { margin-top: 1.15rem; padding-top: .9rem; }
	.tcbs-pagehero { padding-block: 1.15rem 1.5rem; }
	.tcbs-pagehero h1 { font-size: clamp(1.75rem, 1.2rem + 1.6vw, 2.25rem); }
}

/* Short phones (SE-class, 568 to 700px tall) need the same treatment as short
   laptops: at the default scale the hero pushes its call to action past the
   fold. Type and rhythm tighten; nothing is removed. */

@media (max-width: 60em) and (max-height: 720px) {
	.tcbs-hero { padding-block: 1rem 1.25rem; }
	.tcbs-pagehero { padding-block: .75rem 1.15rem; }
	.tcbs-hero h1 { font-size: clamp(1.6875rem, 1.1rem + 2.6vw, 2.125rem); }
	.tcbs-pagehero h1 { font-size: clamp(1.5rem, 1rem + 2.4vw, 1.875rem); }
	.tcbs-hero .tcbs-lead,
	.tcbs-pagehero__lead { font-size: .9375rem; line-height: 1.5; }
	.tcbs-hero__strap { font-size: 1rem; margin-bottom: .35rem; }
	.tcbs-hero__actions,
	.tcbs-pagehero__actions { margin-top: .85rem; }
	.tcbs-trust { margin-top: .9rem; padding-top: .75rem; }
	.tcbs-crumbbar { padding-block: .35rem; }
	.tcbs-eyebrow { margin-bottom: .4rem; }
}

/* Phone held sideways: about 300px of usable height once the header is in.
   Everything tightens again and the rotating strapline steps aside, since it
   restates the tagline already in the page title. Nothing else is removed. */

@media (max-width: 60em) and (max-height: 500px) {
	.tcbs-hero { padding-block: .5rem .75rem; }
	.tcbs-pagehero { padding-block: .25rem .5rem; }
	.tcbs-hero h1,
	.tcbs-pagehero h1 { font-size: clamp(1.1875rem, .9rem + 1.5vw, 1.375rem); line-height: 1.15; margin-bottom: .25em; }
	.tcbs-hero .tcbs-lead,
	.tcbs-pagehero__lead { font-size: .875rem; line-height: 1.4; margin-bottom: .25rem; }
	.tcbs-hero__strap { display: none; }
	.tcbs-hero__actions,
	.tcbs-pagehero__actions { margin-top: .5rem; }
	.tcbs-eyebrow { margin-bottom: .3rem; font-size: .6875rem; }
	.tcbs-crumbbar { padding-block: 0; font-size: .75rem; }
	/* 44px is the tap floor; this lands on it rather than under it. */
	.tcbs-pagehero__actions .tcbs-btn,
	.tcbs-hero__actions .tcbs-btn { padding-block: .75rem; }

	/* Block-editor group margins open a gap above the eyebrow that costs more
	   than a line of copy at this height. */
	.tcbs-pagehero__grid > div > *:first-child,
	.tcbs-hero__grid > div > *:first-child { margin-top: 0; }
	.tcbs-pagehero h1,
	.tcbs-hero h1 { margin-top: .3rem; }
	.tcbs-pagehero__lead,
	.tcbs-hero .tcbs-lead { margin-top: .3rem; }
}

/* 17c · TOUCH TARGETS ---------------------------------------------------
   WCAG 2.5.8 sets a 24px minimum; 44px is the practical floor for a thumb.
   Text links in dense lists are the usual offenders, so they get an explicit
   height on touch-sized screens rather than relying on line-height. */

@media (max-width: 60em) {
	.tcbs-footer__list { gap: .15rem; }

	.tcbs-footer__list a,
	.tcbs-footer__legal-list a,
	.tcbs-nav__sub a {
		display: inline-flex;
		align-items: center;
		min-height: 44px;
	}

	.tcbs-footer__list--contact li { min-height: 44px; }
	.tcbs-arrowlink { min-height: 44px; align-items: center; }
	.tcbs-chip { padding: .65rem 1.1rem; }
	.tcbs-crumbs li { min-height: 32px; }
	.tcbs-crumbs a { display: inline-flex; align-items: center; min-height: 32px; padding-inline: 2px; }
	.tcbs-card__title a, .tcbs-featured__title a { padding-block: 4px; }
	.tcbs-post-meta a { display: inline-flex; align-items: center; min-height: 24px; }
	.tcbs-resource__type { min-height: 24px; }
	.tcbs-social a { width: 44px; height: 44px; }
	.tcbs-nav__toggle { min-width: 44px; min-height: 44px; justify-content: center; }
	.navigation.pagination .page-numbers { min-width: 44px; height: 44px; }
}

/* 17d · WIDE SCREENS ----------------------------------------------------
   Above ~1800px the container alone leaves the hero looking stranded, so the
   type scale and section rhythm are allowed to grow with the viewport. */

@media (min-width: 112.5em) {
	:root { --section-y: 7.5rem; }
	.tcbs-hero { padding-block: 4rem; }
	.tcbs-hero h1 { font-size: 3.5rem; }
	.tcbs-hero .tcbs-lead { font-size: 1.3125rem; }
	body { font-size: 1.125rem; }
}

/* 18 · REDUCED MOTION ---------------------------------------------------
   Not a degraded experience: everything renders in its final state. */

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }

	*, *::before, *::after {
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .001ms !important;
		scroll-behavior: auto !important;
	}

	html.js .tcbs-reveal { opacity: 1 !important; transform: none !important; }
	.tcbs-nodes { display: none; }
	.tcbs-caret { display: none; }
	html.js .tcbs-diagram__draw { stroke-dashoffset: 0 !important; }
	.tcbs-pillar::before { animation: none !important; }
	.tcbs-card:hover, .tcbs-pillar:hover, .tcbs-btn:hover, .tcbs-social a:hover { transform: none !important; }
}

/* 19 · PRINT ------------------------------------------------------------ */

@media print {
	.tcbs-header, .tcbs-footer__motto, .tcbs-cta, .tcbs-drawer, .tcbs-skip { display: none; }
	body { color: #000; }
}

/* 16c · NEWSLETTER BAND -------------------------------------------------- */

.tcbs-newsletter {
	position: relative;
	overflow: hidden;
	display: grid;
	grid-template-columns: 1.5fr auto;
	gap: clamp(1.5rem, 4vw, 3rem);
	align-items: center;
	padding: clamp(1rem, 4vw, 2.5rem);
	border-radius: var(--r-lg);
	background: var(--g-brand-deep);
	isolation: isolate;
}

.tcbs-newsletter::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: radial-gradient(26rem 16rem at 8% 0%, rgba(232, 163, 61, .2), transparent 62%);
}

.tcbs-newsletter__copy { display: flex; flex-wrap: wrap; gap: 1.25rem; align-items: flex-start; min-width: 0; }

.tcbs-newsletter__icon {
	display: grid;
	place-items: center;
	width: 58px;
	height: 58px;
	flex-shrink: 0;
	border-radius: 14px;
	border: 1px solid rgba(232, 163, 61, .45);
	background: rgba(232, 163, 61, .12);
	color: var(--accent-500);
}

.tcbs-newsletter h2 { overflow-wrap: anywhere; color: var(--accent-500); font-size: clamp(1.375rem, 1.15rem + .9vw, 1.75rem); margin-bottom: .35rem; }
.tcbs-newsletter p { color: rgba(255, 255, 255, .86); font-size: .9375rem; margin: 0; max-width: 52ch; min-width: 0; overflow-wrap: anywhere; }
.tcbs-newsletter__action { display: grid; gap: .65rem; justify-items: start; }

.tcbs-newsletter__note {
	display: flex;
	align-items: center;
	gap: .4rem;
	font-size: .8125rem !important;
	color: rgba(255, 255, 255, .6) !important;
}

.tcbs-newsletter__note svg { color: var(--accent-400); }

/* The "Building Partnerships" closing band on the Partners page. */
.tcbs-partnerband { display: grid; grid-template-columns: 1.4fr 1fr; gap: clamp(1.5rem, 4vw, 3rem); align-items: center; }
.tcbs-partnerband__mail { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .5rem; max-width: 100%; min-width: 0; overflow-wrap: anywhere; margin-top: 1rem; color: var(--accent-400); font-weight: 600; text-decoration: none; }
.tcbs-partnerband__mail:hover { color: var(--accent-300); text-decoration: underline; }

@media (max-width: 53.75em) {
	.tcbs-newsletter { grid-template-columns: minmax(0, 1fr); }
	.tcbs-newsletter__action { justify-items: stretch; }
	.tcbs-newsletter__action .tcbs-btn { justify-content: center; }
	.tcbs-partnerband { grid-template-columns: minmax(0, 1fr); }
}

/* 16e · PHOTOGRAPH SLOTS -------------------------------------------------
   When a real photograph is uploaded for a slot it replaces the illustration.
   The frame keeps its aspect ratio so page rhythm does not shift. */

.tcbs-art--photo { background: var(--cloud); border-color: var(--line); }

.tcbs-art--photo .tcbs-art__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.tcbs-hero__visual .tcbs-art--photo { box-shadow: var(--shadow-lift); }
.tcbs-founder .tcbs-art--photo { border-radius: 50%; }