/* =========================================================
   Mad Chef pattern styles.
   Ported verbatim from the locked homepage mockup.
   Annotation-only styles (.ann-pill, .ann-block, .ann-toggle)
   are stripped at the theme scaffold boundary per Resume Notes.
   ========================================================= */

:root {
	--content-max: 1120px;
	--section-pad-y-desktop: 80px;
	--section-pad-y-mobile: 56px;
	--marquee-item-size: 16px;
	--marquee-padding: 4px;
	--marquee-margin-top: 22px;
	--marquee-speed: 34s;
}

/* Body type baseline matches mockup (16px) so patterns size correctly. */
body {
	font-size: 16px;
}

/* ---------------------------------------------------------
   1. Hero (homepage)
   --------------------------------------------------------- */
.hero {
	position: relative;
	min-height: 78vh;
	max-height: 720px;
	overflow: hidden;
	isolation: isolate;
	padding: 0;
}
.hero-bg {
	position: absolute;
	inset: 0;
	background-color: #1F1611;
	background-image:
		radial-gradient(circle at 28% 38%, rgba(244, 106, 31, 0.20) 0%, transparent 52%),
		radial-gradient(circle at 78% 62%, rgba(186, 117, 23, 0.14) 0%, transparent 48%);
}
/* Hero background video + poster.
   Poster (= the video's first frame) sits underneath the video and is what
   the crossfade dips back to, so the loop seam never shows the gradient. */
.hero-poster,
.hero-video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}
.hero-poster { z-index: 1; }
.hero-video {
	z-index: 2;
	opacity: 1;
	transition: opacity 0.5s ease-in-out;
}
.hero-video.is-dipping { opacity: 0; }
/* Mobile: poster only, never autoplay the video (save data + battery). */
@media (max-width: 600px) {
	.hero-video { display: none; }
}
/* Respect users who ask for less motion: hold on the still frame. */
@media (prefers-reduced-motion: reduce) {
	.hero-video { display: none; }
}
/* Real images dropped into the aspect-ratio placeholder boxes.
   The boxes were styled for a centred placeholder label (padding, border,
   grey fill), so strip those here and let the photo sit flush, filling and
   cropping to the box's aspect-ratio while keeping its rounded corners. */
