/*
 * Beachhouses front end: enquiry forms, Save buttons, shortlist page and bar,
 * and (Phase 4) the listing templates: cards, gallery, single layout, rates
 * table, filters, facades and the mobile sticky bar.
 * Option A tokens (global spec §10/§13 contrast table). The child theme
 * redefines the colour tokens from Blocksy's palette; these are fallbacks.
 * Fonts are inherited from the theme; nothing is loaded here.
 */
:root {
	--bh-ink: #14263a;
	--bh-ink-rgb: 20, 38, 58;
	--bh-text: #24384c;
	--bh-teal: #0b6e78;
	--bh-ground: #fbfaf7;
	--bh-sand: #f1ede4;
	--bh-sand-2: #f4f1ea;
	--bh-muted: #5b6673;
	--bh-chip: #e6f1f2;
	--bh-line: #e6e1d8;
	--bh-error: #b3261e;
	--bh-teal-hover: #09585f;
	--bh-chip-line: #d8d2c6;
	--bh-radius: 6px;
	--bh-radius-lg: 16px;
	--bh-shadow: 0 1px 2px rgba(20, 38, 58, 0.06), 0 8px 24px rgba(20, 38, 58, 0.06);
	--bh-bar-offset: 0px;
	--bh-font-body: inherit;
}

/* Buttons: one system (Phase 6 item 4) ----------------------------------
 * Every button-like control takes one of four looks, declared only here:
 *   primary    teal, white text; hover/focus #09585F
 *   secondary  white, ink text, 1.5 px ink border; hover ink, white text
 *   on dark    white text, 1.5 px white border; hover white, ink text
 *   chip       ground, ink text, #D8D2C6 border; hover sand; selected ink
 *              with a tick (state is never shown by colour alone)
 * plus the header's "List your property" text link. All are ≥ 44 px tall
 * with 15 px text; focus is a 3 px teal ring 2 px out (white on dark).
 * Contrast table: Phase 6 feedback report. */
.bh-button,
.bh-el-btn .elementor-button,
.bh-sticky-bar__btn,
.bh-gallery__all,
.bh-save,
.bh-back-top,
.bh-head-actions__icon,
.bh-social a,
.bh-chip,
.bh-pagination a,
.bh-pagination span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	box-sizing: border-box;
	min-height: 2.75rem;
	padding: 0.625rem 1.25rem;
	border: 1.5px solid transparent;
	border-radius: 999px;
	font-family: var(--bh-font-body);
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

/* Primary */
.bh-button,
.bh-el-btn .elementor-button,
.bh-sticky-bar__btn--enquire,
.bh-save[aria-pressed="true"] {
	border-color: var(--bh-teal);
	background: var(--bh-teal);
	color: #fff;
}

.bh-button:hover,
.bh-button:focus-visible,
.bh-el-btn .elementor-button:hover,
.bh-el-btn .elementor-button:focus-visible,
.bh-sticky-bar__btn--enquire:hover,
.bh-sticky-bar__btn--enquire:focus-visible,
.bh-save[aria-pressed="true"]:hover,
.bh-save[aria-pressed="true"]:focus-visible {
	border-color: var(--bh-teal-hover);
	background: var(--bh-teal-hover);
	color: #fff;
}

/* Secondary */
.bh-button.bh-button--secondary,
.bh-button.bh-button--whatsapp,
.bh-el-btn--ghost .elementor-button,
.bh-el-btn--light .elementor-button,
.bh-sticky-bar__btn--call,
.bh-sticky-bar__btn--whatsapp,
.bh-gallery__all,
.bh-head-actions__icon,
.bh-save,
.bh-back-top {
	border-color: var(--bh-ink);
	background: #fff;
	color: var(--bh-ink);
}

.bh-button.bh-button--secondary:hover,
.bh-button.bh-button--secondary:focus-visible,
.bh-button.bh-button--whatsapp:hover,
.bh-button.bh-button--whatsapp:focus-visible,
.bh-el-btn--ghost .elementor-button:hover,
.bh-el-btn--ghost .elementor-button:focus-visible,
.bh-el-btn--light .elementor-button:hover,
.bh-el-btn--light .elementor-button:focus-visible,
.bh-sticky-bar__btn--call:hover,
.bh-sticky-bar__btn--call:focus-visible,
.bh-sticky-bar__btn--whatsapp:hover,
.bh-sticky-bar__btn--whatsapp:focus-visible,
.bh-gallery__all:hover,
.bh-gallery__all:focus-visible,
.bh-head-actions__icon:hover,
.bh-head-actions__icon:focus-visible,
.bh-save:not([aria-pressed="true"]):hover,
.bh-save:not([aria-pressed="true"]):focus-visible,
.bh-back-top:hover,
.bh-back-top:focus-visible {
	border-color: var(--bh-ink);
	background: var(--bh-ink);
	color: #fff;
}

/* On dark (footer, ink bands) */
.bh-button.bh-button--on-dark,
.bh-el-btn--outline-light .elementor-button,
.bh-social a {
	border-color: #fff;
	background: transparent;
	color: #fff;
}

.bh-button.bh-button--on-dark:hover,
.bh-button.bh-button--on-dark:focus-visible,
.bh-el-btn--outline-light .elementor-button:hover,
.bh-el-btn--outline-light .elementor-button:focus-visible,
.bh-social a:hover,
.bh-social a:focus-visible {
	border-color: #fff;
	background: #fff;
	color: var(--bh-ink);
}

/* Chip (filters, guide categories, pagination, enquiry topics) */
.bh-chip,
.bh-pagination a,
.bh-pagination span {
	margin: 0;
	padding: 0.5rem 1rem;
	border-width: 1px;
	border-color: var(--bh-chip-line);
	background: var(--bh-ground);
	color: var(--bh-ink);
	font-weight: 500;
}

.bh-chip:hover,
.bh-pagination a:hover {
	background: var(--bh-sand);
	color: var(--bh-ink);
}

.bh-chip__input:checked + .bh-chip,
a.bh-chip.is-active,
a.bh-chip[aria-current],
.bh-pagination .current {
	border-color: var(--bh-ink);
	background: var(--bh-ink);
	color: #fff;
}

.bh-chip__input:checked + .bh-chip::before,
a.bh-chip.is-active::before,
a.bh-chip[aria-current]::before {
	content: "";
	width: 0.75em;
	height: 0.4em;
	margin-top: -0.2em;
	border-bottom: 2px solid currentColor;
	border-left: 2px solid currentColor;
	transform: rotate(-45deg);
}

.bh-chip__count {
	color: var(--bh-muted);
	font-weight: 400;
}

.bh-chip__input:checked + .bh-chip .bh-chip__count,
a.bh-chip.is-active .bh-chip__count,
a.bh-chip[aria-current] .bh-chip__count {
	color: #d7dde3;
}

/* Focus ring: 3 px teal, 2 px out (white on dark). */
:is(.bh-button, .bh-el-btn .elementor-button, .bh-sticky-bar__btn, .bh-gallery__all, .bh-save, .bh-back-top, .bh-head-actions__icon, .bh-chip, .bh-pagination a):focus-visible,
.bh-chip__input:focus-visible + .bh-chip {
	outline: 3px solid var(--bh-teal);
	outline-offset: 2px;
}

:is(.bh-button--on-dark, .bh-el-btn--outline-light .elementor-button, .bh-social a):focus-visible,
.bh-sec--ink :is(.bh-button, .elementor-button):focus-visible {
	outline-color: #fff;
}

