/**
 * CASARA — component primitives (c- prefix, BEM).
 * Tokens only (tokens.css). Logical properties for RTL. Hover effects only on hover-capable devices.
 *
 * Index:
 *  1 Icon · 2 Eyebrow · 3 Link · 4 Button · 5 Badge / Demo tag · 6 Divider · 7 Price
 *  8 Card (base, --property, --featured, --off-market, --area, --editorial, --developer)
 *  9 Section header · 10 Hero · 11 Header / Nav · 12 Mobile menu · 13 Footer
 * 14 Forms (field, input, select, textarea, check, radio, form states) · 15 Filter bar
 * 16 Perspective · 17 Sticky CTA · 18 Breadcrumbs · 19 Reveal (motion.js)
 */

/* =========================================================== 1 Icon */
.c-icon {
	display: inline-block;
	flex: none;
	width: var(--icon-size, 1.25rem);
	height: var(--icon-size, 1.25rem);
	fill: none;
	stroke: currentColor;
	stroke-width: 1.25;
	stroke-linecap: square;
	vertical-align: middle;
}
.c-icon--sm { --icon-size: 1rem; }
.c-icon--lg { --icon-size: 1.5rem; }
.c-icon--fill { fill: currentColor; stroke: none; }
[dir="rtl"] .c-icon--directional { transform: scaleX(-1); }

/* =========================================================== 2 Eyebrow */
.c-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: var(--s-3);
	margin: 0;
	font-family: var(--f-sans);
	font-size: var(--f-size-caption);
	font-weight: var(--f-weight-medium);
	line-height: 1.4;
	letter-spacing: var(--f-track-eyebrow);
	text-transform: uppercase;
	color: var(--c-text-muted);
}
.c-eyebrow--accent::before {
	content: "";
	width: 2rem;
	height: var(--hairline);
	background: var(--c-accent);
}
.c-eyebrow__sep { opacity: 0.6; }

/* =========================================================== 3 Link */
.c-link {
	color: inherit;
	text-decoration: underline;
	text-decoration-thickness: var(--hairline);
	text-decoration-color: var(--c-accent);
	text-underline-offset: 0.28em;
	transition: color var(--d-base) var(--e-out), text-decoration-color var(--d-base) var(--e-out);
}
.c-link:hover { color: var(--c-accent-text); text-decoration-color: currentColor; }

/* Nav / UI link: no underline at rest, hairline grows from the start edge. */
.c-link--nav,
.c-link--line {
	position: relative;
	display: inline-flex;
	align-items: center;
	min-height: var(--l-tap);
	text-decoration: none;
	font-size: var(--f-size-label);
	font-weight: var(--f-weight-medium);
	letter-spacing: var(--f-track-label);
	text-transform: uppercase;
}
.c-link--nav::after,
.c-link--line::after {
	content: "";
	position: absolute;
	inset-inline: 0;
	bottom: calc(50% - 0.95em);
	height: var(--hairline);
	background: currentColor;
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform var(--d-base) var(--e-out);
}
[dir="rtl"] .c-link--nav::after, [dir="rtl"] .c-link--line::after { transform-origin: right center; }
.c-link--nav:hover, .c-link--line:hover { color: inherit; }
.c-link--nav:hover::after,
.c-link--line:hover::after,
.c-link--nav[aria-current="page"]::after { transform: scaleX(1); }
.c-link--nav[aria-current="page"]::after { background: var(--c-accent); }
.c-link--line::after { transform: scaleX(1); opacity: 0.35; transition: opacity var(--d-base) var(--e-out); }
.c-link--line:hover::after { opacity: 1; }

/* Footer link: muted, brightens on hover. */
.c-link--footer {
	color: var(--c-text-muted);
	text-decoration: none;
	transition: color var(--d-base) var(--e-out);
}
.c-link--footer:hover { color: var(--c-text); }

/* Arrow link: label + arrow that travels 4px. */
.c-link--arrow {
	display: inline-flex;
	align-items: center;
	gap: var(--s-3);
	min-height: var(--l-tap);
	text-decoration: none;
	font-size: var(--f-size-label);
	font-weight: var(--f-weight-medium);
	letter-spacing: var(--f-track-label);
	text-transform: uppercase;
}
.c-link--arrow .c-icon { --icon-size: 1.125rem; transition: transform var(--d-slow) var(--e-out); }
.c-link--arrow:hover { color: inherit; }
.c-link--arrow:hover .c-icon { transform: translateX(4px); }
[dir="rtl"] .c-link--arrow:hover .c-icon { transform: scaleX(-1) translateX(4px); }

/* =========================================================== 4 Button */
.c-btn {
	--btn-h: var(--l-control-h);
	--btn-px: 2rem;
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--s-3);
	min-height: var(--btn-h);
	padding: 0 var(--btn-px);
	border: var(--hairline) solid var(--c-btn-bg);
	border-radius: var(--r-0);
	background: var(--c-btn-bg);
	color: var(--c-btn-text);
	font-family: var(--f-sans);
	font-size: var(--f-size-label);
	font-weight: var(--f-weight-medium);
	line-height: 1;
	letter-spacing: var(--f-track-label);
	text-transform: uppercase;
	text-align: center;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
	transition:
		background-color var(--d-base) var(--e-out),
		border-color var(--d-base) var(--e-out),
		color var(--d-base) var(--e-out);
}
.c-btn .c-icon { --icon-size: 1.125rem; transition: transform var(--d-slow) var(--e-out); }
.c-btn:hover { background: var(--c-btn-bg-hover); border-color: var(--c-btn-bg-hover); color: var(--c-btn-text); }
.c-btn:hover .c-icon--directional { transform: translateX(4px); }
.c-btn:active { transform: translateY(1px); }
.c-btn:focus-visible { outline: 2px solid var(--c-focus); outline-offset: 3px; }

/* Secondary — 1px outline, fills on hover. */
.c-btn--secondary {
	background: transparent;
	border-color: var(--c-line-strong);
	color: var(--c-text);
}
.c-btn--secondary:hover {
	background: var(--c-text);
	border-color: var(--c-text);
	color: var(--c-bg);
}

