@font-face {
	font-family: "Cormorant Garamond";
	font-style: normal;
	font-weight: 400 600;
	font-display: swap;
	src: url("../assets/fonts/cormorant-garamond-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Manrope";
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url("../assets/fonts/manrope-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
	--paper: #fbfaf6;
	--paper-warm: #f2eee5;
	--ink: #1d211e;
	--ink-soft: #4c544d;
	--line: rgba(29, 33, 30, .15);
	--green: #52733b;
	--green-deep: #263d2e;
	--green-soft: #dfe7d7;
	--purple: #6d2f73;
	--purple-deep: #3f1e49;
	--purple-soft: #eadfed;
	--sea: #477887;
	--white: #fff;
	--shadow-sm: 0 12px 30px rgba(24, 31, 25, .08);
	--shadow-lg: 0 30px 80px rgba(24, 31, 25, .16);
	--shell: min(1180px, calc(100% - 48px));
	--section-space: clamp(88px, 10vw, 140px);
	--header-height: 250px;
	/* Anchored sections are always reached in the header's compact state. */
	--anchor-offset: 100px;
	--radius-sm: 12px;
	--radius-md: 22px;
	--radius-lg: 36px;
	--font-display: "Cormorant Garamond", Georgia, "Times New Roman", serif;
	--font-sans: "Manrope", "Segoe UI", Helvetica, Arial, sans-serif;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
	scroll-padding-top: var(--anchor-offset);
}

body {
	margin: 0;
	background: var(--paper);
	color: var(--ink);
	font-family: var(--font-sans);
	font-size: 16px;
	line-height: 1.65;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	text-wrap: balance;
}

body.nav-open {
	overflow: hidden;
}

img,
svg,
video,
iframe {
	display: block;
	max-width: 100%;
}

picture {
	display: contents;
}

img {
	height: auto;
}

a {
	color: inherit;
	text-decoration-line: underline;
	text-decoration-color: #CCC;
	text-decoration-style: dashed;
	text-underline-offset: .18em;
}

a:hover {
	text-decoration-color: currentColor;
	text-decoration-style: solid;
}

.button,
.button--outline,
.text-link,
.resource-card,
.brand,
.primary-nav a,
.site-footer nav a,
.contact__details > a,
.skip-link {
	text-decoration: none;
}

button,
input,
textarea,
select {
	font: inherit;
}

button,
a {
	-webkit-tap-highlight-color: transparent;
}

::selection {
	background: var(--purple);
	color: var(--white);
}

.shell {
	width: var(--shell);
	margin-inline: auto;
}

.shell h2 {
	margin-bottom: 0;
}

.skip-link {
	position: fixed;
	top: 10px;
	left: 10px;
	z-index: 2000;
	padding: 10px 14px;
	background: var(--white);
	color: var(--ink);
	border-radius: 4px;
	transform: translateY(-150%);
	transition: transform .2s ease;
}

.skip-link:focus {
	transform: translateY(0);
}

h1,
h2,
h3,
p {
	margin-top: 0;
}

h1,
h2,
h3 {
	font-family: var(--font-display);
	font-weight: 500;
	line-height: 1.02;
	letter-spacing: -.035em;
}

h1 {
	font-size: clamp(3.6rem, 7.25vw, 7rem);
}

h2 {
	font-size: clamp(2.75rem, 5.4vw, 5.25rem);
}

h3 {
	font-size: clamp(1.55rem, 2.4vw, 2.15rem);
}

p:last-child {
	margin-bottom: 0;
}

#geopark-network,
.team-dialog-subtitle {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 20px;
	color: var(--green);
	font-size: .72rem;
	font-weight: 750;
	letter-spacing: .16em;
	line-height: 1.4;
	text-transform: uppercase;
}

/* #geopark-network::before {
	content: "";
	width: 28px;
	height: 1px;
	background: currentColor;
} */

#geopark-network {
	color: rgba(255, 255, 255, .82);
}

#geopark-network {
	justify-content: right;
	margin-bottom: 0;
}

.lead-copy {
	font-family: var(--font-display);
	font-size: clamp(1.4rem, 2vw, 2rem);
	line-height: 1.45;
	letter-spacing: -.02em;
}

.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 54px;
	padding: 14px 25px;
	border: 1px solid transparent;
	border-radius: 999px;
	font-size: .78rem;
	font-weight: 750;
	letter-spacing: .1em;
	line-height: 1;
	text-transform: uppercase;
	transition: transform .25s ease, background-color .25s ease, color .25s ease, border-color .25s ease;
}

.button:hover {
	transform: translateY(-2px);
}

.button:focus-visible,
.text-link:focus-visible,
.button--outline:focus-visible,
.primary-nav a:focus-visible,
.resource-card:focus-visible,
.brand:focus-visible,
.nav-toggle:focus-visible {
	outline: 3px solid color-mix(in srgb, var(--purple) 72%, white);
	outline-offset: 4px;
}

.button--light {
	background: var(--white);
	color: var(--green-deep);
}

.button--light:hover {
	background: var(--green-soft);
}

.button--dark {
	background: var(--green-deep);
	color: var(--white);
}

.button--dark:hover {
	background: var(--purple-deep);
}

.text-link {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding-bottom: 6px;
	border-bottom: 1px solid currentColor;
	color: var(--green-deep);
	font-size: .78rem;
	font-weight: 750;
	letter-spacing: .09em;
	line-height: 1.4;
	text-transform: uppercase;
	transition: color .2s ease, gap .2s ease;
}

.text-link:hover {
	gap: 17px;
	color: var(--purple);
}

.text-link--light {
	color: var(--white);
}

.text-link--light:hover {
	color: var(--green-soft);
}

.section {
	padding-block: var(--section-space);
}

.site-header {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 1000;
	width: 100%;
	color: var(--white);
	transition: background-color .3s ease, box-shadow .3s ease, color .3s ease, transform .3s ease;
}

.site-header.is-scrolled {
	background: rgba(251, 250, 246, .92);
	box-shadow: 0 1px 0 rgba(29, 33, 30, .1);
	color: var(--ink);
	-webkit-backdrop-filter: blur(18px);
	backdrop-filter: blur(18px);
}

.site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: var(--header-height);
	gap: 28px;
	transition: min-height .3s ease;
}

.brand {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	flex: 0 0 auto;
}

.brand__mark {
	width: 46px;
	height: 46px;
}

.brand__wordmark {
	display: flex;
	flex-direction: column;
	font-family: var(--font-display);
	font-size: 1.35rem;
	font-weight: 700;
	letter-spacing: -.025em;
	line-height: .98;
}

.brand__wordmark > span {
	color: currentColor;
}

.brand__wordmark small {
	margin-top: 4px;
	color: var(--purple-soft);
	font-family: var(--font-sans);
	font-size: .58rem;
	font-weight: 750;
	letter-spacing: .2em;
	line-height: 1;
	text-transform: uppercase;
}

.site-header.is-scrolled .brand__wordmark small {
	color: var(--purple);
}

.primary-nav {
	display: flex;
	align-items: center;
	gap: clamp(18px, 2.5vw, 36px);
}

.primary-nav a {
	position: relative;
	font-size: .74rem;
	font-weight: 700;
	letter-spacing: .09em;
	text-transform: uppercase;
}

.primary-nav a:not(.button--outline)::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -7px;
	width: 100%;
	height: 1px;
	background: currentColor;
	transform: scaleX(0);
	transform-origin: right;
	transition: transform .25s ease;
}

.primary-nav a:hover::after,
.primary-nav a.is-active::after {
	transform: scaleX(1);
	transform-origin: left;
}