.bh-button[disabled],
.bh-button[aria-disabled="true"] {
	opacity: 0.7;
	cursor: wait;
}

.bh-button--block {
	width: 100%;
}

/* Back to top (secondary look): above the WhatsApp float with a 12 px gap
   (20 + 56 + 12 = 88 px up), centred on it; on phones above the sticky bar,
   and hidden there while the shortlist bar is showing. */
.bh-back-top {
	position: fixed;
	right: 26px;
	bottom: 88px;
	z-index: 800;
	width: 2.75rem;
	padding: 0;
	box-shadow: 0 4px 14px rgba(var(--bh-ink-rgb), 0.18);
}

.bh-back-top[hidden] {
	display: none;
}

@media (max-width: 1023.98px) {
	.bh-back-top {
		right: 16px;
		bottom: calc(var(--bh-bar-offset) + 12px);
	}

	body.bh-has-shortlist-bar .bh-back-top {
		display: none;
	}
}

/* Text button: "Remove", "Clear" and similar actions that read as links. */
.bh-link-button {
	display: inline-flex;
	align-items: center;
	min-height: 2.75rem;
	padding: 0;
	border: 0;
	background: none;
	color: var(--bh-teal);
	font: inherit;
	text-decoration: underline;
	cursor: pointer;
}

/* Floating WhatsApp (from 1024 px; phones use the sticky bar): a 56 px
   teal circle, 20 px from the corner; on hover or focus it widens into a
   pill that reads "WhatsApp us" (white on #09585F, 8.2:1). Above content,
   below the shortlist card (900) and modals. */
.bh-wa-float {
	display: none;
}

@media (min-width: 1024px) {
	.bh-wa-float {
		position: fixed;
		right: 20px;
		bottom: 20px;
		z-index: 800;
		display: inline-flex;
		align-items: center;
		box-sizing: border-box;
		height: 56px;
		min-width: 56px;
		padding: 0 15px;
		border-radius: 999px;
		background: var(--bh-teal);
		box-shadow: 0 6px 20px rgba(var(--bh-ink-rgb), 0.25);
		color: #fff;
		font-family: var(--bh-font-body);
		font-size: 0.9375rem;
		font-weight: 600;
		text-decoration: none;
		transition: background-color 0.15s ease, padding 0.2s ease;
	}

	.bh-wa-float__label {
		max-width: 0;
		overflow: hidden;
		opacity: 0;
		white-space: nowrap;
		transition: max-width 0.2s ease, opacity 0.2s ease, margin 0.2s ease;
	}

	.bh-wa-float:hover,
	.bh-wa-float:focus-visible {
		padding-right: 20px;
		background: var(--bh-teal-hover);
		color: #fff;
	}

	.bh-wa-float:hover .bh-wa-float__label,
	.bh-wa-float:focus-visible .bh-wa-float__label {
		max-width: 10rem;
		margin-left: 0.5rem;
		opacity: 1;
	}

	.bh-wa-float:focus-visible {
		outline: 3px solid var(--bh-teal);
		outline-offset: 2px;
	}
}

a.bh-link-button[href] {
	text-decoration: underline;
}

/* Text link: the header's "List your property" (Blocksy button item). */
#header [data-device="desktop"] [data-id="button"] .ct-button {
	--theme-button-background-initial-color: transparent;
	--theme-button-background-hover-color: transparent;
	--theme-button-text-initial-color: var(--bh-ink);
	--theme-button-text-hover-color: var(--bh-teal);
	min-height: 2.75rem;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
	color: var(--bh-ink);
	font-size: 0.9375rem;
	font-weight: 600;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.3em;
}

#header [data-device="desktop"] [data-id="button"] .ct-button:hover {
	color: var(--bh-teal);
	text-decoration-thickness: 2px;
}

/* Blocksy's own buttons (off-canvas "List your property", search) follow
   the primary look through its variables (on body: Blocksy prints its own
   :root values after this file). */
body {
	--theme-button-background-initial-color: var(--bh-teal);
	--theme-button-background-hover-color: var(--bh-teal-hover);
	--theme-button-text-initial-color: #fff;
	--theme-button-text-hover-color: #fff;
}

/* Forms ----------------------------------------------------------------- */
.bh-form-wrap {
	color: var(--bh-ink);
	max-width: 40rem;
}

.bh-form {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 0.75rem;
}

.bh-form__row {
	display: grid;
	gap: 0.75rem;
}

@media (min-width: 37.5em) {
	.bh-form__row {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	}
}

.bh-field {
	display: grid;
	gap: 0.25rem;
	min-width: 0;
	margin: 0;
}

.bh-field label {
	font-weight: 600;
}

.bh-field input:not([type="checkbox"]):not([type="radio"]),
.bh-field select,
.bh-field textarea {
	box-sizing: border-box;
	width: 100%;
	min-width: 0;
	max-width: 100%;
	min-height: 2.75rem;
	padding: 0.5rem 0.75rem;
	border: 1px solid var(--bh-muted);
	border-radius: var(--bh-radius);
	background: #fff;
	color: var(--bh-ink);
	font: inherit;
}

.bh-field textarea {
	min-height: 6rem;
	resize: vertical;
}

.bh-field [aria-invalid="true"] {
	border-color: var(--bh-error);
	box-shadow: 0 0 0 1px var(--bh-error);
}

.bh-field--check {
	grid-template-columns: auto 1fr;
	align-items: start;
	column-gap: 0.5rem;
}

.bh-field--check input {
	width: 1.25rem;
	height: 1.25rem;
	margin: 0.15rem 0 0;
	accent-color: var(--bh-teal);
}

.bh-field--check label {
	font-weight: 400;
}

.bh-field--check .bh-field__error {
	grid-column: 1 / -1;
}

.bh-req {
	color: var(--bh-error);
}

.bh-field__hint,
.bh-form__privacy,
.bh-rate-line {
	color: var(--bh-muted);
	font-size: 0.9375rem;
}

/* Links inside form text (consent, privacy line): underlined, colour alone is not enough (WCAG 1.4.1). Two classes: Elementor's ".elementor a" loads later. */
.bh-form label a,
.bh-form .bh-form__privacy a {
	text-decoration: underline;
	text-underline-offset: 0.15em;
}

.bh-field__error,
.bh-form__summary {
	color: var(--bh-error);
	font-weight: 600;
}

.bh-form__summary {
	margin: 0;
	padding: 0.75rem 1rem;
	border-left: 4px solid var(--bh-error);
	background: #fff;
}

.bh-form__notice {
	padding: 0.75rem 1rem;
	border-left: 4px solid var(--bh-teal);
	background: var(--bh-chip);
}

.bh-form a,
.bh-form-success a:not(.bh-button) {
	color: var(--bh-teal);
}

/* Honeypot: off-screen, not display:none (some bots skip hidden fields). */
.bh-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.bh-form-success {
	padding: 1.25rem;
	border-radius: var(--bh-radius);
	background: var(--bh-chip);
}

.bh-form-success__title {
	margin: 0 0 0.5rem;
	font-weight: 700;
	font-size: 1.25rem;
}

.bh-turnstile:empty {
	display: none;
}

/* Focus: 3 px teal, 2 px offset; never removed. */
.bh-form :focus-visible,
.bh-form-success:focus-visible,
.bh-enquire :focus-visible {
	outline: 3px solid var(--bh-teal);
	outline-offset: 2px;
}

