/*
 * Beachhouses child theme: Design A tokens, type and Blocksy overrides.
 * Component styles (cards, gallery, forms, filters) live in the
 * beachhouses-core plugin's bh-front.css and read the --bh-* tokens below.
 * The colours come from Blocksy's palette, so the Customizer's colour
 * pickers still change the whole site.
 */
:root {
	--bh-ink: var(--theme-palette-color-4, #14263a);
	--bh-ink-rgb: 20, 38, 58; /* --bh-ink as channels, for scrims */
	--bh-text: var(--theme-palette-color-3, #24384c);
	--bh-teal: var(--theme-palette-color-1, #0b6e78);
	--bh-teal-dark: var(--theme-palette-color-2, #08565e);
	--bh-line: var(--theme-palette-color-5, #e6e1d8);
	--bh-sand: var(--theme-palette-color-6, #f1ede4);
	--bh-ground: var(--theme-palette-color-7, #fbfaf7);
	--bh-white: var(--theme-palette-color-8, #fff);
	--bh-font-body: "Figtree", "Figtree Fallback", system-ui, -apple-system, "Segoe UI", sans-serif;
	--bh-font-heading: "DM Serif Display", "DM Serif Display Fallback", Georgia, "Times New Roman", serif;

	/* Blocksy reads these. */
	--theme-font-family: var(--bh-font-body);
	--theme-line-height: 1.6;
	--theme-button-font-weight: 600;
	--theme-button-border-radius: 999px;
	--theme-form-field-border-radius: 8px;
	--theme-form-field-border-initial-color: #b9b2a5;
}

html {
	scroll-padding-top: calc(var(--header-height, 80px) + 16px);
	scroll-padding-bottom: 88px;
}

body {
	font-family: var(--bh-font-body);
	color: var(--bh-text);
	-webkit-font-smoothing: antialiased;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	--theme-font-weight: 400;
	--theme-line-height: 1.15;
	font-family: var(--bh-font-heading);
	font-weight: 400;
	color: var(--bh-ink);
	letter-spacing: -0.005em;
}

h1 {
	--theme-font-size: clamp(2rem, 1.4rem + 2.4vw, 2.75rem);
}

/* H2 26 px on phones to 32 px on desktop (Phase 6 item 10). */
h2 {
	--theme-font-size: clamp(1.625rem, 1.4rem + 0.9vw, 2rem);
}

h3 {
	--theme-font-size: 1.25rem;
}

h4,
h5,
h6 {
	--theme-font-size: 1.0625rem;
}

a {
	text-underline-offset: 0.15em;
}

/* Links inside running copy are underlined: colour alone is not enough (WCAG 1.4.1, Phase 6). */
.elementor-widget-text-editor :is(p, li) a:not(.bh-button) {
	text-decoration: underline;
	text-decoration-thickness: 1px;
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--bh-teal);
	outline-offset: 2px;
}

.ct-footer :where(a, button):focus-visible {
	outline-color: #fff;
}

.ct-button,
button,
input,
select,
textarea {
	font-family: inherit;
}

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

/* Header (Blocksy builder: logo · menu · [bh_header_actions] · button) ---
   Desktop: logo · six menu items · Enquire (primary) · "List your property"
   (secondary text link, Blocksy's button item). 72 px high, 60 px on phones.
   Menu 16 px; between items 16 px (1140-1279), 24 px (1280-1439) and 28 px
   from 1440 (Phase 6b: the 40 px sun mark took 48 px from the gaps).
   From 1000 to 1139 px (Phase 6b) "List your property" leaves the header row
   and is the last menu item (functions.php adds the copy), the wordmark stays
   on one line and the menu is 14 px with tighter gaps. */
#header {
	position: sticky;
	top: 0;
	z-index: 60;
}

.admin-bar #header {
	top: var(--admin-bar, 32px);
}

#header [data-row="middle"] {
	--height: 72px;
	background: #fff;
	box-shadow: inset 0 -1px 0 var(--bh-line);
}

#header .site-title {
	--theme-font-family: var(--bh-font-heading);
	--theme-font-weight: 400;
	--theme-font-size: 1.375rem;
	--theme-line-height: 1.05;
	--theme-link-initial-color: var(--bh-ink);
	font-family: var(--bh-font-heading);
	letter-spacing: 0;
	white-space: nowrap;
}

/* Lockup (Phase 6b D1): the client's sun mark, colours as supplied, left of
   the wordmark; centring it in the line puts its middle on the capitals'
   midline (measured within 0.5 px at 22 and 24 px). 40 px in the header and
   the footer, 32 px on phones. Drawn as a decorative ::before so the lockup
   stays one link with one name ("Seabreeze Estates"). 80 px file = 2x. */
#header .site-title a,
#footer .bh-wordmark a {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

#header .site-title a::before,
#footer .bh-wordmark a::before {
	content: "";
	flex: none;
	width: var(--bh-mark, 40px);
	height: var(--bh-mark, 40px);
	background: url("images/bh-sun-mark.png") center / contain no-repeat;
	background-image: image-set(url("images/bh-sun-mark.webp") type("image/webp"), url("images/bh-sun-mark.png") type("image/png"));
}

@media (max-width: 999.98px) {
	#header,
	#footer {
		--bh-mark: 32px;
	}
}

/* 1000-1079 px: no room for the mark beside a one-line wordmark, seven menu
   items and Enquire (Phase 6b report); the wordmark shows alone. */
@media (min-width: 1000px) and (max-width: 1079px) {
	#header [data-device="desktop"] .site-title a::before {
		display: none;
	}
}

