/* ==========================================================================
   Single Development & Plot templates — loaded only on those single pages.
   Split out of site.css for performance (was ~47% of the global stylesheet).
   ========================================================================== */

/* ==========================================================================
   Development Single Template
   ========================================================================== */

.owl-development-single-hero {
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

.owl-development-single-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: rgba(0, 0, 0, 0.35);
	pointer-events: none;
}

.owl-development-single-hero-image,
.owl-development-single-hero-image .elementor-widget-container,
.owl-development-single-hero-image :is(a, img, picture) {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
}

.owl-development-single-hero-image {
	z-index: 0;
}

.owl-development-single-hero-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center center;
}

.owl-development-single-hero-inner {
	position: relative;
	z-index: 2;
	align-items: center;
	text-align: center;
}

.owl-development-single-status-pill {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 130px;
	height: 35px;
	min-height: 35px;
	padding: 10px 20px;
	box-sizing: border-box;
	border-radius: var(--owl-radius-pill);
	background: var(--owl-white);
	color: var(--owl-charcoal);
	line-height: 1;
	white-space: nowrap;
}

.owl-development-single-status-pill .elementor-heading-title {
	color: inherit;
	line-height: 1;
}

.owl-development-single-hero-summary {
	width: auto;
	overflow: visible;
	background: transparent;
	box-shadow: none;
}

.owl-development-single-hero-summary .elementor-heading-title {
	color: var(--owl-white);
}

.owl-development-single-hero-summary-item {
	display: inline-flex;
	min-width: 0;
	align-items: center;
	color: var(--owl-white);
}

.owl-development-single-hero-summary-item .elementor-heading-title {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.owl-development-single-hero-summary-item:not(:first-child)::before {
	display: inline-block;
	width: 5px;
	height: 5px;
	margin-right: 10px;
	border-radius: 50%;
	background: currentColor;
	content: "";
}

.owl-development-single-hero-button {
	display: none;
}

.owl-development-single-offer-strip {
	display: flex;
	min-height: 50px;
	align-items: center;
	justify-content: center;
	background: var(--owl-gold);
	text-align: center;
}

.owl-development-single-nav-wrap {
	position: sticky;
	top: 0;
	z-index: 30;
}

.admin-bar .owl-development-single-nav-wrap {
	top: 32px;
}

.owl-development-single-jump-nav {
	position: relative;
	padding: 20px;
	background: var(--owl-white);
}

.owl-development-single-jump-nav__inner {
	position: relative;
	display: flex;
	width: min(1400px, 100%);
	height: 50px;
	margin: 0 auto;
	padding: 0 0 0 30px;
	align-items: center;
	gap: 28px;
	border-radius: var(--owl-radius-pill);
	background: #f5f1df;
}

.owl-development-single-jump-nav__label {
	flex: 0 0 auto;
	margin: 0;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 800;
	line-height: 1.5;
	white-space: nowrap;
}

/* Spaced by the gap, not by space-between. A development that hides sections can
   be down to two tabs, and space-between threw those to opposite ends of the bar.
   On a development showing all six the links already fill the row at the gap's
   45px maximum, so this reads identically there. */
.owl-development-single-jump-nav__links {
	display: flex;
	min-width: 0;
	flex: 1;
	align-items: center;
	justify-content: flex-start;
	/* ⚠️ Do NOT clip this row. The pills run a couple of px past it at the widest
	   viewports, which is harmless on its own — there is 26px of clear gap before
	   the enquiry panel — but an overflow value makes it a scroll container and
	   shaves the rounded corner off the last pill. 22px keeps the six labels
	   inside the row with about 8px to spare. */
	gap: clamp(10px, calc(10px + (100vw - 1024px) * 0.0833), 22px);
}

/* The enquiry panel normally occupies the right of this bar and gives the last
   link something to sit against. With the panel dropped, the links spread into
   that width and the final one lands hard on the pill's edge, so give the bar
   the right padding the panel used to provide. */
.owl-development-single-jump-nav--no-enquiry .owl-development-single-jump-nav__inner {
	padding-right: 30px;
}

/* ⚠️ flex-shrink is load bearing. `min-width: 106px` REPLACES the automatic
   min-width:auto that normally stops a flex item shrinking below its own text,
   so without this the longer labels squeezed to 106px and, being nowrap, spilled
   out of the active pill. 106px stays as the floor for the short ones. */
.owl-development-single-jump-nav__links a {
	position: relative;
	z-index: 0;
	display: inline-flex;
	flex-shrink: 0;
	min-width: 106px;
	min-height: 34px;
	padding: 5px 12px;
	align-items: center;
	justify-content: center;
	border-radius: var(--owl-radius-pill);
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	text-decoration: none;
	white-space: nowrap;
	isolation: isolate;
}


.owl-development-single-jump-nav__links a:hover,
.owl-development-single-jump-nav__links a:focus {
	color: var(--owl-charcoal);
	text-decoration: none;
}

.owl-development-single-jump-nav__links a.is-active {
	background: var(--owl-white);
}

.owl-development-single-mobile-jump {
	display: none;
}

/*
 * Sized to whatever it says rather than held at the 332px the design drew, which
 * only ever covered "View or Enquire" with "We are Open". Sold out left 34px of
 * dead space beside the chevron, and Register your interest did not fit at all.
 */
.owl-development-single-enquiry {
	position: relative;
	width: max-content;
	height: 50px;
	flex: 0 0 auto;
	margin-left: auto;
}

.owl-development-single-enquiry__summary {
	position: relative;
	z-index: 2;
	display: flex;
	width: 100%;
	height: 50px;
	padding: 0 20px;
	align-items: center;
	justify-content: flex-start;
	gap: 17px;
	border-radius: var(--owl-radius-pill);
	background: var(--owl-charcoal);
	color: var(--owl-white);
	cursor: pointer;
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 800;
	line-height: 1.5;
	list-style: none;
	white-space: nowrap;
}

.owl-development-single-enquiry__summary::-webkit-details-marker {
	display: none;
}

.owl-development-single-enquiry__summary:hover,
.owl-development-single-enquiry__summary:focus {
	background: var(--owl-charcoal);
	color: var(--owl-white);
	outline: none;
}

/*
 * These used to be pinned at fixed offsets, the status at a hard 183px, which
 * only held while every label was as short as "View or Enquire". A longer one
 * such as "Register your interest" ran straight through it. Laid out in flow so
 * the status follows the label whatever its length.
 */
.owl-development-single-enquiry__summary-label {
	position: static;
	flex: 0 0 auto;
	white-space: nowrap;
}

.owl-development-single-enquiry__status {
	position: static;
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	gap: 10px;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
}

.owl-development-single-enquiry__status-dot {
	position: static;
	display: block;
	width: 15px;
	height: 15px;
	flex: 0 0 15px;
	border-radius: 50%;
	background: #8d9a72;
}

/* The green dot reads as "open", so it has to move with the status rather than
   sit next to "Sold out" still looking available. */
.owl-development-single-enquiry__status--coming-soon .owl-development-single-enquiry__status-dot {
	background: var(--owl-gold);
}

.owl-development-single-enquiry__status--completed .owl-development-single-enquiry__status-dot {
	background: #9a9a9a;
}

.owl-development-single-enquiry__chevron {
	position: static;
	display: block;
	width: 18px;
	height: 18px;
	flex: 0 0 18px;
	/* Shorthand first, then the auto, or the reset wipes it and the chevron
	   falls back to the left whenever there is no status pill beside it. */
	margin: 0;
	margin-left: auto;
	background: url("../img/chevron-down.svg") center / 14px 8px no-repeat;
	filter: brightness(0) invert(1);
	transform: rotate(180deg);
	transition: transform 180ms ease;
}

.owl-development-single-enquiry:not([open]) .owl-development-single-enquiry__chevron {
	transform: rotate(0);
}

.owl-development-single-enquiry__panel {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 1;
	width: 100%;
	height: auto;
	padding: 72px 20px 20px;
	/* Top corners follow the pill above them. Square ones poked out past the
	   pill's curve and showed the nav behind, which is where the white edge and
	   the gold flash were coming from. The pill is 50px tall on a full radius,
	   so its corner is 25px. */
	border-radius: 25px 25px 15px 15px;
	/* The panel starts level with the pill now, so anything inside it that sits
	   high enough, the advisor icon in particular, escapes past the pill's curve
	   at the corner. Clip the panel to its own shape so nothing can. */
	overflow: hidden;
	/* The advisor and the hours scroll inside __scroll; Book A Viewing and Enquire
	   Now sit outside it and never move. Scrolling the panel as a whole only made
	   the last button reachable, and Jen's point was that you cannot SEE it. */
	display: flex;
	flex-direction: column;
	/* ⚠️ Without a cap this runs straight off the bottom of a short screen and
	   Enquire Now becomes unreachable — reported by Jen 2026-08-18 on a laptop.
	   development-single.js measures the real distance to the bottom of the screen
	   (and to the cookie banner, if one is over it) and sets max-height inline,
	   because that distance changes as the sticky nav above settles. This value is
	   only the no-JS floor: the panel sits 52px down once the nav is stuck, so
	   72px is that offset plus a 20px breathing gap. */
	max-height: calc(100svh - 72px);
	overscroll-behavior: contain;
	background: var(--owl-white);
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
	color: var(--owl-charcoal);
}

/* Those top margins space each block from the one above it. Whatever ends up
   first has nothing above it, so it should not carry one. Coming Soon has no
   advisor and no hours, which left its button floating 110px down the panel.
   The scroll wrapper is now the panel's first child, so the rule has to reach
   through it to whatever actually renders first. */
.owl-development-single-enquiry__panel > :first-child,
.owl-development-single-enquiry__scroll > :first-child {
	margin-top: 0;
}

.owl-development-single-enquiry__scroll {
	/* ⚠️ `min-height: 0` is what lets a flex item shrink below its content and
	   actually scroll. Without it this just grows and pushes the buttons out of
	   the panel again, which is the bug it exists to fix. */
	min-height: 0;
	flex: 1 1 auto;
	overflow-y: auto;
	overflow-x: hidden;
	overscroll-behavior: contain;
}

/* Coming Soon has neither an advisor nor hours, so the wrapper renders empty and
   would otherwise still take its share of the panel.
   ⚠️ NOT `:empty` — the template leaves newlines inside the wrapper, and `:empty`
   counts a whitespace text node as content, so it never matched. */
.owl-development-single-enquiry__scroll:not(:has(*)) {
	display: none;
}

.owl-development-single-enquiry__book-button,
.owl-development-single-enquiry__text-link,
.owl-development-single-enquiry__closed {
	flex-shrink: 0;
}

/*
 * The panel used to be a fixed 537px box with every child pinned to its own
 * offset, so any state with less in it left the difference as white space. A
 * Coming Soon development opened a 537px panel containing twelve characters,
 * which is what Owl reported. It now flows, and only the full Selling Now
 * version keeps the height the design specifies.
 */
.owl-development-single-enquiry__panel:has(.owl-development-single-enquiry__contact):has(.owl-development-single-enquiry__hours > *) {
	min-height: 537px;
}

.owl-development-single-enquiry__contact {
	position: relative;
	width: 100%;
	height: 42px;
}

.owl-development-single-enquiry__icon {
	position: absolute;
	display: inline-flex;
	width: 18px;
	min-width: 18px;
	height: 18px;
	align-items: center;
	justify-content: center;
	color: var(--owl-gold);
	line-height: 0;
}

/* Let each icon keep its own proportions. Forcing 100% of an 18px square
   stretched the 16x19 user glyph. */
.owl-development-single-enquiry__icon svg {
	display: block;
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 100%;
}

.owl-development-single-enquiry__contact-title,
.owl-development-single-enquiry__hours-heading p {
	margin: 0;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 800;
	line-height: 1.5;
}

.owl-development-single-enquiry__contact .owl-development-single-enquiry__icon {
	top: 12px;
	left: 0;
	width: 16px;
}

.owl-development-single-enquiry__contact-title {
	position: absolute;
	top: 0;
	left: 33px;
}

.owl-development-single-enquiry__contact-role {
	position: absolute;
	top: 21px;
	left: 34px;
	margin: 0;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 14px;
	font-weight: 400;
	line-height: 19px;
}

.owl-development-single-enquiry__phone {
	position: absolute;
	top: 12px;
	right: 2px;
	display: block;
	margin: 0;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	text-decoration: none;
}

.owl-development-single-enquiry__phone:hover,
.owl-development-single-enquiry__phone:focus {
	color: var(--owl-charcoal);
	text-decoration: none;
}

/* Relative, not static. The clock icon and the heading text inside are both
   absolutely positioned against this box, so putting it into normal flow as
   static handed them to the panel instead and the clipping swallowed them. */
.owl-development-single-enquiry__hours-heading {
	position: relative;
	width: 100%;
	height: 24px;
	margin-top: 24px;
}

.owl-development-single-enquiry__hours-heading .owl-development-single-enquiry__icon {
	top: 3px;
	left: 0;
}

.owl-development-single-enquiry__hours-heading p {
	position: absolute;
	top: 0;
	left: 32px;
}

.owl-development-single-enquiry__hours {
	position: static;
	display: grid;
	width: 100%;
	margin: 17px 0 0;
	gap: 10px;
}

.owl-development-single-enquiry__hours div {
	display: grid;
	grid-template-columns: 1fr auto;
	min-height: 24px;
	align-items: start;
	gap: 20px;
}

.owl-development-single-enquiry__hours dt,
.owl-development-single-enquiry__hours dd {
	margin: 0;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	line-height: 1.5;
}

.owl-development-single-enquiry__hours dt {
	font-weight: 400;
}

.owl-development-single-enquiry__hours dd {
	font-weight: 400;
	text-align: right;
}

.owl-development-single-enquiry__book-button {
	--owl-button-icon-gap: 15px;
	--owl-button-icon-width: 13px;
	--owl-button-icon-height: 20px;

	position: static;
	display: inline-flex;
	width: 100%;
	height: 45px;
	min-height: 45px;
	margin: 38px 0 0;
	padding: 10px 20px;
	align-items: center;
	gap: var(--owl-button-icon-gap);
	justify-content: center;
	border-radius: var(--owl-radius-pill);
	background: var(--owl-gold);
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	text-decoration: none;
}

.owl-development-single-enquiry__book-button::after {
	display: block;
	flex: 0 0 auto;
	width: var(--owl-button-icon-width);
	height: var(--owl-button-icon-height);
	background: currentColor;
	content: "";
	-webkit-mask: url("../img/chevron-right.svg") center / var(--owl-button-icon-width) var(--owl-button-icon-height) no-repeat;
	mask: url("../img/chevron-right.svg") center / var(--owl-button-icon-width) var(--owl-button-icon-height) no-repeat;
}

.owl-development-single-enquiry__book-button:hover,
.owl-development-single-enquiry__book-button:focus {
	background: var(--owl-gold);
	color: var(--owl-charcoal);
	text-decoration: none;
}

/* Sits where the Book a Viewing button would have been on a sold out
   development, so the panel below it keeps its spacing. */
/* 20px under the message, not the 38 it inherited. That 38 was drawn to separate
   the seven row hours table from the button, and it left a single line of text
   looking detached from the call to action right beneath it. */
.owl-development-single-enquiry__closed {
	position: static;
	width: 100%;
	margin: 0 0 20px;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	text-align: center;
}

/* The button spaces itself from the hours above it. When a message is what sits
   above it instead, the message owns that spacing. */
.owl-development-single-enquiry__closed + .owl-development-single-enquiry__book-button {
	margin-top: 0;
}

.owl-development-single-enquiry__text-link {
	position: static;
	display: flex;
	width: max-content;
	height: 24px;
	margin: 18px auto 0;
	align-items: center;
	gap: 15px;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	text-decoration: none;
	white-space: nowrap;
}

.owl-development-single-enquiry__text-link:hover,
.owl-development-single-enquiry__text-link:focus {
	color: var(--owl-charcoal);
	text-decoration: none;
}

.owl-development-single-enquiry__text-link-icon {
	display: inline-flex;
	width: 21px;
	height: 18px;
	align-items: center;
	justify-content: center;
	color: var(--owl-gold);
	line-height: 0;
}

.owl-development-single-enquiry__text-link-icon svg {
	display: block;
	width: 21px;
	height: 18px;
}

.owl-development-single-section {
	overflow: hidden;
	scroll-margin-top: 120px;
}

.owl-development-single-media-frame,
.owl-development-single-media-frame .elementor-widget-container,
.owl-development-single-media-frame :is(img, picture) {
	display: block;
	height: 100%;
}

.owl-development-single-media-frame img {
	width: 100%;
	object-fit: cover;
	object-position: center center;
}

.owl-development-single-intro-slider {
	position: relative;
	width: 100%;
	overflow: visible;
}

.owl-development-single-intro-slider__viewport {
	width: 100%;
	aspect-ratio: 600 / 401;
	overflow: hidden;
	border-radius: 15px;
	background: #f2edd9;
}

.owl-development-single-intro-slider__viewport .swiper-wrapper,
.owl-development-single-intro-slider__slide {
	height: 100%;
}

.owl-development-single-intro-slider__slide {
	margin: 0;
	overflow: hidden;
}

.owl-development-single-intro-slider__slide img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center center;
}

.owl-development-single-intro-slider__button {
	position: absolute;
	top: 50%;
	z-index: 2;
	display: inline-flex;
	width: 50px;
	height: 50px;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 100px;
	background: var(--owl-charcoal);
	box-shadow: none;
	cursor: pointer;
	transform: translateY(-50%);
}

.owl-development-single-intro-slider__button::before {
	display: block;
	width: 13px;
	height: 20px;
	flex: 0 0 13px;
	background: var(--owl-white);
	content: "";
	-webkit-mask: url("../img/chevron-right.svg") center / 13px 20px no-repeat;
	mask: url("../img/chevron-right.svg") center / 13px 20px no-repeat;
}

.owl-development-single-intro-slider__button:hover,
.owl-development-single-intro-slider__button:focus {
	background-color: var(--owl-charcoal);
	box-shadow: none;
	outline: none;
}

.owl-development-single-intro-slider__button--prev {
	left: 0;
	transform: translate(-50%, -50%) rotate(180deg);
}

.owl-development-single-intro-slider__button--next {
	right: 0;
	transform: translate(50%, -50%);
}

.owl-development-single-intro-slider__mobile-controls {
	display: none;
}

.owl-development-single-intro-slider__pagination {
	position: static;
	display: inline-flex;
	width: auto;
	align-items: center;
	gap: 8px;
	transform: none;
}