/* Save toggle (colours: Buttons) ---------------------------------------- */
.bh-save[hidden] {
	display: none;
}

.bh-save__icon {
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
}

.bh-save[aria-pressed="true"] .bh-save__icon {
	fill: currentColor;
}

/* Enquiry panel (Phase 6 item 7): one card in every placement ---------- */
.bh-enquiry {
	box-sizing: border-box;
	padding: 1.5rem;
	border: 1px solid var(--bh-line);
	border-radius: 8px;
	background: #fff;
	box-shadow: var(--bh-shadow);
	color: var(--bh-ink);
}

.bh-enquiry[hidden] {
	display: none;
}

.bh-enquiry__title {
	margin: 0 0 1rem;
	color: var(--bh-ink);
	font-family: var(--bh-font-heading, Georgia, serif);
	font-size: 1.5rem;
	font-weight: 400;
	line-height: 1.2;
}

.bh-enquiry .bh-form-wrap {
	max-width: none;
}

.bh-enquiry .bh-form > .bh-form__actions .bh-button {
	width: 100%;
}

/* Pick mode: topic chips; only the chosen topic's fields show. */
.bh-pick {
	margin: 0;
	padding: 0;
	border: 0;
}

.bh-pick > legend {
	float: left;
	width: 100%;
	margin: 0 0 0.5rem;
	padding: 0;
	color: var(--bh-ink);
	font-size: 1rem;
	font-weight: 600;
}

.bh-pick > .bh-chips {
	clear: both;
}

.bh-pick[hidden] {
	display: none;
}

.bh-mode {
	display: grid;
	gap: 0.75rem;
}

.bh-req--pick {
	display: none;
}

@supports selector(:has(*)) {
	.bh-form--pick .bh-mode {
		display: none;
	}

	.bh-form--pick:has([name="pick"][value="holiday"]:checked) .bh-mode[data-modes~="holiday"],
	.bh-form--pick:has([name="pick"][value="buying"]:checked) .bh-mode[data-modes~="buying"],
	.bh-form--pick:has([name="pick"][value="renting"]:checked) .bh-mode[data-modes~="renting"] {
		display: grid;
	}

	.bh-form--pick:has([name="pick"][value="selling"]:checked) .bh-req--pick,
	.bh-form--pick:has([name="pick"][value="other"]:checked) .bh-req--pick {
		display: inline;
	}
}

/* "Also include my N saved houses" on a listing's form. */
.bh-also {
	padding: 0.75rem;
	border-radius: 8px;
	background: var(--bh-sand-2);
}

.bh-also[hidden] {
	display: none;
}

/* Shortlist form: the saved houses by name, each removable. */
.bh-picked {
	display: grid;
	gap: 0.25rem;
	margin: 0;
	padding: 0.75rem 1rem;
	border-radius: 8px;
	background: var(--bh-sand-2);
	list-style: none;
}

.bh-picked:empty {
	display: none;
}

.bh-picked li {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.25rem 1rem;
	min-height: 2.75rem;
	font-weight: 600;
}

.bh-form-success__list {
	margin: 0 0 0.75rem;
	padding-left: 1.25rem;
	font-weight: 600;
}

/* /enquire/: the saved strip above the form. */
.bh-enquire {
	display: grid;
	gap: 1.5rem;
	max-width: 760px;
}

