/* ==========================================================================
   TeamCNF design system
   Shared styles for every page: resets, background mesh, buttons, icons,
   helpers, scroll reveal and the light theme. Every value comes from the
   theme tokens (theme.json): --wp--preset--* and --wp--custom--*.
   ========================================================================== */

/* ---- Resets WordPress doesn't ship -------------------------------------- */
[class*="tcnf-"],
[class*="tcnf-"]::before,
[class*="tcnf-"]::after,
[class*="tcnf-"] * {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--wp--custom--size--header) + var(--wp--preset--spacing--60));
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: clip;
}

:root a {
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
}

:where(h1, h2, h3, h4) {
	text-wrap: balance;
}

:where(p) {
	text-wrap: pretty;
}

:where(strong, b) {
	color: var(--wp--custom--text--primary);
	font-weight: 600;
}

::selection {
	background: var(--wp--preset--color--accent);
	color: var(--wp--custom--text--on-accent);
}

/* Keyboard focus only: a ring on keyboard focus, nothing on mouse clicks */
:focus:not(:focus-visible) {
	outline: none;
}

:focus-visible {
	outline: none;
	box-shadow: var(--wp--custom--focus-ring);
}

a:not(.wp-block-button__link):focus-visible {
	border-radius: var(--wp--custom--radius--xs);
}

/* Sections sit flush against each other and against the header */
body .wp-site-blocks > * {
	margin-block-start: 0;
}

body .entry-content > [class*="tcnf-"] {
	margin-block-start: 0;
}

/* ---- Type helpers -------------------------------------------------------- */
/* Red highlight for key words in large headlines */
.tcnf-hl {
	color: var(--wp--preset--color--highlight);
}

/* Keeps a hyphenated word ("E-commerce") from breaking at the hyphen */
.tcnf-nowrap {
	white-space: nowrap;
}

.tcnf-lead {
	max-width: var(--wp--custom--size--measure-lead);
	color: var(--wp--custom--text--secondary);
	font-size: var(--wp--preset--font-size--medium);
	line-height: var(--wp--custom--leading--relaxed);
}

.tcnf-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: var(--wp--preset--spacing--20);
	color: var(--wp--custom--text--tertiary);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 600;
	letter-spacing: var(--wp--custom--tracking--wider);
	text-transform: uppercase;
}

.tcnf-eyebrow::before {
	content: "";
	flex: none;
	width: var(--wp--preset--spacing--60);
	height: 1px;
	background: var(--wp--preset--gradient--accent-line);
}

/* ---- Glass panel --------------------------------------------------------- */
.tcnf-glass {
	position: relative;
	background: var(--wp--preset--gradient--sheen), var(--wp--custom--glass--fill);
	border: 1px solid var(--wp--custom--glass--border);
	border-radius: var(--wp--custom--radius--lg);
	box-shadow: var(--wp--preset--shadow--glass), var(--wp--custom--inset-sheen);
	-webkit-backdrop-filter: blur(var(--wp--custom--glass--blur)) saturate(var(--wp--custom--glass--saturate));
	backdrop-filter: blur(var(--wp--custom--glass--blur)) saturate(var(--wp--custom--glass--saturate));
}

.tcnf-glass--subtle {
	background: var(--wp--preset--gradient--sheen), var(--wp--custom--glass--fill-subtle);
	border-color: var(--wp--custom--glass--border-subtle);
}

.tcnf-glass--strong {
	background: var(--wp--preset--gradient--sheen), var(--wp--custom--glass--fill-strong);
	-webkit-backdrop-filter: blur(var(--wp--custom--glass--blur-strong)) saturate(var(--wp--custom--glass--saturate));
	backdrop-filter: blur(var(--wp--custom--glass--blur-strong)) saturate(var(--wp--custom--glass--saturate));
}

/* Darker glass for text over bright photos */
.tcnf-glass--dark {
	background: var(--wp--preset--gradient--sheen), var(--wp--custom--glass--fill-dark);
	-webkit-backdrop-filter: blur(var(--wp--custom--glass--blur-strong)) saturate(var(--wp--custom--glass--saturate));
	backdrop-filter: blur(var(--wp--custom--glass--blur-strong)) saturate(var(--wp--custom--glass--saturate));
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	.tcnf-glass,
	.tcnf-glass--subtle,
	.tcnf-glass--strong,
	.tcnf-glass--dark {
		background: var(--wp--custom--scrim--strong);
	}
}

/* ---- Section and section heading ---------------------------------------- */
/* A page section: vertical breathing room, content held to the site width.
   The heading block is an eyebrow, title and intro; "split" puts the intro
   beside the title on wide screens. */
.tcnf-section {
	position: relative;
	padding-block: var(--wp--preset--spacing--100);
	padding-left: var(--wp--style--root--padding-left, var(--wp--custom--gutter));
	padding-right: var(--wp--style--root--padding-right, var(--wp--custom--gutter));
}

.tcnf-section__inner {
	max-width: var(--wp--style--global--content-size);
	margin-inline: auto;
}

.tcnf-section-head {
	display: grid;
	gap: var(--wp--preset--spacing--50);
	max-width: var(--wp--custom--size--narrow);
	margin-bottom: var(--wp--preset--spacing--80);
}

.tcnf-section-head--split {
	max-width: none;
	grid-template-columns: 1fr;
	align-items: end;
}

.tcnf-section-head__col {
	display: grid;
	gap: var(--wp--preset--spacing--50);
}

.tcnf-section-head :is(h2, p) {
	margin: 0;
}

@media (min-width: 900px) {
	.tcnf-section-head--split {
		grid-template-columns: 1.15fr 1fr;
		gap: var(--wp--preset--spacing--70) var(--wp--preset--spacing--90);
	}
}

/* ---- Icon badge ---------------------------------------------------------- */
/* A rounded glass square holding one line icon; the accent version glows red */
.tcnf-icon-badge {
	display: grid;
	place-items: center;
	flex: none;
	width: var(--wp--custom--size--icon-badge);
	height: var(--wp--custom--size--icon-badge);
	border: 1px solid var(--wp--custom--glass--border);
	border-radius: var(--wp--custom--radius--md);
	background: var(--wp--preset--gradient--sheen), var(--wp--custom--glass--fill);
	box-shadow: var(--wp--custom--inset-sheen);
	color: var(--wp--custom--text--primary);
	--tcnf-glyph-size: var(--wp--custom--size--icon--md);
}

.tcnf-icon-badge--accent {
	border-color: var(--wp--custom--accent-line);
	background: var(--wp--preset--gradient--sheen), var(--wp--custom--glass--fill-accent);
}