.button--outline {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 11px 18px;
	border: 1px solid currentColor;
	border-radius: 999px;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

.button--outline--light {
	border-color: rgba(255, 255, 255, .55);
	color: var(--white);
}

.site-header.is-scrolled .button--outline {
	border-color: var(--green-deep);
	color: var(--green-deep);
}

.button--outline--light:hover {
	background: var(--white);
	border-color: var(--white);
	color: var(--green-deep);
}

.site-header.is-scrolled .button--outline:hover {
	background: var(--green-deep);
	border-color: var(--green-deep);
	color: var(--white);
}

.nav-toggle {
	display: none;
	align-items: center;
	gap: 12px;
	padding: 8px 0;
	border: 0;
	background: transparent;
	color: inherit;
	cursor: pointer;
	/* transform: translateY(25%); */
}

body.nav-open .nav-toggle {
	color: var(--white);
}

.nav-toggle__label {
	font-size: .72rem;
	font-weight: 750;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.nav-toggle__icon {
	position: relative;
	width: 24px;
	height: 16px;
}

.nav-toggle__icon i {
	position: absolute;
	left: 0;
	width: 24px;
	height: 1px;
	background: currentColor;
	transition: transform .25s ease, top .25s ease;
}

.nav-toggle__icon i:first-child {
	top: 4px;
}

.nav-toggle__icon i:last-child {
	top: 12px;
}

.nav-toggle[aria-expanded="true"] .nav-toggle__icon i:first-child {
	top: 8px;
	transform: rotate(45deg);
}

.nav-toggle[aria-expanded="true"] .nav-toggle__icon i:last-child {
	top: 8px;
	transform: rotate(-45deg);
}

.hero {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 100svh;
	padding-top: var(--header-height);
	overflow: hidden;
	background: var(--green-deep);
	color: var(--white);
}

.hero__media,
.hero__veil {
	position: absolute;
	inset: 0;
}

.hero__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 52% center;
	transform-origin: center;
	backface-visibility: hidden;
	will-change: transform;
	animation: hero-zoom 18s linear both;
}

.hero__veil {
	/* background:
		linear-gradient(90deg,
			rgba(20, 31, 23, .45) 0%,
			rgba(20, 31, 23, .15) 76%
		),
		linear-gradient(180deg,
			rgba(15, 24, 18, .10) 0%,
			transparent 42%,
			rgba(15, 24, 18, .10) 0%
		); */
	background:
		linear-gradient(180deg,
			rgba(20, 31, 23, .35) 0%,
			transparent 35%
			/* rgba(20, 31, 23, .15) 76% */
		);
}

.hero__content {
	position: relative;
	z-index: 2;
	padding-block: 20px 40px;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	row-gap: 10px;
}

.hero h1 {
	max-width: 950px;
	margin-bottom: 30px;
	line-height: 1;
	font-size: clamp(3.5rem, 10vw, 6.5rem);
	text-shadow: 1px 1px 25px black;
}

.hero__lead {
	max-width: clamp(450px, 50%, 50vw);
	margin-bottom: 38px;
	color: rgba(255, 255, 255, .9);
	font-family: var(--font-display);
	font-size: clamp(1.2rem, 2vw, 1.7rem);
	line-height: 1.45;
	text-shadow: 1px 1px 25px black;
}

.hero__actions {
	display: flex;
	align-items: center;
	gap: 15px;
	flex-wrap: nowrap;
}

.hero__facts {
	position: absolute;
	left: 50%;
	bottom: 30px;
	z-index: 2;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	transform: translateX(-50%);
	border-top: 1px solid rgba(255, 255, 255, .28);
}

.hero__facts div {
	display: flex;
	flex-direction: column;
	gap: 3px;
	padding: 22px 24px 0;
	border-left: 1px solid rgba(255, 255, 255, .2);
}

.hero__facts div:first-child {
	padding-left: 0;
	border-left: 0;
}

.hero__facts strong {
	font-family: var(--font-display);
	font-size: 1.25rem;
	font-weight: 400;
}

.hero__facts span {
	color: rgba(255, 255, 255, .68);
	font-size: .72rem;
	letter-spacing: .04em;
}

.hero__scroll {
	position: absolute;
	right: 28px;
	bottom: 20px;
	z-index: 3;
	display: flex;
	align-items: center;
	gap: 12px;
	transform: rotate(90deg) translateX(-25px);
	transform-origin: right bottom;
	font-size: .66rem;
	font-weight: 750;
	letter-spacing: .18em;
	text-transform: uppercase;
}

.hero__scroll i {
	display: block;
	width: 50px;
	height: 1px;
	background: rgba(255, 255, 255, .72);
}

@keyframes hero-zoom {
	from { transform: translate3d(0, 0, 0) scale(1.04); }
	to { transform: translate3d(0, 0, 0) scale(1); }
}

/*
 * Firefox visibly steps large, full-viewport images during long-running
 * scale transforms. The zoom is decorative, so keep the image static there.
 */
@supports (-moz-appearance: none) {
	.hero__media img {
		animation: none;
		transform: none;
		will-change: auto;
	}
}

.section--intro {
	background: var(--paper);
}

.intro-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(300px, .8fr);
	gap: clamp(60px, 10vw, 150px);
	align-items: end;
}

.intro-grid h2 {
	max-width: 760px;
}

.intro-scene {
	position: relative;
	margin: clamp(38px, 5vw, 64px) 0 0;
	overflow: hidden;
	aspect-ratio: 16 / 9;
	border-radius: 0 var(--radius-lg) 0 var(--radius-lg);
	box-shadow: var(--shadow-lg);
}

.intro-scene::after {
	content: "";
	position: absolute;
	inset: 42% 0 0;
	background: linear-gradient(0deg, rgba(20, 31, 23, .76), transparent);
	pointer-events: none;
}

.intro-scene img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .8s cubic-bezier(.2, .8, .2, 1);
}

.intro-scene:hover img {
	transform: scale(1.025);
}

.intro-scene figcaption {
	position: absolute;
	right: clamp(22px, 4vw, 42px);
	bottom: clamp(20px, 4vw, 38px);
	left: clamp(22px, 4vw, 42px);
	z-index: 1;
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 24px;
	color: var(--white);
}

.intro-scene figcaption span {
	font-size: .65rem;
	font-weight: 750;
	letter-spacing: .13em;
	text-transform: uppercase;
}

.intro-scene figcaption strong {
	max-width: 270px;
	font-family: var(--font-display);
	font-size: clamp(1.2rem, 2vw, 1.75rem);
	font-weight: 400;
	line-height: 1.15;
	text-align: right;
}

.intro-grid__copy {
	padding-top: 50px;
}

.intro-grid__copy p {
	color: var(--ink-soft);
}

.intro-grid__copy .lead-copy {
	color: var(--ink);
}

.intro-grid__copy .text-link {
	margin-top: 24px;
}

.feature-band {
	padding-block: 0 var(--section-space);
}

.feature-band__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	border-top: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
}

.feature-card {
	position: relative;
	/* min-height: 330px; */
	padding: 46px clamp(28px, 4vw, 54px) 44px;
	border-left: 1px solid var(--line);
}

.feature-card:first-child {
	padding-left: 0;
	border-left: 0;
}

.feature-card:last-child {
	padding-right: 0;
}

.feature-card__number {
	display: none;
	/* display: block; */
	/* margin-bottom: 60px; */
	/* color: var(--purple); */
	/* font-size: .72rem; */
	/* font-weight: 750; */
	/* letter-spacing: .16em; */
}

.feature-card h3 {
	margin-bottom: 20px;
	color: var(--purple);
}

.feature-card p {
	margin-bottom: 0;
	color: var(--ink-soft);
	font-size: .92rem;
}

.property {
	background: var(--paper-warm);
	overflow: hidden;
}

.property__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(380px, .8fr);
	grid-template-areas:
		"media content"
		"types content";
	column-gap: clamp(60px, 9vw, 130px);
	row-gap: 48px;
	align-items: center;
}

.property__media {
	grid-area: media;
	position: relative;
	min-height: 560px;
}

.property__image {
	position: absolute;
	margin: 0;
	overflow: hidden;
	box-shadow: var(--shadow-lg);
}

.property__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .8s cubic-bezier(.2, .8, .2, 1);
}

.property__image:hover img {
	transform: scale(1.025);
}

