/* =========================================================================
 * Home — hero, statement, treatments, fees & membership, people,
 * part of Bright, finding the stairs + booking form.
 *
 * Design canvas 1920px: sizes are design px × var(--bo-s).
 * ====================================================================== */

/* -------------------------------------------------------------------------
 * Shared: image crops
 * A default image keeps the design's exact crop (percentages from Figma,
 * relative to its frame). A replacement image (.is-custom) simply covers.
 * ---------------------------------------------------------------------- */

:is(.bo-home-hero, .bo-home-statement, .bo-home-treatments, .bo-home-fees, .bo-home-people, .bo-home-bright, .bo-home-visit) img {
	max-width: none;
}

.bo-home-statement__mirror,
.bo-home-treatments__photo,
.bo-home-fees__bg,
.bo-home-people__portrait,
.bo-home-people__foh-photo,
.bo-home-bright__photo,
.bo-home-visit__photo {
	position: relative;
	overflow: hidden;
}

:is(.bo-home-statement__mirror, .bo-home-treatments__photo, .bo-home-fees__bg, .bo-home-people__portrait, .bo-home-people__foh-photo, .bo-home-bright__photo, .bo-home-visit__photo) > img {
	position: absolute;
	display: block;
	max-width: none;
}

:is(.bo-home-statement__mirror, .bo-home-treatments__photo, .bo-home-fees__bg, .bo-home-people__foh-photo, .bo-home-bright__photo).is-custom > img,
.bo-home-visit__photo > img {
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Fee row — used by the treatment cards and the fee card */
.bo-section .bo-home-fee-row {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	padding-block: 15px;
	border-top: 1px solid var(--ps-line-light);
	color: var(--ps-ink);
	font-size: 18px;
	line-height: 30px;
	letter-spacing: -0.01em;
}

.bo-section .bo-home-fee-row__price {
	flex-shrink: 0;
	color: var(--ps-emerald);
	font-weight: 500;
	white-space: nowrap;
}

/* -------------------------------------------------------------------------
 * Hero: Home — Proto / Hero load: Home (End state)
 * ---------------------------------------------------------------------- */

.bo-home-hero {
	--bo-hh-media: calc(800 * var(--bo-s));
	--bo-hh-bottom: calc(78 * var(--bo-s));
	position: relative;
	padding-top: max(calc(var(--bo-header-h) + 40px), calc(150 * var(--bo-s)));
	padding-bottom: var(--bo-hh-bottom);
}

/* Velvet band: ends 390/800 of the way down the video, as in the design */
.bo-home-hero__band {
	position: absolute;
	inset: 0 0 auto;
	height: calc(100% - var(--bo-hh-bottom) - var(--bo-hh-media) * 0.4875);
	background: var(--ps-velvet);
}

.bo-home-hero__inner {
	position: relative;
}

.bo-section .bo-home-hero__title {
	margin-left: calc(-8 * var(--bo-s));
	color: var(--ps-ivory);
	white-space: nowrap;
}

.bo-home-hero__intro {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 32px;
	margin-top: calc(26 * var(--bo-s));
}

.bo-section .bo-home-hero__lede {
	width: calc(700 * var(--bo-s));
	color: var(--ps-ivory);
}

.bo-home-hero__media {
	--bo-card-radius: var(--bo-radius-media);
	height: var(--bo-hh-media);
	margin-top: calc(78 * var(--bo-s));
	overflow: hidden;
	border-radius: var(--bo-radius-media);
	background: var(--ps-velvet);
}

.bo-section .bo-home-hero__video {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
}

.bo-home-hero__moulding {
	position: absolute;
	inset: calc(24 * var(--bo-s));
	z-index: 2;
	border: 1px solid var(--ps-moulding);
	border-radius: calc(14 * var(--bo-s));
	pointer-events: none;
}

/* -------------------------------------------------------------------------
 * Statement — Proto / Home statement
 * ---------------------------------------------------------------------- */

.bo-home-statement {
	padding-top: max(80px, calc(150 * var(--bo-s)));
	padding-bottom: max(64px, calc(120 * var(--bo-s)));
}

.bo-home-statement__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 48px;
}