/* Text button — label with a hairline, no box. */
.c-btn--text {
	--btn-px: 0;
	background: transparent;
	border-color: transparent;
	color: var(--c-text);
}
.c-btn--text::after {
	content: "";
	position: absolute;
	inset-inline: 0;
	bottom: calc(50% - 1.1em);
	height: var(--hairline);
	background: currentColor;
	opacity: 0.4;
	transition: opacity var(--d-base) var(--e-out);
}
.c-btn--text:hover { background: transparent; border-color: transparent; color: var(--c-text); }
.c-btn--text:hover::after { opacity: 1; }

/* Icon-only square (WhatsApp, close, menu). */
.c-btn--icon { --btn-px: 0; width: var(--btn-h); }
.c-btn--icon.c-btn--text::after { display: none; } /* icon-only text buttons (menu close): no hairline */

/* Sizes */
.c-btn--sm { --btn-h: var(--l-tap); --btn-px: 1.25rem; font-size: 0.6875rem; }
.c-btn--lg { --btn-h: 3.75rem; --btn-px: 2.5rem; }
.c-btn--block { width: 100%; }
/* Small screens: long labels ("Request Investment Consultation") wrap inside the button instead of overflowing. */
@media (max-width: 47.99em) {
	.c-btn:not(.c-btn--icon) { max-width: 100%; white-space: normal; line-height: 1.35; text-wrap: balance; }
	.c-btn:not(.c-btn--icon):not(.c-btn--text) { --btn-px: 1.5rem; padding-block: 0.875rem; }
}

/* States */
.c-btn:disabled,
.c-btn[aria-disabled="true"] {
	opacity: 0.38;
	cursor: not-allowed;
	pointer-events: none;
}
.c-btn.is-loading { color: transparent; pointer-events: none; }
.c-btn.is-loading .c-icon { opacity: 0; }
.c-btn.is-loading::before {
	content: "";
	position: absolute;
	inset: 0;
	margin: auto;
	width: 1rem;
	height: 1rem;
	border: var(--hairline) solid var(--c-btn-text);
	border-inline-end-color: transparent;
	border-radius: 50%;
	animation: c-spin 900ms linear infinite;
}
.c-btn--secondary.is-loading::before { border-color: var(--c-text); border-inline-end-color: transparent; }
@keyframes c-spin { to { transform: rotate(360deg); } }

/* =========================================================== 5 Badge / Demo tag */
.c-badge {
	display: inline-flex;
	align-items: center;
	min-height: 1.625rem;
	padding: 0 0.625rem;
	border: var(--hairline) solid var(--c-line-strong);
	background: transparent;
	color: var(--c-text);
	font-size: 0.6875rem;
	font-weight: var(--f-weight-medium);
	letter-spacing: var(--f-track-label);
	line-height: 1;
	text-transform: uppercase;
	white-space: nowrap;
}
.c-badge--quiet { border-color: var(--c-line); color: var(--c-text-muted); }
.c-badge--on-image { border-color: transparent; background: var(--c-ivory); color: var(--c-charcoal); }

/* DEMO marker — required on all demo prices/content until real data exists. */
.c-demo {
	display: inline-block;
	padding: 0.125rem 0.375rem;
	border: var(--hairline) dashed var(--c-warm-grey);
	color: var(--c-text-muted);
	font-family: var(--f-sans);
	font-size: 0.5625rem;
	font-style: normal;
	font-weight: var(--f-weight-medium);
	letter-spacing: 0.14em;
	line-height: 1.2;
	text-transform: uppercase;
	vertical-align: middle;
}

/* =========================================================== 6 Divider */
.c-divider {
	display: block;
	width: 100%;
	height: 0;
	margin: 0;
	border: 0;
	border-top: var(--hairline) solid var(--c-line);
}
.c-divider--strong { border-top-color: var(--c-line-strong); }
.c-divider--accent { width: 3rem; border-top-color: var(--c-accent); }
.c-divider--vertical { width: 0; height: auto; align-self: stretch; border-top: 0; border-inline-start: var(--hairline) solid var(--c-line); }

/* =========================================================== 7 Price */
.c-price {
	display: inline-flex;
	align-items: baseline;
	gap: 0.45em;
	font-family: var(--f-sans);
	font-size: var(--f-size-body);
	font-weight: var(--f-weight-regular);
	font-variant-numeric: tabular-nums lining-nums;
	letter-spacing: 0.01em;
	white-space: nowrap;
	color: var(--c-text);
}
.c-price__currency {
	font-size: 0.72em;
	font-weight: var(--f-weight-medium);
	letter-spacing: var(--f-track-label);
	color: var(--c-text-muted);
}
.c-price--lg {
	font-family: var(--f-serif);
	font-size: var(--f-size-price);
	font-weight: var(--f-weight-light);
	letter-spacing: 0;
}
.c-price--lg .c-price__currency { font-family: var(--f-sans); font-size: 0.42em; }
.c-price--request {
	font-family: var(--f-serif);
	font-style: italic;
	font-size: 1.15em;
	font-weight: var(--f-weight-regular);
	letter-spacing: 0;
	color: var(--c-text);
}
/* Off-market / private listing label: a quiet sentence, not a number. Wraps (unlike .c-price). */
.c-price-private {
	max-width: 24rem;
	margin: 0;
	font-family: var(--f-serif);
	font-size: var(--f-size-h5);
	font-style: italic;
	font-weight: var(--f-weight-regular);
	line-height: 1.35;
	letter-spacing: 0;
	color: var(--c-text);
}
.c-price.is-converted .c-price__currency::before { content: "\2248\00a0"; } /* ≈ for converted display prices */