.property__image--primary {
	top: 0;
	left: 0;
	width: calc(100% - 12px);
	height: 78%;
	border-radius: var(--radius-lg) 0 var(--radius-lg) var(--radius-lg);
}

.property__image--primary img {
	object-position: left bottom;
}

.property__image--secondary {
	right: 0;
	bottom: 0;
	width: 51%;
	height: 48%;
	border: 12px solid var(--paper-warm);
	border-radius: var(--radius-md) var(--radius-md) 0 var(--radius-md);
}

.property__image--secondary img {
	object-position: right top;
}

.property__caption {
	--xpadding: 24px;
	--ypadding: 20px;
	--top: calc(78% + var(--ypadding));
	--left: var(--radius-lg);
	--right: calc(51% + var(--xpadding));
	--xmargins: calc(var(--left) + var(--right));
	--ymargins: calc(var(--top) + 12px);

	position: absolute;
	left: var(--left);
	top: var(--top);
	z-index: 2;
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: calc(100% - var(--xmargins));
	height: calc(100% - var(--ymargins));
	padding: var(--ypadding) var(--xpadding);
	background: var(--purple-deep);
	color: var(--white);
	box-shadow: var(--shadow-sm);
}

.property__caption span {
	font-size: .62rem;
	font-weight: 750;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.property__caption strong {
	margin-top: 5px;
	font-family: var(--font-display);
	font-size: 1.3rem;
	font-weight: 400;
	line-height: 1;
}

.property__content h2 {
	margin-bottom: 30px;
}

.property__content {
	grid-area: content;
}

.property__content > p {
	color: var(--ink-soft);
}

.property-types {
	grid-area: types;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 30px;
	padding-top: 36px;
	border-top: 1px solid var(--line);
}

.property-types h3 {
	margin-bottom: 13px;
	font-size: 1.55rem;
}

.property-types p {
	margin-bottom: 0;
	color: var(--ink-soft);
	font-size: .9rem;
}

.property__list {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 8px 24px;
	margin: 42px 0 0;
	padding: 0;
	list-style: none;
}

.property__list li {
	position: relative;
	padding: 11px 0 11px 24px;
	border-bottom: 1px solid var(--line);
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.property__list li::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: 8px;
	height: 8px;
	border: 2px solid var(--green);
	border-radius: 50%;
	transform: translateY(-50%);
}

.geopark {
	position: relative;
	padding-block: var(--section-space);
	overflow: hidden;
	background: var(--purple-deep);
	color: var(--white);
}

.geopark::before {
	content: "";
	position: absolute;
	inset: 0;
	background: url("../assets/images/rockcliffe-beach-walk.jpg") center 58% / cover no-repeat;
	opacity: .1;
	pointer-events: none;
}

.geopark__texture {
	position: absolute;
	inset: 0;
	background:
		radial-gradient(circle at 15% 20%, rgba(255, 255, 255, .08), transparent 28%),
		repeating-linear-gradient(123deg, transparent 0 22px, rgba(255, 255, 255, .018) 22px 23px);
}

.geopark__grid {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(330px, .75fr);
	gap: clamp(60px, 11vw, 160px);
	align-items: start;
}

.geopark h2 {
	width: min(100%, 420px);
	font-size: clamp(3rem, 7vw, 7rem);
}

.geopark__logo {
	display: block;
	width: 100%;
	height: auto;
	margin-top: clamp(36px, 5vw, 64px);
}

.geopark__identity {
	width: min(100%, 420px);
}

.geopark__copy {
	/* padding-top: 50px; */
}

.geopark__copy > p {
	color: rgba(255, 255, 255, .78);
	font-family: var(--font-display);
	font-size: clamp(1.25rem, 1.8vw, 1.7rem);
	line-height: 1.55;
}

.geopark__stat {
	display: grid;
	gap: 8px;
	margin-top: 50px;
	padding-top: 35px;
	border-top: 1px solid rgba(255, 255, 255, .22);
}

.geopark__stat strong {
	color: #c9d9b9;
	font-family: var(--font-display);
	font-size: clamp(3.2rem, 5.5vw, 5.8rem);
	font-weight: 400;
	letter-spacing: -.05em;
	line-height: 1;
}

.geopark__stat span {
	max-width: 430px;
	color: rgba(255, 255, 255, .7);
	font-size: .78rem;
	letter-spacing: .05em;
	text-transform: uppercase;
}

.film {
	background: var(--paper);
}

.film__grid {
	display: grid;
	grid-template-columns: minmax(270px, .65fr) minmax(0, 1.45fr);
	gap: clamp(50px, 8vw, 120px);
	align-items: center;
}

.film__intro h2 {
	font-size: clamp(2.6rem, 4.6vw, 4.6rem);
	margin-bottom: 30px;
}

.film__intro p:last-child {
	color: var(--ink-soft);
}

.film__frame {
	position: relative;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: var(--paper);
	box-shadow: var(--shadow-lg);
	border-radius: var(--radius-md) 0 var(--radius-md) 0;
}

.film__frame::after {
	content: "";
	position: absolute;
	inset: 12px;
	z-index: 3;
	border: 1px solid rgba(255, 255, 255, .25);
	border-radius: var(--radius-sm) 0 var(--radius-sm) 0;
	pointer-events: none;
}

.film__frame iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
}

.film__poster {
	position: absolute;
	inset: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 1;
	visibility: visible;
	pointer-events: none;
	transition: opacity .35s ease, visibility 0s linear .35s;
}

.film__frame.is-playing .film__poster {
	opacity: 0;
	visibility: hidden;
}

.section--map {
	background: var(--green-deep);
	color: var(--white);
}

.map-heading {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(320px, .65fr);
	gap: clamp(60px, 10vw, 145px);
	align-items: end;
	margin-bottom: 60px;
}

.map-heading h2 {
	max-width: 720px;
}

.map-heading > div:last-child > p {
	color: rgba(255, 255, 255, .7);
}

.map-legend {
	display: flex;
	gap: 22px;
	flex-wrap: wrap;
	margin-top: 24px;
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .07em;
	text-transform: uppercase;
}

