/**
 * TBH Kitchen — theme.
 *
 * Tokens are declared in the plugin's menu.css so the ordering UI is styled
 * even if the theme is swapped. This file layers the site chrome and page
 * sections on top.
 */

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

:root {
	/* Consumed by the plugin's sticky category bar so it docks directly
	   beneath the header. Must match .tbh-header__inner height. */
	--tbh-header-h: 88px;

	/* Container scale. Wider than the earlier 1180/1000 so sections breathe
	   on large screens rather than sitting in a narrow column. */
	--tbh-wide: 1320px;
	--tbh-mid: 1140px;
	--tbh-gutter: 28px;
}

@media (max-width: 900px) {
	:root {
		--tbh-header-h: 74px;
		/* 24px, not 20px: this is the gutter the menu rows were designed
		   against at 375px, and the cart and checkout now share it. */
		--tbh-gutter: 24px;
	}
}

body {
	margin: 0;
	background: var(--tbh-cream, #FCFAF5);
	color: var(--tbh-charcoal, #2D1411);
	font-family: var(--tbh-sans, sans-serif);
	font-size: 16px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}

* {
	box-sizing: border-box;
}

img {
	max-width: 100%;
	height: auto;
}

a {
	color: var(--tbh-green, #4B1612);
}

h1, h2, h3, h4 {
	font-family: var(--tbh-serif, serif);
	font-weight: 600;
	line-height: 1.18;
	color: var(--tbh-green, #4B1612);
	letter-spacing: .005em;
}

.tbh-skip {
	position: absolute;
	left: -9999px;
	top: 0;
	background: var(--tbh-green, #4B1612);
	color: #fff;
	padding: 12px 20px;
	z-index: 2000;
}

.tbh-skip:focus {
	left: 8px;
	top: 8px;
}

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

/* ---------------------------------------------------------------
 * Closed banner
 *
 * Shown site-wide outside opening hours, above everything else, so a
 * customer learns the kitchen is shut before building an order rather
 * than at the checkout. Deliberately the loudest thing on the page while
 * it is there.
 * ------------------------------------------------------------- */

.tbh-closed-banner {
	background: var(--tbh-chilli, #B23A22);
	color: #fff;
	text-align: center;
	padding: 11px 20px;
	font-size: .86rem;
	line-height: 1.45;
	font-family: var(--tbh-sans, sans-serif);
}

.tbh-closed-banner strong {
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
	margin-right: 6px;
}

/* ---------------------------------------------------------------
 * Top bar
 * ------------------------------------------------------------- */

.tbh-topbar {
	background: var(--tbh-green-deep, #310E0C);
	color: rgba(255, 255, 255, .82);
	font-size: .74rem;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.tbh-topbar__inner {
	max-width: var(--tbh-wide);
	margin: 0 auto;
	padding: 7px 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

.tbh-topbar__phone {
	color: var(--tbh-gold-light, #DCB674);
	text-decoration: none;
	font-weight: 600;
	white-space: nowrap;
	flex-shrink: 0;
}

/* Below 520px the phone number and the offer compete for one line and the
   offer gets truncated. The number is still in the footer, on the Contact
   page and in the mobile menu, so the offer wins the header. */
@media (max-width: 519px) {
	.tbh-topbar__phone {
		display: none;
	}
}

/* Offers.
 *
 * Mobile has room for one line, so the three messages take turns in a
 * fixed-height window — no layout shift, and each gets full attention.
 * Desktop shows them together: with the space available, rotating text
 * would be motion the reader did not ask for. */
.tbh-topbar__offers {
	position: relative;
	flex: 1 1 auto;
	min-width: 0;
	height: 1.25em;
	overflow: hidden;
}

/* min-width:0 lets the flex item shrink instead of overflowing its
   container, which was truncating "11:00 – 23:00" to "11:00 – 23:". */
.tbh-topbar__offer {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	gap: 5px;
	min-width: 0;
	white-space: nowrap;
	opacity: 0;
	animation: tbh-offer-cycle 12s infinite;
}

.tbh-topbar__offer:nth-child(2) {
	animation-delay: 4s;
}

.tbh-topbar__offer:nth-child(3) {
	animation-delay: 8s;
}

.tbh-topbar__offer strong {
	color: var(--tbh-gold, #C7891E);
	font-weight: 700;
}

@keyframes tbh-offer-cycle {
	0%, 2%    { opacity: 0; transform: translateY(6px); }
	5%, 30%   { opacity: 1; transform: translateY(0); }
	33%, 100% { opacity: 0; transform: translateY(-6px); }
}

@media (min-width: 860px) {
	.tbh-topbar__offers {
		height: auto;
		display: flex;
		align-items: center;
		gap: 22px;
	}

	.tbh-topbar__offer {
		position: static;
		opacity: 1;
		animation: none;
		transform: none;
	}

	/* Hairline separators between offers, in place of bullets. */
	.tbh-topbar__offer + .tbh-topbar__offer {
		padding-left: 22px;
		border-left: 1px solid rgba(255, 255, 255, .18);
	}
}

/* Rotation is decorative; without it the first offer simply stays put. */
@media (prefers-reduced-motion: reduce) {
	.tbh-topbar__offer {
		animation: none;
		opacity: 0;
	}

	.tbh-topbar__offer:first-child {
		opacity: 1;
	}
}

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

.tbh-header {
	position: sticky;
	top: 0;
	z-index: 100;
	background: var(--tbh-cream, #FCFAF5);
	border-bottom: 1px solid var(--tbh-line, #EFDEC0);
}

.tbh-header.is-stuck {
	box-shadow: 0 2px 16px rgba(75, 22, 18, .08);
}

.tbh-header__inner {
	max-width: var(--tbh-wide);
	margin: 0 auto;
	padding: 0 20px;
	height: 88px;
	display: flex;
	align-items: center;
	gap: 20px;
}

@media (max-width: 900px) {
	.tbh-header__inner {
		height: 74px;
		gap: 10px;
	}
}

/* Logo. Line art on transparency, so it needs no container — it sits
   directly on the cream header. */
.tbh-logo {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
	line-height: 1;
}

/* The !important is load-bearing, not laziness.
 *
 * WooCommerce ships `.woocommerce img, .woocommerce-page img { height: auto }`
 * and its stylesheet is enqueued after the theme's. That selector scores
 * 0,1,1 against this rule's 0,1,0, so on any WooCommerce page — cart,
 * checkout, account — it won and the logo fell back to its intrinsic
 * 399x104, overflowing the header. The homepage carries no
 * .woocommerce-page body class, which is why it looked correct there and
 * broke only on the cart. Verified via CDP getMatchedStylesForNode. */
.tbh-logo__img {
	/* The 2026 mark is line art on transparency at roughly 3.32:1, so it
	   sits directly on the cream header — no chip, no radius, no shadow.
	   The elephant is drawn in hairline strokes that vanish when scaled
	   down, so this runs larger than the old solid block did and the
	   header grows to match. */
	height: 58px !important;
	width: auto !important;
	max-width: none;
	display: block;
	object-fit: contain;
}

/* These carry !important to match the base rule above — without it the
   unqualified base declaration would outrank them. */
@media (max-width: 900px) {
	.tbh-logo__img {
		height: 48px !important;
	}
}

@media (max-width: 400px) {
	.tbh-logo__img {
		height: 40px !important;
	}
}

/* Footer logo sits on deep maroon, so it uses the light variant with the
   wordmark lifted to cream — the maroon wordmark of the header version
   would disappear against that ground. Same WooCommerce img override
   applies, hence the same !important guard. */
.tbh-footer__logo-img {
	height: 56px !important;
	width: auto !important;
	max-width: none;
	display: block;
	object-fit: contain;
	margin-bottom: 14px;
}

.tbh-logo__text {
	display: flex;
	flex-direction: column;
	gap: 1px;
}

.tbh-logo__name {
	font-family: var(--tbh-serif, serif);
	font-size: 1.28rem;
	font-weight: 700;
	color: var(--tbh-green, #4B1612);
	letter-spacing: .06em;
	text-transform: uppercase;
	line-height: 1;
}

.tbh-logo__sub {
	font-size: .58rem;
	letter-spacing: .22em;
	text-transform: uppercase;
	color: var(--tbh-gold, #C7891E);
	font-weight: 600;
}

/* Nav */

.tbh-nav {
	margin-left: auto;
	display: none;
}

.tbh-nav__list {
	display: flex;
	align-items: center;
	gap: 30px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.tbh-nav__link,
.tbh-nav__list a {
	font-size: .84rem;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--tbh-charcoal, #2D1411);
	text-decoration: none;
	padding: 6px 0;
	position: relative;
	transition: color .16s ease;
}

.tbh-nav__list a::after {
	content: "";
	position: absolute;
	left: 0;
	right: 100%;
	bottom: 0;
	height: 1.5px;
	background: var(--tbh-gold, #C7891E);
	transition: right .22s ease;
}

.tbh-nav__list a:hover::after,
.tbh-nav__list a:focus-visible::after,
.tbh-nav__list .current-menu-item > a::after {
	right: 0;
}

.tbh-nav__list a:hover,
.tbh-nav__list .current-menu-item > a {
	color: var(--tbh-green, #4B1612);
}

/* Header actions */

.tbh-header__actions {
	margin-left: auto;
	display: flex;
	align-items: center;
	gap: 10px;
}

@media (min-width: 900px) {
	.tbh-header__actions {
		margin-left: 0;
	}
}

.tbh-header__order {
	display: none;
	padding: 9px 20px;
	background: var(--tbh-green, #4B1612);
	color: var(--tbh-gold-light, #DCB674);
	border-radius: 999px;
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .03em;
	text-decoration: none;
	transition: background .18s ease;
}

.tbh-header__order:hover,
.tbh-header__order:focus-visible {
	background: var(--tbh-green-mid, #6E2A21);
	color: var(--tbh-gold-light, #DCB674);
}

/* Cart button */

.tbh-header__cart {
	position: relative;
	width: 44px;
	height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: none;
	background: transparent;
	color: var(--tbh-green, #4B1612);
	cursor: pointer;
	border-radius: 50%;
	transition: background .16s ease;
}

.tbh-header__cart:hover,
.tbh-header__cart:focus-visible {
	background: rgba(75, 22, 18, .07);
}

.tbh-cart-count {
	position: absolute;
	top: 4px;
	right: 2px;
	min-width: 19px;
	height: 19px;
	padding: 0 5px;
	background: var(--tbh-gold, #C7891E);
	color: var(--tbh-green-deep, #310E0C);
	border-radius: 999px;
	font-size: .68rem;
	font-weight: 800;
	line-height: 19px;
	text-align: center;
	font-variant-numeric: tabular-nums;
	transition: transform .18s cubic-bezier(.34, 1.56, .64, 1);
}

.tbh-cart-count.is-empty {
	display: none;
}

.tbh-cart-count.is-bump {
	transform: scale(1.32);
}

/* Burger */

.tbh-burger {
	width: 44px;
	height: 44px;
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4.5px;
	border: none;
	background: transparent;
	cursor: pointer;
	border-radius: 50%;
}

.tbh-burger__bar {
	display: block;
	width: 20px;
	height: 1.8px;
	background: var(--tbh-green, #4B1612);
	border-radius: 2px;
	transition: transform .22s ease, opacity .18s ease;
}

.tbh-burger[aria-expanded="true"] .tbh-burger__bar:nth-child(1) {
	transform: translateY(6.3px) rotate(45deg);
}

.tbh-burger[aria-expanded="true"] .tbh-burger__bar:nth-child(2) {
	opacity: 0;
}

.tbh-burger[aria-expanded="true"] .tbh-burger__bar:nth-child(3) {
	transform: translateY(-6.3px) rotate(-45deg);
}

/* Mobile nav */

.tbh-mobile-nav {
	position: fixed;
	inset: 0;
	/* Must track .tbh-header__inner height or the panel overlaps the header. */
	top: 66px;
	z-index: 99;
	background: var(--tbh-cream, #FCFAF5);
	padding: 24px 24px 40px;
	overflow-y: auto;
}

.tbh-mobile-nav[hidden] {
	display: none;
}

.tbh-mobile-nav__list,
.tbh-mobile-nav .tbh-nav__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
}

.tbh-mobile-nav a {
	display: block;
	padding: 17px 0;
	border-bottom: 1px solid var(--tbh-line, #EFDEC0);
	font-family: var(--tbh-serif, serif);
	font-size: 1.4rem;
	color: var(--tbh-green, #4B1612);
	text-decoration: none;
}

.tbh-mobile-nav__phone {
	display: inline-block;
	margin-top: 28px;
	padding: 14px 28px;
	background: var(--tbh-green, #4B1612);
	color: var(--tbh-gold-light, #DCB674) !important;
	border-radius: 999px;
	font-weight: 700;
	text-decoration: none;
	border: none !important;
}

@media (min-width: 900px) {
	.tbh-nav {
		display: block;
	}
	.tbh-header__order {
		display: inline-flex;
	}
	.tbh-burger {
		display: none;
	}
	.tbh-mobile-nav {
		display: none !important;
	}
}

/* ---------------------------------------------------------------
 * Buttons (shared with plugin cart.css)
 * ------------------------------------------------------------- */

.tbh-btn--outline-light {
	background: transparent;
	border: 1.5px solid rgba(255, 255, 255, .55);
	color: #fff;
}

.tbh-btn--outline-light:hover,
.tbh-btn--outline-light:focus-visible {
	background: rgba(255, 255, 255, .12);
	border-color: #fff;
	color: #fff;
}

/* ---------------------------------------------------------------
 * Hero
 * ------------------------------------------------------------- */

.tbh-hero {
	position: relative;
	background:
		radial-gradient(120% 90% at 15% 0%, #6E2A21 0%, transparent 55%),
		var(--tbh-green, #4B1612);
	color: #fff;
	overflow: hidden;
}

/* Subtle pattern instead of photography — no food images were supplied. */
.tbh-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image:
		repeating-linear-gradient(135deg, rgba(199, 137, 30, .05) 0 1px, transparent 1px 22px);
	pointer-events: none;
}

.tbh-hero__inner {
	position: relative;
	max-width: var(--tbh-wide);
	margin: 0 auto;
	padding: 52px 24px 44px;
	text-align: center;
}

@media (min-width: 768px) {
	.tbh-hero__inner {
		padding: 76px 24px 64px;
	}
}

.tbh-hero__eyebrow {
	font-size: .68rem;
	letter-spacing: .22em;
	text-transform: uppercase;
	color: var(--tbh-gold, #C7891E);
	margin: 0 0 16px;
	font-weight: 600;
}

/* Capped tighter than before: 12vw made the headline overwhelm small
   screens and pushed the ordering CTA below the fold. */
.tbh-hero__title {
	font-size: clamp(2.3rem, 8.5vw, 4.4rem);
	line-height: 1.04;
	color: #fff;
	margin: 0 0 18px;
	font-weight: 600;
	text-wrap: balance;
}

/* Brand lockup above the headline. */
.tbh-hero__brand {
	margin: 0 0 22px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 7px;
}

.tbh-hero__brand-name {
	font-family: var(--tbh-serif, serif);
	font-size: clamp(1.5rem, 4.4vw, 2.15rem);
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: #fff;
	line-height: 1;
}

.tbh-hero__brand-sub {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: clamp(.6rem, 1.6vw, .72rem);
	letter-spacing: .3em;
	text-transform: uppercase;
	color: var(--tbh-gold, #C7891E);
	font-weight: 600;
}

/* Gold rules flanking the sub-line, echoing the printed menu. */
.tbh-hero__brand-sub::before,
.tbh-hero__brand-sub::after {
	content: "";
	width: clamp(26px, 7vw, 54px);
	height: 1px;
	background: linear-gradient(to right, transparent, var(--tbh-gold, #C7891E));
}

.tbh-hero__brand-sub::after {
	background: linear-gradient(to left, transparent, var(--tbh-gold, #C7891E));
}

.tbh-hero__title em {
	display: block;
	font-style: italic;
	color: var(--tbh-gold, #C7891E);
	position: relative;
}

/* Soft gold glow behind the emphasised word, so it reads as deliberate
   highlighting rather than a plain colour change. */
.tbh-hero__title em::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: .12em;
	transform: translateX(-50%);
	width: 46%;
	height: 3px;
	background: linear-gradient(90deg, transparent, var(--tbh-gold, #C7891E), transparent);
	opacity: .85;
}

.tbh-hero__text {
	max-width: 46ch;
	margin: 0 auto 30px;
	font-size: 1rem;
	line-height: 1.65;
	color: rgba(255, 255, 255, .8);
}

.tbh-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	justify-content: center;
}

/* Below 480px the two CTAs wrapped into awkward half-rows; stack them so
   each is a full-width tap target. */
@media (max-width: 479px) {
	.tbh-hero__actions {
		flex-direction: column;
		align-items: stretch;
		max-width: 300px;
		margin: 0 auto;
	}
}

.tbh-hero__offer {
	margin: 28px 0 0;
	font-size: .82rem;
	color: rgba(255, 255, 255, .75);
}

.tbh-hero__offer-mark {
	display: inline-block;
	margin-right: 8px;
	padding: 4px 11px;
	border: 1px solid var(--tbh-gold, #C7891E);
	border-radius: 4px;
	color: var(--tbh-gold, #C7891E);
	font-weight: 800;
	font-size: .76rem;
	letter-spacing: .06em;
}

/* Marquee-style strip of dish names, purely decorative. */
.tbh-hero__strip {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 14px;
	padding: 14px 24px;
	background: rgba(0, 0, 0, .22);
	font-size: .74rem;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .62);
}

.tbh-hero__dot {
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background: var(--tbh-gold, #C7891E);
}

/* ---------------------------------------------------------------
 * Sections
 * ------------------------------------------------------------- */

.tbh-section {
	padding: 60px 0;
}

.tbh-section--tight {
	padding-top: 24px;
}

.tbh-section--menu {
	background: var(--tbh-cream, #FCFAF5);
	scroll-margin-top: 70px;
}

.tbh-section__head {
	max-width: 900px;
	margin: 0 auto 30px;
	padding: 0 24px;
	text-align: center;
}

.tbh-section__eyebrow {
	font-size: .72rem;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--tbh-gold, #C7891E);
	font-weight: 700;
	margin: 0 0 12px;
}

.tbh-section__eyebrow--light {
	color: var(--tbh-gold-light, #DCB674);
}

.tbh-section__title {
	font-size: clamp(1.9rem, 6vw, 2.9rem);
	margin: 0 0 14px;
}

.tbh-section__lead {
	max-width: 52ch;
	margin: 0 auto;
	color: var(--tbh-gray, #826863);
	font-size: .96rem;
}

.tbh-section--narrow {
	max-width: 760px;
	margin: 0 auto;
	padding-inline: 24px;
}

/* Prose */

.tbh-prose {
	font-size: 1rem;
	line-height: 1.72;
	color: var(--tbh-charcoal, #2D1411);
}

.tbh-prose__lead {
	font-family: var(--tbh-serif, serif);
	font-size: 1.32rem;
	line-height: 1.5;
	color: var(--tbh-green, #4B1612);
	margin-bottom: 28px;
}

.tbh-prose h2 {
	font-size: 1.5rem;
	margin: 34px 0 12px;
}

/* ---------------------------------------------------------------
 * Story
 * ------------------------------------------------------------- */

.tbh-section--story {
	background: var(--tbh-white, #fff);
}

.tbh-story {
	max-width: var(--tbh-mid);
	margin: 0 auto;
	padding: 0 24px;
	display: grid;
	gap: 32px;
}

.tbh-story__mark {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 96px;
	height: 96px;
	margin: 0 auto;
	border: 1.5px solid var(--tbh-gold, #C7891E);
	border-radius: 50%;
	flex-shrink: 0;
}

.tbh-story__initial {
	font-family: var(--tbh-serif, serif);
	font-size: 3rem;
	color: var(--tbh-gold, #C7891E);
	line-height: 1;
}

.tbh-story__lead {
	font-family: var(--tbh-serif, serif);
	font-size: 1.28rem;
	line-height: 1.5;
	color: var(--tbh-green, #4B1612);
	margin: 0 0 18px;
}

.tbh-story__text {
	color: var(--tbh-gray, #826863);
	margin: 0 0 22px;
}

.tbh-story__quote {
	margin: 0 0 22px;
	padding-left: 20px;
	border-left: 2px solid var(--tbh-gold, #C7891E);
	font-family: var(--tbh-serif, serif);
	font-size: 1.12rem;
	font-style: italic;
	color: var(--tbh-green, #4B1612);
}

.tbh-link-arrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: .86rem;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--tbh-green, #4B1612);
	text-decoration: none;
	border-bottom: 1.5px solid var(--tbh-gold, #C7891E);
	padding-bottom: 3px;
}

.tbh-link-arrow::after {
	content: "→";
	transition: transform .2s ease;
}

.tbh-link-arrow:hover::after {
	transform: translateX(4px);
}

@media (min-width: 768px) {
	.tbh-story {
		grid-template-columns: auto 1fr;
		gap: 44px;
		align-items: start;
	}
	.tbh-story__mark {
		margin: 6px 0 0;
	}
}

/* ---------------------------------------------------------------
 * Offers
 *
 * The collection discount leads at twice the visual weight — it is the
 * one offer that changes what a customer does, so it gets the emphasis
 * and the other two stay quiet beside it.
 * ------------------------------------------------------------- */

.tbh-section--offers {
	padding-block: 0 60px;
}

.tbh-offers {
	max-width: var(--tbh-mid);
	margin: 0 auto;
	padding: 0 var(--tbh-gutter);
	list-style: none;
	display: grid;
	gap: 16px;
	grid-template-columns: 1fr;
}

.tbh-offer {
	background: var(--tbh-white, #fff);
	border: 1px solid var(--tbh-line, #EFDEC0);
	border-radius: var(--tbh-radius-lg, 16px);
	padding: 26px 24px;
}

.tbh-offer--lead {
	background: var(--tbh-green, #4B1612);
	border-color: var(--tbh-green, #4B1612);
	color: #fff;
}

.tbh-offer__figure {
	display: block;
	font-family: var(--tbh-serif, serif);
	font-size: clamp(2.4rem, 8vw, 3.4rem);
	line-height: 1;
	color: var(--tbh-gold, #C7891E);
	margin-bottom: 10px;
	font-variant-numeric: tabular-nums;
}

.tbh-offer__figure--sm {
	font-size: clamp(1.5rem, 4.5vw, 1.9rem);
}

.tbh-offer__title {
	font-family: var(--tbh-sans, sans-serif);
	font-size: .95rem;
	font-weight: 700;
	letter-spacing: .01em;
	margin: 0 0 8px;
	color: var(--tbh-charcoal, #2D1411);
}

.tbh-offer--lead .tbh-offer__title {
	color: #fff;
	font-size: 1.05rem;
}

.tbh-offer__text {
	margin: 0;
	font-size: .86rem;
	line-height: 1.55;
	color: var(--tbh-gray, #826863);
}

.tbh-offer--lead .tbh-offer__text {
	color: rgba(255, 255, 255, .76);
}

@media (min-width: 720px) {
	.tbh-offers {
		grid-template-columns: 1.3fr 1fr 1fr;
		align-items: stretch;
	}
}

/* ---------------------------------------------------------------
 * Features
 * ------------------------------------------------------------- */

.tbh-features {
	max-width: var(--tbh-mid);
	margin: 0 auto;
	padding: 0 24px;
	list-style: none;
	display: grid;
	gap: 18px;
	grid-template-columns: 1fr;
}

.tbh-feature {
	background: var(--tbh-white, #fff);
	border: 1px solid var(--tbh-line, #EFDEC0);
	border-radius: var(--tbh-radius-lg, 16px);
	padding: 30px 26px 28px;
	position: relative;
	overflow: hidden;
	box-shadow: 0 1px 2px rgba(75, 22, 18, .04);
	transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

/* Gold accent rule that draws in on hover — restrained, but enough to make
   the cards feel considered rather than flat. */
.tbh-feature::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 100%;
	height: 2px;
	background: linear-gradient(90deg, var(--tbh-gold, #C7891E), var(--tbh-gold-light, #DCB674));
	transition: right .32s ease;
}

.tbh-feature:hover {
	transform: translateY(-3px);
	box-shadow: 0 10px 30px rgba(75, 22, 18, .09);
	border-color: rgba(199, 137, 30, .45);
}

.tbh-feature:hover::before {
	right: 0;
}

.tbh-feature__num {
	display: block;
	font-family: var(--tbh-serif, serif);
	font-size: 1.5rem;
	color: var(--tbh-gold, #C7891E);
	margin-bottom: 10px;
}

.tbh-feature__title {
	font-size: 1.14rem;
	margin: 0 0 8px;
}

.tbh-feature__text {
	margin: 0;
	font-size: .9rem;
	line-height: 1.6;
	color: var(--tbh-gray, #826863);
}

@media (min-width: 640px) {
	.tbh-features {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 1024px) {
	.tbh-features {
		grid-template-columns: repeat(4, 1fr);
	}
	.tbh-features--two {
		grid-template-columns: repeat(2, 1fr);
		max-width: 800px;
	}
}

/* ---------------------------------------------------------------
 * Visit / CTA
 * ------------------------------------------------------------- */

.tbh-section--visit {
	background: var(--tbh-green, #4B1612);
	color: #fff;
}

.tbh-visit {
	max-width: var(--tbh-mid);
	margin: 0 auto;
	padding: 0 24px;
	display: grid;
	gap: 40px;
}

.tbh-visit--center {
	text-align: center;
	justify-items: center;
}

.tbh-visit__title,
.tbh-visit__cta-title {
	color: #fff;
	font-size: clamp(1.6rem, 5vw, 2.2rem);
	margin: 0 0 14px;
}

.tbh-visit__address {
	font-style: normal;
	font-size: 1.06rem;
	line-height: 1.6;
	color: rgba(255, 255, 255, .88);
	margin-bottom: 20px;
}

.tbh-visit__text,
.tbh-visit__cta-text {
	color: rgba(255, 255, 255, .72);
	font-size: .94rem;
	margin: 0 0 20px;
}

.tbh-visit__facts {
	margin: 0;
	display: grid;
	gap: 14px;
}

.tbh-visit__fact dt {
	font-size: .7rem;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--tbh-gold, #C7891E);
	margin-bottom: 3px;
}

.tbh-visit__fact dd {
	margin: 0;
	font-size: 1rem;
	color: #fff;
}

.tbh-visit__fact a {
	color: #fff;
	text-decoration: none;
	border-bottom: 1px solid rgba(255, 255, 255, .3);
}

.tbh-visit__col--cta {
	background: rgba(0, 0, 0, .2);
	border: 1px solid rgba(199, 137, 30, .3);
	border-radius: var(--tbh-radius-lg, 16px);
	padding: 30px 26px;
	display: flex;
	flex-direction: column;
	gap: 12px;
	align-items: stretch;
}

@media (min-width: 768px) {
	.tbh-visit {
		grid-template-columns: 1.15fr .85fr;
		gap: 56px;
		align-items: center;
	}
	.tbh-visit--center {
		grid-template-columns: 1fr;
	}
}

/* ---------------------------------------------------------------
 * Page head
 * ------------------------------------------------------------- */

.tbh-pagehead {
	background: var(--tbh-green, #4B1612);
	color: #fff;
	text-align: center;
}

.tbh-pagehead__inner {
	max-width: 800px;
	margin: 0 auto;
	padding: 48px 24px 44px;
}

.tbh-pagehead__title {
	color: #fff;
	font-size: clamp(2.1rem, 8vw, 3.2rem);
	margin: 0 0 12px;
}

.tbh-pagehead__text {
	color: rgba(255, 255, 255, .75);
	margin: 0;
	font-size: .98rem;
}

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

.tbh-contact {
	max-width: var(--tbh-mid);
	margin: 0 auto;
	padding: 0 24px;
	display: grid;
	gap: 16px;
	grid-template-columns: 1fr;
}

.tbh-contact__card {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 26px 24px;
	background: var(--tbh-white, #fff);
	border: 1px solid var(--tbh-line, #EFDEC0);
	border-radius: var(--tbh-radius-lg, 16px);
	text-decoration: none;
	color: inherit;
	transition: border-color .18s ease, transform .18s ease;
	min-height: 128px;
	justify-content: center;
}

a.tbh-contact__card:hover,
a.tbh-contact__card:focus-visible {
	border-color: var(--tbh-gold, #C7891E);
	transform: translateY(-2px);
}

.tbh-contact__label {
	font-size: .7rem;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--tbh-gold, #C7891E);
	font-weight: 700;
}

.tbh-contact__value {
	font-family: var(--tbh-serif, serif);
	font-size: 1.34rem;
	color: var(--tbh-green, #4B1612);
	line-height: 1.35;
}

.tbh-contact__hint {
	font-size: .8rem;
	color: var(--tbh-gray, #826863);
}

@media (min-width: 768px) {
	.tbh-contact {
		grid-template-columns: repeat(3, 1fr);
	}
}

.tbh-map {
	max-width: var(--tbh-mid);
	margin: 0 auto;
	padding: 0 24px;
}

.tbh-map iframe {
	display: block;
	border-radius: var(--tbh-radius-lg, 16px);
	filter: saturate(.9);
}

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

.tbh-footer {
	background: var(--tbh-green-deep, #310E0C);
	color: rgba(255, 255, 255, .72);
	font-size: .9rem;
}

.tbh-footer__inner {
	max-width: var(--tbh-wide);
	margin: 0 auto;
	padding: 52px 24px 36px;
	display: grid;
	gap: 34px;
	grid-template-columns: 1fr;
}

.tbh-footer__logo {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin-bottom: 12px;
}

.tbh-footer__name {
	font-family: var(--tbh-serif, serif);
	font-size: 1.4rem;
	font-weight: 700;
	color: #fff;
	letter-spacing: .06em;
	text-transform: uppercase;
	line-height: 1;
}

.tbh-footer__sub {
	font-size: .6rem;
	letter-spacing: .22em;
	text-transform: uppercase;
	color: var(--tbh-gold, #C7891E);
	font-weight: 600;
}

.tbh-footer__tag {
	margin: 0 0 14px;
	font-style: italic;
	color: rgba(255, 255, 255, .6);
}

.tbh-footer__marks {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 5px;
	font-size: .8rem;
	color: rgba(255, 255, 255, .55);
}

.tbh-footer__marks li::before {
	content: "· ";
	color: var(--tbh-gold, #C7891E);
}

.tbh-footer__heading {
	font-family: var(--tbh-sans, sans-serif);
	font-size: .72rem;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--tbh-gold, #C7891E);
	margin: 0 0 14px;
	font-weight: 700;
}

.tbh-footer__address {
	font-style: normal;
	line-height: 1.65;
	margin-bottom: 10px;
}

.tbh-footer__link {
	color: #fff;
	text-decoration: none;
	border-bottom: 1px solid rgba(199, 137, 30, .45);
}

.tbh-footer__text {
	margin: 0;
	line-height: 1.65;
}

.tbh-footer__nav {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 9px;
}

.tbh-footer__nav a {
	color: rgba(255, 255, 255, .72);
	text-decoration: none;
	transition: color .16s ease;
}

.tbh-footer__nav a:hover,
.tbh-footer__nav a:focus-visible {
	color: var(--tbh-gold-light, #DCB674);
}

.tbh-footer__bar {
	border-top: 1px solid rgba(255, 255, 255, .1);
}

.tbh-footer__copy {
	max-width: var(--tbh-wide);
	margin: 0 auto;
	padding: 20px 24px;
	font-size: .78rem;
	color: rgba(255, 255, 255, .45);
	text-align: center;
}

@media (min-width: 700px) {
	.tbh-footer__inner {
		grid-template-columns: 1.4fr 1fr 1fr 1fr;
		gap: 40px;
	}
}

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

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: .01ms !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}
}