/*!
 * Ventuno Dei: front-end styles.
 * Brand colours (guidelines): Pompeian Red #7F2B2B, Travertine Gold #C4A46A, Soft Cloud Grey #EEEEEE.
 * Red is kept for small accents; warm neutrals, ink and gold carry the design.
 */

/* =====================================================================
   Tokens
   ===================================================================== */
:root {
	--red: #7f2b2b;
	--gold: #c4a46a;
	--gold-deep: #8a6b30; /* gold for small text on light backgrounds (AA contrast) */
	--stone: #eeeeee;
	--sand: #f3efe8;
	--ivory: #faf8f5;
	--white: #ffffff;
	--ink: #1c1917;
	--charcoal: #211d1a;
	--muted: #4a443f;
	--line: rgba(28, 25, 23, 0.13);
	--serif: 'Cormorant Garamond', 'Times New Roman', Georgia, serif;
	--sans: 'Jost', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--ease: cubic-bezier(0.22, 0.61, 0.36, 1);
	--ease-out: cubic-bezier(0.16, 1, 0.3, 1);
	--header-h: 88px;
	--gutter: 24px;
	--maxw: 1320px;
}
@media (min-width: 768px) { :root { --gutter: 48px; } }
@media (max-width: 991.98px) { :root { --header-h: 72px; } }

/* =====================================================================
   Base
   ===================================================================== */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--header-h) + 8px); }
body {
	margin: 0; background: var(--ivory); color: var(--ink);
	font-family: var(--sans); font-size: 16px; line-height: 1.7; font-weight: 400;
	-webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: hidden;
}
body.menu-open, body.lb-open { overflow: hidden; }
img, svg, video { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; transition: color 0.25s var(--ease); }
a:hover { color: var(--gold-deep); }
:focus-visible { outline: 2px solid var(--gold-deep); outline-offset: 3px; }
button { font: inherit; color: inherit; cursor: pointer; }
h1, h2, h3, h4 { font-family: var(--serif); font-weight: 600; line-height: 1.08; margin: 0 0 0.5em; letter-spacing: -0.01em; }
h1 em, h2 em, h3 em { font-style: italic; font-weight: inherit; color: var(--gold-deep); }
p { margin: 0 0 1.1em; }
ul, ol { margin: 0; padding: 0; list-style: none; }
address { font-style: normal; }
blockquote { margin: 0; }
::selection { background: var(--ink); color: var(--ivory); }

.container { width: 100%; max-width: calc(var(--maxw) + var(--gutter) * 2); margin-inline: auto; padding-inline: var(--gutter); }
.center { text-align: center; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; top: -100px; left: 16px; z-index: 1100; background: var(--white); padding: 12px 18px; }
.skip-link:focus { top: 16px; }

.ic { width: 1.15em; height: 1.15em; flex: none; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.ic-fill { fill: currentColor; stroke: none; }
.star-off { opacity: 0.25; fill: currentColor; stroke: none; }

.eyebrow { font-size: 12px; font-weight: 400; letter-spacing: 0.28em; text-transform: uppercase; color: var(--gold-deep); margin: 0 0 1.6em; display: flex; align-items: center; gap: 14px; }
.eyebrow::before { content: ''; width: 32px; height: 1px; background: currentColor; opacity: 0.7; }
.eyebrow-gold { color: var(--gold); }

/* =====================================================================
   Buttons and links
   ===================================================================== */
.btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 12px;
	padding: 18px 34px; border: 1px solid transparent; border-radius: 999px;
	font-family: var(--sans); font-size: 12px; font-weight: 500; letter-spacing: 0.2em; text-transform: uppercase; line-height: 1.2;
	cursor: pointer; position: relative; overflow: hidden; isolation: isolate; will-change: transform;
	transition: color 0.4s var(--ease), border-color 0.4s var(--ease), background-color 0.4s var(--ease), transform 0.4s var(--ease-out);
}
.btn::before { content: ''; position: absolute; inset: -1px; z-index: -1; border-radius: inherit; transform: translateY(102%); transition: transform 0.55s var(--ease-out); }
.btn:hover::before { transform: translateY(0); }
.btn .ic { transition: transform 0.4s var(--ease-out); }
.btn:hover .ic { transform: translateX(4px); }
.btn-sm { padding: 12px 24px; font-size: 11px; }
.btn-lg { padding: 22px 46px; }
.btn-block { width: 100%; }
.btn-ink, .btn-solid { background: var(--ink); color: var(--ivory); border-color: var(--ink); }
.btn-ink::before, .btn-solid::before { background: var(--gold); }
.btn-ink:hover, .btn-solid:hover { color: var(--ink); border-color: var(--gold); }
.btn-gold { background: var(--gold); color: var(--ink); border-color: var(--gold); }
.btn-gold::before { background: var(--white); }
.btn-gold:hover { color: var(--ink); border-color: var(--white); }
.btn-outline { background: transparent; color: var(--ink); border-color: rgba(28, 25, 23, 0.4); }
.btn-outline::before { background: var(--ink); }
.btn-outline:hover { color: var(--ivory); border-color: var(--ink); }
.btn:disabled { opacity: 0.55; pointer-events: none; }

.link-arrow {
	display: inline-flex; align-items: center; gap: 14px; padding: 0 0 8px; background: none; border: 0; position: relative;
	font-size: 12px; font-weight: 500; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ink); cursor: pointer;
}
.link-arrow::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: currentColor; }
.link-arrow::before { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--gold); transform: scaleX(0); transform-origin: left; transition: transform 0.5s var(--ease-out); z-index: 1; }
.link-arrow:hover::before { transform: scaleX(1); }
.link-arrow .ic { transition: transform 0.4s var(--ease-out); }
.link-arrow:hover .ic { transform: translateX(6px); }
.link-arrow:hover { color: var(--ink); }
.link-light, .link-light:hover { color: var(--white); }

/* =====================================================================
   Intro curtain
   ===================================================================== */
.intro { display: none; }
.has-intro .intro { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; background: var(--charcoal); transition: transform 1.1s var(--ease-out); }
.has-intro .intro-inner { display: grid; justify-items: center; gap: 22px; animation: introIn 1s var(--ease-out) both; }
.has-intro .intro img { width: min(260px, 60vw); height: auto; }
.intro-line { display: block; width: 0; height: 1px; background: var(--gold); animation: introLine 1.2s var(--ease-out) 0.3s forwards; }
@keyframes introIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes introLine { to { width: min(260px, 60vw); } }
.has-intro.intro-out .intro { transform: translateY(-101%); }
.has-intro.intro-out .intro-inner { opacity: 0; transition: opacity 0.4s; }
.has-intro body { overflow: hidden; }


/* =====================================================================
   Header
   ===================================================================== */