/* =========================================================== 8 Card */
.c-card {
	--card-ratio: var(--ratio-editorial);
	position: relative;
	display: flex;
	flex-direction: column;
	min-width: 0;
	color: var(--c-text);
}
.c-card__media {
	position: relative;
	overflow: hidden;
	aspect-ratio: var(--card-ratio);
	background: var(--c-surface-alt);
}
.c-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--d-zoom) var(--e-out);
}
.c-card__badges {
	position: absolute;
	inset-block-start: var(--s-4);
	inset-inline-start: var(--s-4);
	z-index: 2;
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-2);
}
.c-card__body {
	display: flex;
	flex-direction: column;
	gap: var(--s-3);
	padding-top: var(--s-5);
}
.c-card__meta { /* eyebrow line: LOCATION · TYPE */
	font-size: var(--f-size-caption);
	font-weight: var(--f-weight-medium);
	letter-spacing: var(--f-track-eyebrow);
	text-transform: uppercase;
	color: var(--c-text-muted);
}
.c-card__title {
	font-family: var(--f-serif);
	font-size: var(--f-size-h4);
	font-weight: var(--f-weight-regular);
	line-height: 1.15;
	letter-spacing: 0;
}
.c-card__title a { color: inherit; text-decoration: none; }
/* Stretched link: whole card is clickable, one tab stop. */
.c-card__title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.c-card__title a:focus-visible { outline: none; }
.c-card:has(.c-card__title a:focus-visible) { outline: 2px solid var(--c-focus); outline-offset: 6px; }
.c-card__text,
.c-card__spec {
	font-size: var(--f-size-small);
	line-height: 1.6;
	color: var(--c-text-muted);
}
.c-card__spec { font-variant-numeric: tabular-nums lining-nums; }
.c-card__footer {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--s-3) var(--s-5);
	margin-top: var(--s-2);
	padding-top: var(--s-4);
	border-top: var(--hairline) solid var(--c-line);
}
.c-card__cta {
	display: inline-flex;
	align-items: center;
	gap: var(--s-2);
	font-size: var(--f-size-label);
	font-weight: var(--f-weight-medium);
	letter-spacing: var(--f-track-label);
	text-transform: uppercase;
}
.c-card__cta .c-icon { --icon-size: 1.125rem; transition: transform var(--d-slow) var(--e-out); }

@media (hover: hover) {
	.c-card:hover .c-card__media img { transform: scale(var(--zoom-hover)); }
	.c-card:hover .c-card__cta .c-icon { transform: translateX(4px); }
}

/* --property: editorial residence card (no spec icons). */
.c-card--property { --card-ratio: var(--ratio-property); }
.c-card--property .c-card__title { font-size: var(--f-size-h4); }

/* --featured: large horizontal composition on desktop (Private Collection lead item). */
.c-card--featured { --card-ratio: var(--ratio-property); }
.c-card--featured .c-card__title { font-size: var(--f-size-h3); font-weight: var(--f-weight-light); }
@media (min-width: 64em) {
	.c-card--featured {
		--card-ratio: var(--ratio-property-wide);
		display: grid;
		grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
		column-gap: calc(var(--s-gutter) * 2);
		align-items: end;
	}
	.c-card--featured .c-card__body { padding-top: 0; padding-bottom: var(--s-2); }
}

/* --off-market: veiled image, Price Upon Request, no exact address. */
.c-card--off-market .c-card__media::after {
	content: attr(data-veil);
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	background: var(--c-scrim);
	color: var(--c-ivory);
	font-family: var(--f-serif);
	font-size: var(--f-size-h5);
	font-style: italic;
	letter-spacing: 0.02em;
}
.c-card--off-market .c-card__media img { filter: saturate(0.6) blur(2px); transform: scale(1.04); }
@media (hover: hover) {
	.c-card--off-market:hover .c-card__media img { transform: scale(1.06); }
}

/* --area: vertical 3:4 location card, name below image with index. */
.c-card--area { --card-ratio: var(--ratio-area); }
.c-card--area .c-card__body { flex-direction: row; align-items: baseline; justify-content: space-between; gap: var(--s-4); }
.c-card--area .c-card__title { font-size: var(--f-size-h4); font-weight: var(--f-weight-light); }
.c-card__index {
	font-size: var(--f-size-caption);
	letter-spacing: var(--f-track-label);
	color: var(--c-text-muted);
	font-variant-numeric: tabular-nums;
}

/* --editorial: insights article. */
.c-card--editorial { --card-ratio: var(--ratio-editorial); }
.c-card--editorial .c-card__text {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* --developer: typographic, ruled card; image optional. */
.c-card--developer {
	--card-ratio: var(--ratio-developer);
	border-top: var(--hairline) solid var(--c-line-strong);
	padding-top: var(--s-5);
}
.c-card--developer .c-card__media { margin-bottom: var(--s-2); }
.c-card--developer .c-card__body { padding-top: var(--s-4); }
.c-card__name {
	font-family: var(--f-sans);
	font-size: var(--f-size-small);
	font-weight: var(--f-weight-medium);
	letter-spacing: 0.24em;
	text-transform: uppercase;
}

/* =========================================================== 9 Section header */
.c-section-header {
	display: grid;
	gap: var(--s-5);
	margin-bottom: var(--s-stack);
}
.c-section-header__title { font-family: var(--f-serif); font-weight: var(--f-weight-light); font-size: var(--f-size-h2); line-height: 1.06; max-width: 16ch; }
.c-section-header__lead { max-width: 36rem; }
.c-section-header__aside { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s-5); }
@media (min-width: 64em) {
	.c-section-header {
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
		column-gap: var(--s-gutter);
		align-items: end;
	}
	.c-section-header > .c-eyebrow { grid-column: 1 / -1; }
}
.c-section-header--center { text-align: center; justify-items: center; grid-template-columns: minmax(0, 1fr); }
.c-section-header--center .c-section-header__title { max-width: 20ch; }
.c-section-header--center .c-section-header__aside { align-items: center; }

