/* =========================================================================
 * The Suite and Book a visit
 *   .bo-suite-hero  — Hero: The Suite          (Figma 2858:1642 / 2858:1640)
 *   .bo-suite-floor — Around the floor          (Figma 2841:472)
 *   .bo-book        — Book a visit              (Figma 2858:1943 / 2858:1941)
 * ====================================================================== */

/* -------------------------------------------------------------------------
 * Hero: The Suite
 * Velvet band to half-way down the photograph, ivory beneath it.
 * ---------------------------------------------------------------------- */

.bo-suite-hero {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	padding-top: calc(var(--bo-header-h) + max(24px, calc(50 * var(--bo-s))));
	padding-bottom: max(24px, calc(40 * var(--bo-s)));
}

.bo-suite-hero .bo-suite-hero__title-row {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 40px;
	color: var(--ps-ivory);
}

/* PS/Display XL — 216/212, -2% */
.bo-suite-hero .bo-suite-hero__title {
	color: var(--ps-ivory);
	font-family: var(--bo-font-display);
	font-weight: 400;
	font-size: max(64px, calc(216 * var(--bo-s)));
	line-height: 0.9815;
	letter-spacing: -0.02em;
	white-space: nowrap;
}

.bo-suite-hero .bo-suite-hero__intro {
	flex-shrink: 0;
	width: max(320px, calc(620 * var(--bo-s)));
	color: var(--ps-ivory);
}

.bo-suite-hero .bo-suite-hero__media {
	position: relative;
	margin-top: max(24px, calc(38 * var(--bo-s)));
	aspect-ratio: 1624 / 860;
}

/* The ivory half: from 440/860 of the photograph down to the section edge */
.bo-suite-hero .bo-suite-hero__media::before {
	content: '';
	position: absolute;
	z-index: -1;
	top: 51.163%;
	right: -100vw;
	bottom: calc(-1 * max(24px, calc(40 * var(--bo-s))) - 1px);
	left: -100vw;
	background: var(--ps-ivory);
}

.bo-suite-hero .bo-suite-hero__media img {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: var(--bo-radius-media);
	object-fit: cover;
	object-position: 50% 74.4%;
}

@media (max-width: 1023px) {
	.bo-suite-hero .bo-suite-hero__title-row {
		flex-direction: column;
		align-items: flex-start;
		gap: 20px;
	}
	.bo-suite-hero .bo-suite-hero__intro { width: auto; max-width: 620px; }
}

@media (max-width: 767px) {
	.bo-suite-hero .bo-suite-hero__media { aspect-ratio: 4 / 3; }
	.bo-suite-hero .bo-suite-hero__media img { border-radius: var(--bo-radius-card); }
}

/* -------------------------------------------------------------------------
 * Around the floor
 * ---------------------------------------------------------------------- */

.bo-suite-floor {
	padding-top: max(40px, calc(60 * var(--bo-s)));
	padding-bottom: max(64px, calc(120 * var(--bo-s)));
}

.bo-suite-floor .bo-suite-floor__rooms {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: max(16px, calc(32 * var(--bo-s)));
	align-items: start;
}

.bo-suite-floor .bo-suite-floor__room {
	display: flex;
	flex-direction: column;
	gap: 20px;
	min-width: 0;
	margin: 0;
}

.bo-suite-floor .bo-suite-floor__photo {
	aspect-ratio: 520 / 720;
	overflow: hidden;
	border-radius: var(--bo-radius-panel);
}