.site-header {
	position: fixed; inset: 0 0 auto 0; z-index: 100; height: var(--header-h);
	background: rgba(250, 248, 245, 0.92); border-bottom: 1px solid var(--line);
	transition: background-color 0.4s var(--ease), border-color 0.4s var(--ease), transform 0.5s var(--ease-out);
}
/* The blur lives on a pseudo-element: backdrop-filter on the header itself would trap the fixed mobile menu inside it. */
.site-header::before { content: ''; position: absolute; inset: 0; z-index: -1; -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); transition: opacity 0.4s var(--ease); }
.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .site-header { top: 46px; } }
.site-header.is-hidden { transform: translateY(-101%); }
.site-header.menu-open { transform: none; }
.site-header.is-over:not(.is-scrolled):not(.menu-open) { background: transparent; border-color: transparent; }
.site-header.is-over:not(.is-scrolled):not(.menu-open)::before { opacity: 0; }
.header-inner { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.brand { display: block; flex: none; line-height: 0; position: relative; z-index: 3; }
.logo { height: 52px; width: auto; transition: height 0.4s var(--ease); }
.is-scrolled .logo { height: 44px; }
.logo-light { display: none; }
.logo-custom { max-height: 52px; width: auto; }
.menu-open .logo-dark { display: none; }
.menu-open .logo-light { display: block; }
.menu-open .logo-custom { filter: brightness(0) invert(1); }

.primary-nav { display: flex; align-items: center; gap: 36px; margin-left: auto; }
.nav-list { display: flex; align-items: center; gap: 36px; }
.nav-list a { position: relative; display: block; padding: 8px 0; color: var(--ink); font-size: 12px; font-weight: 400; letter-spacing: 0.2em; text-transform: uppercase; }
.nav-list a::after { content: ''; position: absolute; left: 0; right: 0; bottom: 2px; height: 1px; background: var(--gold-deep); transform: scaleX(0); transform-origin: right; transition: transform 0.5s var(--ease-out); }
.nav-list a:hover::after, .nav-list .current-menu-item > a::after, .nav-list .current_page_item > a::after { transform: scaleX(1); transform-origin: left; }
.nav-list a:hover { color: var(--ink); }
.nav-extra { display: none; }
.header-actions { display: flex; align-items: center; gap: 20px; }
.menu-toggle { display: none; }
.scroll-progress { position: absolute; left: 0; bottom: -1px; height: 2px; width: 100%; background: var(--gold); transform: scaleX(var(--p, 0)); transform-origin: left; }
@media (max-width: 1199.98px) { .nav-list, .primary-nav { gap: 24px; } }

@media (max-width: 991.98px) {
	.header-cta { display: none; }
	.logo, .logo-custom { height: 42px; }
	.is-scrolled .logo { height: 38px; }
	.menu-toggle { display: block; position: relative; z-index: 3; width: 44px; height: 44px; padding: 0; background: none; border: 0; color: var(--ink); }
	.menu-toggle span { position: absolute; left: 10px; right: 10px; height: 1px; background: currentColor; transition: transform 0.5s var(--ease-out), top 0.5s var(--ease-out); }
	.menu-toggle span:nth-child(1) { top: 18px; }
	.menu-toggle span:nth-child(2) { top: 26px; }
	.menu-open .menu-toggle { color: var(--white); }
	.menu-open .menu-toggle span:nth-child(1) { top: 22px; transform: rotate(45deg); }
	.menu-open .menu-toggle span:nth-child(2) { top: 22px; transform: rotate(-45deg); }
	.primary-nav {
		position: fixed; inset: 0; z-index: 2; margin: 0; padding: calc(var(--header-h) + 24px) var(--gutter) 40px;
		flex-direction: column; justify-content: center; align-items: flex-start; gap: 36px; overflow-y: auto;
		background: var(--charcoal); background-image: radial-gradient(120% 80% at 90% 0%, rgba(196, 164, 106, 0.16), transparent 60%);
		opacity: 0; visibility: hidden; clip-path: inset(0 0 100% 0);
		transition: opacity 0.4s var(--ease), clip-path 0.8s var(--ease-out), visibility 0s linear 0.8s;
	}
	.menu-open .primary-nav { opacity: 1; visibility: visible; clip-path: inset(0); transition-delay: 0s; }
	.nav-list { flex-direction: column; align-items: flex-start; gap: 4px; }
	.nav-list a { color: var(--white); font-family: var(--serif); font-size: clamp(38px, 10vw, 56px); letter-spacing: 0; text-transform: none; font-weight: 300; line-height: 1.12; padding: 6px 0; }
	.nav-list a:hover { color: var(--gold); }
	.nav-list a::after { display: none; }
	.nav-list li { opacity: 0; transform: translateY(24px); transition: opacity 0.7s var(--ease-out), transform 0.7s var(--ease-out); }
	.menu-open .nav-list li { opacity: 1; transform: none; }
	.menu-open .nav-list li:nth-child(1) { transition-delay: 0.2s; }
	.menu-open .nav-list li:nth-child(2) { transition-delay: 0.26s; }
	.menu-open .nav-list li:nth-child(3) { transition-delay: 0.32s; }
	.menu-open .nav-list li:nth-child(4) { transition-delay: 0.38s; }
	.menu-open .nav-list li:nth-child(5) { transition-delay: 0.44s; }
	.menu-open .nav-list li:nth-child(6) { transition-delay: 0.5s; }
	.nav-extra { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; }
	.nav-extra .btn-ink { background: var(--gold); border-color: var(--gold); color: var(--ink); }
	.nav-extra .btn-ink::before { background: var(--white); }
	.nav-phone { color: var(--gold); font-size: 15px; letter-spacing: 0.08em; }
	.nav-phone:hover { color: var(--white); }
}

/* =====================================================================
   Hero
   ===================================================================== */
.hero {
	position: relative; min-height: min(100vh, 1080px); min-height: min(100svh, 1080px); max-height: 1080px; display: flex; align-items: center; justify-content: center; text-align: center;
	padding: var(--header-h) 0 clamp(56px, 9vh, 120px); overflow: hidden; isolation: isolate;
	background: radial-gradient(55% 60% at 50% 0%, rgba(196, 164, 106, 0.22), transparent 65%), radial-gradient(45% 45% at 0% 100%, rgba(196, 164, 106, 0.12), transparent 70%), radial-gradient(45% 45% at 100% 100%, rgba(196, 164, 106, 0.12), transparent 70%), var(--ivory);
}
.hero-bg { position: absolute; inset: -8% -4%; z-index: -2; filter: blur(var(--hero-blur, 0px)) saturate(var(--hero-sat, 100%)); will-change: transform; animation: heroZoom 24s var(--ease-out) both; }
.hero-bg-img { position: absolute; inset: -3%; background-size: cover; background-position: var(--hero-pos, 50% 50%); transform-origin: 50% 50%; }
.hero-water { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.has-motion .hero-bg-img { transform: translate3d(calc(var(--nx, 0) * var(--amp, 1) * -26px), calc(var(--ny, 0) * var(--amp, 1) * -18px), 0) rotateY(calc(var(--nx, 0) * var(--amp, 1) * 1.6deg)) rotateX(calc(var(--ny, 0) * var(--amp, 1) * -1.2deg)) scale(1.06); will-change: transform; }
.has-motion .hero-bg { perspective: 1400px; }
.has-motion .hero-inner { transform: translate3d(calc(var(--nx, 0) * var(--amp, 1) * 9px), calc(var(--ny, 0) * var(--amp, 1) * 6px), 0); }
/* Touch screens have no mouse: let the photo drift slowly instead. */
@media (hover: none) { .has-motion .hero-bg-img { animation: drift 22s ease-in-out infinite alternate; } }
@keyframes drift { from { transform: translate3d(-14px, -6px, 0) scale(1.07); } to { transform: translate3d(14px, 8px, 0) scale(1.07); } }
.has-photo::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(20, 15, 12, calc(var(--hero-overlay, 0.4) + 0.12)) 0%, rgba(20, 15, 12, var(--hero-overlay, 0.4)) 45%, rgba(20, 15, 12, calc(var(--hero-overlay, 0.4) + 0.2)) 100%); }
.has-photo::after { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(ellipse 75% 70% at 50% 50%, transparent 35%, rgba(10, 7, 5, calc(var(--hero-vig, 0) * 0.9)) 100%); }
.hero-fireflies { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; pointer-events: none; }
@keyframes heroZoom { from { transform: scale(1.1); } to { transform: scale(1); } }
.hero-inner { position: relative; display: flex; flex-direction: column; align-items: center; }
.hero-title { font-weight: 300; font-size: clamp(48px, 7.4vw, 124px); line-height: 0.98; letter-spacing: -0.025em; max-width: 18ch; margin: 0 auto 0.4em; text-wrap: balance; }
.hero-lead { max-width: 52ch; margin: 0 auto; font-size: clamp(16px, 1.4vw, 20px); color: var(--muted); animation: rise 1.2s var(--ease-out) 0.7s both; }
.hero-actions { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 20px 36px; margin-top: 40px; animation: rise 1.2s var(--ease-out) 0.9s both; }
.hero-rating { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-size: 14px; letter-spacing: 0.04em; color: var(--muted); }
.hero-rating .ic { color: var(--gold-deep); }
.hero-rating strong { font-family: var(--serif); font-size: 26px; font-weight: 500; color: var(--ink); line-height: 1; }
@keyframes rise { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }

