/*
Theme Name:   Tallyhouse (studio concept)
Theme URI:    https://tideframedigital.com/work/
Description:  Fictional small-business bookkeeping practice. A Tideframe Digital concept site built on GeneratePress. Ledger calm: graphite on cool paper with one lime highlighter.
Author:       Tideframe Digital
Template:     generatepress
Version:      1.0.0
Requires PHP: 8.1
Text Domain:  tallyhouse
License:      GPL-2.0-or-later
*/

/* ============================================================ 1. Tokens */
:root {
	--th-ink: #1a2024;
	--th-slate: #434c52;
	--th-muted: #626b70;
	--th-paper: #f4f5f3;
	--th-white: #fff;
	--th-mist: #e7eae8;
	--th-lime: #d7f25c;
	--th-lime-wash: #eef7c9;
	--th-moss: #4d5e12;
	--th-rule: #c9cfcb;

	--th-ease: cubic-bezier(.2, .7, .2, 1);
	--th-ease-out: cubic-bezier(.16, 1, .3, 1);
	--th-section: clamp(64px, 8vw, 128px);
	--th-wrap: 1200px;
	--th-r-sm: 4px;
	--th-r-md: 10px;
	--th-r-lg: 16px;
	--th-lift: 0 14px 32px -18px rgb(21 35 43 / .28);

	/* Base contract */
	--tf-color-bg: var(--th-paper);
	--tf-color-surface: var(--th-white);
	--tf-color-text: var(--th-slate);
	--tf-color-muted: var(--th-muted);
	--tf-color-primary: var(--th-ink);
	--tf-color-on-primary: var(--th-lime);
	--tf-color-accent: var(--th-moss);
	--tf-color-border: var(--th-rule);
	--tf-color-focus: var(--th-ink);
	--tf-color-bar-bg: var(--th-ink);
	--tf-color-bar-text: var(--th-paper);
	--tf-font-body: "Instrument Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--tf-font-display: var(--tf-font-body);
	--tf-font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
	--tf-radius-s: 4px;
	--tf-radius-m: 10px;
	--tf-radius-l: 16px;
	--tf-container: 1200px;
	--tf-gutter: clamp(16px, 2.4vw, 24px);
	--tf-header-height: 4.25rem;
	--tf-bar-height: 2rem;
	--tf-focus-width: 2px;
	--tf-focus-offset: 2px;
	--tf-ease: var(--th-ease);
	--tf-ease-out: var(--th-ease-out);
	--tf-dur-fast: 150ms;
	--tf-dur-base: 420ms;
	--tf-dur-slow: 700ms;
	--tf-reveal-distance: 16px;
	--tf-stagger: 60ms;
	--tf-marquee-duration: 60s;
	--tf-shadow-m: var(--th-lift);

	--th-angle: 0deg;
}

html { scroll-padding-top: 6rem; }
body.th-checklist-page { scroll-padding-top: 11rem; }

/* ============================================================== 2. Base */
body {
	background: var(--th-paper);
	color: var(--th-slate);
	font-family: var(--tf-font-body);
	font-size: 1.0625rem;
	line-height: 1.6;
	font-stretch: 100%;
	-webkit-font-smoothing: antialiased;
	overflow-x: clip;
}
h1, h2, h3, h4 {
	font-family: var(--tf-font-display);
	font-stretch: 92%;
	font-weight: 640;
	color: var(--th-ink);
	letter-spacing: -.015em;
	text-wrap: balance;
}
h1 { font-size: clamp(2.2rem, 1.6rem + 2.6vw, 3.6rem); line-height: 1.06; letter-spacing: -.02em; margin: 0 0 .5em; }
h2 { font-size: clamp(1.75rem, 1.4rem + 1.5vw, 2.6rem); line-height: 1.12; margin: 0 0 .5em; }
h3 { font-size: 1.375rem; line-height: 1.25; margin: 0 0 .4em; }
h4 { font-size: 1rem; line-height: 1.3; margin: 0 0 .4em; }
p { margin: 0 0 1.1em; }
::selection { background: var(--th-lime); color: var(--th-ink); }
.th-mono, .th-eyebrow, .th-chip, .th-tag, .th-btn--sm, .th-toggle, .th-ref {
	font-family: var(--tf-font-mono);
	font-variant-numeric: tabular-nums;
}

/* Links: ink text with an ink underline; a lime highlighter band fills in on hover. */
.entry-content a:not(.wp-block-button__link):not(.th-btn),
.th-prose a, .th-notice a, .site-info a, .th-footer a {
	color: var(--th-ink);
	text-decoration: underline;
	text-decoration-thickness: 1.5px;
	text-underline-offset: .18em;
	background: linear-gradient(var(--th-lime), var(--th-lime)) 0 100% / 100% 0 no-repeat;
	transition: background-size var(--tf-dur-fast) var(--th-ease);
}
.entry-content a:not(.wp-block-button__link):not(.th-btn):hover,
.th-prose a:hover, .th-notice a:hover { background-size: 100% .5em; }

:focus-visible { outline: 2px solid var(--th-ink); outline-offset: 2px; }
.th-on-ink :focus-visible, .th-footer :focus-visible, .tf-concept-bar :focus-visible, .th-cta :focus-visible { outline-color: var(--th-lime); }

