/* ==========================================================================
   Farway Grange theme – main stylesheet (mobile-first)
   Tokens from /theme/build/design-system.md. CTAs: Jungle text on Amber (5.76:1).
   0.2.13: hero = one photo + one gradient (no blurred panel); CookieYes badge clear of mobile bar.
   0.2.12: white base, alternating dark Jungle/Forest bands, full-bleed photo heroes.
   ========================================================================== */

:root {
	--fg-jungle: #1a2e0b;
	--fg-forest: #324920;
	--fg-moss: #456b27;
	--fg-lime: #9fdf91;
	--fg-amber: #fe7f2d;
	--fg-cotton: #FFFEDE; /* locked to live farwaygrange.com cream (0.2.1) */
	--fg-cream: var(--fg-cotton); /* alias used by Elementor kit CSS */
	--fg-cloud: #f8f6eb;
	--fg-white: #fff;
	--fg-slate: #475569;

	/* 0.2.30 Direction B (Letters): paper notes. Swap this block to try direction C later. */
	--fg-note-paper: #FFFEDE;
	--fg-note-paper-2: #f7efd2;
	--fg-note-ground: #ebe4d2; /* muted taupe; section ground only, never a full-page background */
	--fg-note-ink: var(--fg-jungle);
	--fg-note-signed: var(--fg-forest);
	--fg-note-rule: rgba(26, 46, 11, 0.16);
	--fg-note-shadow: 0 1px 1px rgba(26, 46, 11, 0.06), 0 10px 28px rgba(26, 46, 11, 0.12);
	--fg-note-snap-shadow: 0 2px 8px rgba(26, 46, 11, 0.1);
	--fg-note-tilt: 0deg;
	--fg-note-radius: 4px;

	/* 0.2.32 calm flat cards (used sparingly with .fg-flat / .fg-flat--edge). */
	--fg-flat-bg: #fff;
	--fg-flat-border: 1px solid rgba(26, 46, 11, 0.12);
	--fg-flat-shadow: 0 1px 2px rgba(26, 46, 11, 0.05);
	--fg-flat-accent: var(--fg-amber);
	--fg-flat-edge: 4px solid var(--fg-flat-accent);

	--fg-serif: "Fraunces", Georgia, "Times New Roman", serif;
	--fg-sans: "Instrument Sans", "Segoe UI", system-ui, -apple-system, sans-serif;

	--fg-s1: 4px; --fg-s2: 8px; --fg-s3: 16px; --fg-s4: 24px;
	--fg-s5: 32px; --fg-s6: 48px; --fg-s7: 64px; --fg-s8: 96px;
	--fg-section: 40px;
	--fg-hero-pad: 40px;

	--fg-width: 1120px;
	--fg-gutter: 20px;
	--fg-radius: 8px;
	--fg-radius-lg: 20px;
	--fg-shadow: 0 8px 24px rgba(26, 46, 11, 0.08);
	--fg-header-h: 88px;
}

@media (min-width: 768px) {
	:root { --fg-section: 64px; --fg-hero-pad: 64px; --fg-gutter: 24px; }
}
@media (min-width: 1024px) {
	:root { --fg-section: 96px; --fg-hero-pad: 96px; }
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--fg-header-h) + 16px); }
body {
	margin: 0;
	background: var(--fg-white); /* 0.2.12: white base (was Cotton) */
	color: var(--fg-jungle);
	font-family: var(--fg-sans);
	font-size: 1rem;
	line-height: 1.5;
	padding-bottom: 72px; /* room for mobile quick-contact bar */
}
@media (min-width: 768px) { body { font-size: 1.125rem; line-height: 1.55; padding-bottom: 0; } }

img, svg, video { max-width: 100%; height: auto; display: block; }
a { color: var(--fg-jungle); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible {
	outline: 2px solid var(--fg-jungle);
	outline-offset: 2px;
	box-shadow: 0 0 0 4px var(--fg-cotton);
	border-radius: 2px;
}
.fg-band--green :focus-visible, .fg-footer :focus-visible, .fg-trust :focus-visible {
	outline-color: var(--fg-cotton);
	box-shadow: 0 0 0 4px var(--fg-jungle);
}

h1, h2, h3, h4 { font-family: var(--fg-serif); font-weight: 400; line-height: 1.2; margin: 0 0 var(--fg-s3); letter-spacing: -0.01em; }
h1 { font-size: 1.75rem; }
h2 { font-size: 1.5rem; }
h3, .fg-h3 { font-size: 1.25rem; font-weight: 500; }
@media (min-width: 768px) { h1 { font-size: 2.125rem; } h2 { font-size: 1.75rem; } h3, .fg-h3 { font-size: 1.375rem; } }
@media (min-width: 1024px) { h1 { font-size: 3rem; line-height: 1.125; } h2 { font-size: 2rem; line-height: 1.25; } h3, .fg-h3 { font-size: 1.5rem; } }
p { margin: 0 0 var(--fg-s3); }
address { font-style: normal; margin-bottom: var(--fg-s3); }

.screen-reader-text {
	border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
	height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0;
	position: absolute !important; word-wrap: normal !important;
}
.fg-skip-link:focus {
	clip: auto; clip-path: none; height: auto; width: auto; margin: 0;
	left: 8px; top: 8px; z-index: 1000; padding: 12px 20px;
	background: var(--fg-amber); color: var(--fg-jungle); font-weight: 600;
}
.fg-main:focus { outline: none; }

/* ---------- Layout ---------- */
.fg-container { width: 100%; max-width: calc(var(--fg-width) + 2 * var(--fg-gutter)); margin: 0 auto; padding: 0 var(--fg-gutter); }
.fg-narrow { max-width: 760px; }
.fg-center { text-align: center; }
.fg-prose { max-width: 72ch; }
.fg-prose > * + h2 { margin-top: var(--fg-s6); }
.fg-prose > * + h3 { margin-top: var(--fg-s5); }
.fg-prose ul, .fg-prose ol { padding-left: 1.25em; }
.fg-prose li + li { margin-top: var(--fg-s2); }
.fg-rounded { border-radius: var(--fg-radius-lg); }

.fg-band { padding: var(--fg-section) 0; }
.fg-band--cream { background: var(--fg-white); } /* 0.2.12: legacy class now white; templates use --white */
.fg-band--white { background: var(--fg-white); }
.fg-band--cloud { background: var(--fg-cloud); }
.fg-band--green { background: var(--fg-jungle); color: var(--fg-cotton); }
.fg-band--green a:not(.fg-btn), .fg-band--green h2, .fg-band--green h3 { color: var(--fg-cotton); }
.fg-band--green .fg-eyebrow { color: var(--fg-lime); }
.fg-band--amber { background: var(--fg-amber); color: var(--fg-jungle); }

.fg-grid { display: grid; gap: var(--fg-s4); grid-template-columns: 1fr; }
@media (min-width: 768px) {
	.fg-grid--2 { grid-template-columns: repeat(2, 1fr); gap: var(--fg-s5); }
	.fg-grid--3 { grid-template-columns: repeat(3, 1fr); gap: var(--fg-s5); }
	.fg-grid--4 { grid-template-columns: repeat(2, 1fr); }
	.fg-grid--contact { grid-template-columns: 5fr 7fr; gap: var(--fg-s6); }
}
@media (min-width: 1024px) { .fg-grid--4 { grid-template-columns: repeat(4, 1fr); } }

.fg-section-head { max-width: 720px; margin-bottom: var(--fg-s5); }
.fg-eyebrow {
	font-family: var(--fg-sans); font-size: 0.8125rem; font-weight: 600;
	letter-spacing: 0.08em; text-transform: uppercase; color: var(--fg-moss); margin-bottom: var(--fg-s2);
}
.fg-lead { font-size: 1.125rem; line-height: 1.55; max-width: 60ch; }
@media (min-width: 1024px) { .fg-lead { font-size: 1.25rem; } }

/* ---------- Buttons ---------- */
.fg-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 0.4em;
	min-height: 48px; padding: 12px 26px;
	border-radius: var(--fg-radius); border: 2px solid transparent;
	font-family: var(--fg-sans); font-size: 1rem; font-weight: 600; line-height: 1.25;
	text-decoration: none; cursor: pointer; text-align: center;
	transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.fg-btn--primary { background: var(--fg-amber); color: var(--fg-jungle); }
.fg-btn--primary:hover { background: var(--fg-forest); color: var(--fg-cotton); }
.fg-btn--secondary { background: transparent; color: var(--fg-jungle); border-color: var(--fg-jungle); }
.fg-btn--secondary:hover { background: var(--fg-jungle); color: var(--fg-cotton); }
.fg-btn--ghost { background: transparent; color: var(--fg-cotton); border-color: var(--fg-cotton); }
.fg-btn--ghost:hover { background: var(--fg-cotton); color: var(--fg-jungle); }
.fg-btn--jungle { background: var(--fg-jungle); color: var(--fg-cotton); }
.fg-btn--jungle:hover { background: var(--fg-forest); color: var(--fg-cotton); }
.fg-band--green .fg-btn--secondary { color: var(--fg-cotton); border-color: var(--fg-cotton); }
.fg-band--green .fg-btn--secondary:hover { background: var(--fg-cotton); color: var(--fg-jungle); }
.fg-btn--lg { font-size: 1.125rem; min-height: 56px; padding: 14px 30px; }
.fg-actions { display: flex; flex-wrap: wrap; gap: var(--fg-s3); margin-top: var(--fg-s4); }
.fg-actions--center { justify-content: center; }

/* ---------- Staging banner ---------- */
.fg-staging-banner { background: var(--fg-lime); color: var(--fg-jungle); font-size: 0.875rem; text-align: center; padding: 6px var(--fg-gutter); }

/* ---------- Header ---------- */
.fg-header { position: sticky; top: 0; z-index: 100; background: var(--fg-white); border-bottom: 1px solid rgba(26, 46, 11, 0.12); }
.admin-bar .fg-header { top: 46px; }
@media (min-width: 783px) { .admin-bar .fg-header { top: 32px; } }
.fg-topbar { background: var(--fg-jungle); color: var(--fg-cotton); font-size: 0.875rem; }
.fg-topbar__inner { display: flex; justify-content: space-between; align-items: center; gap: var(--fg-s3); min-height: 36px; }
.fg-topbar__text { margin: 0; display: none; }
.fg-topbar__phone { color: var(--fg-cotton); font-weight: 600; text-decoration: none; margin-left: auto; }
.fg-topbar__phone:hover { text-decoration: underline; }
@media (min-width: 768px) { .fg-topbar__text { display: block; } }

.fg-header__inner { display: flex; align-items: center; justify-content: space-between; gap: var(--fg-s3); min-height: var(--fg-header-h); }
/* 0.2.17: .fg-header prefix + !important beat the legacy Elementor kit CSS (post-25: .fg-logo 240px/205px !important, img width fixed). */
.fg-header .fg-logo { display: block; flex: 0 0 auto; width: auto !important; max-width: none !important; line-height: 0; }
.fg-header .fg-logo img { display: block; width: auto !important; max-width: none !important; height: 66px !important; }
.fg-header__actions { flex-shrink: 0; }
@media (max-width: 359px) {
	.fg-header .fg-logo img { height: 60px !important; }
}
@media (min-width: 1024px) {
	:root { --fg-header-h: 124px; }
	.fg-header .fg-logo img { height: 100px !important; }
}
.fg-header__actions { display: flex; align-items: center; gap: var(--fg-s3); }
.fg-header__actions .fg-btn--primary { display: none; }
.fg-header__phone { display: none; font-weight: 600; text-decoration: none; }
@media (min-width: 768px) {
	.fg-header__actions .fg-btn--primary { display: inline-flex; }
}
@media (min-width: 1024px) { .fg-header__phone { display: inline-block; } }

.fg-nav-toggle {
	display: inline-flex; align-items: center; gap: 8px; min-height: 44px; min-width: 44px;
	padding: 8px 12px; background: transparent; border: 2px solid var(--fg-jungle); border-radius: var(--fg-radius);
	color: var(--fg-jungle); font: 600 1rem var(--fg-sans); cursor: pointer;
}
.fg-nav-toggle__bars, .fg-nav-toggle__bars::before, .fg-nav-toggle__bars::after {
	display: block; width: 18px; height: 2px; background: currentColor; position: relative; content: ""; transition: transform .2s;
}
.fg-nav-toggle__bars::before { position: absolute; top: -6px; }
.fg-nav-toggle__bars::after { position: absolute; top: 6px; }
.fg-nav-toggle[aria-expanded="true"] .fg-nav-toggle__bars { background: transparent; }
.fg-nav-toggle[aria-expanded="true"] .fg-nav-toggle__bars::before { transform: translateY(6px) rotate(45deg); }
.fg-nav-toggle[aria-expanded="true"] .fg-nav-toggle__bars::after { transform: translateY(-6px) rotate(-45deg); }

.fg-nav { display: none; border-top: 1px solid rgba(26, 46, 11, 0.12); }
.fg-nav.is-open { display: block; }
.fg-menu, .fg-menu ul { list-style: none; margin: 0; padding: 0; }
.fg-menu a { display: block; padding: 12px 0; text-decoration: none; font-weight: 500; border-bottom: 1px solid rgba(26, 46, 11, 0.08); }
.fg-menu .current-menu-item > a, .fg-menu .current_page_item > a { text-decoration: underline; text-decoration-color: var(--fg-amber); text-decoration-thickness: 3px; }
.fg-menu .sub-menu a { padding-left: var(--fg-s3); font-weight: 400; }

@media (min-width: 1024px) {
	.fg-nav-toggle { display: none; }
	.fg-nav { display: block; }
	.fg-menu { display: flex; flex-wrap: wrap; gap: var(--fg-s1) var(--fg-s4); }
	.fg-menu > li { position: relative; }
	.fg-menu a { border: 0; padding: 12px 0; font-size: 1rem; }
	.fg-menu .sub-menu {
		display: none; position: absolute; top: 100%; left: -16px; min-width: 280px; max-width: 20rem; z-index: 10;
		background: var(--fg-white); box-shadow: var(--fg-shadow); border-radius: var(--fg-radius); padding: 8px 16px;
	}
	.fg-menu li:hover > .sub-menu, .fg-menu li:focus-within > .sub-menu { display: block; }
	.fg-menu .sub-menu a { padding: 8px 0; white-space: normal; line-height: 1.3; }
}

/* 0.2.34: How our two homes work explainer + at-a-glance table. */
.fg-homes-work { }
/* 0.2.35: explainer is only white or Cloud. Taupe stays on testimonials. */
.fg-homes-work.fg-band--cloud { background: var(--fg-cloud); color: var(--fg-jungle); }
.fg-homes-work.fg-band--white { background: var(--fg-white); color: var(--fg-jungle); }
.fg-homes-work__intro { max-width: 48rem; }
.fg-homes-work__intro p { margin: 0 0 var(--fg-s3); }
.fg-homes-work .fg-table { min-width: 36rem; }
.fg-homes-work .fg-table thead th:first-child { width: 8.5rem; }
.fg-cqc__note { margin: var(--fg-s2) 0 0; font-size: 0.9375rem; }

/* ---------- Hero ---------- */
.fg-hero { padding: var(--fg-hero-pad) 0 var(--fg-section); background: var(--fg-cloud); }
.fg-hero__inner { display: grid; gap: var(--fg-s5); align-items: center; }
.fg-hero__title { max-width: 18ch; }
.fg-hero--page .fg-hero__title { max-width: 22ch; }
.fg-hero__media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--fg-radius-lg); box-shadow: var(--fg-shadow); }
@media (min-width: 1024px) {
	.fg-hero--has-photo .fg-hero__inner { grid-template-columns: 6fr 5fr; gap: var(--fg-s6); }
	.fg-hero__media img { aspect-ratio: 5 / 4; }
}