/* =========================================================== 10 Hero */
.c-hero {
	position: relative;
	display: grid;
	align-items: end;
	min-height: max(36rem, 100svh);
	overflow: hidden;
	background: var(--c-charcoal);
	color: var(--c-ivory);
	isolation: isolate;
}
.c-hero__media { position: absolute; inset: 0; z-index: -1; }
.c-hero__media img,
.c-hero__media video { width: 100%; height: 100%; object-fit: cover; object-position: var(--hero-focus, 50% 50%); }
@media (min-width: 64em) { .c-hero__media img, .c-hero__media video { object-position: var(--hero-focus-lg, 50% 50%); } }
.c-hero__media::after { /* legibility scrim, max 35% charcoal */
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(to bottom, var(--c-scrim) 0%, transparent 24%),
		linear-gradient(to top, var(--c-scrim) 0%, var(--c-scrim) 30%, var(--c-scrim-soft) 60%, transparent 85%);
}
.c-hero__content {
	padding-top: calc(var(--l-header-h-lg) + var(--s-8));
	padding-bottom: clamp(3.5rem, 10vh, 7.5rem);
}
.c-hero__eyebrow { color: var(--c-ivory); opacity: 0.86; margin-bottom: var(--s-5); }
.c-hero__title { font-family: var(--f-serif); font-weight: var(--f-weight-light); font-size: var(--f-size-display); line-height: 0.98; letter-spacing: var(--f-track-display); max-width: 12ch; }
.c-hero__lead {
	max-width: 30rem;
	margin-top: var(--s-5);
	font-size: var(--f-size-lead);
	font-weight: var(--f-weight-light);
	line-height: 1.55;
	color: var(--c-ivory);
	opacity: 0.88;
}
.c-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-4) var(--s-6); margin-top: var(--s-7); }
.c-hero__foot {
	display: none;
	position: absolute;
	/* Physical inset on purpose: with writing-mode: vertical-rl the logical inline axis is vertical,
	   so inset-inline-end would resolve to the bottom edge. Mirrored below for RTL. */
	inset: auto var(--s-margin) clamp(3.5rem, 10vh, 7.5rem) auto;
	flex-direction: column;
	align-items: center;
	gap: var(--s-4);
	font-size: 0.625rem;
	letter-spacing: var(--f-track-eyebrow);
	text-transform: uppercase;
	writing-mode: vertical-rl;
	opacity: 0.8;
}
.c-hero__foot::after { content: ""; width: var(--hairline); height: 4rem; background: currentColor; transform-origin: top; animation: c-scrollcue 2.4s var(--e-in-out) infinite; }
@keyframes c-scrollcue { 0% { transform: scaleY(0); } 50% { transform: scaleY(1); transform-origin: top; } 51% { transform-origin: bottom; } 100% { transform: scaleY(0); transform-origin: bottom; } }
[dir="rtl"] .c-hero__foot { inset: auto auto clamp(3.5rem, 10vh, 7.5rem) var(--s-margin); }
@media (min-width: 64em) { .c-hero__foot { display: flex; } }
/* One-time slow settle of the hero photo. */
.has-motion .c-hero__media img { animation: c-hero-settle 2.4s var(--e-out) both; }
@keyframes c-hero-settle { from { transform: scale(1.06); } to { transform: scale(1); } }
.c-hero--short { min-height: max(28rem, 72svh); }

/* =========================================================== 11 Header / Nav */
.c-header {
	position: sticky;
	top: 0;
	z-index: var(--z-header);
	background: var(--c-bg);
	color: var(--c-text);
	border-bottom: var(--hairline) solid transparent;
	transition:
		background-color var(--d-base) var(--e-out),
		color var(--d-base) var(--e-out),
		border-color var(--d-base) var(--e-out),
		transform var(--d-slow) var(--e-out);
}
.c-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--s-6);
	height: var(--l-header-h);
	transition: height var(--d-base) var(--e-out);
}
.c-header__logo { display: inline-flex; color: inherit; flex: none; }
.c-header__logo svg { width: clamp(7.5rem, 6.8rem + 2vw, 9.25rem); height: auto; fill: currentColor; }
.c-header__actions { display: flex; align-items: center; gap: var(--s-4); }
.c-header__cta { display: none; }
.c-header__currency { display: none; }
.c-header__currency:has(.c-currency[hidden]), .c-header__currency:empty { display: none !important; }
.c-mobile-menu__prefs { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 0 var(--s-5); padding-top: var(--s-3); border-top: var(--hairline) solid var(--c-line); }
.c-header__toggle {
	display: inline-flex;
	align-items: center;
	gap: var(--s-3);
	min-height: var(--l-tap);
	min-width: var(--l-tap);
	justify-content: flex-end;
	font-size: var(--f-size-label);
	font-weight: var(--f-weight-medium);
	letter-spacing: var(--f-track-label);
	text-transform: uppercase;
}
.c-header__toggle-lines { position: relative; width: 1.5rem; height: 0.5rem; }
.c-header__toggle-lines::before,
.c-header__toggle-lines::after { content: ""; position: absolute; inset-inline: 0; height: var(--hairline); background: currentColor; }
.c-header__toggle-lines::before { top: 0; }
.c-header__toggle-lines::after { bottom: 0; }

.c-header.is-scrolled { border-bottom-color: var(--c-line); }
.c-header.is-hidden { transform: translateY(-100%); }

/* Overlay header: transparent over hero with ivory ink until scrolled. */
.c-header--overlay { position: fixed; inset-inline: 0; }
.c-header--overlay:not(.is-scrolled) {
	--c-text: var(--c-ivory);
	--c-text-muted: var(--c-ivory);
	--c-line-strong: var(--c-ivory);
	--c-accent: var(--c-champagne);
	--c-focus: var(--c-champagne);
	--c-bg: var(--c-ivory);
	background: transparent;
	color: var(--c-ivory);
}
.admin-bar .c-header { top: 32px; }

@media (min-width: 75em) {
	.c-header__inner { height: var(--l-header-h-lg); }
	.c-header.is-scrolled .c-header__inner { height: var(--l-header-h); }
	.c-header__cta { display: inline-flex; }
	.c-header__currency { display: inline-flex; }
	.c-header__toggle { display: none; }
}

.c-nav { display: none; }
@media (min-width: 75em) {
	.c-nav { display: block; }
	.c-nav__list { display: flex; align-items: center; gap: clamp(1.25rem, -1.5rem + 2.6vw, 2.25rem); margin: 0; padding: 0; list-style: none; }
	.c-nav__list .c-link--nav { font-size: 0.6875rem; }
}