.bh-saved {
	display: grid;
	gap: 0.75rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.bh-saved[hidden] {
	display: none;
}

.bh-saved__item {
	display: grid;
	grid-template-columns: 6rem minmax(0, 1fr) auto;
	align-items: center;
	gap: 1rem;
	padding: 0.75rem;
	border: 1px solid var(--bh-line);
	border-radius: 8px;
	background: #fff;
}

.bh-saved__img {
	display: block;
	width: 6rem;
	height: 4.5rem;
	border-radius: 6px;
	object-fit: cover;
}

.bh-saved__body {
	display: grid;
	gap: 0.125rem;
	min-width: 0;
}

.bh-saved__title {
	color: var(--bh-ink);
	font-weight: 600;
	text-decoration: none;
}

.bh-saved__title:hover {
	text-decoration: underline;
}

.bh-saved__meta {
	color: var(--bh-muted);
	font-size: 0.9375rem;
}

.bh-enquire__tip {
	margin: 0;
	color: var(--bh-muted);
	font-size: 0.9375rem;
}

.bh-enquire__tip[hidden] {
	display: none;
}

/* Shortlist card at the bottom (desktop: centred, 520 px at most; phones:
   full width above the sticky bar). Above the WhatsApp float and back to
   top (800), below the sticky bar (950) and modals. */
.bh-bar {
	position: fixed;
	bottom: var(--bh-bar-offset);
	left: 50%;
	z-index: 900;
	display: flex;
	align-items: center;
	gap: 0.75rem;
	box-sizing: border-box;
	width: min(520px, 100%);
	padding: 0.75rem 1rem;
	border: 1px solid var(--bh-line);
	border-bottom: 0;
	border-radius: 12px 12px 0 0;
	background: var(--bh-ground);
	box-shadow: 0 -6px 24px rgba(var(--bh-ink-rgb), 0.16);
	color: var(--bh-ink);
	transform: translateX(-50%);
}

.bh-bar[hidden] {
	display: none;
}

.bh-bar__count {
	margin: 0;
	font-weight: 700;
	white-space: nowrap;
}

.bh-bar__thumbs {
	display: flex;
	margin: 0;
	padding: 0 0 0 0.5rem;
	list-style: none;
}

.bh-bar__thumbs li {
	margin-left: -0.5rem;
}

.bh-bar__thumbs img {
	display: block;
	width: 48px;
	height: 36px;
	border: 2px solid var(--bh-ground);
	border-radius: 6px;
	object-fit: cover;
}

.bh-bar__cta {
	margin-left: auto;
	white-space: nowrap;
}

body.bh-has-shortlist-bar {
	padding-bottom: calc(var(--bh-bar-offset) + 4.5rem);
}

@media (max-width: 1023.98px) {
	.bh-bar {
		left: 0;
		width: 100%;
		gap: 0.5rem;
		padding: 0.625rem 0.75rem;
		transform: none;
	}

	.bh-bar__thumbs img {
		width: 36px;
		height: 27px;
	}

	.bh-bar__thumbs li:nth-child(n+3) {
		display: none;
	}

	.bh-bar__cta {
		padding-inline: 0.875rem;
	}
}

/* First-save hint under the heart (shown once per device). */
.bh-card__save,
.bh-panel__save {
	position: relative;
}

.bh-tip {
	position: absolute;
	top: calc(100% + 10px);
	right: 0;
	z-index: 5;
	width: 15rem;
	padding: 0.625rem 0.75rem;
	border-radius: 8px;
	background: var(--bh-ink);
	box-shadow: var(--bh-shadow);
	color: #fff;
	font-size: 0.9375rem;
	line-height: 1.4;
}

.bh-tip::before {
	content: "";
	position: absolute;
	top: -6px;
	right: 1.5rem;
	border-right: 6px solid transparent;
	border-bottom: 6px solid var(--bh-ink);
	border-left: 6px solid transparent;
}

/* Header: saved count as a heart badge on Enquire, a heart link on phones. */
.bh-head-actions__enquire {
	position: relative;
}

.bh-badge-count {
	position: absolute;
	top: -9px;
	right: -6px;
	display: inline-flex;
	align-items: center;
	gap: 2px;
	min-width: 1.5rem;
	height: 1.375rem;
	box-sizing: border-box;
	padding: 0 0.375rem;
	border: 2px solid #fff;
	border-radius: 999px;
	background: var(--bh-ink);
	color: #fff;
	font-size: 0.8125rem;
	font-weight: 700;
	line-height: 1;
}

.bh-badge-count[hidden],
.bh-head-actions__saved[hidden] {
	display: none;
}

.bh-heart {
	fill: currentColor;
}

.bh-head-actions__saved {
	gap: 2px;
	font-size: 0.9375rem;
	font-weight: 700;
}

@media (min-width: 1000px) {
	.bh-head-actions__saved {
		display: none !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.bh-form-wrap * {
		transition: none !important;
	}
}

/* =========================================================================
 * Phase 4: listing templates
 * ========================================================================= */

.bh-page {
	padding: 0.5rem 0 4rem;
	color: var(--bh-text);
}

/* Same edges as the theme's container (the child theme sets the edge spacing per breakpoint). */
.bh-wrap {
	width: min(var(--theme-container-edge-spacing, 100% - 2.5rem), var(--theme-normal-container-max-width, 1200px));
	margin-inline: auto;
}

.bh-wrap--narrow {
	width: min(var(--theme-container-edge-spacing, 100% - 2.5rem), var(--theme-narrow-container-max-width, 760px));
}

.bh-section {
	margin-top: 2.75rem;
}

.bh-section > h2,
.bh-archive__after h2,
.bh-similar > h2 {
	margin: 0 0 1rem;
}

.bh-prose > :first-child {
	margin-top: 0;
}

.bh-prose p,
.bh-prose ul,
.bh-prose ol {
	margin: 0 0 1em;
}

.bh-prose a {
	color: var(--bh-teal);
}

.bh-small {
	margin: 0.5rem 0 0;
	color: var(--bh-muted);
	font-size: 0.875rem;
}

/* Links in plugin text (talk line, empty states, small print, prose): underlined (WCAG 1.4.1). */
:is(.bh-talk, .bh-empty, .bh-small, .bh-prose) a:not(.bh-button) {
	text-decoration: underline;
	text-decoration-thickness: 1px;
}

.bh-eyebrow {
	margin: 0 0 0.5rem;
	color: var(--bh-teal);
	font-family: var(--bh-font-body);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.bh-icon {
	flex: none;
	vertical-align: middle;
}

/* Breadcrumb ------------------------------------------------------------ */
.bh-breadcrumb {
	margin: 0.75rem 0 1.25rem;
	font-size: 0.9375rem;
}

.bh-breadcrumb p {
	margin: 0;
}

/* Underlined at rest, thicker on hover: colour alone is not enough (WCAG 1.4.1, Phase 6). */
.bh-breadcrumb a {
	color: var(--bh-teal);
	text-decoration: underline;
	text-decoration-thickness: 1px;
}

.bh-breadcrumb a:hover {
	text-decoration-thickness: 2px;
}

.bh-breadcrumb .separator {
	color: var(--bh-muted);
}

.bh-breadcrumb .last {
	color: var(--bh-ink);
}

.bh-badge {
	display: inline-block;
	padding: 0.25rem 0.625rem;
	border-radius: 999px;
	background: #fff;
	color: var(--bh-ink);
	font-size: 0.75rem;
	font-weight: 600;
	line-height: 1.4;
}

.bh-badge--soft {
	background: var(--bh-chip);
	color: var(--bh-teal);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
}

/* Gallery --------------------------------------------------------------- */
.bh-gallery {
	position: relative;
	display: grid;
	gap: 10px;
	margin: 0 0 1.75rem;
}

.bh-gallery__item {
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: 12px;
	background: var(--bh-sand);
}

.bh-gallery__item picture,
.bh-gallery__img {
	display: block;
	width: 100%;
	height: 100%;
}

.bh-gallery__img {
	object-fit: cover;
	transition: transform 0.3s ease;
}

.bh-gallery__item:hover .bh-gallery__img {
	transform: scale(1.02);
}

.bh-gallery__item--main {
	aspect-ratio: 4 / 3;
}

.bh-gallery__item--tile {
	display: none;
}

.bh-gallery__all {
	position: absolute;
	right: 0.875rem;
	bottom: 0.875rem;
	box-shadow: var(--bh-shadow);
}

@media (min-width: 700px) {
	.bh-gallery {
		grid-template-columns: 2fr 1fr 1fr;
		grid-template-rows: repeat(2, minmax(0, 1fr));
		aspect-ratio: 2.55 / 1;
	}

	.bh-gallery__item--main {
		grid-row: 1 / span 2;
		aspect-ratio: auto;
	}

	.bh-gallery__item--tile {
		display: block;
	}

	.bh-gallery--n1 {
		grid-template-columns: 1fr;
		grid-template-rows: 1fr;
		aspect-ratio: 2.55 / 1;
	}

	.bh-gallery--n1 .bh-gallery__item--main {
		grid-row: auto;
	}

	.bh-gallery--n2 {
		grid-template-columns: 2fr 1fr;
		grid-template-rows: 1fr;
	}

	.bh-gallery--n2 .bh-gallery__item--main {
		grid-row: auto;
	}

	.bh-gallery--n3 {
		grid-template-columns: 2fr 1fr;
	}

	.bh-gallery--n4 .bh-gallery__item--tile:last-of-type {
		grid-column: 2 / span 2;
	}
}

/* Single layout --------------------------------------------------------- */
.bh-single__layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 0 2.5rem;
}

@media (min-width: 1024px) {
	.bh-single__layout {
		grid-template-columns: minmax(0, 1fr) 340px;
		grid-template-areas: "main panel" "more panel";
		align-items: start;
	}

	.bh-single__main {
		grid-area: main;
	}

	.bh-single__more {
		grid-area: more;
	}

	.bh-panel {
		position: sticky;
		top: 1.5rem;
		grid-area: panel;
	}
}

.bh-listing-head__tags {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
	margin: 0 0 0.75rem;
}

.bh-ref {
	color: var(--bh-muted);
	font-size: 0.875rem;
}

.bh-listing-head__title {
	margin: 0 0 0.5rem;
}

.bh-listing-head__where {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	margin: 0 0 1.5rem;
	font-size: 1.0625rem;
}

.bh-listing-head__where .bh-icon {
	margin-top: 0.15em;
	color: var(--bh-teal);
}

.bh-big-price {
	margin: -0.5rem 0 1.5rem;
	color: var(--bh-ink);
	font-size: 1.75rem;
	font-weight: 700;
	line-height: 1.2;
}

.bh-big-price__note {
	display: block;
	margin-top: 0.25rem;
	color: var(--bh-muted);
	font-size: 1rem;
	font-weight: 400;
}

/* Icon row -------------------------------------------------------------- */
.bh-icon-row {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 1fr));
	gap: 0.75rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.bh-icon-row__item {
	display: grid;
	grid-template-columns: auto 1fr;
	align-items: center;
	column-gap: 0.625rem;
	padding: 0.875rem 1rem;
	border: 1px solid var(--bh-line);
	border-radius: 12px;
	background: #fff;
}

.bh-icon-row__item .bh-icon {
	grid-row: 1 / span 2;
	color: var(--bh-teal);
}

.bh-icon-row__value {
	color: var(--bh-ink);
	font-size: 1.125rem;
	font-weight: 700;
	line-height: 1.2;
	overflow-wrap: anywhere;
}

.bh-icon-row__label {
	color: var(--bh-muted);
	font-size: 0.875rem;
}

/* Sleeping -------------------------------------------------------------- */
.bh-rooms {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 10.5rem), 1fr));
	gap: 0.75rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.bh-rooms__item {
	display: grid;
	gap: 0.25rem;
	padding: 1rem;
	border: 1px solid var(--bh-line);
	border-radius: 12px;
	background: #fff;
}