/* GeneratePress containers: sections run full width. */
.site-content .content-area { width: 100%; }
.separate-containers .inside-article, .one-container .site-content { padding: 0; background: transparent; }
.separate-containers .site-main > * { margin: 0; }
.entry-content > * { margin-block: 0; }
.site-main, .inside-article, .entry-content { margin: 0 !important; }
.site-content { display: block; }
.entry-content > .wp-block-group { max-width: none; }
.th-wrap { max-width: var(--th-wrap); margin-inline: auto; padding-inline: var(--tf-gutter); }
.th-section { padding-block: var(--th-section); position: relative; }
.th-section--mist { background: var(--th-mist); }
.th-section--white { background: var(--th-white); }
.th-section--tight { padding-block: clamp(40px, 5vw, 72px); }
.th-section--ink { background: var(--th-ink); color: #d5dad7; }
.th-section--ink h2, .th-section--ink h3, .th-section--ink h4 { color: var(--th-paper); }
.th-section--ink a { color: var(--th-lime); }
.th-prose { max-width: 68ch; }
.th-prose h2 { margin-top: 1.6em; font-size: clamp(1.5rem, 1.3rem + 1vw, 2rem); }
.th-prose ul, .th-prose ol { padding-left: 1.2em; margin: 0 0 1.2em; }
.th-lead { font-size: 1.25rem; line-height: 1.5; color: var(--th-slate); max-width: 56ch; }

/* Mono eyebrow with a lime marker */
.th-eyebrow {
	display: inline-flex; align-items: center; gap: .6em;
	font-size: .8125rem; font-weight: 600; line-height: 1.4;
	letter-spacing: .08em; text-transform: uppercase;
	color: var(--th-muted); margin: 0 0 1em;
}
.th-eyebrow::before { content: ""; width: .6em; height: .6em; background: var(--th-lime); box-shadow: 0 0 0 1px var(--th-ink); border-radius: 1px; }
.th-on-ink .th-eyebrow, .th-section--ink .th-eyebrow, .th-cta .th-eyebrow { color: #aeb7b2; }
.th-on-ink .th-eyebrow::before, .th-section--ink .th-eyebrow::before, .th-cta .th-eyebrow::before { box-shadow: none; }

/* Highlighter: the one accent. Ink text sits on top of the lime. */
h1 em, h2 em, .th-hl {
	font-style: normal; color: var(--th-ink);
	background-image: linear-gradient(var(--th-lime), var(--th-lime));
	background-repeat: no-repeat; background-position: 0 88%; background-size: 100% .4em;
	padding-inline: .05em; margin-inline: -.05em;
	-webkit-box-decoration-break: clone; box-decoration-break: clone;
}

/* Ledger grid: faint column lines behind a section, drawn in on load. */
.th-ledger-grid { position: relative; isolation: isolate; }
.th-ledger-grid::before {
	content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	max-width: var(--th-wrap); margin-inline: auto; width: calc(100% - 2 * var(--tf-gutter));
	background-image: repeating-linear-gradient(90deg, rgb(201 207 203 / .55) 0 1px, transparent 1px calc(100% / 6));
	border-right: 1px solid rgb(201 207 203 / .55);
	-webkit-mask-image: linear-gradient(#000 40%, transparent);
	mask-image: linear-gradient(#000 40%, transparent);
}

/* ====================================================== 3. Header and nav */
.site-header {
	background: color-mix(in srgb, var(--th-paper) 90%, transparent);
	-webkit-backdrop-filter: saturate(1.2) blur(10px);
	backdrop-filter: saturate(1.2) blur(10px);
	border-bottom: 1px solid transparent;
	transition: border-color var(--tf-dur-base) var(--th-ease);
	view-transition-name: th-header;
}
.site-header.is-scrolled { border-bottom-color: var(--th-rule); }
.inside-header { padding: 0 var(--tf-gutter); max-width: var(--th-wrap); margin-inline: auto; min-height: var(--tf-header-height); align-items: center; }
.site-branding-container, .site-branding { margin: 0; }
.th-logo { margin: 0; font-size: 1.375rem; line-height: 1; }
.th-logo a {
	display: inline-flex; align-items: center; gap: .55rem;
	color: var(--th-ink); text-decoration: none;
	font-weight: 650; font-stretch: 92%; letter-spacing: -.02em;
	transform-origin: left center; transition: transform var(--tf-dur-base) var(--th-ease);
}
.site-header.is-scrolled .th-logo a { transform: scale(.92); }
.th-logo__mark { width: 28px; height: 28px; flex: none; color: var(--th-ink); }
.th-logo__mark path { fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-dasharray: 1; }
.th-logo__mark .th-logo__cross { stroke: var(--th-moss); }
.th-logo__word { display: inline-block; }
.main-navigation, .main-navigation ul ul { background: transparent; }
.main-navigation .main-nav ul li a {
	font-size: .9375rem; font-weight: 500; color: var(--th-ink);
	line-height: 44px; padding-inline: 14px; position: relative;
}
.main-navigation .main-nav ul li:not(.th-nav-cta) > a::after {
	content: ""; position: absolute; left: 14px; right: 14px; bottom: 9px; height: 3px; background: var(--th-lime);
	transform: scaleX(0); transform-origin: 0 50%; transition: transform var(--tf-dur-base) var(--th-ease);
}
.main-navigation .main-nav ul li:not(.th-nav-cta) > a:hover::after,
.main-navigation .main-nav ul li[class*="current-menu-"]:not(.th-nav-cta) > a::after { transform: scaleX(1); }
.main-navigation .main-nav ul li a:hover, .main-navigation .main-nav ul li[class*="current-menu-"] > a { color: var(--th-ink); background: transparent; }
.main-navigation .main-nav ul li.th-nav-cta > a {
	background: var(--th-ink); color: var(--th-lime); border-radius: var(--th-r-md);
	line-height: 44px; margin-left: 8px; padding-inline: 20px; font-weight: 600;
	transition: background-color var(--tf-dur-fast), color var(--tf-dur-fast);
}
.main-navigation .main-nav ul li.th-nav-cta > a:hover { background: var(--th-lime); color: var(--th-ink); box-shadow: inset 0 0 0 1.5px var(--th-ink); }
.menu-toggle { color: var(--th-ink); font-family: var(--tf-font-mono); font-size: .8125rem; letter-spacing: .08em; text-transform: uppercase; min-height: 44px; }
.menu-toggle:hover, .menu-toggle:focus { background: transparent; color: var(--th-ink); }
.th-sentinel { position: absolute; top: 0; left: 0; width: 1px; height: 48px; pointer-events: none; }
.tf-concept-bar { font-family: var(--tf-font-mono); font-size: .8125rem; view-transition-name: th-bar; }
.tf-concept-bar__link { color: var(--th-lime); }
.tf-concept-bar__detail { color: #c4cbc7; }
main#main, .site-main { view-transition-name: th-main; }

@media (max-width: 768px) {
	.inside-header { min-height: 3.75rem; }
	.main-navigation, .main-navigation .inside-navigation { position: static; }
	.main-navigation.toggled .main-nav > ul {
		position: absolute; left: 0; right: 0; top: 100%;
		height: calc(100dvh - var(--tf-header-height) - var(--tf-bar-height));
		background: var(--th-paper); padding: 1rem var(--tf-gutter) 2rem; overflow-y: auto;
		border-top: 1px solid var(--th-rule);
	}
	.main-navigation.toggled .main-nav ul li a { font-size: 1.75rem; font-weight: 600; font-stretch: 92%; letter-spacing: -.02em; line-height: 1.2; padding: .6rem 0; }
	.main-navigation .main-nav ul li:not(.th-nav-cta) > a::after { left: 0; right: auto; width: 2.5rem; bottom: 4px; }
	.main-navigation .main-nav ul li.th-nav-cta > a { margin: 1rem 0 0; display: inline-block; font-size: 1.125rem; }
	.main-navigation.toggled .main-nav ul li { border-bottom: 1px solid var(--th-rule); }
	.main-navigation.toggled .main-nav ul li.th-nav-cta { border: 0; }
}
@media (max-width: 768px) and (prefers-reduced-motion: no-preference) {
	.main-navigation.toggled .main-nav > ul > li { animation: th-menu-in .45s var(--th-ease-out) both; }
	.main-navigation.toggled .main-nav > ul > li:nth-child(2) { animation-delay: 40ms; }
	.main-navigation.toggled .main-nav > ul > li:nth-child(3) { animation-delay: 80ms; }
	.main-navigation.toggled .main-nav > ul > li:nth-child(4) { animation-delay: 120ms; }
	.main-navigation.toggled .main-nav > ul > li:nth-child(5) { animation-delay: 160ms; }
	.main-navigation.toggled .main-nav > ul > li:nth-child(6) { animation-delay: 200ms; }
	.main-navigation.toggled .main-nav > ul > li:nth-child(7) { animation-delay: 240ms; }
}
@keyframes th-menu-in { from { opacity: 0; transform: translateY(8px); } }

/* Tally-mark glyph draws once on first load. */
@media (prefers-reduced-motion: no-preference) {
	.th-logo__mark path { animation: th-draw .55s var(--th-ease-out) both; }
	.th-logo__mark path:nth-child(2) { animation-delay: .08s; }
	.th-logo__mark path:nth-child(3) { animation-delay: .16s; }
	.th-logo__mark path:nth-child(4) { animation-delay: .24s; }
	.th-logo__mark path:nth-child(5) { animation-delay: .4s; }
}
@keyframes th-draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }

/* ============================================================ 4. Buttons */
.wp-block-buttons { gap: 12px; margin: 0 0 1em; }
.wp-block-button__link, .th-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .5em;
	min-height: 44px; padding: 0 1.35rem; border-radius: var(--th-r-md);
	font-family: var(--tf-font-body); font-size: 1rem; font-weight: 600; line-height: 1.2;
	text-decoration: none; cursor: pointer; border: 1.5px solid var(--th-ink);
	background-repeat: no-repeat; background-position: 0 50%; background-size: 0% 100%;
	transition: background-size var(--tf-dur-base) var(--th-ease), color var(--tf-dur-base) var(--th-ease), transform var(--tf-dur-fast);
}
.wp-block-button.is-style-th-primary .wp-block-button__link, .wp-block-button:not([class*="is-style-"]) .wp-block-button__link, .th-btn {
	background-color: var(--th-ink); color: var(--th-lime);
	background-image: linear-gradient(var(--th-lime), var(--th-lime));
}
.wp-block-button.is-style-th-primary .wp-block-button__link:hover, .wp-block-button:not([class*="is-style-"]) .wp-block-button__link:hover, .th-btn:hover { background-size: 100% 100%; color: var(--th-ink); }
.wp-block-button.is-style-th-ghost .wp-block-button__link, .th-btn--ghost {
	background-color: var(--th-white); color: var(--th-ink);
	background-image: linear-gradient(var(--th-lime), var(--th-lime));
}
.wp-block-button.is-style-th-ghost .wp-block-button__link:hover, .th-btn--ghost:hover { background-size: 100% 100%; color: var(--th-ink); }
.wp-block-button.is-style-th-lime .wp-block-button__link, .th-btn--lime {
	background-color: var(--th-lime); color: var(--th-ink); border-color: var(--th-lime);
	background-image: linear-gradient(var(--th-white), var(--th-white));
}
.wp-block-button.is-style-th-lime .wp-block-button__link:hover, .th-btn--lime:hover { background-size: 100% 100%; color: var(--th-ink); }
.wp-block-button.is-style-th-link .wp-block-button__link {
	background: none; border-color: transparent; color: var(--th-ink); padding-inline: .25rem; text-decoration: underline; text-underline-offset: .2em; text-decoration-thickness: 1.5px;
}
.wp-block-button__link:active, .th-btn:active { transform: translateY(1px); }
.th-btn--sm { min-height: 36px; padding: 0 .9rem; font-size: .8125rem; letter-spacing: .04em; }
.th-btn[disabled] { opacity: .5; cursor: not-allowed; }

/* ================================================== 5. Chips, cards, notice */
.th-chip, .th-tag {
	display: inline-flex; align-items: center; gap: .4em; padding: .25em .75em;
	border: 1px solid var(--th-muted); border-radius: 999px;
	font-size: .75rem; font-weight: 600; line-height: 1.4; letter-spacing: .06em; text-transform: uppercase;
	color: var(--th-slate); background: transparent; text-decoration: none;
}
.th-chip--lime { background: var(--th-lime-wash); border-color: var(--th-moss); color: var(--th-ink); }
.th-tag { border-radius: var(--th-r-sm); border-style: dashed; text-transform: none; letter-spacing: 0; }
a.th-chip:hover, a.th-chip[aria-current="page"] { background: var(--th-ink); border-color: var(--th-ink); color: var(--th-lime); }
.th-card {
	background: var(--th-white); border: 1px solid var(--th-rule); border-radius: var(--th-r-md);
	transition: transform var(--tf-dur-fast) var(--th-ease), box-shadow var(--tf-dur-fast) var(--th-ease), border-color var(--tf-dur-fast);
}
.th-card:hover, .th-card:focus-within { transform: translateY(-4px); box-shadow: var(--th-lift); border-color: var(--th-muted); }

.th-notice, .tf-demo-notice {
	display: flex; gap: .75rem; align-items: flex-start;
	margin: 0 0 1.5rem; padding: .85rem 1.1rem;
	background: var(--th-lime-wash); color: var(--th-ink);
	border: 1px solid var(--th-moss); border-left-width: 4px; border-radius: var(--th-r-sm);
	font-size: .9375rem; line-height: 1.5;
}
.tf-demo-notice__icon { background: var(--th-ink); color: var(--th-lime); }
.th-notice p, .tf-demo-notice p { margin: 0; }
.th-notice::before {
	content: "i"; flex: none; display: grid; place-items: center; width: 1.25rem; height: 1.25rem; margin-top: .1rem;
	border-radius: 50%; background: var(--th-ink); color: var(--th-lime);
	font: italic 700 .8rem/1 var(--tf-font-body);
}
.th-notice--plain::before { display: none; }

/* Tick and cross lists */
.th-ticks { list-style: none; margin: 0 0 1.2em; padding: 0; }
.th-ticks li { display: flex; gap: .65rem; align-items: flex-start; padding: .45rem 0; border-top: 1px solid var(--th-rule); }
.th-ticks li:last-child { border-bottom: 1px solid var(--th-rule); }
.th-ticks--plain li { border: 0; padding-block: .25rem; }
.th-tick, .th-cross { width: 1.25rem; height: 1.25rem; flex: none; margin-top: .22rem; color: var(--th-moss); }
.th-tick path, .th-cross path { fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; }
.th-cross { color: var(--th-muted); }
.th-section--ink .th-tick, .th-on-ink .th-tick { color: var(--th-lime); }

/* Reveal-state tick draw: ticks complete once their section is in view. */
@media (prefers-reduced-motion: no-preference) {
	.tf-js [data-reveal]:not(.is-in) .th-tick path { stroke-dashoffset: 1; }
	.tf-js [data-reveal].is-in .th-tick path { animation: th-draw .3s var(--th-ease-out) both; animation-delay: calc(var(--i, 0) * 120ms + 200ms); }
}

/* ========================================================== 6. Page hero */
.th-page-hero { padding-block: clamp(40px, 6vw, 88px) clamp(40px, 5vw, 72px); }
.th-page-hero .th-split { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(24px, 4vw, 64px); align-items: center; }
.th-page-hero .wp-block-image { margin: 0; }
.th-page-hero .wp-block-image img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--th-r-lg); display: block; }
.th-page-hero .th-lede { font-size: 1.1875rem; max-width: 52ch; }
.th-lede { font-size: 1.1875rem; max-width: 52ch; }
.th-frame { margin: 0; position: relative; }
.th-frame img { border-radius: var(--th-r-lg); }
@media (max-width: 860px) { .th-page-hero .th-split { grid-template-columns: 1fr; } }

@media (prefers-reduced-motion: no-preference) {
	.th-rise { animation: th-rise .7s var(--th-ease-out) both; }
	.th-rise--2 { animation-delay: .08s; }
	.th-rise--3 { animation-delay: .16s; }
	.th-page-hero h1 em, .th-hero h1 em { animation: th-hl 1s .55s var(--th-ease-out) both; }
	.th-ledger-grid::before { animation: th-grid-draw 1.4s var(--th-ease-out) both; }
	.th-wipe img { animation: th-wipe .9s var(--th-ease-out) both; }
}
@keyframes th-rise { from { transform: translateY(14px); } }
@keyframes th-hl { from { background-size: 0 .4em; } }
@keyframes th-grid-draw { from { clip-path: inset(0 0 100% 0); } to { clip-path: inset(0); } }
@keyframes th-wipe { from { clip-path: inset(0 0 100% 0); } to { clip-path: inset(0); } }
@supports (animation-timeline: view()) {
	@media (prefers-reduced-motion: no-preference) {
		.entry-content h2 em { animation: th-hl linear both; animation-timeline: view(); animation-range: entry 25% entry 85%; }
	}
}

/* ================================================================ 7. Home hero */
.th-hero { padding-block: clamp(32px, 5vw, 80px) clamp(48px, 6vw, 96px); overflow: clip; }
.th-hero__grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(24px, 4vw, 64px); align-items: center; }
.th-hero h1 { font-size: clamp(2.6rem, 1.7rem + 3.8vw, 4.75rem); line-height: 1.02; letter-spacing: -.02em; margin-bottom: .45em; }
.th-line { display: block; overflow: hidden; padding-bottom: .08em; margin-bottom: -.08em; }
.th-line > span { display: block; }
@media (prefers-reduced-motion: no-preference) {
	.th-line > span { animation: th-line-up .8s var(--th-ease-out) both; }
	.th-line:nth-child(2) > span { animation-delay: .07s; }
	.th-line:nth-child(3) > span { animation-delay: .14s; }
}
@keyframes th-line-up { from { transform: translateY(105%); } }
.th-hero__lede { font-size: 1.1875rem; max-width: 50ch; }
.th-hero__media { position: relative; padding: 0 0 clamp(56px, 8vw, 96px) clamp(0px, 4vw, 48px); }
.th-hero__media .wp-block-image { margin: 0; overflow: hidden; border-radius: var(--th-r-lg); aspect-ratio: 4 / 3; background: var(--th-mist); }
.th-hero__media .wp-block-image img { width: 100%; height: 100%; object-fit: cover; display: block; transform: scale(1.12); }
.th-hero__media .th-ledger { position: absolute; left: 0; bottom: 0; width: min(78%, 360px); }
@supports (animation-timeline: view()) {
	@media (prefers-reduced-motion: no-preference) {
		.th-hero__media .wp-block-image img { animation: th-parallax linear both; animation-timeline: view(); animation-range: exit 0% exit 100%; }
	}
}
@keyframes th-parallax { from { transform: scale(1.12) translateY(0); } to { transform: scale(1.12) translateY(-40px); } }
@media (max-width: 860px) {
	.th-hero__grid { grid-template-columns: 1fr; }
	.th-hero__media { padding-left: 0; }
	.th-hero__media .th-ledger { width: min(86%, 340px); }
}