/* =========================================================== 12 Mobile menu */
.c-mobile-menu {
	position: fixed;
	inset: 0;
	z-index: var(--z-menu);
	display: flex;
	flex-direction: column;
	background: var(--c-charcoal);
	color: var(--c-ivory);
	overflow-y: auto;
	overscroll-behavior: contain;
	opacity: 0;
	visibility: hidden;
	transition: opacity var(--d-slow) var(--e-out), visibility 0s linear var(--d-slow);
}
.c-mobile-menu.is-open { opacity: 1; visibility: visible; transition: opacity var(--d-slow) var(--e-out); }
.c-mobile-menu__top { display: flex; align-items: center; justify-content: space-between; height: var(--l-header-h); flex: none; }
.c-mobile-menu__list { margin: 0; padding: var(--s-6) 0 var(--s-7); list-style: none; counter-reset: menu; }
.c-mobile-menu__list li { border-bottom: var(--hairline) solid var(--c-line); }
.c-mobile-menu__list a {
	display: flex;
	align-items: baseline;
	gap: var(--s-4);
	padding: var(--s-3) 0;
	min-height: 3.5rem;
	color: inherit;
	text-decoration: none;
	font-family: var(--f-serif);
	font-size: clamp(1.875rem, 1.5rem + 1.6vw, 2.5rem);
	font-weight: var(--f-weight-light);
	line-height: 1.2;
}
.c-mobile-menu__list a::before {
	counter-increment: menu;
	content: counter(menu, decimal-leading-zero);
	font-family: var(--f-sans);
	font-size: 0.625rem;
	letter-spacing: var(--f-track-label);
	color: var(--c-text-muted);
	transform: translateY(-0.9em);
}
.c-mobile-menu__list a[aria-current="page"] { color: var(--c-champagne); }
.c-mobile-menu__foot { margin-top: auto; padding-bottom: calc(var(--s-6) + env(safe-area-inset-bottom)); display: grid; gap: var(--s-4); }
.c-mobile-menu__meta { display: flex; justify-content: space-between; font-size: var(--f-size-small); color: var(--c-text-muted); }
.c-mobile-menu .is-staggered > * { opacity: 0; transform: translateY(12px); transition: opacity var(--d-slow) var(--e-out), transform var(--d-slow) var(--e-out); }
.c-mobile-menu.is-open .is-staggered > * { opacity: 1; transform: none; }
.c-mobile-menu.is-open .is-staggered > :nth-child(2) { transition-delay: 40ms; }
.c-mobile-menu.is-open .is-staggered > :nth-child(3) { transition-delay: 80ms; }
.c-mobile-menu.is-open .is-staggered > :nth-child(4) { transition-delay: 120ms; }
.c-mobile-menu.is-open .is-staggered > :nth-child(5) { transition-delay: 160ms; }
.c-mobile-menu.is-open .is-staggered > :nth-child(6) { transition-delay: 200ms; }
.c-mobile-menu.is-open .is-staggered > :nth-child(7) { transition-delay: 240ms; }
.c-mobile-menu.is-open .is-staggered > :nth-child(8) { transition-delay: 280ms; }
html.is-menu-open { overflow: hidden; }
@media (min-width: 75em) { .c-mobile-menu { display: none; } }

/* =========================================================== 13 Footer */
.c-footer {
	padding-top: var(--s-section-sm);
	padding-bottom: calc(var(--s-6) + env(safe-area-inset-bottom));
	background: var(--c-bg);
	color: var(--c-text);
}
.c-footer__statement {
	display: grid;
	gap: var(--s-6);
	padding-bottom: var(--s-section-sm);
	border-bottom: var(--hairline) solid var(--c-line);
}
.c-footer__statement-title { font-size: var(--f-size-h2); max-width: 18ch; }
.c-footer__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--s-7) var(--s-gutter);
	padding-block: var(--s-8);
}
.c-footer__brand { grid-column: 1 / -1; display: grid; gap: var(--s-5); align-content: start; }
.c-footer__brand svg { width: 9.5rem; height: auto; fill: currentColor; }
.c-footer__brand p { max-width: 22rem; font-size: var(--f-size-small); color: var(--c-text-muted); }
.c-footer__heading { margin-bottom: var(--s-4); color: var(--c-text-muted); }
.c-footer__list { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--s-1); font-size: var(--f-size-small); }
.c-footer__list a { display: inline-flex; min-height: 2.25rem; align-items: center; }
.c-footer__legal {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: var(--s-3) var(--s-6);
	padding-top: var(--s-5);
	border-top: var(--hairline) solid var(--c-line);
	font-size: var(--f-size-caption);
	letter-spacing: 0.04em;
	color: var(--c-text-muted);
}
.c-footer__prefs { display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--s-6); }
.c-footer__legal { align-items: center; }
.c-footer__legal ul { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-5); margin: 0; padding: 0; list-style: none; }
@media (min-width: 64em) {
	.c-footer__statement { grid-template-columns: 7fr 5fr; align-items: end; }
	.c-footer__statement > :last-child { justify-self: end; }
	.c-footer__grid { grid-template-columns: 4fr 2fr 2fr 3fr; }
	.c-footer__brand { grid-column: auto; }
}
@media (max-width: 63.99em) { .c-footer__grid > :last-child { grid-column: 1 / -1; } }
@media (max-width: 63.99em) { .c-footer { padding-bottom: calc(var(--s-6) + 4.5rem + env(safe-area-inset-bottom)); } }