.bo-suite-floor .bo-suite-floor__photo img,
.bo-suite-floor .bo-suite-floor__square img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.bo-suite-floor .bo-suite-floor__caption {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.bo-suite-floor .bo-suite-floor__title {
	color: var(--ps-ink);
	white-space: nowrap;
}

.bo-suite-floor .bo-suite-floor__text {
	color: var(--ps-ink-muted);
}

.bo-suite-floor .bo-suite-floor__details {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: max(16px, calc(32 * var(--bo-s)));
	align-items: center;
	margin-top: max(40px, calc(64 * var(--bo-s)));
}

.bo-suite-floor .bo-suite-floor__square {
	aspect-ratio: 1;
	overflow: hidden;
	border-radius: var(--bo-radius-panel);
}

.bo-suite-floor .bo-suite-floor__square--left img { object-position: 50% 0%; }

.bo-suite-floor .bo-suite-floor__copy {
	display: flex;
	flex-direction: column;
	gap: 24px;
	padding-inline: max(0px, calc(48 * var(--bo-s)));
}

.bo-suite-floor .bo-suite-floor__heading {
	color: var(--ps-ink);
}

.bo-suite-floor .bo-suite-floor__lede {
	color: var(--ps-ink-muted);
}

@media (max-width: 1023px) {
	.bo-suite-floor .bo-suite-floor__title { white-space: normal; }
	.bo-suite-floor .bo-suite-floor__details { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.bo-suite-floor .bo-suite-floor__copy {
		grid-column: 1 / -1;
		order: -1;
		padding-inline: 0;
		max-width: 620px;
	}
}

@media (max-width: 767px) {
	.bo-suite-floor .bo-suite-floor__rooms { grid-template-columns: 1fr; gap: 40px; }
	.bo-suite-floor .bo-suite-floor__room,
	.bo-suite-floor .bo-suite-floor__caption { gap: 12px; }
	.bo-suite-floor .bo-suite-floor__photo { aspect-ratio: 4 / 5; }
}

/* -------------------------------------------------------------------------
 * Book a visit
 * Form column (800) | 112 | photograph (712 × 890), all on velvet.
 * Spacing follows the Figma column: 18px gaps, with the 10px and 8px
 * spacer frames added before the chips, the fields and the actions.
 * ---------------------------------------------------------------------- */

.bo-book {
	padding-top: calc(var(--bo-header-h) + max(24px, calc(50 * var(--bo-s))));
	padding-bottom: max(64px, calc(100 * var(--bo-s)));
	overflow: hidden;
}

.bo-book .bo-book__grid {
	display: grid;
	grid-template-columns: minmax(0, 800fr) minmax(0, 712fr);
	column-gap: max(40px, calc(112 * var(--bo-s)));
	align-items: start;
}

.bo-book .bo-book__main {
	display: flex;
	flex-direction: column;
	gap: 18px;
	min-width: 0;
}

.bo-book .bo-book__title {
	color: var(--ps-ivory);
	white-space: nowrap;
}

.bo-book .bo-book__intro {
	max-width: 760px;
	color: var(--ps-on-dark-muted);
}

.bo-book .bo-book__form {
	display: flex;
	flex-direction: column;
	gap: 18px;
	margin-top: 28px;
}

.bo-book .bo-book__reasons {
	min-width: 0;
	margin: 0;
	padding: 0;
	border: 0;
}

.bo-book .bo-book__label {
	float: left;
	width: 100%;
	margin: 0 0 18px;
	padding: 0;
	color: var(--ps-brass-light);
}

.bo-book .bo-book__chips {
	clear: both;
	gap: 10px;
}

/* Editor preview of the default (first) reason */
.bo-book .bo-chip .bo-book__chip-on {
	background: var(--ps-brass-light);
	border-color: var(--ps-brass-light);
	color: var(--ps-velvet);
}

.bo-book .bo-book__fields {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px 16px;
	margin-top: 26px;
}

.bo-book .bo-book__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px 24px;
	margin-top: 26px;
}

.bo-book .bo-book__call {
	color: var(--ps-ivory);
	white-space: nowrap;
	transition: color var(--bo-hover) var(--bo-ease);
}

.bo-book .bo-book__call:hover { color: var(--ps-brass-light); }

.bo-book .bo-book__privacy {
	align-self: flex-start;
	color: var(--ps-on-dark-muted);
	transition: color var(--bo-hover) var(--bo-ease);
}

.bo-book .bo-book__privacy:hover { color: var(--ps-ivory); }

.bo-book .bo-book__message:empty { display: none; }
.bo-book .bo-book__message.is-error { color: var(--ps-blush); }

/* Success is shown by the "Request received" overlay; the inline message
   stays for screen readers only. */
.bo-book .bo-book__message.is-success {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

.bo-book .bo-book__details {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px 64px;
	margin: 0;
	padding-top: 28px;
	border-top: 1px solid var(--ps-line-dark);
}

.bo-book .bo-book__detail {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.bo-book .bo-book__detail-label { color: var(--ps-on-dark-muted); }
.bo-book .bo-book__detail-value { margin: 0; color: var(--ps-ivory); }

.bo-book .bo-book__media {
	aspect-ratio: 712 / 890;
	overflow: hidden;
	border-radius: var(--bo-radius-media);
}

.bo-book .bo-book__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 17.1% 50%;
}

@media (max-width: 1023px) {
	.bo-book .bo-book__grid { grid-template-columns: 1fr; row-gap: 56px; }
	.bo-book .bo-book__media { aspect-ratio: 4 / 3; }
	.bo-book .bo-book__media img { object-position: 30% 60%; }
}

@media (max-width: 767px) {
	.bo-book .bo-book__title { white-space: normal; }
	.bo-book .bo-book__fields,
	.bo-book .bo-book__details { grid-template-columns: 1fr; }
	.bo-book .bo-book__media { aspect-ratio: 4 / 5; border-radius: var(--bo-radius-card); }
}

/* Comfortable tap target for "or call" on touch screens */
@media (max-width: 1023px) {
	.bo-section .bo-book__call {
		display: inline-block;
		padding-block: 8px;
		margin-block: -8px;
	}
}