/*
 * Trinbago — main stylesheet.
 * Tokens come from theme.json (--wp--preset--*). Contrast pairs are measured in tools/check/contrast.mjs.
 */

:root {
	--tb-red: var(--wp--preset--color--pepper, #d62828);
	--tb-red-deep: var(--wp--preset--color--pepper-dark, #a81e1e);
	--tb-ink: var(--wp--preset--color--ink, #171717);
	--tb-white: #fff;
	--tb-cream: var(--wp--preset--color--cream, #fff8f0);
	--tb-grey: var(--wp--preset--color--grey, #f3f3f3);
	--tb-muted: var(--wp--preset--color--muted, #565250);
	--tb-line: var(--wp--preset--color--line, #e6ded4);
	--tb-on-ink-muted: #c9c2ba;
	--tb-red-on-ink: #ff8a80;
	--tb-r-sm: 8px;
	--tb-r-md: 14px;
	--tb-r-lg: 22px;
	--tb-r-pill: 999px;
	--tb-shadow: 0 18px 40px -18px rgba(23, 23, 23, 0.28);
	--tb-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
	--tb-header-h: 72px;
	--tb-wide: var(--wp--style--global--wide-size, 1240px);
	--tb-gutter: var(--wp--style--root--padding-left, clamp(1rem, 4vw, 2.5rem));
	--tb-section: clamp(3.5rem, 2rem + 6vw, 7rem);
	--tb-flag: linear-gradient(118deg, var(--tb-red) 0 31%, #fff 31% 37%, var(--tb-ink) 37% 63%, #fff 63% 69%, var(--tb-red) 69%);
}

/* ---------- Base ---------- */

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { font-optical-sizing: auto; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; overflow-x: clip; }
:where(h1, h2, h3, h4) { text-wrap: balance; }
p { text-wrap: pretty; }
img { max-width: 100%; height: auto; }
:target, [id] { scroll-margin-top: calc(var(--tb-header-h) + 1.5rem); }
::selection { background: var(--tb-red); color: #fff; }

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--tb-red);
	outline-offset: 3px;
	border-radius: 4px;
}
.tb-band--ink :where(a, button, input, select):focus-visible,
.tb-footer :where(a, button, input, select):focus-visible { outline-color: #fff; }

.tb-skip {
	position: absolute; left: 1rem; top: -100px; z-index: 1000;
	background: var(--tb-ink); color: #fff; padding: 0.75rem 1rem; border-radius: var(--tb-r-sm);
	font-weight: 650; text-decoration: none;
}
.tb-skip:focus { top: 1rem; }

.tb-icon { width: 1.15em; height: 1.15em; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; vertical-align: -0.2em; }

.tb-main { padding-bottom: 0; }
.tb-main > :first-child { margin-top: 0; }
.wp-site-blocks > * + * { margin-block-start: 0; }

/* ---------- Brand marks ---------- */

.tb-slash {
	display: inline-block; width: 1.6em; height: 0.62em; margin-right: 0.6em;
	background: var(--tb-flag); border-radius: 2px; vertical-align: 0.05em;
}

.tb-eyebrow {
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase;
	color: var(--tb-red-deep); margin: 0 0 0.9rem;
}
.tb-band--ink .tb-eyebrow { color: var(--tb-red-on-ink); }

.tb-lede { font-size: var(--wp--preset--font-size--md); line-height: 1.5; color: var(--tb-muted); max-width: 46ch; }

.tb-wordmark { margin: 0; line-height: 1; }
.tb-wordmark a {
	display: inline-flex; align-items: center; gap: 0.6rem;
	font-size: clamp(1.2rem, 1rem + 0.6vw, 1.45rem); font-weight: 800; letter-spacing: -0.035em;
	color: var(--tb-ink); text-decoration: none; font-variation-settings: "opsz" 48;
}
.tb-wordmark a::before {
	content: ""; width: 1.55em; height: 1.55em; border-radius: 0.42em; background: var(--tb-flag); flex: none;
	box-shadow: inset 0 0 0 1px rgba(23, 23, 23, 0.06);
}
.tb-wordmark--light a { color: #fff; }
.tb-brand__tagline { margin: 0.25rem 0 0 calc(1.55em * 1.3 + 0.6rem); font-size: var(--wp--preset--font-size--xs); color: var(--tb-muted); line-height: 1.2; }

/* ---------- Buttons ---------- */

.tb-btn,
.wp-block-button__link {
	display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
	min-height: 48px; padding: 0.8rem 1.4rem; border-radius: var(--tb-r-pill);
	font-family: inherit; font-size: var(--wp--preset--font-size--sm); font-weight: 650; line-height: 1.1;
	text-decoration: none; cursor: pointer; border: 2px solid transparent;
	transition: background-color 0.2s var(--tb-ease), color 0.2s var(--tb-ease), border-color 0.2s var(--tb-ease), transform 0.2s var(--tb-ease);
}
.tb-btn:active, .wp-block-button__link:active, .tb-iconbtn:active { transform: translateY(1px) scale(0.97); }
.tb-btn--primary { background: var(--tb-red); color: #fff; }
.tb-btn--primary:hover { background: var(--tb-red-deep); color: #fff; }
.tb-btn--outline, .wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent; color: var(--tb-ink); border-color: var(--tb-ink);
}
.tb-btn--outline:hover, .wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--tb-ink); color: #fff; }
.tb-btn--ghost { background: transparent; color: var(--tb-ink); border-color: transparent; padding-inline: 0.75rem; }
.tb-btn--ghost:hover { background: var(--tb-grey); }
.tb-btn--sm { min-height: 40px; padding: 0.55rem 1rem; }
.tb-btn[hidden] { display: none; }
.tb-band--ink .wp-block-button.is-style-outline > .wp-block-button__link { color: #fff; border-color: #fff; }
.tb-band--ink .wp-block-button.is-style-outline > .wp-block-button__link:hover { background: #fff; color: var(--tb-ink); }

.tb-iconbtn {
	display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
	border: 2px solid var(--tb-ink); background: #fff; color: var(--tb-ink); cursor: pointer;
	transition: background-color 0.2s, color 0.2s;
}
.tb-iconbtn:hover { background: var(--tb-ink); color: #fff; }
.tb-iconbtn:disabled { opacity: 0.35; cursor: not-allowed; background: #fff; color: var(--tb-ink); }
.tb-linkbtn { background: none; border: 0; padding: 0.25rem 0; font: inherit; font-size: var(--wp--preset--font-size--sm); color: var(--tb-red-deep); text-decoration: underline; cursor: pointer; }

/* Animated underline on text links in navigation and footer */
.tb-ul, .tb-nav .wp-block-navigation-item__content, .tb-footer a, .tb-breadcrumbs a {
	text-decoration: none;
	background: linear-gradient(currentColor, currentColor) 0 100% / 0 2px no-repeat;
	transition: background-size 0.25s var(--tb-ease);
}
.tb-ul:hover, .tb-nav .wp-block-navigation-item__content:hover, .tb-footer a:hover, .tb-breadcrumbs a:hover { background-size: 100% 2px; }

/* ---------- Header ---------- */

.tb-site-header { position: sticky; top: var(--wp-admin--admin-bar--height, 0px); z-index: 50; }
.tb-header {
	background: rgba(255, 255, 255, 0.97);
	border-bottom: 1px solid var(--tb-line);
	transition: box-shadow 0.25s var(--tb-ease), padding 0.25s var(--tb-ease);
	padding-block: 0.9rem;
}
.is-scrolled .tb-header { box-shadow: 0 8px 24px -16px rgba(23, 23, 23, 0.35); padding-block: 0.55rem; }
.tb-header__inner { gap: 1rem; min-height: 44px; }
.tb-header__nav { gap: clamp(0.5rem, 1.5vw, 1.5rem); }
.tb-nav { font-size: var(--wp--preset--font-size--sm); font-weight: 600; gap: clamp(0.9rem, 1.6vw, 1.75rem); }
.tb-nav .wp-block-navigation-item__content { color: var(--tb-ink); padding-block: 0.4rem; }
.tb-nav .current-menu-item > .wp-block-navigation-item__content,
.tb-nav [aria-current="page"] { background-size: 100% 2px; color: var(--tb-red-deep); }
.tb-header__cta-wrap { margin: 0 !important; flex-wrap: nowrap; }
.tb-header__cta .wp-block-button__link { min-height: 44px; padding: 0.6rem 1.1rem; gap: 0.45rem; white-space: nowrap; }
.tb-header__cta .wp-block-button__link::before, .tb-totop a::before {
	content: ""; width: 1.1em; height: 1.1em; flex: none; background: currentColor;
	-webkit-mask: var(--tb-mask) center / contain no-repeat; mask: var(--tb-mask) center / contain no-repeat;
}
.tb-header__cta { --tb-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E"); }
.tb-totop { --tb-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 7-7 7 7'/%3E%3Cpath d='M12 19V5'/%3E%3C/svg%3E"); }

/* Mobile drawer (core navigation overlay) */
.tb-nav .wp-block-navigation__responsive-container-open,
.tb-nav .wp-block-navigation__responsive-container-close {
	width: 44px; height: 44px; align-items: center; justify-content: center; border-radius: 50%;
}
@media (max-width: 599px) { .tb-nav .wp-block-navigation__responsive-container-open { display: inline-flex; } }
.tb-nav .wp-block-navigation__responsive-container-open svg,
.tb-nav .wp-block-navigation__responsive-container-close svg { width: 28px; height: 28px; }
.tb-nav .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--tb-cream) !important; color: var(--tb-ink) !important;
	padding: 1.25rem var(--tb-gutter) 2rem;
}
.tb-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: 4rem; align-items: flex-start;
}
.tb-nav .is-menu-open .wp-block-navigation__container { gap: 0.25rem !important; width: 100%; align-items: stretch !important; }
.tb-nav .is-menu-open .wp-block-navigation-item { width: 100%; border-bottom: 1px solid var(--tb-line); }
.tb-nav .is-menu-open .wp-block-navigation-item__content {
	display: flex !important; width: 100%; padding: 0.9rem 0 !important;
	font-size: var(--wp--preset--font-size--lg); font-weight: 750; letter-spacing: -0.02em;
}
.tb-nav .is-menu-open .wp-block-navigation-item__content::after { content: "→"; margin-left: auto; color: var(--tb-red); }

@media (max-width: 1099px) { .tb-brand__tagline { display: none; } }
@media (min-width: 600px) and (max-width: 959px) {
	.tb-nav { gap: 0.85rem; font-size: 0.875rem; }
	.tb-header__cta .wp-block-button__link { font-size: 0; width: 44px; padding: 0; }
	.tb-header__cta .wp-block-button__link::before { width: 18px; height: 18px; }
}
@media (max-width: 599px) {
	.tb-header__cta .wp-block-button__link { padding: 0.55rem 0.9rem; gap: 0.35rem; font-size: 0.8125rem; }
	.tb-wordmark a { font-size: 1.1rem; gap: 0.45rem; }
	.tb-header__nav { gap: 0.25rem; }
}
@media (max-width: 380px) {
	.tb-header__cta .wp-block-button__link { font-size: 0; width: 44px; padding: 0; }
	.tb-header__cta .wp-block-button__link::before { width: 18px; height: 18px; }
}

/* ---------- Breadcrumbs ---------- */

.tb-breadcrumbs { margin-block: 1.25rem 0; font-size: var(--wp--preset--font-size--xs); color: var(--tb-muted); }
.tb-breadcrumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: 0.25rem 0.5rem; margin: 0; padding: 0; }
.tb-breadcrumbs li { display: inline-flex; align-items: center; gap: 0.5rem; }
.tb-breadcrumbs li + li::before { content: "/"; color: var(--tb-line); font-weight: 700; }
.tb-breadcrumbs a { color: var(--tb-muted); padding-block: 0.35rem; }
.tb-breadcrumbs [aria-current] { color: var(--tb-ink); font-weight: 600; }

/* ---------- Sections and bands ---------- */

.tb-section { padding-block: var(--tb-section); }
.tb-band { padding-block: var(--tb-section); margin-block: 0 !important; }
.tb-band--cream { background: var(--tb-cream); }
.tb-band--grey { background: var(--tb-grey); }
.tb-band--ink { background: var(--tb-ink); color: #fff; }
.tb-band--ink a:not(.wp-block-button__link):not(.tb-btn) { color: #fff; }
.tb-main > .tb-band:last-child { margin-bottom: 0; }

.tb-section-head {
	display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem 2rem;
	margin-bottom: clamp(1.75rem, 1rem + 2vw, 3rem) !important;
}
.tb-section-head > * { margin: 0; }
.tb-section-head__text { max-width: 640px; }
.tb-section-head__text > * { margin-block: 0; }
.tb-section-head__text > * + * { margin-top: 0.75rem; }
.tb-section-title { font-size: var(--wp--preset--font-size--xl); margin-bottom: 1.5rem; }
.tb-section-head .tb-section-title { margin-bottom: 0; }
.tb-center-cta { display: flex; justify-content: center; margin-top: clamp(2rem, 1.5rem + 2vw, 3rem) !important; }
.tb-more { margin: 0; }
.tb-more-link { display: inline-flex; align-items: center; gap: 0.4rem; font-weight: 650; color: var(--tb-ink); text-decoration: none; white-space: nowrap; }
.tb-more-link::after { content: "→"; color: var(--tb-red); transition: transform 0.2s var(--tb-ease); }
.tb-more-link:hover::after { transform: translateX(4px); }

/* ---------- Home: hero ---------- */

.tb-hero {
	display: grid; margin-top: 0 !important;
	grid-template-columns: minmax(var(--tb-gutter), 1fr) minmax(0, calc(var(--tb-wide) * 0.48)) minmax(0, calc(var(--tb-wide) * 0.52)) minmax(0, 1fr);
	background: var(--tb-cream); position: relative; isolation: isolate;
	overflow: clip; /* the drifting hero image may move a few px past its column; never past the band */
	padding: 0 !important;
}
.tb-hero__text {
	grid-column: 2 / 3; align-self: center;
	padding-block: clamp(3rem, 2rem + 4vw, 6rem); padding-right: clamp(1.5rem, 4vw, 4rem);
}
.tb-hero__text > * { margin-block: 0; }
.tb-hero__title {
	font-size: var(--wp--preset--font-size--display) !important; line-height: 0.98; letter-spacing: -0.035em;
	font-weight: 800; margin-top: 0.25rem !important;
}
.tb-hero__title mark { background: none; color: var(--tb-red); }
.tb-hero__lede { margin-top: 1.4rem !important; font-size: var(--wp--preset--font-size--md); color: var(--tb-muted); max-width: 40ch; }
.tb-hero .wp-block-buttons { margin-top: 1.75rem !important; gap: 0.75rem; }
.tb-hero .tb-searchbar { margin-top: 1.5rem !important; }
.tb-hero__try { margin-top: 0.9rem !important; font-size: var(--wp--preset--font-size--sm); color: var(--tb-muted); }
.tb-hero__try a { color: var(--tb-ink); font-weight: 600; }
/*
 * The hero image is shown uncropped (its dish hotspots are placed in percent of the image), and
 * blended into the cream band: the file has the cream multiplied in (tools/photos/owner, so its white
 * haze is the band colour without a runtime blend), and the mask fades the left, top and bottom edges.
 */
.tb-hero__image {
	--tb-hero-mask: linear-gradient(to right, transparent 0, #000 16%), linear-gradient(to bottom, transparent 0, #000 9%, #000 86%, transparent 100%);
	grid-column: 3 / 5; align-self: center; margin: 0 !important; position: relative;
}
.tb-hero__image img {
	position: relative; display: block; width: 100%; height: auto;
	-webkit-mask-image: var(--tb-hero-mask); mask-image: var(--tb-hero-mask);
	-webkit-mask-composite: source-in; mask-composite: intersect;
}

@media (max-width: 899px) {
	.tb-hero { grid-template-columns: var(--tb-gutter) minmax(0, 1fr) var(--tb-gutter); }
	.tb-hero__image { grid-column: 1 / -1; grid-row: 1; --tb-hero-mask: linear-gradient(to bottom, #000 78%, transparent 100%); }
	.tb-hero__text { grid-column: 2; padding-block: 2rem 3rem; padding-right: 0; }
}

/* Hero dish hotspots (markup from trinbago-core/inc/hotspots.php) */

/* Registered so the spotlight glides from dish to dish instead of jumping. */
@property --sx { syntax: "<percentage>"; inherits: true; initial-value: 50%; }
@property --sy { syntax: "<percentage>"; inherits: true; initial-value: 50%; }
@property --sw { syntax: "<percentage>"; inherits: true; initial-value: 20%; }
@property --sh { syntax: "<percentage>"; inherits: true; initial-value: 20%; }

.tb-hero__image::before {
	content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; opacity: 0;
	background: radial-gradient(var(--sw) var(--sh) at var(--sx) var(--sy), transparent 0 70%, rgba(23, 23, 23, 0.46) 100%);
	-webkit-mask-image: var(--tb-hero-mask); mask-image: var(--tb-hero-mask);
	-webkit-mask-composite: source-in; mask-composite: intersect;
	transition: opacity 0.35s var(--tb-ease), --sx 0.5s var(--tb-ease), --sy 0.5s var(--tb-ease), --sw 0.5s var(--tb-ease), --sh 0.5s var(--tb-ease);
}
.tb-hero__image.is-spot::before { opacity: 1; }

.tb-hotspots { position: absolute; inset: 0; z-index: 2; }
.tb-hotspot {
	position: absolute; left: calc(var(--x) - var(--w) / 2); top: calc(var(--y) - var(--h) / 2);
	width: var(--w); height: var(--h); border-radius: 50%; color: var(--tb-ink); text-decoration: none; outline: none;
}
.tb-hotspot:focus-visible { outline: 3px solid #fff; outline-offset: -3px; box-shadow: inset 0 0 0 6px var(--tb-ink); }

/* The dot: a quiet cue that the dishes can be explored. */
.tb-hotspot__dot {
	position: absolute; left: 50%; top: 50%; width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%;
	background: var(--tb-red); box-shadow: 0 0 0 3px #fff, 0 3px 10px rgba(23, 23, 23, 0.35);
	transition: transform 0.3s var(--tb-ease), opacity 0.3s var(--tb-ease);
}
.tb-hotspot__dot::after {
	content: ""; position: absolute; inset: -3px; border-radius: 50%; border: 2px solid #fff; opacity: 0;
}

/* The label: a white tag with a little flag ribbon that springs up from the dish. */
.tb-hotspot__label {
	position: absolute; left: 50%; bottom: calc(50% + 16px); display: grid; justify-items: center; gap: 0.1rem;
	padding: 0.55rem 0.9rem 0.5rem; background: #fff; color: var(--tb-ink); border-radius: var(--tb-r-md);
	box-shadow: 0 14px 30px -12px rgba(23, 23, 23, 0.5); white-space: nowrap; pointer-events: none;
	opacity: 0; transform: translate(-50%, 12px) scale(0.55) rotate(-7deg); transform-origin: 50% 100%;
	transition: opacity 0.18s var(--tb-ease), transform 0.5s cubic-bezier(0.34, 1.7, 0.5, 1);
}
.tb-hotspot__label::before {
	content: ""; position: absolute; top: -5px; left: 14px; width: 30px; height: 9px; border-radius: 2px;
	background: var(--tb-flag); transform: rotate(-5deg);
}
.tb-hotspot__name { font-size: 1rem; font-weight: 780; letter-spacing: -0.01em; line-height: 1.1; }
.tb-hotspot__cta { font-size: 0.72rem; font-weight: 650; color: var(--tb-red-deep); line-height: 1.2; }
.tb-hotspot__cta::after { content: " →"; display: inline-block; transition: transform 0.25s var(--tb-ease); }

.tb-hotspot--start .tb-hotspot__label { left: 10%; transform: translate(0, 12px) scale(0.55) rotate(-7deg); transform-origin: 20% 100%; justify-items: start; }
.tb-hotspot--end .tb-hotspot__label { left: auto; right: 22%; transform: translate(0, 12px) scale(0.55) rotate(7deg); transform-origin: 80% 100%; justify-items: end; }
.tb-hotspot--end .tb-hotspot__label::before { left: auto; right: 14px; transform: rotate(5deg); }

@media (hover: hover) {
	.tb-hotspot:hover .tb-hotspot__label { opacity: 1; transform: translate(-50%, 0) scale(1) rotate(-2deg); }
	.tb-hotspot--start:hover .tb-hotspot__label { transform: translate(0, 0) scale(1) rotate(-2deg); }
	.tb-hotspot--end:hover .tb-hotspot__label { transform: translate(0, 0) scale(1) rotate(2deg); }
	.tb-hotspot:hover .tb-hotspot__dot { transform: scale(0.5); }
	.tb-hotspot:hover .tb-hotspot__cta::after { transform: translateX(3px); }
	a.tb-hotspot:hover { cursor: pointer; }
}
.tb-hotspot:focus-visible .tb-hotspot__label { opacity: 1; transform: translate(-50%, 0) scale(1) rotate(-2deg); }
.tb-hotspot--start:focus-visible .tb-hotspot__label { transform: translate(0, 0) scale(1) rotate(-2deg); }
.tb-hotspot--end:focus-visible .tb-hotspot__label { transform: translate(0, 0) scale(1) rotate(2deg); }

/* Gentle drift with the pointer; set by main.js only on fine pointers without reduced motion. */
.tb-hero__image.is-drift img, .tb-hero__image.is-drift .tb-hotspots, .tb-hero__image.is-drift::before {
	transform: translate3d(calc(var(--px, 0) * 8px), calc(var(--py, 0) * 6px), 0) scale(1.02);
}
.tb-hero__image img, .tb-hero__image .tb-hotspots { transition: transform 0.9s var(--tb-ease); }

@media (prefers-reduced-motion: no-preference) {
	.tb-hotspot__dot { animation: tb-dot-in 0.55s calc(0.5s + var(--i, 0) * 0.09s) cubic-bezier(0.34, 1.7, 0.5, 1) both; }
	.tb-hotspot__dot::after { animation: tb-dot-pulse 2.8s calc(1.4s + var(--i, 0) * 0.35s) var(--tb-ease) infinite; }
}
@keyframes tb-dot-in { from { scale: 0; } to { scale: 1; } } /* `scale`, so the hover transform still applies */
@keyframes tb-dot-pulse { 0% { opacity: 0.9; transform: scale(1); } 70%, 100% { opacity: 0; transform: scale(2.4); } }

@media (max-width: 899px) {
	.tb-hotspot__dot { width: 12px; height: 12px; margin: -6px 0 0 -6px; }
	.tb-hotspot__label, .tb-hotspot--plain .tb-hotspot__dot { display: none; }
}

/* Search bar */
.tb-searchbar {
	display: flex; align-items: center; gap: 0.25rem; max-width: 560px;
	background: #fff; border: 2px solid var(--tb-ink); border-radius: var(--tb-r-pill); padding: 0.3rem 0.3rem 0.3rem 1rem;
	box-shadow: 0 10px 28px -18px rgba(23, 23, 23, 0.45);
}
.tb-searchbar:focus-within { border-color: var(--tb-red); }
.tb-searchbar__icon { display: inline-flex; color: var(--tb-muted); }
.tb-searchbar input {
	flex: 1; min-width: 0; border: 0; background: transparent; font: inherit; font-size: var(--wp--preset--font-size--base);
	padding: 0.7rem 0.4rem; color: var(--tb-ink);
}
.tb-searchbar input:focus { outline: none; }
.tb-searchbar input::placeholder { color: #77716c; }
.tb-searchbar .tb-btn { min-height: 44px; }

/* ---------- Category tiles ---------- */

.tb-tiles { list-style: none; margin: 0; padding: 0; display: grid; gap: clamp(0.75rem, 1.5vw, 1.25rem); }
.tb-tiles--mosaic { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.tb-tile a {
	position: relative; display: block; height: 100%; border-radius: var(--tb-r-md); overflow: hidden;
	color: #fff; text-decoration: none; background: var(--tb-ink); isolation: isolate;
}
.tb-tile__media { display: block; aspect-ratio: 4 / 5; }
.tb-tile--lead .tb-tile__media { aspect-ratio: 16 / 10; }
.tb-tile__media img, .tb-tile__media .tb-photo-missing { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.6s var(--tb-ease); }
.tb-tile a:hover img { transform: scale(1.05); }
.tb-tile__text {
	position: absolute; inset: auto 0 0 0; z-index: 1; display: flex; align-items: flex-end; justify-content: space-between; gap: 0.75rem;
	padding: 3.5rem 1rem 1rem;
	background: linear-gradient(to top, rgba(10, 10, 10, 0.82) 0%, rgba(10, 10, 10, 0.55) 55%, rgba(10, 10, 10, 0) 100%);
}
.tb-tile__name { font-weight: 750; font-size: var(--wp--preset--font-size--md); line-height: 1.15; letter-spacing: -0.015em; }
.tb-tile--lead .tb-tile__name { font-size: var(--wp--preset--font-size--xl); }
.tb-tile .tb-icon { width: 1.4em; height: 1.4em; transition: transform 0.25s var(--tb-ease); }
.tb-tile a:hover .tb-icon { transform: translateX(4px); }
.tb-tile--lead { grid-column: span 2; }

@media (max-width: 899px) {
	.tb-tiles--mosaic { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tb-tile__media { aspect-ratio: 1; }
}
@media (max-width: 520px) {
	.tb-tile--lead .tb-tile__media { aspect-ratio: 4 / 3; }
	.tb-tile__name { font-size: var(--wp--preset--font-size--sm); }
	.tb-tile__text { padding: 2.5rem 0.75rem 0.75rem; }
}

/* List variant: compact chips with thumbnails */
.tb-tiles--list { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.tb-tiles--list .tb-tile a { display: flex; align-items: center; gap: 0.9rem; background: #fff; color: var(--tb-ink); padding: 0.5rem; border: 1px solid var(--tb-line); border-radius: var(--tb-r-md); transition: border-color 0.2s, transform 0.2s var(--tb-ease); }
.tb-tiles--list .tb-tile a:hover { border-color: var(--tb-ink); transform: translateY(-2px); }
.tb-tiles--list .tb-tile__media { width: 64px; height: 64px; aspect-ratio: 1; border-radius: var(--tb-r-sm); overflow: hidden; flex: none; }
.tb-tiles--list .tb-tile__text { position: static; background: none; padding: 0; flex: 1; align-items: center; }
.tb-tiles--list .tb-tile__name { font-size: var(--wp--preset--font-size--sm); }
.tb-tiles--list .tb-icon { color: var(--tb-red); }

/* ---------- Cards ---------- */

.tb-grid { display: grid; gap: clamp(1.25rem, 1rem + 1.5vw, 2.25rem) clamp(1rem, 0.5rem + 1.5vw, 1.75rem); }
.tb-grid--recipes, .tb-grid--posts, .tb-grid--grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
.tb-grid--feature { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.tb-grid--feature .tb-card--lead { grid-column: span 2; grid-row: span 2; }
@media (max-width: 1023px) { .tb-grid--feature { grid-template-columns: repeat(2, minmax(0, 1fr)); } .tb-grid--feature .tb-card--lead { grid-row: auto; } }
@media (max-width: 599px) { .tb-grid--feature { grid-template-columns: minmax(0, 1fr); } .tb-grid--feature .tb-card--lead { grid-column: auto; } }

.tb-card { position: relative; display: flex; flex-direction: column; min-width: 0; }
.tb-card__media { position: relative; border-radius: var(--tb-r-md); overflow: hidden; aspect-ratio: 4 / 3; background: var(--tb-grey); }
.tb-card__media img, .tb-card__media .tb-photo-missing { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.6s var(--tb-ease); }
.tb-card:hover .tb-card__media img { transform: scale(1.045); }
.tb-card__body { padding-top: 1rem; display: flex; flex-direction: column; gap: 0.4rem; flex: 1; }
.tb-card__body > * { margin: 0; }
.tb-card__kicker { font-size: var(--wp--preset--font-size--xs); font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.tb-card__kicker a { position: relative; z-index: 2; color: var(--tb-red-deep); text-decoration: none; }
.tb-card__kicker a:hover { text-decoration: underline; }
.tb-card__title { font-size: var(--wp--preset--font-size--md); line-height: 1.2; letter-spacing: -0.015em; font-weight: 750; }
.tb-card__title a { color: var(--tb-ink); text-decoration: none; }
.tb-card__title a::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: var(--tb-r-md); }
.tb-card:hover .tb-card__title a { color: var(--tb-red-deep); }
.tb-card__title a:focus-visible { outline: none; }
.tb-card__title a:focus-visible::after { outline: 3px solid var(--tb-red); outline-offset: 4px; }
.tb-card__desc { color: var(--tb-muted); font-size: var(--wp--preset--font-size--sm); line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.tb-card__meta { list-style: none; padding: 0; margin-top: auto !important; padding-top: 0.4rem; display: flex; flex-wrap: wrap; gap: 0.35rem 1rem; font-size: var(--wp--preset--font-size--xs); color: var(--tb-muted); font-weight: 600; }
.tb-card__meta li { display: inline-flex; align-items: center; gap: 0.35rem; }
.tb-card__meta .tb-icon { color: var(--tb-red); }
.tb-card__date { font-size: var(--wp--preset--font-size--xs); color: var(--tb-muted); }
.tb-est { text-decoration: none; font-weight: 600; color: var(--tb-muted); cursor: help; border-bottom: 1px dotted currentColor; margin-left: 0.15em; }

/* Lead card */
.tb-card--lead .tb-card__media { aspect-ratio: 4 / 3; border-radius: var(--tb-r-lg); }
.tb-card--lead .tb-card__title { font-size: var(--wp--preset--font-size--xl); line-height: 1.05; letter-spacing: -0.025em; }
.tb-card--lead .tb-card__desc { font-size: var(--wp--preset--font-size--base); -webkit-line-clamp: 4; }
.tb-card--lead .tb-card__body { padding-top: 1.25rem; gap: 0.6rem; }
.tb-card--lead .tb-card__meta { margin-top: 0.5rem !important; }

/* Mini card (rows) */
.tb-card--mini { flex-direction: row; align-items: center; gap: 1rem; }
.tb-card--mini .tb-card__media { width: 112px; flex: none; aspect-ratio: 1; border-radius: var(--tb-r-sm); }
.tb-card--mini .tb-card__body { padding-top: 0; }
.tb-card--mini .tb-card__title { font-size: var(--wp--preset--font-size--base); }

/* Phones: grid cards become compact rows so long lists stay scannable */
@media (max-width: 599px) {
	.tb-grid--feature .tb-card--card, .tb-grid--recipes .tb-card--card, .tb-grid--posts .tb-card--card { flex-direction: row; gap: 0.9rem; align-items: flex-start; }
	.tb-grid--recipes .tb-card--card .tb-card__media, .tb-grid--posts .tb-card--card .tb-card__media { width: 112px; flex: none; aspect-ratio: 1; border-radius: var(--tb-r-sm); }
	.tb-grid--recipes .tb-card--card .tb-card__body, .tb-grid--posts .tb-card--card .tb-card__body { padding-top: 0; }
	.tb-grid--recipes .tb-card--card .tb-card__desc, .tb-grid--posts .tb-card--card .tb-card__desc { -webkit-line-clamp: 2; }
	.tb-grid--recipes, .tb-grid--posts { gap: 1.25rem; }
}

.tb-photo-missing {
	display: grid; place-items: center; width: 100%; height: 100%; min-height: 120px;
	background: var(--tb-cream); color: var(--tb-muted); font-size: var(--wp--preset--font-size--xs); font-weight: 600;
	background-image: var(--tb-flag); background-size: 64px 12px; background-repeat: no-repeat; background-position: 50% 38%;
}
.tb-photo-missing span { margin-top: 2.5rem; }

/* ---------- Finder ---------- */

.tb-finder-wrap { margin-top: 2rem; }
.tb-finder {
	display: grid; gap: 1rem; padding: clamp(1rem, 0.75rem + 1vw, 1.5rem); margin-bottom: 1.5rem;
	background: #fff; border: 1px solid var(--tb-line); border-radius: var(--tb-r-lg);
}
.tb-band--grey .tb-finder, .tb-band--cream .tb-finder { border-color: transparent; box-shadow: 0 12px 30px -24px rgba(23, 23, 23, 0.5); }
.tb-finder__filters { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 170px), 1fr)); gap: 0.85rem; }
@media (max-width: 599px) { .tb-finder__filters { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem 0.6rem; } .tb-field select { padding-left: 0.7rem; padding-right: 2rem; background-position: right 0.55rem center; font-size: 0.9375rem; } }
.tb-finder__actions { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.tb-finder__reset[hidden] { display: none; }

.tb-field { display: flex; flex-direction: column; gap: 0.35rem; min-width: 0; }
.tb-field > label { font-size: var(--wp--preset--font-size--xs); font-weight: 700; letter-spacing: 0.04em; color: var(--tb-ink); }
.tb-field input[type="text"], .tb-field input[type="email"], .tb-field input[type="search"], .tb-field textarea, .tb-field select {
	width: 100%; min-height: 48px; padding: 0.7rem 0.9rem; font: inherit; font-size: 1rem; color: var(--tb-ink);
	background: #fff; border: 1.5px solid #8a837d; border-radius: var(--tb-r-sm);
	transition: border-color 0.2s, box-shadow 0.2s;
}
.tb-field select {
	appearance: none; padding-right: 2.5rem; cursor: pointer;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23171717' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-size: 18px; background-position: right 0.8rem center;
}
.tb-field select:has(option:checked:not([value=""])) { border-color: var(--tb-ink); background-color: var(--tb-cream); font-weight: 600; }
.tb-field :is(input, textarea, select):hover { border-color: var(--tb-ink); }
.tb-field :is(input, textarea, select):focus { outline: none; border-color: var(--tb-red); box-shadow: 0 0 0 3px rgba(214, 40, 40, 0.18); }
.tb-field [aria-invalid="true"] { border-color: var(--tb-red-deep); background: #fff6f5; }
.tb-field__error { margin: 0; font-size: var(--wp--preset--font-size--xs); color: var(--tb-red-deep); font-weight: 600; }
.tb-field__error::before { content: "! "; font-weight: 800; }
.tb-field__error[hidden] { display: none; }
.tb-search-input { position: relative; }
.tb-search-input .tb-icon { position: absolute; left: 0.9rem; top: 50%; transform: translateY(-50%); color: var(--tb-muted); }
.tb-search-input input { padding-left: 2.6rem !important; }

.tb-results { transition: opacity 0.2s; }
.tb-results[aria-busy="true"] { opacity: 0.45; }
.tb-results__count { font-weight: 650; margin: 0 0 1.25rem; color: var(--tb-muted); font-size: var(--wp--preset--font-size--sm); }
.tb-results__more { margin: 2rem 0 0; }

.tb-empty { padding: clamp(1.5rem, 1rem + 2vw, 3rem); border: 2px dashed var(--tb-line); border-radius: var(--tb-r-lg); text-align: center; background: #fff; }
.tb-empty > * { margin: 0 auto; max-width: 46ch; }
.tb-empty > * + * { margin-top: 0.75rem; }
.tb-empty__title { font-weight: 750; font-size: var(--wp--preset--font-size--md); }

.tb-pagination { margin-top: 2.5rem; }
.tb-pagination ul { list-style: none; display: flex; flex-wrap: wrap; gap: 0.5rem; padding: 0; margin: 0; }
.tb-pagination :is(a, span).page-numbers {
	display: inline-grid; place-items: center; min-width: 44px; min-height: 44px; padding: 0 0.9rem;
	border: 1.5px solid var(--tb-line); border-radius: var(--tb-r-pill); text-decoration: none; color: var(--tb-ink); font-weight: 600;
}
.tb-pagination a.page-numbers:hover { border-color: var(--tb-ink); }
.tb-pagination .current { background: var(--tb-ink); border-color: var(--tb-ink); color: #fff; }

/* ---------- Home: culture, journal, newsletter, closing ---------- */

.tb-culture { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(2rem, 1rem + 4vw, 5rem); align-items: center; }
.tb-culture__title { font-size: var(--wp--preset--font-size--xxl) !important; line-height: 1; letter-spacing: -0.03em; margin-top: 0 !important; }
.tb-culture__text > * { margin-block: 0; }
.tb-culture__text > * + * { margin-top: 1.1rem; }
.tb-culture__text p { color: #e8e2db; }
.tb-culture__media { position: relative; display: grid; grid-template-columns: 1.2fr 1fr; gap: 0.9rem; align-items: end; margin: 0 !important; }
.tb-culture__media figure { margin: 0 !important; }
.tb-culture__media img { border-radius: var(--tb-r-md); object-fit: cover; width: 100%; display: block; }
.tb-culture__media figure:first-child img { aspect-ratio: 3 / 4; }
.tb-culture__media figure:last-child img { aspect-ratio: 1; }
.tb-culture__media figure:last-child { margin-bottom: 2.5rem !important; }

.tb-influences {
	list-style: none; margin: clamp(2.5rem, 2rem + 2vw, 4rem) auto 0 !important; max-width: var(--tb-wide) !important; width: 100%; padding: 2rem 0 0 !important;
	border-top: 1px solid rgba(255, 255, 255, 0.18);
	display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.75rem 2rem; counter-reset: infl;
}
.tb-influences li { counter-increment: infl; position: relative; padding-left: 2.6rem; color: var(--tb-on-ink-muted); font-size: var(--wp--preset--font-size--sm); line-height: 1.5; }
.tb-influences li::before {
	content: counter(infl, decimal-leading-zero); position: absolute; left: 0; top: 0.1rem;
	font-weight: 800; font-size: 0.95rem; color: var(--tb-red-on-ink); font-variant-numeric: tabular-nums;
}
.tb-influences strong { display: block; color: #fff; font-size: var(--wp--preset--font-size--base); margin-bottom: 0.2rem; }
@media (max-width: 999px) { .tb-influences { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 899px) { .tb-culture { grid-template-columns: 1fr; } .tb-culture__media { order: -1; } }
@media (max-width: 520px) { .tb-influences { grid-template-columns: 1fr; } }

.tb-journal { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(1.5rem, 1rem + 3vw, 4rem); align-items: start; }
.tb-journal__list { display: grid; gap: 1.5rem; }
.tb-journal__list .tb-card--mini + .tb-card--mini { padding-top: 1.5rem; border-top: 1px solid var(--tb-line); }
.tb-journal__list .tb-card__title a::after { border-radius: 0; }
@media (max-width: 899px) { .tb-journal { grid-template-columns: 1fr; } }

.tb-nl { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: clamp(2rem, 1rem + 4vw, 5rem); align-items: center; }
.tb-nl__image { margin: 0 !important; }
.tb-nl__image img { border-radius: var(--tb-r-lg); aspect-ratio: 5 / 4; object-fit: cover; width: 100%; display: block; }
.tb-nl__text > * { margin-block: 0; }
.tb-nl__text > * + * { margin-top: 1rem; }
.tb-nl__title { font-size: var(--wp--preset--font-size--xxl) !important; line-height: 1; letter-spacing: -0.03em; }
@media (max-width: 899px) { .tb-nl { grid-template-columns: 1fr; } .tb-nl__image img { aspect-ratio: 16 / 9; } }

.tb-closing { margin-block: 0 !important; min-height: clamp(380px, 60vh, 620px) !important; }
.tb-closing .wp-block-cover__inner-container { width: min(var(--tb-wide), 100%); margin-inline: auto; }
.tb-closing .wp-block-cover__inner-container > * { margin-inline: 0 !important; max-width: none; }
.tb-closing .wp-block-cover__inner-container h2 { font-size: var(--wp--preset--font-size--display) !important; line-height: 0.98; letter-spacing: -0.035em; max-width: 14ch; font-weight: 800; color: #fff; }
.tb-closing .wp-block-cover__background { background: linear-gradient(90deg, rgba(10, 10, 10, 0.86) 0%, rgba(10, 10, 10, 0.62) 50%, rgba(10, 10, 10, 0.25) 100%) !important; opacity: 1 !important; }
@media (max-width: 699px) { .tb-closing .wp-block-cover__background { background: rgba(10, 10, 10, 0.68) !important; } }

/* ---------- Newsletter form ---------- */

.tb-newsletter { display: grid; gap: 0.85rem; max-width: 560px; }
.tb-newsletter__row { display: flex; gap: 0.6rem; align-items: flex-end; }
.tb-newsletter__row .tb-field { flex: 1; }
.tb-newsletter__row .tb-btn { min-height: 48px; }
.tb-field--check { flex-direction: row; align-items: flex-start; gap: 0.65rem; flex-wrap: wrap; }
.tb-field--check input { width: 24px; height: 24px; margin: 0.15rem 0 0; accent-color: var(--tb-red); flex: none; }
.tb-field--check label { flex: 1; font-size: var(--wp--preset--font-size--xs); font-weight: 500; letter-spacing: 0; line-height: 1.5; color: var(--tb-muted); min-width: 0; }
.tb-field--check .tb-field__error { flex-basis: 100%; }
@media (max-width: 520px) { .tb-newsletter__row { flex-direction: column; align-items: stretch; } }

.tb-form__status:empty { display: none; }
.tb-form__status { padding: 0.85rem 1rem; border-radius: var(--tb-r-sm); font-weight: 600; font-size: var(--wp--preset--font-size--sm); }
.tb-form__status.is-ok { background: #edf7ee; color: #1d5b24; border-left: 4px solid #2e7d32; }
.tb-form__status.is-error { background: #fff1f0; color: var(--tb-red-deep); border-left: 4px solid var(--tb-red); }
.tb-hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }

/* ---------- Contact form ---------- */

.tb-contact { display: grid; gap: 1.1rem; max-width: 680px; padding: clamp(1.25rem, 1rem + 1.5vw, 2.25rem); background: #fff; border: 1px solid var(--tb-line); border-radius: var(--tb-r-lg); }
.tb-form__row { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.1rem; }
.tb-form__note { margin: 0; font-size: var(--wp--preset--font-size--xs); color: var(--tb-muted); }
.tb-contact .tb-btn { justify-self: start; }
.tb-contact-details p { margin: 0 0 0.5rem; }
.tb-contact-details a { display: inline-flex; align-items: center; gap: 0.5rem; }

/* ---------- Archive and term headers ---------- */

.tb-archive-head { padding-block: clamp(1.5rem, 1rem + 2vw, 3rem) 0; }
.tb-archive-head > * { margin-block: 0; }
.tb-archive-head > * + * { margin-top: 1rem; }
.tb-archive-head__title { font-size: var(--wp--preset--font-size--xxl) !important; line-height: 1; letter-spacing: -0.03em; font-weight: 800; }
.tb-archive-head .tb-searchbar { margin-top: 1.5rem; }
.tb-404 { padding-bottom: 2.5rem; }

.tb-term-header { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(1.5rem, 1rem + 3vw, 4rem); align-items: center; padding-top: 1.5rem; }
.tb-term-header__text > * { margin-block: 0; }
.tb-term-header__text > * + * { margin-top: 1rem; }
.tb-term-header__title { font-size: var(--wp--preset--font-size--xxl); line-height: 1; letter-spacing: -0.03em; font-weight: 800; }
.tb-term-header__intro { font-size: var(--wp--preset--font-size--md); color: var(--tb-muted); line-height: 1.5; }
.tb-term-header__media { border-radius: var(--tb-r-lg); overflow: hidden; aspect-ratio: 3 / 2; }
.tb-term-header__media img, .tb-term-header__media .tb-photo-missing { width: 100%; height: 100%; object-fit: cover; display: block; }
.tb-term-description { max-width: 70ch; margin-top: 1.5rem; }
@media (max-width: 799px) { .tb-term-header { grid-template-columns: 1fr; } .tb-term-header__media { order: -1; aspect-ratio: 16 / 9; } }

.tb-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; margin-top: 1.5rem; }
.tb-chips__label { font-size: var(--wp--preset--font-size--xs); font-weight: 700; color: var(--tb-muted); }
.tb-chips ul { list-style: none; display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0; padding: 0; }
.tb-chips a {
	display: inline-flex; align-items: center; min-height: 40px; padding: 0.45rem 0.95rem; border-radius: var(--tb-r-pill);
	border: 1.5px solid var(--tb-line); color: var(--tb-ink); text-decoration: none; font-size: var(--wp--preset--font-size--sm); font-weight: 600;
	transition: border-color 0.2s, background-color 0.2s, color 0.2s;
}
.tb-chips a:hover { border-color: var(--tb-ink); }
.tb-chips a[aria-current] { background: var(--tb-ink); border-color: var(--tb-ink); color: #fff; }
.tb-blog .tb-chips { margin: 0 0 2rem; }
.tb-blog { margin-top: 2rem; padding-bottom: var(--tb-section); }
.tb-blogsearch { max-width: 520px; margin-top: 1.5rem !important; }
.tb-blogsearch .wp-block-search__inside-wrapper { border: 2px solid var(--tb-ink); border-radius: var(--tb-r-pill); padding: 0.25rem; background: #fff; }
.tb-blogsearch .wp-block-search__input { border: 0; background: transparent; padding-inline: 1rem; font: inherit; min-height: 44px; }
.tb-blogsearch .wp-block-search__button { border-radius: var(--tb-r-pill); margin: 0; background: var(--tb-red); color: #fff; padding-inline: 1.25rem; min-height: 44px; }
.tb-grid--posts { margin-top: 0; }
@media (min-width: 900px) { .tb-grid--posts { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 600px) and (max-width: 899px) { .tb-grid--posts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.tb-more-recipes { margin-top: clamp(3rem, 2rem + 3vw, 5rem); padding-top: 2.5rem; border-top: 1px solid var(--tb-line); }
.tb-more-recipes .tb-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); }
.tb-grid--posts .tb-card--lead { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 2rem; align-items: center; }
.tb-grid--posts .tb-card--lead .tb-card__body { padding-top: 0; }
@media (max-width: 799px) { .tb-grid--posts .tb-card--lead { grid-template-columns: 1fr; gap: 0; } .tb-grid--posts .tb-card--lead .tb-card__body { padding-top: 1.1rem; } }

.tb-band--split { padding-block: clamp(2.5rem, 2rem + 3vw, 4.5rem); }
.tb-cta-inline { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1rem 3rem; align-items: center; }
.tb-cta-inline > * { margin: 0 !important; }
.tb-cta-inline .tb-section-title { margin: 0; }
.tb-cta-inline .wp-block-buttons { grid-column: 2; grid-row: 1 / span 2; }
@media (max-width: 699px) { .tb-cta-inline { grid-template-columns: 1fr; } .tb-cta-inline .wp-block-buttons { grid-column: 1; grid-row: auto; } }

/* ---------- Page and article ---------- */

.tb-page-head { padding-block: clamp(1.5rem, 1rem + 2vw, 3rem) 0.5rem; }
.tb-page-title { font-size: var(--wp--preset--font-size--xxl); line-height: 1.02; letter-spacing: -0.03em; font-weight: 800; }
.tb-page-content { padding-bottom: var(--tb-section); }
.tb-prose { font-size: var(--wp--preset--font-size--base); }
.tb-prose > * { margin-block: 0; }
.tb-prose > * + * { margin-top: 1.15em; }
.tb-prose > h2 { margin-top: 2.2em; font-size: var(--wp--preset--font-size--xl); }
.tb-prose > h3 { margin-top: 1.8em; }
.tb-prose a { text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
.tb-prose a:hover { text-decoration-thickness: 2px; }
.tb-prose ul, .tb-prose ol { padding-left: 1.3em; }
.tb-prose li + li { margin-top: 0.4em; }
.tb-prose li::marker { color: var(--tb-red); font-weight: 700; }
.tb-prose figure img { border-radius: var(--tb-r-md); }
.tb-prose figcaption { font-size: var(--wp--preset--font-size--xs); color: var(--tb-muted); }
.tb-prose .wp-block-table table { border-collapse: collapse; width: 100%; font-size: var(--wp--preset--font-size--sm); }
.tb-prose .wp-block-table :is(th, td) { border: 1px solid var(--tb-line); padding: 0.6rem 0.8rem; text-align: left; vertical-align: top; }
.tb-prose .wp-block-table th { background: var(--tb-cream); }

.tb-article { padding-bottom: var(--tb-section); }
.tb-article__head { padding-top: clamp(1.5rem, 1rem + 2vw, 3rem); }
.tb-article__head > * { margin-block: 0; }
.tb-article__head > * + * { margin-top: 1rem; }
.tb-article__title { font-size: var(--wp--preset--font-size--xxl); line-height: 1.02; letter-spacing: -0.03em; font-weight: 800; }
.tb-kicker { font-size: var(--wp--preset--font-size--xs); font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.tb-kicker a { display: inline-block; padding-block: 0.35rem; color: var(--tb-red-deep); text-decoration: none; }
.tb-byline { gap: 0.4rem 1rem; font-size: var(--wp--preset--font-size--xs); color: var(--tb-muted); margin-top: 1.25rem !important; }
.tb-byline > * { margin: 0; }
.tb-byline > * + *::before { content: "·"; margin-right: 1rem; color: var(--tb-line); font-weight: 800; }
.tb-updated::before { content: "· Updated " !important; color: var(--tb-muted); font-weight: 400; }
.tb-article__image { margin-block: 2rem 2.5rem !important; }
.tb-article__image img { border-radius: var(--tb-r-lg); aspect-ratio: 16 / 9; object-fit: cover; }
.tb-tags { margin-top: 2.5rem !important; font-size: var(--wp--preset--font-size--sm); color: var(--tb-muted); }

/* Editorial building blocks used in page content */
.tb-intro-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(1.5rem, 1rem + 4vw, 5rem); align-items: center; padding-block: clamp(1.5rem, 1rem + 3vw, 4rem) clamp(2.5rem, 2rem + 3vw, 5rem); }
.tb-intro-hero > * { margin: 0 !important; }
.tb-intro-hero__text > * { margin-block: 0; }
.tb-intro-hero__text > * + * { margin-top: 1.1rem; }
.tb-intro-hero h1 { font-size: var(--wp--preset--font-size--xxl); line-height: 1; letter-spacing: -0.035em; font-weight: 800; }
.tb-intro-hero__image img { border-radius: var(--tb-r-lg); aspect-ratio: 4 / 3; object-fit: cover; width: 100%; display: block; }
@media (max-width: 799px) { .tb-intro-hero { grid-template-columns: 1fr; } .tb-intro-hero__image { order: -1; } .tb-intro-hero__image img { aspect-ratio: 16 / 10; } }

.tb-toc { position: sticky; top: calc(var(--tb-header-h) + var(--wp-admin--admin-bar--height, 0px)); z-index: 5; background: rgba(255, 255, 255, 0.97); border-block: 1px solid var(--tb-line); padding-block: 0.6rem !important; margin-block: 0 !important; }
.tb-toc ul { list-style: none; display: flex; gap: 0.5rem; overflow-x: auto; margin: 0 auto; padding: 0.15rem 0; scrollbar-width: none; max-width: var(--tb-wide); }
.tb-toc ul::-webkit-scrollbar { display: none; }
.tb-toc li { flex: none; }
.tb-toc a { display: inline-flex; min-height: 40px; align-items: center; padding: 0.4rem 0.9rem; border-radius: var(--tb-r-pill); font-size: var(--wp--preset--font-size--sm); font-weight: 600; color: var(--tb-ink); text-decoration: none; white-space: nowrap; }
.tb-toc a:hover, .tb-toc a.is-active { background: var(--tb-ink); color: #fff; }

.tb-story { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(1.5rem, 1rem + 4vw, 5rem); align-items: start; padding-block: clamp(3rem, 2rem + 4vw, 6rem); border-bottom: 1px solid var(--tb-line); }
.tb-story > * { margin: 0 !important; }
.tb-story:nth-of-type(even) .tb-story__media { order: 2; }
.tb-story__media { position: sticky; top: calc(var(--tb-header-h) + 5rem); }
.tb-story__media img { border-radius: var(--tb-r-lg); aspect-ratio: 4 / 5; object-fit: cover; width: 100%; display: block; }
.tb-story__media figcaption { font-size: var(--wp--preset--font-size--xs); color: var(--tb-muted); margin-top: 0.6rem; }
.tb-story__text > * { margin-block: 0; }
.tb-story__text > * + * { margin-top: 1.1em; }
.tb-story__text h2 { font-size: var(--wp--preset--font-size--xl); }
.tb-story__num { font-size: clamp(2.75rem, 2rem + 2.5vw, 4.25rem); line-height: 0.9; font-weight: 800; letter-spacing: -0.04em; color: var(--tb-red); font-variation-settings: "opsz" 96; }
.tb-story__text .tb-story__num + h2 { margin-top: 0.5rem; }
.tb-story__recipes { margin-top: 1.75rem !important; padding: 1.25rem; background: var(--tb-cream); border-radius: var(--tb-r-md); }
.tb-story__recipes > p { margin: 0 0 0.75rem; font-weight: 700; font-size: var(--wp--preset--font-size--sm); }
.tb-story__recipes .tb-grid { gap: 0.85rem; grid-template-columns: 1fr; }
.tb-story__recipes .tb-card--mini .tb-card__media { width: 72px; }
@media (max-width: 799px) {
	.tb-story { grid-template-columns: 1fr; }
	.tb-story:nth-of-type(even) .tb-story__media { order: 0; }
	.tb-story__media { position: static; }
	.tb-story__media img { aspect-ratio: 16 / 10; }
}

.tb-steps-row { counter-reset: tbstep; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 1.5rem 2rem; list-style: none; padding: 0 !important; }
.tb-steps-row > li { counter-increment: tbstep; position: relative; padding-top: 3.25rem; }
.tb-steps-row > li::before { content: counter(tbstep); position: absolute; top: 0; left: 0; font-size: 2.75rem; line-height: 1; font-weight: 800; color: var(--tb-red); font-variation-settings: "opsz" 96; }
.tb-steps-row strong { display: block; font-size: var(--wp--preset--font-size--md); margin-bottom: 0.3rem; }

.tb-pantry { columns: 2 260px; column-gap: 2.5rem; list-style: none; padding: 0 !important; }
.tb-pantry li { break-inside: avoid; padding: 0.8rem 0; border-bottom: 1px solid var(--tb-line); margin: 0 !important; }
.tb-pantry strong { display: block; }

.tb-shop { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: clamp(1.5rem, 1rem + 3vw, 4rem); align-items: center; }
.tb-shop > * { margin: 0 !important; }
.tb-shop__image img { border-radius: var(--tb-r-lg); aspect-ratio: 1; object-fit: cover; width: 100%; }
.tb-shop__image figcaption { font-size: var(--wp--preset--font-size--xs); color: var(--tb-muted); }
@media (max-width: 799px) { .tb-shop { grid-template-columns: 1fr; } .tb-shop__image img { aspect-ratio: 16 / 10; } }
.tb-checklist-plain { list-style: none; padding: 0 !important; columns: 2 220px; column-gap: 2rem; }
.tb-checklist-plain li { break-inside: avoid; padding: 0.45rem 0 0.45rem 1.9rem; position: relative; margin: 0 !important; }
.tb-checklist-plain li::before { content: ""; position: absolute; left: 0; top: 0.65rem; width: 1.1rem; height: 1.1rem; border: 2px solid var(--tb-ink); border-radius: 4px; }

.tb-placeholder { border: 2px dashed var(--tb-red); background: #fff6f5; border-radius: var(--tb-r-md); padding: 1rem 1.25rem !important; }
.tb-placeholder::before { content: "Placeholder: replace before launch"; display: block; font-size: var(--wp--preset--font-size--xs); font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--tb-red-deep); margin-bottom: 0.4rem; }
.tb-draft-note { background: var(--tb-cream); border-left: 4px solid var(--tb-red); padding: 1rem 1.25rem !important; border-radius: 0 var(--tb-r-sm) var(--tb-r-sm) 0; font-size: var(--wp--preset--font-size--sm); }

.tb-review { background: #fff8e1; border: 1px solid #f0c36d; border-left: 5px solid #e0a100; border-radius: var(--tb-r-sm); padding: 0.9rem 1.1rem; font-size: var(--wp--preset--font-size--sm); margin-bottom: 1.5rem !important; }
.tb-review p { margin: 0; }
.tb-review p + p { margin-top: 0.4rem; }
.tb-disclosure { font-size: var(--wp--preset--font-size--sm); background: var(--tb-grey); padding: 0.75rem 1rem; border-radius: var(--tb-r-sm); }

/* ---------- Recipe page ---------- */

.tb-recipe-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(1.5rem, 1rem + 4vw, 4.5rem); align-items: center; padding-block: clamp(1.25rem, 1rem + 2vw, 3rem) clamp(2rem, 1.5rem + 2vw, 3.5rem); }
.tb-recipe-hero > * { margin: 0 !important; }
.tb-recipe-hero__text > * { margin-block: 0; }
.tb-recipe-hero__text > * + * { margin-top: 1rem; }
.tb-recipe-hero__title { font-size: var(--wp--preset--font-size--xxl); line-height: 1; letter-spacing: -0.035em; font-weight: 800; }
.tb-recipe-hero__image img { border-radius: var(--tb-r-lg); aspect-ratio: 4 / 3; object-fit: cover; width: 100%; display: block; }
@media (max-width: 799px) {
	.tb-recipe-hero { grid-template-columns: 1fr; padding-top: 0.75rem; }
	.tb-recipe-hero__image { order: -1; }
	.tb-recipe-hero__image img { aspect-ratio: 16 / 10; }
}

.tb-summary > * { margin-block: 0; }
.tb-summary > * + * { margin-top: 1.1rem; }
.tb-summary__kicker { order: -1; }
.tb-summary__kicker a { font-size: var(--wp--preset--font-size--xs); font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--tb-red-deep); text-decoration: none; }
.tb-summary__facts { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; font-weight: 650; font-size: var(--wp--preset--font-size--sm); }
.tb-summary__facts li { display: inline-flex; align-items: center; gap: 0.4rem; }
.tb-summary__facts .tb-icon { color: var(--tb-red); }
.tb-summary__actions { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.tb-recipe-hero__text { display: flex; flex-direction: column; }
.tb-recipe-hero__text .tb-summary { display: contents; }
.tb-recipe-hero__text .tb-summary__kicker { order: -1; margin: 0 0 -0.25rem; }

.tb-headnote { padding-bottom: 2.5rem; }

.tb-recipe {
	background: #fff; border: 2px solid var(--tb-ink); border-radius: var(--tb-r-lg);
	padding: clamp(1.25rem, 0.75rem + 2.5vw, 3rem); margin-block: 0 var(--tb-section) !important; position: relative;
}
.tb-recipe::before { content: ""; position: absolute; top: -2px; left: clamp(1.25rem, 0.75rem + 2.5vw, 3rem); width: 88px; height: 10px; background: var(--tb-flag); border-radius: 0 0 3px 3px; }
.tb-recipe__head { border-bottom: 1px solid var(--tb-line); padding-bottom: 1.5rem; }
.tb-recipe__head > * { margin-block: 0; }
.tb-recipe__head > * + * { margin-top: 1rem; }
.tb-recipe__title { font-size: var(--wp--preset--font-size--xl); letter-spacing: -0.025em; }
.tb-recipe__facts { display: flex; flex-wrap: wrap; gap: 0.75rem; margin: 0; }
.tb-recipe__facts > div { background: var(--tb-cream); border-radius: var(--tb-r-sm); padding: 0.6rem 1rem; min-width: 96px; }
.tb-recipe__facts dt { font-size: var(--wp--preset--font-size--xs); font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--tb-muted); }
.tb-recipe__facts dd { margin: 0.1rem 0 0; font-weight: 750; font-size: var(--wp--preset--font-size--md); }
@media (max-width: 599px) {
	.tb-recipe { padding: 1.25rem 1rem; }
	.tb-recipe__facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.5rem; }
	.tb-recipe__facts > div { min-width: 0; padding: 0.5rem 0.65rem; }
	.tb-recipe__facts dd { font-size: var(--wp--preset--font-size--sm); }
}
.tb-recipe__estimate { font-size: var(--wp--preset--font-size--sm); color: var(--tb-muted); padding-left: 0.85rem; border-left: 3px solid var(--tb-red); }
.tb-recipe__tools { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1.5rem; }
.tb-recipe__scale-note { font-size: var(--wp--preset--font-size--xs); color: var(--tb-muted); }
.tb-recipe__scale-note[hidden], .tb-servings[hidden], [data-tb-print][hidden], [data-tb-clear-checks][hidden] { display: none !important; }
.tb-servings { display: inline-flex; align-items: center; gap: 0.6rem; }
.tb-servings__label { font-weight: 700; font-size: var(--wp--preset--font-size--sm); margin-right: 0.25rem; }
.tb-servings__value { min-width: 2ch; text-align: center; font-weight: 800; font-size: var(--wp--preset--font-size--md); font-variant-numeric: tabular-nums; }

.tb-recipe__body { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: clamp(1.5rem, 1rem + 3vw, 4rem); padding-top: 1.75rem; }
.tb-recipe__body h3 { font-size: var(--wp--preset--font-size--lg); margin: 0; }
.tb-recipe__body h4 { font-size: var(--wp--preset--font-size--sm); text-transform: uppercase; letter-spacing: 0.08em; color: var(--tb-red-deep); margin: 1.5rem 0 0.5rem; }
.tb-recipe__subhead { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; }
.tb-recipe__hint { font-size: var(--wp--preset--font-size--xs); color: var(--tb-muted); margin: 0.35rem 0 0.5rem; }
.tb-recipe__ingredients { align-self: start; }
@media (max-width: 860px) { .tb-recipe__body { grid-template-columns: 1fr; } }

.tb-checklist { list-style: none; margin: 0; padding: 0; }
.tb-checklist li { display: flex; align-items: flex-start; gap: 0.75rem; padding: 0.55rem 0; border-bottom: 1px solid var(--tb-line); }
.tb-checklist input {
	appearance: none; flex: none; width: 24px; height: 24px; margin: 0.1rem 0 0; border: 2px solid var(--tb-ink); border-radius: 6px;
	background: #fff; cursor: pointer; display: grid; place-items: center; transition: background-color 0.15s, border-color 0.15s;
}
.tb-checklist input::after { content: ""; width: 12px; height: 7px; border: solid #fff; border-width: 0 0 3px 3px; transform: rotate(-45deg) translate(1px, -1px) scale(0); transition: transform 0.15s var(--tb-ease); }
.tb-checklist input:checked { background: var(--tb-red); border-color: var(--tb-red); }
.tb-checklist input:checked::after { transform: rotate(-45deg) translate(1px, -1px) scale(1); }
.tb-checklist label { cursor: pointer; line-height: 1.45; flex: 1; }
.tb-checklist input:checked + label { color: var(--tb-muted); text-decoration: line-through; text-decoration-color: rgba(23, 23, 23, 0.35); }
.tb-qty { font-weight: 750; }
.tb-qty.is-scaled { color: var(--tb-red-deep); }

.tb-steps { list-style: none; counter-reset: step; margin: 1rem 0 0; padding: 0; }
.tb-steps li { counter-increment: step; position: relative; padding: 0 0 1.4rem 3.25rem; line-height: 1.6; }
.tb-steps li::before {
	content: counter(step); position: absolute; left: 0; top: -0.05rem; width: 2.2rem; height: 2.2rem; display: grid; place-items: center;
	border-radius: 50%; background: var(--tb-ink); color: #fff; font-weight: 800; font-size: 0.95rem; font-variant-numeric: tabular-nums;
}
.tb-steps li:not(:last-child)::after { content: ""; position: absolute; left: 1.08rem; top: 2.4rem; bottom: 0.3rem; width: 2px; background: var(--tb-line); }

.tb-recipe__extras { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 1rem; margin-top: 2rem; }
.tb-recipe__extra { background: var(--tb-cream); border-radius: var(--tb-r-md); padding: 1.25rem 1.4rem; }
.tb-recipe__extra h3 { font-size: var(--wp--preset--font-size--md); margin: 0 0 0.6rem; }
.tb-recipe__extra ul { margin: 0; padding-left: 1.1rem; font-size: var(--wp--preset--font-size--sm); }
.tb-recipe__extra li + li { margin-top: 0.4rem; }
.tb-recipe__extra li::marker { color: var(--tb-red); }
.tb-recipe__print-source { display: none; }

/* ---------- Footer ---------- */

.tb-footer { background: var(--tb-ink); color: #e9e4de; padding-block: clamp(3rem, 2rem + 4vw, 5.5rem) 1.5rem; margin-top: 0 !important; }
.tb-footer a { color: #fff; }
.tb-footer__top { display: grid; grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr)); gap: 2.5rem clamp(1.5rem, 1rem + 2vw, 3.5rem); }
.tb-footer__brand > * { margin-block: 0; }
.tb-footer__brand > * + * { margin-top: 1rem; }
.tb-footer__tagline { font-weight: 750; font-size: var(--wp--preset--font-size--md); color: #fff; letter-spacing: -0.01em; }
.tb-footer__about { font-size: var(--wp--preset--font-size--sm); color: var(--tb-on-ink-muted); max-width: 44ch; }
.tb-footer__heading { font-size: var(--wp--preset--font-size--xs) !important; letter-spacing: 0.14em; text-transform: uppercase; color: var(--tb-on-ink-muted); margin: 0 0 1rem !important; font-weight: 700; }
.tb-footer__col > * { margin-block: 0; }
.tb-footer__links, .tb-termlinks { list-style: none; padding: 0; margin: 0; display: grid; gap: 0.15rem; font-size: var(--wp--preset--font-size--sm); }
.tb-footer__links a, .tb-termlinks a { display: inline-block; padding-block: 0.35rem; }
.tb-footer .tb-newsletter { margin-top: 1.75rem; }
.tb-footer .tb-field > label { color: #fff; }
.tb-footer .tb-field--check label { color: var(--tb-on-ink-muted); }
.tb-footer .tb-field input[type="email"] { background: #262626; border-color: #6d6762; color: #fff; }
.tb-footer .tb-field input::placeholder { color: #a39c95; }
.tb-footer .tb-field__error { color: var(--tb-red-on-ink); }
.tb-footer .tb-form__status.is-ok { background: #1f3322; color: #c8ecca; }
.tb-footer .tb-form__status.is-error { background: #3a1d1b; color: #ffd2cd; }
.tb-social { list-style: none; padding: 0; margin: 1rem 0 0; display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; font-size: var(--wp--preset--font-size--sm); }
.tb-social a { display: inline-flex; align-items: center; gap: 0.45rem; padding-block: 0.35rem; }
.tb-contact-details { font-size: var(--wp--preset--font-size--sm); }
.tb-footer__bottom { margin-top: clamp(2.5rem, 2rem + 2vw, 4rem) !important; padding-top: 1.5rem; border-top: 1px solid rgba(255, 255, 255, 0.14); gap: 0.75rem 2rem; font-size: var(--wp--preset--font-size--xs); color: var(--tb-on-ink-muted); align-items: center; }
.tb-footer__bottom > * { margin: 0; }
.tb-footer__legal { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 0.25rem 1.25rem; }
.tb-footer__legal a { display: inline-block; padding-block: 0.4rem; }
.tb-totop a { display: inline-flex; align-items: center; gap: 0.4rem; font-weight: 650; padding: 0.5rem 0.9rem; border: 1.5px solid rgba(255, 255, 255, 0.3); border-radius: var(--tb-r-pill); background-image: none !important; }
.tb-totop a:hover { border-color: #fff; }
@media (max-width: 999px) { .tb-footer__top { grid-template-columns: repeat(3, minmax(0, 1fr)); } .tb-footer__brand { grid-column: 1 / -1; } }
@media (max-width: 599px) { .tb-footer__top { grid-template-columns: 1fr 1fr; } .tb-footer__col:last-child { grid-column: 1 / -1; } }

/* ---------- Motion ---------- */

@media (prefers-reduced-motion: no-preference) {
	.js .tb-reveal { opacity: 0; transform: translateY(18px); transition: opacity 0.7s var(--tb-ease), transform 0.7s var(--tb-ease); }
	.js .tb-reveal.is-visible { opacity: 1; transform: none; }
	.tb-card, .tb-tiles--list .tb-tile a { transition: transform 0.3s var(--tb-ease); }
	.tb-grid--recipes .tb-card:hover, .tb-grid--posts .tb-card:hover { transform: translateY(-4px); }
}
/*
 * Page-to-page transitions. Browsers with cross-document view transitions (Chrome, Edge, Safari 18.2+)
 * fade the page out and the next one up; the header is its own layer so it stays put instead of
 * flashing. Other browsers navigate normally.
 */
@media (prefers-reduced-motion: no-preference) {
	@view-transition { navigation: auto; }
	.tb-site-header { view-transition-name: tb-header; }
	::view-transition-old(root) { animation: tb-page-out 0.2s var(--tb-ease) both; }
	::view-transition-new(root) { animation: tb-page-in 0.35s 0.05s var(--tb-ease) both; }
}
@keyframes tb-page-out { to { opacity: 0; transform: translateY(-6px); } }
@keyframes tb-page-in { from { opacity: 0; transform: translateY(12px); } }

/* Reading progress on recipes and articles: a red line under the header, driven by the scroll itself. */
@supports (animation-timeline: scroll()) {
	.single-tr_recipe .tb-header, .single-post .tb-header { position: relative; }
	.single-tr_recipe .tb-header::after, .single-post .tb-header::after {
		content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; background: var(--tb-red);
		transform-origin: left center; transform: scaleX(0);
		animation: tb-progress linear both; animation-timeline: scroll(root);
	}
}
@keyframes tb-progress { to { transform: scaleX(1); } }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}