.map-legend span {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.map-legend__swatch {
	width: 13px;
	height: 13px;
	border: 2px solid rgba(255, 255, 255, .8);
	border-radius: 3px;
}

.map-legend__swatch--available {
	background: var(--green);
}

.map-legend__swatch--reserved {
	background: var(--purple);
}

.map-shell {
	padding: clamp(14px, 2vw, 24px);
	background: #f8f5ee;
	border-radius: var(--radius-md);
	box-shadow: 0 35px 80px rgba(5, 12, 8, .34);
}

.property-map {
	position: relative;
	overflow: hidden;
	border-radius: calc(var(--radius-md) - 8px) calc(var(--radius-md) - 8px) 0 0;
	background: #e9e4d5;
	isolation: isolate;
}

.property-map__scroll-cue {
	display: none;
}

.property-map__svg {
	display: block;
	width: 100%;
	aspect-ratio: 976.42554 / 754.51068;
	border: 0;
	outline: 0;
	background: #e9e4d5;
	clip-path: inset(.5px);
}

/* Firefox can render embedded SVGs poorly inside a transformed ancestor. */
.has-js .map-shell[data-reveal].is-revealed {
	transform: none;
}

.lot-list {
	color: var(--ink);
}

.lot-list__status {
	margin: 0;
	padding: 12px;
	color: var(--ink-soft);
	text-align: center;
}

.lot-list__table {
	width: 100%;
	border: 1px solid rgba(29, 33, 30, .2);
	border-top: 0;
	border-collapse: collapse;
	table-layout: fixed;
}

.lot-list__table td {
	padding: 0;
	border-right: 1px solid rgba(29, 33, 30, .16);
	border-bottom: 1px solid rgba(29, 33, 30, .16);
	vertical-align: top;
}

.lot-list__table th {
	padding: 0;
	border-right: 1px solid rgba(255, 255, 255, .18);
	background: var(--green-deep);
}

.lot-list__header {
	display: grid;
	grid-template-columns: minmax(48px, .7fr) minmax(66px, .8fr) minmax(72px, .65fr) minmax(90px, 1.2fr);
	gap: 6px;
	padding: 11px 14px;
	color: var(--white);
	font-size: .62rem;
	letter-spacing: .09em;
	text-align: left;
	text-transform: uppercase;
}

.lot-list__table th:last-child {
	border-right: 0;
}

.lot-list__header > span:last-child {
	text-align: right;
}

.lot-list__table td:last-child {
	border-right: 0;
}

.lot-list__table tr:last-child td {
	border-bottom: 0;
}

.lot-list__button {
	display: grid;
	grid-template-columns: minmax(48px, .7fr) minmax(66px, .8fr) minmax(72px, .65fr) minmax(90px, 1.2fr);
	gap: 6px;
	align-items: baseline;
	width: 100%;
	/* min-height: 58px; */
	padding: 16px 14px;
	border: 0;
	background: transparent;
	color: var(--ink);
	font: inherit;
	text-align: left;
	cursor: pointer;
	transition: background-color .2s ease, box-shadow .2s ease;
}

.lot-list__button:hover,
.lot-list__button:focus-visible {
	background: rgba(82, 115, 59, .09);
	box-shadow: inset 0 0 0 2px var(--green);
	outline: none;
}

.lot-list__button strong {
	color: var(--green-deep);
	font-size: .82rem;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.lot-list__button span {
	color: var(--ink-soft);
	font-size: .72rem;
}

.lot-list__button span:last-child {
	color: var(--ink);
	font-weight: 700;
	text-align: right;
}

.lot-view-tag {
	display: inline-block;
	justify-self: start;
	padding: 3px 7px;
	border: 1px solid rgba(29, 33, 30, .16);
	border-radius: 999px;
	background: rgba(29, 33, 30, .06);
	color: var(--ink);
	font-size: .5rem !important;
	font-weight: 700;
	letter-spacing: .035em;
	line-height: 1;
	text-transform: uppercase;
	white-space: nowrap;
}

.lot-view-tag--ocean {
	border-color: rgba(39, 107, 126, .28);
	background: rgba(65, 148, 169, .13);
	color: #245f70 !important;
}

.lot-view-tag--river,
.lot-view-tag--river-valley {
	border-color: rgba(54, 113, 104, .28);
	background: rgba(73, 137, 126, .13);
	color: #2f675e !important;
}

.lot-view-tag--landscape,
.lot-view-tag--woodland {
	border-color: rgba(82, 115, 59, .25);
	background: rgba(82, 115, 59, .1);
	color: var(--green-deep) !important;
}

.lot-list__external-cell {
	background: var(--purple-soft);
}

.lot-list__button--external {
	grid-template-columns: minmax(72px, .7fr) minmax(0, 2.5fr);
}

.lot-list__button--external:hover,
.lot-list__button--external:focus-visible {
	background: rgba(109, 47, 115, .1);
	box-shadow: inset 0 0 0 2px var(--purple);
}

.lot-list__button--external strong,
.lot-list__button--external span:last-child {
	color: var(--purple-deep);
}

.lot-list__empty {
	background: rgba(29, 33, 30, .025);
}

.property-map__note {
	position: absolute;
	right: 14px;
	bottom: 14px;
	padding: 8px 11px;
	background: rgba(251, 250, 246, .9);
	border: 1px solid rgba(29, 33, 30, .13);
	border-radius: 7px;
	color: var(--ink-soft);
	font-size: .6rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}

.map-road {
	fill: none;
	stroke: #f8f5ee;
	stroke-dasharray: 2 8;
	stroke-linecap: round;
	stroke-width: 10;
}

.map-road.map-road--outer {
	stroke: rgba(63, 30, 73, .18);
	stroke-dasharray: none;
	stroke-width: 18;
}

.lot {
	stroke: rgba(255, 255, 255, .9);
	stroke-width: 4;
	cursor: pointer;
	transition: fill .2s ease, opacity .2s ease, filter .2s ease, transform .2s ease;
	transform-box: fill-box;
	transform-origin: center;
}

.lot--available {
	fill: rgba(82, 115, 59, .77);
}

.lot--reserved {
	fill: rgba(109, 47, 115, .72);
}

.lot:hover,
.lot:focus-visible {
	filter: brightness(1.17) saturate(1.08);
	outline: none;
	stroke: var(--white);
	stroke-width: 7;
	transform: scale(1.015);
}

.lot-labels {
	fill: var(--white);
	font-family: var(--font-sans);
	font-size: 20px;
	font-weight: 800;
	letter-spacing: .08em;
	pointer-events: none;
	text-anchor: middle;
}

.map-label {
	font-family: var(--font-display);
	font-size: 21px;
	font-style: italic;
	letter-spacing: .02em;
	pointer-events: none;
}

.map-label--water,
.map-label--river {
	fill: rgba(255, 255, 255, .84);
}

.map-label--road {
	fill: rgba(63, 30, 73, .72);
	font-family: var(--font-sans);
	font-size: 13px;
	font-style: normal;
	font-weight: 750;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.map-north {
	fill: var(--purple-deep);
	font-family: var(--font-sans);
	font-size: 15px;
	font-weight: 800;
	text-anchor: middle;
}

.experience {
	background: var(--paper);
}

.experience__heading {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(300px, .6fr);
	gap: clamp(60px, 10vw, 145px);
	align-items: end;
	margin-bottom: 60px;
}

.experience__heading h2 {
	max-width: 820px;
}

.experience__heading > p {
	color: var(--ink-soft);
}

.experience__grid {
	display: grid;
	gap: 24px;
}

.webcam-player {
	width: 100%;
	overflow: hidden;
	background: #111;
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-sm);
}

.webcam-player .ns-player {
	width: 100% !important;
	max-width: 100% !important;
	max-height: 100% !important;
	aspect-ratio: 16 / 9 !important;
	background-color: #111 !important;
	background-image: none !important;
}

.webcam-player .ns-player iframe,
.webcam-player .ns-player video {
	display: block;
	width: 100% !important;
	height: 100% !important;
	border: 0;
}

.resource-card {
	background: var(--white);
	border: 1px solid var(--line);
	transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}

.resource-card:hover {
	transform: translateY(-4px);
	border-color: rgba(82, 115, 59, .45);
	box-shadow: var(--shadow-sm);
}

.resource-card--featured {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(250px, .8fr);
	min-height: 470px;
	overflow: hidden;
	border-radius: var(--radius-md);
}

.resource-card__image {
	overflow: hidden;
}

.resource-card__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .7s cubic-bezier(.2, .8, .2, 1);
}

.resource-card:hover .resource-card__image img {
	transform: scale(1.035);
}

.resource-card__content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: clamp(34px, 5vw, 65px);
}

.resource-card__content h3 {
	margin: 16px 0 20px;
	font-size: clamp(2rem, 3.4vw, 3.2rem);
}

.resource-card__content p {
	color: var(--ink-soft);
}

.resource-card__content strong {
	margin-top: auto;
	padding-top: 40px;
	color: var(--green-deep);
	font-size: .74rem;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.resource-card__kicker {
	color: var(--purple);
	font-size: .66rem;
	font-weight: 750;
	letter-spacing: .13em;
	text-transform: uppercase;
}

.resource-card__kicker i {
	display: inline-block;
	width: 7px;
	height: 7px;
	margin-right: 6px;
	background: #c14b4b;
	border-radius: 50%;
	box-shadow: 0 0 0 5px rgba(193, 75, 75, .13);
	animation: live-pulse 2s ease-in-out infinite;
}

@keyframes live-pulse {
	50% { box-shadow: 0 0 0 9px rgba(193, 75, 75, 0); }
}

.resource-stack {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
}

.resource-card--compact {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 20px;
	padding: 26px 28px;
	border-radius: var(--radius-sm);
}

.resource-card--compact h3 {
	margin: 4px 0 0;
	font-family: var(--font-sans);
	font-size: 1.02rem;
	font-weight: 720;
	letter-spacing: -.01em;
}

.resource-card__icon {
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	background: var(--green-soft);
	border-radius: 50%;
	color: var(--green-deep);
	font-family: var(--font-display);
	font-size: 1.6rem;
}

.other-property {
	padding-top: 0;
	background: var(--paper);
}

.other-property__card {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(300px, .75fr);
	min-height: 520px;
	overflow: hidden;
	background: var(--purple-deep);
	border-radius: var(--radius-lg);
	color: var(--white);
}

.other-property__image {
	overflow: hidden;
}

.other-property__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .8s cubic-bezier(.2, .8, .2, 1);
}

