/**
 * Accommodation frontend styling. Entirely namespaced under
 * .spw-accommodation* — deliberately never reuses .spw-journey,
 * .spw-package-journey, or any other Tour-locked class. Tour's CSS
 * locks (Soweto golden reference, package separation) remain fully
 * untouched by this file's existence.
 *
 * Loaded ONLY when actually needed (see the enqueue guard in the main
 * plugin file) — never on every page.
 */

.spw-accommodation {
	--spw-acc-container: min(1280px, 100% - 2 * 24px);
	max-width: var(--spw-acc-container);
	margin: 0 auto;
	font-family: inherit;
	color: var(--spw-color-text, #1a1a1a);
}

/* STAGING DEFECT FIX (v0.8.3): spw_tour_icon() outputs an <svg> with a
   viewBox but no width/height attribute — sizing is 100% CSS-driven.
   Tour's CSS supplies this via ".spw-tour .spw-icon" (tour.css), but
   an Accommodation page's root wrapper is ".spw-accommodation", never
   ".spw-tour", so that rule never applied here — every icon rendered
   at the browser's unconstrained default SVG size (very large) instead
   of the intended small inline glyph. This was never about missing
   IMAGES at all; every spw_tour_icon() call on this page (button CTA
   arrows, the FAQ accordion chevron) was affected identically. Base
   size matches Tour's exact values for site-wide visual consistency;
   Tour's own CSS file is completely untouched by this fix. */
.spw-accommodation .spw-icon {
	width: 20px;
	height: 20px;
	flex-shrink: 0;
}

/* .spw-btn had NO Accommodation-scoped styling at all (only Tour's
   ".spw-tour .spw-btn" existed, same scoping problem as above) — a
   button rendered as a bare unstyled link with an oversized icon next
   to it. Values match Tour's button styling exactly for consistency;
   this is the minimal styling needed for "the arrow renders at normal
   size inside its actual button" to be true in practice, not just
   technically correct in isolation. */
.spw-accommodation .spw-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	font-family: inherit;
	font-size: 0.95rem;
	font-weight: 600;
	padding: 1.05rem 1.75rem;
	border-radius: var(--spw-radius, 10px);
	border: 1px solid transparent;
	cursor: pointer;
	text-decoration: none;
	transition: opacity 0.15s ease;
}

.spw-accommodation .spw-btn:hover {
	opacity: 0.88;
}