#header [data-id="menu"] {
	--menu-items-spacing: 24px;
	--dropdown-width: 15rem;
}

#header [data-id="menu"] > ul > li > a,
#header [data-id="menu"] .ct-menu-link {
	--theme-font-family: var(--bh-font-body);
	--theme-font-size: 1rem;
	--theme-font-weight: 500;
	--theme-text-transform: none;
	--theme-letter-spacing: 0;
	--theme-link-initial-color: var(--bh-ink);
	--theme-link-hover-color: var(--bh-teal);
	text-transform: none;
	letter-spacing: 0;
}

#header [data-device="desktop"] [data-items="primary"] > * {
	--margin: 0 0 0 1rem;
}

#header [data-device="desktop"] [data-column="start"] [data-items="primary"] > :first-child {
	--margin: 0 1rem 0 0;
}

/* Holiday Homes dropdown: white panel, ink text (15.4:1), teal on hover
   (5.1:1 on sand). The whole item opens it on hover and on focus; the arrow
   still toggles it on touch (Blocksy). Keyboard: bh-shortlist.js. */
/* Top-level items fill the 72 px row, so their focus mark is a thick
   underline under the label rather than a full-height ring. */
#header-menu-1 > ul > li > a:focus-visible {
	outline: none;
	text-decoration: underline 3px var(--bh-teal);
	text-underline-offset: 8px;
}

#header-menu-1 .ct-toggle-dropdown-desktop {
	--toggle-button-margin-end: 0px;
}

#header [data-id="menu"] .sub-menu {
	--dropdown-background-color: #fff;
	--dropdown-divider: none;
	--dropdown-items-spacing: 8px;
	padding: 0.5rem;
	border: 1px solid var(--bh-line);
	border-radius: 8px;
	box-shadow: 0 10px 28px rgba(20, 38, 58, 0.12);
}

#header [data-id="menu"] .sub-menu .ct-menu-link {
	--theme-font-size: 0.9375rem;
	--theme-font-weight: 500;
	--theme-link-initial-color: var(--bh-ink);
	--theme-link-hover-color: var(--bh-teal);
	--menu-item-padding: 0.5rem 0.75rem;
	border-radius: 6px;
	color: var(--bh-ink);
	font-size: 0.9375rem;
}

#header [data-id="menu"] .sub-menu .ct-menu-link:hover,
#header [data-id="menu"] .sub-menu .ct-menu-link:focus-visible {
	background: var(--bh-sand);
	color: var(--bh-teal);
}

#header [data-id="menu"] .sub-menu .ct-menu-link:focus-visible {
	outline-offset: -3px;
}

#header-menu-1 > ul > li.bh-open > .sub-menu,
#header-menu-1 > ul > li:not(.bh-shut):hover > .sub-menu {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translate3d(0, 0, 0);
}

#header [data-id="text"] {
	--max-width: none;
}

#offcanvas .ct-panel-content [data-id="button"] .ct-button {
	width: 100%;
}

/* Blocksy resolves its container width on :root, so set the width here.
   No outer padding on the first and last menu items. */
