/* ============================================================
   Team Layout Lab — preview-only block.
   Renders 3 layout mocks (Roster / Editorial / Spotlight)
   stacked on the same page so the user can compare in-context.
   Removed once a layout is chosen.
   ============================================================ */
.ced-team-lab {
	background: var(--wp--preset--color--cream);
	color: var(--wp--preset--color--ink);
	padding-block: clamp(4rem, 8vw, 7rem) 6rem;
	padding-inline: var(--gutter-x);
	max-width: none !important;
	width: 100vw !important;
	margin-left:  calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
}

/* Page-level head explaining the lab */
.ced-tlab__page-head {
	max-width: var(--page-max);
	margin: 0 auto 4rem;
	display: grid;
	gap: 0.75rem;
	text-align: left;
}
.ced-tlab__page-title {
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: clamp(2.25rem, 4vw, 3.5rem);
	line-height: 1;
	letter-spacing: 0.005em;
	text-transform: uppercase;
	margin: 0;
	color: var(--wp--preset--color--ink);
}
.ced-tlab__page-lede {
	max-width: 65ch;
	color: rgba(20, 20, 28, 0.7);
	margin: 0;
}

/* Variant container */
.ced-tlab__variant {
	max-width: var(--page-max);
	margin: 0 auto 6rem;
}
.ced-tlab__variant-label {
	display: flex;
	gap: 1rem;
	align-items: center;
	margin-bottom: 1.5rem;
	padding-bottom: 1.25rem;
	border-bottom: 2px dashed rgba(20, 20, 28, 0.12);
}
.ced-tlab__variant-letter {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 12px;
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--paper);
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: 1.4rem;
	flex-shrink: 0;
}
.ced-tlab__variant-label strong {
	display: block;
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: 1.25rem;
	letter-spacing: 0.005em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink);
}
.ced-tlab__variant-label small {
	display: block;
	color: rgba(20, 20, 28, 0.6);
	font-size: 0.88rem;
	margin-top: 0.15rem;
}