img.service-card-img,
img.dish-img,
img.chef-img,
img.feature-img,
img.sb-img {
	width: 100%;
	object-fit: cover;
	display: block;
	padding: 0;
	border: 0;
}
.hero-scrim {
	position: absolute;
	inset: 0;
	/* MUST sit above the video (z-index 2) and below the content.
	   Without this, the video paints over the scrim and nothing darkens. */
	z-index: 3;
	/* Even dark layer across the whole video so the white copy pops. */
	background:
		linear-gradient(
			180deg,
			rgba(8, 5, 3, 0.58) 0%,
			rgba(8, 5, 3, 0.62) 55%,
			rgba(8, 5, 3, 0.70) 100%
		);
}
/* Scroll-down cue at the bottom of the hero. Scrolls to the next section. */
.hero-scroll {
	position: absolute;
	left: 50%;
	bottom: 20px;
	transform: translateX(-50%);
	z-index: 5;
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	background: none;
	border: 0;
	padding: 8px 10px;
	cursor: pointer;
	color: rgba(255, 255, 255, 0.88);
	font-family: 'Karla', system-ui, sans-serif;
	font-size: 11px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	transition: color 0.2s ease;
}
.hero-scroll:hover { color: #FFFFFF; }
.hero-scroll:focus-visible {
	outline: 2px solid #FFFFFF;
	outline-offset: 4px;
	border-radius: 6px;
}
.hero-scroll-chevron {
	display: block;
	line-height: 0;
	animation: heroScrollBounce 1.9s ease-in-out infinite;
}
@keyframes heroScrollBounce {
	0%, 100% { transform: translateY(0); opacity: 0.8; }
	50%      { transform: translateY(6px); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
	.hero-scroll-chevron { animation: none; }
}
.hero-content {
	position: relative;
	z-index: 4;
	height: 100%;
	min-height: 78vh;
	max-height: 720px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 80px 24px;
	color: #FFFFFF;
}
.hero-eyebrow {
	font-family: 'Playfair Display SC', 'Playfair Display', serif;
	font-size: 14px;
	letter-spacing: 0.15em;
	color: var(--accent-soft);
	margin: 0 0 18px;
	font-weight: 400;
}
.hero h1 {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: clamp(34px, 5.5vw, 56px);
	line-height: 1.08;
	letter-spacing: -0.015em;
	margin: 0 0 20px;
	font-weight: 500;
	max-width: 880px;
	color: #FFFFFF;
}
.hero-lead {
	font-size: 17px;
	color: rgba(255, 255, 255, 0.92);
	margin: 0 0 28px;
	line-height: 1.55;
	max-width: 580px;
}

/* ---------------------------------------------------------
   Button refinement at pattern scale.
   Mockup uses 48px tap targets and 8px radius vs the scaffold's
   44px and 6px. The mockup wins for visual fidelity.
   --------------------------------------------------------- */
.btn-row {
	display: flex;
	gap: 14px;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}
.btn {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 14px 22px;
	min-height: 48px;
	border-radius: 8px;
	font-family: 'Karla', sans-serif;
	font-size: 14px;
	font-weight: 500;
	text-decoration: none;
	border: 1px solid transparent;
	cursor: pointer;
	transition: background 200ms ease, color 200ms ease;
}
.btn-primary { background: var(--accent); color: #FFFFFF; }
.btn-primary:hover { background: var(--accent-deep); color: #FFFFFF; text-decoration: none; }
.btn-primary:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.btn-inverse { background: #FFFFFF; color: var(--ink); border-color: #FFFFFF; }
.btn-inverse:hover { background: var(--bg-soft); color: var(--ink); text-decoration: none; }
.btn-inverse:focus-visible { outline: 2px solid #FFFFFF; outline-offset: 4px; }
.btn-ghost-light {
	background: transparent;
	color: #FFFFFF;
	border-color: rgba(255, 255, 255, 0.7);
}
.btn-ghost-light:hover { background: rgba(255, 255, 255, 0.15); border-color: #FFFFFF; color: #FFFFFF; text-decoration: none; }
.btn-ghost-light:focus-visible { outline: 2px solid #FFFFFF; outline-offset: 4px; }

/* ---------------------------------------------------------
   Final CTA banner (service-page variant: catering, private
   chef, meal prep). Deep crimson band, centred, matches the
   homepage CTA. The .final-cta-* patterns ship as raw HTML and
   rely on these rules (the homepage banner self-styles via blocks).
   --------------------------------------------------------- */
.final-cta {
	background: var(--accent-darkest);
	color: #FFFFFF;
	padding: 88px 24px 80px;
	text-align: center;
}
.final-cta-content {
	max-width: 640px;
	margin: 0 auto;
}
.final-cta .eyebrow {
	font-family: 'Playfair Display SC', 'Playfair Display', serif;
	font-size: 13px;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--accent-soft);
	margin: 0 0 12px;
	font-weight: 400;
}
.final-cta h2 {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: clamp(32px, 5vw, 46px);
	line-height: 1.1;
	letter-spacing: -0.015em;
	font-weight: 500;
	color: #FFFFFF;
	margin: 0 0 18px;
}
.final-cta-lead {
	font-size: 18px;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.92);
	max-width: 540px;
	margin: 0 auto 32px;
}
.final-cta .btn-row {
	margin-bottom: 28px;
}
.final-cta .reassure {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px 24px;
	font-size: 13px;
	line-height: 1.6;
	color: var(--accent-soft);
}
.final-cta .reassure span {
	display: inline-flex;
	align-items: center;
	gap: 7px;
}
@media (max-width: 600px) {
	.final-cta { padding: 64px 22px 60px; }
	.final-cta .reassure { flex-direction: column; align-items: center; gap: 10px; }
}

/* ---------------------------------------------------------
   2. Trust strip
   --------------------------------------------------------- */
.trust-strip {
	padding: 56px 24px;
	background: #FFFFFF;
	border-bottom: 1px solid var(--line);
}
.trust-inner {
	max-width: var(--content-max);
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}
.trust-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 10px;
}
.trust-icon { font-size: 28px; color: var(--accent); }
.trust-title {
	font-family: 'Karla', sans-serif;
	font-size: 15px;
	font-weight: 500;
	color: var(--ink);
	margin: 0;
	line-height: 1.3;
}
.trust-sub {
	font-size: 13px;
	color: var(--ink-soft);
	margin: 0;
	line-height: 1.5;
}

/* ---------------------------------------------------------
   Generic section scaffolding (sections 3 through 9)
   --------------------------------------------------------- */
.section {
	padding: var(--section-pad-y-desktop) 24px;
}
.section-soft {
	background: var(--bg-soft);
}
.section-inner {
	max-width: var(--content-max);
	margin: 0 auto;
}
.section-head {
	text-align: center;
	max-width: 600px;
	margin: 0 auto 48px;
}
.eyebrow {
	font-family: 'Playfair Display SC', 'Playfair Display', serif;
	font-size: 14px;
	letter-spacing: 0.15em;
	color: var(--accent);
	margin: 0 0 14px;
	font-weight: 400;
}
.section h2 {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: clamp(28px, 4vw, 38px);
	line-height: 1.18;
	margin: 0 0 12px;
	font-weight: 500;
	color: var(--ink);
	letter-spacing: -0.01em;
}
.section-sub {
	font-size: 16px;
	color: var(--ink-soft);
	margin: 0;
	line-height: 1.6;
}

/* ---------------------------------------------------------
   3. Services grid
   --------------------------------------------------------- */
.services-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.service-card {
	background: #FFFFFF;
	border: 1px solid var(--line);
	border-radius: 12px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: border-color 200ms ease;
}
.service-card:hover { border-color: var(--accent); }
.service-card-img {
	aspect-ratio: 4/3;
	background: var(--line);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #5F5E5A;
	font-size: 11px;
	text-align: center;
	padding: 14px;
	line-height: 1.4;
}
.service-card-body {
	padding: 22px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	flex: 1;
}
.service-card-eyebrow {
	font-family: 'Playfair Display SC', 'Playfair Display', serif;
	font-size: 12px;
	letter-spacing: 0.14em;
	color: var(--accent);
	margin: 0;
	font-weight: 400;
}
.service-card-title {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 22px;
	line-height: 1.2;
	margin: 0;
	font-weight: 500;
}
.service-card-desc {
	font-size: 14px;
	color: var(--ink-soft);
	margin: 0;
	line-height: 1.6;
	flex: 1;
}
.service-card-link {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 13px;
	color: var(--accent);
	text-decoration: none;
	font-weight: 500;
	margin-top: 6px;
}
.service-card-link:hover { color: var(--accent-deep); text-decoration: none; }
.service-card-link:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
	border-radius: 2px;
}

/* Aurora CTA pattern. Brand signature. */
.aurora-cta-row {
	display: flex;
	justify-content: center;
	margin-top: 40px;
}
.aurora-wrap {
	position: relative;
	display: inline-block;
	isolation: isolate;
}
.aurora-glow {
	position: absolute;
	inset: -3px;
	border-radius: 12px;
	background: linear-gradient(90deg, #FFCDB5 0%, #F58E68 50%, #FFCDB5 100%);
	opacity: 0.7;
	filter: blur(14px);
	transition: opacity 250ms ease, filter 250ms ease;
	pointer-events: none;
	z-index: 0;
}
.aurora-wrap:hover .aurora-glow,
.aurora-wrap:focus-within .aurora-glow {
	opacity: 0.95;
	filter: blur(22px);
}
.aurora-button {
	position: relative;
	z-index: 1;
	background: var(--accent);
	color: #FFFFFF;
	border: 1px solid rgba(255, 255, 255, 0.18);
	padding: 14px 28px;
	min-height: 48px;
	border-radius: 9px;
	font-family: 'Karla', sans-serif;
	font-size: 15px;
	font-weight: 500;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	text-decoration: none;
	transition: background 200ms ease;
}
.aurora-button:hover { background: var(--accent-deep); color: #FFFFFF; text-decoration: none; }
.aurora-button:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) {
	.aurora-glow { transition: none; }
}

/* ---------------------------------------------------------
   4. Chef teaser
   --------------------------------------------------------- */
.chef-grid {
	display: grid;
	grid-template-columns: 1fr 1.35fr;
	gap: 60px;
	align-items: center;
}
.chef-img-wrap { position: relative; }
.chef-img {
	aspect-ratio: 3/4;
	background: var(--line);
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #5F5E5A;
	font-size: 12px;
	text-align: center;
	padding: 24px;
	line-height: 1.5;
}
.chef-bio {
	font-size: 16px;
	line-height: 1.7;
	color: var(--ink-soft);
	margin: 0 0 16px;
	max-width: 48ch;
}
.chef-bio:last-of-type { margin-bottom: 22px; }
.chef-bio-needs {
	background: var(--accent-soft);
	border: 1px solid var(--accent);
	padding: 18px 22px;
	border-radius: 10px;
	color: #2C2C2A;
	font-size: 14px;
	line-height: 1.65;
	margin: 16px 0 18px;
}
.chef-bio-needs strong {
	color: var(--accent-darkest);
	font-weight: 700;
	display: block;
	margin-bottom: 8px;
	font-size: 11px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* ---------------------------------------------------------
   5. Signature dishes preview
   --------------------------------------------------------- */
.dishes-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.dish-tile {
	display: flex;
	flex-direction: column;
	gap: 14px;
}
.dish-img {
	aspect-ratio: 4/3;
	background: var(--line);
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #5F5E5A;
	font-size: 11px;
	text-align: center;
	padding: 12px;
	line-height: 1.4;
	border: 1px solid var(--line);
	transition: border-color 200ms ease;
}
.dish-tile:hover .dish-img { border-color: var(--accent); }
.dish-cap {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 0 4px;
}
.dish-name {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 18px;
	line-height: 1.3;
	margin: 0;
	font-weight: 500;
}
.dish-meta {
	font-size: 13px;
	color: var(--muted);
	margin: 0;
}

/* ---------------------------------------------------------
   6. How it works (3-step)
   --------------------------------------------------------- */
.steps {
	position: relative;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px;
	max-width: 960px;
	margin: 0 auto;
}
.steps-connector {
	position: absolute;
	top: 28px;
	left: 16.66%;
	right: 16.66%;
	height: 1px;
	background: var(--line);
	z-index: 0;
	pointer-events: none;
}
.step {
	position: relative;
	z-index: 1;
	text-align: center;
	padding: 0 12px;
}
.step-num {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 44px;
	line-height: 1;
	color: var(--accent);
	margin: 0 0 20px;
	font-weight: 500;
	background: var(--bg);
	padding: 6px 16px;
	display: inline-block;
	letter-spacing: -0.02em;
}
.section-soft .step-num { background: var(--bg-soft); }
.step h3 {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 21px;
	line-height: 1.25;
	margin: 0 0 12px;
	font-weight: 500;
	color: var(--ink);
}
.step-desc {
	font-size: 15px;
	color: var(--ink-soft);
	margin: 0;
	line-height: 1.65;
	max-width: 300px;
	margin-left: auto;
	margin-right: auto;
}
.tf-token {
	/* Was a placeholder-highlight pill. The timing values are now final,
	   so this renders as plain inline text, no highlight. */
	font: inherit;
	color: inherit;
}

/* ---------------------------------------------------------
   7. Service area + marquee
   --------------------------------------------------------- */
.area-grid {
	display: grid;
	grid-template-columns: 1.05fr 1fr;
	gap: 60px;
	align-items: center;
	max-width: 1020px;
	margin: 0 auto;
}
.area-lead {
	font-size: 16px;
	color: var(--ink-soft);
	margin: 16px 0;
	line-height: 1.65;
}
.area-fineprint {
	font-size: 14px;
	color: var(--muted);
	margin: 0;
	line-height: 1.55;
}
.map-wrap {
	position: relative;
	aspect-ratio: 560 / 460;
	border-radius: 12px;
	overflow: hidden;
	border: 1px solid var(--line);
	background: var(--bg-soft);
}

/* Interactive Santa Clarita Valley service-area map. Pure SVG + CSS, no JS.
   Each community node highlights on hover/focus; central hub gently pulses. */
.scv-map {
	width: 100%;
	height: 100%;
	display: block;
	padding: 16px;
	box-sizing: border-box;
}
.scv-land {
	fill: var(--accent-soft);
	opacity: 0.55;
	stroke: var(--line);
	stroke-width: 1.5;
}
.scv-road {
	fill: none;
	stroke: var(--line);
	stroke-width: 2.5;
	stroke-dasharray: 5 7;
	stroke-linecap: round;
	opacity: 0.9;
}
.scv-link {
	stroke: var(--accent);
	stroke-width: 1.5;
	opacity: 0.16;
}
.scv-dot {
	fill: var(--accent);
	transform-box: fill-box;
	transform-origin: center;
	transition: transform 0.2s ease, fill 0.2s ease;
}
.scv-dot-hub { fill: var(--accent-darkest); }
.scv-label {
	fill: var(--ink);
	font-family: 'Karla', system-ui, sans-serif;
	font-size: 14px;
	transition: fill 0.2s ease, font-weight 0.2s ease;
}
.scv-label-hub { font-weight: 600; }
.scv-node { cursor: pointer; outline: none; }
.scv-node:hover .scv-dot,
.scv-node:focus-visible .scv-dot {
	transform: scale(1.5);
	fill: var(--accent-deep);
}
.scv-node:hover .scv-label,
.scv-node:focus-visible .scv-label {
	fill: var(--accent-deep);
	font-weight: 700;
}
.scv-node:focus-visible .scv-dot {
	stroke: var(--accent-deep);
	stroke-width: 4;
	stroke-opacity: 0.3;
}
.scv-pulse {
	fill: var(--accent);
	opacity: 0.3;
	transform-box: fill-box;
	transform-origin: center;
	animation: scvPulse 2.6s ease-out infinite;
}
@keyframes scvPulse {
	0%   { transform: scale(0.6); opacity: 0.45; }
	70%  { transform: scale(2.2); opacity: 0; }
	100% { transform: scale(2.2); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
	.scv-pulse { animation: none; opacity: 0.25; }
	.scv-dot { transition: none; }
}
.map-bg {
	position: absolute;
	inset: 0;
	background: #F1EFE8;
	background-image:
		linear-gradient(90deg, transparent 49.5%, rgba(143, 138, 128, 0.18) 50%, transparent 50.5%),
		linear-gradient(0deg, transparent 49.5%, rgba(143, 138, 128, 0.18) 50%, transparent 50.5%),
		linear-gradient(90deg, transparent 24.5%, rgba(143, 138, 128, 0.1) 25%, transparent 25.5%),
		linear-gradient(90deg, transparent 74.5%, rgba(143, 138, 128, 0.1) 75%, transparent 75.5%),
		linear-gradient(0deg, transparent 24.5%, rgba(143, 138, 128, 0.1) 25%, transparent 25.5%),
		linear-gradient(0deg, transparent 74.5%, rgba(143, 138, 128, 0.1) 75%, transparent 75.5%);
}
.map-ring-outer {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 86%;
	height: 86%;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	background: rgba(244, 106, 31, 0.08);
	border: 1px dashed rgba(244, 106, 31, 0.45);
}
.map-ring-inner {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 46%;
	height: 46%;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	background: rgba(244, 106, 31, 0.16);
	border: 1px solid rgba(244, 106, 31, 0.65);
}
.map-pin {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -100%);
	display: flex;
	flex-direction: column;
	align-items: center;
}
.map-pin-dot {
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: var(--accent);
	border: 3px solid #FFFFFF;
	position: relative;
	top: 8px;
}
.map-pin-label {
	background: var(--ink);
	color: #FFFFFF;
	padding: 5px 12px;
	font-size: 12px;
	border-radius: 4px;
	margin-bottom: 8px;
	font-weight: 500;
	white-space: nowrap;
}
.marquee-band {
	margin-top: var(--marquee-margin-top);
	max-width: var(--content-max);
	margin-left: auto;
	margin-right: auto;
}
.marquee-wrap {
	width: 100%;
	overflow: hidden;
	padding: var(--marquee-padding) 0;
	position: relative;
	-webkit-mask-image: linear-gradient(to right, transparent 0, #000 100px, #000 calc(100% - 100px), transparent 100%);
	mask-image: linear-gradient(to right, transparent 0, #000 100px, #000 calc(100% - 100px), transparent 100%);
}
@keyframes marquee {
	to { transform: translateX(-50%); }
}
.marquee-track {
	display: flex;
	width: max-content;
	align-items: center;
	animation: marquee var(--marquee-speed) linear infinite;
}
.marquee-wrap:hover .marquee-track,
.marquee-wrap:focus-within .marquee-track {
	animation-play-state: paused;
}
.m-item {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: var(--marquee-item-size);
	line-height: 1;
	color: var(--ink);
	padding: 0 22px;
	white-space: nowrap;
	font-weight: 500;
}
.m-sep {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: var(--marquee-item-size);
	line-height: 1;
	color: var(--accent);
	padding: 0;
	font-weight: 500;
}
@media (prefers-reduced-motion: reduce) {
	.marquee-track {
		animation: none;
		flex-wrap: wrap;
		justify-content: center;
		gap: 0 6px;
	}
}

/* ---------------------------------------------------------
   8. Testimonials
   --------------------------------------------------------- */
.testimonials-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.testimonial {
	background: #FFFFFF;
	border: 1px solid var(--line);
	border-radius: 12px;
	padding: 28px;
	display: flex;
	flex-direction: column;
	gap: 16px;
	transition: border-color 200ms ease;
}
.testimonial:hover { border-color: var(--accent); }
.stars {
	color: var(--accent);
	font-size: 15px;
	letter-spacing: 3px;
	line-height: 1;
}
.quote {
	font-family: 'Karla', sans-serif;
	font-size: 15px;
	line-height: 1.65;
	color: var(--ink-soft);
	font-style: italic;
	margin: 0;
	flex: 1;
}
.attrib {
	margin-top: auto;
	padding-top: 4px;
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.attrib-name {
	font-family: 'Karla', sans-serif;
	font-size: 14px;
	font-weight: 500;
	color: var(--ink);
	margin: 0;
	line-height: 1.35;
}
.attrib-meta {
	font-size: 12px;
	color: var(--muted);
	margin: 0;
	line-height: 1.35;
}

/* ---------------------------------------------------------
   9. FAQ
   --------------------------------------------------------- */
.faq-list {
	max-width: 760px;
	margin: 0 auto;
}
.faq-item {
	border-top: 1px solid var(--line);
	padding: 26px 0;
}
.faq-item:last-of-type {
	border-bottom: 1px solid var(--line);
}
.faq-item h3 {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 20px;
	line-height: 1.3;
	color: var(--ink);
	margin: 0 0 14px;
	font-weight: 500;
}
.faq-item p {
	font-size: 15px;
	color: var(--ink-soft);
	margin: 0;
	line-height: 1.7;
	max-width: 680px;
}
.faq-footer-link {
	text-align: center;
	margin-top: 36px;
}
.faq-footer-link a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 15px;
	color: var(--accent);
	text-decoration: none;
	font-weight: 500;
	padding: 8px 4px;
}
.faq-footer-link a:hover { color: var(--accent-deep); text-decoration: none; }
.faq-footer-link a:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
	border-radius: 2px;
}

/* ---------------------------------------------------------
   Responsive breakpoints (mockup parity)
   --------------------------------------------------------- */
@media (max-width: 920px) {
	.services-grid,
	.dishes-grid,
	.testimonials-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.chef-grid,
	.area-grid {
		grid-template-columns: 1fr;
		gap: 40px;
	}
	.trust-inner {
		grid-template-columns: repeat(2, 1fr);
		gap: 32px;
	}
}
@media (max-width: 720px) {
	.section { padding: var(--section-pad-y-mobile) 22px; }
	.hero-content { padding: 60px 22px; min-height: 70vh; }
	.hero, .hero-content { min-height: 70vh; max-height: 580px; }
	.services-grid,
	.dishes-grid,
	.testimonials-grid { grid-template-columns: 1fr; }
	.steps { grid-template-columns: 1fr; gap: 36px; }
	.steps-connector { display: none; }
	.step-num { background: transparent; }
}
@media (max-width: 480px) {
	.trust-inner { grid-template-columns: 1fr 1fr; }
}

/* =========================================================
   Services pillar (/services). Ported from services-pillar.html.
   ========================================================= */

/* ---------------------------------------------------------
   Pillar hero (Myna word-reveal)
   --------------------------------------------------------- */
.pillar-hero {
	padding: 100px 24px 100px;
	background: var(--bg-soft);
	text-align: center;
}
.pillar-hero-inner {
	max-width: 880px;
	margin: 0 auto;
}
@keyframes word-in {
	to {
		opacity: 1;
		transform: translateY(0);
		filter: blur(0);
	}
}
@keyframes fade-up {
	to {
		opacity: 1;
		transform: translateY(0);
	}
}
.pillar-title {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: clamp(40px, 6.5vw, 64px);
	line-height: 1.06;
	letter-spacing: -0.02em;
	margin: 0 0 30px;
	font-weight: 500;
	color: var(--ink);
}
.pillar-title .word {
	display: inline-block;
	opacity: 0;
	transform: translateY(22px);
	filter: blur(10px);
	animation: word-in 0.6s cubic-bezier(0.22, 1, 0.36, 1) forwards;
	margin: 0 8px;
}
.pillar-title .word:nth-child(1) { animation-delay: 0.05s; }
.pillar-title .word:nth-child(2) { animation-delay: 0.20s; }
.pillar-title .word:nth-child(3) { animation-delay: 0.35s; }
.pillar-title .word:nth-child(4) { animation-delay: 0.50s; }
.pillar-title .word:nth-child(5) { animation-delay: 0.65s; }
.pillar-title .word:nth-child(6) { animation-delay: 0.80s; }
.pillar-lead {
	font-size: 18px;
	color: var(--ink-soft);
	margin: 0 auto 44px;
	line-height: 1.6;
	max-width: 620px;
	opacity: 0;
	transform: translateY(18px);
	animation: fade-up 0.6s cubic-bezier(0.22, 1, 0.36, 1) 1.15s forwards;
}
.pillar-callouts {
	list-style: none;
	padding: 0;
	margin: 0 0 48px;
	display: flex;
	gap: 14px 40px;
	justify-content: center;
	flex-wrap: wrap;
}
.pillar-callout {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 6px 0;
	font-size: 15px;
	color: var(--ink);
	font-weight: 500;
	opacity: 0;
	transform: translateY(18px);
	animation: fade-up 0.6s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
.pillar-callout:nth-of-type(1) { animation-delay: 1.40s; }
.pillar-callout:nth-of-type(2) { animation-delay: 1.55s; }
.pillar-callout:nth-of-type(3) { animation-delay: 1.70s; }
.pillar-callout i { font-size: 22px; color: var(--accent); }
.pillar-cta-row {
	display: flex;
	justify-content: center;
	opacity: 0;
	transform: translateY(18px);
	animation: fade-up 0.6s cubic-bezier(0.22, 1, 0.36, 1) 2.0s forwards;
}
@media (prefers-reduced-motion: reduce) {
	.pillar-title .word,
	.pillar-lead,
	.pillar-callout,
	.pillar-cta-row {
		animation: none;
		opacity: 1;
		transform: none;
		filter: none;
	}
}

/* ---------------------------------------------------------
   Alternating service blocks
   --------------------------------------------------------- */
.service-blocks {
	padding: 80px 24px;
	background: var(--bg);
}
.service-block {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 56px;
	align-items: center;
	max-width: 1080px;
	margin: 0 auto;
	padding: 40px 0;
}
.service-block + .service-block {
	border-top: 1px solid var(--bg-soft);
	padding-top: 64px;
	margin-top: 32px;
}
.service-block.reverse { direction: rtl; }
.service-block.reverse > * { direction: ltr; }
.sb-img {
	aspect-ratio: 4/3;
	background: var(--line);
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #5F5E5A;
	font-size: 12px;
	text-align: center;
	padding: 18px;
	line-height: 1.5;
}
.sb-text {
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.sb-eyebrow {
	font-family: 'Playfair Display SC', 'Playfair Display', serif;
	font-size: 13px;
	letter-spacing: 0.16em;
	color: var(--accent);
	margin: 0;
	font-weight: 400;
}
.sb-h2 {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 34px;
	line-height: 1.15;
	margin: 0;
	font-weight: 500;
	color: var(--ink);
	letter-spacing: -0.01em;
}
.sb-desc {
	font-size: 16px;
	color: var(--ink-soft);
	margin: 0;
	line-height: 1.65;
}
.sb-incl {
	list-style: none;
	padding: 0;
	margin: 8px 0 6px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px 22px;
}
.sb-incl li {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	font-size: 14px;
	color: #2C2C2A;
	line-height: 1.45;
}
.sb-incl i {
	color: var(--accent);
	font-size: 17px;
	line-height: 1.45;
	flex-shrink: 0;
	margin-top: 1px;
}
.sb-link {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 15px;
	color: var(--accent);
	text-decoration: none;
	font-weight: 500;
	margin-top: 10px;
	align-self: flex-start;
}
.sb-link i { transition: transform 200ms ease; }
.sb-link:hover { color: var(--accent-deep); text-decoration: none; }
.sb-link:hover i { transform: translateX(3px); }
.sb-link:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
	border-radius: 2px;
}

/* ---------------------------------------------------------
   Comparison strip
   --------------------------------------------------------- */
.compare-section {
	padding: 72px 24px;
	background: var(--bg-soft);
}
.compare-head {
	text-align: center;
	max-width: 600px;
	margin: 0 auto 40px;
}
.compare-eyebrow {
	font-family: 'Playfair Display SC', 'Playfair Display', serif;
	font-size: 13px;
	letter-spacing: 0.15em;
	color: var(--accent);
	margin: 0 0 12px;
	font-weight: 400;
}
.compare-section h2 {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: clamp(28px, 4vw, 36px);
	line-height: 1.18;
	margin: 0 0 10px;
	font-weight: 500;
	color: var(--ink);
	letter-spacing: -0.01em;
}
.compare-sub {
	font-size: 15px;
	color: var(--ink-soft);
	margin: 0;
	line-height: 1.6;
}
.compare-wrap {
	max-width: 880px;
	margin: 0 auto;
	background: var(--bg);
	border: 1px solid var(--line);
	border-radius: 14px;
	overflow: hidden;
}
.compare-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 15px;
}
.compare-table thead th {
	background: var(--bg);
	padding: 22px 16px 18px;
	text-align: center;
	border-bottom: 1px solid var(--line);
	font-weight: 500;
}
.compare-table thead th:first-child { background: var(--bg-soft); }
.col-head {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
}
.col-icon {
	width: 40px;
	height: 40px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--accent);
	font-size: 26px;
}
.col-link {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 18px;
	color: var(--ink);
	text-decoration: none;
	font-weight: 500;
	line-height: 1.2;
}
.col-link:hover { color: var(--accent); text-decoration: none; }
.col-link:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
	border-radius: 2px;
}
.compare-table tbody tr {
	border-bottom: 1px solid var(--bg-soft);
}
.compare-table tbody tr:last-child {
	border-bottom: 0;
}
.compare-table tbody th {
	background: var(--bg-soft);
	padding: 16px 18px;
	text-align: left;
	font-family: 'Playfair Display SC', 'Playfair Display', serif;
	font-size: 13px;
	letter-spacing: 0.1em;
	color: #5F5E5A;
	font-weight: 400;
	white-space: nowrap;
}
.compare-table tbody td {
	padding: 16px;
	text-align: center;
	color: #2C2C2A;
	font-size: 15px;
	vertical-align: middle;
	line-height: 1.4;
}
.compare-foot {
	text-align: center;
	margin-top: 26px;
}
.compare-foot a {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 15px;
	color: var(--accent);
	text-decoration: none;
	font-weight: 500;
	padding: 8px 4px;
}
.compare-foot a i { transition: transform 200ms ease; }
.compare-foot a:hover { color: var(--accent-deep); text-decoration: none; }
.compare-foot a:hover i { transform: translateX(3px); }

/* ---------------------------------------------------------
   Pillar responsive
   --------------------------------------------------------- */
@media (max-width: 920px) {
	.service-block { grid-template-columns: 1fr; gap: 32px; }
	.service-block.reverse { direction: ltr; }
}
@media (max-width: 720px) {
	.pillar-hero { padding: 64px 22px 64px; }
	.service-blocks,
	.compare-section { padding: 56px 22px; }
	.compare-table thead { display: none; }
	.compare-table tbody tr {
		display: block;
		padding: 16px 0;
		border-bottom: 1px solid var(--line);
	}
	.compare-table tbody th,
	.compare-table tbody td {
		display: block;
		text-align: left;
	}
	.compare-table tbody th {
		background: transparent;
		padding: 8px 16px 0;
	}
	.compare-table tbody td {
		padding: 4px 16px 8px;
	}
}
@media (max-width: 480px) {
	.sb-incl { grid-template-columns: 1fr; }
}

/* =========================================================
   Cluster pages (catering, private chef, meal prep).
   Shared cluster hero + quote form + bg-image menus section
   plus per-service unique blocks.
   ========================================================= */

/* ---------------------------------------------------------
   Cluster hero with bg image + form
   --------------------------------------------------------- */
.cluster-hero {
	position: relative;
	padding: 100px 24px 100px;
	overflow: hidden;
	isolation: isolate;
}
.cluster-hero-bg {
	position: absolute;
	inset: 0;
	background-color: #1F1611;
	background-image:
		radial-gradient(circle at 26% 36%, rgba(244, 106, 31, 0.22) 0%, transparent 50%),
		radial-gradient(circle at 78% 64%, rgba(186, 117, 23, 0.14) 0%, transparent 48%);
	z-index: 0;
}
.cluster-hero-bg.cluster-hero-bg-pc {
	background-color: #1A130E;
	background-image:
		radial-gradient(circle at 30% 40%, rgba(244, 106, 31, 0.18) 0%, transparent 50%),
		radial-gradient(circle at 76% 70%, rgba(186, 117, 23, 0.12) 0%, transparent 50%);
}
.cluster-hero-bg.cluster-hero-bg-mp {
	background-color: #1A1F18;
	background-image:
		radial-gradient(circle at 28% 38%, rgba(118, 180, 80, 0.18) 0%, transparent 50%),
		radial-gradient(circle at 78% 64%, rgba(244, 106, 31, 0.14) 0%, transparent 48%);
}
.cluster-hero-scrim {
	position: absolute;
	inset: 0;
	background: rgba(8, 5, 3, 0.55);
	z-index: 1;
}
.cluster-hero-inner {
	position: relative;
	z-index: 3;
	max-width: 1180px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1.05fr 1fr;
	gap: 56px;
	align-items: center;
}
.cluster-hero-text { color: #FFFFFF; }
.crumb {
	font-size: 12px;
	color: rgba(255, 255, 255, 0.7);
	margin: 0 0 18px;
}
.crumb ol {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	gap: 8px;
	align-items: center;
	flex-wrap: wrap;
}
.crumb li {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
.crumb li:not(:last-child)::after {
	content: '/';
	color: rgba(255, 255, 255, 0.4);
	margin-left: 8px;
}
.crumb a {
	color: rgba(255, 255, 255, 0.85);
	text-decoration: none;
}
.crumb a:hover { color: #FFFFFF; text-decoration: none; }
.crumb [aria-current="page"] {
	color: #FFFFFF;
	font-weight: 500;
}
.cluster-hero-text .eyebrow { color: var(--accent-soft); }
.cluster-h1 {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: clamp(36px, 5vw, 52px);
	line-height: 1.08;
	letter-spacing: -0.015em;
	margin: 0 0 18px;
	font-weight: 500;
	color: #FFFFFF;
}
.cluster-lead {
	font-size: 17px;
	color: rgba(255, 255, 255, 0.92);
	margin: 0 0 24px;
	line-height: 1.6;
	max-width: 540px;
}
.cluster-hero-reassure {
	font-size: 13px;
	color: rgba(255, 255, 255, 0.85);
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
}
.cluster-hero-reassure i {
	color: var(--accent);
	font-size: 16px;
}

/* ---------------------------------------------------------
   Quote form card
   --------------------------------------------------------- */
.qform {
	background: #FFFFFF;
	border-radius: 14px;
	padding: 32px 32px 28px;
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
}
.qform-head { margin: 0 0 22px; }
.qform-title {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 22px;
	line-height: 1.2;
	margin: 0 0 6px;
	font-weight: 500;
	color: var(--ink);
}
.qform-sub {
	font-size: 13px;
	color: var(--ink-soft);
	margin: 0;
	line-height: 1.5;
}
.qform-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
}
.qform-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.qform-field.full { grid-column: 1 / -1; }
.qform label {
	font-size: 12px;
	font-weight: 500;
	color: var(--ink);
	letter-spacing: 0.02em;
}
.qform label .req { color: var(--accent); }
.qform input,
.qform textarea {
	font-family: 'Karla', sans-serif;
	font-size: 14px;
	color: var(--ink);
	background: var(--bg-soft);
	border: 1px solid var(--line);
	border-radius: 8px;
	padding: 10px 12px;
	min-height: 42px;
	transition: border-color 200ms ease, background 200ms ease;
}
.qform input:focus,
.qform textarea:focus {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
	background: #FFFFFF;
	border-color: var(--accent);
}
.qform textarea {
	min-height: 88px;
	resize: vertical;
	line-height: 1.5;
}
.qform-submit {
	margin-top: 16px;
	background: var(--accent);
	color: #FFFFFF;
	border: none;
	padding: 14px 22px;
	min-height: 48px;
	border-radius: 9px;
	font-family: 'Karla', sans-serif;
	font-size: 15px;
	font-weight: 500;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	transition: background 200ms ease;
	width: 100%;
}
.qform-submit:hover { background: var(--accent-deep); }
.qform-submit:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 4px;
}
/* ---------------------------------------------------------
   Forminator quote form, brand-matched inside .qform-embed.
   Targets Forminator's standard markup so the plugin form looks
   like the rest of the site. Verify/tweak once the form is
   previewable (Forminator is not on the local dev site).
   --------------------------------------------------------- */
.qform-embed .forminator-custom-form { margin: 0; }
.qform-embed .forminator-row { margin-bottom: 14px; }
.qform-embed .forminator-label,
.qform-embed .forminator-label label {
	font-family: 'Karla', sans-serif;
	font-size: 13px;
	font-weight: 500;
	color: var(--ink);
	margin-bottom: 6px;
}
.qform-embed .forminator-required { color: var(--accent); }
.qform-embed input.forminator-input,
.qform-embed textarea.forminator-textarea,
.qform-embed select.forminator-select,
.qform-embed .forminator-input {
	width: 100%;
	box-sizing: border-box;
	font-family: 'Karla', sans-serif;
	font-size: 15px;
	color: var(--ink);
	background: #FFFFFF;
	border: 1px solid var(--line);
	border-radius: 9px;
	padding: 12px 14px;
	min-height: 48px;
}
/* Shorter textareas (Dietary needs, Anything else) so the form is less tall.
   Overrides Forminator's default rows; user can still drag to expand. */
.qform-embed textarea.forminator-textarea {
	min-height: 80px;
	height: 80px;
	resize: vertical;
}
.qform-embed input.forminator-input:focus,
.qform-embed textarea.forminator-textarea:focus,
.qform-embed select.forminator-select:focus {
	outline: none;
	border-color: var(--accent);
	box-shadow: 0 0 0 3px var(--accent-soft);
}
.qform-embed .forminator-button-submit,
.qform-embed button.forminator-button {
	background: var(--accent) !important;
	color: #FFFFFF !important;
	border: none !important;
	border-radius: 9px !important;
	padding: 14px 22px !important;
	min-height: 48px;
	font-family: 'Karla', sans-serif !important;
	font-size: 15px !important;
	font-weight: 500 !important;
	width: 100%;
	cursor: pointer;
	transition: background 200ms ease;
}
.qform-embed .forminator-button-submit:hover,
.qform-embed button.forminator-button:hover { background: var(--accent-deep) !important; }
/* Forminator select2 dropdown: white background to match the brand (default
   theme renders it grey). Highlighted/selected option uses the brand cream. */
.forminator-select .select2-selection { background-color: #FFFFFF !important; border-color: var(--line) !important; }
.forminator-select .select2-dropdown,
.forminator-select .select2-results,
.forminator-select .select2-results__options { background-color: #FFFFFF !important; }
.forminator-select .select2-results__option { background-color: #FFFFFF !important; color: var(--ink) !important; }
.forminator-select .select2-results__option--highlighted,
.forminator-select .select2-results__option[aria-selected="true"] {
	background-color: var(--accent-soft) !important;
	color: var(--accent-darkest) !important;
}
.qform-fineprint {
	font-size: 11px;
	color: var(--muted);
	margin: 10px 0 0;
	text-align: center;
	line-height: 1.4;
}

/* ---------------------------------------------------------
   Event types grid (catering)
   --------------------------------------------------------- */
.event-types-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}
.event-type {
	background: var(--bg-soft);
	border: 1px solid var(--line);
	border-radius: 12px;
	padding: 22px 20px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	transition: border-color 200ms ease, background 200ms ease;
}
.event-type:hover {
	border-color: var(--accent);
	background: var(--bg);
}
.event-type-icon {
	font-size: 28px;
	color: var(--accent);
	margin-bottom: 6px;
}
.event-type-name {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 18px;
	line-height: 1.3;
	margin: 0;
	font-weight: 500;
	color: var(--ink);
}
.event-type-desc {
	font-size: 13px;
	color: var(--ink-soft);
	margin: 0;
	line-height: 1.5;
}

/* ---------------------------------------------------------
   What's included feature grid (catering)
   --------------------------------------------------------- */
.feature-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px;
	max-width: 1080px;
	margin: 0 auto;
}
.feature-tile {
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.feature-img {
	aspect-ratio: 16/9;
	background: var(--line);
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #5F5E5A;
	font-size: 11px;
	text-align: center;
	padding: 12px;
	line-height: 1.4;
	margin-bottom: 4px;
}
.feature-title {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 20px;
	line-height: 1.3;
	margin: 0;
	font-weight: 500;
	color: var(--ink);
}
.feature-desc {
	font-size: 14px;
	color: var(--ink-soft);
	margin: 0;
	line-height: 1.6;
}

/* Dietary separator list ("We cook"). Shared catering + private chef. */
.we-cook {
	margin-top: 56px;
	padding-top: 36px;
	border-top: 1px solid var(--line);
	text-align: center;
	max-width: 880px;
	margin-left: auto;
	margin-right: auto;
}
.we-cook-label {
	font-family: 'Playfair Display SC', 'Playfair Display', serif;
	font-size: 12px;
	letter-spacing: 0.16em;
	color: var(--accent);
	margin: 0 0 12px;
	font-weight: 400;
}
.we-cook-list {
	font-family: 'Karla', sans-serif;
	font-size: 15px;
	color: var(--ink);
	display: flex;
	flex-wrap: wrap;
	gap: 0;
	justify-content: center;
	align-items: center;
}
.we-cook-item {
	padding: 4px 14px 4px 0;
	margin-right: 14px;
	border-right: 1px solid var(--line);
	font-weight: 500;
}
.we-cook-item:last-child {
	border-right: 0;
	margin-right: 0;
	padding-right: 0;
}

/* ---------------------------------------------------------
   Sample menus with bg image (catering + private chef)
   --------------------------------------------------------- */
.menus-section {
	position: relative;
	padding: 88px 24px 92px;
	overflow: hidden;
	isolation: isolate;
}
.menus-section-bg {
	position: absolute;
	inset: 0;
	background-color: #2A1F18;
	background-image:
		radial-gradient(circle at 35% 40%, rgba(244, 106, 31, 0.16) 0%, transparent 55%),
		radial-gradient(circle at 72% 70%, rgba(186, 117, 23, 0.12) 0%, transparent 50%);
	z-index: 0;
}
.menus-section-scrim {
	position: absolute;
	inset: 0;
	background: rgba(10, 7, 5, 0.65);
	z-index: 1;
}
.menus-section-inner {
	position: relative;
	z-index: 3;
	max-width: var(--content-max);
	margin: 0 auto;
}
.menus-section-head {
	text-align: center;
	max-width: 640px;
	margin: 0 auto 48px;
}
.menus-section-head .eyebrow { color: var(--accent-soft); }
.menus-section-head h2 {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: clamp(28px, 4vw, 38px);
	line-height: 1.18;
	margin: 0 0 12px;
	font-weight: 500;
	color: #FFFFFF;
	letter-spacing: -0.01em;
}
.menus-section-head p {
	font-size: 16px;
	color: rgba(255, 255, 255, 0.88);
	margin: 0;
	line-height: 1.6;
}
.menus-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}
.menu-card {
	background: var(--bg);
	border: 1px solid var(--line);
	border-radius: 12px;
	padding: 26px 24px;
	display: flex;
	flex-direction: column;
	gap: 14px;
	transition: border-color 200ms ease;
}
.menu-card:hover { border-color: var(--accent); }
.menu-card-eyebrow {
	font-family: 'Playfair Display SC', 'Playfair Display', serif;
	font-size: 12px;
	letter-spacing: 0.14em;
	color: var(--accent);
	margin: 0;
	font-weight: 400;
}
.menu-card-name {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 22px;
	line-height: 1.2;
	margin: 0;
	font-weight: 500;
}
.menu-card-tagline {
	font-size: 14px;
	color: var(--ink-soft);
	margin: 0;
	line-height: 1.55;
	font-style: italic;
}
.menu-card-dishes {
	list-style: none;
	padding: 0;
	margin: 4px 0 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
	border-top: 1px solid var(--line);
	padding-top: 14px;
}
.menu-card-dishes li {
	font-size: 14px;
	color: #2C2C2A;
	line-height: 1.45;
	display: flex;
	align-items: flex-start;
	gap: 8px;
}
.menu-card-dishes li::before {
	content: '\00B7';
	color: var(--accent);
	font-weight: 700;
	font-size: 18px;
	line-height: 1;
	flex-shrink: 0;
}

/* ---------------------------------------------------------
   Process steps. 5-step (catering, private chef experience).
   4-step variant (meal prep). Shared step styling.
   --------------------------------------------------------- */
.process-steps {
	position: relative;
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 24px;
	max-width: 1080px;
	margin: 0 auto;
}
.process-steps-4 {
	position: relative;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	max-width: 1080px;
	margin: 0 auto;
}
.process-connector {
	position: absolute;
	top: 28px;
	left: 10%;
	right: 10%;
	height: 1px;
	background: var(--line);
	z-index: 0;
	pointer-events: none;
}
.process-steps-4 .process-connector {
	left: 12%;
	right: 12%;
}
.process-step {
	position: relative;
	z-index: 1;
	text-align: center;
	padding: 0 6px;
}
.process-num {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 36px;
	line-height: 1;
	color: var(--accent);
	margin: 0 0 16px;
	font-weight: 500;
	background: var(--bg);
	padding: 4px 12px;
	display: inline-block;
	letter-spacing: -0.02em;
}
.section-soft .process-num { background: var(--bg-soft); }
.process-step h3 {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 17px;
	line-height: 1.25;
	margin: 0 0 8px;
	font-weight: 500;
	color: var(--ink);
}
.process-step p {
	font-size: 13.5px;
	color: var(--ink-soft);
	margin: 0;
	line-height: 1.55;
}
.process-step p a {
	color: var(--accent);
	text-decoration: underline;
	text-underline-offset: 2px;
}
.process-step p a:hover { color: var(--accent-deep); }

/* ---------------------------------------------------------
   Capacity stats. Variants:
   .capacity-grid (default 2-col, catering)
   .capacity-grid-3 (3-col, private chef + meal prep)
   --------------------------------------------------------- */
.capacity-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	max-width: 760px;
	margin: 0 auto;
}
.capacity-grid-3 {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	max-width: 980px;
	margin: 0 auto;
}
.capacity-stat {
	background: var(--bg);
	border: 1px solid var(--line);
	border-radius: 12px;
	padding: 28px 26px;
	text-align: center;
}
.capacity-grid-3 .capacity-stat { padding: 28px 22px; }
.capacity-num {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 36px;
	line-height: 1.1;
	color: var(--ink);
	margin: 0 0 6px;
	font-weight: 500;
	letter-spacing: -0.01em;
}
.capacity-grid-3 .capacity-num { font-size: 32px; }
.capacity-num span.muted { color: var(--accent); }
.capacity-label {
	font-family: 'Playfair Display SC', 'Playfair Display', serif;
	font-size: 12px;
	letter-spacing: 0.14em;
	color: #5F5E5A;
	margin: 0;
	font-weight: 400;
}

/* ---------------------------------------------------------
   Audience tiles (private chef)
   --------------------------------------------------------- */
.audience-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}
.audience-tile {
	background: var(--bg-soft);
	border: 1px solid var(--line);
	border-radius: 12px;
	padding: 26px 22px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	transition: border-color 200ms ease, background 200ms ease;
}
.audience-tile:hover {
	border-color: var(--accent);
	background: var(--bg);
}
.audience-icon {
	font-size: 30px;
	color: var(--accent);
	margin-bottom: 6px;
}
.audience-name {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 19px;
	line-height: 1.3;
	margin: 0;
	font-weight: 500;
	color: var(--ink);
}
.audience-desc {
	font-size: 13.5px;
	color: var(--ink-soft);
	margin: 0;
	line-height: 1.55;
}

/* ---------------------------------------------------------
   Experience timeline (private chef). Inherits .process-* styles
   above; only thing distinct is num background on cream sections.
   --------------------------------------------------------- */
.experience-steps {
	position: relative;
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 24px;
	max-width: 1080px;
	margin: 0 auto;
}
.experience-connector {
	position: absolute;
	top: 28px;
	left: 10%;
	right: 10%;
	height: 1px;
	background: var(--line);
	z-index: 0;
	pointer-events: none;
}
.experience-step {
	position: relative;
	z-index: 1;
	text-align: center;
	padding: 0 6px;
}
.experience-num {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 36px;
	line-height: 1;
	color: var(--accent);
	margin: 0 0 16px;
	font-weight: 500;
	background: var(--bg-soft);
	padding: 4px 12px;
	display: inline-block;
	letter-spacing: -0.02em;
}
.experience-step h3 {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 17px;
	line-height: 1.25;
	margin: 0 0 8px;
	font-weight: 500;
	color: var(--ink);
}
.experience-step p {
	font-size: 13.5px;
	color: var(--ink-soft);
	margin: 0;
	line-height: 1.55;
}

/* ---------------------------------------------------------
   Plan comparison table (meal prep)
   --------------------------------------------------------- */
.pricing-wrap {
	max-width: 1080px;
	margin: 0 auto;
	overflow-x: auto;
}
.pricing-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
	min-width: 720px;
}
.pt-blank {
	background: transparent;
	padding: 0;
	min-width: 200px;
	border: 0;
}
.pt-plan-col {
	padding: 20px 22px 24px;
	vertical-align: top;
	text-align: left;
	border-left: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
	background: var(--bg);
}
.pt-plan-col-featured { background: var(--bg-soft); }
.pt-plan-head {
	position: relative;
	padding-top: 32px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	align-items: flex-start;
}
.pt-plan-badge {
	position: absolute;
	top: 0;
	left: 0;
	background: var(--accent);
	color: #FFFFFF;
	padding: 4px 10px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.04em;
}
.pt-plan-name {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 22px;
	line-height: 1.2;
	margin: 0;
	font-weight: 500;
	color: var(--ink);
}
.pt-plan-desc {
	font-size: 13px;
	color: var(--ink-soft);
	margin: 0;
	line-height: 1.55;
}
.pt-plan-price {
	font-family: 'Playfair Display', Georgia, serif;
	margin: 6px 0 0;
	display: flex;
	align-items: baseline;
	gap: 6px;
	flex-wrap: wrap;
	font-weight: 500;
}
.pt-price-amount {
	font-size: 26px;
	color: var(--accent);
	font-weight: 500;
}
/* Generic "Custom pricing" label sits in the same slot as a real price. */
.pt-price-custom {
	font-size: 21px;
	white-space: nowrap;
}
.pt-price-meta {
	font-size: 13px;
	color: var(--muted);
	font-family: 'Karla', sans-serif;
	font-weight: 400;
}
.pt-plan-subprice {
	font-family: 'Karla', sans-serif;
	font-size: 13px;
	color: var(--ink-soft);
	margin: 4px 0 0;
	line-height: 1.4;
}
.pt-cta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 10px 16px;
	min-height: 40px;
	border-radius: 8px;
	font-family: 'Karla', sans-serif;
	font-size: 13px;
	font-weight: 500;
	text-decoration: none;
	transition: all 200ms ease;
	margin-top: 8px;
}
.pt-cta-outline {
	background: transparent;
	color: var(--ink);
	border: 1px solid var(--ink);
}
.pt-cta-outline:hover {
	background: var(--ink);
	color: #FFFFFF;
	text-decoration: none;
}
.pt-cta-filled {
	background: var(--accent);
	color: #FFFFFF;
	border: 1px solid var(--accent);
}
.pt-cta-filled:hover {
	background: var(--accent-deep);
	border-color: var(--accent-deep);
	color: #FFFFFF;
	text-decoration: none;
}
.pt-cta:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
}
.pt-features-divider td {
	padding: 28px 18px 14px;
	border-bottom: 1px solid var(--line);
}
.pt-features-label {
	font-family: 'Playfair Display SC', 'Playfair Display', serif;
	font-size: 12px;
	letter-spacing: 0.16em;
	color: var(--accent);
	font-weight: 400;
}
.pricing-table tbody tr { border-top: 1px solid var(--line); }
.pricing-table tbody th {
	padding: 14px 18px;
	text-align: left;
	font-family: 'Karla', sans-serif;
	font-weight: 500;
	color: var(--ink);
	font-size: 14px;
}
.pricing-table tbody td {
	padding: 14px 18px;
	text-align: center;
	color: var(--ink-soft);
	font-size: 14px;
	vertical-align: middle;
	border-left: 1px solid var(--line);
}
.pricing-table tbody td.feat { background: var(--bg-soft); }
.pt-check { color: var(--accent); font-size: 18px; line-height: 1; }
.pt-minus { color: var(--muted); font-size: 18px; line-height: 1; }
.pt-sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
.pricing-foot {
	text-align: center;
	margin-top: 44px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
}
.pricing-foot p {
	font-size: 15px;
	color: var(--ink-soft);
	margin: 0;
	max-width: 460px;
}

/* ---------------------------------------------------------
   Dietary goals separator row (meal prep)
   --------------------------------------------------------- */
.goals-row {
	text-align: center;
	max-width: 880px;
	margin: 0 auto 48px;
	padding-bottom: 36px;
	border-bottom: 1px solid var(--line);
}
.goals-label {
	font-family: 'Playfair Display SC', 'Playfair Display', serif;
	font-size: 12px;
	letter-spacing: 0.16em;
	color: var(--accent);
	margin: 0 0 14px;
	font-weight: 400;
}
.goals-list {
	font-family: 'Karla', sans-serif;
	font-size: 15px;
	color: var(--ink);
	display: flex;
	flex-wrap: wrap;
	gap: 0;
	justify-content: center;
	align-items: center;
}
.goals-item {
	padding: 4px 14px 4px 0;
	margin-right: 14px;
	border-right: 1px solid var(--line);
	font-weight: 500;
}
.goals-item:last-child {
	border-right: 0;
	margin-right: 0;
	padding-right: 0;
}

/* ---------------------------------------------------------
   Sample weekly menu (meal prep)
   --------------------------------------------------------- */
.weekly-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
}
.week-card {
	background: var(--bg);
	border: 1px solid var(--line);
	border-radius: 10px;
	padding: 18px 16px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.week-card-day {
	font-family: 'Playfair Display SC', 'Playfair Display', serif;
	font-size: 10px;
	letter-spacing: 0.16em;
	color: var(--accent);
	margin: 0;
}
.week-card-name {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 15px;
	line-height: 1.3;
	margin: 0;
	font-weight: 500;
	color: var(--ink);
	flex: 1;
}
.week-card-macros {
	font-size: 11px;
	color: var(--muted);
	margin: 0;
	line-height: 1.4;
	border-top: 1px solid var(--line);
	padding-top: 8px;
	font-family: 'SF Mono', Monaco, monospace;
}

/* ---------------------------------------------------------
   Packaging tile grid (meal prep)
   --------------------------------------------------------- */
.packaging-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 28px;
	max-width: 1080px;
	margin: 0 auto;
}
.pack-tile {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 22px 20px;
	background: var(--bg);
	border: 1px solid var(--line);
	border-radius: 12px;
}
.pack-icon-wrap {
	width: 44px;
	height: 44px;
	border-radius: 10px;
	background: var(--accent-soft);
	display: flex;
	align-items: center;
	justify-content: center;
}
.pack-icon-wrap i {
	color: var(--accent);
	font-size: 24px;
}
.pack-title {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 17px;
	line-height: 1.3;
	margin: 0;
	font-weight: 500;
	color: var(--ink);
}
.pack-desc {
	font-size: 13.5px;
	color: var(--ink-soft);
	margin: 0;
	line-height: 1.55;
}

/* ---------------------------------------------------------
   Cluster responsive
   --------------------------------------------------------- */
@media (max-width: 920px) {
	.cluster-hero-inner { grid-template-columns: 1fr; gap: 40px; }
	.event-types-grid,
	.menus-grid,
	.feature-grid,
	.audience-grid,
	.packaging-grid { grid-template-columns: repeat(2, 1fr); }
	.process-steps,
	.process-steps-4,
	.experience-steps { grid-template-columns: repeat(2, 1fr); gap: 32px; }
	.process-connector,
	.experience-connector { display: none; }
	.process-num,
	.experience-num { background: transparent; }
	.capacity-grid-3 { grid-template-columns: 1fr; max-width: 480px; }
	.weekly-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
	.cluster-hero,
	.menus-section { padding: 56px 22px; }
	.event-types-grid,
	.menus-grid,
	.feature-grid,
	.audience-grid,
	.packaging-grid { grid-template-columns: 1fr; }
	.process-steps,
	.process-steps-4,
	.experience-steps { grid-template-columns: 1fr; }
	.capacity-grid { grid-template-columns: 1fr; }
	.weekly-grid { grid-template-columns: 1fr; }
	.qform-grid { grid-template-columns: 1fr; }
}

/* =========================================================
   Contact page (/contact). The form IS the conversion.
   ========================================================= */

/* ---------------------------------------------------------
   Compact contact hero (no bg image)
   --------------------------------------------------------- */
.contact-hero {
	padding: 72px 22px 48px;
	background: var(--bg-soft);
	text-align: center;
}
.contact-hero-inner {
	max-width: 700px;
	margin: 0 auto;
}
.contact-hero .crumb {
	font-size: 12px;
	color: #5F5E5A;
	margin: 0 0 22px;
}
.contact-hero .crumb ol {
	list-style: none;
	padding: 0;
	margin: 0;
	display: inline-flex;
	gap: 8px;
	align-items: center;
	flex-wrap: wrap;
	justify-content: center;
}
.contact-hero .crumb li {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
.contact-hero .crumb li:not(:last-child)::after {
	content: '/';
	color: #C7C2B5;
	margin-left: 8px;
}
.contact-hero .crumb a {
	color: #5F5E5A;
	text-decoration: none;
}
.contact-hero .crumb a:hover { color: var(--accent); text-decoration: none; }
.contact-hero .crumb [aria-current="page"] {
	color: var(--ink);
	font-weight: 500;
}
.contact-h1 {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: clamp(36px, 5vw, 52px);
	line-height: 1.08;
	letter-spacing: -0.015em;
	margin: 0 0 18px;
	font-weight: 500;
	color: var(--ink);
}
.contact-lead {
	font-size: 17px;
	color: var(--ink-soft);
	margin: 0 auto;
	line-height: 1.6;
	max-width: 560px;
}

/* ---------------------------------------------------------
   Contact form card (multi-service quote form)
   --------------------------------------------------------- */
.form-section {
	padding: 12px 22px 80px;
	background: var(--bg-soft);
}
.form-card {
	max-width: 820px;
	margin: 0 auto;
	background: var(--bg);
	border-radius: 16px;
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.10);
	padding: 40px 44px 36px;
}
.form-card-head { margin: 0 0 24px; }
.form-card-title {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 24px;
	line-height: 1.2;
	margin: 0 0 6px;
	font-weight: 500;
	color: var(--ink);
}
.form-card-sub {
	font-size: 14px;
	color: var(--ink-soft);
	margin: 0;
	line-height: 1.55;
}
.form-group { margin-bottom: 22px; }
.form-group-label {
	display: block;
	font-size: 13px;
	font-weight: 500;
	color: var(--ink);
	margin: 0 0 10px;
	letter-spacing: 0.02em;
}
.form-group-label .req { color: var(--accent); }

/* Service-interest radio cards (4 across) */
.form-radio-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 10px;
}
.form-radio { position: relative; }
.form-radio input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}
.form-radio label {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 14px 14px;
	border: 1.5px solid var(--line);
	border-radius: 10px;
	font-size: 13px;
	font-weight: 500;
	color: var(--ink);
	cursor: pointer;
	transition: border-color 200ms ease, background 200ms ease;
	align-items: center;
	text-align: center;
	min-height: 64px;
	justify-content: center;
}
.form-radio label i {
	font-size: 20px;
	color: var(--accent);
}
.form-radio input:checked + label {
	border-color: var(--accent);
	background: var(--accent-soft);
}
.form-radio input:focus-visible + label {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
}