@media (min-width: 1000px) {
	#header [data-device="desktop"] .ct-container {
		width: calc(100% - 40px);
	}

	#header-menu-1 > ul > li:first-child > a {
		padding-inline-start: 0;
	}

	#header-menu-1 > ul > li:last-child > a {
		padding-inline-end: 0;
	}
}

@media (min-width: 1280px) {
	#header .site-title {
		--theme-font-size: 1.5rem;
	}

	#header [data-device="desktop"] .ct-container {
		width: calc(100% - 80px);
	}
}

@media (min-width: 1440px) {
	#header [data-id="menu"] {
		--menu-items-spacing: 28px;
	}
}

@media (min-width: 1000px) and (max-width: 1279px) {
	#header [data-id="menu"] {
		--menu-items-spacing: 16px;
	}

	#header .bh-head-actions__enquire.bh-button {
		padding-inline: 0.875rem;
	}

	#header [data-device="desktop"] [data-items="primary"] > * {
		--margin: 0 0 0 0.75rem;
	}
}

/* The menu copy of "List your property" only shows from 1000 to 1139 px;
   above that "Contact" is the last visible item again. */
@media (min-width: 1140px) {
	#header-menu-1 .bh-menu-list-property {
		display: none;
	}

	#header-menu-1 > ul > li:has(+ .bh-menu-list-property:last-child) > a {
		padding-inline-end: 0;
	}
}

@media (min-width: 1000px) and (max-width: 1139px) {
	#header [data-device="desktop"] [data-id="button"] {
		display: none;
	}

	/* 14 px items; the gaps grow from 12 px at 1000 to 20 px at 1048 and up. */
	#header [data-id="menu"] {
		--menu-items-spacing: clamp(12px, calc((100vw - 928px) / 6), 20px);
	}

	#header [data-id="menu"] > ul > li > .ct-menu-link {
		--theme-font-size: 0.875rem;
	}

	/* Room for Blocksy's fit check (it folds items into "More" otherwise). */
	#header [data-device="desktop"] .ct-container {
		width: calc(100% - 32px);
	}

	#header [data-device="desktop"] [data-items="primary"] > * {
		--margin: 0 0 0 0.625rem;
	}

	#header-menu-1 .ct-toggle-dropdown-desktop {
		--toggle-button-margin-end: -8px;
	}
}


@media (max-width: 999.98px) {
	#header [data-row="middle"] {
		--height: 60px;
	}
}

/* Footer: dark band (ink #14263A; white text 15.4:1) --------------------- */
#footer.ct-footer {
	background: var(--bh-ink);
	color: rgba(255, 255, 255, 0.86);
}

#footer [data-row] {
	--theme-text-color: rgba(255, 255, 255, 0.86);
	--theme-link-initial-color: #fff;
	--theme-link-hover-color: #fff;
	background: transparent;
	color: rgba(255, 255, 255, 0.86);
}

#footer [data-row="middle"] {
	padding-block: 3.5rem 2rem;
}

#footer [data-row="bottom"] {
	border-top: 1px solid rgba(255, 255, 255, 0.14);
}

#footer .ct-widget {
	margin: 0;
}

#footer .bh-wordmark,
#footer .bh-footer__title {
	color: #fff;
}

/* One container for every band (Phase 6 item 11), the header's: 20 px
   gutters, 16 px from 1000 to 1139 px, 40 px from 1280 px, at most 1200 px.
   Blocksy (footer, archives, singles) reads --theme-container-edge-spacing;
   Elementor's top-level containers get the same side padding. */
:root:root {
	--theme-container-edge-spacing: calc(100% - 40px);
}

.e-con.e-parent {
	--padding-left: 20px;
	--padding-right: 20px;
}

@media (min-width: 1000px) and (max-width: 1139px) {
	:root:root {
		--theme-container-edge-spacing: calc(100% - 32px);
	}

	.e-con.e-parent {
		--padding-left: 16px;
		--padding-right: 16px;
	}
}

@media (min-width: 1280px) {
	:root:root {
		--theme-container-edge-spacing: calc(100% - 80px);
	}

	.e-con.e-parent {
		--padding-left: 40px;
		--padding-right: 40px;
	}
}

/* Footer: four equal columns on the 12-column grid (three each), 24 px gutters. */
@media (min-width: 1000px) {
	#footer [data-row="middle"] .ct-container {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		column-gap: 24px;
	}
}