/* =========================================================== 14 Forms */
.c-form { display: grid; gap: var(--s-6); }
.c-form__row { display: grid; gap: var(--s-6) var(--s-gutter); }
@media (min-width: 48em) { .c-form__row--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.c-form__legal { font-size: var(--f-size-caption); line-height: 1.6; color: var(--c-text-muted); max-width: 40rem; }
.c-form__hp { position: absolute !important; inset-inline-start: -9999px; width: 1px; height: 1px; overflow: hidden; }

.c-field { position: relative; display: grid; align-content: start; gap: var(--s-2); min-width: 0; border: 0; padding: 0; margin: 0; }
.c-label,
.c-field__label {
	font-size: var(--f-size-caption);
	font-weight: var(--f-weight-medium);
	letter-spacing: var(--f-track-label);
	text-transform: uppercase;
	color: var(--c-text-muted);
}
.c-field__label .c-field__optional { text-transform: none; letter-spacing: 0; font-weight: var(--f-weight-regular); }
.c-field__help { font-size: var(--f-size-small); color: var(--c-text-muted); }
.c-field__error,
.c-field__success {
	display: none;
	align-items: center;
	gap: var(--s-2);
	font-size: var(--f-size-small);
}
.c-field__error { color: var(--c-invalid); }
.c-field__success { color: var(--c-valid); }
.c-field.is-invalid .c-field__error,
.c-field.is-valid .c-field__success { display: flex; }

.c-input,
.c-textarea,
.c-select__control {
	display: block;
	width: 100%;
	min-height: var(--l-control-h);
	padding: 0.75rem 0;
	border: 0;
	border-bottom: var(--hairline) solid var(--c-warm-grey);
	border-radius: var(--r-0);
	background: transparent;
	color: var(--c-text);
	font-size: max(16px, var(--f-size-body)); /* ≥16px: no iOS zoom */
	line-height: 1.4;
	-webkit-appearance: none;
	appearance: none;
	transition: border-color var(--d-base) var(--e-out), box-shadow var(--d-base) var(--e-out);
}
.c-input::placeholder,
.c-textarea::placeholder { color: var(--c-text-muted); opacity: 1; }
.c-input:hover,
.c-textarea:hover,
.c-select__control:hover { border-bottom-color: var(--c-text); }
.c-input:focus,
.c-textarea:focus,
.c-select__control:focus,
.c-input:focus-visible,
.c-textarea:focus-visible,
.c-select__control:focus-visible {
	outline: none;
	border-bottom-color: var(--c-text);
	box-shadow: 0 1px 0 0 var(--c-text);
}
.c-textarea { min-height: 8rem; resize: vertical; }
.c-input:disabled, .c-textarea:disabled, .c-select__control:disabled { opacity: 0.45; cursor: not-allowed; }

.c-field.is-invalid .c-input,
.c-field.is-invalid .c-textarea,
.c-field.is-invalid .c-select__control,
[aria-invalid="true"] { border-bottom-color: var(--c-invalid); box-shadow: 0 1px 0 0 var(--c-invalid); }
.c-field.is-valid .c-input,
.c-field.is-valid .c-select__control { border-bottom-color: var(--c-valid); }

.c-select { position: relative; display: block; }
.c-select__control { padding-inline-end: 2rem; cursor: pointer; text-overflow: ellipsis; }
.c-select__control option { color: var(--c-charcoal); background: var(--c-ivory); }
.c-select::after {
	content: "";
	position: absolute;
	inset-inline-end: 0.25rem;
	top: 50%;
	width: 0.5rem;
	height: 0.5rem;
	margin-top: -0.375rem;
	border-inline-end: var(--hairline) solid currentColor;
	border-bottom: var(--hairline) solid currentColor;
	transform: rotate(45deg);
	pointer-events: none;
}

/* Checkbox & radio: label wraps input; ≥44px tap row. */
.c-check,
.c-radio {
	display: inline-flex;
	align-items: flex-start;
	gap: var(--s-3);
	min-height: var(--l-tap);
	padding-block: 0.6875rem;
	font-size: var(--f-size-small);
	line-height: 1.5;
	cursor: pointer;
}
.c-check input,
.c-radio input {
	flex: none;
	display: grid;
	place-content: center;
	width: 1.125rem;
	height: 1.125rem;
	margin: 0.0625rem 0 0;
	border: var(--hairline) solid var(--c-warm-grey);
	border-radius: var(--r-0);
	background: transparent;
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
	transition: background-color var(--d-fast) var(--e-out), border-color var(--d-fast) var(--e-out);
}
.c-radio input { border-radius: 50%; }
.c-check input::before {
	content: "";
	width: 0.5625rem;
	height: 0.3125rem;
	margin-top: -0.125rem;
	border-inline-start: 1.5px solid var(--c-bg);
	border-bottom: 1.5px solid var(--c-bg);
	transform: rotate(-45deg) scale(0);
	transition: transform var(--d-fast) var(--e-out);
}
.c-radio input::before {
	content: "";
	width: 0.5rem;
	height: 0.5rem;
	border-radius: 50%;
	background: var(--c-text);
	transform: scale(0);
	transition: transform var(--d-fast) var(--e-out);
}
.c-check input:checked { background: var(--c-text); border-color: var(--c-text); }
.c-check input:checked::before { transform: rotate(-45deg) scale(1); }
.c-radio input:checked { border-color: var(--c-text); }
.c-radio input:checked::before { transform: scale(1); }
.c-check input:hover, .c-radio input:hover { border-color: var(--c-text); }
.c-check input:focus-visible, .c-radio input:focus-visible { outline: 2px solid var(--c-focus); outline-offset: 3px; }
.c-check input:disabled, .c-radio input:disabled { opacity: 0.4; cursor: not-allowed; }
.c-field.is-invalid .c-check input { border-color: var(--c-invalid); }

/* Choice chips (budget ranges, timeline) — radio styled as quiet pills. */
.c-choices { display: flex; flex-wrap: wrap; gap: var(--s-2); border: 0; padding: 0; margin: 0; }
.c-choice { position: relative; }
.c-choice input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.c-choice span {
	display: inline-flex;
	align-items: center;
	min-height: var(--l-tap);
	padding: 0 1rem;
	border: var(--hairline) solid var(--c-line);
	font-size: var(--f-size-small);
	font-variant-numeric: tabular-nums;
	transition: border-color var(--d-fast) var(--e-out), background-color var(--d-fast) var(--e-out), color var(--d-fast) var(--e-out);
}
.c-choice input:hover + span { border-color: var(--c-text); }
.c-choice input:checked + span { background: var(--c-text); border-color: var(--c-text); color: var(--c-bg); }
.c-choice input:focus-visible + span { outline: 2px solid var(--c-focus); outline-offset: 2px; }

/* Form-level status. */
.c-form__status {
	display: none;
	gap: var(--s-3);
	align-items: flex-start;
	padding: var(--s-5) 0;
	border-top: var(--hairline) solid currentColor;
	font-size: var(--f-size-small);
}
.c-form__status.is-visible { display: flex; }
.c-form__status--success { color: var(--c-text); border-top-color: var(--c-accent); }
.c-form__status--success .c-form__status-title { font-family: var(--f-serif); font-size: var(--f-size-h4); line-height: 1.2; }
.c-form__status--error { color: var(--c-invalid); }
.c-form.is-loading { pointer-events: none; }
.c-form.is-loading .c-field { opacity: 0.6; transition: opacity var(--d-base) var(--e-out); }

/* =========================================================== 15 Filter bar (luxury search) */
.c-filter-bar {
	display: grid;
	background: var(--c-surface);
	color: var(--c-text);
	border: var(--hairline) solid var(--c-line);
}
.c-filter-bar__field {
	position: relative;
	display: grid;
	gap: 0.125rem;
	padding: var(--s-3) var(--s-5);
	border-bottom: var(--hairline) solid var(--c-line);
	transition: background-color var(--d-base) var(--e-out);
}
.c-filter-bar__field:hover { background: var(--c-bg); }
.c-filter-bar__field:focus-within { background: var(--c-bg); }
.c-filter-bar__label {
	font-size: 0.625rem;
	font-weight: var(--f-weight-medium);
	letter-spacing: var(--f-track-eyebrow);
	text-transform: uppercase;
	color: var(--c-text-muted);
}
.c-filter-bar .c-select__control {
	min-height: 2.25rem;
	padding-block: 0.25rem;
	border-bottom: 0;
	font-size: max(16px, var(--f-size-small));
	box-shadow: none;
}
.c-filter-bar .c-select__control:focus-visible { outline: 2px solid var(--c-focus); outline-offset: 2px; box-shadow: none; }
.c-filter-bar__submit { padding: var(--s-4) var(--s-5); }
.c-filter-bar__submit .c-btn { width: 100%; }
/* Tablet: two fields per row instead of a tall single stack; a lone last field spans the row. */
@media (min-width: 48em) and (max-width: 63.99em) {
	.c-filter-bar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.c-filter-bar > .c-filter-bar__field:nth-child(even) { border-inline-start: var(--hairline) solid var(--c-line); }
	.c-filter-bar > .c-filter-bar__field:nth-child(odd):nth-last-child(2) { grid-column: 1 / -1; }
	.c-filter-bar > .c-filter-bar__submit { grid-column: 1 / -1; }
}
@media (min-width: 64em) {
	/* Any number of fields share one row equally (flex, not a fixed 5-column grid); the submit keeps its width. */
	.c-filter-bar { display: flex; align-items: stretch; }
	.c-filter-bar > .c-filter-bar__field { flex: 1 1 0; min-width: 0; }
	.c-filter-bar > .c-filter-bar__submit { flex: none; }
	.c-filter-bar .c-select__control { text-overflow: ellipsis; }
	.c-filter-bar__field { border-bottom: 0; border-inline-start: var(--hairline) solid var(--c-line); padding: var(--s-4) var(--s-5); align-content: center; }
	.c-filter-bar__field:first-child { border-inline-start: 0; }
	.c-filter-bar__submit { padding: 0; display: flex; }
	.c-filter-bar__submit .c-btn { min-height: 100%; width: auto; padding-inline: 2.5rem; }
}
.c-filter-bar__note { margin-top: var(--s-4); font-size: var(--f-size-caption); letter-spacing: 0.04em; color: var(--c-text-muted); }

/* =========================================================== 16 CASARA Perspective (brand signature) */
.c-perspective {
	position: relative;
	display: grid;
	gap: var(--s-7) var(--s-gutter);
	padding: clamp(2rem, 1rem + 4.5vw, 5rem) clamp(1.25rem, 0.5rem + 3.5vw, 5rem);
	background: var(--c-surface-alt);
	color: var(--c-text);
}
.c-perspective__aside { display: grid; gap: var(--s-5); align-content: start; }
.c-perspective__mark { width: 2rem; height: auto; color: var(--c-accent); }
.c-perspective__mark path { stroke: currentColor; }
.c-perspective__mark path + path { fill: currentColor; stroke: none; }
.c-perspective__quote {
	position: relative;
	padding-top: var(--s-6);
	font-family: var(--f-serif);
	font-size: var(--f-size-quote);
	font-style: italic;
	font-weight: var(--f-weight-light);
	line-height: 1.28;
	letter-spacing: -0.005em;
	text-wrap: pretty;
}
.c-perspective__quote::before { content: ""; position: absolute; top: 0; inset-inline-start: 0; width: 3rem; height: var(--hairline); background: var(--c-accent); }
.c-perspective__by { display: grid; gap: 0.125rem; font-size: var(--f-size-small); }
.c-perspective__by strong { font-weight: var(--f-weight-medium); }
.c-perspective__by span { color: var(--c-text-muted); }
.c-perspective__notes { display: grid; gap: var(--s-6) var(--s-gutter); margin-top: var(--s-7); padding-top: var(--s-6); border-top: var(--hairline) solid var(--c-line); }
.c-perspective__notes h3 {
	margin-bottom: var(--s-3);
	font-family: var(--f-sans);
	font-size: var(--f-size-caption);
	font-weight: var(--f-weight-medium);
	letter-spacing: var(--f-track-eyebrow);
	text-transform: uppercase;
	color: var(--c-text-muted);
}
.c-perspective__notes p { font-size: var(--f-size-small); line-height: 1.7; }
@media (min-width: 48em) { .c-perspective__notes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 64em) {
	.c-perspective { grid-template-columns: minmax(0, 3fr) minmax(0, 1fr) minmax(0, 8fr); }
	.c-perspective__aside { grid-column: 1; }
	.c-perspective__main { grid-column: 3; }
}

/* =========================================================== 17 Sticky CTA (mobile) */
.c-sticky-cta {
	position: fixed;
	inset-inline: 0;
	bottom: 0;
	z-index: var(--z-sticky);
	display: flex;
	gap: var(--s-2);
	padding: var(--s-2) var(--s-margin) calc(var(--s-2) + env(safe-area-inset-bottom));
	background: var(--c-ivory);
	border-top: var(--hairline) solid var(--c-border);
	transform: translateY(110%);
	visibility: hidden; /* not focusable while off-screen */
	transition: transform var(--d-slow) var(--e-out), visibility 0s linear var(--d-slow);
}
.c-sticky-cta.is-visible { transform: none; visibility: visible; transition: transform var(--d-slow) var(--e-out); }
.c-sticky-cta .c-btn { flex: 1; }
.c-sticky-cta .c-btn--icon { flex: none; color: var(--c-bronze-deep); }
.c-sticky-cta .c-btn--icon:hover { color: var(--c-ivory); }
.is-menu-open .c-sticky-cta { transform: translateY(110%); }
@media (min-width: 64em) { .c-sticky-cta { display: none; } }

/* =========================================================== 18 Breadcrumbs */
.c-breadcrumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); margin: 0; padding: 0; list-style: none; font-size: var(--f-size-caption); letter-spacing: var(--f-track-label); text-transform: uppercase; color: var(--c-text-muted); }
.c-breadcrumbs li + li::before { content: "/"; margin-inline-end: var(--s-2); opacity: 0.6; }
.c-breadcrumbs a { color: inherit; text-decoration: none; display: inline-flex; min-height: var(--l-tap); align-items: center; }
.c-breadcrumbs a:hover { color: var(--c-text); }
.c-breadcrumbs [aria-current] { color: var(--c-text); }
.c-breadcrumbs [aria-current] { display: inline-block; max-width: 28ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; }
.c-breadcrumbs a:focus-visible { outline: 2px solid var(--c-focus); outline-offset: 2px; }
.c-breadcrumbs { margin-bottom: var(--s-6); }
.c-breadcrumbs--space-top { padding-top: var(--s-6); margin-bottom: 0; }
.c-breadcrumbs--space-both { margin-bottom: 0; }
.c-article-header .c-breadcrumbs ol { justify-content: center; }
.c-article-header .c-breadcrumbs { margin-bottom: var(--s-2); }
.c-breadcrumbs--space-both { padding-block: var(--s-6); }
@media (max-width: 47.99em) { .c-breadcrumbs [aria-current] { max-width: 18ch; } }