/* Standard field grid */
.form-grid-2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
	margin-bottom: 22px;
}
.form-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.form-field.full { grid-column: 1 / -1; }
.form-field label {
	font-size: 12px;
	font-weight: 500;
	color: var(--ink);
	letter-spacing: 0.02em;
}
.form-field label .req { color: var(--accent); }
.form-field input,
.form-field textarea {
	font-family: 'Karla', sans-serif;
	font-size: 14px;
	color: var(--ink);
	background: var(--bg-soft);
	border: 1px solid var(--line);
	border-radius: 8px;
	padding: 12px 14px;
	min-height: 46px;
	transition: border-color 200ms ease, background 200ms ease;
}
.form-field input:focus,
.form-field textarea:focus {
	outline: 2px solid var(--accent);
	outline-offset: 2px;
	background: #FFFFFF;
	border-color: var(--accent);
}
.form-field textarea {
	min-height: 110px;
	resize: vertical;
	line-height: 1.55;
}
.form-submit {
	background: var(--accent);
	color: #FFFFFF;
	border: none;
	padding: 16px 22px;
	min-height: 52px;
	border-radius: 10px;
	font-family: 'Karla', sans-serif;
	font-size: 16px;
	font-weight: 500;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	transition: background 200ms ease;
	width: 100%;
	margin-top: 8px;
}
.form-submit:hover { background: var(--accent-deep); }
.form-submit:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 4px;
}
.form-fineprint {
	font-size: 12px;
	color: var(--muted);
	margin: 12px 0 0;
	text-align: center;
	line-height: 1.5;
}