.bh-rooms__item .bh-icon {
	margin-bottom: 0.25rem;
	color: var(--bh-ink);
}

.bh-rooms__name {
	color: var(--bh-ink);
	font-weight: 600;
}

.bh-rooms__beds {
	color: var(--bh-muted);
	font-size: 0.9375rem;
}

/* Features -------------------------------------------------------------- */
.bh-features {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
	gap: 1.5rem;
}

.bh-ticks {
	display: grid;
	gap: 0.375rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.bh-ticks li {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
}

.bh-ticks .bh-icon {
	margin-top: 0.2em;
}

.bh-ticks__yes .bh-icon {
	color: var(--bh-teal);
}

.bh-ticks__no {
	color: var(--bh-muted);
}

.bh-ticks--plain li::before {
	content: "–";
	color: var(--bh-teal);
}

/* Rates and figures tables ---------------------------------------------- */
.bh-rates,
.bh-figures {
	width: 100%;
	margin: 0;
	border: 1px solid var(--bh-line);
	border-radius: 12px;
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
	background: #fff;
	font-size: 0.9375rem;
}

.bh-rates th,
.bh-rates td,
.bh-figures th,
.bh-figures td {
	padding: 0.875rem 1rem;
	border: 0;
	border-top: 1px solid var(--bh-line);
	text-align: left;
	vertical-align: top;
}

.bh-rates thead th {
	border-top: 0;
	background: var(--bh-sand-2);
	color: var(--bh-ink);
	font-weight: 600;
}

.bh-rates tbody th,
.bh-figures th {
	color: var(--bh-ink);
	font-weight: 600;
}

.bh-figures tr:first-child th,
.bh-figures tr:first-child td {
	border-top: 0;
}

.bh-figures th {
	width: 45%;
	background: var(--bh-sand-2);
}

.bh-rates__price {
	color: var(--bh-ink);
	font-weight: 700;
	white-space: nowrap;
}

@media (max-width: 699px) {
	.bh-rates thead {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
	}

	.bh-rates tr {
		display: block;
		padding: 0.5rem 0;
		border-top: 1px solid var(--bh-line);
	}

	.bh-rates tbody tr:first-child {
		border-top: 0;
	}

	.bh-rates th,
	.bh-rates td {
		display: grid;
		grid-template-columns: 8rem 1fr;
		gap: 0.75rem;
		padding: 0.375rem 1rem;
		border: 0;
	}

	.bh-rates th::before,
	.bh-rates td::before {
		content: attr(data-label);
		color: var(--bh-muted);
		font-weight: 400;
	}
}

.bh-rate-notes {
	display: flex;
	flex-wrap: wrap;
	gap: 0.375rem 1.5rem;
	margin: 1rem 0 0;
	padding: 0;
	list-style: none;
	font-size: 0.9375rem;
}

.bh-rate-notes strong {
	color: var(--bh-ink);
}

/* Availability note (Phase 6b): under the rates table and above the
   panel's rate line. Ink on sand, 13.7:1. */
.bh-availability-note {
	margin: 1rem 0 0;
	padding: 0.75rem 1rem;
	border-left: 4px solid var(--bh-teal);
	background: var(--bh-sand);
	color: var(--bh-ink);
	font-weight: 600;
}

.bh-availability-note--panel {
	margin: 0 0 1rem;
	font-size: 0.9375rem;
}

/* Enquiry panel --------------------------------------------------------- */
.bh-panel {
	margin-top: 2.75rem;
}

@media (min-width: 1024px) {
	.bh-panel {
		margin-top: 0;
	}
}

.bh-panel__price {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.375rem;
	margin: 0 0 0.75rem;
	color: var(--bh-muted);
}

.bh-panel__price strong {
	color: var(--bh-ink);
	font-family: var(--bh-font-heading, inherit);
	font-size: 1.75rem;
	font-weight: 400;
	line-height: 1.1;
}

.bh-panel .bh-form__row {
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	align-items: end;
}

.bh-panel__alt {
	margin: 0.75rem 0 0;
}

.bh-panel__save {
	margin-top: 0.75rem;
}

.bh-panel__save .bh-save {
	width: 100%;
}

.bh-panel__talk {
	display: flex;
	gap: 0.625rem;
	margin: 0.75rem 0 0;
	padding: 0.875rem 1rem;
	border-radius: 12px;
	background: var(--bh-sand-2);
	font-size: 0.9375rem;
}

.bh-panel__talk .bh-icon {
	margin-top: 0.15em;
	color: var(--bh-teal);
}

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

/* Cards ----------------------------------------------------------------- */
.bh-cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr));
	gap: 1rem;
}

/* Card grids: 16 px gaps on phones, 24 px from tablets (Phase 6 item 11). */
@media (min-width: 700px) {
	.bh-cards {
		gap: 1.5rem;
	}
}