/* Ledger card illustration (HTML and CSS, not a screenshot) */
.th-ledger {
	position: relative; margin: 0; background: var(--th-white); border: 1px solid var(--th-ink); border-radius: var(--th-r-md);
	box-shadow: 8px 8px 0 -1px var(--th-mist), 8px 8px 0 0 var(--th-rule);
	font-size: .875rem; color: var(--th-ink);
}
.th-ledger__head, .th-ledger__foot { display: flex; justify-content: space-between; gap: 1rem; padding: .7rem 1rem; font-family: var(--tf-font-mono); font-size: .75rem; letter-spacing: .06em; text-transform: uppercase; color: var(--th-muted); }
.th-ledger__head { border-bottom: 1px solid var(--th-ink); }
.th-ledger__head strong { color: var(--th-ink); font-weight: 600; }
.th-ledger__rows { list-style: none; margin: 0; padding: 0; }
.th-ledger__rows li {
	display: grid; grid-template-columns: 1.5rem 1fr auto; align-items: center; gap: .7rem; padding: .62rem 1rem;
	border-bottom: 1px solid var(--th-rule); position: relative;
}
.th-ledger__rows li::after { content: ""; position: absolute; inset: 0; background: var(--th-lime-wash); z-index: 0; opacity: 0; }
.th-ledger__rows li > * { position: relative; z-index: 1; }
.th-ledger__rows .th-tick { margin: 0; width: 1.25rem; height: 1.25rem; }
.th-ledger__rows .th-ref { font-size: .75rem; color: var(--th-muted); }
.th-box { width: 1.05rem; height: 1.05rem; border: 1.5px dashed var(--th-muted); border-radius: 3px; justify-self: center; }
.th-ledger__foot { align-items: center; }
.th-ledger__bar { flex: 1; max-width: 8rem; height: 4px; background: var(--th-mist); border-radius: 2px; overflow: hidden; }
.th-ledger__bar i { display: block; height: 100%; background: var(--th-ink); transform-origin: 0 50%; }
@media (prefers-reduced-motion: no-preference) {
	.th-ledger { animation: th-rise .8s .3s var(--th-ease-out) both; }
	.th-ledger__rows .th-tick path { animation: th-draw .35s var(--th-ease-out) both; animation-delay: calc(var(--i, 0) * 140ms + 1s); }
	.th-ledger__rows li::after { animation: th-wash 1.6s var(--th-ease) both; animation-delay: calc(var(--i, 0) * 140ms + 1s); }
	.th-ledger__bar i { animation: th-fill 1s 1s var(--th-ease-out) both; }
	.th-ledger--wobble .is-open { animation: th-wobble .9s 1.2s var(--th-ease) 1 both; }
}
@keyframes th-wash { 0% { opacity: 0; } 20% { opacity: 1; } 100% { opacity: 0; } }
@keyframes th-fill { from { transform: scaleX(0); } }
@keyframes th-wobble { 0%, 100% { transform: translateX(0); } 20% { transform: translateX(-6px); } 45% { transform: translateX(5px); } 70% { transform: translateX(-3px); } }

/* Concept strip */
.th-strip { background: var(--th-lime-wash); border-block: 1px solid var(--th-rule); }
.th-strip p { margin: 0; padding: .8rem 0; font-size: .9375rem; color: var(--th-ink); display: flex; flex-wrap: wrap; gap: .25rem 1rem; align-items: center; justify-content: center; text-align: center; }
.th-strip .th-mono { font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; }

/* ============================================================ 8. Section heads */
.th-head { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem clamp(24px, 4vw, 64px); align-items: end; margin-bottom: clamp(28px, 4vw, 56px); }
.th-head > p:last-child { margin: 0; max-width: 52ch; }
.th-head h2 { margin: 0; }
@media (max-width: 860px) { .th-head { grid-template-columns: 1fr; } }