.owl-development-single-intro-slider__pagination .swiper-pagination-bullet {
	width: 12px;
	height: 12px;
	margin: 0;
	border: 1px solid var(--owl-charcoal);
	background: transparent;
	opacity: 1;
}

.owl-development-single-intro-slider__pagination .swiper-pagination-bullet-active {
	background: var(--owl-charcoal);
}

.owl-development-single-intro-slider__count {
	color: #767676;
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	white-space: nowrap;
}

.owl-development-single-local-carousel-section {
	overflow: hidden;
}

.owl-development-single-local-carousel-section > .e-con-inner {
	max-width: none;
}

.owl-development-single-local-carousel {
	--owl-local-area-slide-width: min(813px, calc(100vw - 40px));

	position: relative;
	width: 100%;
	overflow: visible;
}

.owl-development-single-local-carousel__viewport {
	overflow: visible;
}

.owl-development-single-local-carousel__viewport .swiper-wrapper {
	align-items: stretch;
}

/* A development with a single local area image is not a carousel, it is one
   picture sitting left with the rest of the row empty beside it. Centre it from
   the flex container rather than with auto margins on the slide, because the
   slide is a figure and Elementor zeroes figure margins at (0,4,1). */
.owl-development-single-local-carousel__viewport .swiper-wrapper:has(> .owl-development-single-local-carousel__slide:only-child) {
	justify-content: center;
}

.owl-development-single-local-carousel__slide {
	position: relative;
	width: var(--owl-local-area-slide-width);
	height: 520px;
	margin: 0;
	overflow: hidden;
	border-radius: 15px;
	background: #f2edd9;
}

.owl-development-single-local-carousel__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center center;
}

.owl-development-single-local-carousel__slide > .owl-development-single-local-carousel__image,
.owl-development-single-local-carousel__slide > .owl-gallery-video > .owl-development-single-local-carousel__image {
	height: 100%;
}

.owl-development-single-local-carousel__caption {
	position: absolute;
	left: 20px;
	bottom: 20px;
	display: inline-flex;
	min-height: 30px;
	align-items: center;
	justify-content: center;
	padding: 4px 17px;
	box-sizing: border-box;
	border-radius: 100px;
	backdrop-filter: blur(5px);
	background: rgba(255, 255, 255, 0.7);
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	white-space: nowrap;
}

.owl-development-single-local-carousel__button {
	position: absolute;
	top: 50%;
	z-index: 3;
	display: inline-flex;
	width: 50px;
	height: 50px;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 100px;
	background: var(--owl-charcoal);
	box-shadow: none;
	cursor: pointer;
}

.owl-development-single-local-carousel__button::before {
	display: block;
	width: 13px;
	height: 20px;
	background: var(--owl-white);
	content: "";
	-webkit-mask: url("../img/chevron-right.svg") center / 13px 20px no-repeat;
	mask: url("../img/chevron-right.svg") center / 13px 20px no-repeat;
}

.owl-development-single-local-carousel__button:hover,
.owl-development-single-local-carousel__button:focus {
	background: var(--owl-charcoal);
	box-shadow: none;
	outline: none;
}

.owl-development-single-local-carousel__button--prev {
	left: calc(50% - var(--owl-local-area-slide-width) / 2);
	transform: translate(-50%, -50%) rotate(180deg);
}

.owl-development-single-local-carousel__button--next {
	right: calc(50% - var(--owl-local-area-slide-width) / 2);
	transform: translate(50%, -50%);
}

/* Plot image slider is swipeable on touch, so hide the arrows on tablet/mobile */
@media (max-width: 1024px) {
	.owl-plot-single-gallery .owl-development-single-local-carousel__button {
		display: none;
	}
}

.owl-development-single-local-amenities-section {
	overflow: hidden;
}

.owl-development-single-local-amenities-section > .e-con-inner {
	max-width: none;
}

.owl-development-local-amenities-map {
	position: relative;
	width: 100%;
	height: 693px;
	min-height: 693px;
	overflow: hidden;
	background: var(--owl-cream);
	isolation: isolate;
}

.owl-development-local-amenities-map__canvas,
.owl-development-local-amenities-map__canvas .maplibregl-map,
.owl-development-local-amenities-map__canvas .leaflet-container {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.owl-local-amenities-map__zoom {
	position: absolute;
	bottom: 20px;
	left: 20px;
	z-index: 3;
	display: flex;
	gap: 20px;
	pointer-events: auto;
}

.owl-local-amenities-map__zoom-control {
	position: relative;
	display: inline-flex;
	width: 50px;
	min-width: 50px;
	height: 50px;
	min-height: 50px;
	padding: 0;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 50%;
	background: var(--owl-charcoal);
	color: var(--owl-white);
	box-shadow: none;
	cursor: pointer;
	appearance: none;
}

.owl-local-amenities-map__zoom-control::before,
.owl-local-amenities-map__zoom-control--in::after {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 14px;
	height: 2px;
	border-radius: 2px;
	background: currentColor;
	content: "";
	transform: translate(-50%, -50%);
}

.owl-local-amenities-map__zoom-control--in::after {
	transform: translate(-50%, -50%) rotate(90deg);
}

.owl-local-amenities-map__zoom-control:hover,
.owl-local-amenities-map__zoom-control:focus {
	background: var(--owl-charcoal);
	color: var(--owl-white);
	outline: none;
	box-shadow: none;
}

.owl-development-local-amenities-map__panel {
	position: absolute;
	top: 60px;
	left: 50%;
	z-index: 2;
	display: flex;
	width: calc(100% - 40px);
	max-width: 1245px;
	min-height: 65px;
	align-items: center;
	gap: 15px;
	padding: 10px;
	box-sizing: border-box;
	border-radius: 100px;
	background: var(--owl-white);
	box-shadow: 0 0 15px rgba(0, 0, 0, 0.08);
	transform: translateX(-50%);
}

.owl-development-local-amenities-map .owl-development-local-amenities-map__heading {
	margin: 0;
	padding-left: 15px;
	flex: 0 0 auto;
	color: var(--owl-charcoal);
	font-family: var(--owl-display-font);
	font-size: 28px;
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 0.01em;
	white-space: nowrap;
}

.owl-development-local-amenities-map__filters {
	display: flex;
	flex: 0 1 auto;
	min-width: 0;
	align-items: center;
	gap: 10px;
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior-x: contain;
	scrollbar-width: none;
	touch-action: pan-x;
}

.owl-development-local-amenities-map__filters::-webkit-scrollbar {
	display: none;
}

.owl-development-local-amenities-map .owl-development-local-amenities-map__filter {
	display: inline-flex;
	min-width: 133px;
	min-height: 45px;
	align-items: center;
	justify-content: center;
	padding: 10px 20px;
	box-sizing: border-box;
	border: 1px solid var(--owl-line);
	border-radius: 100px;
	background: var(--owl-white);
	background-color: var(--owl-white);
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: normal;
	white-space: nowrap;
	cursor: pointer;
}

.owl-development-local-amenities-map .owl-development-local-amenities-map__filter:hover,
.owl-development-local-amenities-map .owl-development-local-amenities-map__filter:focus {
	border-color: var(--owl-line);
	background: var(--owl-white);
	background-color: var(--owl-white);
	color: var(--owl-charcoal);
	outline: none;
	box-shadow: none;
	transform: none;
}

.owl-development-local-amenities-map .owl-development-local-amenities-map__filter.is-active,
.owl-development-local-amenities-map .owl-development-local-amenities-map__filter.is-active:hover,
.owl-development-local-amenities-map .owl-development-local-amenities-map__filter.is-active:focus {
	border-color: var(--owl-charcoal);
	background: var(--owl-charcoal);
	background-color: var(--owl-charcoal);
	color: var(--owl-white);
}

.owl-local-amenities-marker {
	display: block;
	width: 31px;
	height: 40px;
	pointer-events: auto;
}

.owl-local-amenities-marker span:not(.owl-local-amenities-marker__label) {
	display: block;
	width: 100%;
	height: 100%;
}

.owl-local-amenities-marker--place span {
	background: var(--owl-gold);
	filter: drop-shadow(0 8px 14px rgba(0, 0, 0, 0.18));
	-webkit-mask: url("../img/map-marker-development.svg") center / contain no-repeat;
	mask: url("../img/map-marker-development.svg") center / contain no-repeat;
}

.owl-local-amenities-marker--home {
	position: relative;
	width: 31px;
	height: 31px;
}

.owl-local-amenities-marker__label {
	position: absolute;
	top: calc(100% + 2px);
	left: 50%;
	transform: translateX(-50%);
	white-space: nowrap;
	font-family: var(--owl-text-font);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.1;
	color: var(--owl-charcoal);
	text-shadow: 0 0 3px #faf8f0, 0 0 3px #faf8f0, 0 0 4px #faf8f0;
	pointer-events: none;
}

.owl-local-amenities-marker--home span:not(.owl-local-amenities-marker__label) {
	background: var(--owl-charcoal);
	-webkit-mask: url("../img/house-solid.svg") center / contain no-repeat;
	mask: url("../img/house-solid.svg") center / contain no-repeat;
}

.owl-amenities-popup .maplibregl-popup-content {
	padding: 14px 38px 14px 18px;
	border-radius: 8px;
	background: var(--owl-white);
	box-shadow: 0 0 7.5px rgba(0, 0, 0, 0.1);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--owl-charcoal);
}

.owl-amenities-popup__body {
	display: flex;
	flex-direction: column;
	gap: 3px;
}

.owl-amenities-popup__name {
	font-weight: 600;
}

.owl-amenities-popup__distance {
	font-size: 13px;
	color: rgba(var(--owl-ink-rgb), 0.6);
}

.owl-amenities-popup__description {
	max-width: 240px;
	margin: 5px 0 0;
	font-size: 14px;
	line-height: 1.4;
	color: rgba(var(--owl-ink-rgb), 0.8);
}

.owl-amenities-popup .owl-amenities-popup__link {
	display: inline-flex;
	align-self: flex-start;
	margin-top: 10px;
	align-items: center;
	gap: 10px;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1;
	text-decoration: none;
	outline: none;
}

.owl-amenities-popup .owl-amenities-popup__link::after {
	display: block;
	width: 13px;
	height: 20px;
	flex: 0 0 13px;
	background: var(--owl-gold);
	content: "";
	-webkit-mask: url("../img/chevron-right.svg") center / contain no-repeat;
	mask: url("../img/chevron-right.svg") center / contain no-repeat;
}

.owl-amenities-popup .owl-amenities-popup__link:hover,
.owl-amenities-popup .owl-amenities-popup__link:focus {
	color: var(--owl-charcoal);
	text-decoration: none;
}

.owl-amenities-popup .owl-amenities-popup__link:focus-visible {
	border-radius: 4px;
	outline: 2px solid var(--owl-gold);
	outline-offset: 3px;
}

.owl-amenities-popup .maplibregl-popup-close-button {
	top: 8px;
	right: 8px;
	display: flex;
	width: 22px;
	min-width: 22px;
	height: 22px;
	padding: 0;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 50%;
	background: var(--owl-charcoal) url("../img/times.svg") center / 9px 9px no-repeat;
	color: transparent;
	font-size: 0;
	line-height: 0;
}

.owl-amenities-popup .maplibregl-popup-close-button:hover,
.owl-amenities-popup .maplibregl-popup-close-button:focus {
	background: var(--owl-charcoal) url("../img/times.svg") center / 9px 9px no-repeat;
	color: transparent;
	box-shadow: none;
	outline: none;
}

.owl-amenities-popup .maplibregl-popup-tip {
	border-top-color: var(--owl-white);
	border-bottom-color: var(--owl-white);
}

/* Key Features icons: uniform 30x30, never squeezed by the flex row next to longer text */
.owl-development-single-feature-icon {
	flex: 0 0 auto;
}

.owl-development-single-feature-icon,
.owl-development-single-feature-icon .elementor-widget-container,
.owl-development-single-feature-icon img {
	width: 30px;
	max-width: 30px;
	height: 30px;
}

.owl-development-local-amenities-map .maplibregl-ctrl-bottom-left,
.owl-development-local-amenities-map .maplibregl-ctrl-bottom-right,
.owl-development-local-amenities-map .leaflet-bottom {
	z-index: 1;
}

.owl-development-local-amenities-map .maplibregl-ctrl-attrib,
.owl-development-local-amenities-map .leaflet-control-attribution {
	border-radius: 100px;
	background: rgba(255, 255, 255, 0.72);
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 11px;
}

.owl-development-single-overview-actions {
	--owl-development-overview-action-height: 45px;
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	align-items: center;
	justify-content: flex-start;
	gap: 35px;
	text-align: left;
}

.owl-development-single-overview-actions .elementor-widget-button {
	width: auto;
}

.owl-development-single-homes-panel {
	border-radius: 15px;
	background: var(--owl-cream);
}

.owl-development-plots {
	width: 100%;
}

.owl-development-plots__toolbar {
	display: flex;
	margin-bottom: 40px;
	align-items: center;
	justify-content: space-between;
	gap: 30px;
}

.owl-development-plots__mobile-filter-toggle {
	display: none;
}

.owl-development-plots__filters {
	display: flex;
	flex: 1;
	align-items: center;
	gap: 15px;
}

.owl-development-plots__panel-header,
.owl-development-plots__submit,
.owl-development-plots__clear {
	display: none;
}

.owl-development-plots__fields {
	display: flex;
	flex: 1;
	align-items: center;
	gap: 15px;
}

.owl-development-plots__count {
	display: inline-flex;
	width: 25px;
	height: 25px;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--owl-gold);
	border-radius: 100px;
	color: var(--owl-charcoal);
	font-size: 16px;
	line-height: 1;
}

.owl-development-plots[data-active-count="0"] .owl-development-plots__count {
	display: none;
}

.owl-development-plots__filter-field {
	position: relative;
	display: block;
	min-width: 0;
	flex: 1 1 0;
}

.owl-development-plots__filter-field::after {
	position: absolute;
	top: 50%;
	right: 20px;
	width: 13px;
	height: 20px;
	background: url("../img/chevron-right.svg") center / contain no-repeat;
	content: "";
	pointer-events: none;
	transform: translateY(-50%) rotate(90deg);
}

.owl-development-plots__filter-field select {
	display: block;
	width: 100%;
	min-width: 0;
	min-height: 50px;
	padding: 0 53px 0 20px;
	border: 1px solid var(--owl-line);
	border-radius: var(--owl-radius-pill);
	appearance: none;
	-webkit-appearance: none;
	background: var(--owl-white);
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1;
	box-shadow: none;
	cursor: pointer;
}

.owl-development-plots__filter-field select::-ms-expand {
	display: none;
}

.owl-development-plots__filter-field select:hover,
.owl-development-plots__filter-field select:focus {
	border-color: var(--owl-line);
	background: var(--owl-white);
	color: var(--owl-charcoal);
	outline: none;
	box-shadow: none;
}

.owl-development-plots__filter-field.has-value select {
	font-weight: 800;
}

.owl-development-plots__toggle {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1;
	white-space: nowrap;
}

.owl-development-plots__toggle input {
	width: 20px;
	height: 20px;
	margin: 0;
	flex: 0 0 20px;
	appearance: none;
	-webkit-appearance: none;
	border: 1px solid #767676;
	border-radius: 50%;
	background: transparent;
	cursor: pointer;
}

.owl-development-plots__toggle input:checked {
	border-color: var(--owl-gold);
	background: radial-gradient(circle, var(--owl-gold) 0 45%, transparent 48%);
}

.owl-development-plots__sort-row {
	display: flex;
	margin: -20px 0 30px;
	align-items: center;
}

/* Not a filter, so not a pill. A visible "Sort by" label with a plain dropdown
   beside it, so it reads as a control on the results rather than another way to
   narrow them. */
.owl-development-plots__sort {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
}

.owl-development-plots__sort-label {
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	line-height: 1;
	white-space: nowrap;
}



.owl-development-plots__sort select {
	display: block;
	/* A select is a flex item here, so it shrinks below its own text and clips the
	   longest option. Size it to the content and refuse to shrink. */
	flex: 0 0 auto;
	width: auto;
	min-width: max-content;
	min-height: 30px;
	padding: 0 26px 0 0;
	border: 0;
	border-radius: 0;
	appearance: none;
	-webkit-appearance: none;
	/* The chevron rides on the select itself. Hanging it off the wrapper put it on
	   top of the text once the select sized to its longest option. */
	background: url("../img/chevron-down.svg") right center / 14px 8px no-repeat;
	color: var(--owl-charcoal);
	cursor: pointer;
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 700;
	line-height: 1;
	box-shadow: none;
	cursor: pointer;
}

.owl-development-plots__sort select::-ms-expand {
	display: none;
}

.owl-development-plots__sort select:hover,
.owl-development-plots__sort select:focus {
	background-color: transparent;
	color: var(--owl-charcoal);
	outline: none;
	box-shadow: none;
}




.owl-development-plots__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 40px;
}

.owl-development-plot-card {
	position: relative;
	min-width: 0;
	overflow: hidden;
	border-radius: 15px;
	background: var(--owl-white);
	box-shadow: 0 10px 35px rgba(var(--owl-ink-rgb), 0.08);
	transition: box-shadow 180ms ease, transform 180ms ease;
}

.owl-development-plot-card:hover {
	box-shadow: 0 14px 40px rgba(var(--owl-ink-rgb), 0.14);
}

.owl-development-plot-card[hidden] {
	display: none;
}

.owl-development-plot-card__media {
	position: relative;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: #f2edd9;
}

.owl-development-plot-card__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center center;
}

.owl-development-plot-card__status {
	position: absolute;
	top: 15px;
	left: 15px;
	display: inline-flex;
	min-height: 35px;
	margin: 0;
	padding: 10px 20px;
	align-items: center;
	justify-content: center;
	border-radius: var(--owl-radius-pill);
	background: var(--owl-white);
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 14px;
	font-weight: 400;
	line-height: 1;
	white-space: nowrap;
}

/* Sold takes the site plan's grey so the two surfaces agree, leaving the white
   pill to mean available on its own. */
.owl-development-plot-card[data-plot-status="sold"] .owl-development-plot-card__status {
	background: var(--owl-sold);
	color: var(--owl-charcoal);
}

.owl-development-plot-card__offer {
	display: flex;
	min-height: 45px;
	margin: 0;
	padding: 10px 20px;
	align-items: center;
	justify-content: center;
	border-top: 2px solid var(--owl-white);
	background: var(--owl-gold);
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 800;
	line-height: 1.2;
	text-align: center;
}

.owl-development-plot-card__body {
	padding: 30px;
}