@media (min-width: 1000px) {
	.bh-cards {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

.bh-card {
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border: 1px solid var(--bh-line);
	border-radius: var(--bh-radius-lg);
	background: #fff;
	transition: box-shadow 0.2s ease;
}

.bh-card:hover {
	box-shadow: var(--bh-shadow);
}

/* One card anatomy (Phase 6 item 11): 4:3 photo box (wide or tall photos
   crop instead of breaking the row), badges top-left and the heart
   top-right 12 px in, title clamped to two lines, the meta and feature rows
   at a fixed height (empty rows keep it), the price row pinned to the foot. */
.bh-card__media {
	position: relative;
	aspect-ratio: 4 / 3;
	background: var(--bh-sand);
}

.bh-card__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.bh-card__badges {
	position: absolute;
	top: 0.75rem;
	left: 0.75rem;
	display: flex;
	flex-wrap: wrap;
	gap: 0.375rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.bh-card--sale .bh-badge {
	background: var(--bh-ink);
	color: #fff;
}

.bh-card__save {
	position: absolute;
	z-index: 2;
	top: 0.75rem;
	right: 0.75rem;
}

.bh-card__save .bh-save {
	padding-inline: 0.875rem;
}

.bh-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 1rem 1.125rem 1.125rem;
}

.bh-card__head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 0.25rem 0.75rem;
}

.bh-card__title {
	display: -webkit-box;
	margin: 0;
	overflow: hidden;
	font-family: var(--bh-font-body);
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.3;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-clamp: 2;
}

/* Sale and rental titles are sentences: always two lines tall so the rows below line up. */
.bh-card--sale .bh-card__title,
.bh-card--rental .bh-card__title {
	min-height: 2.6em;
}

/* Holiday cards: name left, village right; the name takes what's left of the row. */
.bh-card__head .bh-card__title {
	flex: 1 1 10rem;
	min-width: 0;
}

.bh-card__title a {
	color: var(--bh-ink);
	text-decoration: none;
}

.bh-card__title a::after {
	position: absolute;
	inset: 0;
	content: "";
}

.bh-card__title a:focus-visible {
	outline: none;
}

.bh-card:has(.bh-card__title a:focus-visible) {
	outline: 3px solid var(--bh-teal);
	outline-offset: 2px;
}

.bh-card__village,
.bh-card__lead {
	color: var(--bh-muted);
	font-size: 0.875rem;
}

/* Meta row: one line, cut with an ellipsis. */
.bh-card__lead {
	min-height: 1.5em;
	margin: 0.25rem 0 0;
	overflow: hidden;
	line-height: 1.5;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.bh-card__price--sale {
	color: var(--bh-ink);
	font-size: 1.125rem;
	font-weight: 700;
}

/* Sale status (Phase 5): previous price struck through, sold cards muted. */
.bh-price-was {
	margin-right: 0.375rem;
	color: var(--bh-muted);
	font-size: 0.8em;
	font-weight: 400;
}

.bh-card--sold .bh-card__img {
	filter: grayscale(0.6);
	opacity: 0.85;
}

.bh-card--sold .bh-card__price--sale {
	color: var(--bh-muted);
}

.bh-sold-note {
	margin: -1rem 0 1.5rem;
	padding: 0.75rem 1rem;
	border-left: 4px solid var(--bh-ink);
	background: var(--bh-sand);
	color: var(--bh-ink);
	font-weight: 600;
}

.bh-card__facts {
	display: flex;
	flex-wrap: wrap;
	gap: 0.375rem 1rem;
	min-height: 1.5rem;
	margin: 0.625rem 0 0;
	padding: 0;
	list-style: none;
	color: var(--bh-text);
	font-size: 0.875rem;
	line-height: 1.5rem;
}

.bh-card__facts li,
.bh-card__beach {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
}

.bh-card__facts .bh-icon,
.bh-card__beach .bh-icon {
	color: var(--bh-ink);
}

.bh-card__beach {
	margin: 0.5rem 0 0;
	color: var(--bh-muted);
	font-size: 0.875rem;
}

.bh-card__foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-top: auto;
	padding-top: 1rem;
	border-top: 1px solid var(--bh-line);
}

.bh-card__body > :nth-last-child(2) {
	margin-bottom: 1rem;
}

.bh-card__price {
	margin: 0;
	color: var(--bh-muted);
	font-size: 0.9375rem;
}

.bh-card__price strong {
	color: var(--bh-ink);
	font-size: 1.125rem;
}

.bh-card__cta {
	position: relative;
	z-index: 1;
	flex: none;
}

/* Rentals: rent and its terms on their own two-line row, the button under it,
   so every rental foot is the same height. */
.bh-card--rental .bh-card__foot {
	flex-wrap: wrap;
	gap: 0.75rem 1rem;
}

.bh-card--rental .bh-card__price {
	display: -webkit-box;
	flex: 1 1 100%;
	min-height: 2.8em;
	overflow: hidden;
	line-height: 1.4;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-clamp: 2;
}

/* Filters --------------------------------------------------------------- */
.bh-filters {
	display: grid;
	gap: 1rem;
	margin: 1.5rem 0 2rem;
	padding: 1.25rem;
	border: 1px solid var(--bh-line);
	border-radius: var(--bh-radius-lg);
	background: #fff;
}

.bh-filters__group {
	margin: 0;
	padding: 0;
	border: 0;
}

.bh-filters__group legend {
	padding: 0;
}

.bh-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.bh-chip__input {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: 0;
	opacity: 0;
	pointer-events: none;
}

.bh-filters__selects {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem 1rem;
}

.bh-filters__select {
	display: grid;
	gap: 0.25rem;
	margin: 0;
}

.bh-filters__select label {
	color: var(--bh-ink);
	font-size: 0.875rem;
	font-weight: 600;
}

.bh-filters__select select {
	min-width: 9rem;
	min-height: 2.75rem;
	padding: 0.375rem 2rem 0.375rem 0.75rem;
	border: 1px solid var(--bh-muted);
	border-radius: 8px;
	background-color: #fff;
	color: var(--bh-ink);
	font: inherit;
}

.bh-filters__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem;
	margin: 0;
}

.bh-filters__clear {
	color: var(--bh-teal);
}

@media (min-width: 900px) {
	.bh-filters {
		grid-template-columns: 1fr auto;
		align-items: end;
	}

	.bh-filters__group,
	.bh-filters__selects {
		grid-column: 1;
	}

	.bh-filters__actions {
		grid-column: 2;
		grid-row: 1 / span 3;
		align-self: end;
	}
}

/* Archives -------------------------------------------------------------- */
.bh-archive__head h1 {
	margin: 0 0 0.75rem;
}

.bh-archive__intro {
	max-width: 47rem;
	font-size: 1.0625rem;
}

.bh-archive__sub {
	margin: 2rem 0 0;
}

.bh-archive__after {
	max-width: 47rem;
	margin-top: 3.5rem;
}

.bh-archive__after h2 {
	margin-top: 2.25rem;
}

.bh-archive__after .bh-form-wrap {
	margin: 1rem 0 2rem;
	padding: 1.5rem;
	border: 1px solid var(--bh-line);
	border-radius: var(--bh-radius-lg);
	background: #fff;
}

.bh-empty {
	padding: 1.25rem 1.5rem;
	border-radius: 12px;
	background: var(--bh-sand-2);
}

.bh-empty a {
	color: var(--bh-teal);
}

.bh-pagination ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 2rem 0 0;
	padding: 0;
	list-style: none;
}

.bh-pagination a,
.bh-pagination span {
	min-width: 2.75rem;
}

/* Similar / quotes / back link ----------------------------------------- */
.bh-similar {
	margin-top: 3.5rem;
}

.bh-quotes {
	display: grid;
	gap: 1rem;
}

.bh-quote {
	margin: 0;
	padding: 1.25rem 1.5rem;
	border-left: 4px solid var(--bh-teal);
	border-radius: 0 12px 12px 0;
	background: #fff;
}

.bh-quote blockquote {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 1.0625rem;
}

.bh-quote blockquote p {
	margin: 0;
}

/* Card grids inside pages (area pages, hub): cards off screen skip rendering,
   so their lazy photos wait until the card is near the viewport instead of
   competing with the hero photo (Phase 6 item 9, Lighthouse LCP). */
.bh-listings .bh-card,
.bh-cards--guides .bh-card {
	content-visibility: auto;
	contain-intrinsic-size: auto 28rem;
}

/* Area reviews band: quotes keep a third of the row however many there are. */
.bh-sec--reviews .bh-block.bh-quotes {
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr));
}

.bh-quote figcaption {
	margin-top: 0.5rem;
	color: var(--bh-muted);
	font-size: 0.875rem;
}

.bh-back a {
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
	color: var(--bh-teal);
	font-weight: 600;
}

/* Guide entry ------------------------------------------------------------ */
.bh-guide__photo {
	margin: 0 0 1.5rem;
	overflow: hidden;
	border-radius: var(--bh-radius-lg);
	background: var(--bh-sand);
}

.bh-guide__photo img {
	display: block;
	width: 100%;
	height: auto;
}

.bh-details {
	display: grid;
	grid-template-columns: max-content 1fr;
	gap: 0.5rem 1.5rem;
	margin: 0;
}

.bh-details dt {
	color: var(--bh-ink);
	font-weight: 600;
}

.bh-details dd {
	margin: 0;
}

.bh-details a {
	color: var(--bh-teal);
}

/* Video and map facades -------------------------------------------------- */
.bh-facade {
	position: relative;
	overflow: hidden;
	border-radius: var(--bh-radius-lg);
	background: var(--bh-ink);
	aspect-ratio: 16 / 9;
}