.hero.pos-bottom { align-items: flex-end; padding-bottom: clamp(48px, 9vh, 110px); }
.hero.pos-bottom .hero-title { font-size: clamp(40px, 5.6vw, 92px); }

/* With a photo: white text, light button, white header */
.has-photo .hero-title, .has-photo .hero-title em { color: var(--white); }
.has-photo .hero-title em { color: var(--gold); }
.has-photo .hero-lead { color: rgba(255, 255, 255, 0.85); }
.has-photo .hero-rating, .has-photo .hero-rating strong { color: var(--white); }
.has-photo .hero-rating .ic { color: var(--gold); }
.btn-light { background: var(--ivory); color: var(--ink); border-color: var(--ivory); }
.btn-light::before { background: var(--gold); }
.btn-light:hover { color: var(--ink); border-color: var(--gold); }

.has-hero-photo .site-header.is-over:not(.is-scrolled):not(.menu-open) .logo-dark { display: none; }
.has-hero-photo .site-header.is-over:not(.is-scrolled):not(.menu-open) .logo-light { display: block; }
.has-hero-photo .site-header.is-over:not(.is-scrolled):not(.menu-open) .logo-custom { filter: brightness(0) invert(1); }
.has-hero-photo .site-header.is-over:not(.is-scrolled):not(.menu-open) .nav-list a { color: var(--white); }
.has-hero-photo .site-header.is-over:not(.is-scrolled):not(.menu-open) .nav-list a::after { background: var(--gold); }
.has-hero-photo .site-header.is-over:not(.is-scrolled):not(.menu-open) .header-cta { background: var(--ivory); border-color: var(--ivory); color: var(--ink); }
.has-hero-photo .site-header.is-over:not(.is-scrolled):not(.menu-open) .menu-toggle { color: var(--white); }

@media (max-width: 991.98px) {
	.hero { min-height: 0; padding-top: calc(var(--header-h) + 56px); }
}

/* =====================================================================
   Sections
   ===================================================================== */
.section { padding-block: clamp(48px, 6vw, 96px); position: relative; }
#boutiques { padding-top: 24px; }
.section-tight { padding-block: clamp(40px, 6vw, 80px) clamp(72px, 9vw, 120px); }
.section-stone { background: var(--stone); }
.locations { background: var(--ivory); }
.faq { background: var(--ivory); }
.section-dark { background: var(--charcoal); color: var(--ivory); }
.section-head { margin-bottom: clamp(28px, 4vw, 56px); }
.split-head { display: grid; grid-template-columns: 1.2fr 1fr; gap: 24px clamp(32px, 7vw, 120px); align-items: end; }
.split-head .section-lead { margin: 0 0 0.6em; justify-self: end; }
.section-title { font-size: clamp(34px, 4.4vw, 68px); font-weight: 300; line-height: 1.02; letter-spacing: -0.02em; margin-bottom: 0; }
.section-lead { font-size: clamp(16px, 1.3vw, 19px); color: var(--muted); max-width: 46ch; }
.section-dark .section-lead { color: rgba(250, 248, 245, 0.68); }
.section-dark h2, .section-dark h3 { color: var(--ivory); }
.section-dark em { color: var(--gold); }
@media (max-width: 767.98px) { .split-head { grid-template-columns: 1fr; } .split-head .section-lead { justify-self: start; } }

/* Trust strip */
.trust { background: var(--white); border-block: 1px solid var(--line); }
.trust-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.trust-item { display: flex; gap: 18px; align-items: flex-start; padding: 18px 28px; border-left: 1px solid var(--line); }
.trust-item:first-child { border-left: 0; padding-left: 0; }
.trust-item .ic { width: 28px; height: 28px; color: var(--gold-deep); stroke-width: 1.1; margin-top: 2px; }
.trust-item strong { display: block; font-family: var(--serif); font-size: 23px; font-weight: 500; line-height: 1.15; margin-bottom: 4px; }
.trust-item span { display: block; font-size: 14px; color: var(--muted); line-height: 1.5; }
@media (max-width: 991.98px) { .trust-grid { grid-template-columns: repeat(2, 1fr); } .trust-item:nth-child(3) { border-left: 0; padding-left: 0; } .trust-item:nth-child(n+3) { border-top: 1px solid var(--line); } }
@media (max-width: 575.98px) { .trust-grid { grid-template-columns: 1fr; } .trust-item { border-left: 0; padding: 14px 0; } .trust-item + .trust-item { border-top: 1px solid var(--line); } }

/* =====================================================================
   Split text and statement
   ===================================================================== */
.w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: 0.14em; margin-bottom: -0.14em; }
.w > span { display: inline-block; transform: translateY(108%); transition: transform 1.2s var(--ease-out) calc(var(--i, 0) * 60ms); }
[data-split].is-in .w > span { transform: none; }
.hero-title .w > span { transition-delay: calc(var(--i, 0) * 80ms + 0.35s); }

.statement { max-width: 1100px; }
.statement-text { font-family: var(--serif); font-weight: 300; font-size: clamp(30px, 4.3vw, 66px); line-height: 1.16; letter-spacing: -0.015em; margin: 0; }
.js .statement-text .sw { opacity: 0.16; transition: opacity 0.5s var(--ease); }
.js .statement-text .sw.is-lit { opacity: 1; }

/* =====================================================================
   Boutiques list
   ===================================================================== */