/* ---- Text link with an arrow -------------------------------------------- */
.tcnf-link-arrow {
	display: inline-flex;
	align-items: center;
	gap: var(--wp--preset--spacing--20);
	padding-bottom: var(--wp--preset--spacing--10);
	border-bottom: 1px solid var(--wp--custom--glass--border);
	color: var(--wp--custom--text--primary);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	text-decoration: none;
	transition: border-color var(--wp--custom--duration--base) var(--wp--custom--ease--out);
	--tcnf-glyph-size: var(--wp--custom--size--icon--sm);
}

.tcnf-link-arrow:hover {
	border-color: var(--wp--custom--accent-line);
	color: var(--wp--custom--text--primary);
	text-decoration: none;
}

.tcnf-link-arrow .tcnf-glyph {
	transition: transform var(--wp--custom--duration--base) var(--wp--custom--ease--out);
}

.tcnf-link-arrow:hover .tcnf-glyph {
	transform: translate(var(--wp--custom--nudge), calc(var(--wp--custom--nudge) * -1));
}

/* ---- Media frame and floating shapes ------------------------------------ */
.tcnf-media-frame {
	position: relative;
	overflow: hidden;
	border: 1px solid var(--wp--custom--glass--border);
	border-radius: var(--wp--custom--radius--lg);
	background: var(--wp--preset--color--surface);
	box-shadow: var(--wp--preset--shadow--float);
}

.tcnf-media-frame > img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.tcnf-shape {
	position: absolute;
	pointer-events: none;
	user-select: none;
	animation: tcnf-shape-float var(--wp--custom--duration--float) var(--wp--custom--ease--in-out) infinite alternate;
}

@keyframes tcnf-shape-float {
	from { transform: translate3d(0, 0, 0) rotate(0deg); }
	to   { transform: translate3d(0, calc(var(--wp--preset--spacing--50) * -1), 0) rotate(6deg); }
}

/* ---- Line icons ---------------------------------------------------------- */
/* Add tcnf-icon-whatsapp, tcnf-icon-grid or tcnf-icon-arrow to a button,
   paragraph or link. The icon is drawn in the text colour, so it follows
   both themes and any colour picked in the editor. */
.tcnf-icon-whatsapp {
	--tcnf-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.75 20.25l1.2-4.2A8.25 8.25 0 1 1 8.1 19.2z'/%3E%3Cpath d='M9.2 8.2c-.4.3-.7.9-.6 1.6.4 2.8 2.8 5.2 5.6 5.6.7.1 1.3-.2 1.6-.6l.4-.7-1.9-1.1-.9.8a4.6 4.6 0 0 1-2.2-2.2l.8-.9-1.1-1.9z'/%3E%3C/svg%3E");
}

.tcnf-icon-grid {
	--tcnf-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='4' width='6' height='6' rx='1.5'/%3E%3Crect x='14' y='4' width='6' height='6' rx='1.5'/%3E%3Crect x='4' y='14' width='6' height='6' rx='1.5'/%3E%3Crect x='14' y='14' width='6' height='6' rx='1.5'/%3E%3C/svg%3E");
}

.tcnf-icon-arrow {
	--tcnf-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 12h15M13.5 6l6 6-6 6'/%3E%3C/svg%3E");
}

p[class*="tcnf-icon-"]:not(:has(> a)) {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--20);
}

[class*="tcnf-icon-"] > a {
	display: inline-flex;
	align-items: center;
	gap: var(--wp--preset--spacing--20);
}

/* WhatsApp and grid sit before the text, the arrow after it */
:is(.tcnf-icon-whatsapp, .tcnf-icon-grid):not(:has(> a))::before,
:is(.tcnf-icon-whatsapp, .tcnf-icon-grid) > a::before,
.tcnf-icon-arrow:not(:has(> a))::after,
.tcnf-icon-arrow > a::after {
	content: "";
	display: inline-block;
	flex: none;
	width: var(--tcnf-icon-size, var(--wp--custom--size--icon--sm));
	height: var(--tcnf-icon-size, var(--wp--custom--size--icon--sm));
	vertical-align: middle;
	background-color: currentColor;
	-webkit-mask: var(--tcnf-icon) center / contain no-repeat;
	mask: var(--tcnf-icon) center / contain no-repeat;
	transition: transform var(--wp--custom--duration--base) var(--wp--custom--ease--out);
}

a.tcnf-icon-arrow:hover::after,
.tcnf-icon-arrow > a:hover::after {
	transform: translateX(var(--wp--preset--spacing--10));
}

/* ---- Glyphs: line icons inside blocks ---------------------------------- */
/* <span class="tcnf-glyph tcnf-glyph--target" aria-hidden="true"></span>.
   Drawn in the text colour; set --tcnf-glyph-size on a parent to resize. */
.tcnf-glyph {
	display: inline-block;
	flex: none;
	width: var(--tcnf-glyph-size, var(--wp--custom--size--icon--sm));
	height: var(--tcnf-glyph-size, var(--wp--custom--size--icon--sm));
	vertical-align: middle;
	background-color: currentColor;
	-webkit-mask: var(--tcnf-glyph) center / contain no-repeat;
	mask: var(--tcnf-glyph) center / contain no-repeat;
}

.tcnf-glyph--target {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Ccircle cx='12' cy='12' r='5'/%3E%3Ccircle cx='12' cy='12' r='1.5'/%3E%3Cpath d='M13.2 10.8 19 5M16.5 4.75H19.25V7.5'/%3E%3C/svg%3E");
}

.tcnf-glyph--tv {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.75' y='6.5' width='18.5' height='12' rx='2'/%3E%3Cpath d='M8 3.25l4 3.25 4-3.25M8.5 21.25h7'/%3E%3C/svg%3E");
}

.tcnf-glyph--megaphone {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 10v4a1 1 0 0 0 1 1H7l7 4.5v-15L7 9H4.5a1 1 0 0 0-1 1z'/%3E%3Cpath d='M7 15l1.2 5h2.3l-1-4.3'/%3E%3Cpath d='M17.5 9.25a3.5 3.5 0 0 1 0 5.5M19.75 6.75a7 7 0 0 1 0 10.5'/%3E%3C/svg%3E");
}

.tcnf-glyph--stage {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='3.25' width='16' height='9' rx='1.2'/%3E%3Cpath d='M4 7.75h16M9.33 3.25v9M14.67 3.25v9'/%3E%3Cpath d='M2.75 20.75h18.5M6 20.75v-4.25h12v4.25'/%3E%3C/svg%3E");
}

.tcnf-glyph--phone {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6.5' y='2.75' width='11' height='18.5' rx='2.2'/%3E%3Cpath d='M10.5 18.25h3'/%3E%3Cpath d='M9 13l2-2 1.5 1.5L15 10'/%3E%3C/svg%3E");
}