.owl-development-plot-card__distance {
	margin: 0 0 14px;
	color: #727272;
	font-family: var(--owl-text-font);
	font-size: 14px;
	font-weight: 400;
	line-height: 1;
}

.owl-development-plot-card__title {
	margin: 0 0 20px;
	color: var(--owl-charcoal);
	font-family: var(--owl-display-font);
	font-size: 28px;
	font-weight: 400;
	line-height: 1.2;
}

.owl-development-plot-card__title-name,
.owl-development-plot-card__title-plot {
	display: block;
}

.owl-development-plot-card__title-plot {
	font-family: var(--owl-text-font);
	font-size: 20px;
	font-weight: 400;
	line-height: 1.2;
}

.owl-development-plot-card__details {
	display: grid;
	gap: 12px;
	margin-bottom: 30px;
}

.owl-development-plot-card__detail {
	display: flex;
	margin: 0;
	align-items: center;
	gap: 12px;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.2;
}

.owl-development-plot-card__detail span {
	display: block;
	width: 20px;
	height: 20px;
	flex: 0 0 20px;
	background: var(--owl-gold);
	-webkit-mask: url("../img/bed.svg") center / contain no-repeat;
	mask: url("../img/bed.svg") center / contain no-repeat;
}

.owl-development-plot-card__detail--type span {
	-webkit-mask-image: url("../img/home.svg?v=2");
	mask-image: url("../img/home.svg?v=2");
}

.owl-development-plot-card__detail--parking span {
	-webkit-mask-image: url("../img/car.svg");
	mask-image: url("../img/car.svg");
}

.owl-development-plot-card__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
}

.owl-development-plot-card__footer > .owl-development-plot-card__arrow {
	margin-left: auto;
}

.owl-development-plot-card__price {
	margin: 0;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 24px;
	font-weight: 800;
	line-height: 1;
}

.owl-development-plot-card__arrow {
	display: flex;
	width: 40px;
	height: 40px;
	flex: 0 0 40px;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--owl-gold) url("../img/chevron-right-charcoal.svg") center / 13px 20px no-repeat;
	text-decoration: none;
}

.owl-development-plot-card__arrow:hover,
.owl-development-plot-card__arrow:focus {
	background-color: var(--owl-gold);
}

.owl-development-plot-card__arrow::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}

.owl-development-plots .owl-development-plots__load-more {
	display: flex;
	width: 160px;
	min-height: 45px;
	margin: 60px auto 0;
	padding: 10px 20px;
	align-self: center;
	align-items: center;
	justify-content: center;
	justify-self: center;
	border: 0;
	border-radius: var(--owl-radius-pill);
	background: var(--owl-charcoal);
	color: var(--owl-white);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1;
	text-decoration: none;
	box-shadow: none;
	cursor: pointer;
}

/*
 * The icon sits after the label, matching every other button on the site.
 *
 * The markup puts the icon first, and this wrapper was inline-flex with no
 * direction, so it fell back to row and the plus landed on the left. Same fault
 * as .owl-plot-single-image-cta__button further down this file.
 */
.owl-development-plots .owl-development-plots__load-more-content {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-direction: row-reverse;
	gap: 15px;
}

.owl-development-plots .owl-development-plots__load-more-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 0;
}

.owl-development-plots .owl-development-plots__load-more-icon svg {
	display: block;
	width: 16px;
	height: 16px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
}

.owl-development-plots .owl-development-plots__load-more:hover,
.owl-development-plots .owl-development-plots__load-more:focus {
	background: var(--owl-charcoal);
	color: var(--owl-white);
	text-decoration: none;
}

.owl-development-plots .owl-development-plots__load-more[hidden] {
	display: none;
}

.owl-plot-single-similar {
	/* 100vw includes the scrollbar, so subtract its measured width (set on <html>
	   by the carousel script) or the rail overhangs the content area and eats the
	   right-hand gutter on browsers showing a classic scrollbar. */
	--owl-plot-similar-viewport: calc(100vw - var(--owl-scrollbar-width, 0px));
	--owl-plot-similar-offset: max(20px, calc((var(--owl-plot-similar-viewport) - 1250px) / 2 + 20px));

	overflow: hidden;
	padding: 100px 0;
	background: var(--owl-white);
}

.owl-plot-single-similar__inner {
	display: grid;
	width: calc(var(--owl-plot-similar-viewport) - var(--owl-plot-similar-offset));
	margin-left: var(--owl-plot-similar-offset);
	grid-template-columns: 390px minmax(0, 1fr);
	gap: 38px;
	align-items: center;
}

.owl-plot-single-similar__copy {
	width: 390px;
	max-width: 100%;
	position: relative;
	z-index: 2;
	background: var(--owl-white);
}

.owl-plot-single-similar__overline {
	margin: 0 0 10px;
	color: var(--owl-gold);
	font-family: var(--owl-text-font);
	font-size: 18px;
	font-weight: 400;
	line-height: 1.2;
}

.owl-plot-single-similar__heading {
	margin: 0 0 20px;
	color: var(--owl-charcoal);
	font-family: var(--owl-display-font);
	font-size: 45px;
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 0.01em;
}

.owl-plot-single-similar__text {
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 18px;
	font-weight: 400;
	line-height: 1.45;
}

.owl-plot-single-similar__text p {
	margin: 0;
}

.owl-plot-single-similar__controls {
	display: flex;
	margin-top: 25px;
	align-items: center;
	gap: 15px;
}

.owl-plot-single-similar .owl-plot-single-similar__button {
	display: inline-flex;
	width: 50px;
	height: 50px;
	padding: 0;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 50%;
	background: var(--owl-charcoal);
	box-shadow: none;
	cursor: pointer;
	appearance: none;
}

.owl-plot-single-similar .owl-plot-single-similar__button::before {
	display: block;
	width: 13px;
	height: 20px;
	background: var(--owl-white);
	content: "";
	-webkit-mask: url("../img/chevron-right.svg") center / contain no-repeat;
	mask: url("../img/chevron-right.svg") center / contain no-repeat;
}

.owl-plot-single-similar .owl-plot-single-similar__button--prev::before {
	transform: rotate(180deg);
}

.owl-plot-single-similar .owl-plot-single-similar__button:hover,
.owl-plot-single-similar .owl-plot-single-similar__button:focus {
	border: 0;
	background: var(--owl-charcoal);
	outline: none;
	box-shadow: none;
	transform: none;
}

.owl-plot-single-similar .owl-plot-single-similar__button.swiper-button-disabled {
	opacity: 0.3;
	cursor: default;
	pointer-events: none;
}

.owl-plot-single-similar .owl-plot-single-similar__button.swiper-button-lock {
	display: none;
}

.owl-plot-single-similar__carousel,
.owl-plot-single-similar__viewport {
	min-width: 0;
}

.owl-plot-single-similar__carousel {
	overflow: hidden;
}

.owl-plot-single-similar__viewport {
	overflow: visible;
}

.owl-plot-single-similar__slide {
	width: 387px;
	height: auto;
}

.owl-plot-single-similar__card {
	display: flex;
	width: 387px;
	min-height: 619px;
	flex-direction: column;
	border-radius: 10px;
	background: var(--owl-cream);
	box-shadow: none;
}

.owl-plot-single-similar__card .owl-development-plot-card__media {
	height: 300px;
	aspect-ratio: auto;
	border-radius: 10px 10px 0 0;
}

.owl-plot-single-similar__card .owl-development-plot-card__status {
	display: none;
}

.owl-plot-single-similar__card .owl-development-plot-card__offer {
	position: relative;
	z-index: 1;
	min-height: 45px;
	margin-top: -45px;
	border-top: 2px solid var(--owl-cream);
	font-size: 16px;
	line-height: 1;
}

.owl-plot-single-similar__card .owl-development-plot-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 20px 30px 30px;
}

.owl-plot-single-similar__card .owl-development-plot-card__distance {
	margin-bottom: 14px;
}

.owl-plot-single-similar__card .owl-development-plot-card__title {
	margin-bottom: 24px;
	line-height: 35px;
}

.owl-plot-single-similar__card .owl-development-plot-card__title-name {
	font-size: 28px;
	line-height: 35px;
}

.owl-plot-single-similar__card .owl-development-plot-card__title-plot {
	font-size: 20px;
	line-height: 35px;
}

.owl-plot-single-similar__card .owl-development-plot-card__details {
	gap: 13px;
	margin-bottom: 28px;
}

.owl-plot-single-similar__card .owl-development-plot-card__detail {
	gap: 15px;
	font-size: 16px;
	line-height: 1.2;
}

.owl-plot-single-similar__card .owl-development-plot-card__footer {
	margin-top: auto;
}

.owl-development-plots-empty {
	margin: 0;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 18px;
	line-height: 1.4;
}

.owl-development-plots__empty {
	margin: 0;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 18px;
	line-height: 1.4;
}

.owl-development-site-plan {
	display: grid;
	width: 100%;
	aspect-ratio: 7 / 4;
	min-height: 620px;
	overflow: hidden;
	grid-template-columns: minmax(420px, 36.5%) minmax(0, 1fr);
	border-radius: 0;
	background: var(--owl-cream);
	box-shadow: none;
}

.owl-development-single-plan > .e-con-inner {
	position: relative;
}

@media (min-width: 1025px) {
	.owl-development-single-plan > .e-con-inner::before {
		position: absolute;
		top: 0;
		bottom: 0;
		left: calc(max(420px, 36.5%) + var(--owl-container-gutter));
		z-index: 3;
		width: 1px;
		background: var(--owl-line);
		content: "";
		pointer-events: none;
	}
}

@media (min-width: 1200px) {
	.owl-development-site-plan {
		/* Bleed to the right edge of the window. Measuring from --owl-container-width
		   assumed a 1250px container while Elementor's is 1210, so the map stopped
		   7px short of the edge. A negative margin derived from the element's own
		   containing block lands exactly, whatever the container is set to. */
		width: auto;
		margin-right: min(0px, calc((100% - 100vw) / 2));
		min-height: 826px;
		margin-left: 0;
		grid-template-columns: 528px minmax(0, 1fr);
		aspect-ratio: auto;
	}

	.owl-development-single-plan > .e-con-inner::before {
		left: calc(528px + var(--owl-container-gutter));
	}
}

.owl-development-site-plan__sidebar {
	display: flex;
	min-width: 0;
	padding: 75px 60px 60px 0;
	flex-direction: column;
}

.owl-development-site-plan__sidebar-copy {
	margin-bottom: 28px;
}

.owl-development-site-plan__heading {
	margin: 0;
	color: var(--owl-charcoal);
	font-family: var(--owl-display-font);
	font-size: 35px;
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 0.01em;
	white-space: nowrap;
}

.owl-development-site-plan__tabs {
	display: flex;
	width: 316px;
	max-width: 100%;
	min-height: 45px;
	margin-bottom: 27px;
	padding: 0;
	overflow: hidden;
	border: 1px solid var(--owl-line);
	border-radius: var(--owl-radius-pill);
	background: var(--owl-white);
}

.owl-development-site-plan__tab {
	display: inline-flex;
	min-width: 0;
	flex: 1 1 0;
	align-items: center;
	justify-content: center;
	gap: 10px;
	border: 0;
	border-radius: 0;
	background: var(--owl-white);
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 14px;
	font-weight: 400;
	line-height: 1;
	box-shadow: none;
	cursor: pointer;
}

.owl-development-site-plan__tab span {
	display: block;
	width: 18px;
	height: 18px;
	background: var(--owl-gold);
	content: "";
}

.owl-development-site-plan__tab--key span {
	-webkit-mask: url("../img/map-marker-alt.svg") center / contain no-repeat;
	mask: url("../img/map-marker-alt.svg") center / contain no-repeat;
}

.owl-development-site-plan__tab--filters span {
	-webkit-mask: url("../img/filter-sliders.svg") center / contain no-repeat;
	mask: url("../img/filter-sliders.svg") center / contain no-repeat;
}

.owl-development-site-plan__tab:hover,
.owl-development-site-plan__tab:focus {
	background: var(--owl-white);
	color: var(--owl-charcoal);
	outline: none;
	box-shadow: none;
}

.owl-development-site-plan .owl-development-site-plan__tabs .owl-development-site-plan__tab:not(.is-active),
.owl-development-site-plan .owl-development-site-plan__tabs .owl-development-site-plan__tab:not(.is-active):hover,
.owl-development-site-plan .owl-development-site-plan__tabs .owl-development-site-plan__tab:not(.is-active):focus {
	background: var(--owl-white);
	color: var(--owl-charcoal);
}

.owl-development-site-plan__tab:first-child {
	border-radius: var(--owl-radius-pill) 0 0 var(--owl-radius-pill);
}

.owl-development-site-plan__tab:last-child {
	border-radius: 0 var(--owl-radius-pill) var(--owl-radius-pill) 0;
}

.owl-development-site-plan__tab.is-active {
	background: var(--owl-charcoal);
	color: var(--owl-white);
	font-weight: 400;
}

.owl-development-site-plan .owl-development-site-plan__tabs .owl-development-site-plan__tab.is-active,
.owl-development-site-plan__tab.is-active:hover,
.owl-development-site-plan__tab.is-active:focus {
	background: var(--owl-charcoal);
	color: var(--owl-white);
}

.owl-development-site-plan__panel {
	min-height: 0;
}

.owl-development-site-plan__key-list {
	display: grid;
	margin: 0;
	padding: 0;
	gap: 20px;
	list-style: none;
	/* Oakwood lists 21 house types, which ran the key to 1240px and stretched the
	   plan frame to match, leaving the drawing floating in dead space. Cap it so
	   the section is only as tall as the plan itself and scroll the overflow. */
	max-height: 620px;
	overflow-y: auto;
	overscroll-behavior: contain;
	padding-right: 6px;
}

.owl-development-site-plan__key-item {
	display: grid;
	width: 100%;
	min-height: 40px;
	padding: 0;
	grid-template-columns: 16px minmax(0, 1fr);
	align-items: center;
	gap: 16px;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.2;
	text-align: left;
	box-shadow: none;
	cursor: pointer;
}

.owl-development-site-plan .owl-development-site-plan__key-list .owl-development-site-plan__key-item,
.owl-development-site-plan .owl-development-site-plan__key-list .owl-development-site-plan__key-item.is-active {
	min-height: 40px;
	border-radius: 0;
	background: transparent;
	color: var(--owl-charcoal);
}

.owl-development-site-plan__key-item:hover,
.owl-development-site-plan__key-item:focus {
	background-color: transparent;
	color: var(--owl-charcoal);
	outline: none;
	box-shadow: none;
}

.owl-development-site-plan__key-dot {
	display: block;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: var(--plot-colour, var(--owl-charcoal));
}

.owl-development-site-plan__key-item > span:last-child {
	display: grid;
	width: 100%;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	/* The key panel is narrow at every viewport, so long names need the room. */
	gap: 12px;
}

.owl-development-site-plan__key-item strong {
	margin: 0;
	font-size: 20px;
	font-weight: 400;
	/*
	 * A ratio rather than 40px so a long name like Barnes End Terrace wraps to a
	 * second line instead of overflowing its grid track and colliding with the
	 * nowrap bedroom count. The row keeps its 40px min-height and centres, so
	 * single-line entries sit exactly where they did. This is deliberately not
	 * behind a breakpoint: the key panel is narrow at every viewport.
	 */
	line-height: 1.25;
	/*
	 * The name inherits white-space: nowrap from an ancestor, which is what kept
	 * a long name like Barnes End Terrace on one line and overflowing into the
	 * bedroom count. Resetting it here is the fix; the line-height and wrapping
	 * below only matter once the text is allowed to break at all.
	 */
	white-space: normal;
	/*
	 * break-word rather than anywhere: `anywhere` also shrinks the element's
	 * min-content contribution, which lets the grid track collapse and can break
	 * a name mid-word. break-word only splits a word as a last resort.
	 */
	overflow-wrap: break-word;
}

.owl-development-site-plan__key-item span span {
	display: block;
	font-size: 16px;
	line-height: 1.2;
	white-space: nowrap;
}


@media (min-width: 1025px) and (max-width: 1199px) {
	.owl-development-site-plan {
		min-height: 720px;
		grid-template-columns: 480px minmax(0, 1fr);
		aspect-ratio: auto;
	}

	.owl-development-single-plan > .e-con-inner::before {
		left: calc(480px + var(--owl-container-gutter));
	}

	.owl-development-site-plan__sidebar {
		padding: 60px 40px 45px;
	}

	.owl-development-site-plan__sidebar-copy {
		margin-bottom: 25px;
	}

	.owl-development-site-plan__tabs {
		min-height: 40px;
		margin-bottom: 25px;
	}

	.owl-development-site-plan__key-item,
	.owl-development-site-plan .owl-development-site-plan__key-list .owl-development-site-plan__key-item,
	.owl-development-site-plan .owl-development-site-plan__key-list .owl-development-site-plan__key-item.is-active {
		min-height: 40px;
		gap: 15px;
	}

	.owl-development-site-plan__key-item > span:last-child {
		gap: 15px;
	}
}

.owl-development-site-plan__empty,
.owl-development-site-plan__filters-note {
	margin: 0;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
}

.owl-development-site-plan__filters {
	display: grid;
	gap: 15px;
}

.owl-development-site-plan__filter-field {
	position: relative;
	display: block;
}

.owl-development-site-plan__filter-field::after {
	position: absolute;
	top: 50%;
	right: 18px;
	width: 10px;
	height: 18px;
	background: url("../img/chevron-right.svg") center / contain no-repeat;
	content: "";
	pointer-events: none;
	transform: translateY(-50%) rotate(90deg);
}

.owl-development-site-plan__filter-field select {
	display: block;
	width: 100%;
	min-height: 45px;
	padding: 0 45px 0 18px;
	border: 1px solid var(--owl-line);
	border-radius: var(--owl-radius-pill);
	appearance: none;
	-webkit-appearance: none;
	background: var(--owl-white);
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 14px;
	font-weight: 400;
	line-height: 1;
	box-shadow: none;
	cursor: pointer;
}

.owl-development-site-plan__filter-field select:hover,
.owl-development-site-plan__filter-field select:focus {
	border-color: var(--owl-line);
	background: var(--owl-white);
	color: var(--owl-charcoal);
	outline: none;
	box-shadow: none;
}

.owl-development-site-plan__filter-field.has-value select {
	font-weight: 800;
}

.owl-development-site-plan__clear {
	display: inline-flex;
	min-height: 35px;
	padding: 0;
	align-items: center;
	justify-content: center;
	justify-self: center;
	gap: 10px;
	border: 0;
	background: transparent;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 14px;
	font-weight: 400;
	line-height: 1;
	box-shadow: none;
	cursor: pointer;
}