.bh-facade iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
}

.bh-facade__link {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	color: #fff;
	text-decoration: none;
}

.bh-facade__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0.75;
}

.bh-facade__play {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 4.5rem;
	height: 4.5rem;
	border-radius: 50%;
	background: #fff;
	color: var(--bh-teal);
	box-shadow: var(--bh-shadow);
}

.bh-facade__label {
	position: relative;
	padding: 0.375rem 0.875rem;
	border-radius: 999px;
	background: #fff;
	color: var(--bh-ink);
	font-size: 0.9375rem;
	font-weight: 600;
}

.bh-facade--map {
	background: var(--bh-sand) repeating-linear-gradient(45deg, transparent 0 22px, rgba(11, 110, 120, 0.06) 22px 24px);
	aspect-ratio: 16 / 7;
}

.bh-facade--map .bh-facade__link {
	color: var(--bh-ink);
}

.bh-facade__map-icon {
	color: var(--bh-teal);
}

.bh-facade__note {
	color: var(--bh-muted);
	font-size: 0.875rem;
}

/* Mobile sticky bar ------------------------------------------------------ */
.bh-sticky-bar {
	position: fixed;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 950;
	display: grid;
	/* Fixed Call and WhatsApp widths (their rendered sizes): the web font
	   swapping in can't move the Enquire button (CLS 0, Phase 6). */
	grid-template-columns: 5rem 7.875rem 1fr;
	gap: 0.5rem;
	padding: 0.5rem 0.75rem calc(0.5rem + env(safe-area-inset-bottom, 0px));
	border-top: 1px solid var(--bh-line);
	background: #fff;
}

.bh-sticky-bar__btn {
	gap: 0.375rem;
	min-height: 3rem;
	padding-inline: 0.875rem;
}

body.bh-has-sticky-bar {
	--bh-bar-offset: 4.125rem;
	padding-bottom: 4.125rem;
}

@media (min-width: 1024px) {
	.bh-sticky-bar {
		display: none;
	}

	body.bh-has-sticky-bar {
		--bh-bar-offset: 0px;
		padding-bottom: 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	.bh-gallery__img,
	.bh-card {
		transition: none !important;
	}
}

/* Page blocks (Stage B shortcodes) -------------------------------------- */
.bh-block {
	margin-block: 1.25rem;
}

nav.bh-chips ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 0 0 1.25rem;
	padding: 0;
	list-style: none;
}

.bh-tiles {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.75rem;
	margin-inline: 0;
	padding: 0;
	list-style: none;
}

@media (min-width: 700px) {
	.bh-tiles {
		grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
		gap: 1rem;
	}
}

.bh-tile {
	margin: 0;
}

.bh-tile__link {
	position: relative;
	display: block;
	overflow: hidden;
	aspect-ratio: 4 / 5;
	border-radius: var(--bh-radius-lg);
	background: var(--bh-ink);
	color: #fff;
	text-decoration: none;
}

.bh-tile__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.3s ease;
}

.bh-tile__link:hover .bh-tile__img {
	transform: scale(1.03);
}

.bh-tile__text {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	display: grid;
	gap: 0.125rem;
	padding: 3rem 1rem 1rem;
	background: linear-gradient(to top, rgba(10, 22, 34, 0.88) 0%, rgba(10, 22, 34, 0.7) 55%, rgba(10, 22, 34, 0) 100%);
}

.bh-tile__name {
	font-family: var(--bh-font-heading, Georgia, serif);
	font-size: 1.375rem;
	line-height: 1.15;
}

.bh-tile__line {
	font-size: 0.8125rem;
	line-height: 1.35;
}

.bh-tile__link:focus-visible {
	outline: 3px solid var(--bh-teal);
	outline-offset: 3px;
}

/* Tables (listing table, village table) */
.bh-table-wrap {
	overflow-x: auto;
}

.bh-table {
	width: 100%;
	margin: 0;
	border-collapse: collapse;
	border: 1px solid var(--bh-line);
	border-radius: 12px;
	background: #fff;
	font-size: 0.9375rem;
}

.bh-table caption {
	padding: 0 0 0.5rem;
	color: var(--bh-muted);
	font-size: 0.875rem;
	text-align: left;
}

.bh-table th,
.bh-table td {
	padding: 0.75rem 1rem;
	border-bottom: 1px solid var(--bh-line);
	text-align: left;
	vertical-align: top;
}

.bh-table thead th {
	background: var(--bh-sand);
	color: var(--bh-ink);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.02em;
}

.bh-table tbody th {
	font-weight: 600;
}

.bh-table tbody th a {
	color: var(--bh-teal);
}

@media (max-width: 699px) {
	.bh-table-wrap {
		overflow: visible;
	}

	.bh-table,
	.bh-table tbody,
	.bh-table tr,
	.bh-table th,
	.bh-table td {
		display: block;
	}

	.bh-table {
		border: 0;
		background: none;
	}

	.bh-table thead {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
	}

	.bh-table tbody tr {
		margin-bottom: 0.75rem;
		border: 1px solid var(--bh-line);
		border-radius: 12px;
		background: #fff;
	}

	.bh-table tbody th {
		font-size: 1.0625rem;
	}

	.bh-table caption {
		display: block;
		width: auto;
	}

	.bh-table tbody th,
	.bh-table td {
		padding: 0.25rem 1rem;
		border: 0;
	}

	.bh-table tbody th {
		padding-top: 0.75rem;
	}

	.bh-table tbody tr {
		padding-bottom: 0.5rem;
	}

	.bh-table td {
		display: grid;
		grid-template-columns: 8.5rem 1fr;
		gap: 0.5rem;
	}

	.bh-table td::before {
		content: attr(data-label);
		color: var(--bh-muted);
		font-size: 0.8125rem;
	}
}

/* Hero search */
.bh-search {
	display: grid;
	gap: 0.75rem;
	padding: 1rem;
	border-radius: var(--bh-radius-lg);
	background: #fff;
	box-shadow: var(--bh-shadow);
	color: var(--bh-ink);
}

.bh-search__field {
	display: grid;
	gap: 0.25rem;
	margin: 0;
}