/* ── Shared avatar/portrait palette via accent classes ────────── */
.ced-ta__card--lavender .ced-ta__avatar,
.ced-tb__profile--lavender .ced-tb__portrait,
.ced-tc__spotlight--lavender .ced-tc__spot-portrait,
.ced-tc__tile--lavender .ced-tc__tile-portrait { background: linear-gradient(135deg, #b594ff 0%, #8a6ad6 100%); }

.ced-ta__card--coral .ced-ta__avatar,
.ced-tb__profile--coral .ced-tb__portrait,
.ced-tc__spotlight--coral .ced-tc__spot-portrait,
.ced-tc__tile--coral .ced-tc__tile-portrait { background: linear-gradient(135deg, #ff6b47 0%, #d44e2c 100%); }

.ced-ta__card--sky .ced-ta__avatar,
.ced-tb__profile--sky .ced-tb__portrait,
.ced-tc__spotlight--sky .ced-tc__spot-portrait,
.ced-tc__tile--sky .ced-tc__tile-portrait { background: linear-gradient(135deg, #4ecdc4 0%, #2e9b94 100%); }

.ced-ta__card--sage .ced-ta__avatar,
.ced-tb__profile--sage .ced-tb__portrait,
.ced-tc__spotlight--sage .ced-tc__spot-portrait,
.ced-tc__tile--sage .ced-tc__tile-portrait { background: linear-gradient(135deg, #c8dda8 0%, #95b970 100%); }

/* Photo-tile accent gradients (subtle, decorative — placeholder for
   real photography). Each accent owns a tinted radial overlay so the
   six event tiles read as a set of distinct moments. */
.ced-ta__photo--lavender, .ced-tb__interlude--lavender, .ced-tb__closing-photo--lavender, .ced-tc__mosaic-photo--lavender { background: radial-gradient(120% 120% at 0% 0%, rgba(181,148,255,0.45), rgba(181,148,255,0.12) 60%, transparent), linear-gradient(135deg, #efe6ff, #d6c4ff); }
.ced-ta__photo--coral, .ced-tb__interlude--coral, .ced-tb__closing-photo--coral, .ced-tc__mosaic-photo--coral { background: radial-gradient(120% 120% at 100% 0%, rgba(255,107,71,0.45), rgba(255,107,71,0.12) 60%, transparent), linear-gradient(135deg, #ffe7df, #ffc6b3); }
.ced-ta__photo--sky, .ced-tb__interlude--sky, .ced-tb__closing-photo--sky, .ced-tc__mosaic-photo--sky { background: radial-gradient(120% 120% at 0% 100%, rgba(78,205,196,0.45), rgba(78,205,196,0.12) 60%, transparent), linear-gradient(135deg, #e2faf7, #b9efea); }
.ced-ta__photo--sage, .ced-tb__interlude--sage, .ced-tb__closing-photo--sage, .ced-tc__mosaic-photo--sage { background: radial-gradient(120% 120% at 100% 100%, rgba(200,221,168,0.55), rgba(200,221,168,0.15) 60%, transparent), linear-gradient(135deg, #f1f7e4, #d4e7ad); }
.ced-ta__photo--sunset, .ced-tb__interlude--sunset, .ced-tb__closing-photo--sunset, .ced-tc__mosaic-photo--sunset { background: radial-gradient(120% 120% at 50% 0%, rgba(255,179,71,0.45), rgba(255,179,71,0.12) 60%, transparent), linear-gradient(135deg, #fff2d9, #ffd089); }
.ced-ta__photo--rose, .ced-tb__interlude--rose, .ced-tb__closing-photo--rose, .ced-tc__mosaic-photo--rose { background: radial-gradient(120% 120% at 0% 50%, rgba(255,121,158,0.4), rgba(255,121,158,0.12) 60%, transparent), linear-gradient(135deg, #ffe8ee, #ffc1d0); }

/* ─────────────────────────────────────────────────────────────
   VARIANT A — Roster (org chart + photo wall)
   ───────────────────────────────────────────────────────────── */
.ced-ta {
	background: var(--wp--preset--color--paper);
	border: 1px solid rgba(20,20,28,0.08);
	border-radius: clamp(1.5rem, 2.5vw, 2.5rem);
	padding: clamp(2.5rem, 4.5vw, 4rem);
}
.ced-ta__head { display: grid; gap: 1rem; margin-bottom: 3rem; }
.ced-ta__title {
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: clamp(2rem, 4vw, 3.5rem);
	line-height: 0.96; letter-spacing: 0.005em; text-transform: uppercase;
	margin: 0; color: var(--wp--preset--color--ink); max-width: 22ch;
}
.ced-ta__lede { color: rgba(20,20,28,0.65); max-width: 60ch; margin: 0; }

.ced-ta__chart {
	display: grid; gap: 0;
	margin: 0 auto;
	max-width: 920px;
}
.ced-ta__tier { display: grid; gap: 1rem; justify-items: center; }
.ced-ta__tier--lead .ced-ta__card { width: min(560px, 100%); }
.ced-ta__tier--ceo .ced-ta__card { width: min(440px, 100%); }
.ced-ta__tier--reports { grid-template-columns: 1fr 1fr; gap: 1.5rem; align-items: stretch; }
.ced-ta__tier--reports .ced-ta__card { width: 100%; }

.ced-ta__card {
	display: grid;
	grid-template-columns: 80px 1fr;
	gap: 1.25rem;
	padding: 1.5rem;
	background: var(--wp--preset--color--cream);
	border: 1px solid rgba(20,20,28,0.10);
	border-radius: 18px;
	align-items: center;
}
.ced-ta__card--lead {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--paper);
	border-color: rgba(232,229,222,0.10);
}
.ced-ta__card--lead .ced-ta__role,
.ced-ta__card--lead .ced-ta__name,
.ced-ta__card--lead .ced-ta__bio { color: var(--wp--preset--color--paper); }
.ced-ta__card--lead .ced-ta__bio { color: rgba(232,229,222,0.72); }

.ced-ta__avatar {
	width: 80px; height: 80px; border-radius: 16px;
	display: inline-flex; align-items: center; justify-content: center;
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: 2.25rem;
	color: var(--wp--preset--color--paper);
}
.ced-ta__role {
	display: block;
	font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase;
	color: rgba(20,20,28,0.55);
}
.ced-ta__name {
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: 1.25rem; text-transform: uppercase; letter-spacing: 0.005em;
	margin: 0.25rem 0 0.5rem; color: var(--wp--preset--color--ink);
}
.ced-ta__bio { color: rgba(20,20,28,0.68); margin: 0; font-size: 0.9rem; line-height: 1.55; }

.ced-ta__line { height: 32px; display: flex; justify-content: center; color: rgba(20,20,28,0.25); }
.ced-ta__line--down::before { content: ""; width: 1.5px; height: 100%; background: currentColor; }
.ced-ta__line--fork { height: 48px; }

.ced-ta__photos { margin-top: 4rem; padding-top: 3rem; border-top: 1px dashed rgba(20,20,28,0.12); }
.ced-ta__photos-head { display: grid; gap: 0.5rem; margin-bottom: 1.5rem; }
.ced-ta__photos-title {
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: clamp(1.5rem, 2.4vw, 2rem); text-transform: uppercase; margin: 0;
	color: var(--wp--preset--color--ink);
}
.ced-ta__photo-grid {
	display: grid; gap: 1rem;
	grid-template-columns: repeat(3, 1fr);
}
.ced-ta__photo {
	margin: 0;
	aspect-ratio: 4 / 3;
	border-radius: 14px;
	position: relative;
	overflow: hidden;
	border: 1px solid rgba(20,20,28,0.08);
}
.ced-ta__photo figcaption {
	position: absolute; left: 1rem; bottom: 1rem;
	color: var(--wp--preset--color--ink);
}
.ced-ta__photo figcaption span {
	display: block;
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: 1.05rem; text-transform: uppercase; letter-spacing: 0.005em;
}
.ced-ta__photo figcaption small {
	display: block;
	font-size: 0.72rem; letter-spacing: 0.16em; text-transform: uppercase;
	color: rgba(20,20,28,0.6);
	margin-top: 0.15rem;
}

@media (max-width: 720px) {
	.ced-ta__tier--reports { grid-template-columns: 1fr; }
	.ced-ta__photo-grid { grid-template-columns: 1fr 1fr; }
}

/* ─────────────────────────────────────────────────────────────
   VARIANT B — Editorial (profiles + inline photo interludes)
   ───────────────────────────────────────────────────────────── */
.ced-tb {
	background: var(--wp--preset--color--paper);
	border: 1px solid rgba(20,20,28,0.08);
	border-radius: clamp(1.5rem, 2.5vw, 2.5rem);
	padding: clamp(2.5rem, 4.5vw, 4rem);
}
.ced-tb__head { display: grid; gap: 1rem; margin-bottom: 4rem; }
.ced-tb__title {
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: clamp(2rem, 4vw, 3.5rem);
	line-height: 0.96; letter-spacing: 0.005em; text-transform: uppercase;
	margin: 0; color: var(--wp--preset--color--ink); max-width: 22ch;
}
.ced-tb__lede { color: rgba(20,20,28,0.65); max-width: 60ch; margin: 0; }

.ced-tb__feed { display: grid; gap: 3.5rem; }

.ced-tb__profile {
	display: grid;
	grid-template-columns: 280px 1fr;
	gap: clamp(2rem, 4vw, 4rem);
	align-items: start;
	padding-bottom: 3.5rem;
	border-bottom: 1px dashed rgba(20,20,28,0.12);
}
.ced-tb__profile--r { grid-template-columns: 1fr 280px; }
.ced-tb__profile--r .ced-tb__copy { order: 1; }
.ced-tb__profile--r .ced-tb__portrait { order: 2; }
.ced-tb__profile:last-of-type { border-bottom: none; padding-bottom: 0; }

.ced-tb__portrait {
	aspect-ratio: 1 / 1.05;
	border-radius: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--wp--preset--color--paper);
	position: relative;
	overflow: hidden;
}
.ced-tb__portrait-mark {
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: clamp(4rem, 8vw, 7rem);
	letter-spacing: 0.005em;
}

.ced-tb__num {
	display: inline-block;
	font-family: var(--wp--preset--font-family--mono, monospace);
	font-size: 0.85rem;
	color: rgba(20,20,28,0.4);
	margin-bottom: 0.5rem;
}
.ced-tb__role {
	display: block;
	font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase;
	color: rgba(203,108,230,0.95);
	margin-bottom: 0.5rem;
}
.ced-tb__name {
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: clamp(1.5rem, 2.8vw, 2.25rem);
	text-transform: uppercase; letter-spacing: 0.005em; line-height: 1;
	margin: 0 0 1.5rem;
	color: var(--wp--preset--color--ink);
}
.ced-tb__quote {
	margin: 0 0 1.5rem;
	padding: 0 0 0 1.25rem;
	border-left: 3px solid rgba(20,20,28,0.18);
}
.ced-tb__quote p {
	font-family: var(--wp--preset--font-family--serif-display, 'Newsreader', serif);
	font-style: italic;
	font-size: clamp(1.1rem, 1.6vw, 1.35rem);
	line-height: 1.4;
	color: rgba(20,20,28,0.78);
	margin: 0;
}
.ced-tb__bio { color: rgba(20,20,28,0.62); margin: 0; line-height: 1.6; }

.ced-tb__interlude {
	aspect-ratio: 16 / 7;
	border-radius: 18px;
	position: relative;
	overflow: hidden;
	border: 1px solid rgba(20,20,28,0.08);
	margin: -1rem 0 -1rem;
}
.ced-tb__interlude figcaption {
	position: absolute; left: 1.5rem; bottom: 1.25rem; display: grid; gap: 0.2rem;
}
.ced-tb__interlude .ced-eyebrow { font-size: 0.65rem; }
.ced-tb__interlude strong {
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: clamp(1.25rem, 2vw, 1.75rem); text-transform: uppercase; letter-spacing: 0.005em;
	color: var(--wp--preset--color--ink);
	font-weight: 400;
}
.ced-tb__interlude small { color: rgba(20,20,28,0.6); font-size: 0.78rem; letter-spacing: 0.12em; text-transform: uppercase; }

.ced-tb__closing { margin-top: 4rem; padding-top: 3rem; border-top: 1px dashed rgba(20,20,28,0.12); }
.ced-tb__closing-grid {
	display: grid; gap: 1rem; grid-template-columns: 1fr 1fr;
	margin-top: 1.25rem;
}
.ced-tb__closing-photo {
	aspect-ratio: 16 / 9;
	border-radius: 14px;
	position: relative;
	overflow: hidden;
	border: 1px solid rgba(20,20,28,0.08);
}
.ced-tb__closing-photo figcaption {
	position: absolute; left: 1.25rem; bottom: 1rem; display: grid; gap: 0.15rem;
}
.ced-tb__closing-photo strong {
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: 1.1rem; text-transform: uppercase;
}
.ced-tb__closing-photo small { color: rgba(20,20,28,0.6); font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase; }

@media (max-width: 720px) {
	.ced-tb__profile, .ced-tb__profile--r { grid-template-columns: 1fr; }
	.ced-tb__profile--r .ced-tb__copy { order: 2; }
	.ced-tb__profile--r .ced-tb__portrait { order: 1; }
	.ced-tb__portrait { aspect-ratio: 1 / 1; }
	.ced-tb__closing-grid { grid-template-columns: 1fr; }
}

/* ─────────────────────────────────────────────────────────────
   VARIANT C — Spotlight + Tribe + Mosaic
   ───────────────────────────────────────────────────────────── */
.ced-tc {
	background: var(--wp--preset--color--paper);
	border: 1px solid rgba(20,20,28,0.08);
	border-radius: clamp(1.5rem, 2.5vw, 2.5rem);
	padding: clamp(2.5rem, 4.5vw, 4rem);
}
.ced-tc__head { display: grid; gap: 1rem; margin-bottom: 3rem; }
.ced-tc__title {
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: clamp(2rem, 4vw, 3.5rem);
	line-height: 0.96; letter-spacing: 0.005em; text-transform: uppercase;
	margin: 0; color: var(--wp--preset--color--ink); max-width: 26ch;
}

.ced-tc__spotlight {
	display: grid;
	grid-template-columns: 340px 1fr;
	gap: clamp(2rem, 4vw, 4rem);
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--paper);
	border-radius: 24px;
	padding: clamp(2rem, 3vw, 3rem);
	overflow: hidden;
	position: relative;
}
.ced-tc__spot-portrait {
	aspect-ratio: 1 / 1.1;
	border-radius: 18px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--wp--preset--color--paper);
}
.ced-tc__spot-mark {
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: clamp(5rem, 9vw, 8rem);
}
.ced-tc__spot-copy { display: grid; align-content: center; gap: 1rem; }
.ced-tc__spot-copy .ced-eyebrow { color: rgba(203,108,230,0.95); }
.ced-tc__spot-name {
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: clamp(2rem, 4.5vw, 3.5rem);
	text-transform: uppercase; letter-spacing: 0.005em; line-height: 1;
	margin: 0;
}
.ced-tc__spot-quote { margin: 0; padding: 0 0 0 1.5rem; border-left: 3px solid rgba(203,108,230,0.5); }
.ced-tc__spot-quote p {
	font-family: var(--wp--preset--font-family--serif-display, 'Newsreader', serif);
	font-style: italic;
	font-size: clamp(1.2rem, 1.8vw, 1.5rem);
	line-height: 1.45;
	color: var(--wp--preset--color--paper);
	margin: 0;
}
.ced-tc__spot-bio { color: rgba(232,229,222,0.72); line-height: 1.6; margin: 0; max-width: 50ch; }

.ced-tc__tribe {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1rem;
	margin-top: 2rem;
}
.ced-tc__tile {
	background: var(--wp--preset--color--cream);
	border: 1px solid rgba(20,20,28,0.10);
	border-radius: 18px;
	padding: 1.5rem;
	display: grid;
	gap: 0.85rem;
	align-content: start;
}
.ced-tc__tile-portrait {
	width: 60px; height: 60px; border-radius: 14px;
	display: inline-flex; align-items: center; justify-content: center;
	color: var(--wp--preset--color--paper);
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: 1.6rem;
}
.ced-tc__tile-role {
	font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase;
	color: rgba(20,20,28,0.55);
}
.ced-tc__tile-name {
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: 1.1rem; text-transform: uppercase; letter-spacing: 0.005em;
	margin: 0; color: var(--wp--preset--color--ink); line-height: 1.15;
}
.ced-tc__tile-bio { color: rgba(20,20,28,0.65); font-size: 0.88rem; line-height: 1.5; margin: 0; }

.ced-tc__mosaic { margin-top: 4rem; padding-top: 3rem; border-top: 1px dashed rgba(20,20,28,0.12); }
.ced-tc__mosaic-head { display: grid; gap: 0.5rem; margin-bottom: 1.5rem; }
.ced-tc__mosaic-title {
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: clamp(1.5rem, 2.4vw, 2rem);
	text-transform: uppercase; margin: 0;
	color: var(--wp--preset--color--ink);
}
.ced-tc__mosaic-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-template-rows: repeat(2, 220px);
	gap: 1rem;
}
.ced-tc__mosaic-photo {
	margin: 0;
	border-radius: 14px;
	position: relative;
	overflow: hidden;
	border: 1px solid rgba(20,20,28,0.08);
}
.ced-tc__mosaic-photo--n0 { grid-column: span 2; grid-row: span 2; }
.ced-tc__mosaic-photo--n1 { grid-column: span 2; }
.ced-tc__mosaic-photo--n2 { }
.ced-tc__mosaic-photo--n3 { }
.ced-tc__mosaic-photo--n4 { }
.ced-tc__mosaic-photo--n5 { }
.ced-tc__mosaic-photo figcaption {
	position: absolute; left: 1.25rem; bottom: 1rem; display: grid; gap: 0.15rem;
}
.ced-tc__mosaic-photo strong {
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: 1rem; text-transform: uppercase; letter-spacing: 0.005em;
	color: var(--wp--preset--color--ink);
	font-weight: 400;
}
.ced-tc__mosaic-photo small { color: rgba(20,20,28,0.6); font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase; }
.ced-tc__mosaic-photo--n0 strong { font-size: 1.3rem; }

@media (max-width: 900px) {
	.ced-tc__spotlight { grid-template-columns: 1fr; }
	.ced-tc__spot-portrait { aspect-ratio: 1 / 1; max-width: 280px; }
	.ced-tc__tribe { grid-template-columns: 1fr; }
	.ced-tc__mosaic-grid { grid-template-columns: 1fr 1fr; grid-template-rows: repeat(3, 200px); }
	.ced-tc__mosaic-photo--n0 { grid-column: span 2; grid-row: span 1; }
	.ced-tc__mosaic-photo--n1 { grid-column: span 2; }
}


/* ─────────────────────────────────────────────────────────────
   VARIANT D — Collage Hero (mixed photo + video tiles)
   ───────────────────────────────────────────────────────────── */
.ced-td {
	background: var(--wp--preset--color--paper);
	border: 1px solid rgba(20,20,28,0.08);
	border-radius: clamp(1.5rem, 2.5vw, 2.5rem);
	padding: clamp(2.5rem, 4.5vw, 4rem);
}
.ced-td__head { display: grid; gap: 1rem; margin-bottom: 2.5rem; }
.ced-td__title {
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: clamp(2rem, 4vw, 3.5rem);
	line-height: 0.96; letter-spacing: 0.005em; text-transform: uppercase;
	margin: 0; color: var(--wp--preset--color--ink); max-width: 22ch;
}
.ced-td__lede { color: rgba(20,20,28,0.65); max-width: 60ch; margin: 0; }

/* ── The collage grid — 4×3 with deliberately uneven tile spans ── */
.ced-td__collage {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-template-rows: 240px 240px 200px;
	gap: 0.85rem;
	margin-bottom: 4rem;
}
/* Tile placements: a = 2×2 anchor, b = tall col-3, c & d = right-side
   squares, e & f = wide bottom row. Result: a single asymmetric wall
   that reads as a real moodboard rather than a uniform grid. */
.ced-td__tile--a { grid-column: 1 / 3; grid-row: 1 / 3; }
.ced-td__tile--b { grid-column: 3 / 4; grid-row: 1 / 3; }
.ced-td__tile--c { grid-column: 4 / 5; grid-row: 1 / 2; }
.ced-td__tile--d { grid-column: 4 / 5; grid-row: 2 / 3; }
.ced-td__tile--e { grid-column: 1 / 3; grid-row: 3 / 4; }
.ced-td__tile--f { grid-column: 3 / 5; grid-row: 3 / 4; }

.ced-td__tile {
	margin: 0;
	position: relative;
	border-radius: 18px;
	overflow: hidden;
	border: 1px solid rgba(20,20,28,0.08);
	transition: transform 320ms var(--ease-smooth, ease);
}
.ced-td__tile:hover { transform: translateY(-2px); }

/* Photo tiles — static gradient + soft inner light per accent. */
.ced-td__tile--photo.ced-td__tile--lavender { background: radial-gradient(120% 120% at 0% 0%, rgba(181,148,255,0.55), rgba(181,148,255,0.15) 60%, transparent), linear-gradient(135deg, #efe6ff, #c7adff); }
.ced-td__tile--photo.ced-td__tile--rose     { background: radial-gradient(120% 120% at 0% 100%, rgba(255,121,158,0.5), rgba(255,121,158,0.12) 60%, transparent), linear-gradient(135deg, #ffe8ee, #ffafc6); }
.ced-td__tile--photo.ced-td__tile--sky      { background: radial-gradient(120% 120% at 100% 100%, rgba(78,205,196,0.55), rgba(78,205,196,0.15) 60%, transparent), linear-gradient(135deg, #d8f5f1, #98e0d8); }
.ced-td__tile--photo.ced-td__tile--coral    { background: radial-gradient(120% 120% at 100% 0%, rgba(255,107,71,0.55), rgba(255,107,71,0.15) 60%, transparent), linear-gradient(135deg, #ffe1d6, #ffb8a3); }
.ced-td__tile--photo.ced-td__tile--sunset   { background: radial-gradient(120% 120% at 50% 0%, rgba(255,179,71,0.55), rgba(255,179,71,0.15) 60%, transparent), linear-gradient(135deg, #fff2d9, #ffd089); }
.ced-td__tile--photo.ced-td__tile--sage     { background: radial-gradient(120% 120% at 100% 50%, rgba(200,221,168,0.6), rgba(200,221,168,0.2) 60%, transparent), linear-gradient(135deg, #f1f7e4, #c8dda8); }

/* Video tiles — same base palette but darker + an animated overlay
   "motion" layer that slowly drifts to suggest playback. Replace
   .ced-td__tile-motion in production with <video autoplay muted loop
   playsinline> pointing at the actual clip. */
.ced-td__tile--video {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--paper);
}
.ced-td__tile-motion {
	position: absolute; inset: 0;
	pointer-events: none;
	mix-blend-mode: screen;
	opacity: 0.85;
	background:
		radial-gradient(40% 60% at 20% 30%, rgba(255,255,255,0.5), transparent 70%),
		radial-gradient(35% 50% at 75% 70%, rgba(255,255,255,0.4), transparent 70%);
	filter: blur(20px);
	animation: ced-td-motion 9s ease-in-out infinite alternate;
}
.ced-td__tile--video.ced-td__tile--sunset  { background: linear-gradient(135deg, #c46a14 0%, #6e2900 100%); }
.ced-td__tile--video.ced-td__tile--sage    { background: linear-gradient(135deg, #4a6038 0%, #1f2913 100%); }
.ced-td__tile--video.ced-td__tile--coral   { background: linear-gradient(135deg, #b8412c 0%, #4a1908 100%); }
.ced-td__tile--video.ced-td__tile--lavender{ background: linear-gradient(135deg, #5c3aa6 0%, #221349 100%); }
.ced-td__tile--video.ced-td__tile--sky     { background: linear-gradient(135deg, #1d6a64 0%, #0a2826 100%); }
.ced-td__tile--video.ced-td__tile--rose    { background: linear-gradient(135deg, #b54a6b 0%, #4a1827 100%); }

@keyframes ced-td-motion {
	0%   { transform: translate(0,0) scale(1); }
	100% { transform: translate(-6%,4%) scale(1.08); }
}

/* Badges — top-left status pill that distinguishes photo vs video at a glance. */
.ced-td__tile-badge {
	position: absolute; top: 1rem; left: 1rem;
	display: inline-flex; align-items: center; gap: 0.4rem;
	padding: 0.35rem 0.65rem;
	border-radius: 999px;
	background: rgba(232, 229, 222, 0.85);
	color: var(--wp--preset--color--ink);
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: 0.7rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	z-index: 2;
	backdrop-filter: blur(6px);
}
.ced-td__tile--video .ced-td__tile-badge {
	background: rgba(20, 20, 28, 0.65);
	color: var(--wp--preset--color--paper);
}
.ced-td__tile-badge--photo {
	background: rgba(232, 229, 222, 0.85);
}

.ced-td__tile figcaption {
	position: absolute; left: 1.25rem; bottom: 1rem;
	display: grid; gap: 0.2rem;
	z-index: 2;
}
.ced-td__tile figcaption strong {
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: clamp(0.95rem, 1.05vw, 1.15rem);
	letter-spacing: 0.005em;
	text-transform: uppercase;
	font-weight: 400;
	color: var(--wp--preset--color--ink);
	line-height: 1.1;
}
.ced-td__tile--video figcaption strong { color: var(--wp--preset--color--paper); }
.ced-td__tile figcaption small {
	font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase;
	color: rgba(20, 20, 28, 0.6);
}
.ced-td__tile--video figcaption small { color: rgba(232, 229, 222, 0.68); }
/* The big anchor tile gets a larger caption. */
.ced-td__tile--a figcaption strong { font-size: clamp(1.3rem, 1.6vw, 1.65rem); }

/* ── Roster beneath the collage ────────────────────────────────── */
.ced-td__roster {
	padding-top: 2.5rem;
	border-top: 1px dashed rgba(20,20,28,0.12);
}
.ced-td__roster-head { display: grid; gap: 0.5rem; margin-bottom: 1.5rem; }
.ced-td__roster-title {
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: clamp(1.5rem, 2.4vw, 2rem);
	text-transform: uppercase; margin: 0;
	color: var(--wp--preset--color--ink);
}
.ced-td__roster-grid {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr 1fr;
	gap: 1rem;
}
.ced-td__person {
	background: var(--wp--preset--color--cream);
	border: 1px solid rgba(20,20,28,0.10);
	border-radius: 18px;
	padding: 1.5rem;
	display: grid;
	gap: 0.85rem;
	align-content: start;
}
.ced-td__person--lead {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--paper);
	border-color: rgba(232,229,222,0.10);
}
.ced-td__person-portrait {
	width: 60px; height: 60px; border-radius: 14px;
	display: inline-flex; align-items: center; justify-content: center;
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: 1.6rem;
	color: var(--wp--preset--color--paper);
}
.ced-td__person--lead .ced-td__person-portrait,
.ced-td__person--lavender .ced-td__person-portrait { background: linear-gradient(135deg, #b594ff, #8a6ad6); }
.ced-td__person--coral .ced-td__person-portrait { background: linear-gradient(135deg, #ff6b47, #d44e2c); }
.ced-td__person--sky .ced-td__person-portrait   { background: linear-gradient(135deg, #4ecdc4, #2e9b94); }
.ced-td__person--sage .ced-td__person-portrait  { background: linear-gradient(135deg, #c8dda8, #95b970); }
.ced-td__person-role {
	font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase;
	color: rgba(20,20,28,0.55);
}
.ced-td__person--lead .ced-td__person-role { color: rgba(232,229,222,0.7); }
.ced-td__person-name {
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: 1.1rem; text-transform: uppercase; letter-spacing: 0.005em;
	margin: 0; line-height: 1.15;
	color: var(--wp--preset--color--ink);
}
.ced-td__person--lead .ced-td__person-name { color: var(--wp--preset--color--paper); }
.ced-td__person-bio {
	color: rgba(20,20,28,0.65);
	font-size: 0.88rem; line-height: 1.5; margin: 0;
}
.ced-td__person--lead .ced-td__person-bio { color: rgba(232,229,222,0.72); }

@media (max-width: 900px) {
	.ced-td__collage {
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(5, 180px);
	}
	.ced-td__tile--a { grid-column: 1 / 3; grid-row: 1 / 3; }
	.ced-td__tile--b { grid-column: 1 / 2; grid-row: 3 / 4; }
	.ced-td__tile--c { grid-column: 2 / 3; grid-row: 3 / 4; }
	.ced-td__tile--d { grid-column: 1 / 2; grid-row: 4 / 5; }
	.ced-td__tile--e { grid-column: 2 / 3; grid-row: 4 / 5; }
	.ced-td__tile--f { grid-column: 1 / 3; grid-row: 5 / 6; }
	.ced-td__roster-grid { grid-template-columns: 1fr; }
}


/* Variant D — full profile cards (replaces the compact roster).
   Each card: real-photo-friendly 4:5 portrait area at top, role +
   name + bio + signature quote stacked below. The portrait container
   has a gradient placeholder + "PORTRAIT" overlay so the user can
   see where their image will sit; in production the inner span gets
   swapped for <img src="..." class="ced-td__person-img" alt="...">. */
.ced-td__roster-head { display: grid; gap: 0.5rem; margin-bottom: 2rem; }
.ced-td__roster-lede {
	color: rgba(20,20,28,0.6);
	max-width: 55ch;
	margin: 0.25rem 0 0;
	font-size: 0.95rem;
}

.ced-td__roster-grid {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr) !important;
	gap: 1rem !important;
}

.ced-td__person {
	background: var(--wp--preset--color--paper) !important;
	border: 1px solid rgba(20,20,28,0.10) !important;
	border-radius: 18px !important;
	padding: 0 !important;
	display: grid !important;
	grid-template-rows: auto 1fr !important;
	gap: 0 !important;
	overflow: hidden;
	transition: transform 320ms var(--ease-smooth, ease), border-color 320ms;
}
.ced-td__person:hover { transform: translateY(-3px); border-color: rgba(20,20,28,0.18) !important; }

.ced-td__person--lead {
	background: var(--wp--preset--color--ink) !important;
	border-color: rgba(232,229,222,0.10) !important;
	color: var(--wp--preset--color--paper);
}

/* Portrait area — 4:5 aspect, gradient placeholder, with the
   initial letter big and a small "Portrait" label so the user
   can imagine the photo sitting there. */
.ced-td__person-portrait {
	width: 100% !important;
	height: auto !important;
	aspect-ratio: 4 / 5;
	border-radius: 0 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	position: relative;
	overflow: hidden;
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: clamp(3rem, 5.5vw, 5rem);
	color: var(--wp--preset--color--paper);
}
.ced-td__person-mark { position: relative; z-index: 1; }
.ced-td__person-placeholder {
	position: absolute;
	bottom: 0.75rem; left: 50%;
	transform: translateX(-50%);
	font-family: var(--font-display, 'Anton', sans-serif);
	font-size: 0.65rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.55);
	padding: 0.2rem 0.6rem;
	border-radius: 999px;
	background: rgba(20, 20, 28, 0.32);
	backdrop-filter: blur(4px);
	z-index: 2;
}

.ced-td__person-body {
	padding: 1.5rem 1.5rem 1.75rem;
	display: grid;
	gap: 0.7rem;
}
.ced-td__person-role {
	font-size: 0.7rem !important;
	letter-spacing: 0.18em !important;
	text-transform: uppercase !important;
	color: rgba(20,20,28,0.55) !important;
}
.ced-td__person--lead .ced-td__person-role { color: rgba(232,229,222,0.7) !important; }

.ced-td__person-name {
	font-family: var(--font-display, 'Anton', sans-serif) !important;
	font-size: clamp(1rem, 1.3vw, 1.2rem) !important;
	text-transform: uppercase !important;
	letter-spacing: 0.005em !important;
	margin: 0 !important;
	line-height: 1.1 !important;
	color: var(--wp--preset--color--ink) !important;
}
.ced-td__person--lead .ced-td__person-name { color: var(--wp--preset--color--paper) !important; }

.ced-td__person-bio {
	color: rgba(20,20,28,0.68) !important;
	font-size: 0.86rem !important;
	line-height: 1.5 !important;
	margin: 0 !important;
}
.ced-td__person--lead .ced-td__person-bio { color: rgba(232,229,222,0.72) !important; }

.ced-td__person-quote {
	margin: 0.25rem 0 0;
	padding: 0 0 0 0.85rem;
	border-left: 2px solid rgba(20,20,28,0.18);
}
.ced-td__person--lead .ced-td__person-quote { border-left-color: rgba(203,108,230,0.55); }
.ced-td__person-quote p {
	font-family: var(--wp--preset--font-family--serif-display, 'Newsreader', serif);
	font-style: italic;
	font-size: 0.92rem;
	line-height: 1.4;
	color: rgba(20,20,28,0.7);
	margin: 0;
}
.ced-td__person--lead .ced-td__person-quote p { color: rgba(232,229,222,0.85); }

/* Mobile: stack profiles single-column */
@media (max-width: 900px) {
	.ced-td__roster-grid { grid-template-columns: 1fr 1fr !important; }
}
@media (max-width: 560px) {
	.ced-td__roster-grid { grid-template-columns: 1fr !important; }
}