/* Elementor pages: sections ---------------------------------------------- */
/* Section rhythm (Phase 6 item 10): 48 px on phones, 72 px from 1000 px.
   Ground sections in a row share one gap (the second loses its top padding). */
.e-con.bh-sec {
	--padding-top: 3rem;
	--padding-bottom: 3rem;
	--gap: 1rem;
}

@media (min-width: 1000px) {
	.e-con.bh-sec {
		--padding-top: 4.5rem;
		--padding-bottom: 4.5rem;
	}
}

.e-con.bh-sec:not(.bh-sec--sand, .bh-sec--ink, .bh-sec--soft, .bh-page-head) + .e-con.bh-sec:not(.bh-sec--sand, .bh-sec--ink, .bh-sec--soft) {
	--padding-top: 0;
}

.e-con.bh-sec--sand + .e-con.bh-sec--sand {
	--padding-top: 0;
}

/* Shortcode widgets take the full width explicitly: in a column container
   Chrome otherwise sizes them before stretching, so an aspect-ratio block
   (map, video) came out too short and the caption under the office map ran
   into the footer on phones (Phase 6). */
.e-con > .e-con-inner > .elementor-widget-shortcode,
.e-con.e-con-full > .elementor-widget-shortcode {
	width: 100%;
}

/* Reading width; beats Elementor's .e-con.e-con > .e-con-inner > .elementor-widget. */
.e-con.e-con.bh-sec--narrow > .e-con-inner > .elementor-element,
.e-con.e-con.bh-sec--intro > .e-con-inner > .elementor-element,
.e-con.e-con.bh-page-head > .e-con-inner > .elementor-element {
	max-width: 760px;
}

/* Hub "Stay nearby" strip: copy, button and video in the reading width, the cards full width. */
.e-con.e-con.bh-stay > .e-con-inner > .elementor-element:not(.bh-stay__cards) {
	max-width: 760px;
}

.e-con.bh-sec--intro {
	--padding-top: 2.5rem;
}

.e-con.bh-page-head {
	--padding-top: 2rem;
	--padding-bottom: 0;
}

/* Area pages (Phase 6 item 9) ----------------------------------------------
   Two-column Q&A band on sand; FAQ band with rules between questions;
   enquiry band = copy left, panel card right (bh-split--contact columns). */
.e-con.bh-qa > .e-con-inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 2rem;
}

@media (min-width: 800px) {
	.e-con.bh-qa > .e-con-inner {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 2.5rem 3rem;
	}
}

.e-con.bh-qa__item,
.e-con.bh-faq__item {
	--padding-top: 0;
	--padding-right: 0;
	--padding-bottom: 0;
	--padding-left: 0;
	--gap: 0.5rem;
}

.e-con.bh-faq__item + .e-con.bh-faq__item {
	--padding-top: 1.5rem;
	border-top: 1px solid var(--bh-line);
}

.e-con.bh-faq-band > .e-con-inner {
	--gap: 1.5rem;
}

.e-con.bh-split--enquire .bh-col {
	--padding-top: 0;
	--padding-right: 0;
	--padding-bottom: 0;
	--padding-left: 0;
	--gap: 1rem;
}

@media (min-width: 1000px) {
	.e-con.bh-split--enquire .bh-col {
		position: sticky;
		top: 6rem;
	}
}

.e-con.bh-sec--sand {
	background-color: var(--bh-sand);
}

.e-con.bh-sec--soft {
	background-color: #e6f1f2;
}

.e-con.bh-sec--ink {
	background-color: var(--bh-ink);
	color: rgba(255, 255, 255, 0.88);
}

.e-con.bh-sec--ink .elementor-heading-title {
	color: #fff;
}

.e-con.bh-sec--ink .elementor-widget-text-editor a {
	color: #fff;
}

.e-con.bh-sec--ink .bh-card {
	color: var(--bh-text);
}

@media (min-width: 1000px) {
	.e-con.bh-sec--ink.bh-split > .e-con-inner {
		grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
	}
}

.bh-lead p,
.bh-lead {
	font-size: 1.125rem;
	line-height: 1.65;
}

.elementor-widget-text-editor p:last-child {
	margin-bottom: 0;
}