/* ---------- Trust strip ---------- */
.fg-trust { background: var(--fg-forest); color: var(--fg-cotton); padding: var(--fg-s4) 0; }
.fg-trust__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--fg-s3); grid-template-columns: 1fr; }
.fg-trust__item { display: flex; align-items: flex-start; gap: 12px; font-size: 0.9375rem; line-height: 1.4; }
.fg-trust__item .fg-icon { width: 32px; height: 32px; flex: 0 0 32px; }
.fg-trust__item strong { display: block; font-weight: 600; }
.fg-trust__sub { display: block; color: var(--fg-cotton); opacity: .9; font-size: 0.875rem; }
a.fg-trust__sub { color: var(--fg-lime); opacity: 1; }
/* 0.2.35: five items (FHRS removed). Stack, then 2, then 3, then one row at 1440. */
@media (min-width: 600px) { .fg-trust__list { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 900px) { .fg-trust__list { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1440px) { .fg-trust__list { grid-template-columns: repeat(5, 1fr); gap: var(--fg-s4); } }

/* ---------- Cards ---------- */
.fg-card { background: var(--fg-white); border-radius: var(--fg-radius-lg); box-shadow: var(--fg-shadow); overflow: hidden; display: flex; flex-direction: column; }
.fg-card__media img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.fg-card__body { padding: var(--fg-s4); flex: 1; }
@media (min-width: 768px) { .fg-card__body { padding: var(--fg-s5); } }
.fg-card__meta { font-size: 0.875rem; font-weight: 600; color: var(--fg-moss); margin-bottom: var(--fg-s2); }
.fg-card--home { position: relative; border-left: 4px solid var(--fg-lime); }
.fg-card__link { text-decoration: none; }
.fg-card__link::after { content: ""; position: absolute; inset: 0; } /* whole card clickable */
.fg-card--home:hover .fg-card__link, .fg-card--home:focus-within .fg-card__link { text-decoration: underline; }
.fg-card__cta { margin: 0; font-weight: 600; color: var(--fg-jungle); }
.fg-card--plain { border-left: 4px solid var(--fg-amber); }
.fg-card--post { padding: var(--fg-s4); margin-bottom: var(--fg-s4); }

.fg-feature .fg-icon { width: 48px; height: 48px; margin-bottom: var(--fg-s3); }

/* ---------- Split / quote ---------- */
.fg-split { display: grid; gap: var(--fg-s5); align-items: center; }
@media (min-width: 1024px) { .fg-split { grid-template-columns: 7fr 5fr; gap: var(--fg-s7); } }
.fg-split__media img { border-radius: var(--fg-radius-lg); width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.fg-split__quote { margin: 0; padding: var(--fg-s5); border-left: 4px solid var(--fg-amber); background: var(--fg-forest); border-radius: 0 var(--fg-radius-lg) var(--fg-radius-lg) 0; }
.fg-split__quote blockquote { margin: 0; }
.fg-split__quote p { font-family: var(--fg-serif); font-size: 1.375rem; line-height: 1.35; margin: 0; color: var(--fg-cotton); }
@media (min-width: 1024px) { .fg-split__quote p { font-size: 1.75rem; } }

/* ---------- Gallery ---------- */
.fg-gallery { display: grid; gap: var(--fg-s3); margin: var(--fg-s6) 0 var(--fg-s4); grid-template-columns: 1fr 1fr; }
.fg-gallery__item { margin: 0; }
.fg-gallery__item img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--fg-radius-lg); } /* 0.2.22: height auto (height:100% collapsed in indefinite rows) */
.fg-gallery__item--wide { grid-column: 1 / -1; }
.fg-gallery__item--wide img { aspect-ratio: 16 / 9; }
.fg-gallery figcaption { font-size: 0.9375rem; color: var(--fg-slate); margin-top: var(--fg-s2); }
@media (min-width: 1024px) {
	.fg-gallery { grid-template-columns: 2fr 1fr; grid-template-rows: auto auto; }
	/* 0.2.22: the wide item spans both rows and its photo fills the space left by its caption
	   (flex), with a real minimum height, so it can never collapse to zero. */
	.fg-gallery__item--wide { grid-column: 1; grid-row: 1 / span 2; display: flex; flex-direction: column; }
	.fg-gallery__item--wide img { flex: 1 1 0; min-height: 20rem; height: auto; aspect-ratio: auto; }
}

/* ---------- Facts / values / CQC ---------- */
.fg-facts { display: grid; gap: var(--fg-s3); grid-template-columns: 1fr; margin: 0 0 var(--fg-s6); }
@media (min-width: 600px) { .fg-facts { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .fg-facts { grid-template-columns: repeat(4, 1fr); } }
.fg-facts__item { background: var(--fg-white); border-radius: var(--fg-radius-lg); padding: var(--fg-s4); box-shadow: var(--fg-shadow); }
.fg-facts__item .fg-icon { width: 36px; height: 36px; margin-bottom: var(--fg-s2); }
.fg-facts dt { font-size: 0.8125rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--fg-moss); }
.fg-facts dd { margin: 4px 0 0; font-weight: 500; }

.fg-values { list-style: none; padding: 0; margin: 0; }
.fg-value { background: var(--fg-forest); border-radius: var(--fg-radius-lg); padding: var(--fg-s5) var(--fg-s4); border-top: 4px solid var(--fg-lime); }
.fg-value span { font-family: var(--fg-serif); font-size: 1.5rem; color: var(--fg-cotton); }
.fg-value span { display: block; }
.fg-value p { margin: var(--fg-s2) 0 0; font-size: 1rem; color: var(--fg-cotton); }
.fg-timeline { list-style: none; padding: 0; margin: 0; }
.fg-timeline__year { font-family: var(--fg-serif); font-size: 2rem; color: var(--fg-amber); margin-bottom: var(--fg-s2); line-height: 1.1; }

.fg-cqc__title { font-weight: 600; margin-bottom: var(--fg-s2); }
.fg-cqc__placeholder { border: 2px dashed rgba(26, 46, 11, 0.3); border-radius: var(--fg-radius); padding: var(--fg-s4); }
.fg-cqc--widget { margin-top: var(--fg-s3); max-width: 20rem; }
.fg-cqc__widget { min-height: 4rem; }
.fg-cqc__fallback { margin-top: var(--fg-s2); }

/* ---------- CTA band ---------- */
.fg-cta-band { padding: var(--fg-s7) 0; }
.fg-cta-band__inner { display: grid; gap: var(--fg-s4); align-items: center; }
.fg-cta-band h2 { color: var(--fg-jungle); }
.fg-cta-band p { max-width: 60ch; margin-bottom: 0; }
.fg-cta-band__actions { display: flex; flex-wrap: wrap; gap: var(--fg-s3); }
.fg-cta-band :focus-visible { outline-color: var(--fg-jungle); box-shadow: 0 0 0 4px var(--fg-cotton); }
@media (min-width: 1024px) { .fg-cta-band__inner { grid-template-columns: 1fr auto; gap: var(--fg-s6); } }

/* ---------- Contact ---------- */
.fg-contact__phone { margin: var(--fg-s3) 0 var(--fg-s5); }
.fg-contact img { margin-top: var(--fg-s4); width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }

/* ---------- Footer ---------- */
.fg-footer { background: var(--fg-jungle); color: var(--fg-cotton); padding-top: var(--fg-s7); font-size: 0.9375rem; }
.fg-footer a { color: var(--fg-cotton); }
.fg-footer h3 { font-size: 1.125rem; color: var(--fg-cotton); }
.fg-footer__grid { display: grid; gap: var(--fg-s5); padding-bottom: var(--fg-s6); }
@media (min-width: 768px) { .fg-footer__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .fg-footer__grid { grid-template-columns: 4fr 3fr 2fr 3fr; } }
.fg-footer__brand img { width: 200px; margin-bottom: var(--fg-s3); }
.fg-footer__brand p:first-of-type { font-family: var(--fg-serif); font-size: 1.125rem; }
.fg-footer__phone a { font-weight: 600; font-size: 1.125rem; }
.fg-footer__links { list-style: none; margin: 0; padding: 0; }
.fg-footer__links li + li { margin-top: var(--fg-s2); }
.fg-footer__legal { border-top: 1px solid rgba(255, 254, 222, 0.2); padding: var(--fg-s4) 0; font-size: 0.875rem; }
.fg-footer__legal-inner { display: grid; gap: var(--fg-s3); }
.fg-footer__legal p { margin: 0; }
.fg-footer__legal-links { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--fg-s2) var(--fg-s4); }