.tcnf-glyph--clapper {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 10h17v9.5a1 1 0 0 1-1 1h-15a1 1 0 0 1-1-1z'/%3E%3Cpath d='M3.5 10l-.6-3.2a1 1 0 0 1 .8-1.2L18.8 3a1 1 0 0 1 1.2.8l.5 2.7z'/%3E%3Cpath d='M8 4.6l2.4 3.6M13 3.7l2.4 3.6'/%3E%3C/svg%3E");
}

.tcnf-glyph--newspaper {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 5.5a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1V19a1.5 1.5 0 0 0 1.5 1.5H5a1.5 1.5 0 0 1-1.5-1.5z'/%3E%3Cpath d='M17.5 9h2a1 1 0 0 1 1 1v9a1.5 1.5 0 0 1-3 0'/%3E%3Cpath d='M7 8h7M7 11.5h7M7 15h4'/%3E%3C/svg%3E");
}

.tcnf-glyph--microphone {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='2.75' width='6' height='11' rx='3'/%3E%3Cpath d='M5.5 11a6.5 6.5 0 0 0 13 0M12 17.5v3.75M8.5 21.25h7'/%3E%3C/svg%3E");
}

.tcnf-glyph--pen {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.75 5.75 9.5 8.5 19h7l2.75-9.5z'/%3E%3Cpath d='M12 2.75V10'/%3E%3Ccircle cx='12' cy='11.75' r='1.6'/%3E%3Cpath d='M8.5 21.25h7'/%3E%3C/svg%3E");
}

.tcnf-glyph--browser {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.75' y='4' width='18.5' height='16' rx='2'/%3E%3Cpath d='M2.75 8.5h18.5'/%3E%3Cpath d='M6 6.25h.01M8.25 6.25h.01'/%3E%3Cpath d='M9.5 12.25 7 14.75l2.5 2.5M14.5 12.25l2.5 2.5-2.5 2.5'/%3E%3C/svg%3E");
}

.tcnf-glyph--plus {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E");
}

.tcnf-glyph--check {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E");
}

.tcnf-glyph--arrow-up-right {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M8.5 7H17v8.5'/%3E%3C/svg%3E");
}

.tcnf-glyph--globe {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3c2.5 2.6 3.8 5.6 3.8 9s-1.3 6.4-3.8 9c-2.5-2.6-3.8-5.6-3.8-9S9.5 5.6 12 3z'/%3E%3C/svg%3E");
}

.tcnf-glyph--television {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.75' y='6' width='18.5' height='12.5' rx='2'/%3E%3Cpath d='M8.5 2.75 12 6l3.5-3.25M8 21.25h8'/%3E%3C/svg%3E");
}

.tcnf-glyph--radio {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.75' y='8.5' width='18.5' height='12' rx='2'/%3E%3Cpath d='M6.5 8.5 17.5 3.5M6.5 12.75h4.5M6.5 16.25h4.5'/%3E%3Ccircle cx='16' cy='14.5' r='2.75'/%3E%3C/svg%3E");
}

.tcnf-glyph--press {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 4.5h13v15H5a1.5 1.5 0 0 1-1.5-1.5z'/%3E%3Cpath d='M16.5 8.5h4V18a1.5 1.5 0 0 1-1.5 1.5h-2.5'/%3E%3Crect x='6.5' y='7.5' width='7' height='4.5' rx='.75'/%3E%3Cpath d='M6.5 15h7M6.5 17.5h4'/%3E%3C/svg%3E");
}

.tcnf-glyph--facebook {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.5 21v-7.5h2.6l.4-3h-3V8.6c0-.9.3-1.6 1.6-1.6h1.6V4.3a21 21 0 0 0-2.4-.1c-2.4 0-4 1.5-4 4.1v2.2H8.6v3h2.7V21'/%3E%3C/svg%3E");
}

.tcnf-glyph--film {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3.5' width='18' height='17' rx='2'/%3E%3Cpath d='M7.5 3.5v17M16.5 3.5v17M3 8h4.5M3 12h4.5M3 16h4.5M16.5 8H21M16.5 12H21M16.5 16H21'/%3E%3C/svg%3E");
}

.tcnf-glyph--phone-play {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6.5' y='2.75' width='11' height='18.5' rx='2.2'/%3E%3Cpath d='M10.5 9.25l4 2.75-4 2.75z'/%3E%3C/svg%3E");
}

.tcnf-glyph--video {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.75' y='6.5' width='13' height='11' rx='2'/%3E%3Cpath d='M15.75 10.25l5.5-3.25v10l-5.5-3.25'/%3E%3C/svg%3E");
}

.tcnf-glyph--podcast {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 15v-3a8 8 0 0 1 16 0v3'/%3E%3Crect x='3' y='14' width='4' height='6.5' rx='1.5'/%3E%3Crect x='17' y='14' width='4' height='6.5' rx='1.5'/%3E%3C/svg%3E");
}

.tcnf-glyph--photo {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 8.5A1.5 1.5 0 0 1 4.5 7h2.8l1.5-2.5h6.4L16.7 7h2.8A1.5 1.5 0 0 1 21 8.5v10a1.5 1.5 0 0 1-1.5 1.5h-15A1.5 1.5 0 0 1 3 18.5z'/%3E%3Ccircle cx='12' cy='13.25' r='3.75'/%3E%3C/svg%3E");
}

.tcnf-glyph--elearning {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 9 12 4.5 21.5 9 12 13.5z'/%3E%3Cpath d='M6.5 11v4.5c0 1.4 2.5 3 5.5 3s5.5-1.6 5.5-3V11M21.5 9v5'/%3E%3C/svg%3E");
}

.tcnf-glyph--users {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3.25'/%3E%3Cpath d='M3 19.5a6 6 0 0 1 12 0'/%3E%3Ccircle cx='17' cy='9' r='2.5'/%3E%3Cpath d='M15.5 14.2a5 5 0 0 1 6 4.8'/%3E%3C/svg%3E");
}

.tcnf-glyph--quote {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.5 7.5C6.5 8.5 5 10.8 5 14v2.5h4.5V12H7.2c.2-1.6 1.1-2.7 2.8-3.4zM19 7.5c-3 1-4.5 3.3-4.5 6.5v2.5H19V12h-2.3c.2-1.6 1.1-2.7 2.8-3.4z'/%3E%3C/svg%3E");
}

.tcnf-glyph--wallet {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7.5h14.5A1.5 1.5 0 0 1 20 9v9.5a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 4 18.5V6a1.5 1.5 0 0 1 1.5-1.5H17'/%3E%3Cpath d='M15.5 13.75H17'/%3E%3C/svg%3E");
}