.other-property__card:hover .other-property__image img {
	transform: scale(1.03);
}

.other-property__content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: clamp(42px, 6vw, 80px);
}

.other-property__content h2 {
	margin-bottom: 26px;
	font-size: clamp(2.7rem, 4.6vw, 4.8rem);
}

.other-property__content p {
	color: rgba(255, 255, 255, .72);
}

.other-property__content .text-link {
	align-self: flex-start;
	margin-top: 25px;
	color: var(--white);
}

.about {
	position: relative;
	overflow: hidden;
	background: var(--paper-warm);
}

/* .about::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: min(38vw, 520px);
	height: min(38vw, 520px);
	background: var(--green-soft);
	border-radius: 0 0 0 100%;
	opacity: .55;
	pointer-events: none;
} */

.about > .shell {
	position: relative;
}

.about__heading {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(300px, .58fr);
	gap: clamp(45px, 9vw, 120px);
	align-items: end;
	margin-bottom: clamp(48px, 7vw, 88px);
}

.about__heading h2 {
	max-width: 850px;
}

.about__heading > p {
	margin: 0;
	color: var(--ink-soft);
	font-size: 1.05rem;
}

.about__founders {
	display: grid;
	grid-template-columns: minmax(0, 1.08fr) minmax(340px, .72fr);
	min-height: 510px;
	margin-bottom: clamp(64px, 8vw, 104px);
	overflow: hidden;
	background: var(--green-deep);
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-sm);
	color: var(--white);
}

.about__founders-image {
	min-height: 100%;
	margin: 0;
	overflow: hidden;
}

.about__founders-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center right;
}

.about__founders-copy {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: clamp(40px, 6vw, 76px);
}

.about__label,
.team-card span {
	display: block;
	color: var(--purple);
	font-size: .68rem;
	font-weight: 750;
	letter-spacing: .13em;
	line-height: 1.4;
	text-transform: uppercase;
}

.about__founders-copy .about__label {
	color: var(--green-soft);
}

.about__founders-copy h3 {
	margin: 14px 0 22px;
	font-size: clamp(2.5rem, 4.1vw, 4.2rem);
}

.about__founders-copy p {
	color: rgba(255, 255, 255, .74);
}

.about__team-intro {
	display: grid;
	grid-template-columns: minmax(250px, .55fr) minmax(300px, .7fr);
	gap: 10px clamp(50px, 9vw, 120px);
	align-items: end;
	margin-bottom: 38px;
}

.about__team-intro .about__label {
	grid-column: 1 / -1;
}

.about__team-intro h3 {
	margin: 0;
	font-size: clamp(2.2rem, 3.5vw, 3.6rem);
}

.about__team-intro p {
	margin: 0;
	color: var(--ink-soft);
}

.about__team {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 18px;
}

.team-card {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	width: 100%;
	padding: clamp(22px, 2.5vw, 32px);
	background: rgba(255, 255, 255, .72);
	border: 1px solid var(--line);
	border-radius: var(--radius-md);
	color: inherit;
	font: inherit;
	text-align: left;
	cursor: pointer;
	transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.team-card > div {
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: flex-start;
}

.team-card:hover {
	border-color: var(--purple);
	box-shadow: var(--shadow-sm);
	transform: translateY(-4px);
}

.team-card:focus-visible {
	outline: 3px solid var(--purple);
	outline-offset: 4px;
}

.team-card img {
	width: min(180px, 85%);
	margin: 0 auto 28px;
	border-radius: 50%;
	filter: sepia(.08) contrast(1.02);
}

.team-card h3 {
	margin: 0 0 7px;
	font-size: clamp(1.55rem, 2vw, 1.95rem);
}

.team-card p {
	flex: 1;
	margin-top: 16px;
	color: var(--ink-soft);
	font-size: .9rem;
	line-height: 1.65;
}

.team-card__prompt {
	display: inline-flex;
	align-self: flex-start;
	align-items: center;
	gap: 12px;
	padding-bottom: 6px;
	border-bottom: 1px solid currentColor;
	color: var(--green-deep);
	font-size: .72rem;
	font-weight: 750;
	letter-spacing: .08em;
	text-transform: uppercase;
	transition: color .2s ease, gap .2s ease;
}

.team-card:hover .team-card__prompt {
	gap: 17px;
	color: var(--purple);
}

.team-card__prompt::after {
	content: "↗";
	color: var(--purple);
	/* font-size: 1rem; */
}

.team-list__status {
	grid-column: 1 / -1;
	color: var(--ink-soft);
}

.contact {
	position: relative;
	min-height: 750px;
	padding-block: var(--section-space);
	overflow: hidden;
	background: var(--green-deep);
	color: var(--white);
}

.contact__media,
.contact__overlay {
	position: absolute;
	inset: 0;
}

.contact__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.contact__overlay {
	background:
		linear-gradient(90deg, rgba(27, 45, 33, .95) 0%, rgba(27, 45, 33, .82) 48%),
		linear-gradient(0deg, rgba(24, 37, 28, .65), transparent);
}

.contact__inner {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(420px, .65fr);
	gap: clamp(80px, 20vw, 200px);
	align-items: center;
}

.contact__intro h2 {
	max-width: 760px;
	margin-bottom: 30px;
}

.contact__intro > p:last-child {
	max-width: 650px;
	color: rgba(255, 255, 255, .74);
	font-size: 1.05rem;
}

.contact__details {
	display: grid;
	gap: 0;
	padding: clamp(32px, 5vw, 55px);
	background: rgba(255, 255, 255, .1);
	border: 1px solid rgba(255, 255, 255, .22);
	border-radius: var(--radius-md);
	-webkit-backdrop-filter: blur(16px);
	backdrop-filter: blur(16px);
}

.contact__details > a:not(.button),
.contact__details > div {
	display: grid;
	gap: 5px;
	padding: 20px 0;
	border-bottom: 1px solid rgba(255, 255, 255, .18);
}

.contact__details span {
	color: rgba(255, 255, 255, .58);
	font-size: .64rem;
	font-weight: 750;
	letter-spacing: .13em;
	text-transform: uppercase;
}

.contact__details strong {
	font-family: var(--font-display);
	font-size: clamp(1.15rem, 1.8vw, 1.55rem);
	font-weight: 400;
	line-height: 1.25;
	word-break: break-word;
}

.contact__details > a:not(.button):hover strong {
	color: #d4e3c6;
}

.contact__button {
	margin-top: 30px;
}

.site-footer {
	/* padding: 70px 0 24px; */
	padding: 24px 0;
	background: #18271d;
	color: var(--white);
}

.site-footer__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	/* gap: 40px; */
	/* padding-bottom: 60px; */
}

.brand--footer img {
	max-width: clamp(100px, 250px, 50vw);
}

.brand--footer .brand__wordmark small {
	color: var(--purple-soft);
}

.site-footer nav {
	display: flex;
	gap: clamp(18px, 3vw, 38px);
	flex-wrap: wrap;
}