.owl-development-site-plan .owl-development-site-plan__clear {
	width: auto;
	min-height: 35px;
	border-radius: 0;
	background: transparent;
	color: var(--owl-charcoal);
}

.owl-development-site-plan__clear::after {
	display: block;
	width: 12px;
	height: 12px;
	background: var(--owl-gold);
	content: "";
	-webkit-mask: url("../img/times.svg") center / contain no-repeat;
	mask: url("../img/times.svg") center / contain no-repeat;
}

.owl-development-site-plan__clear:hover,
.owl-development-site-plan__clear:focus {
	border: 0;
	background: transparent;
	color: var(--owl-charcoal);
	outline: none;
	box-shadow: none;
	text-decoration: none;
}

.owl-development-site-plan__canvas {
	position: relative;
	min-width: 0;
	background: var(--owl-cream);
}

.owl-development-site-plan__notice {
	position: absolute;
	top: 20px;
	right: 20px;
	z-index: 3;
	display: inline-flex;
	min-height: 50px;
	margin: 0;
	padding: 5px 20px;
	align-items: center;
	justify-content: center;
	gap: 20px;
	border-radius: var(--owl-radius-pill);
	background: var(--owl-white);
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 40px;
	box-shadow: 0 6px 18px rgba(var(--owl-ink-rgb), 0.08);
}

.owl-development-site-plan__notice::before {
	display: block;
	width: 16px;
	height: 16px;
	flex: 0 0 16px;
	border-radius: 50%;
	background: #b0b0b0;
	content: "";
}

.owl-development-site-plan__empty {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 3;
	width: max-content;
	max-width: calc(100% - 40px);
	margin: 0;
	padding: 15px 30px;
	transform: translate(-50%, -50%);
	border-radius: var(--owl-radius-pill);
	background: var(--owl-white);
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 20px;
	text-align: center;
	box-shadow: 0 6px 18px rgba(var(--owl-ink-rgb), 0.08);
}

.owl-development-site-plan__empty[hidden] {
	display: none;
}

.owl-development-site-plan__image-wrap {
	position: relative;
	width: 100%;
	height: 100%;
	min-height: 0;
	/* Size container, so the stage below can do its own contain maths in cqw/cqh. */
	container-type: size;
	overflow: hidden;
	background: var(--owl-cream);
}

.owl-development-site-plan__stage {
	position: absolute;
	top: 50%;
	left: 50%;
	/* Fit the whole drawing inside the frame rather than filling the height and
	   letting the width run off the sides. A 1920x1357 plan was rendering 2163px
	   wide in a 1030px frame, so half the site was cropped until you panned.

	   The stage is the coordinate space the percentage markers are placed in, so
	   its ratio must stay equal to the drawing's at every width. `width: 100%`
	   plus `max-height: 100%` did not: once the frame was wider than the plan,
	   max-height clamped the height while the width stayed full, the ratio broke,
	   and the image letterboxed inside a box the pins were still spread across.
	   min() picks whichever of the two constraints binds and aspect-ratio derives
	   the other side from it, so the box is never over-tall or over-wide. */
	width: min(100cqw, calc(100cqh * (var(--site-plan-aspect, 2560 / 1810))));
	height: auto;
	aspect-ratio: var(--site-plan-aspect, 2560 / 1810);
	transform: translate(-50%, -50%) translate(var(--site-plan-pan-x, 0px), var(--site-plan-pan-y, 0px)) scale(var(--site-plan-zoom, 1));
	transform-origin: center center;
	transition: transform 180ms ease;
	user-select: none;
	-webkit-user-select: none;
}

.owl-development-site-plan__image {
	-webkit-user-drag: none;
	user-select: none;
	-webkit-user-select: none;
	pointer-events: none;
}

.owl-development-site-plan.is-pannable .owl-development-site-plan__image-wrap {
	cursor: grab;
	touch-action: none;
}

.owl-development-site-plan.is-panning .owl-development-site-plan__image-wrap {
	cursor: grabbing;
}

.owl-development-site-plan.is-panning .owl-development-site-plan__stage {
	transition: none;
}

/* Two classes, because .elementor img sets height:auto at (0,1,1) and would
   otherwise win. The stage already carries the drawing's own aspect ratio, so
   filling it is an exact fit; contain rather than cover means a plan whose
   stored dimensions disagree letterboxes instead of cropping, and the pins are
   placed against the drawing so cropping would move every one of them. Sizing
   the image from its own natural width instead left a plan smaller than the
   stage sitting in the top-left corner with every pin scaled to the stage. */
.owl-development-site-plan .owl-development-site-plan__image {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.owl-development-site-plan .owl-development-site-plan__marker {
	position: absolute;
	top: var(--plot-y);
	left: var(--plot-x);
	z-index: 2;
	display: inline-flex;
	width: 22px;
	min-width: 22px;
	max-width: 22px;
	height: 22px;
	min-height: 22px;
	max-height: 22px;
	flex: 0 0 22px;
	padding: 0;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 50%;
	background: var(--plot-colour, var(--owl-charcoal));
	color: var(--plot-ink, var(--owl-white));
	font-family: var(--owl-text-font);
	font-size: 11px;
	font-weight: 400;
	line-height: 22px;
	box-shadow: none;
	transform: translate(-50%, -50%);
	transition: background-color 180ms ease, color 180ms ease;
	cursor: pointer;
	aspect-ratio: 1;
}

.owl-development-site-plan .owl-development-site-plan__marker span {
	display: block;
	width: 100%;
	line-height: inherit;
	text-align: center;
}

.owl-development-site-plan .owl-development-site-plan__marker:hover,
.owl-development-site-plan .owl-development-site-plan__marker:focus {
	background: var(--plot-colour, var(--owl-charcoal));
	color: var(--plot-ink, var(--owl-white));
	outline: none;
	box-shadow: 0 0 0 2px var(--owl-white);
	transform: translate(-50%, -50%);
}

.owl-development-site-plan .owl-development-site-plan__marker.is-active {
	background: var(--plot-colour, var(--owl-gold));
	color: var(--plot-ink, var(--owl-white));
	outline: none;
	box-shadow: 0 0 0 2px var(--owl-charcoal);
	transform: translate(-50%, -50%);
}

.owl-development-site-plan .owl-development-site-plan__marker--unavailable,
.owl-development-site-plan .owl-development-site-plan__marker--unavailable:hover,
.owl-development-site-plan .owl-development-site-plan__marker--unavailable:focus {
	background: var(--plot-colour, var(--owl-charcoal));
	color: var(--plot-ink, var(--owl-white));
	box-shadow: none;
	cursor: default;
	pointer-events: none;
}

.owl-development-site-plan__marker[hidden] {
	display: none;
}

.owl-development-site-plan__popover {
	position: absolute;
	top: var(--popover-y, 50%);
	left: var(--popover-x, 50%);
	z-index: 4;
	display: grid;
	width: min(441px, calc(100% - 40px));
	min-height: 171px;
	grid-template-columns: minmax(0, 1fr);
	border-radius: 8px;
	background: var(--owl-white);
	box-shadow: 0 0 7.5px rgba(0, 0, 0, 0.1);
	overflow: hidden;
	transform: translate(-50%, calc(-100% - 20px));
}

.owl-development-site-plan__popover.has-image {
	width: min(441px, calc(100% - 40px));
	grid-template-columns: minmax(0, 270px) minmax(0, 171px);
}

.owl-development-site-plan__popover[hidden] {
	display: none;
}

.owl-development-site-plan .owl-development-site-plan__popover-close {
	position: absolute;
	top: 5px;
	right: 5px;
	z-index: 2;
	width: 25px !important;
	max-width: 25px;
	min-width: 25px;
	height: 25px;
	min-height: 25px;
	padding: 0 !important;
	border: 0;
	border-radius: 50%;
	background: var(--owl-charcoal) url("../img/times.svg") center / 10px 10px no-repeat;
	color: transparent;
	font-size: 0;
	line-height: 0;
	box-shadow: none;
	cursor: pointer;
}

.owl-development-site-plan .owl-development-site-plan__popover-close:hover,
.owl-development-site-plan .owl-development-site-plan__popover-close:focus {
	background: var(--owl-charcoal) url("../img/times.svg") center / 10px 10px no-repeat;
	color: transparent;
	box-shadow: none;
	transform: none;
}

.owl-development-site-plan__popover.is-below {
	transform: translate(-50%, 20px);
}

.owl-development-site-plan__popover::after {
	position: absolute;
	bottom: -12px;
	left: var(--popover-arrow-x, 50%);
	width: 24px;
	height: 24px;
	background: var(--owl-white);
	content: "";
	transform: translateX(-50%) rotate(45deg);
}

.owl-development-site-plan__popover.is-below::after {
	bottom: auto;
	top: -12px;
}

.owl-development-site-plan__popover-image {
	display: none;
	grid-column: 2;
	grid-row: 1;
	height: 100%;
	border-radius: 0 8px 8px 0;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
}

.owl-development-site-plan__popover.has-image .owl-development-site-plan__popover-image {
	display: block;
}

.owl-development-site-plan__popover-image[hidden] {
	display: none;
}

.owl-development-site-plan__popover-body {
	position: relative;
	z-index: 1;
	display: grid;
	grid-column: 1;
	grid-row: 1;
	min-height: 171px;
	padding: 20px;
	grid-template-columns: minmax(0, 1fr);
	grid-template-areas:
		"title"
		"details"
		"price"
		"link";
	align-content: start;
}

.owl-development-site-plan__popover-status {
	display: none;
}

.owl-development-site-plan__popover-title {
	grid-area: title;
	margin: 0;
	color: var(--owl-charcoal);
	font-family: var(--owl-display-font);
	font-size: 22px;
	font-weight: 400;
	line-height: 22px;
}

.owl-development-site-plan__popover-plot,
.owl-development-site-plan__popover-details p,
.owl-development-site-plan__popover-price {
	margin: 0;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
}

.owl-development-site-plan__popover-plot {
	grid-area: title;
	margin-top: 22px;
	font-size: 16px;
	line-height: 19px;
}

.owl-development-site-plan__popover-details {
	grid-area: details;
	display: grid;
	gap: 10px;
	margin: 17px 0 12px;
}

.owl-development-site-plan__popover-details p {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 10px;
	font-size: 14px;
	line-height: 17px;
}

.owl-development-site-plan__popover-detail-icon {
	display: block;
	width: 16px;
	height: 16px;
	flex: 0 0 16px;
	background: var(--owl-gold);
}

.owl-development-site-plan__popover-detail-icon--bedrooms {
	-webkit-mask: url("../img/bed.svg") center / contain no-repeat;
	mask: url("../img/bed.svg") center / contain no-repeat;
}

.owl-development-site-plan__popover-detail-icon--type {
	-webkit-mask: url("../img/home.svg?v=2") center / contain no-repeat;
	mask: url("../img/home.svg?v=2") center / contain no-repeat;
}

.owl-development-site-plan__popover-detail-text {
	color: var(--owl-charcoal);
	font-weight: 400;
}

.owl-development-site-plan__popover-price {
	grid-area: price;
	font-size: 18px;
	font-weight: 800;
	line-height: 26px;
}

.owl-development-site-plan__popover-link {
	grid-area: link;
	display: inline-flex;
	align-items: center;
	align-self: end;
	margin-top: 16px;
	gap: 10px;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1;
	text-decoration: none;
}

.owl-development-site-plan__popover-link::after {
	display: block;
	width: 13px;
	height: 20px;
	background: var(--owl-gold);
	content: "";
	-webkit-mask: url("../img/chevron-right.svg") center / contain no-repeat;
	mask: url("../img/chevron-right.svg") center / contain no-repeat;
}

.owl-development-site-plan__popover-link:hover,
.owl-development-site-plan__popover-link:focus {
	color: var(--owl-charcoal);
	text-decoration: none;
}

.owl-development-site-plan__map-controls {
	position: absolute;
	bottom: 20px;
	left: 20px;
	z-index: 3;
	display: flex;
	gap: 20px;
	pointer-events: auto;
}

.owl-development-site-plan .owl-development-site-plan__control,
.owl-development-site-plan__expand {
	position: relative;
	display: inline-flex;
	width: 50px;
	min-width: 50px;
	height: 50px;
	min-height: 50px;
	padding: 0;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 50%;
	box-shadow: none;
	cursor: pointer;
	appearance: none;
}

.owl-development-site-plan .owl-development-site-plan__control {
	background: var(--owl-charcoal);
	color: var(--owl-white);
}

.owl-development-site-plan__control::before,
.owl-development-site-plan__control--zoom-in::after {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 14px;
	height: 2px;
	border-radius: 2px;
	background: currentColor;
	content: "";
	transform: translate(-50%, -50%);
}

.owl-development-site-plan__control--zoom-in::after {
	transform: translate(-50%, -50%) rotate(90deg);
}

.owl-development-site-plan .owl-development-site-plan__control:hover,
.owl-development-site-plan .owl-development-site-plan__control:focus {
	border: 0;
	background: var(--owl-charcoal);
	color: var(--owl-white);
	outline: none;
	box-shadow: none;
	transform: none;
}

.owl-development-site-plan .owl-development-site-plan__expand {
	position: absolute;
	right: 20px;
	bottom: 20px;
	z-index: 3;
	background: var(--owl-white);
	color: var(--owl-charcoal);
	box-shadow: 0 0 7.5px rgba(0, 0, 0, 0.1);
}

.owl-development-site-plan .owl-development-site-plan__expand:hover,
.owl-development-site-plan .owl-development-site-plan__expand:focus {
	border: 0;
	background: var(--owl-white);
	color: var(--owl-charcoal);
	outline: none;
	box-shadow: 0 0 7.5px rgba(0, 0, 0, 0.1);
	transform: none;
}

.owl-development-site-plan .owl-development-site-plan__expand::before,
.owl-development-site-plan .owl-development-site-plan__expand::after {
	flex: 0 0 22px;
	width: 22px;
	min-width: 22px;
	max-width: 22px;
	height: 22px;
	background: var(--owl-charcoal);
	content: "";
	mask: url("../img/expand.svg") center / contain no-repeat;
	-webkit-mask: url("../img/expand.svg") center / contain no-repeat;
}

.owl-development-site-plan .owl-development-site-plan__expand::before {
	display: block;
}

.owl-development-site-plan .owl-development-site-plan__expand::after {
	display: none;
}

.owl-development-site-plan.is-enlarged .owl-development-site-plan__image-wrap {
	position: fixed;
	inset: 0;
	z-index: 10000;
	width: 100vw;
	height: 100dvh;
	max-height: none;
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--owl-charcoal);
}

.owl-development-site-plan.is-enlarged .owl-development-site-plan__stage {
	position: relative;
	top: auto;
	left: auto;
	width: auto;
	height: auto;
	aspect-ratio: auto;
	max-width: 100vw;
	max-height: 100dvh;
	transform: translate(var(--site-plan-pan-x, 0px), var(--site-plan-pan-y, 0px)) scale(var(--site-plan-zoom, 1));
	transform-origin: center center;
}

.owl-development-site-plan.is-enlarged .owl-development-site-plan__image {
	width: auto;
	height: auto;
	object-fit: fill;
	max-width: 100vw;
	max-height: 100dvh;
}

body.owl-development-site-plan-enlarged {
	overflow: hidden;
}

.owl-development-single-plan-card {
	overflow: hidden;
	border-radius: 15px;
	background: var(--owl-cream);
}

.owl-development-single-plan-image,
.owl-development-single-plan-image .elementor-widget-container,
.owl-development-single-plan-image :is(img, picture) {
	display: block;
	height: 100%;
}

.owl-development-single-plan-image img {
	width: 100%;
	object-fit: cover;
	object-position: center center;
}

.owl-development-single-map {
	height: 520px;
	min-height: 520px;
	overflow: hidden;
	border-radius: 15px;
	background: #f2edd9;
}

/* ==========================================================================
   Plot Single Sections
   ========================================================================== */

.owl-plot-single-hero {
	overflow: hidden;
	background: var(--owl-cream);
}

.owl-plot-single-hero__inner {
	--owl-plot-hero-media-height: clamp(520px, 39.75vw, 574px);

	display: grid;
	width: 100%;
	/*
	 * The copy column is anchored to the 1250px container, not the viewport. Its
	 * padding-left already tracks the container gutter, so a percentage track made
	 * the usable text width shrink as the screen widened and clipped long names
	 * like Whittington against the image. This keeps it at the design width and
	 * lets the image absorb everything above 1250.
	 */
	grid-template-columns: minmax(0, max(36.63%, calc((100vw - 1250px) / 2 + 458px))) minmax(0, 1fr);
	grid-template-rows: var(--owl-plot-hero-media-height) 50px;
}

.owl-plot-single-hero__copy {
	display: flex;
	width: 100%;
	min-width: 0;
	padding: 175px 40px 60px max(20px, calc((100vw - 1250px) / 2 + 20px));
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	grid-column: 1;
	grid-row: 1;
}

.owl-plot-single-hero__eyebrow {
	margin: 0 0 14px;
	color: var(--owl-gold);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
}

.owl-plot-single-hero__title {
	margin: 0;
	color: var(--owl-charcoal);
	font-family: var(--owl-display-font);
	font-size: clamp(54px, 4.3vw, 62px);
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 0.01em;
}

.owl-plot-single-hero__plot {
	margin: 0;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 28px;
	font-weight: 400;
	line-height: 1.35;
}

.owl-plot-single-hero__button {
	margin-top: 20px;
}

body.single-development_plot .elementor .elementor-element.owl-plot-single-hero__button .elementor-button {
	display: inline-flex;
	min-height: 40px;
	align-items: center;
	justify-content: space-between;
	text-decoration: none;
}

body.single-development_plot .elementor .elementor-element.owl-plot-single-hero__button .elementor-button:hover,
body.single-development_plot .elementor .elementor-element.owl-plot-single-hero__button .elementor-button:focus {
	background: var(--owl-gold);
	color: var(--owl-charcoal);
	fill: var(--owl-charcoal);
	text-decoration: none;
}

body.single-development_plot .elementor .elementor-element.owl-plot-single-hero__button .elementor-button-icon,
body.single-development_plot .elementor .elementor-element.owl-plot-single-hero__button .elementor-button-icon i {
	display: inline-flex;
	width: 13px;
	height: 20px;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	line-height: 1;
}

body.single-development_plot .elementor .elementor-element.owl-plot-single-hero__button .elementor-button-icon svg,
body.single-development_plot .elementor .elementor-element.owl-plot-single-hero__button .elementor-button svg {
	display: block;
	width: 13px !important;
	height: 20px !important;
	max-width: 13px;
	max-height: 20px;
}