.spw-accommodation .spw-btn--primary {
	background: var(--spw-color-accent, #1a1a1a);
	color: var(--spw-color-bg, #fff);
}

.spw-accommodation .spw-btn--on-dark {
	background: var(--spw-color-bg, #fff);
	color: var(--spw-color-dark, #1a1a1a);
}

.spw-accommodation .spw-btn .spw-icon {
	width: 18px;
	height: 18px;
}

.spw-accommodation-hero {
	position: relative;
	min-height: 60vh;
	border-radius: 12px;
	overflow: visible;
	margin: 2rem auto;
	display: flex;
	align-items: flex-end;
}

.spw-accommodation-hero__media {
	position: absolute;
	inset: 0;
	border-radius: 12px;
	overflow: hidden;
	background: var(--spw-color-dark, #1a1a1a);
}

.spw-accommodation-hero__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.spw-accommodation-hero__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(0deg, rgba(20, 18, 10, 0.72) 0%, rgba(20, 18, 10, 0.15) 55%, rgba(20, 18, 10, 0) 100%);
}

.spw-accommodation-hero--no-image .spw-accommodation-hero__overlay {
	background: none;
}

.spw-accommodation-hero__content {
	position: relative;
	z-index: 1;
	padding: 3rem clamp(1.5rem, 4vw, 3.5rem);
	color: #fff;
	max-width: 44rem;
}

.spw-accommodation-hero__heading {
	font-size: clamp(1.8rem, 1.4rem + 2vw, 3rem);
	margin: 0.35rem 0;
	font-weight: 600;
}

.spw-accommodation-hero__location {
	font-size: 0.95rem;
	opacity: 0.85;
	margin: 0 0 0.5rem;
}

.spw-accommodation-hero__descriptor {
	font-size: 1.05rem;
	line-height: 1.5;
	margin: 0 0 1.5rem;
	max-width: 38rem;
}

/* At a glance */
.spw-accommodation-glance__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	gap: 1.5rem;
	padding: 2rem 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.spw-accommodation-glance__item {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}

.spw-accommodation-glance__label {
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	opacity: 0.6;
}

.spw-accommodation-glance__value {
	font-size: 1rem;
	font-weight: 600;
}

/* Section rhythm (v0.9.0: tightened from clamp(2.5rem, 4vw, 4rem) —
   deliberate, evenly-spaced sections separated by a hairline rather
   than large generic gaps; boxed panels (enquiry, transfer) keep their
   own spacing and carry no hairline). Section content and order are
   unchanged. */
.spw-accommodation .spw-section {
	padding: clamp(1.75rem, 3vw, 2.75rem) 0;
}

.spw-accommodation .spw-section:not(.spw-accommodation-good) + .spw-section:not(.spw-accommodation-enquire):not(.spw-accommodation-transfer):not(.spw-accommodation-good) {
	border-top: 1px solid rgba(0, 0, 0, 0.07);
}

.spw-accommodation .spw-section > .spw-heading:first-child {
	margin-top: 0;
}

/* Units / rooms */
.spw-accommodation-units__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 1.5rem;
}

.spw-accommodation-unit-card {
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 10px;
	overflow: hidden;
}

.spw-accommodation-unit-card__image img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.spw-accommodation-unit-card__title,
.spw-accommodation-unit-card__occupancy,
.spw-accommodation-unit-card__features,
.spw-accommodation-unit-card__note {
	padding: 0 1rem;
}

.spw-accommodation-unit-card__title {
	margin: 1rem 0 0.35rem;
	font-size: 1.1rem;
	font-weight: 600;
}

.spw-accommodation-unit-card__occupancy,
.spw-accommodation-unit-card__features {
	font-size: 0.85rem;
	opacity: 0.75;
	margin: 0 0 0.35rem;
}

.spw-accommodation-unit-card__note {
	font-size: 0.85rem;
	font-style: italic;
	margin: 0 0 1rem;
}

/* Experiences */
.spw-accommodation-experience-row {
	padding: 1.25rem 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.spw-accommodation-experience-row__title {
	font-size: 1.05rem;
	margin: 0 0 0.35rem;
}

.spw-accommodation-experience-row__desc {
	margin: 0 0 0.4rem;
	opacity: 0.85;
}

.spw-accommodation-experience-row__meta {
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	opacity: 0.55;
	margin: 0 0 0.3rem;
}

/* Facilities */
.spw-accommodation-facilities__list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 0.75rem 1.5rem;
	list-style: none;
	padding: 0;
	margin: 0;
}

/* Power & Connectivity */
.spw-accommodation-power__list {
	list-style: none;
	padding: 0;
	margin: 0 0 1rem;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 0.5rem 1.5rem;
}

.spw-accommodation-power__list li {
	padding: 0.3rem 0;
	font-size: 0.95rem;
}

.spw-accommodation-power__list li::before {
	content: "—";
	margin-right: 0.5rem;
	opacity: 0.4;
}

/* Access list */
.spw-accommodation-access__list {
	list-style: none;
	padding: 0;
	margin: 0 0 1rem;
}

.spw-accommodation-access__list li {
	padding: 0.4rem 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.spw-accommodation-notice {
	font-size: 0.85rem;
	font-style: italic;
	opacity: 0.7;
}

/* FAQ accordion (v0.8.7). Native <details>/<summary> rows styled as
   full-width editorial rows: hairline dividers, generous vertical
   rhythm, question typography one step above body copy, a chevron
   aligned right that rotates when open, and a visible focus ring in
   the olive accent. Scoped under .spw-accommodation only — the Tour
   FAQ keeps its own ".spw-tour .spw-accordion" rules in tour.css. */
.spw-accommodation .spw-accordion {
	--spw-acc-rule: rgba(0, 0, 0, 0.12);
	--spw-acc-olive: var(--spw-color-accent-olive, #6f7b45);
	border-top: 1px solid var(--spw-acc-rule);
}

.spw-accommodation .spw-accordion__item {
	border-bottom: 1px solid var(--spw-acc-rule);
	margin: 0;
	padding: 0;
	background: transparent;
}

.spw-accommodation .spw-accordion__trigger {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	width: 100%;
	padding: 1.35rem 0;
	margin: 0;
	list-style: none;
	cursor: pointer;
	font-family: inherit;
	font-size: 1.1rem;
	font-weight: 600;
	line-height: 1.35;
	color: var(--spw-color-text, #1a1a1a);
	background: transparent;
	border: 0;
	text-align: left;
	transition: color 0.15s ease;
}

.spw-accommodation .spw-accordion__trigger::-webkit-details-marker,
.spw-accommodation .spw-accordion__trigger::marker {
	display: none;
	content: "";
}

.spw-accommodation .spw-accordion__trigger:hover {
	color: var(--spw-acc-olive);
}

.spw-accommodation .spw-accordion__trigger:focus {
	outline: none;
}

.spw-accommodation .spw-accordion__trigger:focus-visible {
	outline: 2px solid var(--spw-acc-olive);
	outline-offset: 4px;
	border-radius: 2px;
}

.spw-accommodation .spw-accordion__question {
	flex: 1 1 auto;
}

.spw-accommodation .spw-accordion__trigger .spw-icon {
	width: 18px;
	height: 18px;
	flex-shrink: 0;
	opacity: 0.6;
	transition: transform 0.2s ease, opacity 0.15s ease;
}

.spw-accommodation .spw-accordion__item[open] > .spw-accordion__trigger .spw-icon {
	transform: rotate(180deg);
	opacity: 1;
	color: var(--spw-acc-olive);
}

.spw-accommodation .spw-accordion__panel {
	padding: 0 0 1.6rem;
	max-width: 44rem;
}

.spw-accommodation .spw-accordion__panel p {
	margin: 0;
	font-size: 1rem;
	line-height: 1.65;
	color: var(--spw-color-text, #1a1a1a);
	opacity: 0.85;
}

@media (max-width: 640px) {
	.spw-accommodation .spw-accordion__trigger {
		padding: 1.1rem 0;
		font-size: 1rem;
		gap: 1rem;
	}
	.spw-accommodation .spw-accordion__panel {
		padding-bottom: 1.25rem;
	}
}

/* Gallery */
.spw-accommodation-gallery__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 0.75rem;
}

.spw-accommodation-gallery__grid img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 8px;
}

/* Enquiry panel */
.spw-accommodation-enquire {
	text-align: center;
	background: var(--spw-color-bg-alt, #f7f6f3);
	border-radius: 12px;
	padding: clamp(2.5rem, 4vw, 4rem) 2rem;
}

.spw-accommodation-enquire__price {
	font-size: 1.4rem;
	font-weight: 600;
	margin: 0 0 0.75rem;
}

/* Enquiry-panel CTA only: the lower "Request This Stay" button inside the
   light panel uses the Spurwing olive conversion colour (same token and
   fallback as the FAQ accent). The hero CTA (.spw-btn--on-dark) and every
   other button are untouched; sizing, radius and wording are inherited
   unchanged from .spw-accommodation .spw-btn above. Hover darkens the
   olive slightly via brightness instead of the inherited opacity fade
   (which would wash the olive out against the light panel). */
.spw-accommodation .spw-accommodation-enquire .spw-btn--primary {
	background: var(--spw-color-accent-olive, #6f7b45);
	color: #fff;
	transition: opacity 0.15s ease, filter 0.15s ease;
}

.spw-accommodation .spw-accommodation-enquire .spw-btn--primary:hover {
	opacity: 1;
	filter: brightness(0.9);
}

.spw-accommodation .spw-accommodation-enquire .spw-btn--primary:focus-visible {
	outline: 2px solid var(--spw-color-accent-olive, #6f7b45);
	outline-offset: 3px;
}

/* Related / featuring-tours cards */
.spw-accommodation-related__list,
.spw-accommodation-featuring-tours__list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 1.25rem;
}

.spw-accommodation-related__card,
.spw-accommodation-featuring-tours__card {
	display: block;
	text-decoration: none;
	color: inherit;
	border-radius: 10px;
	overflow: hidden;
	border: 1px solid rgba(0, 0, 0, 0.08);
}

.spw-accommodation-related__card img,
.spw-accommodation-featuring-tours__card img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.spw-accommodation-related__title,
.spw-accommodation-featuring-tours__card span {
	display: block;
	padding: 0.75rem 1rem 0.25rem;
	font-weight: 600;
}

.spw-accommodation-related__desc {
	display: block;
	padding: 0 1rem 1rem;
	font-size: 0.85rem;
	opacity: 0.75;
}

/* Grid / card component (used by spw/accommodation-grid on editorial Pages) */
.spw-accommodation-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 1.5rem;
}

.spw-accommodation-card {
	display: block;
	text-decoration: none;
	color: inherit;
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 10px;
	overflow: hidden;
	transition: box-shadow 0.15s ease;
}

.spw-accommodation-card:hover {
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
}

.spw-accommodation-card__image img {
	width: 100%;
	height: auto; /* 0.10.1: the responsive rendition carries width/height attributes; auto lets aspect-ratio own the box */
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.spw-accommodation-card__body {
	padding: 1rem;
}

.spw-accommodation-card__location {
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	opacity: 0.55;
	margin: 0 0 0.25rem;
}

.spw-accommodation-card__title {
	font-size: 1.05rem;
	font-weight: 600;
	margin: 0 0 0.25rem;
}

.spw-accommodation-card__type,
.spw-accommodation-card__descriptor,
.spw-accommodation-card__labels {
	font-size: 0.85rem;
	opacity: 0.75;
	margin: 0 0 0.4rem;
}

.spw-accommodation-card__price {
	font-weight: 600;
	margin: 0.5rem 0 0.75rem;
}

@media (max-width: 640px) {
	.spw-accommodation-hero {
		min-height: 44vh;
	}
	.spw-accommodation-units__grid,
	.spw-accommodation-gallery__grid,
	.spw-accommodation-grid {
		grid-template-columns: 1fr;
	}
}

/* ==========================================================================
   v0.9.0 — frontend consolidation (from the retired Premium UI prototype)
   Everything below is scoped under .spw-accommodation* or the plugin's own
   <dialog class="spw-accommodation-lightbox">. No !important, no element
   selectors outside that scope, no Tour selectors.
   ========================================================================== */

/* Eyebrow: the hero eyebrow was only ever styled under .spw-tour, so it
   rendered as a plain paragraph here. Same values as Tour's for
   consistency; Tour's CSS is untouched. */
.spw-accommodation .spw-eyebrow {
	font-size: 0.8rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	font-weight: 600;
	margin: 0 0 0.75rem;
}

.spw-accommodation .spw-eyebrow--on-dark {
	color: #fff;
	opacity: 0.85;
}

/* Lightbox triggers: the link wrapping a hero/gallery image. Layout is
   entirely inherited from the image it wraps. */
.spw-accommodation .spw-accommodation-lightbox__trigger {
	display: block;
	cursor: zoom-in;
	color: inherit;
	text-decoration: none;
	border-radius: inherit;
}

.spw-accommodation .spw-accommodation-lightbox__trigger:focus-visible {
	outline: 3px solid var(--spw-color-accent-olive, #6f7b45);
	outline-offset: 3px;
}

.spw-accommodation .spw-accommodation-lightbox__trigger img {
	display: block;
}

/* The hero trigger fills the media box exactly as the bare <img> did;
   the gradient overlay must not swallow clicks. */
.spw-accommodation-hero__trigger {
	position: absolute;
	inset: 0;
}

.spw-accommodation-hero__overlay {
	pointer-events: none;
}

/* v0.9.2: the hero content box (position: relative; z-index: 1) sits
   above the trigger, so on a real page the empty space around the
   heading, descriptor and CTA swallowed clicks meant for the photo.
   The box itself passes pointer events through; its children (text,
   the Request This Stay button) keep them, so text stays selectable
   and the CTA stays clickable. */
.spw-accommodation-hero__content {
	pointer-events: none;
}

.spw-accommodation-hero__content > * {
	pointer-events: auto;
}

.spw-accommodation-gallery__item img {
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 8px;
}

.spw-accommodation-gallery__item {
	border-radius: 8px;
}

/* Private road-transfer panel (South African records only; rendered
   server-side when eligible — see includes/accommodation/transfer-cta.php). */
.spw-accommodation-transfer__panel {
	background: var(--spw-color-dark, #1a1a1a);
	color: #fff;
	border-radius: 12px;
	padding: clamp(2rem, 4vw, 3.25rem) clamp(1.5rem, 4vw, 3.25rem);
}

.spw-accommodation-transfer__layout {
	display: grid;
	grid-template-columns: minmax(0, 1.6fr) minmax(200px, 0.6fr);
	gap: clamp(1.5rem, 4vw, 4rem);
	align-items: end;
}

.spw-accommodation-transfer__heading {
	color: #fff;
	margin: 0 0 1rem;
	max-width: 24ch;
}

.spw-accommodation-transfer__copy .spw-body {
	color: rgba(255, 255, 255, 0.88);
	max-width: 60ch;
}

.spw-accommodation-transfer__note {
	font-size: 0.875rem;
	line-height: 1.5;
	color: rgba(255, 255, 255, 0.66);
	max-width: 60ch;
	margin: 0.75rem 0 0;
}

.spw-accommodation-transfer__action {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.75rem;
}

.spw-accommodation-transfer__label {
	font-size: 0.7rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.6);
}

/* Lightbox dialog. Native <dialog> gives focus trapping, an inert page
   and ESC for free; these rules only lay it out. */
body.spw-accommodation-lightbox-open {
	overflow: hidden;
}

.spw-accommodation-lightbox {
	width: 100vw;
	max-width: 100vw;
	height: 100dvh;
	max-height: 100dvh;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: #fff;
	overflow: hidden;
}

.spw-accommodation-lightbox::backdrop {
	background: rgba(15, 15, 13, 0.94);
}

.spw-accommodation-lightbox__stage {
	position: relative;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 4.5rem clamp(3.5rem, 8vw, 6rem);
	box-sizing: border-box;
}

.spw-accommodation-lightbox__figure {
	margin: 0;
	max-width: 100%;
	max-height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.75rem;
	min-height: 0;
}

.spw-accommodation-lightbox__image {
	display: block;
	max-width: 100%;
	max-height: calc(100dvh - 9rem - 2.5rem);
	width: auto;
	height: auto;
	object-fit: contain;
	box-shadow: 0 22px 70px rgba(0, 0, 0, 0.34);
	animation: spw-accommodation-lightbox-fade 0.18s ease;
}

.spw-accommodation-lightbox__caption {
	font-size: 0.875rem;
	line-height: 1.45;
	color: rgba(255, 255, 255, 0.85);
	text-align: center;
	max-width: 70ch;
}

.spw-accommodation-lightbox__counter {
	display: inline-block;
	margin-left: 0.6rem;
	color: rgba(255, 255, 255, 0.6);
}

.spw-accommodation-lightbox__caption-text:empty + .spw-accommodation-lightbox__counter {
	margin-left: 0;
}

.spw-accommodation-lightbox__close,
.spw-accommodation-lightbox__prev,
.spw-accommodation-lightbox__next {
	position: absolute;
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.12);
	color: #fff;
	cursor: pointer;
	padding: 0;
	transition: background 0.15s ease;
}

.spw-accommodation-lightbox__close svg,
.spw-accommodation-lightbox__prev svg,
.spw-accommodation-lightbox__next svg {
	width: 22px;
	height: 22px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.spw-accommodation-lightbox__close:hover,
.spw-accommodation-lightbox__prev:hover,
.spw-accommodation-lightbox__next:hover {
	background: rgba(255, 255, 255, 0.24);
}

.spw-accommodation-lightbox__close:focus-visible,
.spw-accommodation-lightbox__prev:focus-visible,
.spw-accommodation-lightbox__next:focus-visible {
	outline: 3px solid #fff;
	outline-offset: 3px;
}

.spw-accommodation-lightbox__close {
	top: 1rem;
	right: 1rem;
}

.spw-accommodation-lightbox__prev,
.spw-accommodation-lightbox__next {
	top: 50%;
	transform: translateY(-50%);
	height: 64px;
	border-radius: 8px;
}

.spw-accommodation-lightbox__prev {
	left: 1rem;
}

.spw-accommodation-lightbox__next {
	right: 1rem;
}

/* One-image gallery: the script sets the hidden attribute on the
   navigation and counter, but the display rules above outrank the UA
   stylesheet's [hidden] { display: none } — so on a real page (seen on
   staging) a single-image lightbox still showed both arrows. The
   attribute must win. */
.spw-accommodation-lightbox__prev[hidden],
.spw-accommodation-lightbox__next[hidden],
.spw-accommodation-lightbox__counter[hidden] {
	display: none;
}

@keyframes spw-accommodation-lightbox-fade {
	from { opacity: 0; }
	to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
	.spw-accommodation-lightbox__image,
	.spw-accommodation .spw-accommodation-lightbox__trigger,
	.spw-accommodation-lightbox__close,
	.spw-accommodation-lightbox__prev,
	.spw-accommodation-lightbox__next {
		animation: none;
		transition: none;
	}
}

@media (max-width: 640px) {
	.spw-accommodation-transfer__layout {
		grid-template-columns: 1fr;
	}
	.spw-accommodation-lightbox__stage {
		padding: 4rem 0.75rem 5.5rem;
	}
	.spw-accommodation-lightbox__image {
		max-height: calc(100dvh - 9.5rem - 2.5rem);
	}
	.spw-accommodation-lightbox__prev,
	.spw-accommodation-lightbox__next {
		top: auto;
		bottom: 1rem;
		transform: none;
		height: 48px;
		border-radius: 50%;
	}
}

/* ==========================================================================
   v0.9.4 — premium rhythm pass (R1m finish sprint). Same section order,
   same markup, same lightbox. Only tone and rhythm: one border tone
   (stone #D8D3C8) instead of translucent black, radii harmonised with the
   site system (hero 6px, cards 4px, no 10/12px), a stronger hero gradient so
   the title stays legible on bright photography (mobile especially), eyebrow
   tracking aligned with the editorial eyebrows, and restrained hover states
   (border tone, no floating shadow). No !important, all under
   .spw-accommodation* / the lightbox dialog.
   ========================================================================== */
.spw-accommodation-hero,
.spw-accommodation-hero__media,
.spw-accommodation-hero__trigger {
	border-radius: 6px;
}
.spw-accommodation-hero__overlay {
	background: linear-gradient(0deg, rgba(20, 18, 10, 0.82) 0%, rgba(20, 18, 10, 0.5) 38%, rgba(20, 18, 10, 0.12) 70%, rgba(20, 18, 10, 0) 100%);
}
.spw-accommodation-hero__heading {
	letter-spacing: -0.02em;
	line-height: 1.08;
	text-wrap: balance;
}
.spw-accommodation-hero__location {
	opacity: 0.92;
}
.spw-accommodation-glance__grid,
.spw-accommodation .spw-section:not(.spw-accommodation-good) + .spw-section:not(.spw-accommodation-enquire):not(.spw-accommodation-transfer):not(.spw-accommodation-good) {
	border-color: #D8D3C8;
}
.spw-accommodation-glance__label {
	letter-spacing: 0.12em;
	font-weight: 600;
	opacity: 0.7;
}
.spw-accommodation-unit-card,
.spw-accommodation-card,
.spw-accommodation-enquire,
.spw-accommodation-transfer {
	border-radius: 4px;
}
.spw-accommodation-unit-card,
.spw-accommodation-card {
	border-color: #D8D3C8;
	transition: border-color 0.15s ease;
}
.spw-accommodation-card:hover {
	box-shadow: none;
	border-color: #8F8B7E;
}
.spw-accommodation-gallery__item,
.spw-accommodation-gallery__item img {
	border-radius: 4px;
}
@media (max-width: 640px) {
	.spw-accommodation-hero {
		min-height: 52vh;
		border-radius: 4px;
	}
	.spw-accommodation-hero__media,
	.spw-accommodation-hero__trigger {
		border-radius: 4px;
	}
	.spw-accommodation-hero__content {
		padding: 2rem 1.25rem 1.5rem;
	}
}
@media (prefers-reduced-motion: reduce) {
	.spw-accommodation-card,
	.spw-accommodation-unit-card {
		transition: none;
	}
}

/* ==========================================================================
   v0.9.5 — typography + hierarchy polish (single template only).
   One secondary editorial voice: Instrument Serif Italic, locally hosted by
   the WordPress Font Library (uploads/fonts/), used for the property-story
   title alone. Every other heading stays in the site sans. Section weight now
   follows content depth: chapter headings are smaller, sparse sections carry a
   small label (h2 semantics unchanged), practical facts share one
   "Good to know" chapter. No !important; everything under .spw-accommodation.
   ========================================================================== */
.spw-accommodation {
	--spw-acc-serif: "Instrument Serif", Georgia, "Times New Roman", serif;
	--spw-acc-ink: #1F1F1B;
	--spw-acc-muted: #6B6B62;
	--spw-acc-gold: #A98A4B;
}
/* Chapter heading: reduced from the theme h2 so a heading no longer outweighs
   its content. Used by Request This Stay, Similar Places, FAQ, Journeys and
   any practical area rich enough to be its own chapter. */
.spw-accommodation .spw-heading {
	font-family: Manrope, sans-serif;
	font-size: clamp(1.5rem, 2.2vw, 2rem);
	line-height: 1.15;
	letter-spacing: -0.02em;
	font-weight: 500;
	color: var(--spw-acc-ink);
	margin: 0 0 1rem;
	text-wrap: balance;
}
/* Label: a sparse section's heading (Gallery, Rooms & Suites, Safari &
   Experiences, Facilities, Good to know …). Still an h2 for assistive tech. */
.spw-accommodation .spw-heading--label {
	font-family: Inter, sans-serif;
	font-size: 0.75rem;
	line-height: 1.3;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--spw-acc-muted);
	margin: 0 0 1.25rem;
}
/* The property story — the one serif moment on the page. */
.spw-accommodation .spw-accommodation-story__eyebrow {
	color: var(--spw-acc-gold);
	margin-bottom: 1rem;
}
.spw-accommodation .spw-heading--story {
	font-family: var(--spw-acc-serif);
	font-style: italic;
	font-weight: 400;
	font-size: clamp(2.1rem, 3.6vw, 3.25rem);
	line-height: 1.08;
	letter-spacing: -0.005em;
	max-width: 22ch;
	margin: 0 0 1.25rem;
	color: var(--spw-acc-ink);
}
.spw-accommodation .spw-accommodation-story__copy {
	max-width: 62ch;
	font-size: 1.0625rem;
	line-height: 1.7;
}
.spw-accommodation .spw-heading--sub {
	font-family: Manrope, sans-serif;
	font-size: 1.15rem;
	font-weight: 600;
	letter-spacing: -0.01em;
	margin: 1.75rem 0 0.5rem;
}
.spw-accommodation .spw-accommodation-story {
	padding-top: clamp(2.25rem, 4vw, 3.5rem);
	padding-bottom: clamp(2.25rem, 4vw, 3.5rem);
}
/* Rooms & suites — compact: open rows, no boxes. */
.spw-accommodation-units__rows {
	border-top: 1px solid #D8D3C8;
}
.spw-accommodation-unit-card--row {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.25rem 1.5rem;
	border: 0;
	border-bottom: 1px solid #D8D3C8;
	border-radius: 0;
	padding: 0.9rem 0;
}
.spw-accommodation-unit-card--row .spw-accommodation-unit-card__title,
.spw-accommodation-unit-card--row .spw-accommodation-unit-card__occupancy,
.spw-accommodation-unit-card--row .spw-accommodation-unit-card__features,
.spw-accommodation-unit-card--row .spw-accommodation-unit-card__note {
	padding: 0;
	margin: 0;
}
.spw-accommodation-unit-card--row .spw-accommodation-unit-card__title {
	font-family: Manrope, sans-serif;
	font-size: 1.05rem;
	font-weight: 600;
	min-width: 14rem;
}
.spw-accommodation-unit-card--row .spw-accommodation-unit-card__occupancy,
.spw-accommodation-unit-card--row .spw-accommodation-unit-card__features {
	font-size: 0.9rem;
	opacity: 1;
	color: var(--spw-acc-muted);
}
/* Rooms & suites — rich: the card grid keeps its chapter, quieter title. */
.spw-accommodation-units--rich .spw-accommodation-unit-card__title {
	font-family: Manrope, sans-serif;
	font-weight: 600;
}
/* Experiences: the items are the content. */
.spw-accommodation-experience-row {
	padding: 1.1rem 0;
	border-bottom: 1px solid #D8D3C8;
}
.spw-accommodation-experiences__list {
	border-top: 1px solid #D8D3C8;
}
.spw-accommodation-experience-row__title {
	font-family: Manrope, sans-serif;
	font-size: 1.05rem;
	font-weight: 600;
	margin: 0 0 0.3rem;
}
.spw-accommodation-experience-row__desc {
	max-width: 62ch;
	opacity: 1;
	color: #3E3E38;
}
.spw-accommodation-experience-row__meta {
	font-family: Inter, sans-serif;
	font-size: 0.7rem;
	letter-spacing: 0.14em;
	font-weight: 600;
	color: var(--spw-acc-muted);
	opacity: 1;
}
/* Good to know: three areas, one chapter. */
.spw-accommodation-good {
	display: grid;
	gap: 0 clamp(1.5rem, 3vw, 3rem);
	border-top: 1px solid #D8D3C8;
}
.spw-accommodation-good--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.spw-accommodation-good--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.spw-accommodation-good--2-1 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.spw-accommodation-good--1 { grid-template-columns: minmax(0, 1fr); }
.spw-accommodation-good--1 .spw-accommodation-good__item { max-width: 62ch; }
.spw-accommodation-good--2-1 .spw-accommodation-good__item--wide { grid-column: 1 / -1; }
.spw-accommodation-good__item {
	padding: 1.25rem 0 1.5rem;
	min-width: 0;
}
.spw-accommodation-good__title {
	font-family: Manrope, sans-serif;
	font-size: 1.05rem;
	font-weight: 600;
	letter-spacing: -0.01em;
	margin: 0 0 0.6rem;
}
.spw-accommodation-good__facts {
	list-style: none;
	padding: 0;
	margin: 0 0 0.75rem;
}
.spw-accommodation-good__facts li {
	padding: 0.3rem 0;
	font-size: 0.95rem;
	border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}
.spw-accommodation-good__facts li:last-child { border-bottom: 0; }
.spw-accommodation-good__note {
	font-size: 0.95rem;
	line-height: 1.65;
	margin: 0.25rem 0 0;
	color: #3E3E38;
}
.spw-accommodation-good__note + .spw-accommodation-good__note { margin-top: 0.75rem; }
/* Practical area rendered as its own chapter (rich notes). */
.spw-accommodation-practical__list {
	list-style: none;
	padding: 0;
	margin: 0 0 1rem;
}
.spw-accommodation-practical__list li {
	padding: 0.4rem 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}
/* Request This Stay stays the conversion close: heading a step above chapters. */
.spw-accommodation-enquire .spw-heading {
	font-size: clamp(1.75rem, 2.6vw, 2.35rem);
}
/* Tablet / mobile: Good to know stacks with rules between groups. */
@media (max-width: 900px) {
	.spw-accommodation-good--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.spw-accommodation-good--3 .spw-accommodation-good__item:last-child { grid-column: 1 / -1; border-top: 1px solid #D8D3C8; }
}
@media (max-width: 640px) {
	.spw-accommodation-good--3, .spw-accommodation-good--2, .spw-accommodation-good--2-1 { grid-template-columns: minmax(0, 1fr); }
	.spw-accommodation-good__item + .spw-accommodation-good__item { border-top: 1px solid #D8D3C8; }
	.spw-accommodation-good--3 .spw-accommodation-good__item:last-child { grid-column: auto; }
	.spw-accommodation .spw-heading--story { font-size: clamp(1.9rem, 8vw, 2.4rem); max-width: none; }
	.spw-accommodation-unit-card--row .spw-accommodation-unit-card__title { min-width: 0; width: 100%; }
}
/* The dark transfer panel keeps its white heading (the chapter-heading colour above must not reach into it). */
.spw-accommodation .spw-accommodation-transfer .spw-heading {
	color: #fff;
}
/* Compact rows: a variant note takes its own line under the name and occupancy. */
.spw-accommodation-unit-card--row .spw-accommodation-unit-card__note {
	flex-basis: 100%;
	font-style: normal;
	font-size: 0.9rem;
	color: #3E3E38;
	margin-top: 0.15rem;
}
/* Rows: the last row hands over to the section hairline — no doubled rules. */
.spw-accommodation-experience-row:last-child,
.spw-accommodation-unit-card--row:last-child {
	border-bottom: 0;
}
.spw-accommodation-experience-row__notes {
	font-size: 0.9rem;
	line-height: 1.6;
	color: #6B6B62;
	margin: 0.35rem 0 0;
	max-width: 62ch;
}

/* ==========================================================================
   v0.9.6 — 10/10 layout pass (single template only). Proportion, hierarchy,
   alignment and rhythm on top of the v0.9.5 type system — nothing rebuilt.
   Hierarchy: A hero h1 (unchanged) · B story display (Instrument Serif
   Italic, one rule) · C chapter labels (small uppercase sans) · D item
   titles (Manrope 600, 17px) · E body. One bleed token aligns the stone
   Good-to-know chapter and the dark transfer panel with the page grid
   (their text sits on the same left edge as every open section). Related
   stays become real image cards. No !important, no motion, everything
   under .spw-accommodation*.
   ========================================================================== */
.spw-accommodation {
	--spw-acc-bleed: clamp(1.5rem, 4vw, 3rem);
	--spw-acc-stone: #EFEBE3;
	--spw-acc-rule: #D8D3C8;
	--spw-acc-copy: #3E3E38;
	--spw-acc-label: #55554D;
	--spw-acc-gold-on-dark: #C2A46A;
	--spw-acc-measure: 42rem;
}

/* --- Quick facts: one hairline, not two (the grid used to carry its own rule 44px above the next section's) --- */
.spw-accommodation-glance__grid {
	border-bottom: 0;
	padding-bottom: 0.5rem;
}

/* --- Level E: a section's direct body copy keeps the reading measure (Accessibility, Sustainability, chapters) --- */
.spw-accommodation .spw-section > .spw-body {
	max-width: var(--spw-acc-measure);
	color: var(--spw-acc-copy);
	line-height: 1.65;
}

/* --- Level C: chapter labels, slightly more legible, deliberate spacing --- */
.spw-accommodation .spw-heading--label {
	font-size: 0.75rem;
	letter-spacing: 0.14em;
	color: var(--spw-acc-label);
	margin: 0 0 1.5rem;
}

/* --- Level B: the story — two-column editorial layout --- */
.spw-accommodation .spw-accommodation-story {
	display: grid;
	grid-template-columns: minmax(0, 6fr) minmax(0, 5fr);
	column-gap: clamp(2.5rem, 5vw, 5rem);
	align-items: start;
	padding-top: clamp(3rem, 5vw, 4.5rem);
	padding-bottom: clamp(2.5rem, 4vw, 3.5rem);
}
.spw-accommodation .spw-accommodation-story--single {
	grid-template-columns: minmax(0, 1fr);
}
.spw-accommodation .spw-accommodation-story__lead,
.spw-accommodation .spw-accommodation-story__body {
	min-width: 0;
}
.spw-accommodation .spw-accommodation-story__eyebrow {
	margin-bottom: 1.1rem;
}
.spw-accommodation .spw-heading--story {
	font-size: clamp(2.25rem, 1.6rem + 1.9vw, 3rem);
	line-height: 1.02;
	letter-spacing: -0.01em;
	max-width: 30ch;
	margin: 0;
}
.spw-accommodation .spw-accommodation-story__body {
	padding-top: 2.35rem;
}
.spw-accommodation .spw-accommodation-story--single .spw-accommodation-story__body {
	padding-top: 0;
}
.spw-accommodation .spw-accommodation-story__copy {
	max-width: var(--spw-acc-measure);
	font-size: 1.0625rem;
	line-height: 1.7;
	color: var(--spw-acc-copy);
	margin: 0 0 1.25rem;
}
.spw-accommodation .spw-accommodation-story__copy:last-child {
	margin-bottom: 0;
}
.spw-accommodation .spw-heading--sub {
	font-size: 1.0625rem;
	margin: 1.5rem 0 0.5rem;
	color: var(--spw-acc-ink);
}

/* --- Rooms & Suites: open rows, name leads, metadata sits quiet on one column --- */
.spw-accommodation .spw-accommodation-units {
	padding-top: clamp(2rem, 3vw, 2.75rem);
	padding-bottom: clamp(2.25rem, 3.5vw, 3rem);
}
.spw-accommodation-units__rows {
	border-top: 0;
}
.spw-accommodation-unit-card--row {
	display: grid;
	grid-template-columns: minmax(0, 17rem) minmax(0, 1fr);
	grid-auto-flow: row dense;
	column-gap: 2rem;
	row-gap: 0.2rem;
	align-items: baseline;
	padding: 1.15rem 0;
	border-top: 1px solid var(--spw-acc-rule);
	border-bottom: 0;
}
.spw-accommodation-unit-card--row:first-child {
	border-top: 0;
	padding-top: 0;
}
.spw-accommodation-unit-card--row:last-child {
	padding-bottom: 0.25rem;
}
.spw-accommodation-unit-card--row .spw-accommodation-unit-card__title {
	grid-column: 1;
	font-size: 1.0625rem;
	font-weight: 600;
	line-height: 1.35;
	min-width: 0;
	color: var(--spw-acc-ink);
}
.spw-accommodation-unit-card--row .spw-accommodation-unit-card__occupancy,
.spw-accommodation-unit-card--row .spw-accommodation-unit-card__features {
	grid-column: 2;
	font-size: 0.9rem;
	line-height: 1.5;
	color: var(--spw-acc-muted);
}
.spw-accommodation-unit-card--row .spw-accommodation-unit-card__note {
	grid-column: 1;
	font-size: 0.95rem;
	line-height: 1.6;
	color: var(--spw-acc-copy);
	max-width: 44ch;
	margin-top: 0.2rem;
}

/* --- Safari & Experiences: editorial items, not a list export --- */
.spw-accommodation .spw-accommodation-experiences {
	padding-top: clamp(2rem, 3vw, 2.75rem);
	padding-bottom: clamp(2.5rem, 4vw, 3.5rem);
}
.spw-accommodation-experiences__list {
	border-top: 0;
}
.spw-accommodation-experience-row {
	padding: 1.4rem 0;
	border-top: 1px solid var(--spw-acc-rule);
	border-bottom: 0;
}
.spw-accommodation-experience-row:first-child {
	border-top: 0;
	padding-top: 0;
}
.spw-accommodation-experience-row:last-child {
	padding-bottom: 0.25rem;
}
.spw-accommodation-experience-row__title {
	font-size: 1.0625rem;
	line-height: 1.35;
	margin: 0 0 0.45rem;
	color: var(--spw-acc-ink);
}
.spw-accommodation-experience-row__desc {
	font-size: 1rem;
	line-height: 1.6;
	margin: 0;
	max-width: 40rem;
}
.spw-accommodation-experience-row__meta {
	font-size: 0.68rem;
	letter-spacing: 0.14em;
	margin: 0.6rem 0 0;
}
.spw-accommodation-experience-row__notes {
	margin-top: 0.5rem;
	max-width: 40rem;
}
.spw-accommodation-experiences__list--columns {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: clamp(2.5rem, 5vw, 5rem);
}
.spw-accommodation-experiences__list--columns .spw-accommodation-experience-row:nth-child(-n+2) {
	border-top: 0;
	padding-top: 0;
}
.spw-accommodation-experiences__list--columns .spw-accommodation-experience-row__desc,
.spw-accommodation-experiences__list--columns .spw-accommodation-experience-row__notes {
	max-width: none;
}

/* --- Good to know: one stone chapter aligned to the page grid, open columns.
   The section and its inner grid share the .spw-accommodation-good token
   (v0.9.5), so the band rules address the section (.spw-section) and the
   column rules its direct child grid. --- */
.spw-accommodation .spw-section.spw-accommodation-good {
	display: block;
	background: var(--spw-acc-stone);
	border-radius: 4px;
	margin: clamp(0.5rem, 1.5vw, 1rem) calc(-1 * var(--spw-acc-bleed)) 0;
	padding: clamp(2.25rem, 3.5vw, 3rem) var(--spw-acc-bleed) clamp(2.5rem, 4vw, 3.25rem);
}
.spw-accommodation .spw-section.spw-accommodation-good > .spw-heading--label {
	margin-bottom: 1.25rem;
}
.spw-accommodation .spw-section.spw-accommodation-good > .spw-accommodation-good {
	display: grid;
	border-top: 0;
	margin: 0;
	padding: 0;
	background: transparent;
	gap: 0 clamp(2rem, 4vw, 4rem);
}
.spw-accommodation-good__item {
	padding: 1.15rem 0 0;
	border-top: 1px solid #CBC5B7;
}
.spw-accommodation-good__title {
	font-size: 1rem;
	line-height: 1.35;
	margin: 0 0 0.85rem;
	color: var(--spw-acc-ink);
}
.spw-accommodation-good__facts {
	margin: 0 0 0.85rem;
}
.spw-accommodation-good__facts li {
	padding: 0.15rem 0;
	border-bottom: 0;
	font-size: 0.95rem;
	line-height: 1.55;
	color: var(--spw-acc-ink);
}
.spw-accommodation-good__facts li::before {
	content: none;
}
.spw-accommodation-good__note {
	margin: 0;
	max-width: 40rem;
}
.spw-accommodation-good__note + .spw-accommodation-good__note {
	margin-top: 0.6rem;
}
.spw-accommodation-good--2-1 .spw-accommodation-good__item--wide .spw-accommodation-good__note {
	max-width: 52rem;
}

/* --- Private transfers: high-contrast copy on the dark panel, aligned to the grid --- */
.spw-accommodation .spw-accommodation-transfer {
	padding-top: clamp(2.5rem, 4vw, 3.5rem);
	padding-bottom: clamp(1.75rem, 3vw, 2.5rem);
}
.spw-accommodation-transfer__panel {
	border-radius: 4px;
	margin: 0 calc(-1 * var(--spw-acc-bleed));
	padding: clamp(2.25rem, 4vw, 3.25rem) var(--spw-acc-bleed) clamp(2.25rem, 4vw, 3rem);
}
.spw-accommodation .spw-accommodation-transfer .spw-eyebrow--on-dark {
	color: var(--spw-acc-gold-on-dark);
	opacity: 1;
}
.spw-accommodation .spw-accommodation-transfer .spw-heading {
	font-size: clamp(1.6rem, 2.4vw, 2.15rem);
	max-width: 22ch;
	margin: 0 0 1.1rem;
}
.spw-accommodation-transfer__copy .spw-body {
	color: #EDEAE2;
	font-size: 1.0625rem;
	line-height: 1.65;
	max-width: 36rem;
	margin: 0;
}
.spw-accommodation-transfer__note {
	color: rgba(255, 255, 255, 0.72);
	max-width: 36rem;
	margin-top: 0.85rem;
}
.spw-accommodation .spw-accommodation-transfer .spw-btn--on-dark {
	background: #fff;
	color: var(--spw-acc-ink);
}
.spw-accommodation-transfer__label {
	color: rgba(255, 255, 255, 0.72);
}

/* --- Request This Stay: the natural close — copy left, olive CTA right, open on the page --- */
.spw-accommodation .spw-accommodation-enquire {
	text-align: left;
	background: transparent;
	border-radius: 0;
	border-top: 1px solid var(--spw-acc-rule);
	padding: clamp(2.5rem, 4vw, 3.5rem) 0 clamp(2.75rem, 4.5vw, 4rem);
}
.spw-accommodation-enquire__layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	column-gap: clamp(2rem, 5vw, 5rem);
	align-items: start;
}
.spw-accommodation .spw-accommodation-enquire .spw-heading {
	font-size: clamp(1.75rem, 2.4vw, 2rem);
	margin: 0 0 0.85rem;
}
.spw-accommodation-enquire__price {
	font-family: Inter, sans-serif;
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--spw-acc-muted);
	margin: 0 0 1rem;
}
.spw-accommodation-enquire__copy .spw-body {
	max-width: var(--spw-acc-measure);
	font-size: 1.0625rem;
	line-height: 1.65;
	color: var(--spw-acc-copy);
	margin: 0;
}
.spw-accommodation-enquire__action {
	padding-top: 0.3rem;
}

/* --- Similar Places: real choice, real cards (hero, name, descriptor, quiet link) --- */
.spw-accommodation .spw-accommodation-related {
	padding-top: clamp(2.25rem, 3.5vw, 3rem);
	padding-bottom: clamp(2.5rem, 4vw, 3.5rem);
}
.spw-accommodation-related__list {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(1rem, 2vw, 1.5rem);
}
.spw-accommodation-related__card {
	display: flex;
	flex-direction: column;
	border: 1px solid var(--spw-acc-rule);
	border-radius: 4px;
	background: #FBFAF7;
	transition: border-color 0.15s ease;
}
.spw-accommodation-related__card:hover,
.spw-accommodation-related__card:focus-visible {
	border-color: #8F8B7E;
}
.spw-accommodation-related__card:focus-visible {
	outline: 2px solid var(--spw-color-accent-olive, #6f7b45);
	outline-offset: 3px;
}
.spw-accommodation-related__media {
	display: block;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: var(--spw-acc-stone);
}
.spw-accommodation-related__card img,
.spw-accommodation-related__image {
	display: block;
	width: 100%;
	height: 100%;
	aspect-ratio: auto;
	object-fit: cover;
}
.spw-accommodation-related__body {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	padding: 1.05rem 1.2rem 1.2rem;
}
.spw-accommodation-related__title {
	font-family: Manrope, sans-serif;
	font-size: 1.0625rem;
	font-weight: 600;
	line-height: 1.35;
	letter-spacing: -0.01em;
	color: var(--spw-acc-ink);
	padding: 0;
	margin: 0 0 0.4rem;
}
.spw-accommodation-related__desc {
	font-size: 0.9rem;
	line-height: 1.55;
	color: var(--spw-acc-copy);
	opacity: 1;
	padding: 0;
	margin: 0 0 1rem;
}
.spw-accommodation-related__cta {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	margin-top: auto;
	font-family: Inter, sans-serif;
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--spw-color-accent-olive, #6f7b45);
}
.spw-accommodation-related__cta .spw-icon {
	width: 14px;
	height: 14px;
}
/* One related stay: a horizontal card on two thirds of the measure, not a lone tile. */
/* v0.11.4: two similar places — a deliberate two-column composition across the full measure, never two cards beside a hole */
.spw-accommodation-related__list--2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(1.25rem, 2.5vw, 2rem);
}
.spw-accommodation-related__list--2 .spw-accommodation-related__media {
	aspect-ratio: 3 / 2;
}
.spw-accommodation-related__list--2 .spw-accommodation-related__body {
	padding: 1.2rem 1.4rem 1.4rem;
}
.spw-accommodation-related__list--2 .spw-accommodation-related__title {
	font-size: 1.2rem;
}
.spw-accommodation-related__list--1 {
	grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
}
.spw-accommodation-related__list--1 .spw-accommodation-related__card {
	flex-direction: row;
}
.spw-accommodation-related__list--1 .spw-accommodation-related__media {
	flex: 0 0 52%;
	aspect-ratio: 3 / 2; /* v0.11.17: was auto — with the image at height:100% inside a row-flex card the media resolved to an indefinite, very tall box; the 2-card ratio holds the photograph */
	min-height: 0;
	align-self: stretch;
}
.spw-accommodation-related__list--1 .spw-accommodation-related__body {
	padding: 1.4rem 1.6rem 1.5rem;
	justify-content: center;
}
.spw-accommodation-related__list--1 .spw-accommodation-related__cta {
	margin-top: 0.25rem;
}

/* --- FAQ: restrained accordion, label heading --- */
.spw-accommodation .spw-accommodation-faq {
	padding-bottom: clamp(2.5rem, 4vw, 3.5rem);
}
.spw-accommodation .spw-accordion {
	border-top: 0;
}
.spw-accommodation .spw-accordion__item:first-child {
	border-top: 1px solid var(--spw-acc-rule);
}
.spw-accommodation .spw-accordion__item {
	border-bottom-color: var(--spw-acc-rule);
}
.spw-accommodation .spw-accordion__trigger {
	font-family: Manrope, sans-serif;
	font-size: 1rem;
	padding: 1.2rem 0;
	color: var(--spw-acc-ink);
}
.spw-accommodation .spw-accordion__panel {
	max-width: var(--spw-acc-measure);
	padding-bottom: 1.4rem;
}
.spw-accommodation .spw-accordion__panel p {
	font-size: 0.975rem;
	color: var(--spw-acc-copy);
	opacity: 1;
}

/* --- Tablet (max 900): story, experiences and cards reflow --- */
@media (max-width: 900px) {
	.spw-accommodation .spw-accommodation-story {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 1.5rem;
	}
	.spw-accommodation .spw-accommodation-story__body {
		padding-top: 0;
	}
	.spw-accommodation-experiences__list--columns {
		display: block;
	}
	.spw-accommodation-experiences__list--columns .spw-accommodation-experience-row:nth-child(2) {
		border-top: 1px solid var(--spw-acc-rule);
		padding-top: 1.4rem;
	}
	.spw-accommodation-related__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.spw-accommodation-related__list--1 {
		grid-template-columns: minmax(0, 1fr);
	}
	.spw-accommodation-transfer__layout {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 1.75rem;
	}
	.spw-accommodation-good--3 {
		row-gap: 1.25rem;
	}
	.spw-accommodation-good--3 .spw-accommodation-good__item:last-child {
		border-top-color: #CBC5B7;
	}
}

/* --- Mobile (max 640): elegant serif, stacked metadata, one-column cards --- */
@media (max-width: 640px) {
	.spw-accommodation .spw-heading--story {
		font-size: clamp(2.125rem, 9vw, 2.5rem);
		line-height: 1.04;
		max-width: none;
	}
	.spw-accommodation .spw-accommodation-story {
		padding-top: 2.5rem;
		padding-bottom: 2.25rem;
		row-gap: 1.25rem;
	}
	.spw-accommodation-unit-card--row {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 0.15rem;
		padding: 1rem 0;
	}
	.spw-accommodation-unit-card--row .spw-accommodation-unit-card__occupancy,
	.spw-accommodation-unit-card--row .spw-accommodation-unit-card__features,
	.spw-accommodation-unit-card--row .spw-accommodation-unit-card__note {
		grid-column: 1;
	}
	.spw-accommodation-unit-card--row .spw-accommodation-unit-card__title {
		width: auto;
	}
	.spw-accommodation-experience-row {
		padding: 1.2rem 0;
	}
	.spw-accommodation .spw-section.spw-accommodation-good {
		padding-top: 2rem;
		padding-bottom: 2.25rem;
	}
	.spw-accommodation-good__item {
		padding: 1.1rem 0 1.25rem;
	}
	.spw-accommodation-good__item:last-child {
		padding-bottom: 0;
	}
	.spw-accommodation-transfer__panel {
		padding-top: 2rem;
		padding-bottom: 2rem;
	}
	.spw-accommodation .spw-accommodation-transfer .spw-btn--on-dark,
	.spw-accommodation .spw-accommodation-enquire .spw-btn--primary {
		width: 100%;
		box-sizing: border-box;
	}
	.spw-accommodation-enquire__layout {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 1.5rem;
	}
	.spw-accommodation-enquire__action {
		padding-top: 0;
	}
	.spw-accommodation-related__list,
	.spw-accommodation-related__list--1,
	.spw-accommodation-related__list--2 {
		grid-template-columns: minmax(0, 1fr);
	}
	.spw-accommodation-related__list--1 .spw-accommodation-related__card {
		flex-direction: column;
	}
	.spw-accommodation-related__list--1 .spw-accommodation-related__media {
		flex: 0 0 auto;
		aspect-ratio: 16 / 10;
		min-height: 0;
	}
	.spw-accommodation-related__list--1 .spw-accommodation-related__body {
		padding: 1.05rem 1.2rem 1.2rem;
	}
}

/* ==========================================================================
   v0.9.7 — Rooms & Suites compression. Compact room records (names,
   occupancy, short notes — no images) read as a two-column editorial
   inventory: DOM order 1, 2, 3, 4 lands on rows 1 | 2 and 3 | 4 (grid row
   flow, never column flow), each item a fine top rule, the name leading,
   capacity muted beneath, a variant note under that. One room stays a
   single compact item; an odd last item sits in the left column. Rich
   records (a unit image) keep the card grid untouched. One column ≤ 640.
   No cards, no boxes, no shadow, no zebra, no serif, no !important.
   ========================================================================== */
.spw-accommodation-units__rows {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-auto-flow: row;
	column-gap: clamp(1.5rem, 2.5vw, 2rem);
	row-gap: 0;
	align-items: start;
}
.spw-accommodation-units__rows--single {
	grid-template-columns: minmax(0, 1fr);
	max-width: 30rem;
}
.spw-accommodation-unit-card--row,
.spw-accommodation-unit-card--row:first-child,
.spw-accommodation-unit-card--row:last-child {
	display: block;
	padding: 0.85rem 0 0.95rem;
	border-top: 1px solid var(--spw-acc-rule);
	border-bottom: 0;
}
.spw-accommodation-unit-card--row .spw-accommodation-unit-card__title {
	font-size: 1.0625rem;
	line-height: 1.35;
	margin: 0 0 0.2rem;
}
.spw-accommodation-unit-card--row .spw-accommodation-unit-card__occupancy,
.spw-accommodation-unit-card--row .spw-accommodation-unit-card__features {
	font-size: 0.9rem;
	line-height: 1.5;
	margin: 0;
	color: var(--spw-acc-muted);
}
.spw-accommodation-unit-card--row .spw-accommodation-unit-card__occupancy + .spw-accommodation-unit-card__features {
	margin-top: 0.1rem;
}
.spw-accommodation-unit-card--row .spw-accommodation-unit-card__note {
	font-size: 0.925rem;
	line-height: 1.55;
	margin: 0.45rem 0 0;
	max-width: 44ch;
	color: var(--spw-acc-copy);
}
.spw-accommodation .spw-accommodation-units {
	padding-bottom: clamp(2rem, 3vw, 2.5rem);
}
@media (max-width: 640px) {
	.spw-accommodation-units__rows,
	.spw-accommodation-units__rows--single {
		grid-template-columns: minmax(0, 1fr);
		max-width: none;
	}
	.spw-accommodation-unit-card--row,
	.spw-accommodation-unit-card--row:first-child,
	.spw-accommodation-unit-card--row:last-child {
		padding: 0.8rem 0 0.9rem;
	}
}