.tcnf-glyph--receipt {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3.5h12v17l-2-1.3-2 1.3-2-1.3-2 1.3-2-1.3-2 1.3z'/%3E%3Cpath d='M9 8h6M9 11.5h6M9 15h3.5'/%3E%3C/svg%3E");
}

.tcnf-glyph--layers {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5l9 4.75-9 4.75-9-4.75z'/%3E%3Cpath d='M3 12.5l9 4.75 9-4.75M3 16.5l9 4.75 9-4.75'/%3E%3C/svg%3E");
}

.tcnf-glyph--arrow-left {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19.5 12h-15M10.5 6l-6 6 6 6'/%3E%3C/svg%3E");
}

.tcnf-glyph--arrow-right {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 12h15M13.5 6l6 6-6 6'/%3E%3C/svg%3E");
}

.tcnf-glyph--call {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 3.5h3.2l1.6 4.2-2.1 1.3a11 11 0 0 0 6.3 6.3l1.3-2.1 4.2 1.6V18a2 2 0 0 1-2.2 2A16.5 16.5 0 0 1 3 5.7a2 2 0 0 1 2-2.2z'/%3E%3C/svg%3E");
}

.tcnf-glyph--mail {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.75' y='5' width='18.5' height='14' rx='2'/%3E%3Cpath d='M3.5 6.5l8.5 6.5 8.5-6.5'/%3E%3C/svg%3E");
}

.tcnf-glyph--map-pin {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6.2-7-11.5a7 7 0 0 1 14 0C19 14.8 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E");
}

.tcnf-glyph--instagram {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M17.25 6.75h.01'/%3E%3C/svg%3E");
}

.tcnf-glyph--linkedin {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='3'/%3E%3Cpath d='M7.5 10.5v6M7.5 7.5v.01M11 16.5v-6M11 13a2.5 2.5 0 0 1 5 0v3.5'/%3E%3C/svg%3E");
}

.tcnf-glyph--tiktok {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3.5v11.25a3.75 3.75 0 1 1-3.75-3.75'/%3E%3Cpath d='M14 3.5A4.5 4.5 0 0 0 18.5 8'/%3E%3C/svg%3E");
}

.tcnf-glyph--whatsapp {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.75 20.25l1.2-4.2A8.25 8.25 0 1 1 8.1 19.2z'/%3E%3Cpath d='M9.2 8.2c-.4.3-.7.9-.6 1.6.4 2.8 2.8 5.2 5.6 5.6.7.1 1.3-.2 1.6-.6l.4-.7-1.9-1.1-.9.8a4.6 4.6 0 0 1-2.2-2.2l.8-.9-1.1-1.9z'/%3E%3C/svg%3E");
}

.tcnf-glyph--download {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5v12M7 10.5l5 5 5-5M4 20.5h16'/%3E%3C/svg%3E");
}

.tcnf-glyph--close {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E");
}

.tcnf-glyph--language {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 5.5h9a1 1 0 0 1 1 1v6a1 1 0 0 1-1 1H8l-3 2.5v-2.5H3.5a1 1 0 0 1-1-1v-6a1 1 0 0 1 1-1z'/%3E%3Cpath d='M16.5 9.5h4a1 1 0 0 1 1 1v6a1 1 0 0 1-1 1H19V20l-3-2.5h-3.5a1 1 0 0 1-1-1v-1'/%3E%3C/svg%3E");
}

.tcnf-glyph--strategy {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Ccircle cx='12' cy='12' r='5'/%3E%3Ccircle cx='12' cy='12' r='1.5'/%3E%3Cpath d='M13.2 10.8 19 5M16.5 4.75H19.25V7.5'/%3E%3C/svg%3E");
}

.tcnf-glyph--atl {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.75' y='6.5' width='18.5' height='12' rx='2'/%3E%3Cpath d='M8 3.25l4 3.25 4-3.25M8.5 21.25h7'/%3E%3C/svg%3E");
}

.tcnf-glyph--btl {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 10v4a1 1 0 0 0 1 1H7l7 4.5v-15L7 9H4.5a1 1 0 0 0-1 1z'/%3E%3Cpath d='M7 15l1.2 5h2.3l-1-4.3'/%3E%3Cpath d='M17.5 9.25a3.5 3.5 0 0 1 0 5.5M19.75 6.75a7 7 0 0 1 0 10.5'/%3E%3C/svg%3E");
}

.tcnf-glyph--events {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='3.25' width='16' height='9' rx='1.2'/%3E%3Cpath d='M4 7.75h16M9.33 3.25v9M14.67 3.25v9'/%3E%3Cpath d='M2.75 20.75h18.5M6 20.75v-4.25h12v4.25'/%3E%3C/svg%3E");
}

.tcnf-glyph--production {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 10h17v9.5a1 1 0 0 1-1 1h-15a1 1 0 0 1-1-1z'/%3E%3Cpath d='M3.5 10l-.6-3.2a1 1 0 0 1 .8-1.2L18.8 3a1 1 0 0 1 1.2.8l.5 2.7z'/%3E%3Cpath d='M8 4.6l2.4 3.6M13 3.7l2.4 3.6'/%3E%3C/svg%3E");
}

.tcnf-glyph--digital {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6.5' y='2.75' width='11' height='18.5' rx='2.2'/%3E%3Cpath d='M10.5 18.25h3'/%3E%3Cpath d='M9 13l2-2 1.5 1.5L15 10'/%3E%3C/svg%3E");
}

.tcnf-glyph--media {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 5.5a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1V19a1.5 1.5 0 0 0 1.5 1.5H5a1.5 1.5 0 0 1-1.5-1.5z'/%3E%3Cpath d='M17.5 9h2a1 1 0 0 1 1 1v9a1.5 1.5 0 0 1-3 0'/%3E%3Cpath d='M7 8h7M7 11.5h7M7 15h4'/%3E%3C/svg%3E");
}

.tcnf-glyph--pr {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='2.75' width='6' height='11' rx='3'/%3E%3Cpath d='M5.5 11a6.5 6.5 0 0 0 13 0M12 17.5v3.75M8.5 21.25h7'/%3E%3C/svg%3E");
}

.tcnf-glyph--brand {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.75 5.75 9.5 8.5 19h7l2.75-9.5z'/%3E%3Cpath d='M12 2.75V10'/%3E%3Ccircle cx='12' cy='11.75' r='1.6'/%3E%3Cpath d='M8.5 21.25h7'/%3E%3C/svg%3E");
}