/* ============================================================ 9. Services */
.th-services {
	list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr);
	border-top: 1px solid var(--th-ink); position: relative;
}
.th-services > li { background: var(--th-white); border-right: 1px solid var(--th-rule); border-bottom: 1px solid var(--th-rule); margin: 0; }
.th-services > li:nth-child(3n) { border-right: 0; }
.th-service-card { transition: background-color var(--tf-dur-fast), transform var(--tf-dur-fast) var(--th-ease), box-shadow var(--tf-dur-fast); position: relative; }
.th-service-card:hover, .th-service-card:focus-within { transform: translateY(-4px); box-shadow: var(--th-lift); z-index: 2; background: var(--th-white); }
.th-service-card a { display: grid; gap: .75rem; padding: clamp(20px, 2.5vw, 32px); height: 100%; color: inherit; text-decoration: none; background: none; align-content: start; }
.th-service-card__top { display: flex; justify-content: space-between; align-items: center; }
.th-icon { width: 2rem; height: 2rem; color: var(--th-ink); }
.th-icon * { fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.th-service-card h3 { margin: 0; }
.th-service-card p { margin: 0; color: var(--th-slate); }
.th-service-card__more { font-family: var(--tf-font-mono); font-size: .8125rem; letter-spacing: .04em; color: var(--th-ink); display: inline-flex; gap: .4em; align-items: center; margin-top: .25rem; }
.th-service-card__more::after { content: "\2192"; transition: transform var(--tf-dur-fast) var(--th-ease); }
.th-service-card:hover .th-service-card__more::after { transform: translateX(4px); }
@media (prefers-reduced-motion: no-preference) {
	.tf-js .th-services[data-reveal]::before { content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 1px; background: var(--th-lime); box-shadow: 0 0 0 .5px var(--th-ink); transform-origin: 0 50%; transition: transform 1.1s var(--th-ease-out); }
	.tf-js .th-services[data-reveal]:not(.is-in)::before { transform: scaleX(0); }
}
@media (max-width: 900px) {
	.th-services { grid-template-columns: repeat(2, 1fr); }
	.th-services > li:nth-child(3n) { border-right: 1px solid var(--th-rule); }
	.th-services > li:nth-child(2n) { border-right: 0; }
}
@media (max-width: 600px) { .th-services { grid-template-columns: 1fr; } .th-services > li { border-right: 0 !important; } }

/* Services page: sticky index plus detailed sections */
.th-svc-layout { display: grid; grid-template-columns: 220px 1fr; gap: clamp(24px, 5vw, 72px); align-items: start; }
.th-anchor-index { position: sticky; top: calc(var(--tf-header-height) + 1.5rem); }
.th-anchor-index ol { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--th-rule); }
.th-anchor-index a { display: block; padding: .5rem 0 .5rem 1rem; margin-left: -1px; border-left: 3px solid transparent; color: var(--th-slate); text-decoration: none; font-size: .9375rem; background: none; }
.th-anchor-index a:hover { color: var(--th-ink); }
.th-anchor-index a[aria-current="true"] { border-left-color: var(--th-ink); background: linear-gradient(90deg, var(--th-lime-wash), transparent); color: var(--th-ink); font-weight: 600; }
.th-svc { padding-block: clamp(28px, 4vw, 56px); border-top: 1px solid var(--th-ink); }
.th-svc:first-child { padding-top: 0; border-top: 0; }
.th-svc__head { display: flex; align-items: center; gap: 1rem; margin-bottom: 1rem; }
.th-svc__num { font-family: var(--tf-font-mono); font-size: .875rem; color: var(--th-muted); }
.th-svc h2 { font-size: clamp(1.6rem, 1.3rem + 1.2vw, 2.25rem); margin-bottom: .3em; }
.th-svc__cols { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem clamp(20px, 3vw, 48px); margin-top: 1.5rem; }
.th-svc__cols h3 { font-family: var(--tf-font-mono); font-size: .8125rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--th-muted); margin-bottom: .6rem; }
.th-svc__who { color: var(--th-ink); }
.th-boundary-note { margin: 1.25rem 0 0; padding: .8rem 1rem; background: var(--th-lime-wash); border-left: 4px solid var(--th-moss); border-radius: var(--th-r-sm); font-size: .9375rem; color: var(--th-ink); }
.th-boundary-note .th-mono { display: block; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: var(--th-moss); margin-bottom: .2rem; }
@media (prefers-reduced-motion: no-preference) {
	.tf-js .th-svc[data-reveal] { transition-duration: var(--tf-dur-base); }
}
@media (max-width: 900px) {
	.th-svc-layout { grid-template-columns: 1fr; }
	.th-anchor-index { position: static; }
	.th-anchor-index ol { display: flex; flex-wrap: wrap; gap: .5rem; border: 0; }
	.th-anchor-index a { border: 1px solid var(--th-rule); border-radius: 999px; padding: .35rem .85rem; margin: 0; font-size: .875rem; }
	.th-anchor-index a[aria-current="true"] { border-color: var(--th-ink); }
	.th-svc__cols { grid-template-columns: 1fr; }
}

/* ============================================================ 10. Marquee */
.th-marquee-band { background: var(--th-mist); border-block: 1px solid var(--th-rule); padding: 1.1rem 0; position: relative; }
.th-marquee-band .tf-marquee { -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 88%, transparent); mask-image: linear-gradient(90deg, transparent, #000 6%, #000 88%, transparent); padding-right: 0; }
.th-marquee-band .tf-marquee__track { --tf-marquee-gap: 1.75rem; align-items: center; font-family: var(--tf-font-mono); font-size: .9375rem; color: var(--th-ink); letter-spacing: .02em; text-transform: uppercase; }
.th-marquee-band .tf-marquee__track li { display: inline-flex; align-items: center; gap: 1.75rem; white-space: nowrap; margin: 0; }
.th-marquee-band .tf-marquee__track li::after { content: ""; width: .9rem; height: .5rem; border-left: 2px solid var(--th-moss); border-bottom: 2px solid var(--th-moss); transform: rotate(-45deg) translateY(-2px); flex: none; }
.th-marquee-band .tf-marquee__toggle {
	position: static; margin: .75rem var(--tf-gutter) 0 auto; display: flex; background: var(--th-white); color: var(--th-ink);
	border: 1.5px solid var(--th-ink); min-height: 32px; font-family: var(--tf-font-mono); font-size: .75rem; letter-spacing: .04em;
}
.th-marquee-band .tf-marquee__toggle[aria-pressed="true"] { background: var(--th-ink); color: var(--th-lime); }
.th-marquee-band .tf-marquee { display: flex; flex-direction: column; }
.th-marquee-band .tf-marquee__inner { width: max-content; }
@media (prefers-reduced-motion: reduce) {
	.th-marquee-band .tf-marquee { -webkit-mask-image: none; mask-image: none; }
	.th-marquee-band .tf-marquee__track { padding-inline: var(--tf-gutter); max-width: var(--th-wrap); margin-inline: auto; }
}

/* ===================================================== 11. Packages */
.th-toggle { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-bottom: 1.75rem; font-size: .8125rem; letter-spacing: .06em; text-transform: uppercase; color: var(--th-muted); }
.th-toggle button {
	font: inherit; min-height: 36px; padding: 0 1rem; border: 1.5px solid var(--th-ink); border-radius: 999px; background: var(--th-white); color: var(--th-ink); cursor: pointer;
	transition: background-color var(--tf-dur-fast), color var(--tf-dur-fast);
}
.th-toggle button[aria-pressed="true"] { background: var(--th-ink); color: var(--th-lime); }
.th-toggle button:hover:not([aria-pressed="true"]) { background: var(--th-lime-wash); }
.th-packs { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 2vw, 28px); align-items: stretch; }
.th-packs > li[hidden] { display: none; }
.th-pack { position: relative; display: flex; flex-direction: column; gap: .5rem; padding: clamp(20px, 2.4vw, 32px); margin: 0; }
.th-pack--featured {
	transform: translateY(-14px); border: 2px solid transparent; box-shadow: var(--th-lift);
	background: linear-gradient(var(--th-white), var(--th-white)) padding-box, conic-gradient(from var(--th-angle), var(--th-ink), var(--th-lime), var(--th-ink) 40%, var(--th-ink)) border-box;
}
.th-pack--featured:hover, .th-pack--featured:focus-within { transform: translateY(-18px); }
.th-pack__top { display: flex; justify-content: space-between; align-items: center; gap: .5rem; }
.th-pack h3 { font-size: 1.75rem; margin: .25rem 0 0; }
.th-pack__best { margin: 0 0 .5rem; color: var(--th-slate); }
.th-pack__price { margin: .25rem 0 1rem; padding: .6rem .8rem; background: var(--th-mist); border-radius: var(--th-r-sm); font-weight: 600; color: var(--th-ink); }
.th-pack__price strong { font-family: var(--tf-font-mono); font-size: 1.25rem; }
.th-pack h4 { font-family: var(--tf-font-mono); font-size: .75rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--th-muted); margin: .75rem 0 .4rem; }
.th-pack .th-ticks { margin-bottom: .5rem; }
.th-pack .th-btn { margin-top: auto; }
.th-pack > .th-ticks + h4 { margin-top: 1rem; }
.th-pack__cta { margin-top: auto; padding-top: 1rem; }
@property --th-angle { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
@media (prefers-reduced-motion: no-preference) {
	.th-pack--featured { animation: th-sheen 8s linear infinite; }
	.th-pack .th-ticks li { transition: background-color var(--tf-dur-fast); }
	.th-pack:hover .th-tick path, .th-pack:focus-within .th-tick path { animation: th-draw .3s var(--th-ease-out) both; animation-delay: calc(var(--i, 0) * 80ms); }
}
@keyframes th-sheen { to { --th-angle: 360deg; } }
@media (max-width: 960px) {
	.th-packs { grid-template-columns: 1fr; max-width: 560px; }
	.th-pack--featured, .th-pack--featured:hover { transform: none; }
}
.th-teaser-packs .th-pack .th-pack__cta { padding-top: .5rem; }

/* Comparison table */
.th-compare { margin-top: clamp(40px, 6vw, 80px); }
.th-table-compare { width: 100%; border-collapse: separate; border-spacing: 0; background: var(--th-white); border: 1px solid var(--th-rule); border-radius: var(--th-r-md); font-size: .9375rem; }
.th-table-compare caption { text-align: left; padding: 0 0 1rem; font-family: var(--tf-font-mono); font-size: .8125rem; letter-spacing: .08em; text-transform: uppercase; color: var(--th-muted); caption-side: top; }
.th-table-compare th, .th-table-compare td { padding: .8rem 1rem; text-align: left; border-bottom: 1px solid var(--th-rule); vertical-align: middle; }
.th-table-compare thead th { position: sticky; top: var(--tf-header-height); background: var(--th-ink); color: var(--th-paper); font-weight: 600; z-index: 3; }
.th-table-compare thead th:first-child { border-top-left-radius: calc(var(--th-r-md) - 1px); }
.th-table-compare thead th:last-child { border-top-right-radius: calc(var(--th-r-md) - 1px); }
.th-table-compare tbody th { font-weight: 500; color: var(--th-ink); width: 40%; }
.th-table-compare td { text-align: center; }
.th-table-compare tbody tr:last-child > * { border-bottom: 0; }
.th-table-compare tbody tr:hover > * { background: var(--th-lime-wash); }
.th-table-compare .th-tick, .th-table-compare .th-cross { margin: 0 auto; display: block; }
@media (max-width: 720px) {
	.th-table-compare, .th-table-compare tbody, .th-table-compare tr, .th-table-compare th, .th-table-compare td { display: block; }
	.th-table-compare thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
	.th-table-compare { border: 0; background: transparent; }
	.th-table-compare caption { display: block; }
	.th-table-compare tbody tr { background: var(--th-white); border: 1px solid var(--th-rule); border-radius: var(--th-r-md); margin-bottom: .75rem; padding: .25rem 0; }
	.th-table-compare tbody th { width: auto; border: 0; padding: .6rem 1rem .25rem; }
	.th-table-compare td { display: flex; align-items: center; justify-content: space-between; text-align: left; padding: .35rem 1rem; border: 0; }
	.th-table-compare td::before { content: attr(data-label); font-family: var(--tf-font-mono); font-size: .75rem; letter-spacing: .06em; text-transform: uppercase; color: var(--th-muted); }
	.th-table-compare .th-tick, .th-table-compare .th-cross { margin: 0; }
}

/* Quiz */
.th-quiz { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 4vw, 64px); align-items: start; }
.th-quiz form { background: var(--th-white); border: 1px solid var(--th-rule); border-radius: var(--th-r-lg); padding: clamp(20px, 3vw, 36px); }
.th-quiz fieldset { border: 0; padding: 0; margin: 0 0 1.5rem; min-width: 0; }
.th-quiz legend { font-weight: 600; color: var(--th-ink); padding: 0; margin-bottom: .6rem; font-size: 1.0625rem; }
.th-opt { display: flex; align-items: center; gap: .7rem; padding: .65rem .85rem; margin-bottom: .45rem; border: 1px solid var(--th-muted); border-radius: var(--th-r-sm); cursor: pointer; min-height: 44px; transition: background-color var(--tf-dur-fast), border-color var(--tf-dur-fast); background: var(--th-white); color: var(--th-ink); }
.th-opt:hover { background: var(--th-lime-wash); }
.th-opt:has(input:checked) { background: var(--th-lime-wash); border-color: var(--th-ink); box-shadow: inset 3px 0 0 var(--th-ink); }
.th-opt:has(input:focus-visible) { outline: 2px solid var(--th-ink); outline-offset: 2px; }
.th-opt input { width: 1.15rem; height: 1.15rem; accent-color: var(--th-ink); flex: none; margin: 0; }
.th-note { font-size: .875rem; color: var(--th-muted); margin: .75rem 0 0; }
.th-quiz__row { display: flex; flex-wrap: wrap; gap: .75rem 1rem; align-items: center; }
.th-result { padding: clamp(20px, 3vw, 32px); border: 2px solid var(--th-ink); border-radius: var(--th-r-lg); background: var(--th-lime-wash); }
.th-result:focus { outline: 2px solid var(--th-ink); outline-offset: 3px; }
.th-result h3 { font-size: 2rem; }
.th-quiz__side { position: sticky; top: calc(var(--tf-header-height) + 1.5rem); }
.th-quiz__side .th-empty { padding: 1.5rem; border: 1px dashed var(--th-muted); border-radius: var(--th-r-lg); color: var(--th-muted); }
@media (prefers-reduced-motion: no-preference) { .th-result { animation: th-scale-in .45s var(--th-ease-out) both; } }
@keyframes th-scale-in { from { opacity: 0; transform: scale(.96); } }
@media (max-width: 860px) { .th-quiz { grid-template-columns: 1fr; } .th-quiz__side { position: static; } }