/* =========================================================== 18b Currency + language selectors */
.c-currency { display: inline-flex; align-items: center; gap: var(--s-3); }
.c-currency[hidden] { display: none; }
.c-currency__label,
.c-lang__item {
	font-size: var(--f-size-caption);
	font-weight: var(--f-weight-medium);
	letter-spacing: var(--f-track-label);
	text-transform: uppercase;
}
.c-currency__label { color: var(--c-text-muted); }
.c-currency__control { position: relative; display: inline-flex; align-items: center; }
.c-currency__control::after { /* chevron */
	content: "";
	position: absolute;
	inset-inline-end: 0.125rem;
	width: 0.375rem;
	height: 0.375rem;
	border-inline-end: var(--hairline) solid currentColor;
	border-bottom: var(--hairline) solid currentColor;
	transform: translateY(-25%) rotate(45deg);
	pointer-events: none;
}
.c-currency__select {
	appearance: none;
	min-height: var(--l-tap);
	padding: 0 1.125rem 0 0;
	border: 0;
	background: transparent;
	color: inherit;
	font-size: max(16px, var(--f-size-caption)); /* no iOS zoom */
	font-weight: var(--f-weight-medium);
	letter-spacing: var(--f-track-label);
	cursor: pointer;
}
@media (min-width: 48em) { .c-currency__select { font-size: var(--f-size-caption); } }
.c-currency__select:focus-visible { outline: 2px solid var(--c-focus); outline-offset: 2px; }
.c-currency__select option { color: var(--c-charcoal); background: var(--c-ivory); }