.bh-crumbs .rank-math-breadcrumb p {
	margin: 0;
	color: var(--bh-muted, #5b6673);
	font-size: 0.875rem;
}

.bh-crumbs .rank-math-breadcrumb a {
	color: inherit;
}

/* Split layouts (text + cards / band + button / details + form) */
.e-con.bh-split > .e-con-inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 2rem;
	align-items: start;
}

@media (min-width: 1000px) {
	.e-con.bh-split > .e-con-inner {
		grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
		align-items: center;
	}

	.e-con.bh-split--band > .e-con-inner {
		grid-template-columns: minmax(0, 1fr) auto;
	}

	.e-con.bh-split--contact > .e-con-inner {
		grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
		align-items: start;
	}

	/* "Thinking of staying for good?": the cards' top edge lines up with the heading (Phase 6 item 11). */
	.e-con.bh-sec--ink.bh-split > .e-con-inner {
		align-items: start;
	}
}

/* From 1200 px the band sits on the 12-column grid: copy in 3 columns, the
   three cards in the other 9 (3 each), gutters 24 px. */
@media (min-width: 1200px) {
	.e-con.bh-sec--ink.bh-split > .e-con-inner {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		column-gap: 24px;
	}

	.e-con.bh-sec--ink.bh-split > .e-con-inner > .bh-split__text {
		grid-column: span 3;
	}

	.e-con.bh-sec--ink.bh-split > .e-con-inner > .bh-split__media {
		grid-column: span 9;
	}

	.e-con.bh-sec--ink .bh-split__media .bh-cards {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

.e-con.bh-split--band {
	--padding-top: 2.5rem;
	--padding-bottom: 2.5rem;
}

.e-con.bh-split__media .bh-cards {
	grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
}

.e-con.bh-buttons {
	--flex-direction: row;
	--flex-wrap: wrap;
	--gap: 0.75rem;
	--align-items: center;
}

/* Hero (home and village pages): real <img>, scrim for 4.5:1 text */
.e-con.bh-hero {
	position: relative;
	overflow: hidden;
	--padding-top: 4.5rem;
	--padding-bottom: 3.5rem;
	--gap: 1rem;
	color: #fff;
	background: var(--bh-ink);
}

.e-con.bh-hero > .e-con-inner {
	position: static;
}

.e-con.bh-hero--home {
	min-height: 36rem;
	--justify-content: center;
}

.e-con.bh-hero--area {
	min-height: 22rem;
	--justify-content: flex-end;
	--padding-bottom: 2.5rem;
}

.bh-hero .elementor-element.bh-hero__media {
	position: absolute !important;
	inset: 0;
	z-index: 0;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
}

.bh-hero__media > *,
.bh-hero__media .elementor-shortcode,
.bh-hero__picture,
.bh-hero__img {
	display: block;
	width: 100%;
	height: 100%;
}

.bh-hero img.bh-hero__img {
	width: 100%;
	max-width: none;
	height: 100%;
	object-fit: cover;
}

/* Scrim (item 3): left-weighted on desktop, top-weighted on phones, plus a
   30 % fade at the bottom behind the search card and ticks. The dark stop
   follows the text column's right edge (--bh-hero-text-end) and is 0.64:
   white text then keeps ≥ 4.5:1 even over a white part of the photo, so a
   new photo can't break it. Past the text it fades to 0.05.
   tools/tests/phase6-hero-contrast.js measures every text line. */
.e-con.bh-hero {
	--bh-hero-text-end: calc(max(5vw, 50vw - 600px) + 44rem);
}

.e-con.bh-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	background:
		linear-gradient(0deg, rgba(var(--bh-ink-rgb), 0.6) 0%, rgba(var(--bh-ink-rgb), 0) 30%),
		linear-gradient(
			90deg,
			rgba(var(--bh-ink-rgb), 0.64) 0,
			rgba(var(--bh-ink-rgb), 0.64) var(--bh-hero-text-end),
			rgba(var(--bh-ink-rgb), 0.56) calc(var(--bh-hero-text-end) + 5vw),
			rgba(var(--bh-ink-rgb), 0.36) calc(var(--bh-hero-text-end) + 12vw),
			rgba(var(--bh-ink-rgb), 0.16) calc(var(--bh-hero-text-end) + 20vw),
			rgba(var(--bh-ink-rgb), 0.05) calc(var(--bh-hero-text-end) + 28vw)
		);
	pointer-events: none;
}

.bh-hero .e-con-inner > .elementor-element:not(.bh-hero__media) {
	position: relative;
	z-index: 1;
}

.bh-hero :is(h1, .elementor-heading-title) {
	max-width: 17em;
	color: #fff;
}

.bh-hero .bh-eyebrow,
.bh-hero .bh-crumbs .rank-math-breadcrumb p,
.bh-hero .bh-crumbs .rank-math-breadcrumb a {
	color: #fff;
}

.bh-hero__sub,
.e-con.e-con.bh-hero > .e-con-inner > .elementor-element.bh-hero__sub {
	max-width: 34em;
	font-size: 1.125rem;
}

.bh-hero .bh-search {
	max-width: 52rem;
}

.bh-hero__ticks {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 0.9375rem;
}

.bh-hero__ticks li::before {
	content: "✓";
	margin-right: 0.375rem;
}

@media (max-width: 699px) {
	.e-con.bh-hero {
		--padding-top: 2.5rem;
		--padding-bottom: 2rem;
	}

	.e-con.bh-hero--home {
		min-height: 0;
	}

	/* Phones: text on top, photo below; village heroes put their heading at
	   the top too, so the same top-weighted scrim covers it. */
	.e-con.bh-hero {
		--bh-hero-text-end: 58%;
	}

	.e-con.bh-hero--area {
		--justify-content: flex-start;
		--padding-bottom: 7rem;
		--bh-hero-text-end: calc(100% - 7rem);
		min-height: 0;
	}

	.e-con.bh-hero::after {
		background:
			linear-gradient(0deg, rgba(var(--bh-ink-rgb), 0.66) 0%, rgba(var(--bh-ink-rgb), 0.66) 9%, rgba(var(--bh-ink-rgb), 0) 30%),
			linear-gradient(180deg, rgba(var(--bh-ink-rgb), 0.64) 0, rgba(var(--bh-ink-rgb), 0.64) var(--bh-hero-text-end), rgba(var(--bh-ink-rgb), 0.05) 100%);
	}
}

/* Buttons (Elementor button widget): colours, size and states come from
   the button system in beachhouses-core's bh-front.css. */

/* Cards in copy (trust strip, owner services, people) */
.bh-trust,
.bh-people {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
	gap: 1rem;
}

.bh-trust__card,
.bh-person {
	padding: 1.25rem 1.5rem;
	border: 1px solid var(--bh-line);
	border-radius: var(--bh-radius-lg, 16px);
	background: #fff;
}

.bh-trust__card h3,
.bh-person h3 {
	--theme-font-family: var(--bh-font-body);
	--theme-font-size: 1.0625rem;
	--theme-font-weight: 600;
	margin: 0 0 0.375rem;
	font-family: var(--bh-font-body);
	font-weight: 600;
}

.bh-trust + p,
.bh-people + p {
	margin-top: 1rem;
}

.bh-trust__card p,
.bh-person p {
	margin: 0 0 0.375rem;
	font-size: 0.9375rem;
}

.bh-person__role {
	color: var(--bh-teal);
	font-weight: 600;
}

/* Visible FAQ (no FAQPage schema) */
.bh-faq h3 {
	--theme-font-size: 1.1875rem;
	margin: 1.5rem 0 0.375rem;
}

.bh-faq h3:first-child {
	margin-top: 0;
}

/* Long text pages (privacy, terms) */
.bh-prose-sec h2 {
	--theme-font-size: 1.375rem;
	margin: 2rem 0 0.5rem;
}

.bh-prose-sec h2:first-of-type {
	margin-top: 1rem;
}

.bh-talk {
	margin: 0;
}

.bh-talk .bh-icon {
	margin-right: 0.25rem;
	vertical-align: -0.2em;
}

/* Layout boxes inside sections carry no padding of their own. */
.e-con.bh-split__text,
.e-con.bh-split__media,
.e-con.bh-split__form,
.e-con.bh-split__action,
.e-con.bh-buttons {
	--padding-top: 0;
	--padding-right: 0;
	--padding-bottom: 0;
	--padding-left: 0;
}

/* 404 */
.bh-404 {
	max-width: 760px;
	padding-block: 3.5rem 4rem;
}

.bh-404 h2 {
	margin-top: 2rem;
}

.bh-404 .ct-search-form {
	max-width: 30rem;
	margin-block: 1.5rem;
}