.site-footer nav a {
	color: rgba(255, 255, 255, .7);
	font-size: .7rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.site-footer nav a:hover {
	color: var(--white);
}

.site-footer__bottom {
	display: flex;
	justify-content: space-between;
	gap: 20px;
	padding-top: 22px;
	/* border-top: 1px solid rgba(255, 255, 255, .13); */
	color: rgba(255, 255, 255, .5);
	font-size: .66rem;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.site-footer__bottom p {
	margin: 0;
}

html.dialog-open,
body.dialog-open {
	overflow: hidden;
}

.dialog {
	width: min(920px, calc(100% - 32px));
	max-height: min(760px, calc(100dvh - 32px));
	padding: 0;
	overflow: hidden auto;
	border: 0;
	border-radius: var(--radius-md);
	background: var(--paper);
	box-shadow: 0 40px 120px rgba(0, 0, 0, .42);
	color: var(--ink);
}

@media (min-width: 1041px) {
	.dialog {
		overflow: hidden;
	}

	.dialog__content {
		max-height: calc(min(760px, 100dvh - 32px) - 16px);
		margin: 8px 6px 8px 0;
		overflow-y: auto;
	}
}

.dialog[open] {
	display: grid;
	grid-template-columns: minmax(250px, 1fr) minmax(400px, 1fr);
	animation: dialog-in .25s ease both;
}

.dialog::backdrop {
	background: rgba(18, 27, 21, .76);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}

@keyframes dialog-in {
	from { opacity: 0; transform: translateY(15px) scale(.985); }
	to { opacity: 1; transform: translateY(0) scale(1); }
}

.dialog__visual {
	position: relative;
	display: grid;
	place-items: center;
	min-height: 100%;
	overflow: hidden;
	background: var(--purple-deep);
}

.dialog__visual > span {
	position: absolute;
	z-index: 2;
	color: var(--white);
	font-family: var(--font-display);
	font-size: clamp(4rem, 8vw, 7rem);
	font-weight: 400;
	line-height: 1;
	text-shadow: 0 2px 18px rgba(18, 27, 21, .55);
}

.dialog__visual img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.dialog__content {
	position: relative;
	padding: clamp(40px, 6vw, 50px);
}

.dialog__close {
	position: absolute;
	top: 18px;
	right: 20px;
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	padding: 0;
	border: 1px solid var(--line);
	border-radius: 50%;
	background: transparent;
	color: var(--ink);
	font-size: 1.6rem;
	line-height: 1;
	cursor: pointer;
	transition: background-color .2s ease, color .2s ease;
}

.dialog__close:hover {
	background: var(--green-deep);
	color: var(--white);
}

.dialog h2 {
	margin-bottom: 18px;
	font-size: clamp(2.6rem, 5vw, 4.5rem);
}

.dialog__content > p:not(.dialog__disclaimer) {
	color: var(--ink-soft);
	font-size: 1.05rem;
}

.dialog__facts {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin: 35px 0;
	border-top: 1px solid var(--line);
	border-left: 1px solid var(--line);
}

.dialog__facts div {
	padding: 16px 20px;
	border-right: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
}

.dialog__facts dt {
	margin-bottom: 4px;
	color: var(--ink-soft);
	font-size: .62rem;
	font-weight: 750;
	letter-spacing: .11em;
	text-transform: uppercase;
}

.dialog__facts dd {
	margin: 0;
	color: var(--ink-soft);
	font-size: .95rem;
	line-height: 1.45;
}

.dialog__fact--view {
	grid-column: 1 / -1;
}

.dialog__fact--view dt {
	display: flex;
	align-items: center;
	gap: 8px;
}

.dialog__disclaimer {
	margin-bottom: 28px;
	padding: 14px 16px;
	background: var(--purple-soft);
	color: var(--purple-deep);
	font-size: .72rem;
	line-height: 1.5;
}

.external-sale-dialog__visual {
	background: var(--purple);
}

.beach-dialog[open] {
	grid-template-columns: minmax(360px, .95fr) minmax(400px, 1.05fr);
}

.beach-dialog__gallery {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-template-rows: 1.2fr .8fr;
	gap: 4px;
	min-height: 560px;
	/* padding: 4px; */
	background: var(--purple-deep);
}

.beach-dialog__photo {
	min-width: 0;
	margin: 0;
	overflow: hidden;
	background: var(--green-deep);
}

.beach-dialog__photo--feature {
	grid-column: 1 / -1;
}

.beach-dialog__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.beach-dialog__content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
}

.beach-dialog__content .button {
	margin-top: 18px;
}

.team-dialog[open] {
	grid-template-columns: minmax(280px, .72fr) minmax(460px, 1.28fr);
}

.team-dialog__profile {
	display: grid;
	align-content: center;
	min-height: 100%;
	padding: clamp(38px, 6vw, 74px);
	background: var(--green-deep);
}

.team-dialog__portrait {
	margin: 0;
}

.team-dialog__portrait img {
	width: min(300px, 100%);
	height: auto;
	display: block;
	border-radius: 50%;
	filter: sepia(.08) contrast(1.02);
	box-shadow: 0 22px 55px rgba(0, 0, 0, .24);
}

.team-dialog__identity {
	margin-top: 30px;
	color: var(--white);
}

.team-dialog__identity h2 {
	margin: 0;
	margin-bottom: 9px;
	color: var(--white);
	font-size: clamp(2.35rem, 4vw, 3.75rem);
	line-height: 1;
}

.team-dialog__identity .team-dialog-subtitle {
	display: flex;
	margin-bottom: 10px;
	color: var(--purple-soft);
}

.team-dialog__content {
	padding-block: clamp(54px, 7vw, 78px);
}

#team-dialog-title {
	display: table-caption;
}

.team-dialog__bio p {
	color: var(--ink-soft);
	font-size: .98rem;
	line-height: 1.72;
}

.team-dialog__bio p:last-child {
	margin-bottom: 0;
}

[data-reveal] {
	opacity: 1;
	transform: none;
}

.has-js [data-reveal] {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity .75s ease, transform .75s cubic-bezier(.2, .8, .2, 1);
}

.has-js [data-reveal].is-revealed {
	opacity: 1;
	transform: translateY(0);
}