.toolbar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 18px; margin-bottom: 32px; }
.toolbar-right { display: flex; align-items: center; gap: 16px; }
.chips { display: flex; flex-wrap: wrap; gap: 10px; }
.section-tight .chips { margin-bottom: 40px; }
.chip { padding: 11px 22px; border: 1px solid var(--line); border-radius: 999px; background: transparent; color: var(--ink); font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 400; cursor: pointer; transition: background-color 0.35s var(--ease), color 0.35s var(--ease), border-color 0.35s var(--ease); }
.chip:hover { border-color: var(--ink); }
.chip.is-active { background: var(--ink); border-color: var(--ink); color: var(--ivory); }
.select-plain { padding: 11px 42px 11px 20px; border: 1px solid var(--line); border-radius: 999px; background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%231C1917' stroke-width='1.4'/%3E%3C/svg%3E") no-repeat right 18px center; font: inherit; font-size: 14px; color: var(--ink); appearance: none; -webkit-appearance: none; cursor: pointer; }
.view-toggle { display: inline-flex; border: 1px solid var(--line); border-radius: 999px; overflow: hidden; }
.view-toggle button { width: 46px; height: 42px; display: grid; place-items: center; background: transparent; border: 0; color: var(--muted); }
.view-toggle button.is-active { background: var(--ink); color: var(--ivory); }
.result-text { font-size: 13px; letter-spacing: 0.06em; color: var(--muted); margin-bottom: 36px; min-height: 1.7em; }

.boutique-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(36px, 4vw, 64px) clamp(20px, 2.6vw, 40px); align-items: stretch; }
@media (max-width: 1199.98px) { .boutique-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 767.98px) { .boutique-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575.98px) { .boutique-grid { grid-template-columns: 1fr; } }
.boutique-col[hidden] { display: none; }

.boutique-card { position: relative; height: 100%; display: flex; flex-direction: column; }
.boutique-media { position: relative; aspect-ratio: 4 / 5; overflow: hidden; background: var(--stone); border-radius: 18px; }
.boutique-media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--ease-out); }
.boutique-card:hover .boutique-media img { transform: scale(1.07); }
.boutique-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 60%, rgba(28, 25, 23, 0.4)); opacity: 0; transition: opacity 0.5s var(--ease); pointer-events: none; }
.boutique-card:hover .boutique-media::after { opacity: 1; }
.js .boutique-col.reveal .boutique-media { clip-path: inset(100% 0 0 0); transition: clip-path 1.3s var(--ease-out) var(--d, 0ms); }
.js .boutique-col.reveal.is-in .boutique-media { clip-path: inset(0); }
.js .boutique-col.reveal .boutique-media img { transform: scale(1.18); }
.js .boutique-col.reveal.is-in .boutique-media img { transform: none; }
.js .boutique-col.reveal.is-in .boutique-card:hover .boutique-media img { transform: scale(1.07); }
.boutique-placeholder { position: absolute; inset: 0; display: grid; place-items: center; color: rgba(138, 107, 48, 0.6); background: radial-gradient(70% 45% at 50% 18%, rgba(255, 249, 235, 0.85), transparent 70%), linear-gradient(175deg, #efe5d3, #d9c6a3 55%, #bfa273); }
.boutique-placeholder .ic { width: 56px; height: 56px; stroke-width: 0.9; }
.badge { position: absolute; top: 16px; left: 16px; z-index: 2; padding: 7px 16px; border-radius: 999px; background: var(--ivory); color: var(--ink); font-size: 10.5px; font-weight: 500; letter-spacing: 0.2em; text-transform: uppercase; }
.badge-inline { position: static; display: inline-block; margin-bottom: 18px; background: var(--ink); color: var(--ivory); }
.rating { position: absolute; top: 14px; right: 14px; z-index: 2; display: inline-flex; align-items: center; gap: 8px; padding: 5px 12px 5px 5px; border-radius: 999px; background: rgba(250, 248, 245, 0.95); font-size: 13px; font-weight: 500; }
.rating-label { line-height: 1; }
.boutique-view { position: absolute; left: 20px; right: 20px; bottom: 20px; z-index: 2; display: flex; align-items: center; justify-content: space-between; padding: 16px 22px; border-radius: 999px; background: var(--ivory); font-size: 11.5px; letter-spacing: 0.22em; text-transform: uppercase; transform: translateY(140%); transition: transform 0.6s var(--ease-out); pointer-events: none; }
.boutique-card:hover .boutique-view, .boutique-card:focus-within .boutique-view { transform: none; }
.boutique-body { padding: 20px 2px 0; display: flex; flex-direction: column; flex: 1; }
.boutique-area { font-size: 11px; font-weight: 500; letter-spacing: 0.24em; text-transform: uppercase; color: var(--gold-deep); margin-bottom: 10px; }
.boutique-title { font-size: clamp(22px, 1.7vw, 28px); font-weight: 400; margin-bottom: 8px; }
.boutique-title a::after { content: ''; position: absolute; inset: 0; z-index: 3; }
.boutique-title a:hover { color: var(--ink); }
.boutique-tagline { font-size: 15px; color: var(--muted); margin-bottom: 14px; line-height: 1.6; }
.boutique-specs { display: flex; flex-wrap: wrap; gap: 6px 22px; font-size: 13px; color: var(--muted); margin-top: auto; padding-top: 10px; }
.boutique-specs li { display: inline-flex; align-items: center; gap: 8px; }
.boutique-specs .ic { color: var(--gold-deep); }
.boutique-price { margin: 16px 0 0; padding-top: 16px; border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; }
.boutique-price .from { width: 100%; font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--muted); }
.boutique-price .from.is-off { display: none; }
.boutique-price .amount { font-family: var(--serif); font-size: 30px; line-height: 1.1; color: var(--ink); }
.boutique-price .unit { font-size: 13px; color: var(--muted); }

.empty-card { padding: 56px 32px; text-align: center; border: 1px dashed rgba(28, 25, 23, 0.25); border-radius: 24px; color: var(--muted); }
.empty-card[hidden] { display: none; }
.empty-card a { text-decoration: underline; text-underline-offset: 3px; }
.empty-card p { margin-bottom: 0.6em; }
.empty-card strong { color: var(--ink); font-weight: 500; }
.empty-card .btn { margin-top: 12px; }

.map-view[hidden] { display: none; }
.map-box { width: 100%; height: clamp(320px, 52vw, 580px); background: var(--stone); border-radius: 24px; overflow: hidden; }
.map-note { font-size: 13px; color: var(--muted); margin-top: 12px; }
.leaflet-container { font-family: var(--sans); }
.osm-soft { filter: grayscale(0.95) contrast(0.95) sepia(0.12); }
.vd-pin { width: 18px; height: 18px; background: var(--ink); border: 2px solid var(--white); border-radius: 50%; box-shadow: 0 0 0 1px var(--ink), 0 6px 14px rgba(0, 0, 0, 0.3); }
.vd-pin.has-price { width: auto; height: auto; padding: 6px 14px; border-radius: 999px; color: var(--white); font-size: 13px; font-weight: 500; white-space: nowrap; transform: translate(-50%, -100%); }
.leaflet-popup-content-wrapper { border-radius: 16px; }
.map-pop { display: block; width: 190px; color: var(--ink); }
.map-pop img { width: 100%; height: 110px; object-fit: cover; margin-bottom: 8px; border-radius: 8px; }
.map-pop strong { display: block; font-family: var(--serif); font-size: 20px; font-weight: 500; line-height: 1.15; }
.map-pop span { font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold-deep); }

/* =====================================================================
   About
   ===================================================================== */