.tcnf-glyph--web {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.75' y='4' width='18.5' height='16' rx='2'/%3E%3Cpath d='M2.75 8.5h18.5'/%3E%3Cpath d='M6 6.25h.01M8.25 6.25h.01'/%3E%3Cpath d='M9.5 12.25 7 14.75l2.5 2.5M14.5 12.25l2.5 2.5-2.5 2.5'/%3E%3C/svg%3E");
}

.tcnf-glyph--chart {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 20.5h17'/%3E%3Cpath d='M6.5 17v-5M11 17V8M15.5 17v-7M19.5 17V5'/%3E%3C/svg%3E");
}

.tcnf-glyph--pause {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M10 9v6M14 9v6'/%3E%3C/svg%3E");
}

.tcnf-glyph--play {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M10 8.5l5.5 3.5-5.5 3.5z'/%3E%3C/svg%3E");
}

.tcnf-glyph--grid {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='4' width='6' height='6' rx='1.5'/%3E%3Crect x='14' y='4' width='6' height='6' rx='1.5'/%3E%3Crect x='4' y='14' width='6' height='6' rx='1.5'/%3E%3Crect x='14' y='14' width='6' height='6' rx='1.5'/%3E%3C/svg%3E");
}

.tcnf-glyph--calendar {
	--tcnf-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='15.5' rx='2'/%3E%3Cpath d='M3.5 9.5h17M8 3v4M16 3v4M8 13.5h.01M12 13.5h.01M16 13.5h.01M8 17h.01M12 17h.01'/%3E%3C/svg%3E");
}

/* ---- Buttons (core Button block) ---------------------------------------- */
/* Default style is the red primary button. "Glass" is in the block's Styles
   panel. Add the class tcnf-btn-lg (Advanced > Additional CSS class) for the
   large size. */
.wp-block-button .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--wp--preset--spacing--20);
	min-height: var(--wp--custom--size--control);
	white-space: nowrap;
	box-shadow: var(--wp--preset--shadow--glow), var(--wp--custom--inset-sheen);
	transition:
		transform var(--wp--custom--duration--base) var(--wp--custom--ease--out),
		box-shadow var(--wp--custom--duration--base) var(--wp--custom--ease--out),
		background-color var(--wp--custom--duration--base) var(--wp--custom--ease--out),
		border-color var(--wp--custom--duration--base) var(--wp--custom--ease--out);
}

.wp-block-button .wp-block-button__link:hover {
	transform: translateY(calc(var(--wp--custom--nudge) * -1));
	box-shadow: var(--wp--preset--shadow--glow-strong), var(--wp--custom--inset-sheen);
}

/* A set width lets a long label wrap instead of overflowing */
.wp-block-button.has-custom-width .wp-block-button__link {
	white-space: normal;
}

.wp-block-button.tcnf-btn-lg .wp-block-button__link {
	min-height: var(--wp--custom--size--control-lg);
	padding-inline: var(--wp--preset--spacing--60);
	font-size: var(--wp--preset--font-size--base);
}

.wp-block-button.is-style-glass .wp-block-button__link {
	background: var(--wp--preset--gradient--sheen), var(--wp--custom--glass--fill);
	border-color: var(--wp--custom--glass--border);
	color: var(--wp--custom--text--primary);
	box-shadow: var(--wp--preset--shadow--soft), var(--wp--custom--inset-sheen);
	-webkit-backdrop-filter: blur(var(--wp--custom--glass--blur)) saturate(var(--wp--custom--glass--saturate));
	backdrop-filter: blur(var(--wp--custom--glass--blur)) saturate(var(--wp--custom--glass--saturate));
}

.wp-block-button.is-style-glass .wp-block-button__link:hover {
	background: var(--wp--preset--gradient--sheen), var(--wp--custom--glass--fill-strong);
	border-color: var(--wp--custom--glass--border-strong);
	box-shadow: var(--wp--preset--shadow--soft), var(--wp--custom--inset-sheen);
}

.wp-block-button .wp-block-button__link:focus-visible,
.wp-block-button.is-style-glass .wp-block-button__link:focus-visible {
	outline: none;
	box-shadow: var(--wp--custom--focus-ring);
}

/* ---- Centred section heading -------------------------------------------- */
.tcnf-section-head--center {
	margin-inline: auto;
	text-align: center;
	justify-items: center;
}

/* ---- Chips: small labelled pills ---------------------------------------- */
.tcnf-chip-list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--20);
	margin: 0;
	padding: 0;
	list-style: none;
}

.tcnf-chip-list > li {
	margin: 0;
}

.tcnf-chip {
	display: inline-flex;
	align-items: center;
	gap: var(--wp--preset--spacing--10);
	padding: var(--wp--preset--spacing--10) var(--wp--preset--spacing--30);
	border: 1px solid var(--wp--custom--glass--border-subtle);
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--custom--glass--fill-subtle);
	color: var(--wp--custom--text--secondary);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 500;
	line-height: var(--wp--custom--leading--snug);
	--tcnf-glyph-size: var(--wp--custom--size--icon--xs);
}

/* Dashed pill that marks sample content the owner still has to replace */
.tcnf-tag-placeholder {
	display: inline-flex;
	align-items: center;
	gap: var(--wp--preset--spacing--10);
	padding: var(--wp--custom--nudge) var(--wp--preset--spacing--20);
	border: 1px dashed var(--wp--custom--glass--border-strong);
	border-radius: var(--wp--custom--radius--pill);
	color: var(--wp--custom--text--tertiary);
	font-size: var(--wp--preset--font-size--tiny);
	font-weight: 600;
	letter-spacing: var(--wp--custom--tracking--wide);
	text-transform: uppercase;
	white-space: nowrap;
}

/* Round CNF News logo */
.tcnf-news-badge {
	flex: none;
	width: var(--wp--custom--size--icon-badge);
	height: var(--wp--custom--size--icon-badge);
	border-radius: 50%;
	box-shadow: var(--wp--preset--shadow--soft);
}

.tcnf-news-badge--sm {
	width: var(--wp--custom--size--news-badge-sm);
	height: var(--wp--custom--size--news-badge-sm);
}

/* ---- Stats: big numbers on glass ---------------------------------------- */
.tcnf-stats {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--wp--custom--grid);
	margin: 0;
}

.tcnf-stat {
	display: flex;
	flex-direction: column-reverse;
	justify-content: flex-end;
	gap: var(--wp--preset--spacing--20);
	padding: var(--wp--preset--spacing--50);
}

.tcnf-stat dt {
	color: var(--wp--custom--text--secondary);
	font-size: var(--wp--preset--font-size--small);
	line-height: var(--wp--custom--leading--snug);
}