/* ---------------------------------------------------------
   Reassurance row (contact)
   --------------------------------------------------------- */
.reassure-section {
	padding: 56px 22px;
	background: var(--bg);
}
.reassure-row {
	max-width: 880px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.reassure-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 10px;
}
.reassure-icon {
	font-size: 26px;
	color: var(--accent);
}
.reassure-title {
	font-family: 'Karla', sans-serif;
	font-size: 15px;
	font-weight: 500;
	color: var(--ink);
	margin: 0;
}
.reassure-sub {
	font-size: 13px;
	color: var(--ink-soft);
	margin: 0;
	line-height: 1.5;
}

/* ---------------------------------------------------------
   Alternate contact methods (dark ink-bg section)
   --------------------------------------------------------- */
.alt-section {
	padding: 56px 22px 64px;
	background: var(--ink);
	color: #FFFFFF;
}
.alt-inner {
	max-width: 800px;
	margin: 0 auto;
	text-align: center;
}
.alt-eyebrow {
	font-family: 'Playfair Display SC', 'Playfair Display', serif;
	font-size: 13px;
	letter-spacing: 0.15em;
	color: var(--accent-soft);
	margin: 0 0 12px;
	font-weight: 400;
}
.alt-h2 {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: clamp(26px, 3.5vw, 32px);
	line-height: 1.2;
	margin: 0 0 24px;
	font-weight: 500;
	color: #FFFFFF;
	letter-spacing: -0.01em;
}
.alt-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
	max-width: 480px;
	margin: 0 auto;
}
.alt-card {
	background: #1A1A1A;
	border-radius: 12px;
	padding: 22px 18px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
}
.alt-card i {
	font-size: 24px;
	color: var(--accent);
}
.alt-card-label {
	font-family: 'Playfair Display SC', 'Playfair Display', serif;
	font-size: 11px;
	letter-spacing: 0.15em;
	color: var(--accent-soft);
	margin: 4px 0 0;
	font-weight: 400;
}
.alt-card-value {
	font-size: 15px;
	font-weight: 500;
	color: #FFFFFF;
	margin: 0;
}
.alt-card a {
	color: #FFFFFF;
	text-decoration: none;
}
.alt-card a:hover { color: var(--accent); text-decoration: none; }