.about { background: var(--sand); }
.about-grid.no-visual { grid-template-columns: 1fr; margin-top: clamp(28px, 4vw, 48px); }
.about-grid.no-visual .about-copy { max-width: 760px; }
.about-grid { display: grid; grid-template-columns: 5fr 6fr; gap: clamp(40px, 9vw, 150px); align-items: center; margin-top: clamp(40px, 6vw, 88px); }
.about-arch { position: relative; aspect-ratio: 3 / 4; max-width: 480px; border-radius: 999px 999px 0 0; overflow: hidden; background: var(--stone); }
.about-arch img { position: absolute; inset: -6% 0; width: 100%; height: 112%; object-fit: cover; max-width: none; }
.about-copy .section-title { margin-bottom: 0.6em; }
.about-copy p { color: var(--muted); font-size: 17px; max-width: 50ch; }
.about-copy .link-arrow { margin-top: 16px; }
@media (max-width: 991.98px) { .about-grid { grid-template-columns: 1fr; } .about-arch { max-width: 360px; } }

/* =====================================================================
   The experience
   ===================================================================== */


/* =====================================================================
   Locations
   ===================================================================== */
.loc-panels { display: flex; gap: 14px; height: clamp(480px, 70vh, 700px); }
.loc { position: relative; flex: 1; overflow: hidden; border-radius: 28px; color: var(--white); cursor: pointer; transition: flex 1s var(--ease-out); isolation: isolate; outline-offset: 3px; }
.loc.is-active { flex: 2.6; cursor: default; }
.loc.tone-0 { background: linear-gradient(165deg, #c9b58c, #7a6540 60%, #4d3f27); }
.loc.tone-1 { background: linear-gradient(165deg, #a0a692, #5c6354 60%, #383d32); }
.loc.tone-2 { background: linear-gradient(165deg, #d3c3ad, #8a7461 60%, #5a4a3c); }
.loc::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(28, 25, 23, 0) 30%, rgba(28, 25, 23, 0.72)); }
.loc-img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transform: scale(1.12); transition: transform 1.6s var(--ease-out); }
.loc.is-active .loc-img { transform: scale(1); }
.loc-num { position: absolute; top: 28px; left: 32px; font-family: var(--serif); font-size: 22px; letter-spacing: 0.1em; opacity: 0.85; }
.loc-body { position: absolute; left: 0; right: 0; bottom: 0; padding: clamp(24px, 3vw, 44px); }
.loc-body h3 { font-size: clamp(30px, 3.6vw, 56px); font-weight: 300; color: var(--white); margin: 0; transition: font-size 0.8s var(--ease-out); }
.loc:not(.is-active) .loc-body h3 { font-size: clamp(24px, 2.3vw, 36px); }
.loc-body p { max-width: 46ch; margin: 14px 0 0; color: rgba(255, 255, 255, 0.82); opacity: 0; transform: translateY(20px); max-height: 0; overflow: hidden; transition: opacity 0.6s var(--ease) 0s, transform 0.8s var(--ease-out), max-height 0.8s var(--ease-out); }
.loc-body .link-arrow { margin-top: 22px; opacity: 0; transform: translateY(20px); pointer-events: none; transition: opacity 0.6s var(--ease), transform 0.8s var(--ease-out); }
.loc.is-active .loc-body p { opacity: 1; transform: none; max-height: 260px; transition-delay: 0.25s; }
.loc.is-active .loc-body .link-arrow { opacity: 1; transform: none; pointer-events: auto; transition-delay: 0.35s; }
@media (max-width: 991.98px) {
	.loc-panels { flex-direction: column; height: auto; }
	.loc, .loc.is-active { flex: none; min-height: 340px; cursor: default; display: flex; flex-direction: column; justify-content: flex-end; }
	.loc-body { position: relative; padding-top: 84px; }
	.loc-body p, .loc-body .link-arrow { opacity: 1; transform: none; max-height: none; pointer-events: auto; }
	.loc:not(.is-active) .loc-body h3, .loc-body h3 { font-size: clamp(32px, 8vw, 46px); }
}

/* Reviews slider */
.rating-line { display: inline-flex; align-items: center; gap: 10px; font-size: 15px; color: var(--muted); margin: 0; }
.split-head .rating-line { justify-self: end; margin-bottom: 0.4em; }
.reviews .section-head { margin-bottom: 12px; }
.rating-line .ic { color: var(--gold-deep); }
.rating-line strong { font-family: var(--serif); font-size: 32px; font-weight: 500; color: var(--ink); line-height: 1; }
.slider { position: relative; }
.slider-bar { display: flex; justify-content: flex-end; gap: 10px; margin-bottom: 24px; }
.round-btn { width: 54px; height: 54px; display: grid; place-items: center; border: 1px solid rgba(28, 25, 23, 0.25); background: transparent; border-radius: 50%; color: var(--ink); transition: background-color 0.35s var(--ease), color 0.35s var(--ease), border-color 0.35s var(--ease); }
.round-btn:hover { background: var(--ink); color: var(--ivory); border-color: var(--ink); }
.round-btn:disabled { opacity: 0.3; pointer-events: none; }
.slider-track { display: flex; gap: 24px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; padding-inline: max(var(--gutter), calc((100vw - var(--maxw)) / 2)); scroll-padding-inline: max(var(--gutter), calc((100vw - var(--maxw)) / 2)); padding-bottom: 4px; }
.slider-track::-webkit-scrollbar { display: none; }
.slider-track .review-card { flex: 0 0 min(440px, 86vw); scroll-snap-align: start; }
.review-card { margin: 0; padding: 44px 40px 34px; background: var(--white); border-radius: 28px; display: flex; flex-direction: column; }
.review-text { font-family: var(--serif); font-size: 23px; line-height: 1.4; color: var(--ink); font-weight: 400; margin-bottom: 28px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; line-clamp: 5; overflow: hidden; max-height: 7em; }
.review-card figcaption { margin-top: auto; padding-top: 18px; border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: 2px 14px; font-size: 13px; color: var(--muted); }
.review-card figcaption strong { font-weight: 500; color: var(--ink); letter-spacing: 0.04em; width: 100%; }
.review-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.review-grid .review-card { background: var(--sand); }
@media (max-width: 767.98px) { .review-grid { grid-template-columns: 1fr; } }

/* How */

/* FAQ */
.faq-grid { display: grid; grid-template-columns: 4fr 7fr; gap: clamp(40px, 7vw, 120px); align-items: start; }
.faq-head { position: sticky; top: calc(var(--header-h) + 32px); }
.faq-head .section-title { margin-bottom: 0.4em; }
.faq-head .link-arrow { margin-top: 8px; }
.faq-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 28px; }
.faq-tab { padding: 10px 20px; border: 1px solid rgba(28, 25, 23, 0.2); border-radius: 999px; background: transparent; font-size: 11.5px; letter-spacing: 0.16em; text-transform: uppercase; transition: all 0.35s var(--ease); }
.faq-tab:hover { border-color: var(--ink); }
.faq-tab.is-active { background: var(--ink); border-color: var(--ink); color: var(--ivory); }
.faq-panel[hidden] { display: none; }
.faq-panel { border-top: 1px solid rgba(28, 25, 23, 0.2); animation: fade 0.6s var(--ease); }
@keyframes fade { from { opacity: 0; } to { opacity: 1; } }
.acc-item { border-bottom: 1px solid rgba(28, 25, 23, 0.2); }
.acc-item h3 { margin: 0; font-family: var(--sans); }
.acc-btn { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 28px 0; background: none; border: 0; text-align: left; font-family: var(--serif); font-size: clamp(22px, 2vw, 28px); font-weight: 500; line-height: 1.25; color: var(--ink); transition: padding 0.5s var(--ease-out); }
.acc-btn:hover { padding-left: 10px; }
.acc-btn .ic { width: 22px; height: 22px; color: var(--gold-deep); transition: transform 0.6s var(--ease-out); }
.acc-btn[aria-expanded='true'] .ic { transform: rotate(135deg); }
.acc-panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.6s var(--ease-out); }
.acc-panel.is-open { grid-template-rows: 1fr; }
.acc-inner { overflow: hidden; min-height: 0; color: var(--muted); max-width: 64ch; }
.acc-inner > :first-child { margin-top: 0; }
.acc-inner > :last-child { margin-bottom: 28px; }
@media (max-width: 991.98px) { .faq-grid { grid-template-columns: 1fr; } .faq-head { position: static; } }

/* Contact */
.contact { background: var(--sand); }
.contact-grid { display: grid; grid-template-columns: 6fr 5fr; gap: clamp(40px, 8vw, 130px); align-items: center; }
.contact-title { font-size: clamp(34px, 4.4vw, 68px); font-weight: 300; line-height: 1.02; letter-spacing: -0.02em; margin-bottom: 0.5em; }
.contact-copy > p { color: var(--muted); max-width: 46ch; }
.contact-copy .btn { margin-top: 12px; }
.contact-list { display: grid; gap: 14px; margin-top: 40px; }
.contact-list li { display: flex; align-items: flex-start; gap: 14px; }
.contact-list .ic { margin-top: 5px; color: var(--gold-deep); }
.contact-list a { border-bottom: 1px solid var(--line); }
.contact-list a:hover { color: var(--ink); border-color: var(--gold-deep); }
.contact-form { background: var(--white); padding: clamp(28px, 4vw, 56px); border-radius: 32px; box-shadow: 0 40px 80px -40px rgba(28, 25, 23, 0.25); }
.contact-form h3 { font-size: 32px; margin-bottom: 1em; }
@media (max-width: 991.98px) { .contact-grid { grid-template-columns: 1fr; } }

/* Forms */
.field { display: block; margin-bottom: 22px; min-width: 0; }
.field label { display: block; font-size: 10.5px; font-weight: 500; letter-spacing: 0.24em; text-transform: uppercase; color: var(--gold-deep); margin-bottom: 4px; }
.field input, .field select, .field textarea { width: 100%; padding: 10px 0; border: 0; border-bottom: 1px solid rgba(28, 25, 23, 0.25); border-radius: 0; background: transparent; font: inherit; font-size: 16px; color: var(--ink); outline: none; transition: border-color 0.3s var(--ease), box-shadow 0.3s var(--ease); }
.field textarea { resize: vertical; min-height: 110px; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--ink); box-shadow: 0 1px 0 var(--ink); }
.field select { appearance: none; -webkit-appearance: none; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%231C1917' stroke-width='1.4'/%3E%3C/svg%3E") no-repeat right 2px center; padding-right: 22px; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 28px; }
.field-row-3 { grid-template-columns: 1fr 1fr 1fr; gap: 0 20px; }
@media (max-width: 575.98px) { .field-row, .field-row-3 { grid-template-columns: 1fr; } }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form-notice { padding: 14px 18px; margin-bottom: 24px; font-size: 14px; border-left: 3px solid; border-radius: 4px; }
.form-notice.is-ok { background: #f1f6ee; border-color: #4b7a3a; color: #2f4f23; }
.form-notice.is-err { background: #fbeeee; border-color: var(--red); color: #5a1d1d; }

/* =====================================================================
   Footer
   ===================================================================== */
.site-footer { background: var(--charcoal); color: rgba(250, 248, 245, 0.62); padding-block: clamp(72px, 9vw, 120px) 0; font-size: 15px; position: relative; overflow: hidden; }
.site-footer a { color: rgba(250, 248, 245, 0.8); }
.site-footer a:hover { color: var(--gold); }
.footer-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.4fr; gap: clamp(32px, 4vw, 64px); }
.footer-brand .logo { height: 62px; margin-bottom: 26px; }
.footer-brand p { max-width: 34ch; }
.footer-col h2 { font-family: var(--sans); font-size: 11px; font-weight: 500; letter-spacing: 0.28em; text-transform: uppercase; color: var(--gold); margin-bottom: 22px; }
.footer-col li { margin-bottom: 10px; }
.footer-col .contact-list { margin-top: 0; gap: 12px; }
.footer-col .contact-list .ic { color: var(--gold); }
.site-footer .contact-list a { border: 0; }
.footer-brand .logo-light { display: block; }
.social { display: flex; gap: 10px; margin-top: 24px; }
.social a { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid rgba(250, 248, 245, 0.25); border-radius: 50%; transition: all 0.4s var(--ease); }
.social a:hover { background: var(--gold); border-color: var(--gold); color: var(--ink); }
.footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 32px; margin-top: clamp(48px, 6vw, 88px); padding: 24px 0; border-top: 1px solid rgba(250, 248, 245, 0.14); font-size: 13px; position: relative; z-index: 1; }
.footer-links { display: flex; flex-wrap: wrap; gap: 8px 28px; align-items: center; }
.to-top { display: inline-flex; align-items: center; gap: 8px; }
.to-top .up { transform: rotate(-90deg); }
@media (max-width: 991.98px) { .footer-grid { grid-template-columns: 1fr 1fr; } .footer-brand { grid-column: 1 / -1; } }
@media (max-width: 575.98px) { .footer-grid { grid-template-columns: 1fr; } }

.mobile-bar { display: none; }
@media (max-width: 767.98px) {
	.mobile-bar { display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; padding: 10px var(--gutter) calc(10px + env(safe-area-inset-bottom)); background: rgba(250, 248, 245, 0.94); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-top: 1px solid var(--line); transform: translateY(110%); transition: transform 0.5s var(--ease-out); }
	.mobile-bar.is-on { transform: none; }
	.mobile-bar .btn { width: 100%; }
	.menu-open .mobile-bar { transform: translateY(110%); }
	.footer-bottom { padding-bottom: 96px; }
}

/* =====================================================================
   Inner pages
   ===================================================================== */
.page-hero { padding: calc(var(--header-h) + clamp(56px, 8vw, 120px)) 0 clamp(44px, 6vw, 88px); background: var(--sand); position: relative; overflow: hidden; }
.page-hero h1 { font-size: clamp(44px, 7vw, 112px); font-weight: 300; margin: 0; max-width: 16ch; letter-spacing: -0.025em; line-height: 1; }
.page-lead { max-width: 62ch; margin-top: 22px; font-size: 18px; color: var(--muted); }
.prose { max-width: 860px; }
.prose-img { width: 100%; margin-bottom: 40px; border-radius: 24px; }
.entry-content { font-size: 17px; }
.entry-content > * + * { margin-top: 1.2em; }
.entry-content h2 { font-size: clamp(30px, 3vw, 44px); margin-top: 1.6em; }
.entry-content h3 { font-size: clamp(24px, 2.4vw, 32px); margin-top: 1.4em; }
.entry-content a { text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--gold); }
.entry-content ul { list-style: disc; padding-left: 1.3em; }
.entry-content ol { list-style: decimal; padding-left: 1.3em; }
.entry-content li { margin-bottom: 0.4em; }
.entry-content blockquote { border-left: 2px solid var(--gold); padding-left: 24px; font-family: var(--serif); font-size: 26px; font-style: italic; }
.pagination { margin-top: 56px; }
.nav-links { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.page-numbers { min-width: 46px; height: 46px; display: inline-grid; place-items: center; padding: 0 14px; border: 1px solid var(--line); border-radius: 999px; font-size: 14px; }
.page-numbers.current, .page-numbers:hover { background: var(--ink); border-color: var(--ink); color: var(--ivory); }
.post-card .post-media { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--stone); border-radius: 20px; }
.post-card .post-media img { width: 100%; height: 100%; object-fit: cover; }
.post-card .boutique-body { padding-top: 20px; }
.search-form { display: flex; gap: 10px; max-width: 480px; margin-top: 24px; }
.search-form label { flex: 1; }
.search-form .search-field { padding: 14px 20px; border: 1px solid var(--line); border-radius: 999px; width: 100%; font: inherit; background: var(--white); }
.search-form .search-submit { padding: 14px 28px; border-radius: 999px; background: var(--ink); color: var(--ivory); border: 0; text-transform: uppercase; letter-spacing: 0.16em; font-size: 12px; }
.not-found { padding: calc(var(--header-h) + clamp(72px, 12vw, 160px)) 0 clamp(80px, 12vw, 160px); }
.not-found h1 { font-size: clamp(36px, 5vw, 64px); font-weight: 300; }
.not-found-code { font-family: var(--serif); font-size: clamp(120px, 24vw, 320px); line-height: 0.85; font-weight: 300; font-style: italic; color: var(--gold); margin-bottom: 0.1em; }
.not-found .section-lead { margin-inline: auto; }