.owl-plot-single-summary {
	width: 100%;
	min-height: 50px;
}

.owl-plot-single-highlights__image:not(:has(img)) {
	display: none;
}

.owl-plot-single-highlights__image:has(img) {
	flex: 0 0 min(360px, 100%);
}

.owl-plot-single-highlights__image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.owl-plot-single-summary__item {
	margin: 0;
	flex: 0 0 auto;
}

@media (min-width: 1025px) and (max-width: 1249px) {
	.owl-plot-single-summary {
		justify-content: flex-start;
	}

	.owl-plot-single-summary__item {
		width: calc(50% - 10px);
	}
}

.owl-plot-single-summary__item .elementor-heading-title {
	display: inline-flex;
	position: relative;
	min-height: 50px;
	padding-left: 65px;
	margin: 0;
	align-items: center;
	gap: 14px;
	white-space: nowrap;
}

.owl-plot-single-summary__item .elementor-heading-title::before {
	display: block;
	position: absolute;
	top: 50%;
	left: 0;
	box-sizing: border-box;
	width: 50px;
	height: 50px;
	border: 1px solid var(--owl-gold);
	border-radius: 50%;
	background: var(--owl-white);
	content: "";
	transform: translateY(-50%);
}

.owl-plot-single-summary__item .elementor-heading-title::after {
	display: block;
	position: absolute;
	top: 50%;
	left: 15px;
	width: 20px;
	height: 20px;
	background: var(--owl-gold);
	content: "";
	transform: translateY(-50%);
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	mask-size: contain;
}

.owl-plot-single-summary__item--bedrooms .elementor-heading-title::after {
	-webkit-mask-image: url("../img/bed.svg");
	mask-image: url("../img/bed.svg");
}

/*
 * The house and car need an optical nudge rather than a matching box. Measured
 * flat they are the same size, but the house is a compact peaked shape that
 * reads small inside the circle and the car spreads to the edges and reads big.
 * `left` keeps each one centred in the 50px circle: (50 - size) / 2.
 */
.owl-plot-single-summary__item--type .elementor-heading-title::after {
	left: 14px;
	width: 22px;
	height: 22px;
	-webkit-mask-image: url("../img/home.svg?v=2");
	mask-image: url("../img/home.svg?v=2");
}

.owl-plot-single-summary__item--parking .elementor-heading-title::after {
	left: 16px;
	width: 18px;
	height: 18px;
	-webkit-mask-image: url("../img/car.svg");
	mask-image: url("../img/car.svg");
}

.owl-plot-single-summary__item--price .elementor-heading-title::after {
	-webkit-mask-image: url("../img/tag.svg");
	mask-image: url("../img/tag.svg");
}

.owl-plot-single-hero__address {
	margin: auto 0 0;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 18px;
	font-weight: 400;
	line-height: 1.5;
}

.owl-plot-single-hero__address span {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.owl-plot-single-hero__image {
	position: relative;
	width: 100%;
	max-width: none;
	margin: 0;
	overflow: hidden;
	grid-column: 2;
	grid-row: 1;
	background: #f2edd9;
}

.owl-plot-single-hero__image .elementor-widget-container,
.owl-plot-single-hero__image :is(a, picture) {
	display: block;
	width: 100%;
	height: 100%;
}

.owl-plot-single-hero__image::after {
	position: absolute;
	inset: 45% 0 0;
	content: "";
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 100%);
	pointer-events: none;
}

.owl-plot-single-hero__image img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	object-position: center center;
}

.owl-plot-single-offer-strip {
	display: flex;
	min-height: 50px;
	margin: 0;
	align-items: center;
	justify-content: center;
	grid-column: 1 / -1;
	grid-row: 2;
	background: var(--owl-gold);
	text-align: center;
}

.owl-plot-single-nav-wrap {
	z-index: 32;
}

.owl-plot-template-section--nav {
	position: sticky;
	top: 0;
	z-index: 32;
}

.admin-bar .owl-plot-template-section--nav {
	top: 32px;
}

.owl-plot-template-section--nav .owl-plot-single-nav-wrap {
	position: static;
}

.owl-plot-template-section--image-cta.owl-plot-single-image-cta {
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

.owl-plot-single-nav .owl-development-single-jump-nav__links {
	justify-content: space-around;
	gap: 0;
}

.owl-plot-single-text-text__body p {
	margin: 0;
}

.owl-plot-single-gallery {
	padding: 0 0 120px;
	overflow: hidden;
	background: var(--owl-white);
}

.owl-plot-single-floorplans {
	padding: 100px 0;
	background: var(--owl-white);
}

.owl-plot-single-floorplans__inner {
	display: grid;
	width: min(1250px, 100%);
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
	grid-template-columns: minmax(0, 1fr) minmax(280px, 420px);
	grid-template-areas:
		"copy media"
		"panels media";
	column-gap: 80px;
	align-items: start;
}

.owl-plot-single-floorplans__copy {
	grid-area: copy;
	padding-top: 56px;
}

.owl-plot-single-floorplans__panels {
	grid-area: panels;
}

.owl-plot-single-floorplans__media {
	grid-area: media;
}

.owl-plot-single-floorplans__overline {
	margin: 0 0 10px;
	color: var(--owl-gold);
	font-family: var(--owl-text-font);
	font-size: 18px;
	font-weight: 400;
	line-height: 1.5;
}

.owl-plot-single-floorplans__heading {
	max-width: 458px;
	margin: 0 0 30px;
	color: var(--owl-charcoal);
	font-family: var(--owl-display-font);
	font-size: 45px;
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 0.01em;
}

/* The pill hugs its tabs, so every tab is the same 138px whether a home has one
   floor, two or three. Two tabs land on 278px, a rounding pixel off the 279px
   Figma pill, which is the trade for a single Ground Floor tab not stretching to
   fill the whole bar. */
.owl-plot-single-floorplans__tabs {
	display: inline-flex;
	width: auto;
	max-width: 100%;
	height: 45px;
	margin: 0 0 40px;
	overflow: hidden;
	border: 1px solid var(--owl-line);
	border-radius: var(--owl-radius-pill);
	background: var(--owl-white);
}

.owl-plot-single-floorplans__tab {
	display: inline-flex;
	width: 138px;
	flex: 1 0 auto;
	min-width: 0;
	height: 45px;
	min-height: 45px;
	align-items: center;
	justify-content: center;
	padding: 10px 20px;
	box-sizing: border-box;
	border: 0;
	border-radius: 0 !important;
	background: var(--owl-white);
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 14px;
	font-weight: 400;
	line-height: normal;
	white-space: nowrap;
	cursor: pointer;
}

.owl-plot-single-floorplans__tab:first-child {
	border-radius: 100px 0 0 100px !important;
}

.owl-plot-single-floorplans__tab:last-child {
	border-radius: 0 100px 100px 0 !important;
}

.owl-plot-single-floorplans__tab:hover,
.owl-plot-single-floorplans__tab:focus {
	background: var(--owl-white) !important;
	color: var(--owl-charcoal) !important;
	outline: none;
	box-shadow: none;
}

.owl-plot-single-floorplans__tab:not(.is-active) {
	background: var(--owl-white) !important;
	color: var(--owl-charcoal) !important;
	border-radius: 0 !important;
}

.owl-plot-single-floorplans__tab.is-active,
.owl-plot-single-floorplans__tab.is-active:hover,
.owl-plot-single-floorplans__tab.is-active:focus {
	background: var(--owl-charcoal) !important;
	color: var(--owl-white) !important;
}

.owl-plot-single-floorplans__total {
	margin: 0 0 40px;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 24px;
	font-weight: 400;
	line-height: 1.35;
}

.owl-plot-single-floorplans__rooms {
	display: flex;
	flex-direction: column;
	max-width: 600px;
	margin: 0;
	row-gap: 20px;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 20px;
	font-weight: 400;
	line-height: 1.35;
}

.owl-plot-single-floorplans__room {
	display: grid;
	grid-template-columns: minmax(0, 210px) minmax(0, 1fr);
	column-gap: 24px;
	align-items: baseline;
}

.owl-plot-single-floorplans__room dt,
.owl-plot-single-floorplans__room dd {
	margin: 0;
	font: inherit;
	white-space: nowrap;
}

.owl-plot-single-floorplans__image {
	width: 100%;
	max-width: 420px;
	margin: 0 0 0 auto;
	mix-blend-mode: multiply;
}

.owl-plot-single-floorplans__image[hidden],
.owl-plot-single-floorplans__details[hidden] {
	display: none;
}

.owl-plot-single-floorplans__image img {
	display: block;
	width: 100%;
	height: auto;
	max-height: 680px;
	object-fit: contain;
	object-position: top center;
}

.owl-plot-single-floorplans__media {
	position: relative;
}

.owl-plot-single-floorplans__zoom {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 2;
	display: inline-flex;
	width: 60px;
	height: 60px;
	align-items: center;
	justify-content: center;
	padding: 0 !important;
	border: 1.5px solid var(--owl-charcoal) !important;
	border-radius: var(--owl-radius-pill) !important;
	background: var(--owl-white) !important;
	box-shadow: none !important;
	cursor: pointer;
	transition: background-color 0.2s ease;
}

.owl-plot-single-floorplans__zoom::before {
	display: block;
	width: 24px;
	height: 24px;
	background: var(--owl-charcoal);
	content: "";
	-webkit-mask: url("../img/search.svg") center / contain no-repeat;
	mask: url("../img/search.svg") center / contain no-repeat;
	transition: background-color 0.2s ease;
}

.owl-plot-single-floorplans__zoom:hover,
.owl-plot-single-floorplans__zoom:focus,
.owl-plot-single-floorplans__zoom:focus-visible {
	background: var(--owl-charcoal) !important;
	outline: none;
}

.owl-plot-single-floorplans__zoom:hover::before,
.owl-plot-single-floorplans__zoom:focus::before,
.owl-plot-single-floorplans__zoom:focus-visible::before {
	background: var(--owl-white);
}

.owl-plot-single-specifications {
	padding: 100px 0;
	background: var(--owl-cream);
}

.owl-plot-single-specifications__inner {
	display: grid;
	width: min(1250px, 100%);
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
	grid-template-columns: minmax(0, 494px) minmax(0, 602px);
	justify-content: space-between;
	gap: 80px;
	align-items: start;
}

.owl-plot-single-specifications__heading {
	margin: 0 0 30px;
	color: var(--owl-charcoal);
	font-family: var(--owl-display-font);
	font-size: 35px;
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 0.01em;
}

.owl-plot-single-specifications__text {
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 18px;
	font-weight: 400;
	line-height: 1.45;
	letter-spacing: 0;
}

.owl-plot-single-specifications__text p {
	margin: 0;
}

.owl-plot-single-specifications__button {
	display: inline-flex;
	min-height: 45px;
	margin-top: 35px;
	align-items: center;
	gap: 15px;
	padding: 10px 20px;
	box-sizing: border-box;
	border-radius: var(--owl-radius-pill);
	background: var(--owl-charcoal);
	color: var(--owl-white);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	text-decoration: none;
	white-space: nowrap;
}

.owl-plot-single-specifications__button::after {
	display: block;
	width: 18px;
	height: 20px;
	flex: 0 0 18px;
	background: var(--owl-white);
	content: "";
	-webkit-mask: url("../img/arrow-down-to-bracket.svg") center / 18px 20px no-repeat;
	mask: url("../img/arrow-down-to-bracket.svg") center / 18px 20px no-repeat;
}

.owl-plot-single-specifications__button:hover,
.owl-plot-single-specifications__button:focus {
	background: var(--owl-charcoal);
	color: var(--owl-white);
	text-decoration: none;
	outline: none;
	box-shadow: none;
}

.owl-plot-single-specifications__accordion {
	padding-top: 55px;
}

.owl-plot-single-specifications__item {
	border-bottom: 1px solid var(--owl-line);
	color: var(--owl-charcoal);
}

.owl-plot-single-specifications__summary {
	display: flex;
	min-height: 68px;
	align-items: center;
	justify-content: space-between;
	gap: 30px;
	list-style: none;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 22px;
	font-weight: 400;
	line-height: 1.3;
	cursor: pointer;
}

.owl-plot-single-specifications__summary::-webkit-details-marker {
	display: none;
}

.owl-plot-single-specifications__summary::after {
	color: var(--owl-gold);
	content: "+";
	font-size: 28px;
	font-weight: 400;
	line-height: 1;
}

.owl-plot-single-specifications__item[open] .owl-plot-single-specifications__summary::after {
	content: "-";
}

.owl-plot-single-specifications__summary:hover,
.owl-plot-single-specifications__summary:focus {
	color: var(--owl-charcoal);
	outline: none;
}

.owl-plot-single-specifications__panel {
	max-width: 520px;
	padding: 0 55px 24px 0;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
}

.owl-plot-single-specifications__panel > * {
	margin: 0;
}

.owl-plot-single-specifications__panel > * + * {
	margin-top: 15px;
}

.owl-plot-single-specifications__panel ul,
.owl-plot-single-specifications__panel ol {
	padding-left: 20px;
}

.owl-plot-single-specifications__panel li + li {
	margin-top: 5px;
}

.owl-plot-single-offer-feature__text p {
	margin: 0;
}

.owl-plot-single-offer-feature__button:hover,
.owl-plot-single-offer-feature__button:focus {
	background: var(--owl-gold);
	color: var(--owl-charcoal);
	text-decoration: none;
	outline: none;
	box-shadow: none;
}

.owl-plot-single-offer-feature__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center center;
}

.owl-plot-single-brochure-download__artwork {
	display: block;
	width: 280px;
	flex: 0 0 280px;
	margin: 0;
}

.elementor .elementor-element.owl-plot-single-brochure-download__artwork img,
.owl-plot-single-brochure-download__artwork img {
	display: block;
	width: 100%;
	height: auto;
	max-width: 100%;
}

.owl-plot-single-brochure-download__button {
	--owl-button-icon-width: 18px;
	--owl-button-icon-height: 20px;
}

.owl-plot-single-brochure-download__viewing .elementor-button-icon svg {
	width: 18px;
	height: 21px;
}

.owl-plot-single-brochure-download__viewing .elementor-button-icon svg,
.owl-plot-single-brochure-download__viewing .elementor-button-icon svg path {
	fill: #c1a01e;
}



.owl-plot-single-brochure-download__text p {
	margin: 0;
}


.owl-plot-single-ways-to-buy__copy p,
.owl-plot-single-ways-to-buy__card-copy p {
	margin: 0;
	line-height: 1.5;
}

.owl-plot-single-ways-to-buy__card-title .elementor-heading-title {
	line-height: 1.25;
}

.owl-plot-single-ways-to-buy__card-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center center;
}

.owl-plot-single-ways-to-buy .owl-homes-why-choose-card-chevron .elementor-icon:hover,
.owl-plot-single-ways-to-buy .owl-homes-why-choose-card-chevron .elementor-icon:focus {
	background: #fefefd;
	outline: none;
	box-shadow: none;
}

.owl-plot-single-ways-to-buy__card-chevron {
	align-self: flex-end;
}

/* Ways-to-buy cards bleed to the screen edges on tablet/mobile (first card keeps a 20px gutter) */
@media (max-width: 1024px) {
	.owl-plot-single-ways-to-buy .owl-homes-why-choose-grid {
		width: calc(100% + 40px);
		margin-left: -20px;
		padding-left: 20px;
		padding-right: 20px;
	}
}

.owl-plot-single-calculators {
	padding: 100px 20px;
	background: var(--owl-cream);
}

.owl-plot-single-calculators__inner {
	width: min(1030px, 100%);
	margin: 0 auto;
}

.owl-plot-single-calculators__heading {
	margin: 0 0 35px;
	color: var(--owl-charcoal);
	font-family: var(--owl-display-font);
	font-size: 35px;
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 0.01em;
}

.owl-plot-single-calculators__tabs {
	display: grid;
	margin-bottom: 70px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	border-bottom: 1px solid var(--owl-line);
}

.owl-plot-single-calculators .owl-plot-single-calculators__tab {
	position: relative;
	min-height: 45px;
	padding: 0 0 20px;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	color: var(--owl-charcoal) !important;
	font-family: var(--owl-text-font);
	font-size: 20px;
	font-weight: 400;
	line-height: 1.2;
	text-align: left;
	box-shadow: none !important;
	cursor: pointer;
	appearance: none;
}

.owl-plot-single-calculators .owl-plot-single-calculators__tab::after {
	position: absolute;
	bottom: -2px;
	left: 0;
	width: min(203px, 100%);
	height: 3px;
	border-radius: 100px;
	background: transparent;
	content: "";
}

.owl-plot-single-calculators .owl-plot-single-calculators__tab.is-active {
	font-weight: 800;
}

.owl-plot-single-calculators .owl-plot-single-calculators__tab.is-active::after {
	background: var(--owl-gold);
}

.owl-plot-single-calculators .owl-plot-single-calculators__tab:hover,
.owl-plot-single-calculators .owl-plot-single-calculators__tab:focus {
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	color: var(--owl-charcoal) !important;
	outline: none;
	box-shadow: none !important;
	transform: none;
}

.owl-plot-single-calculators__panel {
	display: grid;
	grid-template-columns: minmax(0, 493px) minmax(0, 495px);
	gap: 42px;
	align-items: start;
}

.owl-plot-single-calculators__panel[hidden] {
	display: none;
}

.owl-plot-single-calculators__form {
	display: grid;
	gap: 25px;
}

.owl-plot-single-calculators__field {
	display: grid;
	gap: 10px;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.2;
}

.owl-plot-single-calculators__split {
	display: grid;
	grid-template-columns: minmax(0, 321px) 153px;
	gap: 14px;
	align-items: end;
}

.owl-plot-single-calculators__input {
	display: inline-flex;
	width: 100%;
	min-height: 45px;
	padding: 10px 25px;
	box-sizing: border-box;
	align-items: center;
	gap: 15px;
	border: 0.5px solid var(--owl-line);
	border-radius: 100px;
	background: var(--owl-white);
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 18px;
	font-weight: 400;
	line-height: 1;
}

.owl-plot-single-calculators__input > span {
	color: var(--owl-gold);
}

.owl-plot-single-calculators__input input {
	width: 100%;
	min-width: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: inherit;
	font: inherit;
	line-height: inherit;
	outline: none;
	box-shadow: none;
	appearance: textfield;
}

.owl-plot-single-calculators__input input::-webkit-outer-spin-button,
.owl-plot-single-calculators__input input::-webkit-inner-spin-button {
	margin: 0;
	appearance: none;
}