@media (max-width: 1040px) {
	:root {
		--header-height: 76px;
		--anchor-offset: 76px;
	}

	.brand,
	.nav-toggle {
		position: relative;
		z-index: 2;
		color: var(--green-deep);
	}

	.site-header .brand__logo {
		content: url("../assets/images/rockcliffe-logo-green-purple.png");
		content: image-set(
			url("../assets/images/rockcliffe-logo-green-purple.webp") type("image/webp"),
			url("../assets/images/rockcliffe-logo-green-purple.png") type("image/png")
		);
	}

	.nav-toggle {
		display: inline-flex;
	}

	.primary-nav {
		position: fixed;
		inset: 0;
		z-index: 1;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		gap: 24px;
		padding:
			calc(var(--header-height) + clamp(36px, 8vh, 72px))
			max(24px, calc((100vw - 900px) / 2))
			36px;
		overflow: hidden;
		background: var(--green-deep);
		color: var(--white);
		opacity: 0;
		visibility: hidden;
		transform: translateY(-10px);
		transition: opacity .25s ease, visibility .25s ease, transform .25s ease;
	}

	.primary-nav.is-open {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
	}

	.primary-nav a {
		font-family: var(--font-display);
		font-size: clamp(2.4rem, 7vw, 4.4rem);
		font-weight: 400;
		letter-spacing: -.035em;
		line-height: 1;
		text-transform: none;
	}

	.primary-nav .button--outline {
		margin-top: 16px;
		padding: 14px 22px;
		border-color: rgba(255, 255, 255, .5);
		font-family: var(--font-sans) !important;
		font-size: .78rem !important;
		font-weight: 750 !important;
		letter-spacing: .1em !important;
		text-transform: uppercase !important;
	}

	.site-header.is-scrolled.nav-is-open {
		background: var(--green-deep);
		box-shadow: none;
		color: var(--white);
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
	}

	.site-header.is-scrolled.nav-is-open .button--outline {
		border-color: rgba(255, 255, 255, .5);
		color: var(--white);
	}

	.site-header.is-scrolled.nav-is-open .button--outline:hover {
		background: var(--white);
		border-color: var(--white);
		color: var(--green-deep);
	}

	.site-header.nav-is-open {
		background: var(--green-deep);
	}

	.site-header.is-scrolled.nav-is-open .brand__wordmark small {
		color: var(--purple-soft);
	}

	/* linear-gradient(90deg, rgba(20, 31, 23, .83) 0%, rgba(20, 31, 23, .45) 100%), */

	.hero__veil {
		background:
			linear-gradient(0deg,
				rgba(15, 24, 18, .75) 0%,
				transparent 75%
				/* rgba(15, 24, 18, .5) 100% */
			);
	}

	.hero__scroll {
		display: none;
	}

	.intro-grid,
	.geopark__grid,
	.map-heading,
	.experience__heading,
	.about__heading,
	.about__team-intro,
	.contact__inner {
		grid-template-columns: 1fr;
	}

	.about__founders {
		grid-template-columns: 1fr;
		min-height: 0;
	}

	.about__founders-image {
		min-height: 0;
		aspect-ratio: 16 / 9;
	}

	.about__team {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.intro-grid__copy,
	.geopark__copy {
		max-width: 720px;
		padding-top: 0;
	}

	.property__grid {
		grid-template-columns: 1fr;
		grid-template-areas:
			"content"
			"media"
			"types";
	}

	.property__media {
		width: min(760px, 100%);
		min-height: 680px;
	}

	.property__content {
		max-width: 760px;
	}

	.film__grid {
		grid-template-columns: 1fr;
	}

	.film__intro {
		max-width: 700px;
	}

	.resource-card--compact {
		grid-template-columns: auto 1fr;
		align-items: start;
	}

	.resource-card--compact > span:last-child {
		display: none;
	}

	.contact__details {
		width: min(600px, 100%);
	}
}

@media (max-width: 1040px) and (max-height: 600px) {
	.primary-nav {
		gap: 15px;
		padding-top: calc(var(--header-height) + 20px);
		padding-bottom: 20px;
	}

	.primary-nav a {
		font-size: clamp(2rem, 8vh, 2.6rem);
	}

	.primary-nav .button--outline {
		margin-top: 5px;
		padding-block: 10px;
	}

	.geopark h2 {
		width: 100%;
	}

}

/* Three lot groups need compact tracks before the full desktop shell fits. */
@media (max-width: 1200px) {
	.lot-list__header,
	.lot-list__button {
		grid-template-columns: minmax(48px, .7fr) minmax(66px, .8fr) minmax(72px, .65fr) minmax(90px, 1.2fr);
		gap: 6px;
		padding-right: 14px;
		padding-left: 14px;
	}

	.lot-list__button--external {
		grid-template-columns: minmax(48px, .7fr) minmax(0, 2.5fr);
	}
}

@media (max-width: 760px) {
	:root {
		--shell: min(100% - 30px, 1180px);
		--section-space: 64px;
	}

	body {
		text-wrap: wrap;
	}

	h1 {
		font-size: clamp(3.35rem, 16vw, 5.7rem);
	}

	h2 {
		font-size: clamp(2.65rem, 11vw, 4.1rem);
	}

	.site-header__inner {
		min-height: var(--header-height);
	}

	.brand__mark {
		width: 40px;
		height: 40px;
	}

	.brand__wordmark {
		font-size: 1.18rem;
	}

	.hero {
		/* min-height: max(720px, 100svh); */
	}

	.hero__media img {
		object-position: center center;
	}

	.hero__content {
		padding-block: 90px 20px;
		height: 100%;
		display: flex;
		flex-direction: column;
		justify-content: flex-end;
		row-gap: 20px;
	}

	.hero__actions {
		/* align-items: flex-start; */
		/* flex-direction: column; */
		gap: 23px;
	}

	.hero__actions .button {
		text-align: center;
	}

	.hero__facts {
		grid-template-columns: 1fr;
		bottom: 24px;
	}

	.hero__facts div {
		display: grid;
		grid-template-columns: minmax(120px, .45fr) 1fr;
		align-items: baseline;
		padding: 12px 0;
		border-top: 1px solid rgba(255, 255, 255, .16);
		border-left: 0;
	}

	.hero__facts div:first-child {
		border-top: 0;
	}

	.hero__facts strong {
		font-size: 1rem;
	}

	.hero__facts span {
		font-size: .62rem;
	}

	.feature-band__grid {
		grid-template-columns: 1fr;
	}

	.feature-card,
	.feature-card:first-child,
	.feature-card:last-child {
		min-height: auto;
		padding: 35px 0;
		border-top: 1px solid var(--line);
		border-left: 0;
	}

	.feature-card:first-child {
		border-top: 0;
	}

	.feature-card__number {
		margin-bottom: 28px;
	}

	.property__media {
		min-height: 400px;
	}

	.property__image--primary {
		/* width: 84%; */
		height: 72%;
		border-radius: var(--radius-sm) 0 var(--radius-sm) var(--radius-sm);
	}

	.property__image--secondary {
		width: 58%;
		height: 45%;
		border-width: 8px;
	}

	.property__caption {
		/* left: 3%;
		bottom: 8%;
		max-width: 180px; */
		--xpadding: 18px;
		--ypadding: 16px;
		--top: calc(72% + var(--ypadding));
		--left: var(--radius-sm);
		--right: calc(58% + var(--xpadding));
		--xmargins: calc(var(--left) + var(--right));
		--ymargins: calc(var(--top) + 8px);
		padding: 16px 18px;
	}

	.property__caption strong {
		font-size: 0.9rem;
	}

	.property-types,
	.property__list {
		grid-template-columns: 1fr;
	}

	.geopark::before {
		background-position: bottom right;
	}

	.geopark__stat strong {
		font-size: clamp(3rem, 16vw, 5rem);
	}

	.map-shell {
		width: 100%;
		padding: 8px;
		border-radius: 0;
	}

	.property-map {
		overflow-x: auto;
		border-radius: 0;
		scrollbar-width: thin;
	}

	.property-map__scroll-cue {
		position: sticky;
		left: 0;
		display: flex;
		width: 100vw;
		max-width: 100%;
		margin: 0;
		padding: 9px 12px;
		align-items: center;
		justify-content: center;
		gap: 9px;
		background: var(--green-deep);
		color: var(--white);
		font-size: .68rem;
		font-weight: 750;
		letter-spacing: .1em;
		text-transform: uppercase;
	}

	.property-map__scroll-cue span {
		font-size: 1.15rem;
		line-height: .7;
	}

	.property-map__svg {
		width: 900px;
		height: 696px;
		max-width: none;
		aspect-ratio: auto;
	}

	.property-map__note {
		position: sticky;
		left: 12px;
		display: inline-block;
	}

	.lot-list {
		padding: 0 0 8px;
	}

	.lot-list__table {
		min-width: 0;
	}

	.lot-list__header,
	.lot-list__button {
		grid-template-columns: minmax(48px, .7fr) minmax(66px, .8fr) minmax(72px, .65fr) minmax(100px, 1.2fr);
		gap: 6px;
		padding-right: 18px;
		padding-left: 18px;
	}

	.lot-list__button--external {
		grid-template-columns: minmax(48px, .7fr) minmax(0, 2.5fr);
	}

	.other-property__card {
		grid-template-columns: 1fr;
	}

	.resource-card__image {
		min-height: 300px;
	}

	.resource-card__content strong {
		margin-top: 25px;
		padding-top: 0;
	}

	.resource-stack {
		grid-template-columns: 1fr;
	}

	.other-property__image {
		min-height: 330px;
	}

	.about::before {
		width: 260px;
		height: 260px;
	}

	.about__founders,
	.about__team-intro {
		grid-template-columns: 1fr;
	}

	.about__founders {
		min-height: 0;
		border-radius: var(--radius-md);
	}

	.about__founders-image {
		min-height: 0;
		aspect-ratio: 1 / 1;
	}

	.about__team-intro .about__label {
		grid-column: auto;
	}

	.about__team {
		grid-template-columns: 1fr;
	}

	.team-card {
		flex-direction: row;
		gap: 20px;
		align-items: flex-start;
	}

	.team-card > div {
		min-width: 0;
	}

	.team-card img {
		width: 96px;
		margin: 0;
	}

	.team-card p {
		margin-top: 10px;
	}

	.contact {
		min-height: auto;
	}

	.contact__details {
		padding: 28px 22px;
	}

	.site-footer__top,
	.site-footer__bottom {
		align-items: center;
		flex-direction: column;
	}

	.site-footer__bottom {
		gap: 0;
	}

	.site-footer nav {
		display: flex;
		/* grid-template-columns: repeat(2, 1fr); */
		width: 100%;
		text-align: center;
		column-gap: 0;
		row-gap: 5px;
	}

	.site-footer nav a {
		flex: 1 1 50%;
	}

	.dialog[open] {
		grid-template-columns: 1fr;
	}

	.dialog__visual {
		min-height: 180px;
	}

	.dialog__content {
		padding: 42px 24px 30px;
	}

	.dialog__facts {
		grid-template-columns: 1fr;
	}

	.dialog__fact--view {
		grid-column: auto;
	}

	.beach-dialog[open] {
		grid-template-columns: 1fr;
	}

	.team-dialog[open] {
		grid-template-columns: 1fr;
	}

	.team-dialog__profile {
		display: grid;
		grid-template-columns: 1fr 1fr;
		align-items: center;
		min-height: 0;
		padding: 24px;
		gap: 24px;
	}

	.team-dialog__portrait img {
		width: 100%;
	}

	.team-dialog__identity {
		margin-top: 0;
	}

	.team-dialog__identity h2 {
		font-size: clamp(2rem, 8vw, 3rem);
	}

	.beach-dialog__gallery {
		grid-template-rows: 170px 105px;
		min-height: 279px;
	}
}

@media (min-width: 761px) and (max-width: 1040px) {
	.team-dialog {
		overflow: hidden;
	}

	.team-dialog[open] {
		grid-template-columns: minmax(240px, .72fr) minmax(0, 1.28fr);
	}

	.team-dialog__profile {
		display: block;
		min-height: 100%;
		padding: clamp(32px, 5vw, 54px);
	}

	.team-dialog__identity {
		margin-top: 26px;
	}

	.team-dialog__identity h2 {
		font-size: clamp(2.2rem, 4.8vw, 3.25rem);
	}

	.team-dialog__content {
		max-height: calc(min(760px, 100dvh - 32px) - 16px);
		margin: 8px 6px 8px 0;
		overflow-y: auto;
	}
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}

	.has-js [data-reveal] {
		opacity: 1;
		transform: none;
	}
}