/* =====================================================================
   Single boutique
   ===================================================================== */
.single-boutique { padding: calc(var(--header-h) + 24px) 0 clamp(72px, 9vw, 130px); }
.breadcrumb { display: flex; flex-wrap: wrap; gap: 10px; font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted); margin-bottom: 26px; }
.breadcrumb a { color: var(--muted); }
.breadcrumb a:hover { color: var(--ink); }
.boutique-head { margin-bottom: 32px; }
.boutique-head h1 { font-size: clamp(36px, 5vw, 60px); font-weight: 700; margin-bottom: 16px; letter-spacing: -0.02em; }
.boutique-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 28px; color: var(--muted); font-size: 14px; letter-spacing: 0.04em; margin: 0; }
.boutique-meta span { display: inline-flex; align-items: center; gap: 8px; }
.boutique-meta .ic { color: var(--gold-deep); }
.boutique-meta strong { color: var(--ink); font-weight: 500; }

.gallery-mosaic { position: relative; display: grid; gap: 10px; height: clamp(300px, 52vw, 620px); grid-template-columns: repeat(4, 1fr); grid-template-rows: 1fr 1fr; }
.gallery-cell { position: relative; padding: 0; border: 0; overflow: hidden; background: var(--stone); cursor: zoom-in; border-radius: 6px; }
.gallery-cell img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--ease-out); }
.gallery-cell:hover img { transform: scale(1.05); }
.gallery-cell.main { grid-column: 1 / 3; grid-row: 1 / 3; border-radius: 28px 6px 6px 28px; }
.g-n1 { grid-template-columns: 1fr; grid-template-rows: 1fr; }
.g-n1 .gallery-cell.main { grid-column: 1; grid-row: 1; border-radius: 28px; }
.g-n2 .gallery-cell:not(.main) { grid-column: 3 / 5; grid-row: 1 / 3; }
.g-n3 .gallery-cell:nth-child(2) { grid-column: 3 / 5; grid-row: 1; }
.g-n3 .gallery-cell:nth-child(3) { grid-column: 3 / 5; grid-row: 2; }
.g-n4 .gallery-cell:nth-child(2) { grid-column: 3 / 5; grid-row: 1; }
.gallery-mosaic > .gallery-cell:last-of-type:not(.main) { border-radius: 6px 28px 28px 6px; }
.gallery-all { position: absolute; right: 18px; bottom: 18px; display: inline-flex; align-items: center; gap: 10px; padding: 13px 22px; border-radius: 999px; background: rgba(250, 248, 245, 0.96); border: 0; font-size: 11.5px; letter-spacing: 0.16em; text-transform: uppercase; transition: background-color 0.3s var(--ease), color 0.3s var(--ease); }
.gallery-all:hover { background: var(--ink); color: var(--ivory); }
.gallery-empty { height: clamp(240px, 36vw, 420px); display: grid; place-items: center; border-radius: 28px; background: linear-gradient(175deg, #efe5d3, #d9c6a3 60%, #bfa273); color: rgba(138, 107, 48, 0.7); }
.gallery-empty .ic { width: 72px; height: 72px; stroke-width: 0.8; }
@media (max-width: 767.98px) {
	.gallery-mosaic { grid-template-columns: 1fr; grid-template-rows: 1fr; height: 78vw; }
	.gallery-cell:not(.main) { display: none; }
	.gallery-cell.main { grid-column: 1; grid-row: 1; border-radius: 22px; }
}

.boutique-layout { display: grid; grid-template-columns: minmax(0, 1fr) 410px; gap: clamp(40px, 6vw, 100px); margin-top: clamp(36px, 5vw, 72px); align-items: start; }
.boutique-facts { display: flex; flex-wrap: wrap; gap: 14px 40px; padding-bottom: 28px; margin-bottom: 32px; border-bottom: 1px solid var(--line); }
.boutique-facts li { display: inline-flex; align-items: center; gap: 12px; font-family: var(--serif); font-size: 23px; }
.boutique-facts .ic { width: 24px; height: 24px; color: var(--gold-deep); stroke-width: 1.1; }
.boutique-lead { font-family: var(--serif); font-size: clamp(26px, 2.6vw, 38px); line-height: 1.3; font-weight: 300; margin-bottom: 1.2em; }
.block-title { font-size: clamp(30px, 2.8vw, 42px); font-weight: 400; margin: 2em 0 0.7em; display: flex; align-items: center; gap: 12px; }
.block-title .ic { color: var(--gold-deep); width: 0.8em; height: 0.8em; }
.amenities { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 14px 28px; }
.amenities li { display: flex; align-items: flex-start; gap: 12px; }
.amenities .ic { color: var(--gold-deep); margin-top: 5px; }
.permit { margin-top: 36px; font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }

.booking-panel { position: sticky; top: calc(var(--header-h) + 24px); background: var(--white); padding: 36px 32px 28px; border-radius: 28px; box-shadow: 0 40px 80px -40px rgba(28, 25, 23, 0.3), 0 0 0 1px var(--line); }
.panel-title { font-family: var(--serif); font-size: 32px; margin-bottom: 20px; }
.panel-price { margin-bottom: 22px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; }
.panel-price .from { width: 100%; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--muted); }
.panel-price .amount { font-family: var(--serif); font-size: 46px; line-height: 1; }
.panel-price .unit { font-size: 14px; color: var(--muted); }
.panel-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 0 20px; }
.panel-fields .field-full { grid-column: 1 / -1; }
.panel-total { font-family: var(--serif); font-size: 24px; margin: 6px 0 4px; }
.panel-error { font-size: 13px; color: var(--red); margin: 0 0 14px; }
.panel-error:empty, .panel-total:empty { display: none; }
.panel-note { text-align: center; font-size: 13px; color: var(--muted); margin: 12px 0 0; }
.enquire { margin-top: 22px; border-top: 1px solid var(--line); padding-top: 4px; }
.enquire summary { list-style: none; display: flex; justify-content: space-between; align-items: center; padding: 14px 0; cursor: pointer; font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase; }
.enquire summary::-webkit-details-marker { display: none; }
.enquire summary .ic { transition: transform 0.5s var(--ease-out); }
.enquire[open] summary .ic { transform: rotate(180deg); }
.enquire .field { margin-bottom: 16px; }
.enquire .btn { width: 100%; }
.panel-assurance { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--line); display: grid; gap: 10px; font-size: 13.5px; color: var(--muted); }
.panel-assurance li { display: flex; align-items: center; gap: 12px; }
.panel-assurance .ic { color: var(--gold-deep); }
.boutique-reviews { margin-top: 12px; }
@media (max-width: 991.98px) { .boutique-layout { grid-template-columns: 1fr; } .booking-panel { position: static; } }