.owl-plot-single-calculators__input--suffix {
	justify-content: center;
	gap: 15px;
	padding-right: 20px;
	padding-left: 20px;
}

.owl-plot-single-calculators__input--suffix input {
	width: auto;
	text-align: right;
}

.owl-plot-single-calculators__input--spread {
	justify-content: space-between;
}

.owl-plot-single-calculators__input--spread input {
	text-align: left;
}

.owl-plot-single-calculators__input--spread > span {
	color: var(--owl-charcoal);
}

.owl-plot-single-calculators__rate {
	display: grid;
	grid-template-columns: minmax(0, 321px) 153px;
	gap: 14px;
	align-items: center;
}

.owl-plot-single-calculators__range {
	width: 100%;
	height: 15px;
	margin: 0;
	-webkit-appearance: none;
	appearance: none;
	background: transparent;
	cursor: pointer;
}

.owl-plot-single-calculators__range::-webkit-slider-runnable-track {
	height: 15px;
	border-radius: 100px;
	background: var(--owl-line);
}

.owl-plot-single-calculators__range::-webkit-slider-thumb {
	width: 22px;
	height: 22px;
	margin-top: -3.5px;
	border: 0;
	border-radius: 50%;
	background: var(--owl-gold);
	appearance: none;
}

.owl-plot-single-calculators__range::-moz-range-track {
	height: 15px;
	border-radius: 100px;
	background: var(--owl-line);
}

.owl-plot-single-calculators__range::-moz-range-thumb {
	width: 22px;
	height: 22px;
	border: 0;
	border-radius: 50%;
	background: var(--owl-gold);
}

.owl-plot-single-calculators__result {
	display: flex;
	width: 100%;
	flex-direction: column;
	min-height: 350px;
	padding: 30px;
	box-sizing: border-box;
	border-radius: 15px;
	background: var(--owl-white);
	align-self: stretch;
}

.owl-plot-single-calculators__result-heading {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 30px;
	align-items: start;
}

.owl-plot-single-calculators__result h3 {
	max-width: 284px;
	margin: 0;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 24px;
	font-weight: 800;
	line-height: 1.3;
	letter-spacing: 0;
}

.owl-plot-single-calculators__result-heading p {
	margin: 0;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 40px;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0;
	text-align: right;
	white-space: nowrap;
}

.owl-plot-single-calculators__result-divider {
	margin: auto 0;
	height: 1px;
	background: var(--owl-line);
}

.owl-plot-single-calculators__disclaimer,
.owl-plot-single-calculators__result--placeholder p {
	margin: 0;
	color: #767676;
	font-family: var(--owl-text-font);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: 0;
}

.owl-plot-single-calculators__result--placeholder {
	min-height: 260px;
}

/* Stack the dev-single nav (mobile jump dropdown + full-width enquiry) from 1439px
   down so the horizontal nav isn't squished between 1200 and 1440.
   ⚠️ 1439, not 1399: six links at their natural widths need 1417px of viewport
   (587px of label text + 12px pill padding each side + 24px gaps, beside the
   63px "Jump to" and the 377px enquiry panel). At 1400 the last one was cut. */
@media (min-width: 1025px) and (max-width: 1439px) {
	.owl-development-single-jump-nav {
		padding: 0;
	}

	.owl-development-single-jump-nav__inner {
		display: grid;
		width: 100%;
		height: auto;
		padding: 0;
		grid-template-columns: auto minmax(0, 1fr);
		grid-template-areas:
			"label jump"
			"enquiry enquiry";
		gap: 0;
		border-radius: 0;
	}

	.owl-development-single-jump-nav__label {
		display: inline-flex;
		height: 40px;
		padding-left: 20px;
		grid-area: label;
		align-items: center;
		font-size: 14px;
		line-height: 1.5;
	}

	.owl-development-single-jump-nav__links {
		display: none;
	}

	.owl-development-single-mobile-jump {
		position: relative;
		display: block;
		grid-area: jump;
	}

	.owl-development-single-mobile-jump__summary {
		display: flex;
		height: 40px;
		padding-right: 20px;
		align-items: center;
		justify-content: flex-end;
		gap: 15px;
		color: var(--owl-charcoal);
		cursor: pointer;
		font-family: var(--owl-text-font);
		font-size: 14px;
		font-weight: 400;
		line-height: 1.5;
		list-style: none;
		white-space: nowrap;
	}

	.owl-development-single-mobile-jump__summary::-webkit-details-marker {
		display: none;
	}

	.owl-development-single-mobile-jump__summary:hover,
	.owl-development-single-mobile-jump__summary:focus {
		color: var(--owl-charcoal);
		outline: none;
		text-decoration: none;
	}

	.owl-development-single-mobile-jump__chevron {
		display: block;
		width: 18px;
		height: 18px;
		background: url("../img/chevron-down.svg") center / 14px 8px no-repeat;
		transform: rotate(0);
		transition: transform 180ms ease;
	}

	.owl-development-single-mobile-jump[open] .owl-development-single-mobile-jump__chevron {
		transform: rotate(180deg);
	}

	.owl-development-single-mobile-jump__panel {
		position: absolute;
		top: 40px;
		right: 0;
		z-index: 4;
		display: grid;
		width: min(260px, calc(100vw - 40px));
		padding: 10px;
		gap: 2px;
		border-radius: 0 0 15px 15px;
		background: #f5f1df;
		box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
	}

	.owl-development-single-mobile-jump__panel a {
		display: flex;
		min-height: 36px;
		padding: 0 10px;
		align-items: center;
		border-radius: var(--owl-radius-pill);
		color: var(--owl-charcoal);
		font-family: var(--owl-text-font);
		font-size: 14px;
		font-weight: 400;
		line-height: 1.5;
		text-decoration: none;
	}

	.owl-development-single-mobile-jump__panel a:hover,
	.owl-development-single-mobile-jump__panel a:focus {
		background: transparent;
		color: var(--owl-charcoal);
		text-decoration: none;
	}

	.owl-development-single-mobile-jump__panel a.is-active {
		background: var(--owl-white);
	}

	.owl-development-single-enquiry {
		width: 100%;
		height: 40px;
		margin: 0;
		grid-area: enquiry;
	}

	.owl-development-single-enquiry__summary {
		height: 40px;
		padding: 0 20px;
		justify-content: flex-start;
		border-radius: 0;
		font-size: 14px;
		line-height: 1.5;
	}

	.owl-development-single-enquiry__summary-label,
	.owl-development-single-enquiry__status,
	.owl-development-single-enquiry__status-dot,
	.owl-development-single-enquiry__chevron {
		position: static;
	}

	.owl-development-single-enquiry__summary-label {
		flex: 0 0 auto;
		font-weight: 800;
	}

	.owl-development-single-enquiry__status {
		display: inline-flex;
		margin-left: auto;
		align-items: center;
		gap: 13px;
		font-size: 14px;
		font-weight: 400;
		line-height: 1.5;
	}

	.owl-development-single-enquiry__status-dot {
		width: 12px;
		height: 12px;
		flex: 0 0 12px;
	}

	.owl-development-single-enquiry__chevron {
		flex: 0 0 18px;
		margin-left: auto;
	}

	.owl-development-single-enquiry__panel {
		top: 40px;
		right: 20px;
		width: 100%;
		max-width: min(332px, calc(100vw - 40px));
		/* The base rule now starts the panel at the top of the bar and pads it
		   down. This one still sits below the bar, so it keeps the old padding. */
		padding-top: 48px;
	}
}