.bo-home-statement__copy {
	display: flex;
	flex-direction: column;
	gap: max(24px, calc(36 * var(--bo-s)));
	min-width: 0;
}

.bo-section .bo-home-statement__heading {
	width: calc(1040 * var(--bo-s));
	max-width: 100%;
	color: var(--ps-ink);
}

.bo-section .bo-home-statement__text {
	width: calc(860 * var(--bo-s));
	max-width: 100%;
}

.bo-home-statement__mirrors {
	position: relative;
	flex-shrink: 0;
	width: calc(518 * var(--bo-s));
	aspect-ratio: 518 / 430;
}

.bo-section .bo-home-statement__mirror {
	position: absolute;
	aspect-ratio: 1;
	margin: 0;
	border: 3px solid var(--ps-brass);
	border-radius: 50%;
	transform-origin: center;
}

.bo-home-statement__mirror--one   { left: 0;       top: 0;       width: 57.915%; }
.bo-home-statement__mirror--two   { left: 58.687%; top: 4.186%;  width: 40.541%; }
.bo-home-statement__mirror--three { left: 43.243%; top: 58.14%;  width: 32.819%; }

.bo-home-statement__mirror--one:not(.is-custom) > img   { left: -67.24%;  top: -137.2%; width: 390.81%; height: 260%; }
.bo-home-statement__mirror--two:not(.is-custom) > img   { left: -50.8%;   top: -34%;    width: 240%;    height: 300%; }
.bo-home-statement__mirror--three:not(.is-custom) > img { left: -246.42%; top: -174.4%; width: 511.06%; height: 340%; }

/* -------------------------------------------------------------------------
 * Treatments — What we do up here
 * ---------------------------------------------------------------------- */

.bo-home-treatments {
	padding-top: max(80px, calc(130 * var(--bo-s)));
	padding-bottom: max(80px, calc(140 * var(--bo-s)));
}

.bo-home-treatments__head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	margin-bottom: max(40px, calc(64 * var(--bo-s)));
}

.bo-section .bo-home-treatments__heading {
	color: var(--ps-ink);
}

.bo-home-treatments__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: max(20px, calc(32 * var(--bo-s)));
}