/* Lightbox */
.lightbox { position: fixed; inset: 0; z-index: 1200; display: flex; flex-direction: column; background: rgba(24, 20, 18, 0.97); color: var(--white); opacity: 0; transition: opacity 0.4s var(--ease); }
.lightbox[hidden] { display: none; }
.lightbox.is-open { opacity: 1; }
.lb-top { display: flex; align-items: center; gap: 18px; padding: 18px var(--gutter); }
.lb-title { font-family: var(--serif); font-size: 26px; }
.lb-count { font-size: 13px; letter-spacing: 0.14em; color: rgba(255, 255, 255, 0.6); }
.lb-close { margin-left: auto; width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid rgba(255, 255, 255, 0.3); border-radius: 50%; background: transparent; color: var(--white); transition: all 0.3s var(--ease); }
.lb-close:hover { background: var(--white); color: var(--ink); }
.lb-stage { position: relative; flex: 1; min-height: 0; display: grid; place-items: center; padding: 0 clamp(8px, 7vw, 100px); touch-action: pan-y; }
.lb-stage img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; border-radius: 6px; transition: opacity 0.35s var(--ease), transform 0.6s var(--ease-out); }
.lb-stage img.is-loading { opacity: 0; transform: scale(0.985); }
.lb-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 54px; height: 54px; display: grid; place-items: center; border: 1px solid rgba(255, 255, 255, 0.3); border-radius: 50%; background: rgba(24, 20, 18, 0.4); color: var(--white); z-index: 2; transition: all 0.3s var(--ease); }
.lb-nav:hover { background: var(--white); color: var(--ink); }
.lb-prev { left: clamp(8px, 2vw, 28px); }
.lb-next { right: clamp(8px, 2vw, 28px); }
.lb-thumbs { display: flex; gap: 8px; overflow-x: auto; padding: 14px var(--gutter) calc(18px + env(safe-area-inset-bottom)); justify-content: safe center; scrollbar-width: thin; }
.lb-thumbs button { flex: none; width: 76px; height: 54px; padding: 0; border: 1px solid transparent; border-radius: 6px; overflow: hidden; background: none; opacity: 0.45; transition: opacity 0.3s var(--ease), border-color 0.3s var(--ease); }
.lb-thumbs button.is-active, .lb-thumbs button:hover { opacity: 1; border-color: var(--gold); }
.lb-thumbs img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 575.98px) { .lb-nav { width: 42px; height: 42px; } .lb-thumbs button { width: 60px; height: 44px; } }