/* Revised production wordmark and expanded image gallery */
.brand__logo {
	display: block;
	width: clamp(210px, 23vw, 285px);
	height: auto;
	/* transform: translateY(-20%); */
	transition: width .3s ease;
	margin: 10px 0 20% 0;
}

.site-header.is-scrolled .brand__logo {
	content: url("../assets/images/rockcliffe-logo-green-purple.png");
	content: image-set(
		url("../assets/images/rockcliffe-logo-green-purple.webp") type("image/webp"),
		url("../assets/images/rockcliffe-logo-green-purple.png") type("image/png")
	);
}

@media (max-width: 1040px) {
	.brand__logo {
		width: 150px;
		transform: none;
	}

	.site-header.nav-is-open .brand__logo {
		content: url("../assets/images/rockcliffe-logo-white.png");
		content: image-set(
			url("../assets/images/rockcliffe-logo-white.webp") type("image/webp"),
			url("../assets/images/rockcliffe-logo-white.png") type("image/png")
		);
	}
}

@media (min-width: 1041px) {
	.site-header.is-scrolled .site-header__inner {
		min-height: 100px;
	}

	.site-header.is-scrolled .brand__logo {
		width: 130px;
	}
}

.brand__mark,
.brand__wordmark {
	display: none;
}

.gallery {
	background: #f7f4ed;
}

.gallery__heading {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(260px, .8fr);
	gap: clamp(2rem, 6vw, 7rem);
	align-items: end;
	margin-bottom: clamp(2.5rem, 5vw, 5rem);
}

.gallery__heading p:last-child {
	color: var(--ink-soft);
	max-width: 42rem;
	margin: 0;
	font-size: 1.08rem;
	line-height: 1.8;
}

.gallery__groups {
	display: grid;
	gap: clamp(4rem, 8vw, 7.5rem);
}

.gallery-group__heading {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 2rem;
	margin-bottom: 1.5rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--line);
}

.gallery-group__heading h3 {
	margin: 0;
}

.gallery-group__heading span {
	color: var(--ink-soft);
	font-size: .68rem;
	font-weight: 750;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.gallery__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
}

.gallery__item {
	--gallery-radius-top-left: 0;
	--gallery-radius-top-right: 0;
	--gallery-radius-bottom-right: 0;
	--gallery-radius-bottom-left: 0;
	position: relative;
	margin: 0;
	overflow: hidden;
	aspect-ratio: 16 / 9;
	background: var(--green-soft);
	border-radius:
		var(--gallery-radius-top-left)
		var(--gallery-radius-top-right)
		var(--gallery-radius-bottom-right)
		var(--gallery-radius-bottom-left);
}

.gallery__item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .8s cubic-bezier(.2,.7,.2,1);
}

.gallery__item:hover img {
	transform: scale(1.025);
}

.gallery__grid--four {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.gallery__grid--four .gallery__item {
	/* aspect-ratio: 16 / 9; */
}

.gallery__grid--five .gallery__item:nth-last-child(-n + 2) {
	grid-column: span 3;
	/* aspect-ratio: 16 / 9; */
}

.gallery__grid--five {
	grid-template-columns: repeat(6, minmax(0, 1fr));
}

.gallery__grid--five .gallery__item:nth-child(-n + 3) {
	grid-column: span 2;
}

.op-tl {
	object-position: top left;
}

.op-tc {
	object-position: top center;
}

.op-tr {
	object-position: top right;
}

.op-cl {
	object-position: center left;
}

.op-cc {
	object-position: center center;
}

.op-cr {
	object-position: center right;
}

.op-bl {
	object-position: bottom left;
}

.op-bc {
	object-position: bottom center;
}

.op-br {
	object-position: bottom right;
}


@media (max-width: 760px) {
	.brand__logo {
		width: 140px;
		transform: none;
	}

	.gallery__heading,
	.gallery__grid {
		grid-template-columns: 1fr;
	}

	.gallery__item {
		grid-column: auto !important;
		/* aspect-ratio: 4 / 3; */
	}

	.gallery__grid--four .gallery__item {
		/* aspect-ratio: 16 / 9; */
	}

	.gallery-group__heading {
		align-items: end;
	}

	.intro-scene {
		aspect-ratio: 4 / 3;
	}

	.intro-scene figcaption {
		display: grid;
	}

	.intro-scene figcaption strong {
		text-align: left;
	}
}

/* Keep content and image assets visible even when JavaScript, observers, or
   automated page rendering do not trigger scroll-reveal animations. */
.has-js [data-reveal],
.has-js [data-reveal].is-revealed {
	opacity: 1;
	transform: none;
}

/* Visibility helpers
   Mobile: <= 760px | Tablet: 761px-1040px | Desktop: >= 1041px */
.hide {
	display: none !important;
}

@media (max-width: 760px) {
	.hide-mobile {
		display: none !important;
	}
}

@media (min-width: 761px) and (max-width: 1040px) {
	.geopark::before {
		background-position: center right;
	}

	.geopark__heading {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		gap: clamp(32px, 6vw, 64px);
		align-items: end;
	}

	.geopark__logo {
		margin-top: 0;
	}

	.hide-tablet {
		display: none !important;
	}
}

@media (min-width: 1041px) {
	.hide-desktop {
		display: none !important;
	}
}

@media (min-width: 761px) {
	.show-mobile {
		display: none !important;
	}
}

@media (max-width: 760px), (min-width: 1041px) {
	.show-tablet {
		display: none !important;
	}
}

@media (max-width: 1040px) {
	.show-desktop {
		display: none !important;
	}
}