/* ================================================= 12. Steps (home rail) */
.th-counts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin: 0 0 clamp(32px, 4vw, 56px); padding: 0; list-style: none; border-block: 1px solid var(--th-ink); }
.th-counts li { padding: 1.1rem 1rem 1rem 0; margin: 0; border-right: 1px solid var(--th-rule); padding-left: 1rem; }
.th-counts li:first-child { padding-left: 0; }
.th-counts li:last-child { border-right: 0; }
.th-counts strong { display: block; font-family: var(--tf-font-mono); font-size: clamp(2rem, 1.5rem + 2vw, 3rem); font-weight: 600; line-height: 1; color: var(--th-ink); }
.th-counts span { font-size: .9375rem; color: var(--th-slate); }
@media (max-width: 640px) { .th-counts { grid-template-columns: repeat(2, 1fr); } .th-counts li:nth-child(2) { border-right: 0; } .th-counts li:nth-child(3) { padding-left: 0; } .th-counts li { border-bottom: 1px solid var(--th-rule); } }
.th-rail { list-style: none; margin: 0 0 2rem; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(16px, 2vw, 32px); position: relative; counter-reset: rail; }
.th-rail::before, .th-rail::after { content: ""; position: absolute; left: 0; right: 0; top: 14px; height: 2px; }
.th-rail::before { background: var(--th-rule); }
.th-rail::after { background: var(--th-ink); transform-origin: 0 50%; }
@supports (animation-timeline: view()) {
	@media (prefers-reduced-motion: no-preference) {
		.th-rail::after { transform: scaleX(0); animation: th-fill-x linear both; animation-timeline: view(); animation-range: entry 20% cover 55%; }
	}
}
@keyframes th-fill-x { to { transform: scaleX(1); } }
.th-rail li { position: relative; padding-top: 2.5rem; margin: 0; }
.th-rail li::before { content: ""; position: absolute; left: 0; top: 6px; width: 18px; height: 18px; border-radius: 50%; background: var(--th-lime); box-shadow: 0 0 0 2px var(--th-ink); }
.th-rail__n { display: block; font-family: var(--tf-font-mono); font-size: .8125rem; color: var(--th-muted); margin-bottom: .25rem; }
.th-rail h3 { margin-bottom: .3em; }
.th-rail p { margin: 0; font-size: .9375rem; }
@media (max-width: 760px) {
	.th-rail { grid-template-columns: 1fr; padding-left: 2rem; }
	.th-rail::before, .th-rail::after { left: 8px; right: auto; width: 2px; top: 0; bottom: 0; height: auto; }
	.th-rail::after { transform: none; animation: none; background: var(--th-ink); }
	.th-rail li { padding-top: 0; padding-bottom: 1.25rem; }
	.th-rail li::before { left: -2rem; top: 4px; }
}

/* ====================================================== 13. Boundary callout */
.th-boundary { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border: 1px solid var(--th-ink); border-radius: var(--th-r-lg); overflow: hidden; background: var(--th-white); }
.th-boundary__col { padding: clamp(22px, 3vw, 40px); }
.th-boundary__col + .th-boundary__col { border-left: 1px solid var(--th-ink); background: var(--th-mist); }
.th-boundary h3 { font-size: 1.5rem; }
.th-boundary .th-mono { font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: var(--th-muted); display: block; margin-bottom: .5rem; }
.th-fine { font-size: .875rem; color: var(--th-muted); margin: 1.25rem 0 0; }
@media (prefers-reduced-motion: no-preference) {
	.tf-js .th-boundary__col:first-child[data-reveal]:not(.is-in) { transform: translateX(-16px); }
	.tf-js .th-boundary__col:last-child[data-reveal]:not(.is-in) { transform: translateX(16px); }
}
@media (max-width: 760px) { .th-boundary { grid-template-columns: 1fr; } .th-boundary__col + .th-boundary__col { border-left: 0; border-top: 1px solid var(--th-ink); } }

/* ================================================== 14. Checklist and ring */
.th-ring { position: relative; width: 4.5rem; height: 4.5rem; flex: none; --p: 0; }
.th-ring svg { width: 100%; height: 100%; transform: rotate(-90deg); display: block; }
.th-ring circle { fill: none; stroke-width: 4; }
.th-ring circle:first-child { stroke: var(--th-rule); }
.th-ring circle:last-child { stroke: var(--th-ink); stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: calc(100 * (1 - var(--p))); transition: stroke-dashoffset var(--tf-dur-base) var(--th-ease); }
.th-ring__label { position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--tf-font-mono); font-size: .9375rem; font-weight: 600; color: var(--th-ink); }
.th-teaser { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(24px, 4vw, 64px); align-items: center; }
.th-teaser__ring { display: flex; align-items: center; gap: 1.25rem; margin: 1.25rem 0 1.5rem; }
.th-teaser__ring .th-ring { width: 5.5rem; height: 5.5rem; }
.th-teaser__ring p { margin: 0; font-family: var(--tf-font-mono); color: var(--th-ink); font-size: 1.0625rem; }
.th-teaser .wp-block-image { margin: 0; }
.th-teaser .wp-block-image img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--th-r-lg); display: block; }
@media (max-width: 860px) { .th-teaser { grid-template-columns: 1fr; } }

