/* ==========================================================================
   Elite Realty — properties listing and property page.
   Loaded only on /properties/ and /property/{slug}/ (inc/assets.php).
   Uses the tokens and components from main.css.
   ========================================================================== */

/* 1. Listing header
   ------------------------------------------------------------------------ */
.er-archive-hero {
	position: relative;
	isolation: isolate;
	padding: calc(var(--er-header-offset) + clamp(40px, 5vw, 72px)) 0 clamp(40px, 4.5vw, 64px);
}
.er-archive-hero .er-page-hero__title { margin: 0; }
.er-archive-hero__intro {
	max-width: 62ch;
	margin: 16px 0 0;
	color: var(--er-text);
}

/* Drifting photographs — measured on LuxeRealty /properties/listing at
   1440/1024/768/390: an 85vh band; 864×1034 tiles at every width, edge to
   edge, taller than the band and centred on it; one row moving left at a
   constant 44px/s (shared marquee engine), not pausing on hover; a stationary
   340×322 box in the middle. The photographs never change with the palette;
   the box is the brand tone. */
.er-archive-hero--drift {
	display: grid;
	place-items: center;
	height: 85vh;
	height: 85svh;
	min-height: calc(322px + 2 * var(--er-header-offset) + 32px);
	padding: 0 var(--er-gutter);
	overflow: hidden;
	background: var(--wp--preset--color--obsidian, #0b0b0b);
}
.er-archive-hero__marquee {
	position: absolute;
	inset: 0;
	z-index: -1;
}
.er-archive-hero__marquee .er-marquee__track,
.er-archive-hero__marquee .er-marquee__group {
	height: 100%;
	align-items: center;
}
.er-archive-hero__photo {
	flex: none;
	width: 864px;
	height: max(100%, 1034px);
}
.er-archive-hero__photo img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
/* The reference keeps drifting under the pointer (still paused off-screen / in a hidden tab). */
@media (prefers-reduced-motion: no-preference) {
	html:not(.er-tab-hidden) .er-archive-hero__marquee:is(:hover, :focus-within):not(.is-offscreen) .er-marquee__track {
		animation-play-state: running;
	}
}
/* Static composition (no JS / reduced motion): the first tiles, one clipped row, never wrapped. */
html:not(.er-js) .er-archive-hero__marquee .er-marquee__track,
html:not(.er-js) .er-archive-hero__marquee .er-marquee__group { flex-wrap: nowrap; }
@media (prefers-reduced-motion: reduce) {
	.er-archive-hero__marquee .er-marquee__track,
	.er-archive-hero__marquee .er-marquee__group { flex-wrap: nowrap; }
}

.er-archive-hero__box {
	display: grid;
	justify-items: center;
	align-content: center;
	width: min(340px, 100%);
	min-height: 322px;
	padding: 24px 14px;
	text-align: center;
}
.er-archive-hero__eyebrow { margin-bottom: 12px; }
.er-archive-hero .er-archive-hero__title {
	max-width: 100%;
	font-size: 32px;
	overflow-wrap: anywhere;
}
.er-archive-hero__rule { --er-rule-w: 154px; margin: 14px auto; }
.er-archive-hero__box .er-archive-hero__intro {
	max-width: 32ch;
	margin: 0;
	font-weight: 500;
}

/* 2. Filters
   ------------------------------------------------------------------------ */
.er-listing { padding-block: clamp(32px, 4vw, 56px) var(--er-space-section); }

.er-filters {
	padding: clamp(20px, 2.5vw, 32px);
	border: 1px solid var(--er-border);
	background: var(--er-card);
}

.er-filters__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-items: end;
	gap: 16px 12px;
}
.er-filters__actions { grid-column: 1 / -1; }
@media (min-width: 600px) {
	.er-filters__grid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 16px 20px; }
	.er-filters__actions { grid-column: auto; }
}