.tcnf-stat dd {
	margin: 0;
	color: var(--wp--custom--text--primary);
	font-size: var(--wp--preset--font-size--stat-small);
	font-weight: 600;
	line-height: var(--wp--custom--leading--tight);
	letter-spacing: var(--wp--custom--tracking--tight);
	font-variant-numeric: tabular-nums;
}

.tcnf-stat--lg {
	grid-column: span 2;
}

.tcnf-stat--lg dd {
	font-size: var(--wp--preset--font-size--stat);
}

.tcnf-stat:last-child:nth-child(odd) {
	grid-column: span 2;
}

@media (min-width: 900px) {
	.tcnf-stat {
		padding: var(--wp--preset--spacing--60);
	}

	.tcnf-stat--lg {
		grid-column: span 1;
	}
}

/* ---- Accordion (details/summary) ---------------------------------------- */
.tcnf-accordion {
	display: grid;
	gap: var(--wp--preset--spacing--30);
}

.tcnf-accordion .tcnf-accordion__item {
	border-radius: var(--wp--custom--radius--lg);
}

.tcnf-accordion .tcnf-accordion__item[open] {
	border-color: var(--wp--custom--glass--border);
	background: var(--wp--preset--gradient--sheen), var(--wp--custom--glass--fill);
}

.tcnf-accordion__item[hidden] {
	display: none;
}

.tcnf-accordion__summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--40);
	padding: var(--wp--preset--spacing--50);
	color: var(--wp--custom--text--primary);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 600;
	line-height: var(--wp--custom--leading--snug);
	list-style: none;
	cursor: pointer;
}

.tcnf-accordion__summary::-webkit-details-marker {
	display: none;
}

.tcnf-accordion__summary:focus-visible {
	border-radius: var(--wp--custom--radius--lg);
}

.tcnf-accordion__icon {
	display: grid;
	place-items: center;
	flex: none;
	width: var(--wp--custom--size--control-sm);
	height: var(--wp--custom--size--control-sm);
	border: 1px solid var(--wp--custom--glass--border);
	border-radius: 50%;
	background: var(--wp--custom--glass--fill-subtle);
	color: var(--wp--custom--text--primary);
	transition:
		transform var(--wp--custom--duration--base) var(--wp--custom--ease--out),
		background-color var(--wp--custom--duration--base) var(--wp--custom--ease--out);
}

.tcnf-accordion__item[open] .tcnf-accordion__icon {
	transform: rotate(45deg);
	border-color: var(--wp--preset--color--accent);
	background: var(--wp--preset--color--accent);
	color: var(--wp--custom--text--on-accent);
}

.tcnf-accordion__body {
	display: grid;
	gap: var(--wp--preset--spacing--30);
	padding: 0 var(--wp--preset--spacing--50) var(--wp--preset--spacing--50);
	color: var(--wp--custom--text--secondary);
	animation: tcnf-accordion-in var(--wp--custom--duration--base) var(--wp--custom--ease--out);
}

.tcnf-accordion__body p {
	margin: 0;
}

@keyframes tcnf-accordion-in {
	from {
		opacity: 0;
		transform: translateY(calc(var(--wp--preset--spacing--20) * -1));
	}

	to {
		opacity: 1;
		transform: none;
	}
}

/* ---- Filter buttons ------------------------------------------------------ */
.tcnf-filter {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--20);
	margin-bottom: var(--wp--preset--spacing--50);
}

.tcnf-filter__btn {
	min-height: var(--wp--custom--size--control-sm);
	padding: 0 var(--wp--preset--spacing--40);
	border: 1px solid var(--wp--custom--glass--border);
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--custom--glass--fill-subtle);
	color: var(--wp--custom--text--secondary);
	font-family: inherit;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	cursor: pointer;
	transition:
		color var(--wp--custom--duration--fast) var(--wp--custom--ease--out),
		border-color var(--wp--custom--duration--fast) var(--wp--custom--ease--out),
		background-color var(--wp--custom--duration--fast) var(--wp--custom--ease--out);
}

.tcnf-filter__btn:hover {
	border-color: var(--wp--custom--glass--border-strong);
	color: var(--wp--custom--text--primary);
}

.tcnf-filter__btn[aria-pressed="true"] {
	border-color: var(--wp--preset--color--contrast);
	background: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
}

/* ---- Round glass icon button (slider arrows) ---------------------------- */
.tcnf-icon-btn {
	display: grid;
	place-items: center;
	flex: none;
	width: var(--wp--custom--size--control);
	height: var(--wp--custom--size--control);
	padding: 0;
	border: 1px solid var(--wp--custom--glass--border);
	border-radius: 50%;
	background: var(--wp--preset--gradient--sheen), var(--wp--custom--glass--fill);
	box-shadow: var(--wp--preset--shadow--soft), var(--wp--custom--inset-sheen);
	color: var(--wp--custom--text--primary);
	cursor: pointer;
	-webkit-backdrop-filter: blur(var(--wp--custom--glass--blur)) saturate(var(--wp--custom--glass--saturate));
	backdrop-filter: blur(var(--wp--custom--glass--blur)) saturate(var(--wp--custom--glass--saturate));
	transition:
		transform var(--wp--custom--duration--base) var(--wp--custom--ease--out),
		border-color var(--wp--custom--duration--base) var(--wp--custom--ease--out);
	--tcnf-glyph-size: var(--wp--custom--size--icon--md);
}

.tcnf-icon-btn:hover {
	border-color: var(--wp--custom--glass--border-strong);
	background: var(--wp--preset--gradient--sheen), var(--wp--custom--glass--fill-strong);
	transform: translateY(calc(var(--wp--custom--nudge) * -1));
}

/* ---- Contact list (address, phone, email) ------------------------------- */
.tcnf-contact-list {
	display: grid;
	gap: var(--wp--preset--spacing--40);
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: var(--wp--preset--font-size--small);
}

.tcnf-contact-list li {
	display: grid;
	grid-template-columns: var(--wp--custom--size--icon--sm) 1fr;
	gap: var(--wp--preset--spacing--30);
	margin: 0;
}

.tcnf-contact-list .tcnf-glyph {
	margin-top: var(--wp--custom--nudge);
	opacity: var(--wp--custom--opacity--soft);
}

.tcnf-contact-list a {
	color: inherit;
	text-decoration: none;
}

.tcnf-contact-list a:hover {
	color: var(--wp--custom--text--primary);
}