@media (max-width: 1024px) {
	.owl-development-single-jump-nav {
		padding: 0;
	}

	.owl-development-single-local-carousel__caption {
		font-size: 14px;
	}

	.owl-development-single-section {
		scroll-margin-top: 100px;
	}

	.owl-development-single-nav-wrap {
		top: 0;
	}

	.owl-plot-template-section--nav,
	.admin-bar .owl-development-single-nav-wrap {
		top: 0;
	}

	.admin-bar .owl-plot-template-section--nav {
		top: 0;
	}

	.owl-development-single-jump-nav__inner {
		display: grid;
		width: 100%;
		height: auto;
		padding: 0;
		grid-template-columns: auto minmax(0, 1fr);
		grid-template-areas:
			"label jump"
			"enquiry enquiry";
		gap: 0;
		border-radius: 0;
	}

	.owl-development-single-jump-nav__label {
		display: inline-flex;
		height: 40px;
		padding-left: 20px;
		grid-area: label;
		align-items: center;
		font-size: 14px;
		line-height: 1.5;
	}

	.owl-development-single-jump-nav__links {
		display: none;
	}

	.owl-development-single-mobile-jump {
		position: relative;
		display: block;
		grid-area: jump;
	}

	.owl-development-single-mobile-jump__summary {
		display: flex;
		height: 40px;
		padding-right: 20px;
		align-items: center;
		justify-content: flex-end;
		gap: 15px;
		color: var(--owl-charcoal);
		cursor: pointer;
		font-family: var(--owl-text-font);
		font-size: 14px;
		font-weight: 400;
		line-height: 1.5;
		list-style: none;
		white-space: nowrap;
	}

	.owl-development-single-mobile-jump__summary::-webkit-details-marker {
		display: none;
	}

	.owl-development-single-mobile-jump__summary:hover,
	.owl-development-single-mobile-jump__summary:focus {
		color: var(--owl-charcoal);
		outline: none;
		text-decoration: none;
	}

	.owl-development-single-mobile-jump__chevron {
		display: block;
		width: 18px;
		height: 18px;
		background: url("../img/chevron-down.svg") center / 14px 8px no-repeat;
		transform: rotate(0);
		transition: transform 180ms ease;
	}

	.owl-development-single-mobile-jump[open] .owl-development-single-mobile-jump__chevron {
		transform: rotate(180deg);
	}

	.owl-development-single-mobile-jump__panel {
		position: absolute;
		top: 40px;
		right: 0;
		z-index: 4;
		display: grid;
		width: min(260px, calc(100vw - 40px));
		padding: 10px;
		gap: 2px;
		border-radius: 0 0 15px 15px;
		background: #f5f1df;
		box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
	}

	.owl-development-single-mobile-jump__panel a {
		display: flex;
		min-height: 36px;
		padding: 0 10px;
		align-items: center;
		border-radius: var(--owl-radius-pill);
		color: var(--owl-charcoal);
		font-family: var(--owl-text-font);
		font-size: 14px;
		font-weight: 400;
		line-height: 1.5;
		text-decoration: none;
	}

	.owl-development-single-mobile-jump__panel a:hover,
	.owl-development-single-mobile-jump__panel a:focus {
		background: transparent;
		color: var(--owl-charcoal);
		text-decoration: none;
	}

	.owl-development-single-mobile-jump__panel a.is-active {
		background: var(--owl-white);
	}

	.owl-development-single-enquiry {
		width: 100%;
		height: 40px;
		margin: 0;
		grid-area: enquiry;
	}

	.owl-development-single-enquiry__summary {
		height: 40px;
		padding: 0 20px;
		justify-content: flex-start;
		border-radius: 0;
		font-size: 14px;
		line-height: 1.5;
	}

	.owl-development-single-enquiry__summary-label,
	.owl-development-single-enquiry__status,
	.owl-development-single-enquiry__status-dot,
	.owl-development-single-enquiry__chevron {
		position: static;
	}

	.owl-development-single-enquiry__summary-label {
		flex: 0 0 auto;
		font-weight: 800;
	}

	.owl-development-single-enquiry__status {
		display: inline-flex;
		margin-left: auto;
		align-items: center;
		gap: 13px;
		font-size: 14px;
		font-weight: 400;
		line-height: 1.5;
	}

	.owl-development-single-enquiry__status-dot {
		width: 12px;
		height: 12px;
		flex: 0 0 12px;
	}

	.owl-development-single-enquiry__chevron {
		flex: 0 0 18px;
		margin-left: auto;
	}

	.owl-development-single-enquiry__panel {
		top: 40px;
		right: 20px;
		width: 100%;
		max-width: min(332px, calc(100vw - 40px));
		/* The base rule now starts the panel at the top of the bar and pads it
		   down. This one still sits below the bar, so it keeps the old padding. */
		padding-top: 48px;
	}

	.owl-plot-single-hero__inner {
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: auto auto auto;
	}

	.owl-plot-single-hero__copy {
		padding: 48px 20px 22px;
		align-items: center;
		justify-content: flex-start;
		grid-column: 1;
		grid-row: 1;
		text-align: center;
	}

	.owl-plot-single-hero__eyebrow {
		margin-bottom: 0;
		font-size: 16px;
		line-height: 1.5;
	}

	.owl-plot-single-hero__title {
		font-size: 38px;
		line-height: 1.2;
		letter-spacing: 0.01em;
	}

	/*
	 * The heading widget carries its own 62px from Elementor's per page CSS with
	 * no mobile value, so it never inherits the size set on the wrapper above.
	 * Matching the development hero at 38px. Set here rather than in Elementor
	 * because that lives in the database, which we cannot push once the client
	 * is editing.
	 */
	.owl-plot-single-hero__title.elementor-element.elementor-element-plHeroTt .elementor-heading-title {
		font-size: 38px;
		line-height: 1.2;
	}

	.owl-plot-single-hero__plot {
		margin-top: 0;
		font-size: 24px;
		line-height: 1.35;
	}

	.owl-plot-single-hero__button {
		margin-top: 20px;
	}

	.owl-plot-single-hero__address {
		margin-top: 20px;
		font-size: 16px;
		line-height: 1.5;
	}

	.owl-plot-single-offer-strip {
		min-height: 40px;
		grid-column: 1;
		grid-row: 2;
	}

	.owl-plot-single-hero__image {
		height: clamp(300px, 80vw, 440px);
		grid-column: 1;
		grid-row: 3;
	}

	.owl-plot-single-gallery {
		padding-bottom: 50px;
	}

	.owl-plot-single-floorplans {
		padding: 50px 0;
	}

	.owl-plot-single-floorplans__inner {
		/* 🚨 `1fr` is NOT `minmax(0, 1fr)`. Its automatic minimum is min-content, so
		   the column could not shrink below the widest thing in it and sized itself
		   to 416px on a 375px phone, pushing the tabs and the dimensions off the
		   right edge. Desktop had this right and mobile did not. */
		grid-template-columns: minmax(0, 1fr);
		grid-template-areas: none;
		gap: 35px;
	}

	.owl-plot-single-floorplans__copy {
		grid-area: auto;
		order: 1;
		padding-top: 0;
	}

	.owl-plot-single-floorplans__media {
		grid-area: auto;
		order: 2;
		margin: 0 auto;
	}

	.owl-plot-single-floorplans__panels {
		grid-area: auto;
		order: 3;
	}

	.owl-plot-single-floorplans__zoom {
		display: none;
	}

	.owl-plot-single-floorplans__overline {
		margin-bottom: 10px;
		font-size: 16px;
		line-height: 1.5;
	}

	/* Tag qualified so it clears the theme kit's `.elementor-kit-6 h2` at 45px,
	   which otherwise wins on specificity and leaves these at the desktop size. */
	h2.owl-plot-single-floorplans__heading {
		max-width: none;
		margin-bottom: 20px;
		font-size: 30px;
		line-height: 1.2;
	}

	.owl-plot-single-floorplans__tabs {
		width: 100%;
		min-width: 0;
		margin-bottom: 30px;
	}

	.owl-plot-single-floorplans__tab {
		/* The desktop 138px is a floor for the pill's proportions there. On a phone
		   three of them demand 414px, which is what forced the grid column wide. */
		width: auto;
		min-width: 0;
		flex: 1 1 0;
		min-height: 40px;
		font-size: 14px;
	}

	/* Two labels share a phone comfortably, three do not: at 16px "Ground Floor"
	   alone is 102px and each tab only gets 111px. Sized down just for the three
	   floor case so a two floor home is untouched. */
	.owl-plot-single-floorplans__tabs:has(.owl-plot-single-floorplans__tab:nth-child(3)) .owl-plot-single-floorplans__tab {
		padding: 10px 8px;
		font-size: 13px;
	}

	.owl-plot-single-floorplans__total {
		margin-bottom: 25px;
		font-size: 20px;
	}

	.owl-plot-single-floorplans__rooms {
		max-width: none;
		row-gap: 14px;
		font-size: 16px;
		line-height: 1.35;
	}

	.owl-plot-single-floorplans__room {
		grid-template-columns: minmax(0, 150px) minmax(0, 1fr);
		column-gap: 20px;
	}

	/* ⚠️ Only the dd was freed here originally, so a long room name like
	   "Kitchen / Living / Dining" could not wrap, overflowed its 150px column and
	   printed straight over the dimensions beside it. Both halves need to wrap. */
	.owl-plot-single-floorplans__room dt,
	.owl-plot-single-floorplans__room dd {
		white-space: normal;
	}

	.owl-plot-single-floorplans__image {
		width: 100%;
		max-width: 460px;
	}

	.owl-plot-single-floorplans__image img {
		height: auto;
		max-height: 560px;
	}

	.owl-plot-single-specifications {
		padding: 50px 0;
	}

	.owl-plot-single-specifications__inner {
		grid-template-columns: 1fr;
		gap: 35px;
	}

	h2.owl-plot-single-specifications__heading {
		margin-bottom: 15px;
		font-size: 30px;
		line-height: 1.2;
		letter-spacing: 0;
	}

	.owl-plot-single-specifications__text {
		font-size: 16px;
		line-height: 1.45;
	}

	.owl-plot-single-specifications__button {
		min-height: 40px;
		margin-top: 30px;
		font-size: 16px;
	}

	.owl-plot-single-specifications__accordion {
		padding-top: 0;
	}

	.owl-plot-single-specifications__summary {
		min-height: 58px;
		font-size: 18px;
	}

	.owl-plot-single-specifications__panel {
		max-width: none;
		padding-right: 40px;
		font-size: 15px;
	}

	.elementor.elementor .elementor-element.owl-plot-single-brochure-download__artwork.elementor-widget-image {
		width: 100%;
		max-width: 310px;
		height: auto;
		flex-basis: auto;
	}

	.owl-plot-single-similar__inner {
		display: block;
		width: 100%;
		margin-left: 0;
	}

	.owl-plot-single-similar__copy {
		width: 100%;
		max-width: 620px;
	}

	.owl-plot-single-similar__overline {
		margin-bottom: 10px;
		font-size: 16px;
	}

	.owl-plot-single-similar__heading {
		margin-bottom: 15px;
		font-size: 34px;
		letter-spacing: 0;
	}

	.owl-plot-single-similar__text {
		font-size: 16px;
		line-height: 1.45;
	}

	.owl-plot-single-similar__controls {
		margin-top: 25px;
	}

	.owl-plot-single-similar__carousel {
		margin-top: 40px;
		width: calc(100% + 40px);
		margin-left: -20px;
	}

	.owl-plot-single-similar__viewport {
		padding-left: 20px;
		padding-right: 20px;
	}

	.owl-plot-single-similar__slide,
	.owl-plot-single-similar__card {
		width: 340px;
	}

	.owl-plot-single-similar__card {
		min-height: 560px;
	}

	.owl-plot-single-similar__card .owl-development-plot-card__media {
		height: 260px;
	}

	.owl-plot-single-calculators__inner {
		width: 100%;
	}

	.owl-plot-single-calculators__heading {
		margin-bottom: 30px;
		font-size: 30px;
		letter-spacing: 0;
	}

	.owl-plot-single-calculators__tabs {
		margin-right: -20px;
		margin-bottom: 45px;
		overflow-x: auto;
		grid-template-columns: repeat(3, max-content);
		gap: 34px;
		scrollbar-width: none;
	}

	.owl-plot-single-calculators__tabs::-webkit-scrollbar {
		display: none;
	}

	.owl-plot-single-calculators__tab {
		min-width: max-content;
		font-size: 16px;
	}

	.owl-plot-single-calculators__panel {
		grid-template-columns: 1fr;
		gap: 30px;
	}

	.owl-plot-single-calculators__form,
	.owl-plot-single-calculators__result {
		width: 100%;
	}

	.owl-development-single-hero-summary-item .elementor-heading-title {
		white-space: normal;
	}

	.owl-development-single-status-pill {
		width: 112px;
		min-width: 112px;
		height: 30px;
		min-height: 30px;
		padding: 0 15px;
	}

	.owl-development-single-status-pill .elementor-heading-title {
		font-size: 14px;
	}

	.owl-development-single-hero-summary {
		flex-direction: column;
		gap: 10px;
	}

	.owl-development-single-hero-summary-item::before,
	.owl-development-single-hero-summary-item::after {
		display: none !important;
	}

	.owl-development-plots__toolbar {
		margin-bottom: 30px;
		flex-direction: column;
		align-items: stretch;
	}

	.owl-development-single-overview-actions {
		--owl-development-overview-action-height: 40px;
		justify-content: flex-start;
		gap: 30px;
	}

	.owl-development-plots__filters {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	/* In the drawer the sort would otherwise fall below the action buttons.
	   Order matches desktop: filters, then the coming soon toggle, then sort. */
	.owl-development-plots__panel-header {
		order: 1;
	}

	.owl-development-plots__fields {
		order: 2;
	}

	.owl-development-plots__toggle {
		order: 4;
	}


	.owl-development-plots__submit {
		order: 5;
	}

	.owl-development-plots__clear {
		order: 6;
	}

	.owl-development-plots .owl-development-plots__mobile-filter-toggle {
		position: relative;
		display: flex;
		width: 100%;
		min-height: 65px;
		padding: 10px;
		align-items: center;
		justify-content: space-between;
		border: 0;
		border-radius: var(--owl-radius-pill);
		background: var(--owl-white);
		color: var(--owl-charcoal);
		font-family: var(--owl-text-font);
		font-size: 14px;
		font-weight: 400;
		line-height: 1;
		box-shadow: none;
		cursor: pointer;
	}

	.owl-development-plots .owl-development-plots__mobile-filter-toggle::before {
		position: absolute;
		inset: 10px;
		border: 1px solid var(--owl-line);
		border-radius: var(--owl-radius-pill);
		content: "";
		pointer-events: none;
	}

	.owl-development-plots .owl-development-plots__mobile-filter-toggle:hover,
	.owl-development-plots .owl-development-plots__mobile-filter-toggle:focus {
		background: var(--owl-white);
		color: var(--owl-charcoal);
		outline: none;
		box-shadow: none;
	}

	.owl-development-plots__mobile-filter-label,
	.owl-development-plots__mobile-filter-chevron {
		position: relative;
		z-index: 1;
	}

	.owl-development-plots__mobile-filter-label {
		display: inline-flex;
		align-items: center;
		gap: 15px;
		padding-left: 20px;
	}

	.owl-development-plots__mobile-filter-icon {
		display: block;
		width: 16px;
		height: 16px;
		background: var(--owl-gold);
		-webkit-mask: url("../img/filter-sliders.svg") center / contain no-repeat;
		mask: url("../img/filter-sliders.svg") center / contain no-repeat;
	}

	.owl-development-plots__mobile-filter-chevron {
		width: 16px;
		height: 16px;
		margin-right: 15px;
		background: url("../img/chevron-down.svg") center / contain no-repeat;
	}

	.owl-development-plots__filters {
		display: none;
	}

	.owl-development-plots.is-mobile-filters-open::before {
		position: fixed;
		inset: 0;
		z-index: 9999;
		background: rgba(0, 0, 0, 0.3);
		content: "";
	}

	.owl-development-plots.is-mobile-filters-open .owl-development-plots__filters {
		position: fixed;
		top: 86px;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 10000;
		display: flex;
		width: 100%;
		padding: 20px;
		box-sizing: border-box;
		flex-direction: column;
		align-items: stretch;
		gap: 15px;
		border-radius: 0;
		background: var(--owl-white);
		box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}

	.admin-bar .owl-development-plots.is-mobile-filters-open .owl-development-plots__filters {
		top: 118px;
	}

	.owl-development-plots__panel-header {
		display: flex;
		margin-bottom: 10px;
		align-items: center;
		justify-content: space-between;
	}

	.owl-development-plots__panel-title {
		display: inline-flex;
		align-items: center;
		gap: 10px;
		color: var(--owl-charcoal);
		font-family: var(--owl-text-font);
		font-size: 22px;
		font-weight: 400;
		line-height: 1;
	}

	.owl-development-plots .owl-development-plots__close {
		display: inline-flex;
		width: 35px;
		height: 35px;
		min-width: 35px;
		min-height: 35px;
		padding: 0;
		box-sizing: border-box;
		align-items: center;
		justify-content: center;
		border: 0;
		border-radius: 100px;
		background: var(--owl-charcoal) url("../img/times.svg") center / 12px 12px no-repeat;
		color: transparent;
		font-size: 0;
		line-height: 0;
		box-shadow: none;
		appearance: none;
		cursor: pointer;
	}

	.owl-development-plots .owl-development-plots__close:hover,
	.owl-development-plots .owl-development-plots__close:focus {
		border: 0;
		background: var(--owl-charcoal) url("../img/times.svg") center / 12px 12px no-repeat;
		color: transparent;
		box-shadow: none;
		text-decoration: none;
		transform: none;
	}

	.owl-development-plots__fields {
		display: flex;
		margin-top: 10px;
		flex: 0 0 auto;
		flex-direction: column;
		align-items: stretch;
		gap: 15px;
	}

	.owl-development-plots__filter-field {
		width: 100%;
		flex: 0 0 auto;
	}

	.owl-development-plots__filter-field select {
		min-height: 40px;
		padding-right: 46px;
		padding-left: 20px;
		background-position: right 20px center;
		font-size: 16px;
	}

	/* Same metrics as the selects above, at three classes so it beats
	   .elementor-kit-6 button. */
	.owl-development-plots .owl-development-plots__filter-field .owl-plot-features-toggle {
		min-height: 40px;
		padding-right: 46px;
		padding-left: 20px;
		font-size: 16px;
	}

	.owl-development-plots__toggle {
		align-self: flex-start;
		gap: 10px;
		font-size: 16px;
		line-height: 1;
	}

	.owl-development-plots__toggle input {
		width: 25px;
		height: 25px;
		flex: 0 0 25px;
		appearance: none;
		-webkit-appearance: none;
		border: 1px solid #767676;
		border-radius: 50%;
		background: transparent;
	}

	.owl-development-plots__toggle input:checked {
		border-color: var(--owl-gold);
		background: radial-gradient(circle, var(--owl-gold) 0 45%, transparent 48%);
	}

	.owl-development-plots .owl-development-plots__submit {
		display: inline-flex;
		width: 100%;
		min-height: 40px;
		padding: 10px 20px;
		box-sizing: border-box;
		align-items: center;
		justify-content: center;
		border: 0;
		border-radius: 100px;
		background: var(--owl-charcoal);
		color: var(--owl-white);
		font-family: var(--owl-text-font);
		font-size: 16px;
		font-weight: 400;
		line-height: 1;
		box-shadow: none;
		cursor: pointer;
	}

	.owl-development-plots .owl-development-plots__submit:hover,
	.owl-development-plots .owl-development-plots__submit:focus {
		border: 0;
		background: var(--owl-charcoal);
		color: var(--owl-white);
		box-shadow: none;
		text-decoration: none;
		transform: none;
	}

	.owl-development-plots .owl-development-plots__clear {
		display: inline-flex;
		min-height: 40px;
		padding: 0;
		align-items: center;
		justify-content: center;
		gap: 10px;
		border: 0;
		background: transparent;
		color: var(--owl-charcoal);
		font-family: var(--owl-text-font);
		font-size: 16px;
		font-weight: 400;
		line-height: 1;
		text-decoration: none;
		box-shadow: none;
		cursor: pointer;
	}

	.owl-development-plots .owl-development-plots__clear:hover,
	.owl-development-plots .owl-development-plots__clear:focus {
		border: 0;
		background: transparent;
		color: var(--owl-charcoal);
		box-shadow: none;
		text-decoration: none;
		transform: none;
	}

	.owl-development-plots__clear span:last-child {
		display: block;
		width: 12px;
		height: 12px;
		background: var(--owl-gold);
		mask: url("../img/times.svg") center / contain no-repeat;
		-webkit-mask: url("../img/times.svg") center / contain no-repeat;
	}

	.owl-development-plots__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 30px;
	}

	.owl-development-site-plan {
		aspect-ratio: auto;
		min-height: 0;
		grid-template-columns: 1fr;
		overflow: hidden;
		width: 100vw;
		max-width: 100vw;
		margin-left: calc(50% - 50vw);
		margin-right: calc(50% - 50vw);
	}

	.owl-development-site-plan__sidebar {
		padding: 40px 20px 20px;
		border-right: 0;
		border-bottom: 0;
	}

	.owl-development-site-plan__sidebar-copy {
		margin-bottom: 13px;
	}

	.owl-development-site-plan .owl-development-site-plan__heading {
		font-size: 28px;
		line-height: 38px;
		white-space: nowrap;
	}

	/* `contents` so the two tabs become siblings of the panels in the sidebar and
	   can be ordered against them. Without it Map Key can only sit above or below
	   the pair of panels, never between them. */
	.owl-development-site-plan__tabs {
		display: contents;
	}

	.owl-development-site-plan__sidebar-copy {
		order: 0;
	}

	.owl-development-site-plan__tab,
	.owl-development-site-plan__tabs .owl-development-site-plan__tab {
		position: relative;
		width: 100%;
		min-height: 45px;
		padding: 0 36px 0 0;
		justify-content: flex-start;
		gap: 15px;
		border: 0;
		border-radius: 0;
		background: transparent;
		font-size: 16px;
		line-height: 1;
	}

	.owl-development-site-plan__tab--filters {
		order: 1;
	}

	/* Two classes, to clear the `border: 0` reset on the tabs above. */
	.owl-development-site-plan__tabs .owl-development-site-plan__tab--filters {
		border-bottom: 1px solid var(--owl-line);
	}

	.owl-development-site-plan__panel[data-site-plan-panel="filters"] {
		order: 2;
	}

	.owl-development-site-plan__tab--key {
		order: 3;
	}

	.owl-development-site-plan__panel[data-site-plan-panel="key"] {
		order: 4;
	}

	.owl-development-site-plan__tab[aria-expanded="true"]::after {
		transform: translateY(-50%) rotate(180deg);
	}

	.owl-development-site-plan__key-item strong {
		font-size: 16px;
	}

	.owl-development-site-plan__tab--key span {
		-webkit-mask: url("../img/map.svg") center / contain no-repeat;
		mask: url("../img/map.svg") center / contain no-repeat;
	}

	.owl-development-site-plan__tab:first-child,
	.owl-development-site-plan__tab:last-child {
		border-radius: 0;
	}

	.owl-development-site-plan__tab span {
		width: 16px;
		height: 16px;
	}

	.owl-development-site-plan__tab::after {
		position: absolute;
		top: 50%;
		right: 0;
		display: block;
		width: 16px;
		height: 16px;
		background: url("../img/chevron-down.svg") center / contain no-repeat;
		content: "";
		transform: translateY(-50%);
	}

	.owl-development-site-plan .owl-development-site-plan__tabs .owl-development-site-plan__tab.is-active,
	.owl-development-site-plan .owl-development-site-plan__tabs .owl-development-site-plan__tab:not(.is-active),
	.owl-development-site-plan .owl-development-site-plan__tabs .owl-development-site-plan__tab:not(.is-active):hover,
	.owl-development-site-plan .owl-development-site-plan__tabs .owl-development-site-plan__tab:not(.is-active):focus,
	.owl-development-site-plan__tab.is-active,
	.owl-development-site-plan__tab.is-active:hover,
	.owl-development-site-plan__tab.is-active:focus {
		background: transparent;
		color: var(--owl-charcoal);
		font-weight: 400;
	}

	.owl-development-site-plan__panel {
		margin-top: 15px;
		padding-right: 0;
		padding-left: 0;
		box-sizing: border-box;
	}

	.owl-development-site-plan__canvas {
		padding: 0;
	}

	.owl-development-site-plan__notice {
		top: 20px;
		right: 20px;
	}

	.owl-development-site-plan__image-wrap {
		min-height: 700px;
	}

	.owl-development-site-plan__popover {
		width: min(350px, calc(100% - 40px));
		height: 143px;
		grid-template-columns: 1fr;
	}

	.owl-development-site-plan__popover.has-image {
		width: min(350px, calc(100% - 24px));
		grid-template-columns: minmax(0, 1fr) minmax(0, 140px);
	}

	.owl-development-site-plan__popover.has-image .owl-development-site-plan__popover-image {
		display: block;
	}

	.owl-development-site-plan__popover-body {
		height: 143px;
		padding: 14px;
	}

	.owl-development-site-plan__popover-title {
		font-size: 24px;
		line-height: 24px;
	}

	.owl-development-site-plan__popover-plot {
		margin-top: 24px;
	}

	.owl-development-site-plan__popover-details {
		gap: 6px;
		margin: 12px 0 8px;
	}

	.owl-development-site-plan__popover-price {
		font-size: 18px;
		line-height: 20px;
	}

	.owl-development-site-plan .owl-development-site-plan__control,
	.owl-development-site-plan .owl-development-site-plan__expand {
		width: 42px;
		min-width: 42px;
		height: 42px;
		min-height: 42px;
	}

	.owl-development-single-map {
		height: 420px;
		min-height: 420px;
	}

	.owl-development-single-intro-slider__button--prev {
		display: none;
	}

	.owl-development-single-intro-slider__button--next {
		display: none;
	}

	.owl-development-single-intro-slider__viewport {
		aspect-ratio: 70 / 47;
		border-radius: 10px;
	}

	.owl-development-single-intro-slider__mobile-controls {
		display: flex;
		width: 100%;
		margin-top: 10px;
		align-items: center;
		justify-content: space-between;
	}

	.owl-development-single-local-carousel {
		--owl-local-area-slide-width: calc(100vw - 40px);
	}

	.owl-development-single-local-carousel__slide {
		height: auto;
		aspect-ratio: 813 / 520;
		border-radius: 10px;
	}

	.owl-development-single-local-carousel__button--prev {
		left: 20px;
		transform: translateY(-50%) rotate(180deg);
	}

	.owl-development-single-local-carousel__button--next {
		right: 20px;
		transform: translateY(-50%);
	}

	.owl-development-local-amenities-map {
		height: 566px;
		min-height: 566px;
	}

	.owl-development-local-amenities-map__panel {
		top: 20px;
		left: 50%;
		display: block;
		width: calc(100% - 40px);
		min-height: 114px;
		padding: 17px 20px 20px;
		border-radius: 15px;
		transform: translateX(-50%);
	}

	.owl-development-local-amenities-map .owl-development-local-amenities-map__heading {
		margin-bottom: 17px;
		padding-left: 0;
		font-size: 24px;
		line-height: 1.2;
	}

	.owl-development-local-amenities-map__filters {
		gap: 14px;
		width: 100%;
	}

	.owl-development-local-amenities-map .owl-development-local-amenities-map__filter {
		min-width: 133px;
		height: 35px;
		min-height: 35px;
		padding: 7px 20px;
	}

	.owl-local-amenities-marker {
		width: 22px;
		height: 29px;
	}

	.owl-local-amenities-marker--home {
		width: 24px;
		height: 24px;
	}

}

@media (max-width: 782px) {
	.admin-bar .owl-development-plots.is-mobile-filters-open .owl-development-plots__filters {
		top: 132px;
	}
}