.er-filters__field { display: grid; gap: 8px; }
.er-filters__field > label {
	color: var(--er-heading);
	font-size: var(--er-fs-meta);
	letter-spacing: .04em;
	text-transform: uppercase;
}

.er-filters__select {
	padding-right: 40px;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2310211d' stroke-width='1.5'/%3E%3C/svg%3E");
	background-position: right 16px center;
	background-repeat: no-repeat;
}

.er-filters__actions {
	display: flex;
	flex-wrap: wrap;
	align-self: end;
	align-items: center;
	gap: 8px 20px;
}
.er-filters__actions .er-btn { flex: 1 1 auto; min-height: 50px; padding-inline: 20px; white-space: nowrap; }
.er-filters__reset {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	color: var(--er-accent-strong);
	font-size: var(--er-fs-small);
	letter-spacing: .02em;
	text-transform: uppercase;
}

/* 3. Results
   ------------------------------------------------------------------------ */
.er-listing__summary {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 24px;
	margin: clamp(32px, 4vw, 48px) 0 24px;
}
.er-listing__count {
	margin: 0;
	font-size: var(--er-fs-name);
	line-height: 1.3;
	letter-spacing: -0.02em;
}
.er-listing__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.er-listing__chip {
	gap: 8px;
	min-height: 44px; /* Interactive chip (link or remove control): full target size. */
	text-decoration: none;
	transition: border-color var(--er-dur-fast) var(--er-ease-out);
}
.er-listing__chip:hover { border-color: var(--er-accent); color: var(--er-heading); }
.er-listing__chip .er-icon { width: 14px; height: 14px; }

.er-listing__empty {
	display: grid;
	justify-items: center;
	gap: 8px;
	padding: clamp(40px, 6vw, 80px) 24px;
	border: 1px solid var(--er-border);
	background: var(--er-card);
	text-align: center;
}
.er-listing__empty p { max-width: 52ch; margin: 0; }
.er-listing__empty-title { color: var(--er-heading); font-size: var(--er-fs-name); }
.er-listing__empty .er-btn { margin-top: 16px; }

.er-listing .navigation.pagination .nav-links { justify-content: center; }

/* 4. Property hero
   ------------------------------------------------------------------------ */
.er-property-hero { position: relative; isolation: isolate; }

.er-property-hero__media {
	height: 62svh;
	min-height: 320px;
	overflow: hidden;
	background: var(--wp--preset--color--obsidian, #0b0b0b);
}
.er-property-hero__img,
.er-property-hero__media .er-media-section__fallback {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.er-property-hero__inner { padding-inline: 0; }
.er-property-hero__panel { padding: 28px var(--er-gutter) 32px; }
/* Below 810 the panel sits under the photograph, not over it: glass would show
   the page instead of a photo, so it becomes a solid band of the same warm smoke. */
@media (max-width: 809px) {
	.er-property-hero__panel.er-photo-glass {
		border: 0;
		background: rgb(28 22 18);
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
	}
	.er-property-hero__panel.er-photo-glass::before { content: none; }
}

.er-property-hero__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 20px 0 16px;
	padding: 0;
	list-style: none;
}
.er-property-hero__title { margin: 0; overflow-wrap: anywhere; }
.er-property-hero__panel .er-rule { margin-block: 16px; }
.er-property-hero__location {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	font-size: var(--er-fs-small);
	letter-spacing: .02em;
	text-transform: uppercase;
}
.er-property-hero__location .er-icon { width: 18px; height: 18px; }
.er-property-hero__price {
	margin: 12px 0 4px;
	color: var(--er-heading);
	font-size: var(--er-fs-name);
	font-variant-numeric: tabular-nums;
}

@media (min-width: 810px) {
	.er-property-hero {
		display: grid;
		align-items: end;
		min-height: 88svh;
		/* A very long title grows the panel upwards; keep it below the fixed header. */
		padding-top: calc(var(--er-header-offset) + 24px + var(--wp-admin--admin-bar--height, 0px));
	}
	.er-property-hero__media {
		position: absolute;
		inset: 0;
		z-index: -1;
		height: auto;
	}
	.er-property-hero__media::after {
		content: "";
		position: absolute;
		inset: 0;
		background: linear-gradient(20deg, rgb(11 11 11 / .45), transparent 55%);
	}
	.er-property-hero__inner { padding: 0 var(--er-gutter) 40px; }
	.er-property-hero__panel {
		max-width: 560px;
		padding: 32px 36px;
	}
}

/* 5. Key facts
   ------------------------------------------------------------------------ */
.er-property-facts { border-bottom: 1px solid var(--er-border); }
.er-property-facts__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 24px 48px;
	padding-block: 28px;
}
.er-property-facts__list {
	display: flex;
	flex-wrap: wrap;
	gap: 16px 40px;
	margin: 0;
}
.er-property-facts__item dt {
	display: flex;
	align-items: center;
	gap: 6px;
	color: var(--er-muted);
	font-size: var(--er-fs-meta);
	letter-spacing: .04em;
	text-transform: uppercase;
}
.er-property-facts__item dt .er-icon { width: 16px; height: 16px; }
.er-property-facts__item dd {
	margin: 4px 0 0;
	color: var(--er-heading);
	font-size: 20px;
}
.er-property-facts__cta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px 24px;
}
.er-property-facts__price {
	margin: 0;
	color: var(--er-heading);
	font-size: var(--er-fs-name);
	font-variant-numeric: tabular-nums;
}