.th-checklist-bar {
	position: sticky; top: var(--tf-header-height); z-index: 20; display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.5rem;
	padding: .8rem 1rem; margin: 0 0 1.5rem; background: color-mix(in srgb, var(--th-white) 94%, transparent);
	-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
	border: 1px solid var(--th-ink); border-radius: var(--th-r-md);
}
.th-checklist-bar .th-ring { width: 3.25rem; height: 3.25rem; }
.th-checklist-bar .th-ring__label { font-size: .75rem; }
.th-checklist-bar__count { margin: 0; font-family: var(--tf-font-mono); font-size: 1.0625rem; font-weight: 600; color: var(--th-ink); flex: 1 1 10rem; }
.th-checklist-bar__btns { display: flex; gap: .5rem; flex-wrap: wrap; }
.th-checklist-bar__btns[hidden] { display: none; }
.th-checklist-group { margin: 0 0 clamp(28px, 4vw, 48px); }
.th-checklist-group__head { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; padding-bottom: .6rem; border-bottom: 1px solid var(--th-ink); margin-bottom: 0; }
.th-checklist-group__head h2 { font-size: 1.5rem; margin: 0; }
.th-checklist-group__head .th-ref { color: var(--th-muted); font-size: .8125rem; }
.th-chip--done { display: none; }
.th-checklist-group.is-complete .th-chip--done { display: inline-flex; }
.th-checks { list-style: none; margin: 0; padding: 0; }
.th-check { margin: 0; border-bottom: 1px solid var(--th-rule); transition: background-color 150ms var(--th-ease); }
.th-check label { display: grid; grid-template-columns: 1.75rem 1fr; gap: .85rem; padding: 1rem .5rem; cursor: pointer; align-items: start; min-height: 44px; }
.th-check input { position: absolute; opacity: 0; width: 1.75rem; height: 1.75rem; margin: 0; }
.th-check__box { width: 1.5rem; height: 1.5rem; margin-top: .15rem; border: 1.5px solid var(--th-muted); border-radius: var(--th-r-sm); background: var(--th-white); display: grid; place-items: center; transition: background-color 150ms, border-color 150ms; }
.th-check__box svg { width: 1rem; height: 1rem; color: var(--th-lime); }
.th-check__box path { fill: none; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 300ms var(--th-ease-out); }
.th-check input:checked + .th-check__box { background: var(--th-ink); border-color: var(--th-ink); }
.th-check input:checked + .th-check__box path { stroke-dashoffset: 0; }
.th-check input:focus-visible + .th-check__box { outline: 2px solid var(--th-ink); outline-offset: 3px; }
.th-check:has(input:checked) { background: var(--th-lime-wash); }
.th-check__title { display: block; font-weight: 600; color: var(--th-ink); }
.th-check input:checked ~ .th-check__text .th-check__title { text-decoration: line-through; text-decoration-color: var(--th-moss); text-decoration-thickness: 1.5px; }
.th-check__why { display: block; font-size: .9375rem; color: var(--th-slate); margin-top: .15rem; }
.th-check__meta { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .45rem; }
.th-security { display: flex; gap: 1rem; align-items: flex-start; padding: clamp(18px, 2.5vw, 28px); background: var(--th-ink); color: #d5dad7; border-radius: var(--th-r-lg); }
.th-security h2 { color: var(--th-paper); font-size: 1.375rem; margin: 0 0 .3em; }
.th-security p { margin: 0; }
.th-security .th-icon { color: var(--th-lime); width: 2.25rem; height: 2.25rem; flex: none; }
.th-check-layout { display: grid; grid-template-columns: 1fr; }

/* ================================================== 15. How it works page */
.th-stepper { display: grid; grid-template-columns: minmax(220px, .8fr) 1.6fr; gap: clamp(24px, 6vw, 96px); align-items: start; }
.th-stepper__rail { position: sticky; top: calc(var(--tf-header-height) + 2rem); padding-left: 1.75rem; }
.th-stepper__track { position: absolute; left: 0; top: .5rem; bottom: .5rem; width: 3px; background: var(--th-rule); border-radius: 2px; overflow: hidden; }
.th-stepper__track i { position: absolute; inset: 0; background: var(--th-ink); transform-origin: 50% 0; transform: scaleY(var(--th-prog, .25)); transition: transform var(--tf-dur-slow) var(--th-ease-out); }
.th-stepper__num { font-family: var(--tf-font-mono); font-size: clamp(4rem, 3rem + 4vw, 7rem); font-weight: 600; line-height: .95; letter-spacing: -.04em; color: var(--th-ink); margin: 0; background-image: linear-gradient(var(--th-lime), var(--th-lime)); background-size: 100% .28em; background-repeat: no-repeat; background-position: 0 90%; display: inline-block; }
.th-stepper__num small { font-size: .3em; color: var(--th-muted); letter-spacing: 0; font-weight: 400; }
.th-stepper__title { font-size: 1.375rem; font-weight: 640; color: var(--th-ink); margin: .75rem 0 0; }
.th-steps { list-style: none; margin: 0; padding: 0; }
.th-step { min-height: 60vh; display: grid; align-content: center; gap: .5rem; padding-block: 3rem; margin: 0; border-top: 1px solid var(--th-rule); }
.th-step:first-child { border-top: 0; }
.th-step .th-mono { font-size: .8125rem; letter-spacing: .08em; text-transform: uppercase; color: var(--th-muted); }
.th-step h3 { font-size: clamp(1.6rem, 1.3rem + 1.2vw, 2.25rem); }
.th-step p { max-width: 52ch; }
.th-step__art { margin-top: 1rem; max-width: 22rem; color: var(--th-ink); }
.th-step__art svg { width: 100%; height: auto; display: block; }
.th-step__art .l { stroke: var(--th-ink); stroke-width: 1.5; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.th-step__art .f { fill: var(--th-white); stroke: var(--th-ink); stroke-width: 1.5; }
.th-step__art .y { fill: var(--th-lime); stroke: var(--th-ink); stroke-width: 1.5; }
.th-step__art .g { fill: none; stroke: var(--th-rule); stroke-width: 1.5; }
.th-step__art .m { fill: var(--th-moss); }
@media (max-width: 900px) {
	.th-stepper { grid-template-columns: 1fr; }
	.th-stepper__rail { display: none; }
	.th-step { min-height: 0; padding-block: 2rem; }
}
@media (prefers-reduced-motion: reduce) { .th-stepper__rail { position: static; } }
.th-step-badge { display: none; }
@media (max-width: 900px) { .th-step-badge { display: inline-block; font-family: var(--tf-font-mono); } }

.th-month { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(12px, 2vw, 28px); position: relative; }
.th-month::before { content: ""; position: absolute; left: 0; right: 0; top: 11px; height: 2px; background: var(--th-ink); transform-origin: 0 50%; }
.th-month li { position: relative; padding-top: 2.25rem; margin: 0; }
.th-month li::before { content: ""; position: absolute; top: 4px; left: 0; width: 16px; height: 16px; background: var(--th-paper); border: 2px solid var(--th-ink); border-radius: 50%; }
.th-month .th-mono { display: block; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: var(--th-muted); }
.th-month h3 { font-size: 1.125rem; margin: .15rem 0; }
.th-month p { font-size: .9375rem; margin: 0; }
@media (prefers-reduced-motion: no-preference) {
	.tf-js .th-month[data-reveal]::before { transition: transform 1.1s var(--th-ease-out); }
	.tf-js .th-month[data-reveal]:not(.is-in)::before { transform: scaleX(0); }
}
@media (max-width: 720px) {
	.th-month { grid-template-columns: 1fr; padding-left: 1.75rem; }
	.th-month::before { left: 7px; right: auto; width: 2px; top: 0; bottom: 0; height: auto; }
	.th-month li { padding: 0 0 1.25rem; }
	.th-month li::before { left: -1.75rem; top: 4px; }
	.th-month[data-reveal]:not(.is-in)::before { transform: none !important; }
}
.th-three { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 2vw, 32px); list-style: none; margin: 0; padding: 0; }
.th-three li { margin: 0; padding: 1.5rem; }
.th-three .th-icon { margin-bottom: .75rem; }
.th-three h3 { font-size: 1.1875rem; }
.th-three p { margin: 0; font-size: .9375rem; }
@media (max-width: 760px) { .th-three { grid-template-columns: 1fr; } }

/* ===================================================== 16. About, principles */
.th-principles { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--th-ink); }
.th-principles li { margin: 0; padding: clamp(20px, 3vw, 36px); border-bottom: 1px solid var(--th-rule); display: grid; grid-template-columns: 3.25rem 1fr; gap: 1rem; }
.th-principles li:nth-child(odd) { border-right: 1px solid var(--th-rule); }
.th-principles .th-ref { font-size: 1.5rem; font-weight: 600; color: var(--th-ink); background: linear-gradient(var(--th-lime), var(--th-lime)) 0 90% / 100% .3em no-repeat; align-self: start; width: fit-content; line-height: 1.1; }
.th-principles h3 { margin-bottom: .2em; }
.th-principles p { margin: 0; }
@media (max-width: 720px) { .th-principles { grid-template-columns: 1fr; } .th-principles li:nth-child(odd) { border-right: 0; } }
.th-split2 { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 4vw, 64px); align-items: center; }
.th-split2 .wp-block-image { margin: 0; }
.th-split2 .wp-block-image img { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; border-radius: var(--th-r-lg); display: block; }
@media (max-width: 860px) { .th-split2 { grid-template-columns: 1fr; } }
.th-dont { list-style: none; margin: 0; padding: 0; }
.th-dont li { display: flex; gap: .7rem; align-items: flex-start; padding: .7rem 0; border-top: 1px solid var(--th-rule); margin: 0; }
.th-dont li:last-child { border-bottom: 1px solid var(--th-rule); }