/* ---------- Mobile quick-contact bar (phone always visible) ---------- */
.fg-mobile-bar {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
	display: grid; grid-template-columns: 1fr 1fr; gap: var(--fg-s2);
	padding: var(--fg-s2) var(--fg-gutter) calc(var(--fg-s2) + env(safe-area-inset-bottom));
	background: var(--fg-white); box-shadow: 0 -4px 16px rgba(26, 46, 11, 0.12);
}
.fg-mobile-bar .fg-btn { padding: 10px 12px; }
.fg-mobile-bar .fg-phone-number { white-space: nowrap; }
@media (min-width: 768px) { .fg-mobile-bar { display: none; } }
/* 0.2.13: CookieYes "Consent Preferences" badge (.cky-btn-revisit-wrapper, fixed
   bottom-left 8px, 36px, injected by the CookieYes script) sat on top of the
   quick-contact bar and clipped the "C" of Call. While the bar is shown (<768px) and
   the badge is visible, inset the bar on the left so the badge sits in its own slot
   inside the bar (no overlap, and it never floats over page text), and centre the
   badge vertically on the bar. :has() keeps the bar full-width when the badge is
   hidden or CookieYes is absent. !important on the badge only because CookieYes
   injects its own stylesheet after ours. */
@media (max-width: 767.98px) {
	body:has(.cky-btn-revisit-wrapper.cky-revisit-bottom-left:not(.cky-revisit-hide)) .fg-mobile-bar {
		padding-left: 54px;
		grid-template-columns: 1.15fr 1fr;
	}
	body .cky-btn-revisit-wrapper.cky-revisit-bottom-left {
		left: 9px !important;
		bottom: calc(14px + env(safe-area-inset-bottom)) !important;
	}
	/* 0.2.18: keep page end clear of the bar on notched phones. */
	body { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
}
/* 0.2.18: narrow phones – the nowrap number made the Call column (1.15fr) eat the row and
   "Book a visit" wrapped to 3 lines. Show "Call" only (number stays in the link's accessible
   name, visually hidden), keep both labels on one line, give Book a visit the wider column. */
@media (max-width: 419.98px) {
	.fg-mobile-bar,
	body:has(.cky-btn-revisit-wrapper.cky-revisit-bottom-left:not(.cky-revisit-hide)) .fg-mobile-bar {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
	}
	.fg-mobile-bar .fg-btn { min-height: 48px; padding: 10px 8px; font-size: 0.9375rem; white-space: nowrap; }
	.fg-mobile-bar .fg-phone-number {
		position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden;
		clip: rect(0 0 0 0); clip-path: inset(50%); border: 0; white-space: nowrap;
	}
	.fg-mobile-bar .fg-phone-label { white-space: nowrap; }
}

/* 0.2.48: pre-consent Chat with us launcher sits where Eliza’s bubble will appear. */
.fg-eliza__launcher {
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 99990;
	margin: 0;
	padding: 12px 18px;
	border: 0;
	border-radius: 999px;
	background: var(--fg-jungle);
	color: var(--fg-cotton);
	font: 600 0.9375rem var(--fg-sans);
	line-height: 1.2;
	cursor: pointer;
	box-shadow: 0 4px 16px rgba(26, 46, 11, 0.28);
}
.fg-eliza__launcher:hover,
.fg-eliza__launcher:focus-visible {
	background: var(--fg-forest);
}
.fg-eliza__launcher:focus-visible {
	outline: 2px solid var(--fg-amber);
	outline-offset: 3px;
}
.fg-eliza__notice {
	position: fixed;
	right: 24px;
	bottom: 72px;
	z-index: 99991;
	width: min(22rem, calc(100vw - 32px));
	padding: 16px 18px;
	border-radius: 12px;
	background: var(--fg-white);
	color: var(--fg-jungle);
	box-shadow: 0 8px 28px rgba(26, 46, 11, 0.22);
}
.fg-eliza__notice p {
	margin: 0 0 14px;
	font-size: 0.9375rem;
	line-height: 1.45;
}
.fg-eliza__notice-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.fg-eliza__continue,
.fg-eliza__cancel {
	margin: 0;
	padding: 8px 14px;
	border-radius: 999px;
	font: 600 0.875rem var(--fg-sans);
	cursor: pointer;
}
.fg-eliza__continue {
	border: 0;
	background: var(--fg-jungle);
	color: var(--fg-cotton);
}
.fg-eliza__cancel {
	border: 1px solid var(--fg-jungle);
	background: transparent;
	color: var(--fg-jungle);
}
.fg-eliza__continue:focus-visible,
.fg-eliza__cancel:focus-visible {
	outline: 2px solid var(--fg-amber);
	outline-offset: 2px;
}
@media (max-width: 767.98px) {
	.fg-eliza__launcher {
		bottom: var(--eliza-launcher-bottom, 24px);
	}
	.fg-eliza__notice {
		bottom: calc(var(--eliza-launcher-bottom, 24px) + 56px);
	}
}

/* 0.2.49: on small screens the first-layer CookieYes banner (~366px, z-index
   9999999) covered both the sticky Call/Book bar and the Chat with us launcher,
   so neither could be used until a cookie choice was made. Sit the banner on
   top of the bar, and hide the chat placeholder until the banner is dismissed.
   After Accept or Reject, the existing badge slot and --eliza-launcher-bottom
   lift keep Chat with us (or Eliza) clear of the bar and the badge. */
@media (max-width: 767.98px) {
	body .cky-consent-container:not(.cky-hide) {
		bottom: calc(72px + env(safe-area-inset-bottom, 0px)) !important;
	}
	body:has(.cky-consent-container:not(.cky-hide)) .fg-eliza__placeholder {
		visibility: hidden;
		pointer-events: none;
	}
}

/* 0.2.50: below 768px, pad the footer so the company / registered-office line
   can scroll clear of both Chat with us and the sticky Call/Book bar after a
   cookie choice. The old 72px body padding only cleared the bar, so the legal
   line sat under the launcher; clearance now lives on the footer (jungle
   continues under the chrome) and the body pad is dropped to avoid a double gap. */
@media (max-width: 767.98px) {
	.fg-footer {
		padding-bottom: calc(140px + env(safe-area-inset-bottom, 0px));
	}
	body { padding-bottom: 0; }
}

/* 0.2.50: sticky-bar “Book a visit” must stay brand amber in every state, on
   every page. The generic .fg-btn--primary:hover (and :active) restyle the
   button to Forest (#324920) + Cotton — that is the dark green seen on Contact
   after Reject, when the pointer was left over the button (the CookieYes
   Reject control sits in the same spot as the bar). Not a page-specific or
   post-consent rule. Amber (#fe7f2d) on Jungle (#1a2e0b) is 5.76:1 (WCAG AA).
   Cotton on amber would fail, so the type stays Jungle. */
.fg-mobile-bar .fg-btn--primary,
.fg-mobile-bar .fg-btn--primary:link,
.fg-mobile-bar .fg-btn--primary:visited,
.fg-mobile-bar .fg-btn--primary:hover,
.fg-mobile-bar .fg-btn--primary:focus,
.fg-mobile-bar .fg-btn--primary:focus-visible,
.fg-mobile-bar .fg-btn--primary:active {
	background: var(--fg-amber);
	color: var(--fg-jungle);
	border-color: transparent;
	text-decoration: none;
}

/* 0.2.20: Lottie Eliza launcher defaults to bottom-right (right:24px, bottom:24px,
   z-index ~2147483646). Without a lift it sits on top of the sticky Call/Book bar
   at 320/393 widths (bar ~56–72px + safe-area; CookieYes badge is bottom-left so
   it does not collide with Eliza horizontally). Eliza documents --eliza-launcher-bottom
   for sticky bottom chrome — lift the bubble clear of the bar. Desktop: bar hidden. */
@media (max-width: 767.98px) {
	:root {
		--eliza-launcher-bottom: calc(72px + env(safe-area-inset-bottom, 0px) + 12px);
	}
}

/* ---------- Elementor coexistence ---------- */
.fg-elementor-content { width: 100%; }

/* ---------- WordPress core ---------- */
.alignwide { max-width: var(--fg-width); }
.alignfull { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); }
.wp-caption-text, .wp-element-caption { font-size: 0.875rem; color: var(--fg-slate); }