/* ---- Hidden text for screen readers ------------------------------------- */
.tcnf-visually-hidden {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* ---- Theme toggle (Theme Toggle block) ---------------------------------- */
/* Needs JavaScript to work, so it stays hidden without it */
.tcnf-theme-toggle-wrap {
	display: none;
	flex: none;
}

.tcnf-js .tcnf-theme-toggle-wrap,
.editor-styles-wrapper .tcnf-theme-toggle-wrap {
	display: inline-flex;
}

.tcnf-theme-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--wp--custom--size--control);
	height: var(--wp--custom--size--control);
	padding: 0;
	border: 1px solid var(--wp--custom--glass--border);
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--gradient--sheen), var(--wp--custom--glass--fill);
	color: var(--wp--custom--text--primary);
	box-shadow: var(--wp--preset--shadow--soft), var(--wp--custom--inset-sheen);
	-webkit-backdrop-filter: blur(var(--wp--custom--glass--blur)) saturate(var(--wp--custom--glass--saturate));
	backdrop-filter: blur(var(--wp--custom--glass--blur)) saturate(var(--wp--custom--glass--saturate));
	cursor: pointer;
	transition:
		transform var(--wp--custom--duration--base) var(--wp--custom--ease--out),
		background-color var(--wp--custom--duration--base) var(--wp--custom--ease--out),
		border-color var(--wp--custom--duration--base) var(--wp--custom--ease--out);
}

.tcnf-theme-toggle:hover {
	transform: translateY(calc(var(--wp--custom--nudge) * -1));
	background: var(--wp--preset--gradient--sheen), var(--wp--custom--glass--fill-strong);
	border-color: var(--wp--custom--glass--border-strong);
}

.tcnf-theme-toggle:focus-visible {
	border-radius: 50%;
	box-shadow: var(--wp--custom--focus-ring);
}

.tcnf-theme-toggle__icon {
	display: block;
	width: var(--wp--custom--size--icon--md);
	height: var(--wp--custom--size--icon--md);
	transition: transform var(--wp--custom--duration--base) var(--wp--custom--ease--out);
}

.tcnf-theme-toggle:hover .tcnf-theme-toggle__icon {
	transform: rotate(-20deg);
}

.tcnf-theme-toggle__icon--moon,
:root[data-theme="light"] .tcnf-theme-toggle__icon--sun {
	display: none;
}

:root[data-theme="light"] .tcnf-theme-toggle__icon--moon {
	display: block;
}

.tcnf-theme-toggle .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* ---- Gradient mesh background ------------------------------------------- */
/* Fixed layer of soft glowing orbs behind the whole page. In the light theme
   the same orbs turn into faint warm tints. */
.tcnf-mesh {
	position: fixed;
	inset: 0;
	z-index: var(--wp--custom--z--mesh);
	overflow: hidden;
	pointer-events: none;
	background: var(--wp--preset--color--base);
}

.tcnf-mesh__orb {
	position: absolute;
	border-radius: 50%;
	will-change: transform;
	animation: tcnf-orb-drift var(--wp--custom--duration--drift) var(--wp--custom--ease--in-out) infinite alternate;
}

.tcnf-mesh__orb--1 {
	top: -24vmax;
	right: -18vmax;
	width: 62vmax;
	height: 62vmax;
	background: radial-gradient(circle at center, var(--wp--custom--orb--deep-red) 0%, var(--wp--custom--orb--fade) 68%);
}

.tcnf-mesh__orb--2 {
	bottom: -26vmax;
	left: -20vmax;
	width: 54vmax;
	height: 54vmax;
	background: radial-gradient(circle at center, var(--wp--custom--orb--deep-red) 0%, var(--wp--custom--orb--fade) 66%);
	animation-delay: calc(var(--wp--custom--duration--drift) / -3);
}

.tcnf-mesh__orb--3 {
	top: 30%;
	left: 38%;
	width: 34vmax;
	height: 34vmax;
	background: radial-gradient(circle at center, var(--wp--custom--orb--cnf-red) 0%, var(--wp--custom--orb--fade) 70%);
	animation-duration: calc(var(--wp--custom--duration--drift) * 1.4);
	animation-delay: calc(var(--wp--custom--duration--drift) / -2);
}

.tcnf-mesh__orb--4 {
	top: 8%;
	left: -12vmax;
	width: 46vmax;
	height: 46vmax;
	background: radial-gradient(circle at center, var(--wp--custom--orb--marble) 0%, var(--wp--custom--orb--fade) 65%);
	animation-duration: calc(var(--wp--custom--duration--drift) * 1.2);
}

.tcnf-mesh__orb--5 {
	right: 6vmax;
	bottom: -10vmax;
	width: 40vmax;
	height: 40vmax;
	background: radial-gradient(circle at center, var(--wp--custom--orb--charcoal) 0%, var(--wp--custom--orb--fade) 70%);
	animation-delay: calc(var(--wp--custom--duration--drift) / -1.5);
}

.tcnf-mesh__grain {
	position: absolute;
	inset: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .6 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
	opacity: var(--wp--custom--orb--grain-opacity);
	mix-blend-mode: overlay;
}

@keyframes tcnf-orb-drift {
	0%   { transform: translate3d(0, 0, 0) scale(1); }
	50%  { transform: translate3d(4vw, 3vh, 0) scale(1.08); }
	100% { transform: translate3d(-3vw, 6vh, 0) scale(0.96); }
}

/* ---- Scroll reveal (only once the script is running) -------------------- */
.tcnf-js [data-reveal] {
	opacity: 0;
	transform: translate3d(0, var(--wp--preset--spacing--60), 0);
	transition:
		opacity var(--wp--custom--duration--reveal) var(--wp--custom--ease--out),
		transform var(--wp--custom--duration--reveal) var(--wp--custom--ease--out);
	transition-delay: var(--tcnf-reveal-delay, 0ms);
}

.tcnf-js [data-reveal].is-visible {
	opacity: 1;
	transform: none;
}

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

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}

	.tcnf-js [data-reveal] {
		opacity: 1;
		transform: none;
	}
}

/* ==========================================================================
   Light theme
   The theme toggle sets data-theme="light" on <html>. Marble page, Charcoal
   text, frosted white glass; red keeps the same job. The roles are rebuilt
   from the palette, so palette changes in Global Styles flow through.
   ========================================================================== */
:root {
	color-scheme: dark;
}