/* =====================================================================
   Motion
   ===================================================================== */
.js .reveal { opacity: 0; transform: translateY(32px); transition: opacity 1.1s var(--ease-out) var(--d, 0ms), transform 1.1s var(--ease-out) var(--d, 0ms); }
.js .reveal.is-in { opacity: 1; transform: none; }
/* Wait for the intro curtain before the hero begins. */
.has-intro .hero-lead, .has-intro .hero-actions { animation-play-state: paused; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; transition-delay: 0s !important; }
	.js .reveal { opacity: 1; transform: none; }
	.w > span { transform: none; }
	.js .statement-text .sw { opacity: 1; }
	.has-intro .intro { display: none; }
}

@media print {
	.site-header, .mobile-bar, .lightbox, .search-bar, .intro { display: none !important; }
	body { background: #fff; }
}


/* Booking panel: platform button, OR divider, direct booking form */
.btn-platform { width: 100%; padding: 22px 24px; font-size: 14px; letter-spacing: 0.08em; box-shadow: 0 18px 40px -18px rgba(138, 107, 48, 0.7); }
.btn-platform .ic { width: 24px; height: 24px; stroke-width: 1.5; }
.or-divider { display: flex; align-items: center; gap: 16px; margin: 28px 0; color: var(--ink); font-size: 16px; }
.or-divider::before, .or-divider::after { content: ''; flex: 1; height: 1px; background: var(--line); }
.panel-heading { font-family: var(--serif); font-size: 32px; font-weight: 600; margin: 0 0 22px; }
.booking-form .field { margin-bottom: 20px; }
.booking-form .field label, .booking-form .field-label { display: block; margin-bottom: 8px; font-size: 16px; font-weight: 400; letter-spacing: 0; text-transform: none; color: var(--ink); }
.booking-form .field input, .booking-form .field textarea { padding: 13px 14px; border: 1px solid rgba(28, 25, 23, 0.22); border-radius: 10px; background: var(--white); font-size: 16px; }
.booking-form .field input:focus, .booking-form .field textarea:focus { border-color: var(--ink); box-shadow: 0 0 0 3px rgba(196, 164, 106, 0.3); }
.booking-form .field textarea { min-height: 120px; }
.phone-row { display: grid; grid-template-columns: 30% 1fr; gap: 12px; }
.dates-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.dates-row input { min-width: 0; }
.booking-form .btn-block { margin-top: 6px; }
.booking-form .panel-total { margin: 10px 0 0; }

/* Every heading is weight 600, whatever the component sets. */
h1, h2, h3, h4, h5, h6, .acc-btn { font-weight: 600 !important; }

/* Booking.com-style guest score: number on a dark rounded square */
.score { display: inline-grid; place-items: center; min-width: 40px; height: 40px; padding: 0 8px; border-radius: 10px 10px 10px 2px; background: var(--ink); color: var(--white); font-family: var(--sans); font-size: 17px; font-weight: 600; line-height: 1; letter-spacing: 0; }
.score-sm { min-width: 30px; height: 30px; padding: 0 6px; border-radius: 8px 8px 8px 2px; font-size: 14px; }
.review-score { margin-bottom: 18px; }
.boutique-meta .score { margin-right: 4px; }
.block-title .score { margin-right: 14px; font-size: 20px; }
.hero-rating .score, .rating-line .score { margin-right: 4px; }
.hero-rating strong, .rating-line strong { font-family: var(--sans); font-size: 15px; font-weight: 600; color: inherit; }
.has-photo .score { background: var(--gold); color: var(--ink); }