@media (max-width: 1024px) {
	body.single-development .elementor .elementor-element.owl-development-single-hero {
		--min-height: 76svh;
		min-height: 76vh;
		min-height: 76svh;
	}

	body.single-development .elementor .elementor-element.owl-development-single-offer-strip {
		min-height: 40px;
	}

	.owl-plot-single-summary {
		justify-content: flex-start;
	}

	.owl-plot-single-summary__item {
		width: calc(50% - 10px);
	}

	.owl-plot-single-summary__item .elementor-heading-title {
		gap: 10px;
		min-height: 40px;
		padding-left: 50px;
		white-space: normal;
	}

	.owl-plot-single-summary__item .elementor-heading-title::before {
		width: 40px;
		height: 40px;
	}

	.owl-plot-single-summary__item .elementor-heading-title::after {
		left: 12px;
		width: 16px;
		height: 16px;
	}

	/* Same optical nudge as desktop, scaled to the 40px circle. */
	.owl-plot-single-summary__item--type .elementor-heading-title::after {
		left: 11px;
		width: 18px;
		height: 18px;
	}

	.owl-plot-single-summary__item--parking .elementor-heading-title::after {
		left: 13px;
		width: 14px;
		height: 14px;
	}

	.owl-plot-single-similar {
		padding: 50px 20px;
	}

	h2.owl-plot-single-similar__heading {
		font-size: 30px;
	}

	.owl-plot-single-similar .owl-plot-single-similar__button {
		width: 45px;
		height: 45px;
	}

	.owl-plot-single-similar__carousel {
		margin-top: 35px;
	}

	.owl-plot-single-similar__slide,
	.owl-plot-single-similar__card {
		width: min(327px, calc(var(--owl-plot-similar-viewport, 100vw) - 40px));
	}

	.owl-plot-single-similar__card {
		min-height: 535px;
	}

	.owl-plot-single-similar__card .owl-development-plot-card__media {
		height: 245px;
	}

	.owl-plot-single-similar__card .owl-development-plot-card__body {
		padding: 18px 22px 22px;
	}

	.owl-plot-single-similar__card .owl-development-plot-card__title,
	.owl-plot-single-similar__card .owl-development-plot-card__title-name,
	.owl-plot-single-similar__card .owl-development-plot-card__title-plot {
		line-height: 1.2;
	}

	.owl-plot-single-similar__card .owl-development-plot-card__title-name {
		font-size: 24px;
	}

	.owl-plot-single-similar__card .owl-development-plot-card__title-plot {
		font-size: 18px;
	}

	.owl-plot-single-calculators {
		padding: 50px 20px;
	}

	.owl-plot-single-calculators__tabs {
		gap: 28px;
		margin-bottom: 35px;
	}

	.owl-plot-single-calculators__split,
	.owl-plot-single-calculators__rate {
		grid-template-columns: minmax(0, 1fr) 109px;
	}

	.owl-plot-single-calculators__input {
		min-height: 45px;
		padding-right: 20px;
		padding-left: 20px;
		font-size: 16px;
	}

	.owl-plot-single-calculators__result {
		min-height: 0;
		padding: 25px;
	}

	.owl-plot-single-calculators__result-heading {
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 20px;
	}

	.owl-plot-single-calculators__result h3 {
		font-size: 22px;
	}

	.owl-plot-single-calculators__result-heading p {
		font-size: 36px;
	}

	.owl-plot-single-calculators__result-divider {
		margin: 35px 0;
	}

	.owl-development-single-status-pill {
		font-size: 14px;
	}

	.owl-development-single-local-carousel {
		--owl-local-area-slide-width: min(296px, calc(100vw - 40px));
	}

	.owl-development-single-local-carousel__slide {
		aspect-ratio: 296 / 199;
		border-radius: 15px;
	}

	.owl-development-single-local-carousel__button {
		display: none;
	}

	.owl-development-single-hero-summary {
		width: 100%;
		max-width: 356px;
	}

	.owl-development-single-overview-actions {
		align-items: flex-start;
		justify-content: flex-start;
		gap: 20px;
	}

	.owl-development-plots__toolbar {
		margin-bottom: 20px;
		gap: 15px;
	}

	.owl-development-plots__grid {
		grid-template-columns: 1fr;
		gap: 30px;
	}

	.owl-development-plot-card {
		display: flex;
		height: 544px;
		flex-direction: column;
		border-radius: 10px;
	}

	.owl-development-plot-card__media {
		height: 271px;
		aspect-ratio: auto;
		border-radius: 10px 10px 0 0;
	}

	.owl-development-plot-card__status {
		display: none;
	}

	.owl-development-plot-card__offer {
		min-height: 35px;
		padding: 6px 10px;
		font-size: 16px;
		line-height: 1;
	}

	.owl-plot-single-similar__card .owl-development-plot-card__offer {
		min-height: 35px;
		margin-top: -35px;
	}

	.owl-development-plot-card__body {
		display: flex;
		flex: 1;
		flex-direction: column;
		padding: 20px;
	}

	.owl-development-plot-card__title {
		margin-bottom: 14px;
		font-size: 28px;
		line-height: 31px;
	}

	.owl-development-plot-card__title-plot {
		font-size: 20px;
		line-height: 31px;
	}

	.owl-development-plot-card__details {
		gap: 7px;
		margin-bottom: 15px;
	}

	.owl-development-plot-card__detail {
		gap: 12px;
		font-size: 16px;
		line-height: 1.2;
	}

	.owl-development-plot-card__detail span {
		width: 16px;
		height: 16px;
		flex-basis: 16px;
	}

	.owl-development-plot-card__footer {
		margin-top: auto;
	}

	.owl-development-plot-card__price {
		font-size: 24px;
		line-height: 1;
	}

	.owl-development-plot-card__arrow {
		width: 35px;
		height: 35px;
		flex-basis: 35px;
		background-size: 10px 18px;
	}

	.owl-development-plots .owl-development-plots__load-more {
		width: 157px;
		min-height: 40px;
		margin-top: 40px;
	}

	.owl-development-plots .owl-development-plots__load-more-icon svg {
		width: 16px;
		height: 16px;
	}

	.owl-development-site-plan {
		border-radius: 0;
	}

	.owl-development-site-plan__sidebar {
		padding: 40px 20px 20px;
	}

	.owl-development-site-plan__sidebar-copy {
		margin-bottom: 13px;
	}

	.owl-development-site-plan__filters-note,
	.owl-development-site-plan__empty {
		font-size: 14px;
	}

	.owl-development-site-plan__tabs {
		width: 100%;
		min-height: 0;
		margin-bottom: 0;
	}

	.owl-development-site-plan__canvas {
		padding: 0;
	}

	.owl-development-site-plan__notice {
		top: 17px;
		right: 20px;
		left: 20px;
		min-height: 45px;
		padding: 5px 10px;
		justify-content: flex-start;
		gap: 10px;
		font-size: 14px;
		line-height: 20px;
	}

	.owl-development-site-plan__image-wrap {
		aspect-ratio: auto;
		height: 460px;
		min-height: 0;
		touch-action: none;
	}

	.owl-development-site-plan__key-list {
		max-height: none;
		overflow-y: visible;
		padding-right: 0;
	}

	.owl-development-site-plan__stage {
		top: 50%;
		left: 50%;
		width: min(100cqw, calc(100cqh * (var(--site-plan-aspect, 2560 / 1810))));
		height: auto;
		aspect-ratio: var(--site-plan-aspect, 2560 / 1810);
		transform: translate(-50%, -50%) translate(var(--site-plan-pan-x, 0px), var(--site-plan-pan-y, 0px)) scale(var(--site-plan-zoom, 1));
		transform-origin: center center;
	}

	.owl-development-site-plan .owl-development-site-plan__image {
		width: 100%;
		height: 100%;
		object-fit: contain;
	}

	.owl-development-site-plan.is-enlarged .owl-development-site-plan__stage {
		flex: 0 0 auto;
		width: auto;
		height: auto;
		aspect-ratio: auto;
		max-width: 100vw;
		max-height: 100dvh;
	}

	.owl-development-site-plan__marker {
		width: 22px;
		height: 22px;
		font-size: 10px;
	}

	.owl-development-site-plan__popover {
		width: min(350px, calc(100% - 40px));
		height: 143px;
		transform: translate(-50%, calc(-100% - 18px));
	}

	.owl-development-site-plan__popover.has-image {
		width: min(350px, calc(100% - 24px));
		grid-template-columns: minmax(0, 1fr) minmax(0, 140px);
	}

	.owl-development-site-plan__popover.has-image .owl-development-site-plan__popover-image {
		display: block;
	}

	.owl-development-site-plan__popover-body {
		height: 143px;
		padding: 14px;
		grid-template-columns: 1fr auto;
		grid-template-areas:
			"title title"
			"details details"
			"price link";
		align-content: space-between;
	}

	.owl-development-site-plan__popover-price {
		align-self: center;
	}

	.owl-development-site-plan__popover-link {
		grid-area: link;
		margin-top: 0;
		align-self: center;
		justify-self: end;
	}

	.owl-development-site-plan__popover-link-word {
		display: none;
	}

	.owl-development-site-plan__popover-title {
		font-size: 24px;
	}

	.owl-development-site-plan__map-controls {
		bottom: 17px;
		left: 20px;
		gap: 17px;
	}

	.owl-development-site-plan .owl-development-site-plan__expand {
		right: 20px;
		bottom: 17px;
	}

	.owl-development-single-map {
		height: 360px;
		min-height: 360px;
	}

}

.owl-plot-single-highlights__stats.owl-plot-single-summary {
	padding-left: 0;
	padding-right: 0;
}

.owl-development-single-features-heading.elementor-widget-heading {
	padding-left: var(--owl-container-gutter);
	padding-right: var(--owl-container-gutter);
}

.owl-development-single-feature-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	column-gap: 70px;
	row-gap: 30px;
}

.single-development .owl-development-single-feature-grid {
	padding-left: var(--owl-container-gutter);
	padding-right: var(--owl-container-gutter);
}

.owl-development-single-feature-item {
	display: flex;
	align-items: flex-start;
	gap: 15px;
}

.owl-development-single-feature-icon {
	flex: 0 0 auto;
	line-height: 0;
}

.owl-development-single-feature-icon img {
	display: block;
	width: 30px;
	height: 30px;
}

.owl-development-single-feature-text {
	margin: 0;
	font-size: 20px;
	line-height: 28px;
	font-weight: 400;
	color: var(--owl-ink);
}

@media (max-width: 1024px) {

	.owl-development-single-feature-grid {
		grid-template-columns: 1fr;
		row-gap: 25px;
	}

	.owl-development-single-feature-item {
		gap: 10px;
	}

	.owl-development-single-feature-icon img {
		width: 25px;
		height: 25px;
	}

	.owl-development-single-feature-text {
		font-size: 16px;
		line-height: 20px;
	}
}

/* ==========================================================================
   Plot offer block — match plot design (Figma 1124:2690):
   WHITE lozenge + GOLD "Book a Viewing" button (homepage stays gold/white).
   ========================================================================== */
body.single-development_plot .owl-homes-offer-feature-badge .elementor-heading-title {
	background-color: #ffffff;
	color: #373737;
}
body.single-development_plot .owl-homes-offer-feature-button .elementor-button {
	background-color: var(--owl-gold) !important;
	color: #373737 !important;
}
body.single-development_plot .owl-homes-offer-feature-button .elementor-button:hover,
body.single-development_plot .owl-homes-offer-feature-button .elementor-button:focus {
	background-color: #ffffff;
	color: #373737;
}
body.single-development_plot .owl-homes-offer-feature-button .elementor-button-icon svg path {
	fill: #373737;
}

/* ==========================================================================
   Affordability + Stamp Duty calculators (built to match the Mortgage calc)
   ========================================================================== */
.owl-plot-single-calculators__buyer-types {
	display: block;
	margin: 0;
	padding: 0;
	border: 0;
	min-width: 0;
}

.owl-plot-single-calculators__buyer-types .owl-plot-single-calculators__label {
	display: block;
	margin: 0 0 12px;
	padding: 0;
}

.owl-plot-single-calculators__radio {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 0 10px;
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 18px;
	line-height: 1.4;
	cursor: pointer;
}

.owl-plot-single-calculators__radio input[type="radio"] {
	appearance: none;
	-webkit-appearance: none;
	width: 20px;
	height: 20px;
	margin: 0;
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1.5px solid #cfcfcf;
	border-radius: 50%;
	background: #fff;
	cursor: pointer;
	transition: border-color 0.15s ease;
}

.owl-plot-single-calculators__radio input[type="radio"]:checked {
	border-color: var(--owl-gold);
}

.owl-plot-single-calculators__radio input[type="radio"]:checked::after {
	content: "";
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--owl-gold);
}

.owl-plot-single-calculators__radio input[type="radio"]:focus-visible {
	outline: 2px solid var(--owl-gold);
	outline-offset: 2px;
}


@media (min-width: 1025px) {
	body.single-development_plot .elementor-element.elementor-element-plHeroIn {
		grid-template-rows: 1fr auto;
	}
	body.single-development_plot .elementor-element-plHeroIm,
	body.single-development_plot .elementor-element-plHeroIm > .elementor-widget-container,
	body.single-development_plot .elementor-element-plHeroIm img {
		height: 100%;
	}
}

/* ≤1024: plot stacks (text / offer / photo). Keep the hero level via min-height,
   but make ONLY the photo row flexible (auto auto 1fr) so the photo fills the
   leftover space — otherwise the grid spreads the slack across all rows,
   stretching the offer bar and leaving a gap under the photo. */
@media (max-width: 1024px) {
	/* Switch the split grid to a flex column (text / offer / photo via order) so
	   the photo can flex-grow to fill exactly the leftover space — the grid
	   couldn't shrink the photo row below the image's intrinsic height. */
	body.single-development_plot .elementor-element.elementor-element-plHeroIn {
		display: flex !important;
		flex-direction: column;
		min-height: 0 !important;
	}
	body.single-development_plot .elementor-element-plHeroCp { order: 1; }
	body.single-development_plot .elementor-element-plHeroOf { order: 2; }
	/* Photo is a fixed full-width banner below the text + offer (Figma mobile plot
	   hero: image block 390x318). Not flex-leftover — that squeezed it to a strip. */
	body.single-development_plot .elementor-element-plHeroIm {
		order: 3;
		flex: 0 0 auto;
		height: 320px;
		position: relative;
		overflow: hidden;
	}
	body.single-development_plot .elementor-element-plHeroIm > .elementor-widget-container {
		position: static;
		height: 100%;
	}
	body.single-development_plot .elementor-element-plHeroIm img {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
}

/* Offer strip — SINGLE SOURCE OF TRUTH for plot + development single, so both
   stay identical. Figma node 1087-2649 is the FULL-WIDTH strip: 50px tall, 22px
   Nexa Extra Bold, 3px top border. 40px and 18px at ≤1024. The narrower
   1087-2709 / 979-2691 frames are the CARD offer, which is smaller. */
body.single-development_plot .owl-plot-single-offer-strip,
body.single-development .owl-development-single-offer-strip {
	height: 50px;
	min-height: 50px;
	padding: 0 10px;
	background: var(--owl-gold);
	border: 0;
	border-top: 3px solid var(--owl-cream);
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
}
body.single-development_plot .owl-plot-single-offer-strip,
body.single-development_plot .elementor-element.owl-plot-single-offer-strip .elementor-heading-title,
body.single-development .owl-development-single-offer-strip,
body.single-development .elementor-element.owl-development-single-offer-strip .elementor-heading-title {
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 22px;
	font-weight: 800;
	line-height: 1;
}
@media (max-width: 1024px) {
	body.single-development_plot .owl-plot-single-offer-strip,
	body.single-development .owl-development-single-offer-strip {
		height: 40px;
		min-height: 40px;
		border-top: 2px solid var(--owl-cream);
		border-bottom: 0;
	}
	body.single-development_plot .owl-plot-single-offer-strip,
	body.single-development_plot .elementor-element.owl-plot-single-offer-strip .elementor-heading-title,
	body.single-development .owl-development-single-offer-strip,
	body.single-development .elementor-element.owl-development-single-offer-strip .elementor-heading-title {
		font-size: 18px;
	}
}

/* Fills the slide so the wrapped image still resolves its own height:100% and the slide background never shows through. */

.is-playing-video .owl-development-single-local-carousel__caption {
	display: none;
}

@media (max-width: 1024px) {
	.owl-gallery-video__play {
		width: 60px;
		height: 60px;
	}

	.owl-gallery-video__play::before {
		border-width: 10px 0 10px 18px;
	}
}

@media (max-width: 1024px) {
	/* Inside the drawer it is one of the stacked controls, not a row of its own. */
	.owl-development-plots__sort-row {
		display: block;
		width: 100%;
		margin: 0;
		order: 3;
	}

	.owl-development-plots__sort select {
		min-width: 0;
		min-height: 30px;
		padding: 0 26px 0 0;
	}


}

/* The Features control is a multi-select dressed as a dropdown so it sits in the
   filter row like the others. Selectors are scoped past .elementor-kit-6 button
   (0,2,1), which otherwise paints the toggle charcoal so it reads as selected. */
.owl-plot-features-field {
	position: relative;
}

.owl-development-plots .owl-plot-features-toggle,
.owl-development-site-plan .owl-plot-features-toggle {
	display: block;
	width: 100%;
	min-width: 0;
	min-height: 50px;
	padding: 0 53px 0 20px;
	border: 1px solid var(--owl-line);
	border-radius: var(--owl-radius-pill);
	background: var(--owl-white);
	color: var(--owl-charcoal);
	font-family: var(--owl-text-font);
	font-size: 16px;
	font-weight: 400;
	line-height: 1;
	text-align: left;
	cursor: pointer;
}

.owl-development-site-plan .owl-development-site-plan__filter-field .owl-plot-features-toggle {
	min-height: 45px;
	padding: 0 45px 0 18px;
	font-size: 14px;
}

.owl-plot-features-field.has-value .owl-plot-features-toggle {
	border-color: var(--owl-charcoal);
}

.owl-plot-features-panel {
	/* Fixed, not absolute: the site plan wrapper is overflow:hidden so it would
	   clip an absolutely positioned panel away entirely. JS sets top/left/width
	   from the toggle. */
	position: fixed;
	z-index: 60;
	display: flex;
	flex-direction: column;
	gap: 4px;
	box-sizing: border-box;
	min-width: 220px;
	padding: 12px;
	overflow-y: auto;
	border: 1px solid var(--owl-line);
	border-radius: 20px;
	background: var(--owl-white);
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);
	overscroll-behavior: contain;
}

.owl-plot-features-panel[hidden] {
	display: none;
}

.owl-plot-features-option {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 9px 10px;
	border-radius: 12px;
	color: var(--owl-charcoal);
	font-size: 16px;
	line-height: 1.3;
	cursor: pointer;
}

.owl-plot-features-option:hover {
	background: var(--owl-cream, #faf7f0);
}

.owl-plot-features-option input {
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	margin: 0;
	accent-color: var(--owl-charcoal);
	cursor: pointer;
}

/* Book a Viewing in the offer band had its chevron on the left while every other
   button on the plot page has it on the right.
   ⚠️ NOT a styling choice being overridden — the widget's own Icon Position is
   set correctly in Elementor, but Elementor refuses to generate the rule for this
   one widget. Its siblings (plHeroBt, plBroView, plBroBt) all get
   `.elementor-button-content-wrapper{flex-direction:row-reverse}` in
   post-1457.css and this one never does, at any setting value, across a full CSS
   regeneration. This is that missing rule, written by hand to match. Re-picking
   the icon position in the Elementor editor may repair it properly, at which
   point this can go. */
.elementor-1457 .elementor-element.elementor-element-86c09bb .elementor-button-content-wrapper {
	flex-direction: row-reverse;
}

/*
 * A sold plot cannot be viewed, so its three Book a Viewing prompts come off:
 * the hero button, the offer band button and the one beside the brochure.
 * Driven by the body class set in inc/plot-single.php.
 */
.owl-plot-sold .owl-plot-single-hero__button,
.owl-plot-sold .owl-homes-offer-feature-button,
.owl-plot-sold .owl-plot-single-brochure-download__viewing {
	display: none;
}