/* ================================================== 17. FAQ (core details) */
.entry-content .wp-block-details { border-top: 1px solid var(--th-ink); margin: 0; padding: 0; }
.entry-content .wp-block-details:last-of-type { border-bottom: 1px solid var(--th-ink); }
.entry-content .wp-block-details summary {
	list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.1rem 0; min-height: 44px;
	font-weight: 600; font-size: 1.125rem; color: var(--th-ink); font-stretch: 96%;
}
.entry-content .wp-block-details summary::-webkit-details-marker { display: none; }
.entry-content .wp-block-details summary::after {
	content: ""; width: .6rem; height: .6rem; flex: none; border-right: 2px solid var(--th-ink); border-bottom: 2px solid var(--th-ink); transform: rotate(45deg) translate(-2px, -2px);
	transition: transform var(--tf-dur-base) var(--th-ease);
}
.entry-content .wp-block-details[open] summary::after { transform: rotate(-135deg) translate(-2px, -2px); }
.entry-content .wp-block-details summary:hover { background: linear-gradient(90deg, var(--th-lime-wash), transparent); }
.entry-content .wp-block-details > :not(summary) { padding-bottom: .5rem; max-width: 62ch; }
@supports (interpolate-size: allow-keywords) {
	.entry-content .wp-block-details { interpolate-size: allow-keywords; }
	.entry-content .wp-block-details::details-content { block-size: 0; overflow: clip; transition: block-size .4s var(--th-ease), content-visibility .4s allow-discrete; }
	.entry-content .wp-block-details[open]::details-content { block-size: auto; }
}
.th-faq-grid { display: grid; grid-template-columns: .7fr 1.3fr; gap: clamp(24px, 5vw, 80px); align-items: start; }
.th-faq-grid h2 { font-size: 1.5rem; position: sticky; top: calc(var(--tf-header-height) + 1.5rem); }
@media (max-width: 860px) { .th-faq-grid { grid-template-columns: 1fr; } .th-faq-grid h2 { position: static; } }
.th-faq-group { margin-bottom: clamp(32px, 4vw, 56px); }

/* ================================================= 18. Forms and enquire */
.th-form { background: var(--th-white); border: 1px solid var(--th-rule); border-radius: var(--th-r-lg); padding: clamp(20px, 3vw, 40px); }
.th-form .th-field { margin-bottom: 1.25rem; }
.th-form label, .th-form legend { display: block; font-weight: 600; color: var(--th-ink); margin-bottom: .35rem; font-size: .9375rem; padding: 0; }
.th-form .th-req { color: var(--th-muted); font-weight: 400; }
.th-form input[type="text"], .th-form input[type="email"], .th-form select, .th-form textarea {
	width: 100%; min-height: 44px; padding: .6rem .8rem; border: 1.5px solid var(--th-muted); border-radius: var(--th-r-sm); background: var(--th-white);
	font: inherit; color: var(--th-ink); transition: border-color var(--tf-dur-fast), box-shadow var(--tf-dur-fast);
}
.th-form textarea { min-height: 8rem; resize: vertical; }
.th-form input:focus-visible, .th-form select:focus-visible, .th-form textarea:focus-visible { outline: 2px solid var(--th-ink); outline-offset: 2px; border-color: var(--th-ink); }
.th-form [aria-invalid="true"] { border-color: #9b2c1f; box-shadow: inset 3px 0 0 #9b2c1f; }
.th-form .th-err { color: #8a2217; font-size: .875rem; margin: .35rem 0 0; font-weight: 500; }
.th-form .th-err:empty { display: none; }
.th-form fieldset { border: 0; padding: 0; margin: 0 0 1.25rem; min-width: 0; }
.th-form .th-checks-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .4rem .75rem; }
.th-form .th-opt { margin: 0; font-weight: 500; }
.th-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.25rem; }
.th-form__submit { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.25rem; margin-top: 1.5rem; }
.th-form__submit .th-note { margin: 0; }
.th-enquire-layout { display: grid; grid-template-columns: 1.35fr .65fr; gap: clamp(24px, 4vw, 64px); align-items: start; }
.th-enquire-side .wp-block-image { margin: 0 0 1.5rem; }
.th-enquire-side .wp-block-image img { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--th-r-lg); display: block; }
.th-next { list-style: none; margin: 1.5rem 0 0; padding: 0; counter-reset: nx; }
.th-next li { margin: 0; padding: .9rem 0 .9rem 2.75rem; border-top: 1px solid var(--th-rule); position: relative; counter-increment: nx; }
.th-next li::before { content: counter(nx, decimal-leading-zero); position: absolute; left: 0; top: .9rem; font-family: var(--tf-font-mono); font-size: .875rem; color: var(--th-ink); background: linear-gradient(var(--th-lime), var(--th-lime)) 0 90% / 100% .35em no-repeat; }
.th-next strong { display: block; color: var(--th-ink); }
.th-next .th-tag { margin-top: .35rem; }
.tf-demo-result { background: var(--th-lime-wash); border: 2px solid var(--th-ink); border-radius: var(--th-r-md); }
.tf-demo-result__again { font: inherit; min-height: 44px; padding: 0 1.25rem; border-radius: var(--th-r-md); border: 1.5px solid var(--th-ink); background: var(--th-white); color: var(--th-ink); cursor: pointer; font-weight: 600; }
.tf-demo-result__again:hover { background: var(--th-lime); }
@media (prefers-reduced-motion: no-preference) { .tf-demo-result { animation: th-rise .5s var(--th-ease-out) both; } }
@media (max-width: 960px) { .th-enquire-layout { grid-template-columns: 1fr; } .th-enquire-side .wp-block-image img { aspect-ratio: 16 / 9; } }
@media (max-width: 560px) { .th-form__row, .th-form .th-checks-grid { grid-template-columns: 1fr; } }

/* ======================================================= 19. CTA band */
.th-cta { background: var(--th-ink); color: #d5dad7; padding-block: clamp(56px, 7vw, 104px); position: relative; overflow: clip; }
.th-cta::before { content: ""; position: absolute; inset: 0; background-image: repeating-linear-gradient(90deg, rgb(255 255 255 / .06) 0 1px, transparent 1px calc(100% / 12)); pointer-events: none; }
.th-cta .th-wrap { position: relative; display: grid; grid-template-columns: 1.3fr .7fr; gap: 2rem; align-items: end; }
.th-cta h2 { color: var(--th-paper); margin-bottom: .35em; }
.th-cta p { margin: 0 0 .75rem; max-width: 52ch; }
.th-cta .th-fine { color: #aeb7b2; margin-top: .5rem; }
.th-cta .wp-block-buttons { margin: 0; justify-content: flex-end; }
@media (max-width: 760px) { .th-cta .th-wrap { grid-template-columns: 1fr; } .th-cta .wp-block-buttons { justify-content: flex-start; } }

/* ======================================== 20. Resources (posts page) and articles */
.th-archive-hero { padding-block: clamp(40px, 6vw, 88px) clamp(24px, 3vw, 40px); }
.th-archive-hero .th-lede { font-size: 1.1875rem; max-width: 52ch; }
.th-topics { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 clamp(24px, 3vw, 40px); padding: 0; list-style: none; }
.th-topics li { margin: 0; }
.th-topics a { min-height: 36px; padding-inline: 1rem; }
.th-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 2vw, 28px); }
.th-grid > li { margin: 0; }
.th-grid > li:first-child.th-post--first { grid-column: span 2; }
.th-post { height: 100%; overflow: hidden; display: flex; flex-direction: column; }
.th-post__media { display: block; aspect-ratio: 3 / 2; overflow: hidden; background: var(--th-mist); }
.th-post__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .8s var(--th-ease-out); }
.th-post:hover .th-post__media img, .th-post:focus-within .th-post__media img { transform: scale(1.04); }
.th-post__body { padding: clamp(16px, 2vw, 24px); display: flex; flex-direction: column; gap: .5rem; flex: 1; }
.th-post__meta { display: flex; flex-wrap: wrap; gap: .5rem .75rem; align-items: center; font-family: var(--tf-font-mono); font-size: .75rem; letter-spacing: .04em; color: var(--th-muted); text-transform: uppercase; }
.th-post h3 { margin: 0; font-size: 1.3125rem; }
.th-post h3 a { color: var(--th-ink); text-decoration: none; background: none; }
.th-post h3 a::after { content: ""; position: absolute; inset: 0; }
.th-post { position: relative; }
.th-post h3 a:hover { text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: .15em; }
.th-post p { margin: 0; font-size: .9375rem; }
.th-grid > li:first-child.th-post--first h3 { font-size: 1.75rem; }
.th-pagination { margin-top: 2.5rem; display: flex; gap: .5rem; flex-wrap: wrap; }
.th-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 .9rem; border: 1.5px solid var(--th-ink); border-radius: var(--th-r-md); color: var(--th-ink); text-decoration: none; font-family: var(--tf-font-mono); font-size: .875rem; background: var(--th-white); }
.th-pagination .page-numbers.current { background: var(--th-ink); color: var(--th-lime); }
@media (max-width: 960px) { .th-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px) { .th-grid { grid-template-columns: 1fr; } .th-grid > li:first-child.th-post--first { grid-column: auto; } }
.th-latest .th-grid > li:first-child.th-post--first { grid-column: auto; }
.th-latest .th-grid > li:first-child.th-post--first h3 { font-size: 1.3125rem; }