/* 6. Gallery
   ------------------------------------------------------------------------ */
.er-gallery { padding-top: clamp(32px, 4vw, 56px); }

.er-gallery__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-auto-rows: clamp(120px, 34vw, 200px);
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.er-gallery__item:first-child { grid-column: span 2; grid-row: span 2; }
.er-gallery__item:nth-child(n + 6) { display: none; }

@media (min-width: 810px) {
	.er-gallery__grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		grid-auto-rows: clamp(160px, 17vw, 260px);
	}
	.er-gallery__grid[data-count="2"] .er-gallery__item { grid-column: span 2; grid-row: span 2; }
	.er-gallery__grid[data-count="3"] .er-gallery__item:not(:first-child) { grid-column: span 2; }
	.er-gallery__grid[data-count="4"] .er-gallery__item:nth-child(2) { grid-column: span 2; }
}

.er-gallery__link {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	overflow: hidden;
	background: var(--er-surface);
}
.er-gallery__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--er-dur-md) var(--er-ease-out);
}
.er-gallery__link:is(:hover, :focus-visible) .er-gallery__img { transform: scale(1.04); }
.er-gallery__link:focus-visible { outline-offset: -3px; }
@media (prefers-reduced-motion: reduce) {
	.er-gallery__link .er-gallery__img { transform: none !important; }
}
.er-gallery__more {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	background: rgb(11 11 11 / .5);
	color: var(--wp--preset--color--ivory, #f5f0e6);
	font-size: var(--er-fs-card);
	letter-spacing: .04em;
	text-transform: uppercase;
}

/* 7. Body layout: main column + sticky contact column
   ------------------------------------------------------------------------ */
.er-property__layout {
	display: grid;
	gap: 48px;
	padding-block: clamp(40px, 5vw, 80px) var(--er-space-section);
}
@media (min-width: 1200px) {
	.er-property__layout {
		grid-template-columns: minmax(0, 1fr) minmax(320px, 400px);
		gap: clamp(48px, 5.5vw, 80px);
		align-items: start;
	}
	/* Not sticky: the column (advisor + form) is taller than most viewports,
	   and a pinned column would keep its lower fields out of reach. */
}

.er-property__section {
	padding-bottom: 48px;
	margin-bottom: 48px;
	border-bottom: 1px solid var(--er-border);
}
.er-property__section:last-child { margin-bottom: 0; border-bottom: 0; }

.er-property__heading {
	margin: 0 0 24px;
	font-size: var(--er-fs-name);
	line-height: 1.2;
	letter-spacing: -0.01em;
	text-transform: uppercase;
}

.er-property__description { font-size: 17px; line-height: 1.7; }

.er-features {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 12px 32px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.er-features li {
	position: relative;
	padding-left: 22px;
	color: var(--er-heading);
}
.er-features li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .75em;
	width: 12px;
	height: 1px;
	background: var(--er-accent);
}

.er-property__data {
	display: grid;
	gap: 0;
	margin: 24px 0;
}
.er-property__data > div {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 16px;
	padding: 12px 0;
	border-bottom: 1px solid var(--er-border);
}
.er-property__data dt { color: var(--er-muted); }
.er-property__data dd { margin: 0; color: var(--er-heading); text-align: right; }

/* EPC scale: letters are always printed (colour is never the only cue);
   the readable rating sits in .er-epc__summary. Letters are large bold text. */
.er-epc__summary { margin: 0 0 16px; color: var(--er-heading); font-size: var(--er-fs-card); font-weight: 500; }
.er-epc {
	display: grid;
	gap: 6px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.er-epc__step { display: flex; align-items: center; gap: 12px; }
.er-epc__bar {
	display: flex;
	align-items: center;
	width: calc(34% + var(--er-epc-step) * 7%);
	max-width: calc(100% - 130px);
	min-height: 32px;
	padding: 0 12px;
	clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 0 100%);
	color: #0b0b0b;
	font-size: 19px;
	font-weight: 700;
	line-height: 1;
}
.er-epc__step:nth-child(1) .er-epc__bar { background: #00843d; }
.er-epc__step:nth-child(2) .er-epc__bar { background: #19a04b; }
.er-epc__step:nth-child(3) .er-epc__bar { background: #4db848; }
.er-epc__step:nth-child(4) .er-epc__bar { background: #bfd730; }
.er-epc__step:nth-child(5) .er-epc__bar { background: #fff200; }
.er-epc__step:nth-child(6) .er-epc__bar { background: #fdb913; }
.er-epc__step:nth-child(7) .er-epc__bar { background: #f37021; }
.er-epc__step:nth-child(8) .er-epc__bar { background: #ed1c24; }
.er-epc__step:nth-child(9) .er-epc__bar { background: #b1181e; color: #fff; }
.er-epc__step.is-current .er-epc__bar { box-shadow: inset 0 0 0 3px #0b0b0b; min-height: 40px; }
.er-epc__marker {
	color: var(--er-heading);
	font-size: var(--er-fs-small);
	font-weight: 600;
	letter-spacing: .02em;
	text-transform: uppercase;
}
.er-epc__marker::before { content: "← "; content: "← " / ""; }

.er-plans {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 16px;
	margin: 0 0 24px;
	padding: 0;
	list-style: none;
}
.er-plans__link {
	display: block;
	padding: 12px;
	border: 1px solid var(--er-border);
	background: var(--er-card);
}
.er-plans__link img { width: 100%; height: auto; }
.er-plans__link:hover { border-color: var(--er-accent); }

.er-downloads { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.er-downloads__meta { color: var(--er-muted); text-transform: none; }

.er-embed {
	aspect-ratio: 16 / 9;
	margin-bottom: 16px;
	background: var(--wp--preset--color--obsidian, #0b0b0b);
}
.er-embed iframe,
.er-embed video { display: block; width: 100%; height: 100%; border: 0; }
.er-embed video { object-fit: cover; }

/* Local film: poster card with a centred play button until playback starts. */
.er-embed--film { position: relative; overflow: hidden; }
.er-embed--film::after {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(circle at center, rgb(11 11 11 / .15), rgb(11 11 11 / .45));
	pointer-events: none;
	transition: opacity var(--er-dur-fast) var(--er-ease-out);
}
.er-embed--film.is-playing::after { opacity: 0; }
.er-embed__play {
	position: absolute;
	inset: 50% auto auto 50%;
	z-index: 1;
	display: grid;
	place-items: center;
	width: clamp(64px, 11vw, 96px);
	aspect-ratio: 1;
	padding: 0;
	border: 1px solid rgb(245 240 230 / .75);
	border-radius: 50%;
	background: rgb(11 11 11 / .35);
	backdrop-filter: blur(6px);
	color: var(--wp--preset--color--ivory, #f5f0e6);
	cursor: pointer;
	transform: translate(-50%, -50%);
	transition: background-color var(--er-dur-fast) var(--er-ease-out), color var(--er-dur-fast) var(--er-ease-out), transform var(--er-dur-fast) var(--er-ease-out);
}
.er-embed__play svg { width: 34%; height: 34%; margin-left: 6%; fill: currentColor; }
.er-embed__play:hover,
.er-embed__play:focus-visible {
	background: var(--wp--preset--color--ivory, #f5f0e6);
	color: var(--wp--preset--color--obsidian, #0b0b0b);
	transform: translate(-50%, -50%) scale(1.06);
}
.er-embed__play:focus-visible { outline: 2px solid var(--er-focus); outline-offset: 4px; }
html:not(.er-js) .er-embed__play { display: none; }
@media (prefers-reduced-motion: reduce) {
	.er-embed__play:hover,
	.er-embed__play:focus-visible { transform: translate(-50%, -50%); }
}

/* Click-to-load facade: photo, darkened, with a centred button and provider note. */
.er-embed--facade {
	position: relative;
	display: grid;
	place-items: center;
	overflow: hidden;
	isolation: isolate;
}
.er-embed__poster {
	position: absolute;
	inset: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: .55;
}
.er-embed__cta {
	display: grid;
	justify-items: center;
	gap: 12px;
	margin: 0;
	padding: 16px;
	text-align: center;
}
.er-embed__note { color: var(--wp--preset--color--ivory, #f5f0e6); font-size: var(--er-fs-small); }

.er-property__address { margin: 0 0 8px; color: var(--er-heading); font-size: var(--er-fs-card); }

/* 8. Contact column
   ------------------------------------------------------------------------ */
.er-property__contact {
	display: grid;
	gap: 40px;
	padding: clamp(24px, 3vw, 32px);
	background: var(--er-surface);
}
.er-property__aside .er-form__grid { grid-template-columns: 1fr; }
.er-property__aside .er-form__input { background: var(--er-card); }
.er-advisor__heading,
.er-property-enquiry .er-property__heading { font-size: var(--er-fs-card); }

.er-advisor__card {
	display: grid;
	grid-template-columns: 96px minmax(0, 1fr);
	gap: 20px;
	align-items: center;
}
.er-advisor__photo {
	aspect-ratio: 4 / 5;
	overflow: hidden;
	background: var(--er-card);
}
.er-advisor__photo .er-card__img,
.er-advisor__photo .er-card__placeholder { display: block; width: 100%; height: 100%; object-fit: cover; }
.er-advisor__name { margin: 0; font-size: var(--er-fs-name); line-height: 1.3; }
.er-advisor__name a { color: var(--er-heading); text-decoration: none; }
.er-advisor__name a:hover { text-decoration: underline; }
.er-advisor__role {
	margin: 4px 0 10px;
	color: var(--er-muted);
	font-size: var(--er-fs-small);
	letter-spacing: .04em;
	text-transform: uppercase;
}
.er-advisor__chip { margin: 0; }
.er-advisor__links {
	display: grid;
	gap: 4px;
	margin: 20px 0 0;
	padding: 0;
	list-style: none;
}
.er-advisor__links a {
	display: inline-flex;
	align-items: center;
	min-height: 32px;
	color: var(--er-heading);
	overflow-wrap: anywhere;
}
.er-advisor__also { margin: 16px 0 0; color: var(--er-muted); font-size: var(--er-fs-small); }

/* 9. Image viewer (<dialog>)
   ------------------------------------------------------------------------ */
.er-lightbox {
	inset: 0;
	width: 100vw;
	height: 100dvh;
	background: rgb(11 11 11 / .94);
	color: var(--wp--preset--color--ivory, #f5f0e6);
}
.er-lightbox::backdrop { background: rgb(11 11 11 / .6); }
.er-lightbox { opacity: 1; transition-duration: var(--er-dur-fast); }
.er-lightbox:not([open]) { opacity: 0; }
@starting-style { .er-lightbox[open] { opacity: 0; } }
.er-lightbox__inner {
	position: relative;
	display: grid;
	place-items: center;
	width: 100%;
	height: 100%;
	padding: 64px clamp(16px, 7vw, 96px) 24px;
}
.er-lightbox__figure {
	display: grid;
	gap: 12px;
	justify-items: center;
	margin: 0;
	max-width: 100%;
	max-height: 100%;
}
.er-lightbox__img {
	max-width: min(1400px, 100%);
	max-height: calc(100dvh - 140px);
	width: auto;
	height: auto;
	object-fit: contain;
	background: var(--er-surface, #171311);
}
.er-lightbox__caption { font-size: var(--er-fs-small); text-align: center; }
.er-lightbox .er-icon-btn {
	width: 48px;
	height: 48px;
	background: rgb(245 240 230 / .1);
	color: inherit;
}
.er-lightbox .er-icon-btn:hover { background: rgb(245 240 230 / .2); }
.er-lightbox :focus-visible { outline-color: var(--wp--preset--color--gold, #c9a86a); }
.er-lightbox__close { position: absolute; top: 12px; right: 12px; }
.er-lightbox__nav { position: absolute; top: 50%; translate: 0 -50%; }
.er-lightbox__prev { left: 12px; }
.er-lightbox__next { right: 12px; }
.er-lightbox__arrow { font-size: 22px; line-height: 1; }

/* 10. Location page (taxonomy-ert_location.php) — reuses the hero, chips,
   grid, pagination and empty state above.
   ------------------------------------------------------------------------ */
.er-location-hero__eyebrow { margin: 16px 0 8px; }
/* Compact header (location without a photograph): the inner-page band. */
.er-location-header__count { margin: 16px 0 0; }
.er-location-intro--compact { padding-top: clamp(40px, 5vw, 72px); }
.er-location-hero .er-rule { margin-block: 16px; }

.er-location-intro__grid { display: grid; gap: 40px; align-items: start; }
@media (min-width: 1024px) {
	.er-location-intro__grid.has-map {
		grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
		gap: clamp(48px, 6vw, 96px);
	}
}
.er-location-intro__text { max-width: 640px; }
.er-location-intro__lead { margin: 0; font-size: 18px; line-height: 1.7; }
.er-location-intro__sub {
	margin: 32px 0 12px;
	color: var(--er-muted);
	font-size: var(--er-fs-small);
	font-weight: 400;
	letter-spacing: .02em;
	text-transform: uppercase;
}
.er-location-intro__areas {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.er-location-intro__map .er-map { margin-top: 0; }

/* Location map: toned to the palette (full colour on hover), never taller
   than a supporting element when stacked, and inert to touch so it cannot
   trap scrolling — "Open in OpenStreetMap" below is the interaction there. */
.er-location-intro__map iframe {
	filter: grayscale(1) sepia(.18) contrast(.9) brightness(1.04);
	transition: filter var(--er-dur-md) var(--er-ease-out);
}
.er-location-intro__map .er-map:hover iframe { filter: none; }
@media (max-width: 1023px) {
	.er-location-intro__map .er-map { aspect-ratio: auto; height: clamp(240px, 42vw, 360px); }
}
@media (hover: none) and (pointer: coarse) {
	.er-location-intro__map iframe { pointer-events: none; }
}

.er-location-area { display: grid; gap: 32px; }
@media (min-width: 1024px) {
	.er-location-area { grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(48px, 6vw, 96px); }
}