.c-lang__list { display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--s-3); }
.c-lang__item { display: inline-flex; align-items: center; min-height: var(--l-tap); color: var(--c-text-muted); text-decoration: none; }
.c-lang__item.is-current { color: var(--c-text); }
.c-lang__item.is-disabled { opacity: 0.5; cursor: default; }
a.c-lang__item:hover { color: var(--c-text); }
a.c-lang__item:focus-visible { outline: 2px solid var(--c-focus); outline-offset: 2px; }

/* =========================================================== 19 Reveal (driven by motion.js) */
.has-motion [data-reveal] {
	opacity: 0;
	transition:
		opacity var(--d-reveal) var(--e-out),
		transform var(--d-reveal) var(--e-out),
		clip-path var(--d-image) var(--e-out);
	transition-delay: var(--reveal-delay, 0ms);
}
.has-motion [data-reveal="up"] { transform: translateY(var(--reveal-shift)); }
.has-motion [data-reveal="image"] { opacity: 1; clip-path: inset(8% 0 0 0); }
.has-motion [data-reveal="image"] img { transform: scale(1.08); transition: transform var(--d-zoom) var(--e-out); }
.has-motion [data-reveal].is-revealed { opacity: 1; transform: none; clip-path: inset(0 0 0 0); }
.has-motion [data-reveal="image"].is-revealed img { transform: none; }
.has-motion [data-parallax] { will-change: transform; }

/* DEMO placeholder grade — applied only while stock placeholders are in use (wrap with .is-placeholder).
   Real CASARA photography is graded at source; remove the class when real media arrives. */
.is-placeholder :is(.c-card__media, .c-hero__media, .u-ratio) img { filter: saturate(0.78) sepia(0.08) contrast(0.97); }
.is-placeholder .c-card--off-market .c-card__media img { filter: saturate(0.5) sepia(0.08) blur(2px); }