.bh-search__field label {
	color: var(--bh-muted);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.bh-search__field select {
	width: 100%;
	min-height: 2.75rem;
}

.bh-search__submit {
	margin: 0;
}

.bh-search__submit .bh-button {
	width: 100%;
}

@media (min-width: 800px) {
	.bh-search {
		grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
		align-items: end;
	}
}

/* Guide cards */
.bh-cards--guides .bh-card__media {
	aspect-ratio: 4 / 3;
}

.bh-card--guide .bh-card__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.bh-card--guide .bh-eyebrow {
	margin: 0;
}

.bh-card--guide .bh-card__village {
	display: flex;
	align-items: center;
	gap: 0.25rem;
	margin: 0;
	color: var(--bh-muted);
	font-size: 0.8125rem;
}

.bh-card__summary {
	margin: 0;
	color: var(--bh-text);
	font-size: 0.9375rem;
}

.bh-guides__group {
	margin-block: 2.5rem;
}

/* Things-to-do hub (Phase 6 item 8): sticky chip row, six-card sections,
   card rows aligned (summary clamped, area line pinned to the bottom). */
.bh-guides {
	--bh-head-h: 60px;
}

@media (min-width: 1000px) {
	.bh-guides {
		--bh-head-h: 72px;
	}
}

nav.bh-chips--sticky {
	position: sticky;
	top: var(--bh-head-h);
	z-index: 20;
	margin-bottom: 0.5rem;
	background: var(--bh-ground);
	box-shadow: 0 1px 0 var(--bh-line);
}

.admin-bar nav.bh-chips--sticky {
	top: calc(var(--bh-head-h) + var(--admin-bar, 32px));
}

/* One row; on narrow screens it scrolls sideways. Padding keeps focus rings visible. */
nav.bh-chips--sticky ul {
	flex-wrap: nowrap;
	margin: 0;
	padding: 0.75rem 6px;
	overflow-x: auto;
	scrollbar-width: none;
}

nav.bh-chips--sticky ul::-webkit-scrollbar {
	display: none;
}

nav.bh-chips--sticky li {
	flex: none;
}

/* Anchored jumps (#bh-guides, category headings) land below header + chip row. */
.bh-guides,
.bh-guides__group {
	scroll-margin-top: calc(var(--bh-head-h) + 4.5rem);
}

.bh-guides__group > h2 {
	margin: 0 0 0.75rem;
}

.bh-guides__intro {
	max-width: 760px;
	margin-bottom: 1.5rem;
	color: var(--bh-text);
}

.bh-guides__intro p {
	margin: 0;
}

.bh-guides__more {
	margin: 1.5rem 0 0;
}

.bh-card--guide .bh-card__title {
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-clamp: 2;
}

.bh-card--guide .bh-card__summary {
	display: -webkit-box;
	margin-top: 0.375rem;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-clamp: 2;
}

.bh-card--guide .bh-card__village {
	margin-top: auto;
	padding-top: 0.75rem;
}

/* Area pages (Phase 6 item 9): "Why stay in {area}" tiles and the
   collapsed "Compare at a glance" table under the house grid. */
.bh-facts {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.75rem;
	margin: 0.5rem 0 0;
	padding: 0;
	list-style: none;
}

@media (min-width: 800px) {
	.bh-facts {
		grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
		gap: 1.5rem;
	}
}

.bh-fact {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	margin: 0;
	padding: 1.25rem;
	border: 1px solid var(--bh-line);
	border-radius: var(--bh-radius-lg);
	background: #fff;
}

.bh-fact .bh-icon {
	margin-bottom: 0.5rem;
	color: var(--bh-teal);
}

.bh-fact__label {
	color: var(--bh-muted);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.bh-fact__value {
	color: var(--bh-ink);
	font-size: 1.0625rem;
	font-weight: 600;
	line-height: 1.35;
}

.bh-compare {
	margin-top: 1.5rem;
	border-top: 1px solid var(--bh-line);
}

.bh-compare__toggle {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	min-height: 2.75rem;
	padding-block: 0.5rem;
	color: var(--bh-ink);
	font-weight: 600;
	list-style: none;
	cursor: pointer;
}

.bh-compare__toggle::-webkit-details-marker {
	display: none;
}

.bh-compare__toggle::before {
	content: "";
	width: 0.5em;
	height: 0.5em;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(-45deg);
	transition: transform 0.15s ease;
}

.bh-compare[open] > .bh-compare__toggle::before {
	transform: rotate(45deg);
}

.bh-compare__toggle:focus-visible {
	outline: 3px solid var(--bh-teal);
	outline-offset: 2px;
}

.bh-compare > :not(summary) {
	margin-top: 0.75rem;
}

/* Forms placed straight in an enquiry band (pet-friendly, list your property) get the panel card. */
.bh-split--enquire .elementor-shortcode > .bh-form-wrap {
	box-sizing: border-box;
	padding: 1.5rem;
	border: 1px solid var(--bh-line);
	border-radius: 8px;
	background: #fff;
	box-shadow: var(--bh-shadow);
}

.bh-split--enquire .elementor-shortcode > .bh-form-wrap [type="submit"] {
	width: 100%;
}

/* Reviews */
.bh-block.bh-quotes {
	grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
}

.bh-quote figcaption {
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem 0.75rem;
}

.bh-quote__name {
	color: var(--bh-ink);
	font-weight: 600;
}

/* Google reviewer's photo (Reviews › Google: "Show the reviewer's photo"). */
.bh-quote__photo {
	width: 32px;
	height: 32px;
	margin-right: 0.5rem;
	border-radius: 50%;
	object-fit: cover;
	vertical-align: middle;
}

.bh-quote__stars {
	margin: 0 0 0.5rem;
	color: #8a5a00;
	letter-spacing: 0.1em;
}

/* Contact list (an office card, Phase 6 item 10), link list */
.bh-contact-list {
	display: grid;
	gap: 0.5rem;
	margin: 0;
	padding: 1.25rem 1.5rem;
	border: 1px solid var(--bh-line);
	border-radius: var(--bh-radius-lg);
	background: #fff;
}

.bh-contact-list > div:last-child {
	padding-bottom: 0;
	border-bottom: 0;
}

.bh-contact-list > div {
	display: grid;
	grid-template-columns: 7rem 1fr;
	gap: 0.75rem;
	padding-bottom: 0.5rem;
	border-bottom: 1px solid var(--bh-line);
}

.bh-contact-list dt {
	color: var(--bh-muted);
	font-weight: 600;
}

.bh-contact-list dd {
	margin: 0;
	color: var(--bh-ink);
}

.bh-link-list {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.5rem;
	padding: 0;
	list-style: none;
}

/* Header actions (inside Blocksy's header text item): Enquire on desktop,
   the phone icon on phones (the sticky bar has Enquire there). */
.bh-head-actions {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.bh-head-actions__icon {
	width: 2.75rem;
	padding: 0;
}

@media (min-width: 1000px) {
	.bh-head-actions__call {
		display: none !important;
	}
}

@media (max-width: 999.98px) {
	.bh-head-actions__enquire {
		display: none !important;
	}
}

/* Footer pieces (inside Blocksy's footer widget areas, dark band) */
.bh-wordmark {
	margin: 0 0 0.75rem;
	font-family: var(--bh-font-heading, Georgia, serif);
	font-size: 1.5rem;
	line-height: 1.2;
}

.bh-wordmark a {
	color: inherit;
	text-decoration: none;
}

.bh-footer-brand__desc,
.bh-compliance {
	margin: 0 0 0.75rem;
	font-size: 0.875rem;
	line-height: 1.6;
}

.bh-footer__title {
	margin: 0 0 0.75rem;
	color: #fff;
	font-family: var(--bh-font-body, inherit);
	font-size: 0.9375rem;
	font-weight: 600;
	letter-spacing: 0;
}

.bh-footer-links__list,
.bh-footer-contact ul {
	display: grid;
	gap: 0.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 0.875rem;
}

.bh-footer-links__list a,
.bh-footer-contact a {
	color: inherit;
	text-decoration: none;
}

.bh-footer-links__list a:hover,
.bh-footer-contact a:hover,
.bh-footer-bottom a:hover {
	text-decoration: underline;
}

.bh-strong {
	font-weight: 600;
}

.bh-social {
	display: flex;
	gap: 0.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.bh-social a {
	width: 2.75rem;
	padding: 0;
}

.bh-footer-bottom {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 0.5rem 1.5rem;
	width: 100%;
	font-size: 0.8125rem;
}

.bh-footer-bottom p {
	margin: 0;
}

.bh-footer-bottom__links {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.25rem;
}

.bh-footer-bottom a {
	color: inherit;
	text-decoration: none;
}