/* ---------------------------------------------------------
   Mini FAQ (contact, 3 items, smaller than cluster FAQs)
   --------------------------------------------------------- */
.faq-section {
	padding: 72px 22px 72px;
	background: var(--bg);
}
.faq-head {
	text-align: center;
	max-width: 600px;
	margin: 0 auto 32px;
}
.faq-section h2 {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: clamp(26px, 3.5vw, 32px);
	line-height: 1.2;
	margin: 0;
	font-weight: 500;
	color: var(--ink);
	letter-spacing: -0.01em;
}
.faq-section .faq-item h3 { font-size: 18px; }

/* ---------------------------------------------------------
   Contact responsive
   --------------------------------------------------------- */
@media (max-width: 920px) {
	.form-radio-grid { grid-template-columns: repeat(2, 1fr); }
	.alt-grid {
		grid-template-columns: 1fr;
		gap: 14px;
		max-width: 480px;
	}
}
@media (max-width: 720px) {
	.contact-hero,
	.form-section,
	.reassure-section,
	.alt-section,
	.faq-section {
		padding-left: 22px;
		padding-right: 22px;
	}
	.form-card {
		padding: 28px 22px 24px;
		border-radius: 12px;
	}
	.form-grid-2 {
		grid-template-columns: 1fr;
		gap: 14px;
	}
	.reassure-row {
		grid-template-columns: 1fr;
		gap: 28px;
	}
}