.bo-home-treatments__card {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.bo-home-treatments__photo {
	--bo-card-radius: var(--bo-radius-card);
	width: 100%;
	aspect-ratio: 520 / 400;
	border-radius: var(--bo-radius-card);
	background: var(--ps-stone);
}

.bo-home-treatments__photo.bo-crop--everyday > img { left: 0;     top: -71.15%; width: 100%; height: 195.41%; }
.bo-home-treatments__photo.bo-crop--cosmetic > img { left: -8.5%; top: -66.18%; width: 130%; height: 211.24%; }
.bo-home-treatments__photo.bo-crop--surgery > img  { left: 0;     top: -15%;    width: 100%; height: 130%; }

.bo-home-treatments__body {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 32px 0 24px;
}

.bo-section .bo-home-treatments__title {
	color: var(--ps-ink);
}

/* -------------------------------------------------------------------------
 * Fees and membership — Proto / Home fee objects
 * ---------------------------------------------------------------------- */

.bo-home-fees {
	position: relative;
	overflow: hidden;
	min-height: calc(900 * var(--bo-s));
	padding-top: max(80px, calc(190 * var(--bo-s)));
	padding-bottom: max(64px, calc(120 * var(--bo-s)));
}

.bo-home-fees__bg {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.bo-home-fees__bg:not(.is-custom) > img {
	left: -4.55%;
	top: -199.99%;
	width: 227.27%;
	height: 322.56%;
}

/* Velvet shade, 86% */
.bo-home-fees__bg::after {
	content: '';
	position: absolute;
	inset: 0;
	background: color-mix(in srgb, var(--ps-velvet) 86%, transparent);
}

.bo-home-fees__inner {
	position: relative;
	z-index: 1;
}

.bo-home-fees__copy {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: max(24px, calc(32 * var(--bo-s)));
}

.bo-section .bo-home-fees__heading {
	width: calc(760 * var(--bo-s));
	max-width: 100%;
	color: var(--ps-ivory);
}

.bo-section .bo-home-fees__text {
	width: calc(680 * var(--bo-s));
	max-width: 100%;
	color: var(--ps-ivory);
}

/* The objects sit on the 1920 × 900 canvas, positioned from the section. */
.bo-home-fees__objects {
	position: static;
}

.bo-home-fees__fee,
.bo-home-fees__plan {
	position: absolute;
	z-index: 1;
	transform-origin: center;
	transition: transform 1200ms var(--bo-ease-out);
}

.bo-home-fees__fee {
	left: calc(1011.47 * var(--bo-s));
	top: calc(-84.06 * var(--bo-s)); /* 105.94 on the 1920×900 canvas, less the 190 copy offset */
	display: flex;
	flex-direction: column;
	gap: calc(6 * var(--bo-s));
	box-sizing: border-box;
	width: calc(520 * var(--bo-s));
	padding: calc(44 * var(--bo-s));
	border-radius: 8px;
	background: var(--ps-paper);
	color: var(--ps-ink);
	box-shadow: 0 calc(30 * var(--bo-s)) calc(60 * var(--bo-s)) rgb(0 0 0 / .35);
	transform: rotate(-3deg);
}

.bo-section .bo-home-fees__fee .bo-t-label {
	font-size: max(12px, calc(14 * var(--bo-s)));
	line-height: max(16px, calc(20 * var(--bo-s)));
}

.bo-section .bo-home-fees__fee-title {
	margin-bottom: calc(14 * var(--bo-s));
	color: var(--ps-ink);
}

.bo-section .bo-home-fees__rows .bo-home-fee-row {
	padding-block: calc(14 * var(--bo-s));
	font-size: max(13px, calc(18 * var(--bo-s)));
	line-height: 1.6667;
}

.bo-home-fees__plan {
	left: calc(1318.93 * var(--bo-s));
	top: calc(327.07 * var(--bo-s)); /* 517.07 on the canvas, less 190 */
	box-sizing: border-box;
	width: calc(500 * var(--bo-s));
	height: calc(300 * var(--bo-s));
	padding: calc(34 * var(--bo-s));
	border: 1px solid var(--ps-brass-light);
	border-radius: var(--bo-radius-card);
	background: linear-gradient(149.04deg, color-mix(in srgb, var(--ps-emerald) 93%, var(--ps-paper)) 0%, color-mix(in srgb, var(--ps-emerald) 55%, var(--ps-velvet)) 71.43%);
	color: var(--ps-ivory);
	box-shadow: 0 calc(28 * var(--bo-s)) calc(50 * var(--bo-s)) rgb(0 0 0 / .45);
	transform: rotate(4deg);
}

.bo-section .bo-home-fees__plan .bo-t-label {
	font-size: max(12px, calc(14 * var(--bo-s)));
	line-height: max(16px, calc(20 * var(--bo-s)));
}

.bo-section .bo-home-fees__plan-text {
	margin-top: calc(14 * var(--bo-s));
	font-size: max(13px, calc(18 * var(--bo-s)));
	line-height: 1.6667;
	letter-spacing: -0.01em;
}

.bo-section .bo-home-fees__plan-price {
	position: absolute;
	left: calc(34 * var(--bo-s));
	top: calc(158 * var(--bo-s));
	display: flex;
	align-items: flex-end;
	gap: calc(12 * var(--bo-s));
}

.bo-home-fees__plan-amount {
	font-family: var(--bo-font-display);
	font-size: calc(112 * var(--bo-s));
	line-height: 1.0536;
	letter-spacing: -0.015em;
}

.bo-home-fees__plan-per {
	margin-bottom: calc(32 * var(--bo-s));
	color: var(--ps-on-dark-muted);
	font-size: max(13px, calc(18 * var(--bo-s)));
	line-height: 1.6667;
	letter-spacing: -0.01em;
	white-space: nowrap;
}

.bo-home-fees__plan .bo-card-hover { inset: -1px; }

/* Start state, before the section is revealed */
.bo-js .bo-home-fees:not(.is-revealed) .bo-home-fees__fee {
	transform: translate(calc(-1.47 * var(--bo-s)), calc(64 * var(--bo-s))) rotate(0deg);
}

.bo-js .bo-home-fees:not(.is-revealed) .bo-home-fees__plan {
	transform: translate(calc(-18.93 * var(--bo-s)), calc(42.93 * var(--bo-s))) rotate(0deg);
}

.bo-home-fees.is-revealed .bo-home-fees__plan {
	transition-delay: 120ms;
}

@media (prefers-reduced-motion: reduce) {
	.bo-home-fees__fee,
	.bo-home-fees__plan { transition: none; }
}

/* -------------------------------------------------------------------------
 * People — Proto / Home people
 * ---------------------------------------------------------------------- */

.bo-home-people {
	padding-block: max(80px, calc(140 * var(--bo-s)));
}

.bo-section .bo-home-people__heading {
	margin-bottom: max(40px, calc(64 * var(--bo-s)));
	color: var(--ps-ink);
}

.bo-home-people__row {
	display: flex;
	align-items: stretch;
	gap: max(20px, calc(32 * var(--bo-s)));
}

.bo-home-people__person {
	position: relative;
	box-sizing: border-box;
	flex: 0 0 calc(1020 * var(--bo-s));
	min-height: calc(640 * var(--bo-s));
	padding: calc(64 * var(--bo-s));
	overflow: hidden;
	border-radius: var(--bo-radius-panel);
	background: var(--ps-blush);
}

.bo-home-people__copy {
	display: flex;
	flex-direction: column;
	gap: 18px;
	width: calc(560 * var(--bo-s));
}

.bo-home-people__copy > :not(h3) {
	width: calc(520 * var(--bo-s));
	max-width: 100%;
}

.bo-section .bo-home-people__name { color: var(--ps-ink); }
.bo-section .bo-home-people__role { color: var(--ps-emerald); }

.bo-section .bo-home-people__portrait {
	position: absolute;
	left: calc(632 * var(--bo-s));
	top: calc(150 * var(--bo-s));
	width: calc(340 * var(--bo-s));
	aspect-ratio: 1;
	margin: 0;
	border: 3px solid var(--ps-brass);
	border-radius: 50%;
	transform-origin: center;
}

.bo-home-people__portrait > img {
	left: -2.5%;
	top: 0;
	width: 105%;
	height: 105%;
}

.bo-home-people__foh {
	position: relative;
	flex: 1 1 0;
	min-width: 0;
	min-height: calc(640 * var(--bo-s));
	overflow: hidden;
	border-radius: var(--bo-radius-panel);
	background: var(--ps-emerald);
	color: var(--ps-ivory);
}

.bo-home-people__foh-photo {
	width: 100%;
	aspect-ratio: 572 / 400;
}

.bo-home-people__foh-photo:not(.is-custom) > img {
	left: 0;
	top: -46.47%;
	width: 100%;
	height: 178.74%;
}

.bo-home-people__foh-copy {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: calc(44 * var(--bo-s)) calc(64 * var(--bo-s)) calc(64 * var(--bo-s));
}

.bo-section .bo-home-people__foh-copy h3 { color: var(--ps-ivory); }

.bo-section .bo-home-people__foh-copy p {
	width: calc(444 * var(--bo-s));
	max-width: 100%;
	color: var(--ps-ivory);
}

/* -------------------------------------------------------------------------
 * Part of Bright
 * ---------------------------------------------------------------------- */

.bo-home-bright {
	padding-block: max(80px, calc(140 * var(--bo-s)));
}

.bo-home-bright__row {
	display: flex;
	align-items: center;
	gap: max(40px, calc(96 * var(--bo-s)));
}

.bo-home-bright__photo {
	flex: 0 0 calc(800 * var(--bo-s));
	aspect-ratio: 800 / 600;
	border-radius: var(--bo-radius-panel);
	background: var(--ps-stone);
}

.bo-home-bright__photo:not(.is-custom) > img {
	left: -6.37%;
	top: 0;
	width: 112.73%;
	height: 100%;
}

.bo-home-bright__copy {
	display: flex;
	flex: 1 1 0;
	flex-direction: column;
	gap: max(24px, calc(36 * var(--bo-s)));
	min-width: 0;
}

.bo-section .bo-home-bright__copy h2 { color: var(--ps-ink); }

.bo-section .bo-home-bright__text {
	width: calc(700 * var(--bo-s));
	max-width: 100%;
}

.bo-section .bo-home-bright__quote {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding-top: 28px;
	border-top: 1px solid var(--ps-line-light);
}

.bo-section .bo-home-bright__quote blockquote {
	width: calc(700 * var(--bo-s));
	max-width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	color: var(--ps-ink);
}

.bo-section .bo-home-bright__stats {
	display: flex;
	flex-wrap: wrap;
	gap: 24px max(32px, calc(64 * var(--bo-s)));
	margin: 0;
	padding-top: 8px;
}

.bo-home-bright__stat {
	display: flex;
	flex-direction: column;
	gap: 2px;
	white-space: nowrap;
}

.bo-section .bo-home-bright__stat dt { color: var(--ps-emerald); }
.bo-section .bo-home-bright__stat dd { margin: 0; }

/* -------------------------------------------------------------------------
 * Finding the stairs + booking form
 * ---------------------------------------------------------------------- */

.bo-home-visit {
	padding-block: max(80px, calc(140 * var(--bo-s)));
}

.bo-section .bo-home-visit__heading {
	margin-bottom: max(40px, calc(64 * var(--bo-s)));
	color: var(--ps-ink);
}

.bo-home-visit__row {
	display: flex;
	align-items: flex-start;
	gap: max(32px, calc(64 * var(--bo-s)));
}

.bo-home-visit__photo {
	flex: 0 0 calc(440 * var(--bo-s));
	align-self: stretch;
	border-radius: var(--bo-radius-panel);
	background: var(--ps-stone);
}

.bo-home-visit__details {
	flex: 1 1 0;
	min-width: 0;
}

.bo-section .bo-home-visit__intro {
	margin-bottom: 28px;
	color: var(--ps-ink);
}

.bo-section .bo-home-visit__list {
	margin: 0;
}

.bo-home-visit__item {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding-block: 14px;
	border-top: 1px solid var(--ps-line-light);
}

.bo-section .bo-home-visit__item dd {
	margin: 0;
	color: var(--ps-ink);
}

.bo-section .bo-home-visit__item dd a {
	color: inherit;
	transition: color var(--bo-hover) var(--bo-ease);
}

.bo-section .bo-home-visit__item dd a:hover {
	color: var(--ps-emerald);
}

.bo-home-visit__panel {
	box-sizing: border-box;
	display: flex;
	flex: 0 0 calc(620 * var(--bo-s));
	flex-direction: column;
	gap: 16px;
	min-width: 0;
	padding: max(28px, calc(56 * var(--bo-s)));
	border-radius: var(--bo-radius-panel);
	background: var(--ps-velvet);
	color: var(--ps-ivory);
}

.bo-section .bo-home-visit__form-title { color: var(--ps-ivory); }

.bo-section .bo-home-visit__form-text {
	max-width: 500px;
}

.bo-home-visit__form {
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin-top: 8px;
}

.bo-home-visit__submit {
	margin-top: 8px;
}

.bo-section .bo-home-visit__privacy {
	max-width: 500px;
	color: var(--ps-on-dark-muted);
}

.bo-section .bo-home-visit__privacy a {
	color: inherit;
	transition: color var(--bo-hover) var(--bo-ease);
}

.bo-section .bo-home-visit__privacy a:hover {
	color: var(--ps-brass-light);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

/* -------------------------------------------------------------------------
 * Tablet — 1023px and below
 * ---------------------------------------------------------------------- */

@media (max-width: 1023px) {
	/* Hero */
	.bo-home-hero {
		--bo-hh-media: calc((100vw - 2 * var(--bo-gutter)) * 0.62);
		--bo-hh-bottom: 48px;
	}
	.bo-home-hero__intro {
		flex-direction: column;
		align-items: flex-start;
		gap: 28px;
		margin-top: 24px;
	}
	.bo-section .bo-home-hero__lede { width: 100%; max-width: 620px; }
	.bo-home-hero__media { margin-top: 48px; }

	/* Statement */
	.bo-home-statement__row { flex-direction: column; align-items: flex-start; gap: 48px; }
	.bo-home-statement__mirrors { width: min(100%, 460px); align-self: center; }
	.bo-section .bo-home-statement__heading,
	.bo-section .bo-home-statement__text { width: 100%; }

	/* Treatments */
	.bo-home-treatments__head { flex-direction: column; align-items: flex-start; }
	.bo-home-treatments__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 48px; }

	/* Fees */
	.bo-home-fees { min-height: 0; }
	.bo-home-fees__bg:not(.is-custom) > img {
		inset: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: 30% 70%;
	}
	.bo-section .bo-home-fees__heading,
	.bo-section .bo-home-fees__text { width: 100%; max-width: 680px; }
	.bo-home-fees__objects {
		position: relative;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 0;
		margin-top: 64px;
		padding: 0 8px 24px;
	}
	.bo-home-fees__fee,
	.bo-home-fees__plan {
		position: relative;
		left: auto;
		top: auto;
	}
	.bo-home-fees__fee {
		gap: 6px;
		width: min(100%, 480px);
		padding: 36px;
		box-shadow: 0 24px 48px rgb(0 0 0 / .35);
	}
	.bo-section .bo-home-fees__fee .bo-t-label,
	.bo-section .bo-home-fees__plan .bo-t-label { font-size: 14px; line-height: 20px; }
	.bo-section .bo-home-fees__fee-title { margin-bottom: 14px; }
	.bo-section .bo-home-fees__rows .bo-home-fee-row { padding-block: 14px; font-size: 17px; }
	.bo-home-fees__plan {
		align-self: flex-end;
		width: min(92%, 440px);
		height: auto;
		min-height: 260px;
		margin-top: -48px;
		padding: 30px;
		box-shadow: 0 24px 48px rgb(0 0 0 / .45);
	}
	.bo-section .bo-home-fees__plan-text { margin-top: 12px; font-size: 17px; }
	.bo-section .bo-home-fees__plan-price { position: static; margin-top: 40px; gap: 12px; }
	.bo-home-fees__plan-amount { font-size: 88px; }
	.bo-home-fees__plan-per { margin-bottom: 24px; font-size: 17px; }
	.bo-js .bo-home-fees:not(.is-revealed) .bo-home-fees__fee { transform: translateY(48px) rotate(0deg); }
	.bo-js .bo-home-fees:not(.is-revealed) .bo-home-fees__plan { transform: translateY(36px) rotate(0deg); }

	/* People */
	.bo-home-people__row { flex-direction: column; }
	.bo-home-people__person {
		flex: none;
		display: flex;
		align-items: center;
		gap: 32px;
		min-height: 0;
		padding: 40px;
	}
	.bo-home-people__copy,
	.bo-home-people__copy > :not(h3) { width: auto; }
	.bo-home-people__copy { flex: 1 1 0; }
	.bo-section .bo-home-people__portrait {
		position: relative;
		left: auto;
		top: auto;
		flex: 0 0 240px;
		width: 240px;
	}
	.bo-home-people__foh { flex: none; min-height: 0; }
	.bo-home-people__foh-copy { padding: 32px 40px 40px; }
	.bo-section .bo-home-people__foh-copy p { width: auto; max-width: 444px; }

	/* Part of Bright */
	.bo-home-bright__row { flex-direction: column; align-items: stretch; }
	.bo-home-bright__photo { flex: none; width: 100%; }
	.bo-section .bo-home-bright__text,
	.bo-section .bo-home-bright__quote blockquote { width: 100%; }

	/* Visit */
	.bo-home-visit__row { flex-wrap: wrap; }
	.bo-home-visit__photo { flex: 0 0 calc(40% - 16px); min-height: 520px; }
	.bo-home-visit__details { flex: 1 1 calc(60% - 16px); }
	.bo-home-visit__panel { flex: 1 1 100%; }
}

/* -------------------------------------------------------------------------
 * Phone — 767px and below
 * ---------------------------------------------------------------------- */

@media (max-width: 767px) {
	.bo-home-hero {
		--bo-hh-media: calc((100vw - 2 * var(--bo-gutter)) * 1.1);
	}
	.bo-section .bo-home-hero__title { margin-left: -3px; white-space: normal; }
	.bo-home-hero__moulding { inset: 12px; border-radius: 10px; }

	.bo-home-treatments__grid { grid-template-columns: minmax(0, 1fr); }

	.bo-home-fees__plan { width: 100%; margin-top: 20px; }
	.bo-section .bo-home-statement__heading br { display: none; }
	.bo-home-fees__plan-amount { font-size: 72px; }
	.bo-home-fees__fee { padding: 28px; }

	.bo-home-people__person { flex-direction: column-reverse; align-items: flex-start; padding: 28px; }
	.bo-section .bo-home-people__portrait { flex: none; width: 200px; }
	.bo-home-people__foh-copy { padding: 28px; }

	.bo-home-bright__stats { gap: 24px 32px; }

	.bo-home-visit__row { flex-direction: column; align-items: stretch; }
	.bo-home-visit__photo { flex: none; width: 100%; min-height: 0; aspect-ratio: 4 / 5; max-height: 560px; }
	.bo-home-visit__details,
	.bo-home-visit__panel { flex: none; width: 100%; }
	.bo-home-visit__panel { padding: 28px 22px; }
}

/* The overlay carries the success message on screen; keep the inline
   status for screen readers only. Errors stay visible. */
.bo-section .bo-home-visit__form .vk-form-message.is-success {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* -------------------------------------------------------------------------
 * Responsive fixes
 * ---------------------------------------------------------------------- */

/* The velvet photo keeps Figma's zoomed crop only while the section keeps the
   design's proportions; between phone and desktop it covers instead, so it
   never stretches. */
@media (min-width: 768px) and (max-width: 1599px) {
	.bo-home-fees__bg:not(.is-custom) > img {
		inset: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: 24% 77%;
	}
}

/* Comfortable tap target for the phone link in the details list */
@media (max-width: 1023px) {
	.bo-home-visit a[href^="tel:"] {
		display: inline-block;
		padding-block: 10px;
		margin-block: -10px;
	}
}

/* Tablet: the Denplan card overlaps only the fee card's padding, never its last row. */
@media (min-width: 768px) and (max-width: 1023px) {
	.bo-home-fees__plan { margin-top: -6px; }
}

/* Smallest phones: the Denplan price and "a month" fit side by side. */
@media (max-width: 379px) {
	.bo-home-fees__plan-amount { font-size: 60px; }
	.bo-section .bo-home-fees__plan-price { flex-wrap: wrap; }
}