/* Single article */
.single-post .site-content, .single-post .inside-article { max-width: var(--th-wrap); margin-inline: auto; }
.single-post .inside-article { padding: clamp(32px, 5vw, 72px) var(--tf-gutter) var(--th-section); }
.single-post .entry-header, .single-post .entry-content { max-width: 68ch; margin-inline: auto !important; }
.single-post .entry-title { font-size: clamp(2.2rem, 1.6rem + 2.6vw, 3.4rem); line-height: 1.08; margin-bottom: .4em; }
.single-post .entry-meta { display: none; }
.th-art-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin: 0 0 1.5rem; font-family: var(--tf-font-mono); font-size: .8125rem; letter-spacing: .04em; text-transform: uppercase; color: var(--th-muted); }
.th-art-figure { margin: 0 0 2rem; max-width: 960px; margin-inline: auto; }
.th-art-figure img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--th-r-lg); display: block; }
.single-post .th-art-figure { max-width: 68ch; }
.single-post .entry-content > p, .single-post .entry-content > ul, .single-post .entry-content > ol { font-size: 1.125rem; line-height: 1.7; margin-bottom: 1.25em !important; }
.single-post .entry-content > h2 { margin: 2.2em 0 .6em !important; font-size: clamp(1.5rem, 1.3rem + 1vw, 2rem); }
.single-post .entry-content ul, .single-post .entry-content ol { padding-left: 1.3em; }
.single-post .entry-content li { margin-bottom: .4em; }
.th-keypoints { border: 1px solid var(--th-ink); border-radius: var(--th-r-md); padding: 1.1rem 1.25rem; margin: 0 0 1.5rem; background: var(--th-white); }
.th-keypoints h2 { font-family: var(--tf-font-mono); font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: var(--th-muted); margin: 0 0 .5rem; }
.th-keypoints ul { margin: 0; }
.th-toc { margin: 0 0 2rem; padding: 1rem 1.25rem; border-left: 3px solid var(--th-ink); background: var(--th-mist); border-radius: 0 var(--th-r-sm) var(--th-r-sm) 0; }
.th-toc h2 { font-family: var(--tf-font-mono); font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: var(--th-muted); margin: 0 0 .4rem; }
.th-toc ol { margin: 0; padding-left: 1.2em; font-size: .9375rem; }
.th-sources { margin: 2rem 0 0; padding: 1.25rem; border: 1px solid var(--th-rule); border-radius: var(--th-r-md); background: var(--th-white); }
.th-sources h2 { font-family: var(--tf-font-mono); font-size: .8125rem; letter-spacing: .08em; text-transform: uppercase; color: var(--th-muted); margin: 0 0 .5rem; }
.th-sources ul { margin: 0; padding-left: 1.2em; }
.th-related { max-width: var(--th-wrap); margin: clamp(40px, 6vw, 80px) auto 0; }
.th-related > h2 { font-size: 1.5rem; }
.th-related .th-grid { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 620px) { .th-related .th-grid { grid-template-columns: 1fr; } }
body:not(.single-post) .tf-progress { display: none !important; }
.single-post .tf-progress { height: 4px; }
.th-notice--article { margin: 0 0 1.75rem; }
.th-notice--after { margin: 2rem 0 0; }
.single-post .post-navigation, .single-post .comments-area { max-width: 68ch; margin-inline: auto; }

/* ====================================================== 21. 404 */
.th-404 { padding-block: clamp(48px, 7vw, 112px); }
.th-404__grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(24px, 5vw, 80px); align-items: center; }
.th-404 .th-ledger { max-width: 380px; }
.th-404__links { display: flex; flex-wrap: wrap; gap: .75rem; margin: 1.5rem 0; }
.th-404 .search-form { display: flex; gap: .5rem; max-width: 28rem; }
.th-404 .search-form label { flex: 1; }
.th-404 .search-field { width: 100%; min-height: 44px; border: 1.5px solid var(--th-muted); border-radius: var(--th-r-sm); padding: 0 .8rem; background: var(--th-white); }
.th-404 .search-submit { min-height: 44px; border-radius: var(--th-r-md); border: 1.5px solid var(--th-ink); background: var(--th-ink); color: var(--th-lime); font-weight: 600; padding: 0 1rem; cursor: pointer; }
@media (max-width: 860px) { .th-404__grid { grid-template-columns: 1fr; } }

/* ============================================================ 22. Footer */
.th-footer { background: var(--th-ink); color: #c4cbc7; padding-block: clamp(48px, 6vw, 88px) 2rem; }
.th-footer__inner { max-width: var(--th-wrap); margin-inline: auto; padding-inline: var(--tf-gutter); }
.th-footer__cols { display: grid; grid-template-columns: 1.3fr 1fr 1.2fr; gap: clamp(24px, 4vw, 64px); }
.th-footer .th-logo a { color: var(--th-paper); }
.th-footer .th-logo__mark { color: var(--th-paper); }
.th-footer .th-logo__mark .th-logo__cross { stroke: var(--th-lime); }
.th-footer h2 { font-family: var(--tf-font-mono); font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: #aeb7b2; margin: 0 0 .9rem; font-weight: 600; }
.th-footer p { margin: .9rem 0; font-size: .9375rem; max-width: 36ch; }
.th-footer ul { list-style: none; margin: 0; padding: 0; }
.th-footer li { margin: 0 0 .5rem; }
.th-footer a { color: var(--th-paper); background: none; text-decoration-color: rgb(255 255 255 / .4); }
.th-footer a:hover { color: var(--th-lime); text-decoration-color: var(--th-lime); background: none; }
.th-footer .th-btn { color: var(--th-ink); background-color: var(--th-lime); background-image: linear-gradient(var(--th-white), var(--th-white)); border-color: var(--th-lime); text-decoration: none; margin-top: .5rem; }
.th-footer .th-btn:hover { color: var(--th-ink); }
.th-footer__notice { margin: clamp(32px, 4vw, 56px) 0 0; background: var(--th-lime-wash); color: var(--th-ink); border-radius: var(--th-r-md); padding: 1rem 1.25rem; font-size: .9375rem; }
.th-footer__notice p { margin: 0; max-width: none; }
.th-footer__legal { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; margin-top: 1.75rem; padding-top: 1.25rem; border-top: 1px solid rgb(255 255 255 / .16); font-size: .875rem; }
.th-footer__legal ul { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; }
.th-footer__legal li { margin: 0; }
.th-footer .tf-concept-footer { margin: 0; flex: 1 1 18rem; color: #c4cbc7; }
.th-footer .tf-concept-footer a { color: var(--th-lime); }
@media (max-width: 860px) { .th-footer__cols { grid-template-columns: 1fr; } }
.site-footer { background: var(--th-ink); }
.site-info { background: #11161a; color: #aeb7b2; font-family: var(--tf-font-mono); font-size: .75rem; letter-spacing: .04em; }
.site-info .inside-site-info { padding: 1rem var(--tf-gutter); }
.site-info .copyright-bar { text-align: center; }
.site-info a { color: var(--th-paper); background: none; }

/* ===================================================== 23. Credits table */
.tf-credits th, .tf-credits td { color: var(--th-slate); }
.tf-credits th { color: var(--th-ink); font-family: var(--tf-font-mono); font-size: .75rem; letter-spacing: .06em; text-transform: uppercase; }

/* ============================================================== 24. Print */
@media print {
	.site-header, .th-footer__cols, .th-footer__notice, .site-info, .th-cta, .th-checklist-bar__btns, .th-page-hero .wp-block-image, .th-marquee-band, .tf-progress, .th-ring, .th-security { display: none !important; }
	body { background: #fff; color: #000; font-size: 11pt; }
	.th-section, .th-page-hero { padding-block: 12pt !important; background: none !important; }
	.th-check__box { border: 1px solid #000; background: #fff !important; }
	.th-check__box path { display: none; }
	.th-check:has(input:checked) { background: none; }
	.th-check__title { text-decoration: none !important; }
	.th-checklist-bar { position: static; border: 0; padding: 0; }
	.th-checklist-bar__count { display: none; }
	a { color: #000 !important; text-decoration: none !important; background: none !important; }
	.tf-js [data-reveal], .tf-js [data-reveal] > * { opacity: 1 !important; transform: none !important; clip-path: none !important; }
}

/* ============================================ 25. Reduced motion (own pieces) */
@media (prefers-reduced-motion: reduce) {
	.th-logo__mark path, .th-tick path { stroke-dashoffset: 0 !important; animation: none !important; }
	.th-ledger, .th-ledger *, .th-line > span, .th-rise, .th-wipe img, .th-pack--featured, .th-result, .tf-demo-result { animation: none !important; }
	h1 em, h2 em { animation: none !important; background-size: 100% .4em !important; }
	.th-rail::after { transform: none !important; animation: none !important; }
	.th-month::before, .th-services::before { transform: none !important; }
	.th-hero__media .wp-block-image img { transform: none; animation: none !important; }
	.th-ledger__rows li::after { opacity: 0 !important; }
	.th-stepper__track i, .th-ring circle { transition: none; }
	.th-card:hover, .th-card:focus-within, .th-service-card:hover, .th-pack--featured:hover { transform: none; }
	.th-post:hover .th-post__media img { transform: none; }
	::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
}
@media (prefers-reduced-motion: no-preference) {
	::view-transition-old(th-main) { animation: th-vt-out 140ms linear both; }
	::view-transition-new(th-main) { animation: th-vt-in 140ms linear both; }
}
@keyframes th-vt-out { to { opacity: 0; } }
@keyframes th-vt-in { from { opacity: 0; } }

/* Card links inside content: no underline on the whole card. */
.entry-content .th-service-card a,
.entry-content .th-service-card a * {
	text-decoration: none;
}
.entry-content .th-service-card a:hover .th-service-card__more,
.entry-content .th-service-card a:focus-visible .th-service-card__more {
	text-decoration: underline;
}

/* =========================================== Dropdowns, menus and disclosures */
/* Graphite chevron (15:1). Lime is never used for a meaningful mark on light ground,
   and the input keeps its muted border so a rule line is never its only edge. */
:root {
	--tf-select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%231a2024' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
	--tf-select-arrow-size: 1rem;
	--tf-select-arrow-inset: .8rem;
	--tf-nav-hover-color: var(--th-ink);
}
.th-form select:hover { border-color: var(--th-ink); }
.th-form select[aria-invalid="true"]:hover { border-color: #9b2c1f; }

/* The FAQ height animation runs on ::details-content, which the base
   reduced-motion reset does not reach. */
@media (prefers-reduced-motion: reduce) {
	.entry-content .wp-block-details::details-content { transition: none; }
}