/* ---------- Motion ---------- */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}

/* ---------- Print ---------- */
@media print {
	.fg-header, .fg-mobile-bar, .fg-staging-banner, .fg-cta-band { display: none; }
	body { background: #fff; padding: 0; }
}

/* No-JS fallback: show nav when the toggle script has not run. */
html:not(.fg-js) .fg-nav { display: block; }
html:not(.fg-js) .fg-nav-toggle { display: none; }

/* --- Homepage batch additions 6 Nov 2026 --- */
/* ---------- Homepage batch (6 Nov 2026) – append to assets/css/main.css ---------- */
.fg-confirm { background: #fff3a6; color: var(--fg-jungle); padding: 0 4px; border-radius: 3px; font-size: .8125rem; font-weight: 600; }
.fg-hero__note { margin-top: var(--fg-s4); font-size: .9375rem; color: var(--fg-slate); max-width: 52ch; }

.fg-hero__brochure { margin-top: var(--fg-s3); font-size: .9375rem; }
.fg-hero__brochure-link { font-weight: 500; }

.fg-card__small { font-size: .9375rem; color: var(--fg-slate); }
.fg-care-card { background: var(--fg-white); border-radius: var(--fg-radius-lg); box-shadow: var(--fg-shadow); padding: var(--fg-s5) var(--fg-s4); border-top: 4px solid var(--fg-lime); }
.fg-care-card .fg-icon { display: block; width: 44px; height: 44px; min-width: 44px; min-height: 44px; margin-bottom: var(--fg-s3); }
.fg-care-card h3 a { text-decoration: none; }
.fg-care-card h3 a:hover { text-decoration: underline; }
.fg-care-card--ask { background: var(--fg-forest); color: var(--fg-cotton); border-top-color: var(--fg-amber); }
.fg-care-card--ask h3 { color: var(--fg-cotton); }
.fg-quote__by { margin-top: var(--fg-s3); color: var(--fg-lime); font-weight: 600; font-size: .9375rem; }
.fg-personal { margin-bottom: var(--fg-s6); }
.fg-quotes__title { margin-bottom: var(--fg-s4); }
.fg-quote { margin: 0; background: var(--fg-forest); border-radius: var(--fg-radius-lg); padding: var(--fg-s5) var(--fg-s4); border-left: 4px solid var(--fg-amber); }
.fg-quote blockquote { margin: 0; }
.fg-quote p { font-family: var(--fg-serif); font-size: 1.0625rem; line-height: 1.5; color: var(--fg-cotton); }
.fg-quote figcaption { color: var(--fg-lime); font-weight: 600; font-size: .9375rem; }
.fg-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--fg-s4); counter-reset: fg-step; }
@media (min-width: 768px) { .fg-steps { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .fg-steps { grid-template-columns: repeat(4, 1fr); } }
.fg-step { counter-increment: fg-step; background: var(--fg-white); border-radius: var(--fg-radius-lg); padding: var(--fg-s5) var(--fg-s4); box-shadow: var(--fg-shadow); }
.fg-step::before { content: counter(fg-step, decimal-leading-zero); display: block; font-family: var(--fg-serif); font-size: 2rem; color: var(--fg-amber); margin-bottom: var(--fg-s2); }
.fg-fee { background: var(--fg-white); border-radius: var(--fg-radius-lg); padding: var(--fg-s5) var(--fg-s4); box-shadow: var(--fg-shadow); border-top: 4px solid var(--fg-amber); }
.fg-fee__price { font-family: var(--fg-serif); font-size: 1.5rem; margin-bottom: var(--fg-s2); }
.fg-fee__price span { font-family: var(--fg-sans); font-size: .9375rem; color: var(--fg-slate); }
.fg-ticks { list-style: none; padding: 0; margin: var(--fg-s5) 0 var(--fg-s3); display: flex; flex-wrap: wrap; gap: var(--fg-s2) var(--fg-s5); font-weight: 600; }
.fg-ticks li::before { content: "✓"; color: var(--fg-moss); margin-right: 8px; }
.fg-small { font-size: .9375rem; color: var(--fg-slate); }
.fg-fees__more { margin-top: var(--fg-s5); }
.fg-faq__item { background: var(--fg-white); border-radius: var(--fg-radius); box-shadow: var(--fg-shadow); margin-bottom: var(--fg-s3); }
.fg-faq__item summary { cursor: pointer; padding: var(--fg-s4); font-weight: 600; list-style: none; position: relative; padding-right: 48px; }
.fg-faq__item summary::-webkit-details-marker { display: none; }
.fg-faq__item summary::after { content: "+"; position: absolute; right: var(--fg-s4); top: 50%; transform: translateY(-50%); font-size: 1.5rem; color: var(--fg-amber); }
.fg-faq__item[open] summary::after { content: "–"; }
.fg-faq__item p { padding: 0 var(--fg-s4) var(--fg-s4); margin: 0; }
.fg-faq__more { margin-top: var(--fg-s4); }


.fg-section-foot { margin-top: var(--fg-s3); font-size: 0.9375rem; color: var(--fg-slate, #475569); }

/* ---------- 0.2.1 (6 Nov 2026): cotton lock + care-home page (The Alexandra) ---------- */
/* Cotton is locked to live farwaygrange.com cream #FFFEDE; no other cream/lemon tints in the theme. */
html, body { background-color: var(--fg-white); } /* 0.2.12: was Cotton */
.fg-fee__price--text { font-size: 1.25rem; }

/* Staffing table – simple, accessible, scrolls horizontally on small screens */
.fg-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: var(--fg-s4) 0; background: var(--fg-white); border-radius: var(--fg-radius-lg); box-shadow: var(--fg-shadow); }
.fg-table-wrap:focus-visible { outline: 3px solid var(--fg-jungle); outline-offset: 2px; }
.fg-table { width: 100%; min-width: 520px; border-collapse: collapse; font-size: 1rem; }
.fg-table caption { text-align: left; padding: var(--fg-s3) var(--fg-s4) 0; font-weight: 600; color: var(--fg-moss); font-size: 0.9375rem; }
.fg-table th, .fg-table td { padding: 12px var(--fg-s4); text-align: left; border-bottom: 1px solid rgba(26, 46, 11, 0.12); }
.fg-table thead th { font-size: 0.875rem; font-weight: 600; color: var(--fg-slate); }
.fg-table tbody th { font-weight: 600; }
.fg-table tfoot th, .fg-table tfoot td { border-bottom: 0; background: var(--fg-cloud); font-weight: 600; }
.fg-staffing__notes { margin-top: var(--fg-s4); }
.fg-staffing__caveat { margin-top: var(--fg-s3); font-size: .9375rem; color: var(--fg-slate); max-width: 62ch; }
.fg-list { padding-left: 1.25em; margin: 0 0 var(--fg-s4); }
.fg-list li + li { margin-top: var(--fg-s2); }

/* 0.2.3: Life / Fees / Paying for care / Contact */
.fg-fees__terms .wp-block-table { margin: var(--fg-s4) 0; overflow-x: auto; }
.fg-fees__terms table { width: 100%; border-collapse: collapse; font-size: 0.95em; }
.fg-fees__terms th, .fg-fees__terms td { text-align: left; vertical-align: top; padding: 0.6em 0.75em; border-bottom: 1px solid rgba(26, 46, 11, 0.15); }
.fg-fees__terms thead th { background: #fff; }
.fg-contact__content img { margin-top: var(--fg-s4); width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.fg-contact__content address { font-style: normal; margin-bottom: var(--fg-s4); }

/* 0.2.29/0.2.30: cookie-safe static map. Must not inherit the 16/10 cover crop used for the photo. */
.fg-map { margin-top: var(--fg-s4); overflow: visible; }
.fg-contact__content .fg-map img,
.fg-map img.fg-map__img,
.fg-map img {
	width: 100% !important;
	height: auto !important;
	max-width: 100%;
	aspect-ratio: auto !important;
	object-fit: contain !important;
	object-position: top left;
	margin-top: 0;
	border-radius: var(--fg-radius);
	display: block;
}
.fg-map figcaption { margin-top: var(--fg-s2); }
.fg-map__attr { font-size: 0.875rem; color: var(--fg-slate); margin: 0 0 var(--fg-s2); }
.fg-map__attr a { text-decoration: underline; }
.fg-map__links { list-style: none; margin: 0; padding: 0; }
.fg-map__links li + li { margin-top: var(--fg-s2); }

#team .fg-grid + .fg-card { margin-top: var(--fg-s5); }
.fg-gallery__item figcaption { font-size: 0.9em; margin-top: var(--fg-s2); }

/* ==========================================================================
   0.2.12 (6 Nov 2026, Alam via Nelson): white base, alternating dark bands,
   full-bleed photo heroes. Palette and fonts unchanged.
   AA (WCAG 2.x, computed): Cotton on Jungle 14.2:1, Cotton on Forest 9.7:1, Cloud on Forest 9.2:1,
   Lime on Jungle 9.3:1, Lime on Forest 6.4:1, Amber on Jungle 5.8:1, Jungle on Amber 5.8:1.
   Amber on Forest is 3.9:1, so Amber is never used for text on Forest (icons/borders only).
   ========================================================================== */

/* ---------- Dark bands (Jungle = --green, Forest = --forest) ---------- */
.fg-band--forest { background: var(--fg-forest); color: var(--fg-cotton); }
.fg-band--forest a:not(.fg-btn), .fg-band--forest h2, .fg-band--forest h3 { color: var(--fg-cotton); }
.fg-band--forest .fg-eyebrow { color: var(--fg-lime); }
.fg-band--forest .fg-btn--secondary { color: var(--fg-cotton); border-color: var(--fg-cotton); }
.fg-band--forest .fg-btn--secondary:hover { background: var(--fg-cotton); color: var(--fg-jungle); }
.fg-band--forest :focus-visible, .fg-hero--bleed :focus-visible { outline-color: var(--fg-cotton); box-shadow: 0 0 0 4px var(--fg-jungle); }

:is(.fg-band--green, .fg-band--forest) .fg-staffing__caveat,
:is(.fg-band--green, .fg-band--forest) .fg-section-foot,
:is(.fg-band--green, .fg-band--forest) > .fg-container > .fg-small,
:is(.fg-band--green, .fg-band--forest) .fg-section-head p { color: var(--fg-cloud); }
:is(.fg-band--green, .fg-band--forest) .fg-confirm { color: var(--fg-jungle); }

/* Light surfaces sitting inside dark bands keep dark text. */
:is(.fg-band--green, .fg-band--forest) :is(.fg-card, .fg-table-wrap, .fg-facts__item, .fg-fee, .fg-step, .fg-faq__item, .fg-care-card:not(.fg-care-card--ask)) { color: var(--fg-jungle); }
:is(.fg-band--green, .fg-band--forest) :is(.fg-card, .fg-table-wrap, .fg-facts__item, .fg-fee, .fg-step, .fg-faq__item, .fg-care-card:not(.fg-care-card--ask)) :is(h2, h3, a:not(.fg-btn)) { color: var(--fg-jungle); }
:is(.fg-band--green, .fg-band--forest) :is(.fg-card, .fg-table-wrap) :focus-visible { outline-color: var(--fg-jungle); box-shadow: 0 0 0 4px var(--fg-white); }
:is(.fg-band--green, .fg-band--forest) .fg-card { box-shadow: none; }
.fg-band--forest .fg-split__quote, .fg-band--forest .fg-quote, .fg-band--forest .fg-value { background: var(--fg-jungle); }

/* Trust strip (now Forest so it separates from the dark hero). */
.fg-trust :focus-visible { outline-color: var(--fg-cotton); box-shadow: 0 0 0 4px var(--fg-jungle); }

/* CTA band: Forest (was Amber). */
.fg-cta-band h2 { color: var(--fg-cotton); }
.fg-cta-band :focus-visible { outline-color: var(--fg-cotton); box-shadow: 0 0 0 4px var(--fg-jungle); }
.fg-cta-band .fg-btn--primary:hover { background: var(--fg-cotton); color: var(--fg-jungle); }

/* Footer sits directly under the Forest CTA band; Jungle + hairline keeps the two apart. */
.fg-footer { border-top: 1px solid rgba(159, 223, 145, 0.25); }

/* ---------- Full-bleed photo hero ---------- */
.fg-hero--bleed {
	--fg-hero-pos: 50% 50%;
	position: relative; isolation: isolate; overflow: hidden;
	background: var(--fg-jungle); color: var(--fg-cotton);
	padding: 0 0 var(--fg-s6);
}
.fg-hero--bleed .fg-hero__backdrop { display: none; }
.fg-hero--bleed .fg-hero__media { position: relative; margin: 0; }
.fg-hero--bleed .fg-hero__media img {
	width: 100%; height: clamp(240px, 62vw, 400px); aspect-ratio: auto;
	object-fit: cover; object-position: var(--fg-hero-pos);
	border-radius: 0; box-shadow: none;
}
/* Mobile/tablet: photo on top, fading into Jungle under the text. */
.fg-hero--bleed .fg-hero__media::after {
	content: ""; position: absolute; inset: auto 0 0 0; height: 45%;
	background: linear-gradient(180deg, rgba(26, 46, 11, 0) 0%, var(--fg-jungle) 100%);
}
.fg-hero--bleed .fg-hero__inner { position: relative; z-index: 2; padding-top: var(--fg-s4); }
.fg-hero--bleed .fg-hero__title { color: var(--fg-cotton); font-weight: 400; max-width: 20ch; }
.fg-hero--bleed .fg-eyebrow { color: var(--fg-lime); }
.fg-hero--bleed .fg-lead { color: var(--fg-cloud); }
.fg-hero__accent { color: var(--fg-amber); }
.fg-hero--bleed .fg-hero__note { color: var(--fg-cloud); opacity: .92; }
.fg-hero--bleed .fg-hero__brochure-link { color: var(--fg-cotton); }
.fg-hero--bleed .fg-hero__brochure-link:hover { color: var(--fg-lime); }
.fg-hero--bleed .fg-btn--primary:hover { background: var(--fg-cotton); color: var(--fg-jungle); }
.fg-hero--bleed .fg-confirm { color: var(--fg-jungle); }

/* Per-photo crops (mobile/tablet). 05 is a portrait shot with the sign in the left half at ~39–61% height. */
.fg-hero--photo-05 { --fg-hero-pos: 0% 50%; }
.fg-hero--photo-04 { --fg-hero-pos: 50% 55%; }
.fg-hero--photo-11 { --fg-hero-pos: 55% 60%; }
.fg-hero--photo-10 { --fg-hero-pos: 50% 50%; }

/* ---------- 0.2.13 (Nelson CHANGE on 0.2.12): one photo, one gradient ----------
   Desktop: a single sharp <img> fills the hero edge to edge; one linear-gradient
   overlay sits on top (Jungle #1A2E0B: .92 at 0%, .88 at 36%, .76 at 47%, .40 at 56%,
   clear by 68%). No blurred backdrop, no second panel, so there is no seam.
   AA: every text line sits left of ~46% where the overlay is >= .76 Jungle; even over a
   pure-white pixel that is Cotton 6.9:1 and (H1, large text) Amber >= 3.4:1; over the
   real photo pixels it is higher.
   Photo 05 is portrait with the sign at 3–57% of its width, so a full-width crop would
   put the sign under the headline. For 05 the same single image layer starts at 44% and
   its left edge is feathered with a mask into the Jungle hero background, under the same
   gradient, so it still reads as one photo fading in (no hard edge). Landscape 04 / 11 / 10
   run truly full-bleed. */
@media (min-width: 1024px) {
	.fg-hero--bleed {
		--fg-hero-media-left: 0%;
		--fg-hero-mask: none;
		--fg-hero-overlay: linear-gradient(90deg,
			rgba(26, 46, 11, 0.92) 0%,
			rgba(26, 46, 11, 0.88) 36%,
			rgba(26, 46, 11, 0.76) 47%,
			rgba(26, 46, 11, 0.40) 56%,
			rgba(26, 46, 11, 0) 68%);
		padding: 0; min-height: clamp(600px, 78vh, 760px);
		display: flex; align-items: center;
	}
	.fg-hero--bleed .fg-hero__inner { padding-top: var(--fg-s7); padding-bottom: var(--fg-s7); grid-template-columns: 1fr; }
	.fg-hero--bleed .fg-hero__text { max-width: min(34rem, 42vw); }
	.fg-hero--bleed .fg-hero__title { font-size: clamp(2.5rem, 3.4vw, 3.25rem); line-height: 1.1; }
	.fg-hero--bleed.fg-hero--page .fg-hero__title { max-width: 18ch; }

	/* The one photo layer. */
	.fg-hero--bleed .fg-hero__media {
		position: absolute; top: 0; bottom: 0; right: 0; left: var(--fg-hero-media-left); z-index: 0;
		-webkit-mask-image: var(--fg-hero-mask); mask-image: var(--fg-hero-mask);
	}
	.fg-hero--bleed .fg-hero__media img { height: 100%; }
	.fg-hero--bleed .fg-hero__media::after { content: none; }

	/* The one gradient, across the whole hero (not just the photo box). */
	.fg-hero--bleed::before {
		content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
		background: var(--fg-hero-overlay);
	}

	/* Portrait 05: sign kept right of the text column. */
	.fg-hero--photo-05 {
		--fg-hero-pos: 0% 50%;
		--fg-hero-media-left: 47%;
		--fg-hero-mask: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.55) 6%, #000 16%);
		--fg-hero-overlay: linear-gradient(90deg,
			rgba(26, 46, 11, 0.92) 0%,
			rgba(26, 46, 11, 0.88) 36%,
			rgba(26, 46, 11, 0.78) 46%,
			rgba(26, 46, 11, 0.30) 54%,
			rgba(26, 46, 11, 0) 64%);
	}
	.fg-hero--photo-05 .fg-hero__text { max-width: min(31rem, 42vw); }
	/* Landscape crops, full-bleed: push the subject right of the text. */
	.fg-hero--photo-04 { --fg-hero-pos: 70% 55%; }
	.fg-hero--photo-11 { --fg-hero-pos: 75% 60%; }
	.fg-hero--photo-10 { --fg-hero-pos: 70% 50%; }
}

/* Elementor kit (post-25) sets body background #FFFEDE and h1–h6 colour #1A2E0B at (0,1,1)
   and loads after this file. Beat it without !important so the white base and light
   headings on dark bands hold. */
html body, body[class*="elementor-kit-"] { background-color: var(--fg-white); }
body :is(.fg-band--green, .fg-band--forest, .fg-cta-band, .fg-footer, .fg-trust, .fg-hero--bleed) :is(h1, h2, h3, h4) { color: var(--fg-cotton); }
body :is(.fg-band--green, .fg-band--forest) :is(.fg-card, .fg-table-wrap, .fg-facts__item, .fg-fee, .fg-step, .fg-faq__item, .fg-care-card:not(.fg-care-card--ask)) :is(h2, h3, h4) { color: var(--fg-jungle); }
body .fg-care-card--ask h3 { color: var(--fg-cotton); }

/* ---------- 0.2.21 photo reshuffle (catalogue v3.2, Alam 9 Nov) ----------
   Home hero is P24 (rear of Farway Grange, landscape 2560×1709); Nursing hero is P19
   (front and sign, 2560×1750). Both are landscape, so on desktop the photo layer starts
   at 30% (P24) / 40% (P19, so the sign clears the text) with the same feathered left edge as 05 and the house sits clear of the text.
   Every hero/card/gallery image keeps object-fit: cover, so nothing is ever stretched. */
.fg-hero--photo-24 { --fg-hero-pos: 80% 50%; }
.fg-hero--photo-19 { --fg-hero-pos: 65% 50%; }
@media (min-width: 1024px) {
	.fg-hero--photo-24 {
		--fg-hero-media-left: 30%;
		--fg-hero-mask: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.55) 6%, #000 16%);
		--fg-hero-pos: 62% 40%;
	}
	.fg-hero--photo-19 {
		--fg-hero-media-left: 40%;
		--fg-hero-mask: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, 0.55) 6%, #000 16%);
		--fg-hero-pos: 20% 50%;
	}
}
.fg-hero__media img, .fg-card__media img, .fg-gallery__item img { object-fit: cover; max-width: 100%; }
/* Two-photo gallery (Nursing rooms): equal columns at every width. */
.fg-gallery.fg-gallery--pair { grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
.fg-gallery--pair .fg-gallery__item img { height: auto; aspect-ratio: 4 / 3; }
@media (max-width: 479px) {
	.fg-gallery.fg-gallery--pair { grid-template-columns: 1fr; }
}
/* Careers hero P25: keep the carer's face in frame in the 4:3 / 5:4 crop. */
.fg-hero__media img[src*="25-residents-carer-garden"] { object-position: 80% 50%; }

/* ---------- 0.2.22 (Nelson review of 0.2.21) ---------- */
/* Fix 4: Alexandra rooms wide slot (P02): show the room, not the ceiling. A tall spanning slot
   only crops the sides of a 3:2 photo, so object-position alone cannot move it down; this gallery
   uses a wide banner (full width, 21:9) above the two cards, and the crop sits at 50% 70%. */
.fg-gallery__item--focus-low img { object-position: 50% 70%; }
.fg-gallery--banner .fg-gallery__item--wide img { aspect-ratio: 16 / 9; }
@media (min-width: 1024px) {
	.fg-gallery.fg-gallery--banner { grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; }
	.fg-gallery--banner .fg-gallery__item--wide { grid-column: 1 / -1; grid-row: 1; display: block; }
	.fg-gallery--banner .fg-gallery__item--wide img { flex: none; min-height: 0; height: auto; aspect-ratio: 21 / 9; }
}
.fg-gallery__note { margin-top: var(--fg-s3); }
/* Life food: P15 (portrait) lead + P14. Definite heights, so neither image depends on its row. */
.fg-gallery.fg-gallery--duo { grid-template-columns: 1fr; grid-template-rows: auto; }
.fg-gallery--duo .fg-gallery__item--lead img { aspect-ratio: 4 / 5; }
@media (min-width: 768px) {
	.fg-gallery.fg-gallery--duo { grid-template-columns: 2fr 3fr; grid-template-rows: auto; }
	.fg-gallery--duo .fg-gallery__item img,
	.fg-gallery--duo .fg-gallery__item--lead img { height: clamp(16rem, 30vw, 22rem); aspect-ratio: auto; }
}
/* Pair galleries keep a single row at desktop (the 2fr/1fr rule above must not apply). */
@media (min-width: 1024px) {
	.fg-gallery.fg-gallery--pair { grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
}
/* Life activities: single photo card (P18). */
.fg-photo-card { margin: var(--fg-s5) 0 var(--fg-s4); max-width: 760px; }
.fg-photo-card img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--fg-radius-lg); }
.fg-photo-card figcaption { font-size: 0.9375rem; color: var(--fg-slate); margin-top: var(--fg-s2); }
/* Home care and people band: P25 lead, P26 wide companion. */
.fg-people { display: grid; gap: var(--fg-s4); }
.fg-people figure { margin: 0; }
.fg-people img { display: block; width: 100%; height: auto; object-fit: cover; border-radius: var(--fg-radius-lg); }
.fg-people__lead img { aspect-ratio: 4 / 3; object-position: 70% 50%; }
.fg-people__wide img { aspect-ratio: 2 / 1; object-position: 50% 40%; }
@media (min-width: 1024px) {
	.fg-people { grid-template-columns: 5fr 7fr; grid-template-areas: "text lead" "wide wide"; align-items: center; gap: var(--fg-s5); }
	.fg-people__text { grid-area: text; }
	.fg-people__lead { grid-area: lead; }
	.fg-people__wide { grid-area: wide; }
	.fg-people__lead img { aspect-ratio: 3 / 2; }
	.fg-people__wide img { aspect-ratio: 21 / 8; }
}
/* Fix 5: Home hero (P24) text contrast. The text column is narrowed and the Jungle overlay
   holds >= .84 under every text line before fading, so Cotton text stays well above AA
   even over the cream wall (measured at 1024 / 1280 / 1440). */
@media (min-width: 1024px) {
	.fg-hero--photo-24 {
		--fg-hero-overlay: linear-gradient(90deg,
			rgba(26, 46, 11, 0.93) 0%,
			rgba(26, 46, 11, 0.90) 40%,
			rgba(26, 46, 11, 0.84) 49%,
			rgba(26, 46, 11, 0.50) 58%,
			rgba(26, 46, 11, 0) 70%);
	}
	.fg-hero--photo-24 .fg-hero__text { max-width: min(31rem, 40vw); }
}

/* ---------- 0.2.24 ---------- */
/* CookieYes "Consent Preferences" badge (.cky-btn-revisit-wrapper, fixed bottom-left,
   45px at left/bottom 15px from 768px up). Between 768 and 1279px the page gutter was
   narrower than the badge, so it sat on the hero brochure link (1024), hero text (768) and
   body copy while scrolling. Widen the gutter in that range so every .fg-container keeps
   text clear of the badge, and tuck the badge 5px further into the corner. The badge stays
   visible and clickable; below 768px it keeps its 0.2.13 slot inside the quick-contact bar;
   at 1280px+ the centred container already clears it. Measured clear at 768/900/1024/1280/1440
   on all public pages (tools/shots/badge.cjs). */
@media (min-width: 768px) and (max-width: 1279.98px) {
	:root { --fg-gutter: 60px; }
	body .cky-btn-revisit-wrapper.cky-revisit-bottom-left { left: 10px !important; bottom: 12px !important; }
}

/* Footer "Cookie settings" (re-opens CookieYes preferences; class cky-banner-element). */
.fg-cookie-settings {
	background: none; border: 0; padding: 0; margin: 0; font: inherit; color: inherit;
	text-decoration: underline; text-underline-offset: 3px; cursor: pointer;
}
.fg-cookie-settings:hover { text-decoration-thickness: 2px; }
.fg-cookie-settings:focus-visible { outline: 3px solid var(--fg-amber); outline-offset: 2px; }

/* Contact enquiry form (Elementor Pro form inside the theme). */
.fg-enquiry { margin-top: var(--fg-s6); padding: var(--fg-s5); background: var(--fg-cloud, #f3f6f1); border-radius: 12px; }
.fg-enquiry h3 { margin-top: 0; }
.fg-enquiry .elementor-form .elementor-field-group { margin-bottom: var(--fg-s3); }
.fg-enquiry .elementor-form label { font-weight: 600; color: var(--fg-jungle); }
.fg-enquiry .elementor-form .elementor-field-textual,
.fg-enquiry .elementor-form select {
	min-height: 48px; border: 1px solid rgba(26, 46, 11, 0.35); border-radius: 8px;
	background: #fff; color: var(--fg-jungle); font-size: 1rem;
}
.fg-enquiry .elementor-form textarea.elementor-field-textual { min-height: 8rem; }
.fg-enquiry .elementor-form .elementor-field-textual:focus,
.fg-enquiry .elementor-form select:focus { outline: 3px solid var(--fg-amber); outline-offset: 1px; }
.fg-enquiry .elementor-form .elementor-button {
	min-height: 48px; padding: 12px 24px; border-radius: 999px; font-weight: 600;
	background: var(--fg-jungle); color: var(--fg-cotton, #fff);
}
.fg-enquiry .elementor-form .elementor-button:hover { background: #24400f; }
.fg-enquiry .elementor-message { font-weight: 600; }
@media (max-width: 767.98px) { .fg-enquiry { padding: var(--fg-s4); } }

/* ---------- 0.2.26–0.2.28 What’s happening: calendar + Facebook ---------- */
.fg-text-link {
	align-self: center;
	font-weight: 600;
	color: var(--fg-jungle);
	text-underline-offset: 3px;
}
.fg-happening {
	display: grid;
	gap: var(--fg-s5);
	grid-template-columns: 1fr;
	align-items: start;
}
@media (min-width: 900px) {
	/* 0.2.32: side by side, natural heights. The Facebook card must not stretch
	   to match a tall calendar. List panel is capped and scrolls internally. */
	.fg-happening { grid-template-columns: 1fr 1fr; gap: var(--fg-s6); align-items: start; }
	.fg-calendar,
	.fg-facebook { height: auto; }
	.fg-calendar__list-scroll {
		max-height: 640px;
		overflow-y: auto;
		overscroll-behavior: contain;
		padding-right: 4px;
		scrollbar-color: rgba(26, 46, 11, 0.35) transparent;
		scrollbar-width: thin;
	}
	.fg-calendar__list-scroll::-webkit-scrollbar { width: 8px; }
	.fg-calendar__list-scroll::-webkit-scrollbar-thumb {
		background: rgba(26, 46, 11, 0.28);
		border-radius: 99px;
	}
	.fg-calendar__list-clip { position: relative; }
	.fg-calendar__list-fade {
		display: none;
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		height: 56px;
		pointer-events: none;
		background: linear-gradient(180deg, rgba(255, 255, 255, 0), #fff 85%);
	}
	.fg-calendar__list-clip.is-overflowing .fg-calendar__list-fade { display: block; }
	.fg-calendar__list-more { display: none; margin: var(--fg-s3) 0 0; }
	.fg-calendar__list-clip.is-overflowing + .fg-calendar__list-more,
	.fg-calendar__list-clip.is-trimmed + .fg-calendar__list-more { display: block; }
}
.fg-calendar__list-more { margin: var(--fg-s3) 0 0; }
.fg-calendar p.fg-calendar__list-more button.fg-calendar__more-btn,
.fg-calendar button.fg-calendar__more-btn {
	appearance: none;
	-webkit-appearance: none;
	background: transparent;
	background-color: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	padding: 0;
	font: inherit;
	font-weight: 600;
	color: var(--fg-jungle); /* Jungle on white 14.59:1, AA */
	text-decoration: underline;
	text-underline-offset: 3px;
	text-transform: none;
	letter-spacing: 0;
	cursor: pointer;
	min-height: 44px;
}
.fg-calendar p.fg-calendar__list-more button.fg-calendar__more-btn:hover,
.fg-calendar p.fg-calendar__list-more button.fg-calendar__more-btn:focus,
.fg-calendar button.fg-calendar__more-btn:hover,
.fg-calendar button.fg-calendar__more-btn:focus {
	background: transparent;
	background-color: transparent;
	color: var(--fg-jungle);
	box-shadow: none;
	text-decoration: underline;
}
.fg-calendar p.fg-calendar__list-more button.fg-calendar__more-btn:focus-visible,
.fg-calendar button.fg-calendar__more-btn:focus-visible {
	outline: 2px solid var(--fg-jungle);
	outline-offset: 3px;
}
@media (max-width: 899.98px) {
	/* Natural list height on small screens (at most about 6 events, trimmed in JS). */
	.fg-calendar__list-scroll { max-height: none; overflow: visible; }
	.fg-calendar__list-fade { display: none; }
	.fg-calendar__list-more { display: none; }
	.fg-calendar__list-clip.is-trimmed + .fg-calendar__list-more { display: block; }
}
.fg-calendar,
.fg-facebook {
	background: var(--fg-white);
	border-radius: var(--fg-radius-lg);
	box-shadow: var(--fg-shadow);
	padding: var(--fg-s4);
	min-width: 0;
}
.fg-calendar__intro,
.fg-facebook__intro { margin-bottom: var(--fg-s3); }
.fg-calendar__intro .fg-icon { width: 40px; height: 40px; margin-bottom: var(--fg-s2); }
.fg-calendar__intro h3,
.fg-facebook__intro h3 { margin-bottom: var(--fg-s2); }
.fg-calendar__intro p,
.fg-facebook__intro p { margin: 0; color: var(--fg-slate); }
.fg-calendar__soon {
	margin: var(--fg-s3) 0 0;
	padding: var(--fg-s4);
	background: var(--fg-cloud);
	border-radius: var(--fg-radius);
	font-weight: 500;
	flex: 0 0 auto; /* size to the sentence, do not fill the card */
	display: block;
	width: 100%;
	box-sizing: border-box;
}
.fg-calendar__soon a,
.fg-calendar__soon-link {
	display: inline;
}
.fg-calendar__toggle {
	display: flex;
	flex-wrap: wrap;
	gap: var(--fg-s2);
	margin: 0 0 var(--fg-s3);
}
.fg-calendar .fg-calendar__toggle button.fg-calendar__tab,
.fg-calendar button.fg-calendar__tab {
	appearance: none;
	-webkit-appearance: none;
	background: transparent;
	background-color: transparent;
	border: 1px solid var(--fg-jungle);
	box-shadow: none;
	color: var(--fg-jungle);
	font: inherit;
	font-weight: 600;
	font-size: 0.9375rem;
	padding: 8px 16px;
	border-radius: 999px;
	min-height: 40px;
	cursor: pointer;
	text-decoration: none;
	text-transform: none;
	letter-spacing: 0;
}
.fg-calendar .fg-calendar__toggle button.fg-calendar__tab.is-active,
.fg-calendar .fg-calendar__toggle button.fg-calendar__tab[aria-selected="true"],
.fg-calendar button.fg-calendar__tab.is-active,
.fg-calendar button.fg-calendar__tab[aria-selected="true"] {
	background: var(--fg-jungle);
	background-color: var(--fg-jungle);
	border-color: var(--fg-jungle);
	color: var(--fg-cotton);
	box-shadow: none;
}
.fg-calendar .fg-calendar__toggle button.fg-calendar__tab:focus-visible,
.fg-calendar button.fg-calendar__tab:focus-visible {
	outline: 2px solid var(--fg-jungle);
	outline-offset: 2px;
}
.fg-calendar .fg-calendar__home {
	display: inline-block;
	margin-left: 0.4em;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--fg-jungle);
}
.fg-calendar__panel { min-width: 0; }

/* ICS Calendar plugin — brand colours (list + month). */
.fg-calendar .ics-calendar,
.fg-calendar .ics-calendar a { color: var(--fg-jungle); }
.fg-calendar .ics-calendar h2,
.fg-calendar .ics-calendar h3,
.fg-calendar .ics-calendar h4 { font-family: var(--fg-serif); font-weight: 400; color: var(--fg-jungle); }
.fg-calendar .ics-calendar-list-wrapper,
.fg-calendar .ics-calendar-month-grid,
.fg-calendar .ics-calendar table { width: 100%; }
.fg-calendar .ics-calendar table { border-collapse: collapse; }
.fg-calendar .ics-calendar th,
.fg-calendar .ics-calendar td {
	border: 1px solid rgba(26, 46, 11, 0.12);
	padding: 8px;
	vertical-align: top;
	font-size: 0.875rem;
}
.fg-calendar .ics-calendar th {
	background: var(--fg-jungle);
	color: var(--fg-cotton);
	font-weight: 600;
	text-align: center;
}
.fg-calendar .ics-calendar .today,
.fg-calendar .ics-calendar td.today,
.fg-calendar .ics-calendar .ics-calendar-today {
	background: rgba(159, 223, 145, 0.35);
}
.fg-calendar__legend {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 8px 20px;
	margin: 0 0 var(--fg-s3);
	padding: 0;
	font-size: 0.9375rem;
	font-weight: 500;
	color: var(--fg-jungle);
}
.fg-calendar__legend-item {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
.fg-calendar__swatch {
	width: 14px;
	height: 14px;
	border-radius: 3px;
	flex: 0 0 14px;
	box-shadow: inset 0 0 0 1px rgba(26, 46, 11, 0.18);
}
/* Event text stays Jungle for AA. Feed colour is the plugin left border + light tint
   (jungle on a 30% forest tint 8.53:1; on a 30% amber tint 11.07:1). Amber as text
   on white is only 2.53:1, so do not let the plugin colour the text. */
.fg-calendar .ics-calendar .ics-calendar-event,
.fg-calendar .ics-calendar .event {
	color: var(--fg-jungle);
	border-left-width: 3px;
	border-left-style: solid;
	border-radius: 4px;
	padding: 4px 8px;
	margin: 0 0 6px;
}
.fg-calendar .ics-calendar .ics-calendar-event,
.fg-calendar .ics-calendar .event,
.fg-calendar .ics-calendar .ics-calendar-event a,
.fg-calendar .ics-calendar .event a,
.fg-calendar .ics-calendar .ics-calendar-event title,
.fg-calendar .ics-calendar .event .title {
	color: var(--fg-jungle);
}
.fg-calendar .ics-calendar-list-month,
.fg-calendar .ics-calendar .ics-calendar-date {
	font-family: var(--fg-serif);
	font-weight: 500;
	color: var(--fg-forest);
}
.fg-calendar .ics-calendar-error { display: none; } /* replaced by .fg-calendar__soon when empty */
.fg-calendar .r34ics-print-button-wrapper { display: none !important; }
@media (max-width: 599.98px) {
	.fg-calendar .ics-calendar th,
	.fg-calendar .ics-calendar td { padding: 4px; font-size: 0.75rem; }
}

/* Facebook placeholder and embed. */
.fg-facebook__frame { min-width: 0; }
.fg-facebook__placeholder {
	padding: var(--fg-s5) var(--fg-s4);
	background: var(--fg-cloud);
	border-radius: var(--fg-radius);
	text-align: center;
}
.fg-facebook__placeholder p { margin: 0 0 var(--fg-s3); }
.fg-facebook__placeholder p:last-child { margin-bottom: 0; }
.fg-facebook__pagelink { font-weight: 600; }
.fg-facebook__embed { min-height: 500px; overflow: hidden; max-width: 100%; }
.fg-facebook__frame { max-width: 100%; }
.fg-facebook__embed .fb-page,
.fg-facebook__embed iframe,
.fg-facebook__frame iframe {
	max-width: 100% !important;
	margin: 0 auto;
	display: block;
}
@media (max-width: 359.98px) {
	.fg-calendar, .fg-facebook { padding: var(--fg-s3); }
}


/* ==========================================================================
   0.2.32 card treatment (Alam via Nelson: Letters used sparingly; coloured
   edge only where it suits). Visuals live in .fg-note / .fg-flat / .fg-flat--edge
   and the --fg-note-* / --fg-flat-* variables.
   Full Letters (paper, tilt, taupe ground): testimonials (.fg-quote) and the
   two Home house cards (.home .fg-card--home). Taupe is only on the testimonials
   section. Everywhere else: calm flat cards (white, hairline, soft shadow, no
   tilt, no paper texture).
   ========================================================================== */

/* --- Full Letters note --- */
.fg-note,
.fg-quote,
.home .fg-card--home,
.front-page .fg-card--home {
	--fg-note-tilt: 0deg;
	background-color: var(--fg-note-paper);
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.12  0 0 0 0 0.16  0 0 0 0 0.06  0 0 0 0.07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),
		linear-gradient(180deg, var(--fg-note-paper), var(--fg-note-paper-2));
	background-size: 180px 180px, 100% 100%;
	box-shadow: var(--fg-note-shadow);
	border: 0;
	border-radius: var(--fg-note-radius);
	overflow: visible;
	transform: rotate(var(--fg-note-tilt));
	color: var(--fg-note-ink);
	position: relative;
}

/* Alternating tilt of about ±1°, only on Letters notes. */
.fg-quotes > .fg-quote:nth-child(odd),
.home .fg-grid > .fg-card--home:nth-child(odd),
.front-page .fg-grid > .fg-card--home:nth-child(odd) { --fg-note-tilt: -1deg; }
.fg-quotes > .fg-quote:nth-child(even),
.home .fg-grid > .fg-card--home:nth-child(even),
.front-page .fg-grid > .fg-card--home:nth-child(even) { --fg-note-tilt: 1deg; }

@media (max-width: 767px) {
	.fg-note,
	.fg-quote,
	.home .fg-card--home,
	.front-page .fg-card--home {
		--fg-note-tilt: 0deg !important;
		transform: none;
	}
}
@media (prefers-reduced-motion: reduce) {
	.fg-note,
	.fg-quote,
	.home .fg-card--home,
	.front-page .fg-card--home {
		--fg-note-tilt: 0deg !important;
		transform: none;
	}
}

/* Room for the slight tilt so notes are not clipped. */
.fg-quotes,
.home .fg-grid:has(.fg-card--home),
.front-page .fg-grid:has(.fg-card--home) {
	padding: 8px;
}

/* Snapshot mount only on Letters house cards. */
.home .fg-card--home .fg-card__media,
.front-page .fg-card--home .fg-card__media,
.fg-note .fg-card__media {
	background: #fff;
	padding: 10px 10px 14px;
	margin: 12px 12px 0;
	box-shadow: var(--fg-note-snap-shadow);
	border-radius: 0;
	overflow: visible;
}
.home .fg-card--home .fg-card__media img,
.front-page .fg-card--home .fg-card__media img,
.fg-note .fg-card__media img {
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	border-radius: 0;
	display: block;
}

.home .fg-card--home h3,
.front-page .fg-card--home h3 {
	font-family: var(--fg-serif);
	font-style: italic;
	font-weight: 400;
}

/* Testimonials: paper note typography (italic serif attribution). */
.fg-quote {
	padding: 36px 32px 32px;
	background-color: var(--fg-note-paper);
}
.fg-quote p { color: var(--fg-note-ink); }
.fg-quote figcaption,
.fg-quote .fg-quote__by {
	font-family: var(--fg-serif);
	font-style: italic;
	font-weight: 500;
	font-size: 1.0625rem;
	color: var(--fg-note-signed);
	border-top: 1px solid var(--fg-note-rule);
	padding-top: 14px;
	margin-top: 20px;
}

/* Taupe only behind the testimonials section, never as a full-page ground
   and never behind house cards, fees, care types, FAQ, Contact, or the
   How our two homes work explainer (white or Cloud only). */
.fg-band--taupe,
.fg-band--green:has(.fg-quotes) {
	background: var(--fg-note-ground);
	color: var(--fg-jungle);
}
.fg-band--green:has(.fg-quotes) :is(h2, h3, h4, a:not(.fg-btn), p, li) {
	color: var(--fg-jungle);
}
.fg-band--green:has(.fg-quotes) .fg-eyebrow {
	color: var(--fg-moss);
}

/* What’s happening stays on Cloud, un-tilted, natural card heights. */
.fg-band--cloud:has(.fg-happening),
.fg-band--cloud:has(#whats-happening) {
	background: var(--fg-cloud);
	color: var(--fg-jungle);
}
.fg-calendar,
.fg-facebook,
.fg-happening .fg-card {
	transform: none;
	background-image: none;
}

/* --- Calm flat cards --- */
.fg-flat,
.fg-card--plain,
.fg-faq__item,
.fg-care-card:not(.fg-care-card--ask),
.fg-card--home {
	background-color: var(--fg-flat-bg);
	background-image: none;
	border: var(--fg-flat-border);
	border-left: var(--fg-flat-border);
	border-top: var(--fg-flat-border);
	box-shadow: var(--fg-flat-shadow);
	transform: none;
	--fg-note-tilt: 0deg;
	color: var(--fg-jungle);
}

/* Coloured edge only where it suits — never on every card on a page. */
.fg-flat--edge,
.fg-fee,
.fg-split__quote,
.fg-fees__more .fg-card--plain,
.fg-card--callout {
	background-color: var(--fg-flat-bg);
	background-image: none;
	border: var(--fg-flat-border);
	border-left: var(--fg-flat-edge);
	box-shadow: var(--fg-flat-shadow);
	transform: none;
	--fg-note-tilt: 0deg;
	color: var(--fg-jungle);
}
/* Fee/price cards keep a top accent (the established pattern). */
.fg-fee,
.fg-flat--edge-top {
	border-left: var(--fg-flat-border);
	border-top: var(--fg-flat-edge);
}

/* Inga’s pull-quote: flat white card, amber left edge, on the Jungle band. */
.fg-split__quote {
	margin: 0;
	padding: 36px 32px 32px;
	background: var(--fg-flat-bg);
	border-radius: 0 var(--fg-radius-lg) var(--fg-radius-lg) 0;
	color: var(--fg-jungle);
}
.fg-band--green .fg-split__quote,
.fg-band--forest .fg-split__quote {
	background: var(--fg-flat-bg);
	background-image: none;
	color: var(--fg-jungle);
}
.fg-split__quote p,
.fg-band--green .fg-split__quote p,
.fg-band--forest .fg-split__quote p {
	color: var(--fg-jungle);
}
.fg-split__quote .fg-quote__by,
.fg-split__quote figcaption {
	font-family: var(--fg-serif);
	font-style: italic;
	font-weight: 500;
	font-size: 1.0625rem;
	color: var(--fg-forest);
	border-top: 1px solid var(--fg-note-rule);
	padding-top: 14px;
	margin-top: 20px;
}

/* Home Letters cards must win over the generic .fg-card--home flat rule. */
.home .fg-card--home,
.front-page .fg-card--home {
	background-color: var(--fg-note-paper);
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.12  0 0 0 0 0.16  0 0 0 0 0.06  0 0 0 0.07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),
		linear-gradient(180deg, var(--fg-note-paper), var(--fg-note-paper-2));
	background-size: 180px 180px, 100% 100%;
	box-shadow: var(--fg-note-shadow);
	border: 0;
	transform: rotate(var(--fg-note-tilt));
	color: var(--fg-note-ink);
}

/* 0.2.31/0.2.32 FAQ accordion — flat, no edge, works without JS (details/summary). */
.fg-faq__summary {
	cursor: pointer;
	list-style: none;
	display: block;
	width: 100%;
	text-align: left;
	background: transparent;
	border: 0;
	font-family: inherit;
	font-weight: 600;
	font-size: 1.0625rem;
	color: var(--fg-jungle);
	padding: var(--fg-s4);
	padding-right: 48px;
	position: relative;
}
.fg-faq__item summary::-webkit-details-marker,
.fg-faq__item summary::marker { display: none; content: none; }
.fg-faq__item summary::after {
	content: "+";
	position: absolute;
	right: var(--fg-s4);
	top: 50%;
	transform: translateY(-50%);
	font-size: 1.5rem;
	font-weight: 400;
	color: var(--fg-amber);
}
.fg-faq__item[open] summary::after { content: "–"; }
.fg-faq__item[open] .fg-faq__summary {
	border-bottom: 1px solid rgba(26, 46, 11, 0.12);
}
.fg-faq__a p {
	padding: 0 var(--fg-s4) var(--fg-s4);
	margin: 0;
	color: var(--fg-jungle);
}

/* 0.2.33: calendar chrome beats Elementor/kit button styles.
   Inactive tab = outline (transparent fill, Jungle border and text).
   Active tab = solid Jungle. “See the month view” is a plain underlined
   Jungle text link (14.59:1 on white, AA) with a visible Jungle focus ring.
   Amber is not used as text or as a focus colour here (amber on white is 2.53:1). */
html body .fg-calendar .fg-calendar__toggle button.fg-calendar__tab,
html body .fg-calendar button.fg-calendar__tab,
html body[class*="elementor-kit-"] .fg-calendar button.fg-calendar__tab {
	background: transparent;
	background-color: transparent;
	border: 1px solid var(--fg-jungle);
	color: var(--fg-jungle);
	box-shadow: none;
}
html body .fg-calendar .fg-calendar__toggle button.fg-calendar__tab.is-active,
html body .fg-calendar .fg-calendar__toggle button.fg-calendar__tab[aria-selected="true"],
html body .fg-calendar button.fg-calendar__tab.is-active,
html body .fg-calendar button.fg-calendar__tab[aria-selected="true"],
html body[class*="elementor-kit-"] .fg-calendar button.fg-calendar__tab.is-active,
html body[class*="elementor-kit-"] .fg-calendar button.fg-calendar__tab[aria-selected="true"] {
	background: var(--fg-jungle);
	background-color: var(--fg-jungle);
	border-color: var(--fg-jungle);
	color: var(--fg-cotton);
	box-shadow: none;
}
html body .fg-calendar p.fg-calendar__list-more button.fg-calendar__more-btn,
html body .fg-calendar button.fg-calendar__more-btn,
html body[class*="elementor-kit-"] .fg-calendar button.fg-calendar__more-btn {
	background: transparent;
	background-color: transparent;
	border: 0;
	box-shadow: none;
	color: var(--fg-jungle);
	text-decoration: underline;
	text-underline-offset: 3px;
	padding: 0;
	border-radius: 0;
}
html body .fg-calendar p.fg-calendar__list-more button.fg-calendar__more-btn:hover,
html body .fg-calendar p.fg-calendar__list-more button.fg-calendar__more-btn:focus,
html body .fg-calendar button.fg-calendar__more-btn:hover,
html body .fg-calendar button.fg-calendar__more-btn:focus,
html body[class*="elementor-kit-"] .fg-calendar button.fg-calendar__more-btn:hover,
html body[class*="elementor-kit-"] .fg-calendar button.fg-calendar__more-btn:focus {
	background: transparent;
	background-color: transparent;
	color: var(--fg-jungle);
	box-shadow: none;
	text-decoration: underline;
}
html body .fg-calendar button.fg-calendar__tab:focus-visible,
html body .fg-calendar button.fg-calendar__more-btn:focus-visible {
	outline: 2px solid var(--fg-jungle);
	outline-offset: 3px;
}

/* 0.2.41: credentials strip — CQC, FHRS and carehome.co.uk only, on a light
   Cloud band with white tiles. One centred row of three from ~800px. Below
   600px: CQC full width (175×125 minimum), then FHRS and carehome two-up.
   No autoplay. */
.fg-credentials {
	background: var(--fg-cloud);
	border-bottom: 1px solid rgba(26, 46, 11, 0.08);
	padding: var(--fg-s4) 0;
}
.fg-credentials__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: var(--fg-s3) var(--fg-s4);
	align-items: stretch;
	justify-content: center;
}
.fg-credentials__item {
	flex: 1 1 9.5rem;
	max-width: 16rem;
	min-width: 8.5rem;
}
.fg-credentials__item--cqc {
	flex: 1 1 12rem;
	min-width: 11.5rem;
	max-width: 18rem;
}
.fg-credentials__item--carehome {
	flex: 1 1 12rem;
	min-width: 11rem;
	max-width: 18rem;
}
.fg-credentials__link {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	box-sizing: border-box;
	height: 100%;
	min-height: 100%;
	padding: 12px 10px;
	text-decoration: none;
	color: var(--fg-jungle);
	text-align: center;
	background: var(--fg-white);
	border-radius: var(--fg-radius);
}
.fg-credentials__link:hover, .fg-credentials__link:focus-visible {
	color: var(--fg-jungle);
}
.fg-credentials__link:focus-visible {
	outline: 2px solid var(--fg-jungle);
	outline-offset: 3px;
}
.fg-credentials__picture {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	flex: 1 1 auto;
}
.fg-credentials__logo {
	display: block;
	width: auto;
	max-width: 100%;
	height: 56px;
	object-fit: contain;
}
/* Official CQC promotional graphic: do not crop or distort; min 175×125 CSS px. */
.fg-credentials__item--cqc .fg-credentials__logo {
	height: 125px;
	width: auto;
	min-width: 175px;
	min-height: 125px;
	max-width: 100%;
}
/* Official Dark wordmark is wide; cap width, keep aspect, sit on the white tile. */
.fg-credentials__item--carehome .fg-credentials__logo {
	height: auto;
	width: auto;
	max-width: 100%;
	max-height: 56px;
}
.fg-credentials__caption {
	font-size: 0.8125rem;
	font-weight: 600;
	line-height: 1.3;
	color: var(--fg-jungle);
}
/* Mobile: CQC full width for the 175×125 minimum; FHRS and carehome two-up. */
@media (max-width: 599px) {
	.fg-credentials__list {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: var(--fg-s3);
		align-items: stretch;
		justify-content: stretch;
	}
	.fg-credentials__item,
	.fg-credentials__item--cqc,
	.fg-credentials__item--carehome {
		flex: none;
		min-width: 0;
		max-width: none;
		width: auto;
	}
	.fg-credentials__item--cqc {
		grid-column: 1 / -1;
	}
	.fg-credentials__link {
		height: 100%;
	}
	.fg-credentials__item--cqc .fg-credentials__logo {
		height: 125px;
		min-width: 175px;
		min-height: 125px;
	}
	.fg-credentials__item--carehome .fg-credentials__logo {
		max-height: 48px;
	}
}
@media (min-width: 800px) {
	.fg-credentials__list {
		flex-wrap: nowrap;
		justify-content: center;
		max-width: 52rem;
		margin-inline: auto;
	}
	.fg-credentials__item,
	.fg-credentials__item--cqc,
	.fg-credentials__item--carehome {
		flex: 1 1 0;
		min-width: 0;
		max-width: 16rem;
	}
	.fg-credentials__logo { height: 64px; }
	.fg-credentials__item--cqc .fg-credentials__logo {
		height: 125px;
		min-width: 175px;
		min-height: 125px;
	}
	.fg-credentials__item--carehome .fg-credentials__logo {
		height: auto;
		max-height: 56px;
		width: auto;
	}
}

.fg-care-card__meta {
	margin: 0 0 var(--fg-s2);
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--fg-slate);
}

/* 0.2.36: fuller Inga biography on About (live text, light style edit). */
.fg-inga-bio-block { margin: 0 0 var(--fg-s5); max-width: 48rem; }
.fg-inga-bio-block .fg-icon { margin-bottom: var(--fg-s2); }
.fg-inga-bio { margin: 0; }
.fg-inga-bio p { margin: 0 0 var(--fg-s3); }
.fg-inga-bio p:last-child { margin-bottom: 0; }