:root[data-theme="light"],
:root[data-theme="light"] body {
	color-scheme: light;

	--wp--preset--color--base: var(--wp--preset--color--marble);
	--wp--preset--color--contrast: var(--wp--preset--color--charcoal);
	--wp--preset--color--surface: var(--wp--preset--color--white);
	--wp--preset--color--highlight: var(--wp--preset--color--accent);

	--wp--custom--text--primary: var(--wp--preset--color--charcoal);
	--wp--custom--text--secondary: color-mix(in srgb, var(--wp--preset--color--charcoal) 80%, transparent);
	--wp--custom--text--tertiary: color-mix(in srgb, var(--wp--preset--color--charcoal) 70%, transparent);
	--wp--custom--text--meta: color-mix(in srgb, var(--wp--preset--color--charcoal) 66%, transparent);

	--wp--custom--scrim--base: color-mix(in srgb, var(--wp--preset--color--marble) 80%, transparent);
	--wp--custom--scrim--strong: color-mix(in srgb, var(--wp--preset--color--marble) 94%, transparent);

	--wp--custom--glass--fill: color-mix(in srgb, var(--wp--preset--color--white) 50%, transparent);
	--wp--custom--glass--fill-subtle: color-mix(in srgb, var(--wp--preset--color--white) 34%, transparent);
	--wp--custom--glass--fill-strong: color-mix(in srgb, var(--wp--preset--color--white) 70%, transparent);
	--wp--custom--glass--fill-header: color-mix(in srgb, var(--wp--preset--color--marble) 78%, transparent);
	--wp--custom--glass--fill-accent: color-mix(in srgb, var(--wp--preset--color--accent) 10%, transparent);
	--wp--custom--glass--border: color-mix(in srgb, var(--wp--preset--color--charcoal) 12%, transparent);
	--wp--custom--glass--border-subtle: color-mix(in srgb, var(--wp--preset--color--charcoal) 7%, transparent);
	--wp--custom--glass--border-strong: color-mix(in srgb, var(--wp--preset--color--charcoal) 24%, transparent);
	--wp--preset--gradient--sheen: linear-gradient(135deg, color-mix(in srgb, var(--wp--preset--color--white) 70%, transparent) 0%, color-mix(in srgb, var(--wp--preset--color--white) 0%, transparent) 42%);

	--wp--custom--inset-sheen: inset 0 1px 0 color-mix(in srgb, var(--wp--preset--color--white) 80%, transparent);
	--wp--custom--focus-ring: 0 0 0 3px color-mix(in srgb, var(--wp--preset--color--charcoal) 90%, transparent), 0 0 0 6px color-mix(in srgb, var(--wp--preset--color--accent) 80%, transparent);

	--wp--custom--orb--deep-red: color-mix(in srgb, var(--wp--preset--color--accent-deep) 12%, transparent);
	--wp--custom--orb--cnf-red: color-mix(in srgb, var(--wp--preset--color--accent) 10%, transparent);
	--wp--custom--orb--charcoal: color-mix(in srgb, var(--wp--preset--color--white) 90%, transparent);
	--wp--custom--orb--marble: color-mix(in srgb, var(--wp--preset--color--charcoal) 5%, transparent);
	--wp--custom--orb--fade: color-mix(in srgb, var(--wp--preset--color--marble) 0%, transparent);
	--wp--custom--orb--grain-opacity: 0.035;

	--wp--preset--shadow--glass: 0 8px 32px color-mix(in srgb, var(--wp--preset--color--charcoal) 8%, transparent);
	--wp--preset--shadow--float: 0 30px 70px -18px color-mix(in srgb, var(--wp--preset--color--charcoal) 28%, transparent);
	--wp--preset--shadow--soft: 0 4px 16px color-mix(in srgb, var(--wp--preset--color--charcoal) 8%, transparent);
	--wp--preset--shadow--glow: 0 12px 32px -12px color-mix(in srgb, var(--wp--preset--color--accent) 55%, transparent);
	--wp--preset--shadow--glow-strong: 0 16px 40px -10px color-mix(in srgb, var(--wp--preset--color--accent-hover) 60%, transparent);

	--wp--custom--text--outline: color-mix(in srgb, var(--wp--preset--color--charcoal) 36%, transparent);
	--wp--custom--accent-soft: color-mix(in srgb, var(--wp--preset--color--accent) 10%, transparent);
	--wp--custom--ambient-opacity: 0.3;
}

/* Blocks that sit on photos or red keep the dark roles in both themes.
   Add the class tcnf-theme-dark to the block. */
.tcnf-theme-dark {
	color-scheme: dark;
	color: var(--wp--custom--text--secondary);

	--wp--preset--color--base: var(--wp--preset--color--studio-black);
	--wp--preset--color--contrast: var(--wp--preset--color--marble);
	--wp--preset--color--surface: var(--wp--preset--color--charcoal);
	--wp--preset--color--highlight: var(--wp--preset--color--accent-hover);

	--wp--custom--text--primary: var(--wp--preset--color--marble);
	--wp--custom--text--secondary: color-mix(in srgb, var(--wp--preset--color--marble) 76%, transparent);
	--wp--custom--text--tertiary: color-mix(in srgb, var(--wp--preset--color--marble) 60%, transparent);
	--wp--custom--text--meta: var(--wp--preset--color--smoke);

	--wp--custom--scrim--base: color-mix(in srgb, var(--wp--preset--color--studio-black) 72%, transparent);
	--wp--custom--scrim--strong: color-mix(in srgb, var(--wp--preset--color--studio-black) 86%, transparent);

	--wp--custom--glass--fill: color-mix(in srgb, var(--wp--preset--color--marble) 12%, transparent);
	--wp--custom--glass--fill-subtle: color-mix(in srgb, var(--wp--preset--color--marble) 6%, transparent);
	--wp--custom--glass--fill-strong: color-mix(in srgb, var(--wp--preset--color--marble) 18%, transparent);
	--wp--custom--glass--fill-header: color-mix(in srgb, var(--wp--preset--color--studio-black) 42%, transparent);
	--wp--custom--glass--fill-accent: color-mix(in srgb, var(--wp--preset--color--accent) 22%, transparent);
	--wp--custom--glass--border: color-mix(in srgb, var(--wp--preset--color--marble) 24%, transparent);
	--wp--custom--glass--border-subtle: color-mix(in srgb, var(--wp--preset--color--marble) 12%, transparent);
	--wp--custom--glass--border-strong: color-mix(in srgb, var(--wp--preset--color--marble) 42%, transparent);
	--wp--preset--gradient--sheen: linear-gradient(135deg, color-mix(in srgb, var(--wp--preset--color--marble) 16%, transparent) 0%, color-mix(in srgb, var(--wp--preset--color--marble) 0%, transparent) 42%);

	--wp--custom--inset-sheen: inset 0 1px 0 color-mix(in srgb, var(--wp--preset--color--marble) 22%, transparent);
	--wp--custom--focus-ring: 0 0 0 3px color-mix(in srgb, var(--wp--preset--color--marble) 90%, transparent), 0 0 0 6px color-mix(in srgb, var(--wp--preset--color--accent) 80%, transparent);

	--wp--custom--text--outline: color-mix(in srgb, var(--wp--preset--color--marble) 42%, transparent);
	--wp--custom--accent-soft: color-mix(in srgb, var(--wp--preset--color--accent) 16%, transparent);
}