/* ==========================================================================
   LE ROITELET — feuille de style
   Polices auto-hébergées : aucun appel à Google Fonts, donc pas de rendu
   bloqué ni d’adresse IP de visiteur transmise à un tiers.
   ========================================================================== */

@font-face {
  font-family: "Cormorant Garamond"; font-style: normal; font-weight: 400 500; font-display: swap;
  src: url("fonts/cormorant-garamond-normal-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Cormorant Garamond"; font-style: normal; font-weight: 400 500; font-display: swap;
  src: url("fonts/cormorant-garamond-normal-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Cormorant Garamond"; font-style: italic; font-weight: 400; font-display: swap;
  src: url("fonts/cormorant-garamond-italic-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Cormorant Garamond"; font-style: italic; font-weight: 400; font-display: swap;
  src: url("fonts/cormorant-garamond-italic-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Manrope"; font-style: normal; font-weight: 400 600; font-display: swap;
  src: url("fonts/manrope-normal-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Manrope"; font-style: normal; font-weight: 400 600; font-display: swap;
  src: url("fonts/manrope-normal-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@view-transition { navigation: auto; }

:root {
  --black: #10110f;
  --black-2: #171915;
  --ivory: #f1ecdf;
  --paper: #f8f5ee;
  --champagne: #c7a46b;
  --champagne-light: #e2cda6;
  --oxblood: #3a171b;
  --muted: #6a675e;
  --line: rgba(199, 164, 107, .27);
  --serif: "Cormorant Garamond", Georgia, serif;
  --sans: "Manrope", Arial, sans-serif;
  --header-h: 108px;

  /* Échelle typographique. Le corps courant était à 11 px et les légendes à
     8 px : illisible de près comme de loin. Tout a été remonté d’un cran. */
  --fs-micro: 11px;   /* mentions, rangs de confiance, pied de page */
  --fs-label: 11px;   /* surtitres et liens en capitales */
  --fs-small: 13px;   /* légendes de cartes */
  --fs-body: 15px;    /* corps courant */
  --fs-body-l: 17px;  /* chapôs */

  /* Interlettrage réduit à mesure que le corps monte : au-delà de 11 px, un
     espacement de .2em casse le mot. */
  --ls-label: .16em;
  --ls-micro: .11em;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--black); background: var(--paper); font-family: var(--sans); font-size: var(--fs-body); overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
p { line-height: 1.7; }
img, picture, svg, video { max-width: 100%; }
em { color: var(--champagne); font-weight: 400; }
:focus-visible { outline: 2px solid var(--champagne); outline-offset: 3px; }

.skip-link {
  position: absolute; z-index: 300; left: 12px; top: -100px; padding: 14px 20px;
  color: var(--black); background: var(--champagne-light);
  font-size: var(--fs-label); font-weight: 600; letter-spacing: var(--ls-label); text-transform: uppercase;
  transition: top .2s ease;
}
.skip-link:focus { top: 12px; }

/* Marqueur de contenu à fournir. Aucun de ces blocs ne doit rester en ligne. */
.todo {
  position: relative; display: block; margin: 22px 0; padding: 15px 18px 15px 19px;
  color: #7d6c4d; background: rgba(199, 164, 107, .09);
  border: 1px dashed rgba(199, 164, 107, .6); border-left: 3px solid var(--champagne);
  font: 500 var(--fs-small)/1.6 var(--sans); text-transform: none;
}
.todo::before {
  content: "À confirmer"; display: block; margin-bottom: 5px;
  color: #8a6d3e; font-size: 10px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase;
}
/* Les marqueurs de rédaction restent accessibles avec ?edition=1,
   mais ne doivent jamais apparaître dans l’expérience client publique. */
html:not(.edition) .todo { display: none !important; }
.rooms-section .todo, .whole-house .todo, .direct-section .todo, .property-copy .todo {
  color: rgba(230, 213, 182, .9); background: rgba(199, 164, 107, .1);
}
.rooms-section .todo::before, .whole-house .todo::before,
.direct-section .todo::before, .property-copy .todo::before { color: var(--champagne-light); }
.location-card .todo { color: rgba(241, 236, 223, .9); background: rgba(255, 255, 255, .08); border-color: rgba(241, 236, 223, .5); }
.location-card .todo::before { color: var(--champagne-light); }

.page-noise {
  position: fixed; z-index: 100; inset: 0; pointer-events: none; opacity: .035;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E");
}
.scroll-progress { position: fixed; z-index: 150; left: 0; top: 0; width: 0; height: 2px; background: var(--champagne); pointer-events: none; }
.luxury-cursor {
  position: fixed; z-index: 160; left: 0; top: 0; width: 56px; height: 56px; display: grid; place-items: center; pointer-events: none;
  color: var(--ivory); background: rgba(16,17,15,.76); border: 1px solid rgba(226,205,166,.68); border-radius: 50%; opacity: 0;
  backdrop-filter: blur(8px); transform: translate(18px, 18px) scale(.88);
  transition: transform .25s cubic-bezier(.2,.8,.2,1), opacity .2s ease;
}
.luxury-cursor::before { content: ""; position: absolute; inset: 5px; border: 1px solid rgba(255,255,255,.14); border-radius: 50%; }
.luxury-cursor span { position: relative; font-size: 8px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.luxury-cursor.is-visible { opacity: 1; transform: translate(18px, 18px) scale(1); }

/* Apparitions : le décalage par rang est posé en ligne par le script
   (--i), et l’amplitude dépend du type de bloc plutôt que d’être uniforme. */
.has-js .reveal-item {
  opacity: 0; transform: translateY(30px);
  transition: opacity .85s ease, transform .95s cubic-bezier(.2,.7,.2,1);
  transition-delay: calc(var(--i, 0) * 90ms);
}
.has-js .reveal-item.reveal-soft { transform: translateY(16px); }
.has-js .reveal-item.reveal-title { transform: translateY(44px); transition-duration: 1.1s, 1.25s; }
.has-js .reveal-item.is-visible { opacity: 1; transform: none; }

/* ---------- Écran d’ouverture ----------
   Inspiré des ouvertures de maisons de luxe : une résille fine, un sceau
   centré, rien d’autre. Il n’apparaît qu’une fois par session, jamais sans
   JavaScript, jamais en mouvement réduit, et s’efface au plus tard au bout
   d’une seconde et demie. */
.splash {
  position: fixed; z-index: 500; inset: 0; height: 100vh; height: 100dvh; display: none;
  place-items: center; background: var(--black); color: var(--ivory);
}
.splash-open .splash { display: grid; }
.splash-open body { overflow: hidden; }
.splash::before {
  content: ""; position: absolute; inset: 0; opacity: .9;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='300' viewBox='0 0 400 300'%3E%3Cpath d='M0 34H400M0 64H400M0 94H400M150 112H270M0 134H400M0 168H400M0 190H300M40 212H220M90 246H270M0 280H400M22 8v34M56 155v46M90 152v26M112 189v46M140 251v34M168 248v18M196 174v26M238 125v34M280 251v26M308 215v34M336 183v18M364 68v18' stroke='%23c7a46b' stroke-opacity='.55' stroke-width='1' fill='none'/%3E%3C/svg%3E");
  -webkit-mask-image: radial-gradient(ellipse 58% 46% at 50% 50%, transparent 38%, #000 78%);
  mask-image: radial-gradient(ellipse 58% 46% at 50% 50%, transparent 38%, #000 78%);
}
.splash-mark { position: relative; display: grid; justify-items: center; animation: splashIn .7s cubic-bezier(.2,.7,.2,1) both; }
.splash-seal {
  width: 74px; height: 74px; display: grid; place-items: center; margin-bottom: 26px;
  border: 1px solid var(--champagne); border-radius: 50%;
  color: var(--champagne-light); font: 400 22px/1 var(--serif); letter-spacing: .1em;
}
.splash-word { font: 400 clamp(38px, 5vw, 62px)/1 var(--serif); letter-spacing: .02em; }
.splash-sub { margin-top: 16px; color: rgba(226,205,166,.72); font-size: 10px; letter-spacing: .32em; text-transform: uppercase; }
.splash-bar { position: relative; width: 132px; height: 1px; margin-top: 42px; background: rgba(241,236,223,.2); overflow: hidden; }
.splash-bar i { display: block; width: 100%; height: 100%; background: var(--champagne); transform: scaleX(0); transform-origin: left; animation: splashBar 1.35s cubic-bezier(.5,0,.2,1) both; }
/* Sortie : le panneau se lève de bas en haut et découvre le hero. Le sceau
   s’efface juste avant, sinon il monte avec le rideau et brouille le geste. */
.splash { will-change: transform; transition: transform .95s cubic-bezier(.76,0,.24,1); }
.splash::after {
  content: ""; position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; height: 1px; opacity: 0;
  background: linear-gradient(90deg, transparent, var(--champagne) 20%, var(--champagne-light) 50%, var(--champagne) 80%, transparent);
  transition: opacity .25s ease;
}
.splash.is-done { transform: translateY(-100%); pointer-events: none; }
.splash.is-done::after { opacity: 1; }
.splash.is-done .splash-mark { opacity: 0; transform: translateY(-22px); transition: opacity .38s ease, transform .5s cubic-bezier(.4,0,.2,1); }

@keyframes splashIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes splashBar { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* ---------- En-tête ---------- */
.site-header {
  position: absolute; z-index: 20; top: 0; left: 0; width: 100%; min-height: var(--header-h);
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 4vw;
  color: var(--ivory); border-bottom: 1px solid rgba(241,236,223,.22);
}
.site-header nav { grid-column: 2; display: flex; gap: 34px; font-size: var(--fs-label); letter-spacing: var(--ls-label); text-transform: uppercase; }
.site-header nav .nav-cta { display: none; }
.site-header .header-cta { grid-column: 3; justify-self: end; }
.site-header nav a, .text-link { transition: color .25s ease, opacity .25s ease; }
.site-header nav a:hover, .text-link:hover { color: var(--champagne-light); }
.header-solid { position: relative; color: var(--black); background: var(--paper); border-bottom-color: rgba(16,17,15,.12); }
.nav-toggle { display: none; }
.brand { display: inline-flex; align-items: center; gap: 14px; width: max-content; }
.brand-mark {
  flex: none; width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid currentColor;
  border-radius: 50%; font: 500 16px/1 var(--serif); letter-spacing: .08em;
}
.brand strong { display: block; font: 500 23px/1 var(--serif); letter-spacing: .03em; }
.brand small { display: block; margin-top: 6px; font-size: 10px; letter-spacing: .2em; text-transform: uppercase; }

.button {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  min-height: 56px; padding: 0 30px; color: var(--ivory); background: var(--black);
  border: 1px solid var(--black); font-size: 12px; font-weight: 600; letter-spacing: var(--ls-label);
  text-transform: uppercase; transition: color .3s ease, background .3s ease, border .3s ease;
}
.button:hover { color: var(--black); background: transparent; }
.button-small { min-height: 47px; padding: 0 24px; color: var(--ivory); background: transparent; border-color: rgba(241,236,223,.72); }
.button-small:hover { color: var(--black); background: var(--ivory); border-color: var(--ivory); }
.button-light { color: var(--black); background: var(--ivory); border-color: var(--ivory); }
.button-light:hover { color: var(--ivory); border-color: var(--ivory); }
.button-gold { color: var(--black); background: var(--champagne); border-color: var(--champagne); }
.button-gold:hover { color: var(--champagne-light); border-color: var(--champagne); }
.text-link { padding-bottom: 9px; border-bottom: 1px solid var(--champagne); font-size: var(--fs-label); font-weight: 600; letter-spacing: var(--ls-label); text-transform: uppercase; }
.text-link.light { color: var(--champagne-light); }
.text-link span { margin-left: 14px; }

/* ---------- Hero ---------- */
.hero {
  position: relative; z-index: 2; min-height: 100svh; display: flex; flex-direction: column;
  justify-content: flex-end; padding: calc(var(--header-h) + 24px) 0 0; overflow: hidden; background: var(--black);
}
.hero-media { position: absolute; z-index: 0; inset: 0; overflow: hidden; }
.hero-image {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 46%;
  transform: scale(1.025); animation: heroReveal 1.8s cubic-bezier(.2,.7,.2,1) both;
}
.hero-shade {
  position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(10,12,10,.78) 0%, rgba(10,12,10,.22) 55%, rgba(10,12,10,.36)),
              linear-gradient(0deg, rgba(8,10,8,.74), transparent 55%);
}
.hero::after { content: ""; position: absolute; inset: 22px; border: 1px solid rgba(241,236,223,.18); pointer-events: none; }
.hero-monogram {
  position: absolute; z-index: 1; right: -2vw; bottom: -14vh; color: rgba(241,236,223,.08);
  font: 400 clamp(340px, 44vw, 690px)/.7 var(--serif);
}
.hero-index {
  position: absolute; z-index: 3; right: 4vw; top: calc(var(--header-h) + 26px); margin: 0;
  color: rgba(255,255,255,.7); font-size: 10px; letter-spacing: .22em; text-transform: uppercase;
}
.hero-inner { position: relative; z-index: 3; display: flex; flex-direction: column; gap: clamp(26px, 4.5vh, 56px); }
.hero-content { width: min(760px, 74vw); margin: 0 0 0 7vw; color: var(--ivory); }
.review-pill {
  width: max-content; max-width: min(100%, 460px); display: flex; align-items: center; gap: 12px;
  margin-bottom: 26px; padding: 9px 15px 9px 10px;
  color: var(--ivory); background: rgba(16,17,15,.5); border: 1px solid rgba(226,205,166,.4); backdrop-filter: blur(12px);
}
.review-pill strong { flex: none; padding: 5px 10px; color: var(--black); background: var(--champagne-light); font: 500 15px var(--serif); }
.review-pill span { font-size: var(--fs-micro); letter-spacing: var(--ls-micro); text-transform: uppercase; }
.eyebrow { margin: 0 0 22px; color: #7a5f37; font-size: var(--fs-label); font-weight: 600; letter-spacing: .22em; text-transform: uppercase; }
.eyebrow.light { color: var(--champagne-light); }
.hero h1, .search-hero h1 { margin: 0; font: 400 clamp(62px, 7.6vw, 118px)/.78 var(--serif); letter-spacing: -.045em; }
.hero h1 em { display: inline-block; margin-left: .75em; }
.hero-lead { max-width: 490px; margin: 30px 0 0 7px; color: rgba(241,236,223,.88); font-size: var(--fs-body-l); line-height: 1.6; }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 30px; margin: 32px 0 0 7px; }
.ghost-link { padding-bottom: 8px; border-bottom: 1px solid rgba(241,236,223,.5); font-size: var(--fs-label); letter-spacing: var(--ls-label); text-transform: uppercase; }
.ghost-link span { margin-left: 16px; color: var(--champagne-light); }
.scroll-cue {
  position: absolute; z-index: 4; left: 7vw; bottom: 0; display: flex; align-items: center; gap: 14px;
  color: rgba(241,236,223,.7); font-size: 10px; letter-spacing: .2em; text-transform: uppercase;
}
.scroll-cue i { display: block; width: 44px; height: 1px; background: rgba(241,236,223,.4); overflow: hidden; }
.scroll-cue i::after { content: ""; display: block; width: 14px; height: 1px; background: var(--champagne-light); animation: cueSlide 2.4s cubic-bezier(.5,0,.5,1) infinite; }

/* ---------- Module de réservation ----------
   Le composant Hospitable impose une largeur de 100 % de la fenêtre à son
   contenu interne (mesuré : 0 → 1440 px). Toute carte plus étroite était donc
   débordée des deux côtés et le bouton de recherche rogné. Le bandeau prend
   désormais la pleine largeur ; seuls l’intitulé et les gages restent alignés
   sur la grille du site. */
.booking-shell {
  position: relative; z-index: 5; width: 100%; padding: 24px 0 18px;
  background: rgba(248,245,238,.97); border-top: 1px solid rgba(226,205,166,.5);
  box-shadow: 0 -18px 60px rgba(0,0,0,.3); backdrop-filter: blur(18px);
}
.booking-intro, .trust-row { width: min(1240px, 92vw); margin-inline: auto; }
.booking-intro { display: grid; grid-template-columns: auto 1fr auto; align-items: end; gap: 30px; margin-bottom: 16px; }
.booking-intro .eyebrow { align-self: center; margin-bottom: 0; }
.booking-intro h2 { margin: 0; font: 400 clamp(30px, 2.7vw, 42px)/.98 var(--serif); }
.booking-intro > p:last-child { margin: 0 0 4px; color: var(--muted); font-size: var(--fs-small); text-align: right; }
.widget-frame { min-height: 84px; padding: 10px 0; }
.widget-frame hospitable-direct-mps, .property-fallback hospitable-direct-mps, .search-results hospitable-direct-mps {
  display: block; width: 100%; max-width: 100%; accent-color: var(--black);
  --primary-color: #10110f; --primary: #10110f; --accent-color: #c7a46b;
}
hospitable-direct-mps {
  --hospitable-primary-color: #10110f;
  --hospitable-secondary-color: #c7a46b;
  --hospitable-main-font: "Manrope", Arial, sans-serif;
}
.trust-row { display: flex; flex-wrap: wrap; gap: 12px 34px; margin-top: 14px; color: #5a554b; font-size: var(--fs-micro); letter-spacing: var(--ls-micro); text-transform: uppercase; }

/* ---------- Bandeau de preuve ---------- */
.proof-strip {
  position: relative; z-index: 1; isolation: isolate; width: min(1240px, 92vw); margin: 85px auto 0; padding: 10px;
  display: grid; grid-template-columns: 1.3fr repeat(4, 1fr); overflow: hidden;
  color: var(--ivory); background: #12130f; border: 1px solid rgba(199,164,107,.28);
  box-shadow: 0 28px 80px rgba(16,17,15,.12);
}
.proof-strip::before {
  content: ""; position: absolute; z-index: -1; width: 340px; height: 340px; left: -170px; top: -200px;
  border: 1px solid rgba(199,164,107,.2); border-radius: 50%; box-shadow: 0 0 90px rgba(199,164,107,.08);
}
.proof-strip > div { min-width: 0; }
.proof-signature { padding: 28px 30px; border-right: 1px solid rgba(255,255,255,.1); }
.proof-signature > span, .proof-index { color: var(--champagne); font-size: 10px; letter-spacing: .18em; text-transform: uppercase; }
.proof-signature p { margin: 16px 0 0; font: 400 27px/1.05 var(--serif); letter-spacing: -.02em; }
.proof-signature p em, .proof-item strong em { color: var(--champagne); font-weight: 400; }
.proof-item {
  position: relative; display: flex; min-height: 132px; padding: 24px 20px 22px; flex-direction: column;
  justify-content: flex-end; border-right: 1px solid rgba(255,255,255,.1);
}
.proof-item:last-child { border-right: 0; }
.proof-index { position: absolute; top: 18px; right: 18px; color: rgba(199,164,107,.6); }
.proof-item strong { color: var(--ivory); font: 400 40px/1 var(--serif); white-space: nowrap; }
.proof-item strong em { margin-left: 3px; font-size: .42em; font-style: italic; }
.proof-item > span:last-child { max-width: 180px; margin-top: 12px; color: rgba(244,239,227,.72); font-size: 10px; line-height: 1.55; letter-spacing: var(--ls-micro); text-transform: uppercase; }

/* ---------- Récit ---------- */
.section-grid { width: min(1180px, 84vw); margin: 0 auto; display: grid; grid-template-columns: 1.1fr .9fr; gap: 11vw; }
.story { position: relative; padding: 175px 0 150px; }
.story::before { content: "XII"; position: absolute; z-index: -1; left: -3vw; top: 55px; color: rgba(199,164,107,.09); font: 400 230px/1 var(--serif); }
.story h2, .section-heading h2, .location h2, .closing h2 {
  margin: 0; font: 400 clamp(46px, 5.2vw, 78px)/.95 var(--serif); letter-spacing: -.035em;
}
.story-copy { padding-top: 42px; color: #5f5c54; font-size: var(--fs-body); }
.story-copy p:first-child { margin-top: 0; color: var(--black); font: 400 25px/1.5 var(--serif); }
.host-artist-card {
  display: grid; grid-template-columns: 124px minmax(0, 1fr); column-gap: 20px; margin-top: 44px; padding: 25px 28px 27px;
  color: #5f5c54; background: linear-gradient(145deg, rgba(199,164,107,.12), rgba(255,255,255,.38));
  border: 1px solid rgba(122,95,55,.24); border-left: 3px solid var(--champagne);
  transition: color .2s ease, border-color .2s ease, transform .2s ease, background .2s ease;
}
.host-artist-card:hover, .host-artist-card:focus-visible {
  color: var(--black); background: linear-gradient(145deg, rgba(199,164,107,.18), rgba(255,255,255,.56));
  border-color: rgba(122,95,55,.5); transform: translateY(-2px);
}
.host-artist-card:focus-visible { outline: 2px solid var(--champagne); outline-offset: 4px; }
.host-artist-media { grid-row: 1; min-height: 170px; overflow: hidden; background: var(--black-2); }
.host-artist-video { display: block; width: 100%; height: 100%; min-height: 170px; object-fit: cover; object-position: 34% center; filter: saturate(.86) contrast(.96); }
.host-artist-content { display: grid; align-content: start; gap: 11px; min-width: 0; }
.host-artist-kicker { color: #7a5f37; font-size: 10px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; }
.host-artist-title { color: var(--black); font: 400 clamp(30px, 3.1vw, 42px)/.95 var(--serif); letter-spacing: -.025em; }
.host-artist-title em { display: block; color: var(--champagne); font-style: italic; }
.host-artist-copy { max-width: 42ch; font-size: 14px; line-height: 1.65; }
.host-artist-cta { padding-top: 3px; color: #7a5f37; font-size: 11px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.host-artist-cta span { display: inline-block; transition: transform .2s ease; }
.host-artist-card:hover .host-artist-cta span, .host-artist-card:focus-visible .host-artist-cta span { transform: translate(3px, -2px); }
.story-signature { display: block; margin-top: 44px; padding-top: 17px; border-top: 1px solid rgba(16,17,15,.14); color: #7a5f37; font: italic 21px var(--serif); }

/* ---------- Les quatre clés ---------- */
.rooms-section { padding: 135px 0 150px; color: var(--ivory); background: var(--black); }
.section-heading { width: min(1220px, 90vw); margin: 0 auto 72px; display: flex; align-items: end; justify-content: space-between; gap: 40px; }
.rooms-heading > p { max-width: 380px; margin: 0 0 8px; color: rgba(241,236,223,.66); font-size: var(--fs-small); }
.rooms-grid { width: min(1220px, 90vw); margin: 0 auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 80px 26px; }
.room-card { min-width: 0; border-top: 1px solid rgba(199,164,107,.25); }
.room-card:nth-child(even) { transform: translateY(72px); }
.room-image { position: relative; display: block; height: 560px; overflow: hidden; background: #272923; }
.room-image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(10,10,9,.3), transparent 45%); }
.room-image picture { display: block; height: 100%; }
.room-image img { display: block; width: 100%; height: 100%; object-fit: cover; filter: saturate(.78) contrast(1.02); transition: transform .9s cubic-bezier(.2,.7,.2,1), filter .5s ease; }
.room-card:hover .room-image img { transform: scale(1.035); filter: saturate(1); }
.room-number { position: absolute; z-index: 2; right: 22px; top: 18px; color: var(--ivory); font: 400 33px var(--serif); }
/* Une seule colonne : le nom, la phrase, la fiche et le lien se lisent en
   descendant, au lieu d’un nom isolé face à une colonne droite surchargée. */
.room-copy { padding: 26px 4px 0; }
.room-copy .eyebrow { margin-bottom: 8px; color: var(--champagne-light); }
.room-copy h3 { margin: 0; font: 400 40px var(--serif); }
.room-copy h3 a { transition: color .25s ease; }
.room-card:hover h3 a { color: var(--champagne-light); }
.room-copy > p { margin: 14px 0 0; max-width: 46ch; color: rgba(241,236,223,.66); font-size: var(--fs-small); }
.room-copy > p.room-specs { margin-top: 18px; }
.room-link { display: inline-block; margin-top: 22px; padding-bottom: 8px; border-bottom: 1px solid var(--champagne); color: var(--champagne-light); font-size: var(--fs-label); letter-spacing: var(--ls-label); text-transform: uppercase; }
.room-link span { margin-left: 18px; }

.whole-house {
  width: min(1220px, 90vw); margin: 160px auto 0; padding: 56px 58px;
  display: grid; grid-template-columns: 1.1fr .9fr; gap: 50px; align-items: center;
  border: 1px solid rgba(199,164,107,.28);
  background: radial-gradient(circle at 88% 12%, rgba(199,164,107,.16), transparent 34%), #12130f;
}
.whole-house h3 { margin: 0 0 16px; font: 400 clamp(36px, 3.6vw, 54px)/.94 var(--serif); }
.whole-house p { margin: 0; color: rgba(241,236,223,.68); font-size: var(--fs-small); }
.whole-house-side { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }

/* ---------- Fiche et tarif d’appel des clés ---------- */
.room-copy > p.room-specs { margin-top: 16px; color: rgba(241,236,223,.6); }
.room-from { margin: 14px 0 0; color: rgba(241,236,223,.6); font-size: var(--fs-small); }
.room-from strong { margin-left: 6px; color: var(--champagne-light); font: 400 26px/1 var(--serif); font-variant-numeric: oldstyle-nums; }
.property-copy > p.property-specs { max-width: 46ch; margin: 22px 0 0; color: rgba(241,236,223,.82); font-size: var(--fs-small); }
.property-copy > p.property-rates {
  max-width: 46ch; margin: 26px 0 0; padding-top: 18px;
  border-top: 1px solid rgba(199,164,107,.4);
  color: rgba(241,236,223,.7); font-size: var(--fs-small);
}
.property-copy > p.property-from {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px;
  max-width: none; margin: 26px 0 0; padding-top: 18px;
  border-top: 1px solid rgba(199,164,107,.4);
  color: rgba(241,236,223,.66); font-size: 10px; letter-spacing: .18em; text-transform: uppercase;
}
.property-from strong { color: var(--ivory); font: 400 40px/1 var(--serif); font-variant-numeric: oldstyle-nums; letter-spacing: -.01em; text-transform: none; }
.direct-price { color: rgba(241,236,223,.72); font-size: var(--fs-small); letter-spacing: .04em; }
.direct-price strong { color: var(--champagne-light); font: 400 44px/1 var(--serif); font-variant-numeric: oldstyle-nums; }
/* Huit équipements dans une colonne étroite : on resserre pour tenir en trois rangs. */
.property-meta { gap: 7px; }
.property-meta span { padding: 8px 11px; font-size: 9px; letter-spacing: .11em; }

.property-kit { width: min(1180px, 88vw); margin: 0 auto; padding: 100px 0 0; display: grid; grid-template-columns: .8fr 1.2fr; gap: 60px; }
.property-kit h2 { margin: 0 0 10px; font: 400 clamp(30px,3vw,42px)/1 var(--serif); letter-spacing: -.02em; }
.property-kit > div p { margin: 0; color: var(--muted); font-size: var(--fs-small); }
.property-kit ul { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 0 40px; }
.property-kit li { padding: 15px 0; border-bottom: 1px solid rgba(16,17,15,.14); color: #4f4c45; font-size: var(--fs-small); }

/* ---------- Film ----------
   La section est une piste de défilement : le cadre se fige au centre et
   s’élargit à mesure qu’on descend, il arrive de loin. La lecture reste
   classique. Sans JavaScript ou en mouvement réduit, tout retombe sur un
   lecteur posé dans le flux. */
.film-section { position: relative; padding: 130px 0 0; color: var(--ivory); background: #20221e; }
.film-heading { position: relative; z-index: 2; width: min(1280px, 90vw); margin: 0 auto 48px; display: flex; align-items: end; justify-content: space-between; gap: 30px; }
.film-heading h2 { margin: 0; font: 400 clamp(55px, 7vw, 96px)/.82 var(--serif); }
.film-track { position: relative; padding-bottom: 115px; }
.film-sticky { display: grid; place-items: center; }
.film-frame {
  position: relative; width: min(1440px, 100%); aspect-ratio: 16/9; overflow: hidden;
  background: var(--black); border-top: 1px solid rgba(199,164,107,.28); border-bottom: 1px solid rgba(199,164,107,.28);
}
.has-js .film-track { height: 260vh; padding-bottom: 0; }
.has-js .film-sticky { position: sticky; top: 0; height: 100svh; }
.has-js .film-frame {
  width: calc((44 + 56 * var(--p, 0)) * 1%);
  max-width: min(1440px, 100%);
  transform: translateY(calc((1 - var(--p, 0)) * -1.5vh));
  box-shadow: 0 calc(40px * (1 - var(--p, 0))) calc(90px * (1 - var(--p, 0))) rgba(0,0,0,.45);
  transition: none;
}
.film-frame::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(0deg, rgba(8,9,8,.34), transparent 34%); }
.film-frame video { display: block; width: 100%; height: 100%; object-fit: cover; }
.film-controls { position: absolute; z-index: 3; right: 28px; bottom: 24px; display: flex; gap: 8px; }
.film-controls button {
  min-height: 46px; padding: 0 19px; color: var(--ivory); background: rgba(16,17,15,.66);
  border: 1px solid rgba(241,236,223,.46); backdrop-filter: blur(12px); cursor: pointer;
  font: 600 11px var(--sans); letter-spacing: var(--ls-label); text-transform: uppercase;
}
.film-controls button:hover, .film-controls button:focus-visible { color: var(--black); background: var(--champagne-light); border-color: var(--champagne-light); }
.sensory-lead { width: min(1180px, 100%); margin: 0 auto 70px; display: grid; grid-template-columns: 1fr 1fr; gap: 0 40px; }
.sensory-lead .eyebrow { grid-column: 1 / -1; }
.sensory-lead h2 { margin: 0; font: 400 clamp(48px, 5.6vw, 78px)/.92 var(--serif); }
.sensory-lead > p:last-child { max-width: 400px; align-self: end; margin: 0; color: #5f5c54; font-size: var(--fs-body); }
.sensory-grid { width: min(1180px, 100%); margin: 0 auto; display: grid; grid-template-columns: 1.2fr .8fr; grid-template-rows: 1fr 1fr; gap: 22px; }
.sensory-card { position: relative; min-height: 360px; overflow: hidden; background: var(--black); }
.sensory-card.sensory-wide { grid-row: 1 / 3; min-height: 742px; }
.sensory-card picture { display: block; position: absolute; inset: 0; }
.sensory-card img { width: 100%; height: 100%; display: block; object-fit: cover; filter: saturate(.82) brightness(.86); transition: transform .8s ease, filter .5s ease; }
.sensory-card.sensory-portrait img { object-position: center 58%; }
.sensory-card::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(0deg, rgba(9,10,8,.9) 0%, rgba(9,10,8,.58) 28%, rgba(9,10,8,.1) 54%, rgba(9,10,8,.28) 100%);
}
.sensory-card:hover img { transform: scale(1.03); filter: saturate(1) brightness(.78); }
.sensory-card > div { position: absolute; z-index: 2; left: 32px; right: 32px; bottom: 27px; color: white; }
.sensory-card span { color: var(--champagne-light); font-size: 10px; letter-spacing: .18em; }
.sensory-card h3 { margin: 6px 0 0; font: 400 37px var(--serif); }
.sensory-card p { max-width: 420px; margin: 8px 0 0; color: rgba(255,255,255,.82); font-size: var(--fs-small); }

.included-card {
  position: relative; overflow: hidden; width: min(1180px, 100%); margin: 22px auto 0;
  display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; color: var(--ivory);
  background: radial-gradient(circle at 84% 15%, rgba(199,164,107,.19), transparent 30%), linear-gradient(135deg, #171814, #261d18);
  border: 1px solid rgba(199,164,107,.24);
}
.included-card::after {
  content: "R"; position: absolute; right: -16px; bottom: -118px; color: rgba(199,164,107,.065);
  font: 400 330px/.8 var(--serif); pointer-events: none;
}
.included-card > div { position: relative; z-index: 1; padding: 56px 58px; border-right: 1px solid rgba(241,236,223,.13); }
.included-card span { color: var(--champagne-light); font-size: 10px; letter-spacing: .18em; text-transform: uppercase; }
.included-card h3 { margin: 20px 0 14px; font: 400 clamp(38px, 4vw, 58px)/.92 var(--serif); }
.included-card p { max-width: 540px; margin: 0; color: rgba(241,236,223,.68); font-size: var(--fs-small); }
.included-list { position: relative; z-index: 1; margin: 0; padding: 34px 54px; list-style: none; }
.included-list li { display: grid; gap: 5px; padding: 20px 0; border-bottom: 1px solid rgba(241,236,223,.14); }
.included-list li:last-child { border-bottom: 0; }
.included-list strong { font: 400 27px/1 var(--serif); }
.included-list span { color: rgba(241,236,223,.62); font-size: var(--fs-small); letter-spacing: 0; text-transform: none; }

/* ---------- Réserver en direct + engagements ---------- */
.direct-section { display: grid; grid-template-columns: .9fr 1.1fr; min-height: 680px; color: var(--ivory); background: linear-gradient(135deg, #2a201b, var(--oxblood)); }
.direct-section > div:first-child { position: relative; overflow: hidden; padding: 125px 8vw; background: var(--black-2); }
.direct-section > div:first-child::after { content: "R"; position: absolute; right: -25px; bottom: -125px; color: rgba(199,164,107,.08); font: 400 430px/.8 var(--serif); }
.direct-section h2 { margin: 0; position: relative; z-index: 1; font: 400 clamp(50px, 5.5vw, 80px)/.9 var(--serif); }
.direct-price { position: relative; z-index: 1; max-width: 340px; }
.direct-list { padding: 80px 7vw; }
.direct-list > div { display: grid; grid-template-columns: 68px 1fr; padding: 32px 0; border-bottom: 1px solid rgba(241,236,223,.15); }
.direct-list span { color: var(--champagne-light); font-size: 10px; letter-spacing: .16em; }
.direct-list strong { font: 400 30px var(--serif); }
.direct-list p { grid-column: 2; margin: 8px 0 0; color: rgba(241,236,223,.66); font-size: var(--fs-small); }

.pledge-band { padding: 110px 6vw; color: var(--ivory); background: var(--black); }
.pledge-inner { width: min(1180px, 100%); margin: 0 auto; }
.pledge-inner h2 { margin: 0 0 14px; font: 400 clamp(40px, 4.4vw, 64px)/.94 var(--serif); letter-spacing: -.03em; }
.pledge-inner > p { max-width: 520px; margin: 0 0 52px; color: rgba(241,236,223,.66); font-size: var(--fs-small); }
.pledge-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; }
.pledge-grid article { padding: 34px 30px; border: 1px solid rgba(199,164,107,.26); background: rgba(199,164,107,.05); }
.pledge-grid span { color: var(--champagne); font-size: 10px; letter-spacing: .2em; text-transform: uppercase; }
.pledge-grid h3 { margin: 14px 0 10px; font: 400 27px/1.15 var(--serif); }
.pledge-grid p { margin: 0; color: rgba(241,236,223,.66); font-size: var(--fs-small); }

.gift-band {
  width: min(1180px, 92vw); margin: 0 auto; padding: 52px 56px;
  display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 40px;
  color: var(--black); background: var(--champagne-light); border: 1px solid rgba(16,17,15,.12);
}
.gift-band .eyebrow { color: #6b5122; }
.gift-band h2 { margin: 0 0 10px; font: 400 clamp(34px, 3.4vw, 50px)/.96 var(--serif); letter-spacing: -.02em; }
.gift-band p { max-width: 520px; margin: 0; color: #4a4335; font-size: var(--fs-small); }
.gift-band .todo { color: #5c4a24; background: rgba(16,17,15,.06); border-color: rgba(16,17,15,.35); border-left-color: #6b5122; }
.gift-band .todo::before { color: #6b5122; }

/* ---------- Autour du Roitelet ---------- */
.experiences-section { padding: 145px 6vw 155px; background: var(--paper); }
.experience-heading { width: min(1180px, 100%); }
.experience-heading > p { max-width: 420px; margin: 0; color: #5f5c54; font-size: var(--fs-body); }
.escape-gallery {
  width: min(1180px, 100%); margin: 74px auto 92px; display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: 480px; gap: 22px;
}
.escape-card { position: relative; overflow: hidden; color: var(--ivory); background: #20221d; }
.escape-card:nth-child(1), .escape-card:nth-child(4) { grid-column: span 7; }
.escape-card:nth-child(2), .escape-card:nth-child(3) { grid-column: span 5; }
.escape-card picture { position: absolute; inset: 0; display: block; }
.escape-card img {
  width: 100%; height: 100%; display: block; object-fit: cover; filter: saturate(.88) contrast(1.02);
  transition: transform .9s cubic-bezier(.2,.7,.2,1), filter .5s ease;
}
.escape-card:hover img { transform: scale(1.035); filter: saturate(1); }
.escape-card::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(10,11,9,.58), rgba(10,11,9,.12) 26%, transparent 42%, rgba(10,11,9,.86));
}
.escape-meta {
  position: absolute; z-index: 2; left: 26px; right: 26px; top: 24px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  color: rgba(255,255,255,.92); font-size: 10px; letter-spacing: .16em; text-transform: uppercase;
}
.escape-meta span { color: var(--champagne-light); }
.escape-meta strong { padding: 10px 13px; background: rgba(16,17,15,.42); border: 1px solid rgba(241,236,223,.34); backdrop-filter: blur(10px); font-weight: 500; }
.escape-copy { position: absolute; z-index: 2; left: 30px; right: 30px; bottom: 28px; }
.escape-copy h3 { margin: 0; font: 400 clamp(32px, 3.1vw, 48px)/.94 var(--serif); }
.escape-copy p { max-width: 460px; margin: 10px 0 0; color: rgba(255,255,255,.84); font-size: var(--fs-small); }

.experiences-list { width: min(1180px, 100%); margin: 0 auto; border-top: 1px solid rgba(16,17,15,.15); }
.experiences-list > * {
  position: relative; display: grid; grid-template-columns: 70px 165px 1fr 1.2fr 34px; align-items: center; gap: 22px;
  padding: 34px 0; border-bottom: 1px solid rgba(16,17,15,.15); transition: padding .25s ease, background .25s ease;
}
.experiences-list a:hover { padding-left: 15px; background: rgba(199,164,107,.07); }
.experiences-list > * > span, .experiences-list small { color: #7a5f37; font-size: 10px; letter-spacing: .16em; text-transform: uppercase; }
.experiences-list h3 { margin: 0; font: 400 32px var(--serif); }
.experiences-list p { margin: 0; color: #5f5c54; font-size: var(--fs-small); }
.experiences-list b { color: var(--champagne); font-size: 18px; text-align: right; font-weight: 400; }
/* Les entrées sans lien externe reçoivent le même repère que les autres, pour
   ne pas laisser une colonne vide au milieu de la liste. */
.experiences-list .escape-row b { color: rgba(199,164,107,.5); font-size: 13px; }

/* ---------- Carnet ---------- */
.journal-section { padding: 140px 6vw; background: var(--ivory); }
.journal-grid { width: min(1180px, 100%); margin: 0 auto; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; }
.journal-grid article { display: flex; flex-direction: column; padding-top: 26px; border-top: 1px solid rgba(16,17,15,.16); }
.journal-grid span { color: #7a5f37; font-size: 10px; letter-spacing: .18em; text-transform: uppercase; }
.journal-grid h3 { margin: 14px 0 10px; font: 400 30px/1.1 var(--serif); }
.journal-grid p { margin: 0; color: #5f5c54; font-size: var(--fs-small); }

/* ---------- Options : bandeau de l’accueil ---------- */
.options-band { padding: 130px 6vw; color: var(--ivory); background: linear-gradient(135deg, #1a1611, #241b16); }
.options-inner { width: min(1180px, 100%); margin: 0 auto; }
.options-lead { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 40px; margin-bottom: 56px; }
.options-lead h2 { margin: 0; font: 400 clamp(40px, 4.4vw, 66px)/.94 var(--serif); letter-spacing: -.03em; }
.options-lead > p { max-width: 400px; margin: 0 0 6px; color: rgba(241,236,223,.68); font-size: var(--fs-small); }
.options-lead .text-link { grid-column: 1; justify-self: start; width: max-content; margin-top: 26px; white-space: nowrap; }
.options-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px 26px; }
.option-card figure { margin: 0 0 18px; aspect-ratio: 4/3; overflow: hidden; background: #16130f; }
.option-card img {
  width: 100%; height: 100%; display: block; object-fit: cover; filter: saturate(.86) brightness(.94);
  transition: transform .8s cubic-bezier(.2,.7,.2,1), filter .5s ease;
}
.option-card:hover img { transform: scale(1.045); filter: saturate(1) brightness(1); }
.option-card .line {
  display: flex; align-items: baseline; justify-content: space-between; gap: 16px;
  padding-bottom: 11px; border-bottom: 1px solid rgba(241,236,223,.18);
}
.option-card h3 { margin: 0; font: 400 27px/1 var(--serif); }
.option-card .price { color: var(--champagne-light); font: 400 25px/1 var(--serif); font-variant-numeric: oldstyle-nums; white-space: nowrap; }
.option-card .unit { display: block; margin-top: 10px; color: rgba(241,236,223,.6); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; }

/* Transition de vue : l’emblème de la carte d’accueil se déplie vers la carte. */
.option-card[href$="#parking"] figure, #parking .opt-emblem { view-transition-name: vt-parking; }
.option-card[href$="#petit-dejeuner-express"] figure, #petit-dejeuner-express .opt-emblem { view-transition-name: vt-express; }
.option-card[href$="#petit-dejeuner-royal"] figure, #petit-dejeuner-royal .opt-emblem { view-transition-name: vt-royal; }
.option-card[href$="#depart-tardif"] figure, #depart-tardif .opt-emblem { view-transition-name: vt-tardif; }
.option-card[href$="#arrivee-precoce"] figure, #arrivee-precoce .opt-emblem { view-transition-name: vt-precoce; }
.option-card[href$="#animal"] figure, #animal .opt-emblem { view-transition-name: vt-animal; }

/* ==========================================================================
   LA CARTE — page des options
   Fond noir, emblèmes sur leur fond natif, une option par écran, index
   collant. Les marqueurs de relecture ne s’affichent qu’en mode édition.
   ========================================================================== */
body.carte-page { background: var(--black); }
.carte { position: relative; color: var(--ivory); background: var(--black); }
.carte .site-header { color: var(--ivory); border-bottom-color: rgba(241,236,223,.18); }
.carte::before {
  content: ""; position: fixed; z-index: 0; inset: 0; pointer-events: none; opacity: .06;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E");
}
/* Halo qui suit le pointeur, très faible : la page respire sans clignoter. */
.carte-halo {
  /* Dégradé ancré par variables : aucune boîte ne dépasse, donc aucun
     débordement horizontal possible. */
  position: fixed; z-index: 1; inset: 0; pointer-events: none; opacity: 0; transition: opacity .6s ease;
  background: radial-gradient(380px circle at var(--mx, 50%) var(--my, 50%), rgba(199,164,107,.11), transparent 70%);
}
.carte.is-live .carte-halo { opacity: 1; }
.carte > * { position: relative; z-index: 2; }

/* ---- Couverture ---- */
.carte-cover { position: relative; min-height: 100svh; display: grid; place-items: center; overflow: hidden; text-align: center; }
.carte-cover picture { position: absolute; inset: 0; }
.carte-cover img { width: 100%; height: 100%; display: block; object-fit: cover; filter: saturate(.72) brightness(.5); transform: scale(1.06); }
.carte-cover::after {
  content: ""; position: absolute; inset: 0;
  background: radial-gradient(ellipse 70% 60% at 50% 50%, rgba(16,17,15,.62), rgba(16,17,15,.93) 78%);
}
.carte-cover-inner { position: relative; z-index: 2; display: grid; justify-items: center; padding: 0 6vw; }
.carte-seal {
  width: 78px; height: 78px; display: grid; place-items: center; margin-bottom: 34px;
  border: 1px solid var(--champagne); border-radius: 50%; color: var(--champagne-light); font: 400 23px/1 var(--serif); letter-spacing: .1em;
}
.carte-cover h1 { margin: 0; font: 400 clamp(58px, 8.4vw, 132px)/.86 var(--serif); letter-spacing: -.045em; }
.carte-cover h1 em { display: block; }
.carte-cover .carte-lead { max-width: 480px; margin: 34px 0 0; color: rgba(241,236,223,.78); font-size: var(--fs-body); }
.carte-count { margin-top: 44px; display: flex; align-items: center; gap: 18px; color: var(--champagne-light); font-size: 10px; letter-spacing: .28em; text-transform: uppercase; }
.carte-count i { display: block; width: 46px; height: 1px; background: rgba(226,205,166,.5); }

/* ---- Corps : index collant + chapitres ---- */
.carte-body { width: min(1420px, 92vw); margin: 0 auto; display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 60px; padding: 120px 0 0; }
.carte-index { position: sticky; top: 140px; align-self: start; height: max-content; }
.carte-index p { margin: 0 0 22px; color: var(--champagne); font-size: 10px; letter-spacing: .24em; text-transform: uppercase; }
.carte-index ol { margin: 0; padding: 0; list-style: none; display: grid; gap: 3px; counter-reset: opt; }
.carte-index a {
  display: grid; grid-template-columns: 30px 1fr; align-items: baseline; gap: 10px; padding: 9px 0;
  color: rgba(241,236,223,.5); font-size: var(--fs-small); transition: color .3s ease, padding .3s ease;
}
.carte-index a::before { counter-increment: opt; content: "0" counter(opt); color: rgba(199,164,107,.55); font-size: 10px; letter-spacing: .12em; }
.carte-index a:hover { color: var(--ivory); }
.carte-index a.is-current { color: var(--champagne-light); padding-left: 8px; }
.carte-index a.is-current::before { color: var(--champagne-light); }
/* Reliure : filet vertical qui court le long de la carte. */
.carte-rule { position: absolute; z-index: 1; left: 0; top: 0; bottom: 0; width: 1px; background: rgba(199,164,107,.16); }
.carte-rule i { position: absolute; left: 0; top: 0; width: 1px; height: 0; background: var(--champagne); }

.carte-chapter { position: relative; padding-bottom: 40px; }
.carte-chapter > h2 {
  margin: 0 0 10px; padding-top: 90px; font: 400 clamp(34px, 3.6vw, 52px)/1 var(--serif); letter-spacing: -.03em;
}
.carte-chapter > p { margin: 0 0 20px; max-width: 460px; color: rgba(241,236,223,.6); font-size: var(--fs-small); }
.carte-chapter > span { color: var(--champagne); font-size: 10px; letter-spacing: .24em; text-transform: uppercase; }

/* ---- Une option ---- */
.opt {
  position: relative; scroll-margin-top: 120px; min-height: 78vh;
  display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); align-items: center; gap: 6vw;
  padding: 60px 0; border-top: 1px solid rgba(241,236,223,.13);
}
.opt-visual { position: relative; }
.opt-emblem {
  /* Pas de recadrage : un emblème se montre entier, sceau compris. */
  display: block; width: min(100%, 460px); height: auto;
  border: 1px solid rgba(199,164,107,.24);
  transition: transform .9s cubic-bezier(.2,.7,.2,1), border-color .5s ease;
}
.opt:hover .opt-emblem { transform: rotate(-1.4deg) scale(1.02); border-color: rgba(199,164,107,.5); }
.opt-num {
  position: absolute; z-index: -1; right: 2%; top: -6%; color: rgba(199,164,107,.09);
  font: 400 clamp(150px, 17vw, 260px)/.8 var(--serif); pointer-events: none;
}
.opt-copy { min-width: 0; }
.opt-eyebrow { margin: 0 0 16px; color: var(--champagne); font-size: 10px; letter-spacing: .24em; text-transform: uppercase; }
.opt h3 { margin: 0; font: 400 clamp(40px, 4.6vw, 64px)/1 var(--serif); letter-spacing: -.03em; }
.opt-desc { margin: 22px 0 0; max-width: 40ch; color: rgba(241,236,223,.72); font-size: var(--fs-body-l); line-height: 1.6; }
.opt-tarif { margin-top: 40px; display: grid; justify-items: start; width: max-content; }
.opt-price {
  font: 400 clamp(58px, 7vw, 96px)/1 var(--serif); font-variant-numeric: oldstyle-nums;
  color: var(--ivory); letter-spacing: -.02em;
}
.opt-unit { margin-top: 14px; padding-top: 12px; border-top: 1px solid rgba(199,164,107,.4); color: var(--champagne-light); font-size: 10px; letter-spacing: .2em; text-transform: uppercase; }
.opt-cta {
  display: flex; width: max-content; align-items: center; gap: 18px; min-height: 58px; margin-top: 38px; padding: 0 30px;
  color: var(--black); background: var(--champagne); border: 1px solid var(--champagne);
  font-size: 11px; font-weight: 600; letter-spacing: var(--ls-label); text-transform: uppercase;
  transition: color .3s ease, background .3s ease;
}
.opt-cta:hover { color: var(--champagne-light); background: transparent; }
.opt-soon {
  display: flex; width: max-content; align-items: center; gap: 14px; margin-top: 38px; padding: 15px 22px;
  color: rgba(226,205,166,.8); border: 1px dashed rgba(226,205,166,.4);
  font-size: 10px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase;
}
.opt-note { margin: 18px 0 0; color: rgba(241,236,223,.42); font-size: var(--fs-micro); letter-spacing: .06em; }
.opt.is-soon .opt-emblem { filter: grayscale(.3) brightness(.86); opacity: .82; }
.opt.is-soon .opt-price { color: rgba(241,236,223,.55); }

/* Apparition par masque : le texte monte de derrière une arête nette. */
.has-js .mask { display: block; overflow: hidden; }
.has-js .mask > span { display: block; transform: translateY(105%); transition: transform 1s cubic-bezier(.2,.75,.2,1); transition-delay: calc(var(--d, 0) * 90ms); }
.has-js .is-visible .mask > span, .has-js .mask.is-visible > span { transform: none; }

/* ---- Clôture ---- */
.carte-outro { position: relative; margin-top: 40px; padding: 130px 6vw 120px; text-align: center; border-top: 1px solid rgba(241,236,223,.13); }
.carte-outro h2 { margin: 0 0 18px; font: 400 clamp(40px, 4.6vw, 68px)/.96 var(--serif); letter-spacing: -.03em; }
.carte-outro p { max-width: 460px; margin: 0 auto 40px; color: rgba(241,236,223,.66); font-size: var(--fs-small); }
.carte-outro-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 18px 34px; margin-top: 34px; }

/* ---- Mode édition : ?edition=1 ---- */
.carte .todo, .carte .notice { display: none; }
.edition .carte .todo, .edition .carte .notice { display: block; }
.edition-flag {
  position: fixed; z-index: 300; right: 16px; bottom: 16px; display: none; padding: 11px 16px;
  color: var(--black); background: var(--champagne-light); font-size: 10px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase;
}
.edition .edition-flag { display: block; }
.carte .notice {
  width: min(900px, 90vw); margin: 0 auto 40px; padding: 24px 28px; text-align: left;
  color: rgba(241,236,223,.82); background: rgba(199,164,107,.1); border: 1px solid rgba(199,164,107,.45); border-left: 4px solid var(--champagne);
}
.carte .notice > strong { display: block; margin-bottom: 8px; color: var(--champagne-light); font: 600 11px var(--sans); letter-spacing: .2em; text-transform: uppercase; }
.carte .notice p { margin: 0; font-size: var(--fs-small); }
.carte .notice p strong { color: var(--champagne-light); font-weight: 600; }
.carte .todo { margin: 24px 0 0; color: rgba(226,205,166,.85); background: rgba(199,164,107,.09); border-color: rgba(199,164,107,.5); }
.carte .todo::before { color: var(--champagne-light); }

/* ---------- FAQ ---------- */
.faq-section { width: min(1180px, 86vw); margin: 0 auto; display: grid; grid-template-columns: .75fr 1.25fr; gap: 10vw; padding: 150px 0; }
.faq-section h2 { margin: 0; font: 400 clamp(48px, 5vw, 72px)/.92 var(--serif); }
.faq-list details { border-top: 1px solid rgba(16,17,15,.15); }
.faq-list details:last-child { border-bottom: 1px solid rgba(16,17,15,.15); }
.faq-list summary { display: flex; justify-content: space-between; gap: 20px; padding: 26px 0; cursor: pointer; list-style: none; font: 400 26px var(--serif); }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary span { color: var(--champagne); transition: transform .25s ease; }
.faq-list details[open] summary span { transform: rotate(45deg); }
.faq-list details p { max-width: 640px; margin: -4px 0 26px; color: #5f5c54; font-size: var(--fs-small); }

/* ---------- Adresse et contact ---------- */
.location { width: 100%; grid-template-columns: .87fr 1.13fr; gap: 0; padding: 0; }
.location-card { min-height: 650px; display: flex; flex-direction: column; justify-content: center; padding: 110px 8vw; color: var(--ivory); background: var(--black-2); }
.location-card h2 { line-height: 1.02; }
.location-card p:not(.eyebrow):not(.todo) { max-width: 420px; margin: 26px 0; color: rgba(241,236,223,.78); font-size: var(--fs-small); }
.location-card .button { width: max-content; margin-top: 10px; }
.contact-list { margin: 4px 0 22px; padding: 0; list-style: none; display: grid; gap: 10px; }
.contact-list li { display: flex; align-items: baseline; gap: 14px; font-size: var(--fs-small); }
.contact-list b { flex: none; width: 88px; color: var(--champagne-light); font-size: 10px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; }
.contact-list a { border-bottom: 1px solid rgba(226,205,166,.45); }
.location-visual { position: relative; min-height: 650px; overflow: hidden; background: #12130f; }
.location-map { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.location-visual p { position: absolute; left: 48px; bottom: 34px; margin: 0; color: rgba(241,236,223,.92); font: italic 400 34px/1.05 var(--serif); }

/* ---------- Clôture ---------- */
.closing { position: relative; overflow: hidden; padding: 165px 6vw; text-align: center; background: var(--paper); }
.closing .button { margin-top: 43px; }
.closing-monogram { position: absolute; left: 50%; top: 50%; color: rgba(199,164,107,.08); font: 400 410px/.8 var(--serif); transform: translate(-50%, -50%); }
.closing > *:not(.closing-monogram) { position: relative; }
.closing small { display: block; position: relative; margin-top: 22px; color: #6b6759; font-size: var(--fs-micro); letter-spacing: var(--ls-micro); text-transform: uppercase; }

footer { color: rgba(241,236,223,.72); background: var(--black); border-top: 1px solid rgba(199,164,107,.18); }
.footer-inner {
  width: min(1240px, 90vw); margin: 0 auto; padding: 60px 0 34px;
  display: grid; grid-template-columns: 1.15fr .72fr .72fr 1.18fr; gap: 36px; align-items: start;
}
.footer-inner h4 { margin: 0 0 16px; color: var(--champagne-light); font: 600 10px var(--sans); letter-spacing: .2em; text-transform: uppercase; }
.footer-inner ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 11px; font-size: var(--fs-small); }
.footer-inner ul a:hover { color: var(--champagne-light); }
.footer-inner address { font-style: normal; font-size: var(--fs-small); line-height: 1.8; }
.brand-footer { color: var(--ivory); }
.agency-card {
  display: grid; gap: 10px; min-height: 100%; padding: 22px 24px;
  color: rgba(241,236,223,.76); background: linear-gradient(145deg, rgba(199,164,107,.1), rgba(241,236,223,.025));
  border: 1px solid rgba(199,164,107,.28); transition: color .2s ease, border-color .2s ease, transform .2s ease, background .2s ease;
}
.agency-card:hover, .agency-card:focus-visible {
  color: var(--ivory); background: linear-gradient(145deg, rgba(199,164,107,.16), rgba(241,236,223,.04));
  border-color: rgba(226,205,166,.68); transform: translateY(-2px);
}
.agency-card:focus-visible { outline: 2px solid var(--champagne-light); outline-offset: 4px; }
.agency-eyebrow { color: var(--champagne-light); font-size: 10px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; }
.agency-name { color: var(--ivory); font: 500 30px/1 var(--serif); letter-spacing: .01em; }
.agency-copy { max-width: 30ch; font-size: 14px; line-height: 1.55; }
.agency-cta { align-self: end; padding-top: 4px; color: var(--champagne-light); font-size: 11px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.agency-cta span { display: inline-block; transition: transform .2s ease; }
.agency-card:hover .agency-cta span, .agency-card:focus-visible .agency-cta span { transform: translateX(4px); }
.footer-bar {
  width: min(1240px, 90vw); margin: 0 auto; padding: 22px 0 40px; border-top: 1px solid rgba(241,236,223,.12);
  display: flex; flex-wrap: wrap; gap: 10px 28px; justify-content: space-between;
  color: rgba(241,236,223,.6); font-size: 10px; letter-spacing: var(--ls-micro); text-transform: uppercase;
}
.site-credit a { color: var(--champagne-light); transition: color .2s ease; }
.site-credit a:hover, .site-credit a:focus-visible { color: var(--ivory); }
.lang-switch { display: inline-flex; gap: 10px; }
.lang-switch a[aria-current="true"] { color: var(--champagne-light); }

/* ---------- Page disponibilités ---------- */
.search-page { min-height: 100vh; background: var(--paper); }
.search-hero { position: relative; width: min(1120px, 86vw); padding: 125px 0 60px; margin: 0 auto; }
.search-hero::after { content: "R"; position: absolute; z-index: 0; right: -3vw; top: 60px; color: rgba(199,164,107,.1); font: 270px/.8 var(--serif); }
.search-hero h1 { position: relative; z-index: 1; color: var(--black); font-size: clamp(56px, 7vw, 92px); }
.search-hero > p:last-child { position: relative; z-index: 1; max-width: 620px; color: var(--muted); font-size: var(--fs-body); }
.search-results { width: 100%; padding: 26px 0; background: var(--ivory); border-block: 1px solid rgba(16,17,15,.1); }
/* Tant qu’aucune date n’est saisie, le module ne renvoie rien : la page
   affichait 855 px de vide. Ce rappel occupe la place utilement. */
.search-standby { width: min(1180px, 90vw); margin: 44px auto 0; }
.search-standby > p { max-width: 540px; margin: 0 0 40px; color: var(--muted); font-size: var(--fs-small); }
.search-keys { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.search-keys a { display: block; }
.search-keys figure { position: relative; margin: 0 0 16px; aspect-ratio: 4/3; overflow: hidden; background: var(--black); }
.search-keys img { width: 100%; height: 100%; display: block; object-fit: cover; filter: saturate(.8); transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.search-keys a:hover img { transform: scale(1.04); }
.search-keys span { color: #7a5f37; font-size: 10px; letter-spacing: .18em; text-transform: uppercase; }
.search-keys h2 { margin: 8px 0 0; font: 400 27px var(--serif); }
.search-note { width: min(1180px, 90vw); margin: 70px auto 110px; padding: 28px 34px; display: flex; gap: 45px; color: var(--ivory); background: var(--black); }
.search-note strong { color: var(--champagne-light); font: 400 22px var(--serif); }
.search-note p { margin: 0; color: rgba(241,236,223,.68); font-size: var(--fs-small); }

/* ---------- Page hébergement ---------- */
.property-page { min-height: 100vh; background: var(--paper); }
.property-hero {
  display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(400px, .65fr);
  min-height: 720px; padding-top: var(--header-h); color: var(--ivory); background: var(--black);
}
.property-visual { position: relative; min-height: 612px; overflow: hidden; }
.property-visual picture { display: block; height: 100%; }
.property-visual img { width: 100%; height: 100%; display: block; object-fit: cover; }
.property-visual::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 60%, rgba(16,17,15,.42)); pointer-events: none; }
.property-copy { position: relative; display: flex; flex-direction: column; justify-content: center; padding: 70px 6vw; border-left: 1px solid rgba(199,164,107,.24); }
.property-copy::before {
  content: attr(data-room); position: absolute; z-index: 0; right: 3vw; bottom: 40px;
  color: rgba(241,236,223,.07); font: 400 clamp(110px,13vw,190px)/1 var(--serif); pointer-events: none;
}
.property-copy > * { position: relative; z-index: 1; }
.property-copy h1 { margin: 0; font: 400 clamp(52px,5.4vw,82px)/.86 var(--serif); letter-spacing: -.04em; }
.property-copy h1 em { display: block; }
.property-copy > p:not(.eyebrow):not(.todo) { max-width: 460px; margin: 26px 0 0; color: rgba(241,236,223,.76); font-size: var(--fs-small); }
.property-meta { display: flex; flex-wrap: wrap; gap: 9px; margin: 26px 0 0; }
.property-meta span { padding: 10px 14px; color: var(--champagne-light); border: 1px solid rgba(226,205,166,.34); font-size: 10px; letter-spacing: .13em; text-transform: uppercase; }
.property-copy .button { width: max-content; margin-top: 30px; }

.property-gallery { width: min(1180px, 88vw); margin: 0 auto; padding: 110px 0 0; }
.property-gallery h2 { margin: 0 0 34px; font: 400 clamp(38px,4vw,58px)/.94 var(--serif); letter-spacing: -.03em; }
/* auto-fill et non auto-fit : avec une seule photo, la vignette garde sa
   taille au lieu de s’étirer sur toute la largeur. */
.property-gallery-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 18px; }
.property-gallery-grid figure { position: relative; margin: 0; aspect-ratio: 4/3; overflow: hidden; background: var(--black); }
.property-gallery-grid img { width: 100%; height: 100%; display: block; object-fit: cover; }

.property-booking { width: min(1180px, 88vw); margin: 0 auto; padding: 110px 0; }
.property-booking-heading { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: end; margin-bottom: 45px; }
.property-booking-heading h2 { margin: 0; font: 400 clamp(48px,5vw,76px)/.92 var(--serif); letter-spacing: -.035em; }
.property-booking-heading > p { max-width: 470px; margin: 0; color: var(--muted); font-size: var(--fs-small); }
.property-widget-slot { padding: 30px 0; background: var(--ivory); border-block: 1px solid rgba(16,17,15,.1); }
.property-widget-slot iframe { display: block; width: 100%; min-height: 700px; border: 0; }
.property-widget-direct-link { margin: 18px 0 0; text-align: center; font-size: var(--fs-micro); letter-spacing: var(--ls-micro); text-transform: uppercase; }
.property-widget-direct-link a { color: var(--rust); text-decoration: underline; text-decoration-color: rgba(139,67,46,.45); text-underline-offset: 4px; }
.property-widget-direct-link a:hover { color: var(--black); text-decoration-color: currentColor; }
.property-widget-pending { margin: 0 30px; padding: 28px; color: var(--ivory); background: linear-gradient(135deg, #231e19, #3a171b); border: 1px solid rgba(199,164,107,.38); }
.property-widget-pending strong { display: block; color: var(--champagne-light); font: 400 28px var(--serif); }
.property-widget-pending p { max-width: 800px; margin: 8px 0 0; color: rgba(241,236,223,.7); font-size: var(--fs-small); }
.property-fallback { margin-top: 18px; padding: 20px 0; background: #fffdf8; border-block: 1px solid rgba(16,17,15,.1); }
.property-fallback > p { margin: 0 30px 13px; color: #5a554b; font-size: var(--fs-micro); letter-spacing: var(--ls-micro); text-transform: uppercase; }
.has-property-widget .property-widget-pending, .has-property-widget .property-fallback { display: none; }
.widget-frame, .property-fallback, .search-results { position: relative; }
.widget-frame { z-index: 20; }
/* Le calendrier Hospitable dépasse du bandeau de réservation ; le média
   interne garde son propre clipping, mais le bandeau doit laisser passer le
   sélecteur pour qu’il reste visible et cliquable. */
.hero { overflow: visible; }
.search-results.widget-is-ready + .search-standby { display: none !important; }
.widget-loading:not(.widget-is-ready)::after {
  content: "Connexion sécurisée à Hospitable…";
  position: absolute; z-index: 8; inset: 0; display: grid; place-items: center; padding: 20px;
  color: #6b5735; background:
    linear-gradient(110deg, rgba(255,253,248,.96) 8%, rgba(239,227,205,.96) 18%, rgba(255,253,248,.96) 33%);
  background-size: 220% 100%;
  font-size: var(--fs-micro); font-weight: 600; letter-spacing: var(--ls-label); text-align: center; text-transform: uppercase;
  animation: widgetShimmer 1.35s linear infinite;
}
.property-sticky-booking { display: none; }

/* ---------- Pages de texte (conditions, mentions, confidentialité) ---------- */
.doc-page { min-height: 100vh; background: var(--paper); }
.doc-hero { width: min(920px, 86vw); margin: 0 auto; padding: 150px 0 50px; }
.doc-hero h1 { margin: 0; font: 400 clamp(46px, 5.4vw, 80px)/.92 var(--serif); letter-spacing: -.04em; }
.doc-body { width: min(920px, 86vw); margin: 0 auto; padding-bottom: 130px; }
.doc-body h2 { margin: 58px 0 16px; font: 400 clamp(28px, 2.6vw, 38px)/1.1 var(--serif); letter-spacing: -.02em; }
.doc-body h2:first-child { margin-top: 0; }
.doc-body p, .doc-body li { color: #4f4c45; font-size: var(--fs-body); line-height: 1.8; }
.doc-body ul { padding-left: 20px; }
.doc-body li { margin-bottom: 8px; }
.doc-body a { border-bottom: 1px solid var(--champagne); }
.doc-updated { display: block; margin-top: 60px; padding-top: 20px; border-top: 1px solid rgba(16,17,15,.15); color: var(--muted); font-size: var(--fs-micro); letter-spacing: var(--ls-micro); text-transform: uppercase; }

/* ---------- 404 ---------- */
.error-page { min-height: 100svh; display: grid; place-items: center; padding: 140px 6vw 90px; text-align: center; color: var(--ivory); background: var(--black); }
.error-page .monogram { display: block; margin-bottom: -40px; color: rgba(199,164,107,.1); font: 400 300px/.8 var(--serif); }
.error-page h1 { margin: 0; font: 400 clamp(48px, 6vw, 88px)/.92 var(--serif); letter-spacing: -.04em; }
.error-page p { max-width: 460px; margin: 24px auto 36px; color: rgba(241,236,223,.7); font-size: var(--fs-small); }

@keyframes heroReveal { from { opacity: 0; transform: scale(1.1); } to { opacity: 1; transform: scale(1.025); } }
@keyframes widgetShimmer { to { background-position-x: -220%; } }
@keyframes cueSlide { 0% { transform: translateX(-16px); } 55%, 100% { transform: translateX(46px); } }

/* ==========================================================================
   Écrans courts
   ========================================================================== */
@media (min-width: 901px) and (max-height: 820px) {
  .hero { min-height: 740px; }
  .hero-content { width: min(680px, 70vw); }
  .review-pill { margin-bottom: 14px; }
  .hero-content > .eyebrow { margin-bottom: 14px; }
  .hero h1 { font-size: clamp(56px, 6vw, 82px); }
  .hero-lead { margin-top: 18px; font-size: var(--fs-body); }
  .hero-actions { margin-top: 18px; }
  .scroll-cue { display: none; }
  .booking-shell { padding: 16px 0 12px; }
  .booking-intro { margin-bottom: 9px; }
  .booking-intro h2 { font-size: 31px; }
  .widget-frame { min-height: 74px; padding: 6px 0; }
  .trust-row { margin-top: 8px; }
}

/* ==========================================================================
   Tablette et mobile
   ========================================================================== */
@media (max-width: 900px) {
  :root { --header-h: 76px; --fs-body-l: 16px; }
  .site-header { grid-template-columns: 1fr auto; padding: 0 18px; }
  .site-header .header-cta { display: none; }
  .nav-toggle {
    grid-column: 2; justify-self: end; display: grid; gap: 6px; width: 44px; height: 44px;
    place-content: center; padding: 0; background: none; border: 0; cursor: pointer;
  }
  .nav-toggle span { display: block; width: 22px; height: 1px; background: var(--ivory); transition: transform .3s ease; }
  .header-solid .nav-toggle span { background: var(--black); }
  .site-header nav {
    position: fixed; z-index: 40; inset: 0; display: flex; flex-direction: column; justify-content: center; gap: 4px;
    padding: 0 10vw; background: rgba(16,17,15,.97); backdrop-filter: blur(20px);
    opacity: 0; visibility: hidden; transition: opacity .3s ease, visibility .3s ease;
  }
  .site-header nav a { padding: 18px 0; color: var(--ivory); border-bottom: 1px solid rgba(241,236,223,.14); font: 400 28px/1 var(--serif); letter-spacing: 0; text-transform: none; }
  .site-header nav .nav-cta { display: block; margin-top: 26px; padding: 19px 0; color: var(--champagne-light); border: 0; font-size: 12px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; }
  .nav-open .site-header nav { opacity: 1; visibility: visible; }
  .nav-open .nav-toggle span:first-child { transform: translateY(3.5px) rotate(45deg); }
  .nav-open .nav-toggle span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
  .nav-open .nav-toggle span { background: var(--ivory); }
  body.nav-open { overflow: hidden; }

  .hero::after { inset: 12px; }
  .hero { min-height: 100svh; }
  .hero-image { object-position: 59% center; }
  .hero-monogram { right: 0; }
  .hero-index, .scroll-cue { display: none; }
  .hero-inner { gap: 24px; }
  .hero-content { width: 88vw; margin: 0 auto; }
  .hero h1 { font-size: clamp(50px, 14.5vw, 72px); line-height: .8; }
  .hero h1 em { margin-left: .2em; }
  .hero-lead { max-width: 360px; margin-top: 20px; }
  .hero-actions { gap: 18px; margin-top: 22px; }

  .booking-shell { padding: 16px 0 13px; }
  .booking-intro, .trust-row { width: 92vw; }
  .booking-intro { grid-template-columns: 1fr auto; gap: 4px 12px; margin-bottom: 10px; }
  .booking-intro .eyebrow { grid-column: 1 / -1; margin-bottom: 4px; }
  .booking-intro h2 { font-size: 27px; }
  .booking-intro > p:last-child { align-self: end; max-width: 130px; margin: 0 0 2px; font-size: 10px; line-height: 1.45; }
  .widget-frame { min-height: 76px; padding: 8px 0; }
  .trust-row { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 12px; margin-top: 10px; font-size: 9px; }

  .proof-strip { width: 100%; padding: 0; grid-template-columns: repeat(2, 1fr); margin-top: 0; border-width: 0; }
  .proof-signature { grid-column: 1 / -1; padding: 29px 22px 25px; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.1); }
  .proof-signature p { font-size: 29px; }
  .proof-item { min-height: 152px; padding: 24px 22px 23px; }
  .proof-item:nth-child(3) { border-right: 0; }
  .proof-item:nth-child(2), .proof-item:nth-child(3) { border-bottom: 1px solid rgba(255,255,255,.1); }
  .proof-item strong { font-size: 38px; }

  .section-grid { grid-template-columns: 1fr; width: 88vw; }
  .story { padding: 100px 0 92px; gap: 35px; }
  .story::before { font-size: 160px; }
  .story-copy { padding-top: 0; }
  .host-artist-card { grid-template-columns: 112px minmax(0, 1fr); column-gap: 16px; padding: 22px 22px 24px; }
  .host-artist-media, .host-artist-video { min-height: 150px; }
  .rooms-section { padding: 90px 0 105px; }
  .section-heading { width: 90vw; display: block; margin-bottom: 55px; }
  .rooms-heading > p { margin-top: 28px; }
  .rooms-grid { width: 90vw; grid-template-columns: 1fr; gap: 70px; }
  .room-card:nth-child(even) { transform: none; }
  .room-image { height: min(62vh, 500px); min-height: 390px; }
  .whole-house { width: 90vw; margin-top: 90px; grid-template-columns: 1fr; gap: 32px; padding: 42px 30px; }

  .film-section { padding: 88px 0 0; }
  .film-heading { width: 88vw; margin-bottom: 34px; display: block; }
  .film-heading h2 { font-size: 58px; }
  .film-frame { width: 100%; border-bottom: 0; }
  .has-js .film-track { height: 200vh; }
  .has-js .film-frame { width: calc((72 + 28 * var(--p, 0)) * 1%); box-shadow: none; }
    .film-controls { left: 12px; right: 12px; bottom: 12px; justify-content: space-between; }
  .film-controls button { min-height: 42px; padding: 0 14px; background: rgba(16,17,15,.78); font-size: 10px; }

  .sensory-section { padding: 105px 6vw; }
  .sensory-lead { grid-template-columns: 1fr; }
  .sensory-lead > p:last-child { margin-top: 28px; }
  .sensory-grid { grid-template-columns: 1fr; grid-template-rows: none; }
  .sensory-card, .sensory-card.sensory-wide { grid-row: auto; min-height: min(66vh, 430px); }
  .included-card { grid-template-columns: 1fr; }
  .included-card > div { padding: 42px 30px; border-right: 0; border-bottom: 1px solid rgba(241,236,223,.13); }
  .included-list { padding: 20px 30px 30px; }

  .direct-section { grid-template-columns: 1fr; min-height: auto; }
  .direct-section > div:first-child, .direct-list { padding: 90px 8vw; }
  .pledge-band { padding: 90px 6vw; }
  .pledge-grid { grid-template-columns: 1fr; gap: 18px; }
  .gift-band { width: 88vw; grid-template-columns: 1fr; gap: 26px; padding: 40px 30px; }

  .experiences-section { padding: 105px 6vw; }
  .experience-heading > p { margin-top: 25px; }
  .escape-gallery { grid-template-columns: 1fr; grid-auto-rows: 420px; margin: 55px auto 72px; }
  .escape-card:nth-child(n) { grid-column: 1; }
  .experiences-list > * { grid-template-columns: 46px 1fr 28px; gap: 6px 14px; padding: 28px 0; }
  .experiences-list > * > span { grid-row: 1 / 4; }
  .experiences-list small { grid-column: 2; grid-row: 1; }
  .experiences-list h3 { grid-column: 2; grid-row: 2; font-size: 27px; }
  .experiences-list p { grid-column: 2; grid-row: 3; }
  .experiences-list b { grid-column: 3; grid-row: 1 / 4; }

  .journal-section { padding: 100px 6vw; }
  .journal-grid { grid-template-columns: 1fr; gap: 34px; }

  /* ---- La carte ---- */
  .carte-body { grid-template-columns: 1fr; gap: 0; padding-top: 70px; }
  .carte-index { display: none; }
  .carte-rule { display: none; }
  .carte-cover h1 { font-size: clamp(46px, 13vw, 72px); }
  .carte-cover .carte-lead { font-size: var(--fs-small); }
  .carte-chapter > h2 { padding-top: 62px; }
  .opt { grid-template-columns: 1fr; gap: 34px; min-height: 0; padding: 48px 0; scroll-margin-top: 90px; }
  .opt-visual { order: -1; }
  .opt-emblem { width: 100%; max-width: none; }
  .opt-num { right: 4%; top: -10%; font-size: 120px; }
  .opt-desc { font-size: var(--fs-body); }
  .opt-price { font-size: clamp(48px, 15vw, 68px); }
  .opt-cta { width: 100%; justify-content: center; }
  .carte-outro { padding: 90px 6vw 80px; }
  .options-band { padding: 90px 6vw; }
  .options-lead { grid-template-columns: 1fr; gap: 22px; margin-bottom: 40px; }
  .options-grid { grid-template-columns: 1fr; gap: 40px; }
  .faq-section { grid-template-columns: 1fr; padding: 105px 0; gap: 50px; }
  .location { grid-template-columns: 1fr; }
  .location-card, .location-visual { min-height: 520px; }
  .location-card { padding: 90px 8vw; }
  .closing { padding: 120px 6vw; }
  .footer-inner { grid-template-columns: 1fr; gap: 38px; padding-top: 50px; }

  .search-hero { padding: 70px 0 35px; }
  .search-hero h1 { font-size: clamp(48px, 13vw, 66px); line-height: .86; }
  .search-hero::after { display: none; }
  .search-keys { grid-template-columns: repeat(2, 1fr); }
  .search-note { display: block; margin-bottom: 80px; }

  .doc-hero { padding: 110px 0 34px; }
  .doc-body { padding-bottom: 90px; }

  .property-hero { grid-template-columns: 1fr; }
  .property-visual { min-height: min(62vh, 520px); }
  .property-visual::after { background: linear-gradient(0deg, rgba(16,17,15,.48), transparent 45%); }
  .property-copy { padding: 65px 7vw 80px; border-left: 0; }
  .property-copy h1 { font-size: clamp(48px,12vw,68px); }
  .property-gallery { width: 88vw; padding-top: 80px; }
  .property-kit { width: 88vw; grid-template-columns: 1fr; gap: 26px; padding-top: 70px; }
  .property-kit ul { grid-template-columns: 1fr; }
  .property-gallery-grid { grid-template-columns: 1fr; }
  .property-booking { width: 88vw; padding: 80px 0; }
  .property-booking-heading { grid-template-columns: 1fr; gap: 20px; }
  .property-widget-pending { margin: 0 15px; }
  .property-fallback > p { margin-inline: 15px; }
  .property-widget-slot iframe { min-height: 760px; }
  .property-page { padding-bottom: 74px; }
  .property-sticky-booking {
    position: fixed; z-index: 140; left: 12px; right: 12px; bottom: 12px; min-height: 56px;
    display: flex; align-items: center; justify-content: space-between; padding: 0 20px;
    color: var(--black); background: rgba(226,205,166,.96); border: 1px solid rgba(255,255,255,.52);
    box-shadow: 0 16px 40px rgba(16,17,15,.26); backdrop-filter: blur(16px);
    font-size: 11px; font-weight: 600; letter-spacing: var(--ls-label); text-transform: uppercase;
  }
  .property-sticky-booking span { font: 400 24px var(--serif); letter-spacing: 0; }
}

@media (max-width: 520px) {
  .brand small { display: none; }
  .hero-lead { display: none; }
  .hero-actions { flex-direction: column; align-items: stretch; gap: 10px; margin-top: 16px; }
  .hero-actions .button { width: min(100%, 290px); }
  .ghost-link { margin-left: 2px; font-size: 10px; }
  .proof-item > span:last-child { max-width: 145px; }
  .story h2, .section-heading h2, .location h2, .closing h2 { font-size: 45px; }
  .host-artist-card { grid-template-columns: 1fr; row-gap: 18px; }
  .host-artist-media, .host-artist-video { min-height: 150px; height: 150px; }
  .room-image { min-height: 360px; height: 54vh; }
  .room-copy h3 { font-size: 34px; }
  .film-heading h2 { font-size: 50px; }
  .sensory-card, .sensory-card.sensory-wide { min-height: 340px; }
  .sensory-card > div { left: 22px; right: 22px; bottom: 22px; }
  .sensory-card h3 { font-size: 30px; }
  .included-card h3 { font-size: 36px; }
  .included-card > div, .included-list { padding-left: 24px; padding-right: 24px; }
  .whole-house h3 { font-size: 34px; }
  .faq-list summary { font-size: 22px; }
  .search-keys { grid-template-columns: 1fr; }
  .options-lead h2 { font-size: 42px; }
  .escape-gallery { grid-auto-rows: 360px; }
  .escape-meta { left: 18px; right: 18px; top: 18px; }
  .escape-copy { left: 22px; right: 22px; bottom: 22px; }
  .escape-copy h3 { font-size: 34px; }
  .location-visual p { left: 26px; bottom: 26px; font-size: 28px; }
}

/* ==========================================================================
   Impression : une réservation se réimprime. Adresse, horaires et réponses
   doivent sortir proprement, sans décor ni fond sombre.
   ========================================================================== */
@media print {
  @page { margin: 16mm; }
  body { color: #000; background: #fff; font-size: 11pt; }
  .site-header, .nav-toggle, .skip-link, .page-noise, .scroll-progress, .luxury-cursor,
  .hero-media, .hero-monogram, .hero-index, .scroll-cue, .booking-shell, .film-section,
  .property-sticky-booking, .property-widget-slot, .search-results, .search-note, .escape-gallery, .splash,
  .closing .button, .gift-band, .journal-section, .todo, .location-visual { display: none !important; }
  .hero, .rooms-section, .proof-strip, .direct-section, .pledge-band, .location-card,
  .included-card, .whole-house, .property-hero, .property-copy, .error-page {
    min-height: 0 !important; padding: 0 !important; color: #000 !important;
    background: none !important; border: 0 !important; box-shadow: none !important;
  }
  .hero { padding-bottom: 12mm !important; }
  h1, h2, h3 { color: #000 !important; page-break-after: avoid; }
  em, .eyebrow, .eyebrow.light { color: #6b5122 !important; }
  p, li, span, small, strong, address { color: #000 !important; }
  .has-js .reveal-item { opacity: 1 !important; transform: none !important; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 8pt; color: #555; }
  .faq-list details { display: block; }
  .faq-list details p { display: block !important; }
  section { page-break-inside: avoid; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
  .has-js .mask > span { transform: none !important; }
  .carte-halo { display: none; }
  .has-js .film-track { height: auto; padding-bottom: 115px; }
  .has-js .film-sticky { position: static; height: auto; }
  .has-js .film-frame { width: min(1440px, 100%); transform: none; box-shadow: none; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .luxury-cursor, .scroll-cue i::after { display: none; }
  .splash, .splash-open .splash { display: none !important; }
}