/* =========================================================
   Indian's — Riom · feuille de style
   Sombre, sobre, aéré. Or en accent, jamais en aplat massif.
   ========================================================= */

/* ---------- Tokens ---------- */
:root {
  --bg: #0A0908;
  --bg-raise: #14120F;
  --bg-raise-2: #1B1814;
  --ink: #F4EFE6;
  --ink-2: rgba(244, 239, 230, .76);
  --ink-3: rgba(244, 239, 230, .58);
  --gold: #FDC852;
  --gold-2: #FBD277;
  --gold-soft: rgba(253, 200, 82, .12);
  --dark: #0A0908;
  --line: rgba(244, 239, 230, .13);
  --line-2: rgba(244, 239, 230, .28);
  --line-gold: rgba(253, 200, 82, .34);

  --f-display: "Archivo", system-ui, sans-serif;
  --f-serif: "Instrument Serif", Georgia, serif;
  --f-text: "Jost", system-ui, sans-serif;

  --gutter: clamp(20px, 4.2vw, 72px);
  --max: 1480px;
  --sec: clamp(104px, 13vw, 208px);
  --gap: clamp(16px, 2vw, 32px);
  --header-h: 80px;

  --ease: cubic-bezier(.16, 1, .3, 1);
  --ease-io: cubic-bezier(.65, 0, .35, 1);
  --shadow: 0 30px 70px rgba(0, 0, 0, .55);
  --panel: rgba(20, 18, 15, .7);
  --field: rgba(244, 239, 230, .04);
  --field-focus: rgba(244, 239, 230, .07);
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { background: var(--bg); color-scheme: dark; -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--header-h) + 24px); }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font: 400 16px/1.6 var(--f-text);
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  overflow-x: clip; text-rendering: optimizeLegibility;
}
img, video, iframe { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }
::selection { background: var(--gold); color: var(--dark); }
/* masqué mais lu par les lecteurs d'écran ; !important : un champ de formulaire masqué ne reprend pas la largeur des champs */
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; min-height: 0 !important; padding: 0 !important; margin: -1px !important; border: 0 !important; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: fixed; left: 16px; top: 16px; z-index: 200; padding: 12px 18px; background: var(--gold); color: var(--dark); font-weight: 500; transform: translateY(-160%); transition: transform .3s var(--ease); }
.skip:not(:focus) { opacity: 0; pointer-events: none; }
.skip:focus { transform: none; }
.muted { color: var(--ink-3); }
.gold { color: var(--gold); }

/* ---------- Atmosphère (fond commun) ---------- */
.atmos { position: fixed; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; background: var(--bg); }
.atmos__leak { position: absolute; inset: -10%; background: url(../assets/light-leak.webp) center/cover no-repeat; filter: invert(1) hue-rotate(178deg) saturate(1.25) brightness(.62); opacity: .34; }
.atmos__vig { position: absolute; inset: 0; background: radial-gradient(ellipse 120% 95% at 62% 28%, rgba(10, 9, 8, .08) 0%, rgba(10, 9, 8, .7) 62%, rgba(10, 9, 8, .97) 100%); }
.atmos__grain { position: absolute; inset: -60px; background: url(../assets/grain.webp) repeat; background-size: 280px; filter: invert(1); opacity: .065; }


/* changement de page en suivant un lien : la page glisse vers la gauche, comme un swipe (Safari 18.2+, Chrome, Edge :
   View Transitions ; pas sur les retours en arrière, voir inc/assets.php) ; l'en-tête et la barre du haut restent en place.
   Le glissement reste dans l'écran : rien ne dépasse pendant l'animation */
@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
}
.site-header { view-transition-name: entete; }
.topbar { view-transition-name: barre; }
::view-transition { overflow: clip; }
::view-transition-group(root) { overflow: clip; }
::view-transition-old(root), ::view-transition-new(root) { animation: .55s cubic-bezier(.32, .72, 0, 1) both; mix-blend-mode: normal; }
::view-transition-old(root) { animation-name: page-out; }
::view-transition-new(root) { animation-name: page-in; }
@keyframes page-out { to { transform: translateX(-30%); opacity: .35; } }
@keyframes page-in { from { transform: translateX(100%); } }

/* ailleurs, rideau de transition : il arrive par la droite et repart par la gauche (en échelle : rien ne dépasse de l'écran) */
.curtain { position: fixed; inset: 0; z-index: 150; background: var(--bg); pointer-events: none; transform: scaleX(0); transform-origin: right; }
.motion.from-nav .curtain { animation: curtain-out .6s var(--ease-io) both; transform-origin: left; }
.motion.is-leaving .curtain { animation: none; transform: scaleX(1); transition: transform .38s var(--ease-io); }
@keyframes curtain-out { from { transform: scaleX(1); } to { transform: scaleX(0); } }

/* ---------- Mise en page ---------- */
.wrap { width: 100%; max-width: var(--max); margin-inline: auto; padding-inline: var(--gutter); }
.section { position: relative; padding-block: var(--sec); }
.section--flush-top { padding-top: 0; }
.section--rule { border-top: 1px solid var(--line); }
.grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); }
.stack-sm > * + * { margin-top: 20px; }
.stack > * + * { margin-top: clamp(24px, 2.6vw, 36px); }

/* ---------- Typographie ---------- */
.eyebrow {
  display: inline-flex; align-items: center; gap: 14px;
  font: 500 12.5px/1.3 var(--f-text); letter-spacing: .2em; text-transform: uppercase; color: var(--gold);
}
.eyebrow::before { content: none; }
.eyebrow--plain::before { display: none; }

.display {
  margin: 0; font-family: var(--f-display); font-weight: 600; font-stretch: 112%;
  text-transform: uppercase; letter-spacing: -.028em; line-height: .96; text-wrap: balance;
}
.display--xl { font-size: clamp(46px, 7.4vw, 128px); }
.display--l { font-size: clamp(40px, 5.6vw, 92px); }
.display--m { font-size: clamp(32px, 3.9vw, 62px); line-height: 1; }
.display--s { font-size: clamp(22px, 2vw, 30px); line-height: 1.08; letter-spacing: -.012em; }
.serif { font-family: var(--f-serif); font-style: italic; font-weight: 400; font-stretch: 100%; text-transform: none; letter-spacing: -.01em; }
.display .serif { color: var(--gold); font-size: 1.1em; line-height: .8; }

/* le cri de marque : Archivo italique 800, réservé au mot-symbole et aux clôtures */
.shout { font-family: var(--f-display); font-style: italic; font-weight: 800; font-stretch: 100%; text-transform: uppercase; letter-spacing: -.05em; line-height: .86; margin: 0; }
.wordmark { font: italic 800 21vw/.8 var(--f-display); letter-spacing: -.05em; text-transform: uppercase; white-space: nowrap; }
.grad { background: linear-gradient(100deg, #FDC852 0%, #FBD277 18%, #FFE9B4 34%, #F4EFE6 58%, #F4EFE6 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.grad-rev { background: linear-gradient(100deg, #F4EFE6 0%, #FFE9B4 42%, #FBD277 66%, #FDC852 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* textes courants : un peu plus petits, interlignage resserré, et des lignes qui vont jusqu'au bord (pas d'équilibrage qui coupe tôt) */
.lead { font: 400 clamp(17px, 1.45vw, 21px)/1.45 var(--f-text); color: var(--ink); max-width: 48ch; }
.body { font-size: 16px; line-height: 1.6; color: var(--ink-2); max-width: 66ch; }
@media (max-width: 720px) {
  body { font-size: 15px; line-height: 1.55; }
  .body, .faq__a p, .carte__head p { font-size: 15px; line-height: 1.55; max-width: none; }
  .lead { font-size: 16.5px; line-height: 1.45; max-width: none; }
  .shead__aside, .xpand__txt { max-width: none; }
  .room p, .fact p, .occ__card p, .step p, .channel p, .stackc__text .body, .sv__facts dd, .legal__body p { font-size: 15px; line-height: 1.55; }
}
.label { display: block; font: 500 12px/1.4 var(--f-text); letter-spacing: .16em; text-transform: uppercase; color: var(--ink-3); }

/* lignes masquées pour les titres */
/* ligne de titre révélée au défilement : la marge du haut laisse passer les accents des capitales (Ê, É), celle du bas les jambages */
.ln { display: block; overflow: hidden; padding: .2em .08em .12em; margin: -.2em -.08em -.12em; }
.ln > span { display: block; }
.motion .ln > span { transform: translateY(108%); transition: transform 1.25s var(--ease); transition-delay: calc(var(--i, 0) * 110ms + var(--d, 0ms)); }
.motion .is-in .ln > span, .motion .ln.is-in > span { transform: none; }

/* ---------- Apparitions ---------- */
.motion [data-reveal] { opacity: 0; transform: translateY(32px); transition: opacity 1.1s var(--ease), transform 1.3s var(--ease); transition-delay: calc(var(--i, 0) * 90ms + var(--d, 0ms)); }
.motion [data-reveal="fade"] { transform: none; }
.motion [data-reveal].is-in { opacity: 1; transform: none; }
.motion [data-reveal="split"] { opacity: 1; transform: none; }

.media { position: relative; overflow: hidden; background: var(--bg-raise); isolation: isolate; }
.media__inner { position: absolute; inset: -8% 0; will-change: transform; }
.media__inner--flat { inset: 0; }
.media img, .media video { width: 100%; height: 100%; object-fit: cover; filter: saturate(.8) contrast(1.04); transition: filter .9s var(--ease), opacity .8s var(--ease); }
.js .media img:not(.is-loaded) { opacity: 0; }
a.media:hover img, button.media:hover img, .event:hover .media img, .svc:hover .media img, .room:hover .media img { filter: saturate(1) contrast(1.02); }
.media--ph::after { content: attr(data-ph); position: absolute; inset: auto 16px 14px; font: 500 12px/1.3 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); z-index: 2; }
.motion .media[data-reveal] { opacity: 1; transform: none; clip-path: inset(100% 0 0 0); transition: clip-path 1.5s var(--ease-io); transition-delay: calc(var(--i, 0) * 110ms + var(--d, 0ms)); }
.motion .media[data-reveal] img { transform: scale(1.22); transition: transform 2s var(--ease), filter .9s var(--ease), opacity .8s var(--ease); transition-delay: calc(var(--i, 0) * 110ms + var(--d, 0ms)); }
.motion .media[data-reveal].is-in { clip-path: inset(0 0 0 0); }
.motion .media[data-reveal].is-in img { transform: scale(1); }
/* affiches des soirées (cartes et page d'une soirée) : apparition courte */
.motion .event[data-reveal], .motion .sv__poster[data-reveal] { transition-duration: .45s, .55s; transition-delay: calc(var(--i, 0) * 45ms); }
.motion .event .media[data-reveal] { transition-duration: .6s; transition-delay: calc(var(--i, 0) * 45ms); }
.motion .event .media[data-reveal] img { transition-duration: .8s, .9s, .6s; transition-delay: calc(var(--i, 0) * 45ms); }

/* ---------- Boutons & liens ---------- */
.btn {
  --bh: 56px; position: relative; isolation: isolate; overflow: hidden;
  display: inline-flex; align-items: center; justify-content: center; gap: 12px;
  min-height: var(--bh); padding: 0 30px;
  font: 500 13px/1 var(--f-text); letter-spacing: .14em; text-transform: uppercase; white-space: nowrap;
  transition: color .55s var(--ease), box-shadow .55s var(--ease), background-color .55s var(--ease), transform .5s var(--ease);
}
.btn::before { content: ""; position: absolute; inset: 0; z-index: -1; transform: translateY(101%); transition: transform .6s var(--ease); }
.btn:hover::before, .btn:focus-visible::before { transform: none; }
.btn .arr { width: 16px; height: 16px; transition: transform .5s var(--ease); }
.btn--gold { background: var(--gold); color: var(--dark); }
.btn--gold::before { background: var(--ink); }
.btn--line { box-shadow: inset 0 0 0 1px var(--line-2); color: var(--ink); }
.btn--line::before { background: var(--ink); }
.btn--line:hover, .btn--line:focus-visible { color: var(--dark); box-shadow: inset 0 0 0 1px var(--ink); }
.btn--sm { --bh: 44px; padding: 0 20px; font-size: 12px; letter-spacing: .12em; }
.btns { display: flex; flex-wrap: wrap; gap: 12px; }

.link {
  position: relative; display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 8px 0;
  font: 500 13px/1.4 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--ink);
  transition: color .35s;
}
.link::after { content: ""; position: absolute; left: 0; right: 0; bottom: 6px; height: 1px; background: currentColor; transform-origin: left; }
.link:hover { color: var(--gold); }
.link:hover::after { animation: underline .9s var(--ease-io); }
.link .arr { width: 15px; height: 15px; transition: transform .5s var(--ease); }
.link:hover .arr { transform: translateX(4px); }
.link--gold { color: var(--gold); }
.link--gold:hover { color: var(--ink); }
@keyframes underline {
  0% { transform: scaleX(1); transform-origin: right; }
  45% { transform: scaleX(0); transform-origin: right; }
  46% { transform: scaleX(0); transform-origin: left; }
  100% { transform: scaleX(1); transform-origin: left; }
}
.inline-link { color: var(--gold); background: linear-gradient(currentColor, currentColor) 0 100%/100% 1px no-repeat; transition: background-size .5s var(--ease), color .3s; }
.inline-link:hover { background-size: 0 1px; background-position: 100% 100%; }

/* ---------- Header ---------- */
.site-header {
  position: fixed; inset: 0 0 auto; z-index: 60; height: var(--header-h);
  display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-inline: var(--gutter);
  transition: transform .7s var(--ease), background-color .5s, box-shadow .5s, backdrop-filter .5s;
}
/* barre de programmation au-dessus de l'en-tête : sa hauteur entre dans --header-h, les mises en page suivent */
:root { --bar-h: 0px; }
html.has-topbar { --bar-h: 34px; --header-h: 114px; }
.site-header { top: var(--bar-h); height: calc(var(--header-h) - var(--bar-h)); }
.topbar { position: fixed; inset: 0 0 auto; z-index: 61; display: flex; align-items: stretch; height: var(--bar-h); background: var(--gold); color: #0A0908; font: 500 12px/1 var(--f-text); letter-spacing: .1em; text-transform: uppercase; }
.topbar__loop { flex: 1; min-width: 0; display: flex; }
.topbar__loop .loop__vp { flex: 1; display: flex; align-items: center; }
.topbar .loop__track { padding: 0; align-items: center; }
.topbar__i { flex: none; display: flex; align-items: center; }
/* séparateur entre deux soirées : une fine barre (le ✦ ressemblait à un point parasite) */
.topbar__i::after { content: ""; flex: none; width: 1px; height: 12px; margin: 0 20px; background: currentColor; opacity: .35; }
.topbar__i a { display: inline-flex; align-items: center; gap: 8px; min-height: var(--bar-h); color: inherit; white-space: nowrap; }
.topbar__i a:hover { text-decoration: underline; text-underline-offset: 3px; }
.topbar__i b { font-weight: 700; }
.topbar__i span { opacity: .7; }
.site-header.is-scrolled { background: rgba(10, 9, 8, .74); -webkit-backdrop-filter: blur(16px) saturate(1.2); backdrop-filter: blur(16px) saturate(1.2); box-shadow: inset 0 -1px 0 var(--line); }
.brand { flex: none; display: flex; align-items: center; min-height: 44px; min-width: 44px; transition: opacity .3s; }
.brand { gap: 14px; }
.brand img { height: 56px; width: auto; }
/* à côté de la tête : une petite barre, puis « restaurant, show & club » sur deux lignes */
.brand__sep { flex: none; width: 1px; height: 34px; background: rgba(253, 200, 82, .55); }
.brand__txt { font: 500 14px/1.2 var(--f-text); letter-spacing: .02em; color: var(--ink); white-space: nowrap; }
.brand__txt .serif { font-size: 1.15em; color: var(--gold); }
.brand:hover { opacity: .8; }
.nav { display: flex; gap: clamp(20px, 2.2vw, 38px); }
.nav a { position: relative; padding: 10px 0; font: 500 12.5px/1 var(--f-text); letter-spacing: .15em; text-transform: uppercase; color: var(--ink-2); white-space: nowrap; transition: color .3s; }
.nav a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 2px; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform .6s var(--ease); }
.nav a:hover { color: var(--ink); }
.nav a:hover::after, .nav a[aria-current="page"]::after { transform: scaleX(1); transform-origin: left; }
.nav a[aria-current="page"] { color: var(--gold); }
/* « Entreprises & groupes » est long : un peu moins d'espace entre les liens tant que le statut d'ouverture est affiché */
@media (max-width: 1400px) { .nav { gap: 20px; } .nav a { letter-spacing: .1em; } }
@media (max-width: 1300px) { .nav { gap: 15px; } }
.site-header__actions { display: flex; align-items: center; gap: 10px; }

.status { display: inline-flex; align-items: center; gap: 9px; margin-right: 10px; min-height: 44px; font: 500 12px/1 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-2); white-space: nowrap; }
.status i { width: 7px; height: 7px; border-radius: 50%; background: var(--ink-3); flex: none; }
.status.is-open { color: var(--gold); }
.status.is-open i { background: var(--gold); box-shadow: 0 0 0 0 rgba(253, 200, 82, .6); }
.motion .status.is-open i { animation: pulse 2.2s var(--ease) infinite; }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(253, 200, 82, .55); } 100% { box-shadow: 0 0 0 10px rgba(253, 200, 82, 0); } }

.burger { display: none; align-items: center; gap: 12px; min-height: 44px; padding: 0 4px 0 10px; font: 500 12px/1 var(--f-text); letter-spacing: .16em; text-transform: uppercase; }
.burger__lines { position: relative; width: 22px; height: 10px; }
.burger__lines i { position: absolute; left: 0; right: 0; height: 1.5px; background: currentColor; transition: transform .5s var(--ease), top .5s var(--ease); }
.burger__lines i:first-child { top: 0; }
.burger__lines i:last-child { top: 8.5px; }
.menu-open .burger__lines i:first-child { top: 4.25px; transform: rotate(45deg); }
.menu-open .burger__lines i:last-child { top: 4.25px; transform: rotate(-45deg); }

/* ---------- Menu mobile ---------- */
.menu {
  position: fixed; inset: 0; z-index: 55; background: var(--bg);
  display: flex; flex-direction: column; justify-content: space-between; gap: 40px;
  padding: calc(var(--header-h) + 24px) var(--gutter) 32px; overflow-y: auto;
  clip-path: inset(0 0 100% 0); visibility: hidden;
  transition: clip-path .8s var(--ease-io), visibility 0s .8s;
}
.menu-open .menu { clip-path: inset(0 0 0 0); visibility: visible; transition: clip-path .8s var(--ease-io), visibility 0s; }
.menu__list li { overflow: hidden; border-bottom: 1px solid var(--line); }
.menu__list a { display: flex; align-items: baseline; gap: 18px; padding: 14px 0; transform: translateY(100%); transition: transform .9s var(--ease), color .3s; transition-delay: calc(var(--i) * 60ms + 200ms); }
.menu-open .menu__list a { transform: none; }
.menu__label { font: 600 clamp(28px, 7.4vw, 60px)/1 var(--f-display); font-stretch: 112%; text-transform: uppercase; letter-spacing: -.025em; white-space: nowrap; }
.menu__list a[aria-current="page"], .menu__list a:hover { color: var(--gold); }
.menu__foot { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 20px; opacity: 0; transition: opacity .6s .5s; }
.menu-open .menu__foot { opacity: 1; }
.menu__foot a, .menu__foot span:not(.label) { font-size: 16px; }
.menu__adr .fsoc { margin-top: 12px; }

/* ---------- Hero (accueil) ---------- */
.hero { position: relative; height: 100svh; min-height: 640px; overflow: hidden; }
/* médias et voiles débordent de 2 px (rognés par .hero) : Safari laissait parfois une colonne de vidéo non voilée au bord gauche */
.hero__media { position: absolute; inset: 0 -2px; z-index: 0; }
.hero__media > * { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero__media video { opacity: 0; transition: opacity 1.2s var(--ease); }
.hero__media video.is-playing { opacity: 1; }
.motion .hero__media { transform: scale(1.12); transition: transform 2.6s var(--ease); }
.motion .is-ready .hero__media { transform: scale(1); }
.hero__shade { position: absolute; inset: 0 -2px; z-index: 1; transform: translateZ(0); background: linear-gradient(180deg, rgba(10, 9, 8, .72) 0%, rgba(10, 9, 8, .22) 30%, rgba(10, 9, 8, .38) 62%, var(--bg) 100%); }
.hero__dim { position: absolute; inset: 0 -2px; z-index: 1; transform: translateZ(0); background: var(--bg); opacity: var(--dim, 0); }
/* texte centré dans l'espace libre entre l'en-tête et le mot INDIAN'S (environ 17vw de haut) */
.hero__center { position: absolute; z-index: 2; left: 0; right: 0; top: calc((var(--header-h) + 100% - 17vw) / 2); transform: translateY(-50%); padding-inline: var(--gutter); text-align: center; }
.hero__center .eyebrow { margin-bottom: clamp(20px, 2.4vw, 32px); }
.hero__title { font-size: clamp(34px, 4.6vw, 76px); max-width: 16ch; margin-inline: auto; }
.hero__foot { position: absolute; z-index: 3; left: var(--gutter); right: var(--gutter); bottom: calc(17vw + clamp(16px, 2vw, 32px)); display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; }
.hero__next { display: flex; flex-direction: column; gap: 0; }
.hero__next .label { margin-bottom: 4px; }
.hero__next a { display: block; padding: 11px 0; font-size: 15px; line-height: 1.5; color: var(--ink); transition: color .3s; }
.hero__next a:hover { color: var(--gold); }
.hero__next a b { font-weight: 500; }
.hero__next a span { color: var(--ink-3); }
.hero__word { position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; display: flex; justify-content: center; align-items: flex-start; pointer-events: none; }
/* sortie du mot-symbole : il s'enfonce, rétrécit et se dissout par le bas (fondu progressif, jamais de coupe nette) */
.motion .hero__word {
  transform: translate3d(0, calc(var(--wp, 0) * 18%), 0) scale(calc(1 - var(--wp, 0) * .07));
  transform-origin: 50% 100%;
  -webkit-mask-image: linear-gradient(to top, transparent calc(var(--wp, 0) * 130% - 20%), #000 calc(var(--wp, 0) * 130% + 10%));
  mask-image: linear-gradient(to top, transparent calc(var(--wp, 0) * 130% - 20%), #000 calc(var(--wp, 0) * 130% + 10%));
  will-change: transform;
}
.motion .hero__word [data-letters].is-in .footer__reg { opacity: calc(1 - var(--wp, 0) * 3); transition: opacity .3s linear; }
.motion .hero__center, .motion .hero__foot { opacity: calc(1 - var(--wp, 0) * 1.35); }
.hero__word .footer__reg { font-size: 1.9vw; }
.hero__open { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; text-align: right; }
.hero__open .status { margin: 0; display: inline-flex; }

/* lettres (mot-symbole) */
[data-letters] .ch { display: inline-block; }
.motion [data-letters] .ch { transform: translateY(105%) skewY(4deg); transform-origin: left bottom; transition: transform 1.6s var(--ease); transition-delay: var(--d, 0ms); }
.motion [data-letters] .footer__reg { opacity: 0; transition: opacity 1s var(--ease) calc(var(--d, 0ms) + 700ms); }
.motion [data-letters].is-in .footer__reg { opacity: 1; }
.motion [data-letters].is-in .ch { transform: none; }
[data-letters] .wordmark { display: inline-flex; overflow: hidden; padding: 0 .04em; }

/* ---------- En-tête de page intérieure ---------- */
.phero { position: relative; padding-top: calc(var(--header-h) + clamp(72px, 10vw, 168px)); padding-bottom: clamp(56px, 7vw, 112px); }
.phero__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 40px; align-items: end; }
.phero__title { grid-column: 1 / span 8; }
.phero__title .eyebrow { margin-bottom: clamp(24px, 2.6vw, 36px); }
.phero__aside { grid-column: 9 / span 4; display: flex; flex-direction: column; gap: 28px; }
.phero__media { margin-top: clamp(56px, 7vw, 112px); aspect-ratio: 21 / 9; }
.phero--center { text-align: center; }
.phero--center .phero__grid { display: flex; flex-direction: column; align-items: center; }
.phero--center .lead { margin-inline: auto; }
.phero--center .btns { justify-content: center; }

/* hero photo pleine hauteur (Les Salles) */
.photo-hero { position: relative; height: clamp(620px, 92vh, 980px); overflow: hidden; }
/* la photo et le voile débordent de 2 px sur les côtés (rognés) : pas de colonne non voilée au bord (Safari) */
.photo-hero .media__inner { left: -2px !important; right: -2px !important; }
.photo-hero .media { position: absolute; inset: 0; }
.photo-hero__shade { position: absolute; inset: 0 -2px; z-index: 1; transform: translateZ(0); background: linear-gradient(180deg, rgba(10, 9, 8, .66) 0%, rgba(10, 9, 8, .12) 38%, rgba(10, 9, 8, .5) 70%, var(--bg) 100%); }
.photo-hero__content { position: absolute; z-index: 2; left: 0; right: 0; bottom: clamp(48px, 7vw, 110px); }
.photo-hero__content .phero__grid { align-items: end; }

/* ---------- Intro / chiffres ---------- */
.intro { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 40px; align-items: end; }
.intro__title { grid-column: 1 / span 7; }
.intro__title .eyebrow { margin-bottom: 28px; }
.intro__text { grid-column: 9 / span 4; display: flex; flex-direction: column; gap: 28px; }


/* ---------- Barre horaire ---------- */
.tl { margin-top: clamp(64px, 8vw, 120px); padding: clamp(24px, 3vw, 48px); background: var(--panel); box-shadow: inset 0 0 0 1px var(--line); }
/* les jours toujours sous le titre : leur place ne dépend plus de la longueur du nom de la soirée */
.tl__head { display: flex; flex-direction: column; align-items: flex-start; gap: clamp(20px, 2vw, 28px); margin-bottom: clamp(28px, 3vw, 44px); }
.tl__state { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.tl__state strong { font: 600 clamp(24px, 2.4vw, 36px)/1 var(--f-display); font-stretch: 112%; text-transform: uppercase; letter-spacing: -.02em; }
.tl__state strong.is-open { color: var(--gold); }
.tl__state p { color: var(--ink-2); font-size: 16px; }
.chips { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; max-width: 100%; padding: 2px; }
.chips::-webkit-scrollbar { display: none; }
.chip { flex: none; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 64px; min-height: 52px; padding: 9px 14px; box-shadow: inset 0 0 0 1px var(--line-2); transition: background-color .35s, color .35s, box-shadow .35s; }
.chip b { font: 600 12px/1 var(--f-text); letter-spacing: .12em; text-transform: uppercase; }
.chip span { font-size: 12px; line-height: 1; color: inherit; opacity: .7; font-variant-numeric: tabular-nums; }
.chip:hover { box-shadow: inset 0 0 0 1px var(--ink); }
.chip[aria-pressed="true"] { background: var(--gold); color: var(--dark); box-shadow: none; }
.tl__grid { display: grid; grid-template-columns: clamp(76px, 8vw, 120px) minmax(0, 1fr); gap: 10px clamp(12px, 1.6vw, 24px); align-items: center; }
.tl__ticks { position: relative; height: 16px; }
.tl__ticks span { position: absolute; top: 0; transform: translateX(-50%); font: 500 12px/1 var(--f-text); letter-spacing: .06em; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.tl__lk { font: 500 12px/1.3 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-2); }
.tl__lane { position: relative; height: var(--h, 52px); box-shadow: inset 0 0 0 1px var(--line); background: repeating-linear-gradient(90deg, var(--line) 0 1px, transparent 1px calc(100% / 17)); }
.tl__bar {
  position: absolute; display: flex; flex-direction: column; justify-content: center; gap: 3px; padding: 0 10px; overflow: hidden; text-align: left;
  color: var(--dark); background: var(--ink); transition: filter .3s, clip-path 1.1s var(--ease);
  clip-path: inset(0 0 0 0);
}
.tl__bar--club { background: var(--gold); }
.tl__bar:hover, .tl__bar:focus-visible { filter: brightness(1.12); }
.tl__bar:focus-visible { outline-offset: 2px; }
.motion .tl__bar.is-pre { clip-path: inset(0 100% 0 0); transition: none; }
.tl__bar b { font: 600 13px/1 var(--f-display); font-stretch: 105%; text-transform: uppercase; letter-spacing: -.01em; white-space: nowrap; }
.tl__bar small { font: 500 12px/1.1 var(--f-text); letter-spacing: .04em; white-space: nowrap; opacity: .78; }
/* nom d'une barre trop étroite, posé à côté d'elle dans l'espace libre */
.tl__lab { position: absolute; z-index: 1; display: flex; flex-direction: column; justify-content: center; gap: 3px; color: var(--ink); white-space: nowrap; cursor: pointer; }
.tl__lab--l { align-items: flex-end; text-align: right; }
.tl__lab b { font: 600 13px/1 var(--f-display); font-stretch: 105%; text-transform: uppercase; letter-spacing: -.01em; }
.tl__lab small { font: 500 12px/1.1 var(--f-text); letter-spacing: .04em; color: var(--ink-2); }
.tl__lab--below { flex-direction: row; align-items: baseline; gap: 8px; height: 18px; }
/* mobile, club : une ligne par créneau, le nom et les horaires au-dessus d'une bande dorée placée à la bonne heure */
.tl__bar--row { padding: 0; background: none; color: var(--ink); overflow: visible; justify-content: flex-start; }
.tl__row-lab { position: absolute; top: 2px; display: flex; align-items: baseline; gap: 8px; white-space: nowrap; }
.tl__row-lab small { color: var(--ink-2); opacity: 1; }
.tl__row-strip { position: absolute; bottom: 0; height: 18px; background: var(--gold); }
.tl__bar--row:hover, .tl__bar--row:focus-visible { filter: none; }
.tl__bar--row:hover .tl__row-strip, .tl__bar--row:focus-visible .tl__row-strip { filter: brightness(1.12); }
.tl__bar--row.is-picked { box-shadow: none; }
.tl__bar--row.is-picked .tl__row-strip { box-shadow: 0 0 0 2px var(--ink); }
.tl__empty { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); font: 500 12px/1 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); }
.tl__now { position: absolute; top: -8px; bottom: -8px; width: 1px; background: var(--ink); z-index: 3; pointer-events: none; }
.tl__now::before { content: ""; position: absolute; top: -3px; left: -3px; width: 7px; height: 7px; border-radius: 50%; background: var(--ink); }
.tl__phases { display: flex; justify-content: space-between; padding-top: 6px; }
.tl__phases span { font: 500 12px/1 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); }
.tl__foot { display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; margin-top: 28px; padding-top: 22px; border-top: 1px solid var(--line-gold); }
.tl__foot .tl__hint { font-size: 15.5px; color: var(--ink-2); max-width: 64ch; min-height: 1.7em; }

/* ---------- Bandeau défilant ---------- */
.marquee { position: relative; overflow: hidden; padding-block: clamp(24px, 3.4vw, 52px); border-block: 1px solid var(--line); }
.marquee__track { display: flex; width: max-content; will-change: transform; }
.marquee__group { display: flex; align-items: center; flex: none; }
.marquee__item { display: inline-flex; align-items: center; gap: .45em; padding-right: .45em; font: italic 800 clamp(52px, 8.4vw, 148px)/1 var(--f-display); letter-spacing: -.045em; text-transform: uppercase; white-space: nowrap; }
.marquee__item .serif { font-size: 1.05em; color: var(--gold); letter-spacing: -.02em; text-transform: none; }
.marquee__item .outline { color: transparent; -webkit-text-stroke: 1.2px var(--ink-2); }
.marquee__star { width: .32em; height: .32em; flex: none; color: var(--gold); }

/* ---------- Titre de section ---------- */
.shead { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; flex-wrap: wrap; margin-bottom: clamp(48px, 6vw, 96px); }
.shead__t { display: flex; flex-direction: column; gap: 26px; max-width: 900px; }
.shead__aside { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; max-width: 48ch; }

/* ---------- Cartes soirées ---------- */
.events { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(48px, 5vw, 80px) var(--gap); }
.event { position: relative; display: flex; flex-direction: column; }
.stretch { color: inherit; }
.stretch::after { content: ""; position: absolute; inset: 0; z-index: 4; }
.stretch:focus-visible { outline: none; }
.stretch:focus-visible::after { outline: 2px solid var(--gold); outline-offset: 6px; }
.stretch:hover { color: var(--gold); }
.room { position: relative; }
.room .stretch, .event .stretch { transition: color .3s; }
.event__media { aspect-ratio: 4 / 5; }
.event__media::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(10, 9, 8, .04) 40%, rgba(10, 9, 8, .82) 100%); opacity: .35; transition: opacity .7s var(--ease); pointer-events: none; }
.media__inner--flat { transition: transform 1.4s var(--ease); }
.event:hover .event__media .media__inner, .svc:hover .media__inner, .room:hover .media__inner { transform: scale(1.06); }
.event:hover .event__media::before { opacity: 1; }
.event__date { position: absolute; z-index: 3; top: 16px; left: 16px; display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 68px; padding: 12px 12px 10px; background: #F4EFE6; color: #15120E; }
.event__date b { font: 600 30px/1 var(--f-display); font-stretch: 110%; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.event__date span { font: 500 12px/1 var(--f-text); letter-spacing: .16em; text-transform: uppercase; color: rgba(21, 18, 14, .7); }
.event__tag { position: absolute; z-index: 3; top: 16px; right: 16px; padding: 8px 10px; background: var(--gold); color: var(--dark); font: 600 12px/1 var(--f-text); letter-spacing: .14em; text-transform: uppercase; }
.event:hover .event__panel, .event:focus-within .kv { display: flex; justify-content: space-between; gap: 16px; padding-top: 10px; border-top: 1px solid var(--line-2); font-size: 14.5px; }
.kv dt, .kv .k { color: var(--ink-3); font: 500 12px/1.7 var(--f-text); letter-spacing: .14em; text-transform: uppercase; }
.kv dd { margin: 0; text-align: right; }
.event__body { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 20px; padding-top: 22px; margin-top: 22px; border-top: 1px solid var(--line); }
.event__title { grid-column: 1; }
.event__price { grid-column: 2; font: 500 13px/1.5 var(--f-text); letter-spacing: .08em; color: var(--gold); text-align: right; white-space: nowrap; }
.event__when { grid-column: 1 / -1; font-size: 15.5px; color: var(--ink); }
.event__when b { font-weight: 500; color: var(--gold); }
.event__meta { grid-column: 1 / -1; font-size: 15px; color: var(--ink-2); }
/* âge en pastille après l'horaire */
.event__age { display: inline-flex; align-items: center; min-height: 20px; margin-left: 10px; padding: 0 7px; box-shadow: inset 0 0 0 1px var(--line-2); font-size: 12px; letter-spacing: .06em; color: var(--ink-2); vertical-align: 2px; }
.event:target .event__media { box-shadow: 0 0 0 2px var(--gold); }
.event:target .event__title { color: var(--gold); }
.filters { display: flex; flex-wrap: wrap; gap: 8px; margin: calc(clamp(48px, 6vw, 96px) * -0.5) 0 clamp(40px, 4vw, 64px); }
.filters button { display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 18px; box-shadow: inset 0 0 0 1px var(--line-2); font: 500 12.5px/1 var(--f-text); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); transition: background-color .35s, color .35s, box-shadow .35s; }
.filters button small { font: 500 12px/1 var(--f-text); letter-spacing: 0; opacity: .7; font-variant-numeric: tabular-nums; }
.filters button:hover:not(:disabled) { color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); }
.filters button[aria-pressed="true"] { background: var(--gold); color: var(--dark); box-shadow: none; }
.filters button:disabled { opacity: .4; cursor: not-allowed; }
.events__empty { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; padding: 32px 0; color: var(--ink-2); }
.events__note { margin-top: clamp(48px, 5vw, 72px); font-size: 15px; color: var(--ink-3); }
.event__meta b { font-weight: 500; color: var(--ink); }
.events__more { display: flex; justify-content: center; margin-top: clamp(56px, 6vw, 96px); }

/* ---------- Split image / texte ---------- */
.split { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 48px; align-items: center; }
.split__media { grid-column: 1 / span 6; aspect-ratio: 4 / 5; }
.split__text { grid-column: 8 / span 5; display: flex; flex-direction: column; gap: clamp(26px, 2.6vw, 38px); }
.split--rev .split__media { grid-column: 7 / span 6; order: 2; }
.split--rev .split__text { grid-column: 1 / span 5; }
/* accueil, restaurant : le texte au milieu, deux photos de chaque côté en quinconce (à leur format), plus large que la grille */
.tri { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr) minmax(0, 1fr); align-items: center; gap: clamp(24px, 3.4vw, 64px);
  width: min(100vw - 2 * var(--gutter), 1800px); margin-inline: calc(50% - min(50vw - var(--gutter), 900px)); }
.tri__side { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(10px, 1.1vw, 18px); align-items: start; }
.tri__ph { margin: 0; }
.tri__ph img { display: block; width: 100%; height: auto; }
.tri__ph--low { margin-top: clamp(48px, 8vw, 140px); }
.tri__text { display: flex; flex-direction: column; align-items: center; gap: clamp(22px, 2.2vw, 34px); text-align: center; }
.tri__text .display--l { font-size: clamp(40px, 4.6vw, 84px); }
.tri__text .body { max-width: 40ch; }
.tri__text .btns { justify-content: center; }
@media (max-width: 1080px) {
  .tri { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 48px; }
  .tri__text { grid-column: 1 / -1; order: -1; }
}
@media (max-width: 700px) { .tri { grid-template-columns: minmax(0, 1fr); } }
/* deux photos côte à côte, collées au bord gauche de l'écran (au-delà de la grille), la seconde plus petite et décalée vers le bas */
.split__duo { grid-column: 1 / span 7; margin-left: calc(-1 * (max(0px, (100vw - var(--max)) / 2) + var(--gutter))); margin-right: clamp(0px, 3vw, 56px); display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(12px, 1.6vw, 24px); align-items: start; }
.split__duo .split__media { grid-column: auto; aspect-ratio: 4 / 5; max-height: min(88svh, 860px); }
.split__media2 { aspect-ratio: 3 / 4; max-height: min(70svh, 660px); margin-top: clamp(56px, 11vw, 180px); }

/* ---------- Défilement horizontal (salles, accueil) ---------- */
.hscroll { position: relative; }
.hscroll:not(.is-pinned) { padding-block: var(--sec); }
.hscroll__meter { margin-top: clamp(28px, 3vw, 48px); }
.hscroll__sticky { position: relative; }
.hscroll__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; flex-wrap: wrap; margin-bottom: clamp(40px, 4vw, 64px); }
.hscroll__track { display: flex; gap: var(--gap); padding-inline: var(--gutter); scroll-padding-inline: var(--gutter); overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; }
.hscroll__track::-webkit-scrollbar { display: none; }
.hscroll__meter { display: flex; align-items: center; gap: 18px; font: 500 12px/1 var(--f-text); letter-spacing: .14em; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.hscroll__bar { position: relative; width: clamp(120px, 14vw, 220px); height: 1px; background: var(--line-2); }
.hscroll__bar i { position: absolute; inset: 0; background: var(--gold); transform: scaleX(var(--hp, .2)); transform-origin: left; }
.is-pinned .hscroll__sticky { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; justify-content: center; overflow: hidden; padding-top: var(--header-h); }
.is-pinned .hscroll__track { overflow: visible; scroll-snap-type: none; will-change: transform; align-items: flex-start; }
.is-pinned .room { width: clamp(300px, 27vw, 440px); }
.is-pinned .room__media { aspect-ratio: auto; height: clamp(260px, calc(100vh - 430px), 560px); }
.hscroll__intro { flex: none; scroll-snap-align: start; width: clamp(300px, 30vw, 460px); display: flex; flex-direction: column; justify-content: flex-end; gap: 26px; padding-right: clamp(20px, 4vw, 80px); }

.room { position: relative; flex: none; width: clamp(290px, 31vw, 500px); scroll-snap-align: start; display: flex; flex-direction: column; gap: 20px; }
.room__media { aspect-ratio: 4 / 5; }
.room__top { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; }
.room__num { font: 500 12px/1 var(--f-text); letter-spacing: .14em; color: var(--gold); }
.stackc__text .room__top { flex-wrap: wrap; align-items: center; row-gap: 8px; margin-bottom: 18px; }
.room__cap { font: 500 12px/1.3 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); }
.room p { color: var(--ink-2); font-size: 15.5px; line-height: 1.6; }

/* ---------- Services (La Table) ---------- */
.cards3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(40px, 4vw, 64px) var(--gap); }
.svc { display: flex; flex-direction: column; }
.svc__media { aspect-ratio: 1 / 1; }
.svc__body { display: flex; flex-direction: column; gap: 14px; padding-top: 26px; }
.svc__top { display: flex; justify-content: space-between; gap: 16px; align-items: baseline; }
.svc__top .price-tag { color: var(--gold); font: 500 13px/1.4 var(--f-text); letter-spacing: .08em; white-space: nowrap; }
.svc dl { margin: 6px 0 0; }

/* ---------- Grande déclaration + faits ---------- */
.statement { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 30px; margin-bottom: clamp(64px, 8vw, 128px); }
.statement .body { margin-inline: auto; }
.facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(32px, 6vw, 112px); max-width: 1240px; margin-inline: auto; }
.fact { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 20px; padding-block: clamp(28px, 3vw, 44px); border-top: 1px solid var(--line); }
.fact__n { font: 500 12.5px/1.8 var(--f-text); letter-spacing: .12em; color: var(--gold); font-variant-numeric: tabular-nums; }
.fact h3 { margin-bottom: 12px; }
.fact p { color: var(--ink-2); font-size: 15.5px; line-height: 1.6; }

/* ---------- Carrousel de cartes (glisser, flèches, clavier) ---------- */
.deck { position: relative; margin-inline: calc(var(--gutter) * -1); padding-top: clamp(16px, 3vw, 40px); overflow-x: clip; }
.deck__stage { position: relative; display: grid; justify-items: center; align-items: start; padding: 20px 0 clamp(56px, 6vw, 88px); touch-action: pan-y; user-select: none; -webkit-user-select: none; cursor: grab; }
.deck__stage.is-dragging { cursor: grabbing; }
.deck__card { grid-area: 1 / 1; width: clamp(290px, 27vw, 420px); transform-origin: 50% 85%; will-change: transform, opacity; }
.deck__link {
  position: relative; display: flex; flex-direction: column; gap: 16px; height: 100%;
  padding: clamp(22px, 2.2vw, 32px); background: var(--bg-raise-2); color: var(--ink);
  box-shadow: var(--shadow), inset 0 0 0 1px var(--line); -webkit-user-drag: none;
  transition: background-color .6s var(--ease), color .6s var(--ease), box-shadow .6s var(--ease), transform .6s var(--ease);
}
.deck__link::after { content: ""; position: absolute; inset: 0; background: var(--bg); opacity: calc(var(--dim, 0) * .4); pointer-events: none; }
.deck__link:focus-visible { outline: 2px solid var(--gold); outline-offset: 5px; }
.deck__top { display: flex; justify-content: space-between; gap: 12px; }
.deck__title { font: 600 clamp(26px, 2.4vw, 38px)/1 var(--f-display); font-stretch: 112%; text-transform: uppercase; letter-spacing: -.025em; }
.deck__cap { font: 500 12px/1.4 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); transition: color .6s; }
.deck__txt { font-size: 15px; line-height: 1.55; color: var(--ink-2); transition: color .6s; }
.deck__card .label { transition: color .6s; }
.deck__media { display: block; aspect-ratio: 4 / 3; margin-top: auto; }
.deck__media img { pointer-events: none; }
.deck__card.is-active .deck__link { background: var(--ink); color: var(--dark); box-shadow: 0 40px 90px rgba(0, 0, 0, .65); }
.deck__card.is-active .label, .deck__card.is-active .deck__cap, .deck__card.is-active .deck__txt { color: rgba(10, 9, 8, .72); }
.deck__card.is-active .deck__link:hover { transform: translateY(-8px); }
.deck__card.is-active .deck__link:hover .media__inner { transform: scale(1.05); }
.deck__card.is-active .deck__link:hover img { filter: saturate(1) contrast(1.02); }
.deck__card:not(.is-active) .deck__link { cursor: pointer; }
.deck__stage.is-dragging .deck__link { cursor: grabbing; }

.deck__ui { display: flex; align-items: center; justify-content: center; gap: 12px; padding-inline: var(--gutter); }
.deck__dots { display: flex; }
.deck__dots button { display: grid; place-items: center; width: 44px; height: 44px; }
.deck__dots i { display: block; width: 20px; height: 2px; background: var(--line-2); transition: width .5s var(--ease), background-color .4s; }
.deck__dots button:hover i { background: var(--ink-2); }
.deck__dots button[aria-current="true"] i { width: 34px; background: var(--gold); }
.deck__count { min-width: 64px; text-align: center; font: 500 12.5px/1 var(--f-text); letter-spacing: .12em; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.deck__count b { font-weight: 500; color: var(--gold); }
.deck__hint { margin-top: 14px; text-align: center; font-size: 14px; color: var(--ink-3); }
.icon-btn { display: inline-grid; place-items: center; width: 52px; height: 52px; flex: none; box-shadow: inset 0 0 0 1px var(--line-2); transition: background-color .35s, color .35s, box-shadow .35s; }
.icon-btn:hover { background: var(--ink); color: var(--dark); box-shadow: none; }
.icon-btn svg { width: 16px; height: 16px; }

/* ---------- Pile collante (Les Salles) ---------- */
.stackc { display: flex; flex-direction: column; gap: 6vh; }
.stackc__item { position: sticky; top: calc(var(--header-h) + 16px + var(--i) * 14px); height: min(76vh, 720px); min-height: 520px; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); background: var(--bg-raise); box-shadow: inset 0 0 0 1px var(--line), var(--shadow); overflow: hidden; transform-origin: 50% 0; transform: scale(calc(1 - var(--p, 0) * .06)); }
.stackc__item .media { height: 100%; }
.stackc__text { display: flex; flex-direction: column; justify-content: space-between; gap: 32px; padding: clamp(28px, 3.4vw, 56px); }
.stackc__text .body { font-size: 16px; }
.tags { display: flex; flex-wrap: wrap; gap: 8px; }
.tags span { padding: 8px 12px; box-shadow: inset 0 0 0 1px var(--line-2); font: 500 12px/1 var(--f-text); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); }
.bignum { font: 600 clamp(64px, 7vw, 120px)/.9 var(--f-display); font-stretch: 112%; letter-spacing: -.04em; color: var(--gold); }
.bignum small { display: inline-block; margin-left: 14px; font: 500 14px/1.3 var(--f-text); letter-spacing: .16em; text-transform: uppercase; color: var(--ink-3); }

/* ---------- Liste numérotée (équipements) ---------- */
.equip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--line); }
.equip__item { display: flex; flex-direction: column; gap: 14px; padding: clamp(28px, 3vw, 48px) clamp(20px, 2.4vw, 40px) clamp(28px, 3vw, 48px) 0; border-bottom: 1px solid var(--line); transition: background-color .5s; }
.equip__item:not(:nth-child(3n + 1)) { padding-left: clamp(20px, 2.4vw, 40px); border-left: 1px solid var(--line); }
.equip__item .fact__n { margin-bottom: 8px; }
.equip__item p { color: var(--ink-2); font-size: 16px; }

/* ---------- Panneaux ---------- */
.panel { background: var(--panel); box-shadow: inset 0 0 0 1px var(--line-gold); padding: clamp(36px, 5vw, 88px); }
.panel__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 36px; align-items: end; }
.panel__grid > :first-child { grid-column: 1 / span 7; display: flex; flex-direction: column; gap: 26px; }
.panel__grid > :last-child { grid-column: 9 / span 4; justify-self: end; }

/* ---------- Cartes horaires (Infos) ---------- */
.hours { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; background: var(--line); box-shadow: 0 0 0 1px var(--line); }
.hour { position: relative; display: flex; flex-direction: column; gap: 14px; padding: clamp(28px, 2.8vw, 44px) clamp(20px, 2vw, 32px); background: var(--bg); transition: background-color .5s; }
.hour:hover { background: var(--bg-raise); }
.hour p { color: var(--ink-2); font-size: 16px; }
.hour__now { position: absolute; top: 20px; right: 20px; display: inline-flex; align-items: center; gap: 8px; font: 500 12px/1 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--gold); }
.hour__now i { width: 6px; height: 6px; border-radius: 50%; background: var(--gold); }
.motion .hour__now i { animation: pulse 2.2s var(--ease) infinite; }

.map-split { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 40px; align-items: stretch; }
.map-split__text { grid-column: 1 / span 5; display: flex; flex-direction: column; justify-content: center; gap: 28px; }
.map-split__map { grid-column: 7 / span 6; position: relative; min-height: clamp(380px, 56vh, 620px); background: var(--bg-raise); box-shadow: inset 0 0 0 1px var(--line); }
.map-split--rev .map-split__text { grid-column: 8 / span 5; order: 2; }
.map-split--rev .map-split__map { grid-column: 1 / span 6; }
.map-split__map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; filter: saturate(.9); }
.kvs { border-bottom: 1px solid var(--line); }
.kvs .kv { padding-block: 14px; font-size: 16px; border-color: var(--line); }

/* ---------- FAQ ---------- */
.faq { max-width: 920px; border-bottom: 1px solid var(--line); }
.faq details { border-top: 1px solid var(--line); }
.faq summary { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: clamp(22px, 2.4vw, 32px) 0; cursor: pointer; list-style: none; font: 400 clamp(18px, 1.7vw, 23px)/1.4 var(--f-text); transition: color .3s; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary:hover { color: var(--gold); }
.plus { position: relative; flex: none; width: 40px; height: 40px; border-radius: 50%; box-shadow: inset 0 0 0 1px var(--line-2); transition: transform .6s var(--ease), background-color .4s, box-shadow .4s; }
.plus::before, .plus::after { content: ""; position: absolute; left: 50%; top: 50%; width: 13px; height: 1.4px; background: currentColor; transform: translate(-50%, -50%); transition: transform .6s var(--ease); }
.plus::after { transform: translate(-50%, -50%) rotate(90deg); }
details[open] .plus { transform: rotate(180deg); background: var(--gold); color: var(--dark); box-shadow: none; }
details[open] .plus::after { transform: translate(-50%, -50%) rotate(0deg); }
.faq__a { overflow: hidden; }
.faq__a p { padding-bottom: clamp(24px, 2.6vw, 36px); max-width: 70ch; color: var(--ink-2); font-size: 16px; line-height: 1.6; }

/* ---------- Clôture de page ---------- */
.closing { position: relative; padding-block: var(--sec); overflow: hidden; }
.closing::before { content: ""; position: absolute; inset: 0; z-index: -1; background: repeating-linear-gradient(90deg, rgba(244, 239, 230, .04) 0 1px, transparent 1px 22px); -webkit-mask-image: linear-gradient(180deg, transparent, #000 25%, #000 75%, transparent); mask-image: linear-gradient(180deg, transparent, #000 25%, #000 75%, transparent); }
.closing__t { font-size: clamp(36px, 11.4vw, 200px); white-space: nowrap; will-change: transform; }
.closing__t { width: fit-content; }
.closing--long .closing__t { font-size: clamp(30px, 9.2vw, 168px); }
.closing__t--b { text-align: right; margin-left: auto; }
.closing__mid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); margin-block: clamp(28px, 3vw, 48px); }
.closing__body { grid-column: 8 / span 5; display: flex; flex-direction: column; gap: 26px; }
.closing__body .kvs { margin-top: 4px; }

/* ---------- Footer ---------- */
.footer { position: relative; padding-top: clamp(80px, 9vw, 144px); border-top: 1px solid var(--line-gold); overflow: hidden; }
.footer__phone { display: block; font: 600 clamp(30px, 3.4vw, 54px)/1.05 var(--f-display); font-stretch: 110%; letter-spacing: -.025em; font-variant-numeric: tabular-nums; transition: color .35s; }
.footer__phone:hover { color: var(--gold); }
.footer__word { display: flex; justify-content: center; align-items: flex-start; padding-inline: 1vw; line-height: .8; }
.footer__reg { font: 500 1.9vw/1 var(--f-text); color: var(--gold); padding-top: .6em; flex: none; }
.footer__legal { display: flex; justify-content: space-between; gap: 12px 28px; flex-wrap: wrap; padding: 22px 0 30px; border-top: 1px solid var(--line); font: 500 12px/1.5 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); }

/* ---------- Curseur étiquette & toast ---------- */
.ctag { position: fixed; left: 0; top: 0; z-index: 110; pointer-events: none; padding: 12px 16px; background: var(--gold); color: var(--dark); font: 600 12px/1 var(--f-text); letter-spacing: .16em; text-transform: uppercase; border-radius: 999px; transform: translate3d(var(--x, -100px), var(--y, -100px), 0) translate(-50%, -50%) scale(var(--s, 0)); transition: transform .45s var(--ease); display: none; }
.has-pointer .ctag { display: block; }
.toast { position: fixed; left: 50%; bottom: calc(28px + var(--dock-h, 0px)); z-index: 130; padding: 14px 20px; background: var(--ink); color: var(--dark); font: 500 14px/1 var(--f-text); transform: translate(-50%, calc(100% + 40px)); visibility: hidden; transition: transform .6s var(--ease), visibility 0s .6s; pointer-events: none; }
.toast.is-shown { transform: translate(-50%, 0); visibility: visible; transition: transform .6s var(--ease), visibility 0s; }

/* ---------- Responsive ---------- */
@media (max-width: 1240px) {
  .nav { gap: 18px; }
  .nav a { font-size: 12px; letter-spacing: .12em; }
  .status { display: none; }
}
@media (max-width: 1080px) {
  .nav, .hide-md { display: none; }
  .burger { display: inline-flex; }
  .status { display: inline-flex; }
    .events, .cards3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .intro__title { grid-column: 1 / -1; }
  .intro__text { grid-column: 1 / span 8; }
  .phero__title { grid-column: 1 / -1; }
  .phero__aside { grid-column: 1 / span 8; }
  .split__media, .split--rev .split__media { grid-column: 1 / -1; order: 0; aspect-ratio: 4 / 3; }
  .split__text, .split--rev .split__text { grid-column: 1 / -1; }
  .split__duo { grid-column: 1 / -1; margin-right: 0; }
  .closing__body { grid-column: 4 / -1; }
  .hours { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .equip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .equip__item:not(:nth-child(3n + 1)) { padding-left: 0; border-left: 0; }
  .equip__item:nth-child(2n) { padding-left: clamp(20px, 2.4vw, 40px); border-left: 1px solid var(--line); }
  .map-split__text, .map-split--rev .map-split__text { grid-column: 1 / -1; order: 0; }
  .map-split__map, .map-split--rev .map-split__map { grid-column: 1 / -1; }
  .panel__grid > :first-child, .panel__grid > :last-child { grid-column: 1 / -1; justify-self: start; }
}
@media (max-width: 900px) {
  .stackc__item { position: relative; top: auto; height: auto; min-height: 0; grid-template-columns: 1fr; transform: none; }
  .stackc__item::after { display: none; }
  .stackc__item .media { aspect-ratio: 4 / 3; height: auto; }
  .stackc { gap: var(--gap); }
  .facts { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  :root { --header-h: 68px; }
  html.has-topbar { --bar-h: 30px; --header-h: 98px; }
  .topbar { font-size: 11px; }
  body { font-size: 16.5px; }
  .brand { gap: 10px; }
  .brand img { height: 44px; }
  .brand__sep { height: 28px; }
  .brand__txt { font-size: 12px; }
  .site-header__actions .status { display: none; }
  .site-header__actions .btn--gold { --bh: 44px; padding: 0 16px; font-size: 12px; }
  .burger__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .hscroll__intro { width: min(78vw, 320px); }
  .events, .cards3 { grid-template-columns: 1fr; }
  .intro__text, .phero__aside { grid-column: 1 / -1; }
  .hero__foot { flex-direction: column; align-items: flex-start; }
  .hero__foot   .phero__media { aspect-ratio: 4 / 3; }
  .closing__body { grid-column: 1 / -1; }
    .hours, .equip { grid-template-columns: 1fr; }
  .equip__item:nth-child(2n) { padding-left: 0; border-left: 0; }
  .tl__grid { grid-template-columns: 1fr; }
  .deck__count { display: none; }
  .deck__card { width: min(80vw, 340px); }
  .deck__ui { gap: 4px; }
  .tl__lk { margin-top: 10px; }
  .tl__grid > .tl__sp { display: none; }
    .btns .btn { flex: 1 1 auto; }
}

/* ---------- Mouvement réduit ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; transition-delay: 0s !important; scroll-behavior: auto !important; }
}

/* ---------- Impression ---------- */
@media print {
  .atmos, .site-header, .menu, .curtain, .ctag, .toast, video { display: none !important; }
  body { background: #fff; color: #000; }
}

@media (max-width: 720px) {
  .chips { -webkit-mask-image: linear-gradient(90deg, #000 82%, transparent); mask-image: linear-gradient(90deg, #000 82%, transparent); }
  }

/* =========================================================
   Pro & groupes
   ========================================================= */
[hidden] { display: none !important; }
:root { --danger: #FF9B8A; }

.proof { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: clamp(40px, 5vw, 72px); border-top: 1px solid var(--line-2); }
.proof li { display: flex; flex-direction: column; gap: 8px; padding: 22px 20px 0 0; }
.proof li + li { padding-left: 20px; border-left: 1px solid var(--line); }
.proof b { font: 600 clamp(28px, 2.8vw, 44px)/1 var(--f-display); font-stretch: 110%; letter-spacing: -.02em; }
.proof span { font: 500 12px/1.4 var(--f-text); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); }

/* onglets */
.tabs__list { position: relative; display: inline-flex; gap: 8px; margin-bottom: clamp(32px, 4vw, 56px); border-bottom: 1px solid var(--line); max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.tabs__list [role="tab"] { min-height: 52px; padding: 0 20px; font: 500 13px/1 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); white-space: nowrap; transition: color .35s; }
.tabs__list [role="tab"]:hover { color: var(--ink); }
.tabs__list [role="tab"][aria-selected="true"] { color: var(--gold); }
.tabs__list [role="tab"]:focus-visible { outline-offset: -4px; }
.tabs__ink { position: absolute; left: 0; bottom: 0; height: 2px; width: 0; background: var(--gold); transition: transform .6s var(--ease), width .6s var(--ease); }
.tabs__panel:focus-visible { outline-offset: 12px; }

.occ { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gap); }
.occ__card { display: flex; flex-direction: column; gap: 16px; padding: clamp(24px, 2.4vw, 36px); background: var(--panel); box-shadow: inset 0 0 0 1px var(--line); transition: box-shadow .5s var(--ease), transform .7s var(--ease), opacity .7s var(--ease); transition-delay: calc(var(--i, 0) * 70ms); }
.occ__card:hover { box-shadow: inset 0 0 0 1px var(--line-gold); transform: translateY(-4px); transition-delay: 0s; }
.motion .occ__card.is-pre { opacity: 0; transform: translateY(18px); transition: none; }
.occ__n { font: 500 12.5px/1 var(--f-text); letter-spacing: .12em; color: var(--gold); }
.occ__card p { color: var(--ink-2); font-size: 15.5px; line-height: 1.6; }
.occ__card dl { margin: 4px 0 0; }
.occ__card .link { margin-top: auto; align-self: flex-start; }

/* déroulé */
.steps { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gap); padding-top: 44px; }
.steps::before, .steps::after { content: ""; position: absolute; left: 0; right: 0; top: 6px; height: 1px; background: var(--line-2); }
.steps::after { background: var(--gold); transform: scaleX(var(--sp, 0)); transform-origin: left; }
.step { position: relative; display: flex; flex-direction: column; gap: 14px; padding-right: 12px; }
.step::before { content: ""; position: absolute; left: 0; top: -44px; width: 13px; height: 13px; border-radius: 50%; background: var(--bg); box-shadow: inset 0 0 0 1px var(--line-2); transition: background-color .5s var(--ease), box-shadow .5s var(--ease); z-index: 1; }
.step.is-on::before { background: var(--gold); box-shadow: 0 0 0 6px rgba(253, 200, 82, .14); }
.step__n { font: 500 12.5px/1 var(--f-text); letter-spacing: .12em; color: var(--ink-3); transition: color .5s; }
.step.is-on .step__n { color: var(--gold); }
.step p { color: var(--ink-2); font-size: 15.5px; line-height: 1.6; }

/* comparatif */
.compare { margin-top: clamp(64px, 7vw, 112px); }
.compare table { width: 100%; border-collapse: collapse; font-size: 16px; }
.compare caption { text-align: left; padding-bottom: 20px; font: 500 12.5px/1.3 var(--f-text); letter-spacing: .2em; text-transform: uppercase; color: var(--gold); }
.compare th, .compare td { padding: 18px 20px 18px 0; text-align: left; border-bottom: 1px solid var(--line); vertical-align: baseline; }
.compare thead th { font: 500 12px/1.3 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); border-bottom-color: var(--line-2); }
.compare tbody th { font: 600 18px/1.2 var(--f-display); font-stretch: 105%; text-transform: uppercase; letter-spacing: -.01em; }
.compare tbody th a { transition: color .3s; }
.compare tbody th a:hover { color: var(--gold); }
.compare td { color: var(--ink-2); }
.compare tbody tr { transition: background-color .3s; }
.compare tbody tr:hover { background: rgba(244, 239, 230, .03); }

/* devis */
.quote { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 48px; align-items: start; }
.quote__intro { grid-column: 1 / span 4; display: flex; flex-direction: column; gap: 28px; position: sticky; top: calc(var(--header-h) + 32px); }
.quote__alt { display: flex; flex-direction: column; gap: 8px; padding-top: 24px; border-top: 1px solid var(--line); }
.quote__alt .footer__phone { font-size: clamp(26px, 2.4vw, 36px); }
.quote__alt .muted { font-size: 15px; }
.form { grid-column: 6 / span 7; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 20px; padding: clamp(24px, 3vw, 48px); background: var(--panel); box-shadow: inset 0 0 0 1px var(--line); }
.field { display: flex; flex-direction: column; gap: 10px; min-width: 0; margin: 0; padding: 0; border: 0; }
.field--full { grid-column: 1 / -1; }
.field label, .field legend { padding: 0; font: 500 12.5px/1.3 var(--f-text); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); }
.field legend { margin-bottom: 10px; }
.req { color: var(--gold); }
/* un fieldset s'élargit par défaut à son contenu (option la plus longue d'une liste) : il reste dans sa colonne */
fieldset { min-width: 0; min-inline-size: 0; }
.field select { max-width: 100%; text-overflow: ellipsis; }
/* champs date : Safari (iPhone) leur donne une largeur minimale et son propre style ; on garde le cadre des autres champs */
.field input[type="date"], .field input[type="time"] { -webkit-appearance: none; appearance: none; display: block; min-width: 0; max-width: 100%; text-align: left; }
.field input[type="date"]::-webkit-date-and-time-value, .field input[type="time"]::-webkit-date-and-time-value { text-align: left; margin: 0; }
.field input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(.8); cursor: pointer; }
.field input, .field select, .field textarea {
  width: 100%; min-height: 54px; padding: 14px 16px; border: 0; border-radius: 0; background: var(--field);
  box-shadow: inset 0 0 0 1px var(--line-2); color: var(--ink); font: 400 17px/1.4 var(--f-text);
  transition: box-shadow .3s, background-color .3s;
}
.field textarea { resize: vertical; min-height: 120px; line-height: 1.6; }
.field select { appearance: none; -webkit-appearance: none; padding-right: 44px; cursor: pointer; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 6l5 5 5-5' fill='none' stroke='%23F4EFE6' stroke-width='1.4'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; background-size: 14px; }
.field select option { background: var(--bg-raise); color: var(--ink); }
.field input:hover, .field select:hover, .field textarea:hover { box-shadow: inset 0 0 0 1px var(--ink-3); }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; background-color: var(--field-focus); box-shadow: inset 0 0 0 2px var(--gold); }
.field__help { font-size: 14px; line-height: 1.5; color: var(--ink-3); }
.field__err { font-size: 14px; line-height: 1.5; color: var(--danger); }
.field__err:empty { display: none; }
.field.is-invalid input, .field.is-invalid select, .field.is-invalid textarea { box-shadow: inset 0 0 0 2px var(--danger); }

.choice { display: flex; flex-wrap: wrap; gap: 8px; }
.choice label { position: relative; cursor: pointer; max-width: 100%; }
.choice input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.choice span { display: inline-flex; align-items: center; min-height: 48px; padding: 10px 20px; line-height: 1.25 !important; box-shadow: inset 0 0 0 1px var(--line-2); font: 400 16px/1 var(--f-text); color: var(--ink-2); transition: background-color .3s, color .3s, box-shadow .3s; }
.choice label:hover span { box-shadow: inset 0 0 0 1px var(--ink); color: var(--ink); }
.choice input:checked + span { background: var(--gold); color: var(--dark); box-shadow: none; }
.choice input:focus-visible + span { outline: 2px solid var(--gold); outline-offset: 3px; }

.form__summary { grid-column: 1 / -1; padding: 20px 22px; box-shadow: inset 3px 0 0 var(--danger), inset 0 0 0 1px rgba(255, 155, 138, .35); background: rgba(255, 155, 138, .06); }
.form__summary:focus { outline: none; box-shadow: inset 3px 0 0 var(--danger), inset 0 0 0 2px var(--danger); }
.form__summary p { margin-bottom: 10px; }
.form__summary li { padding: 4px 0; }
.form__summary a { color: var(--danger); text-decoration: underline; text-underline-offset: 3px; font-size: 15.5px; }
.form__foot { display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; padding-top: 8px; }
.form__foot .muted { font-size: 14px; max-width: 42ch; }
.drawer .form__foot .muted { max-width: none; }
/* Cloudflare Turnstile : invisible sauf en cas de doute, alors sur toute la largeur au-dessus du bouton d'envoi */
.ts-box { flex: none; width: 100%; }   /* en mode invisible : aucune hauteur, le bouton d'envoi reste à sa place */
.ts-box:empty { display: none; }   /* dans le volet : la note prend toute la largeur */
.form.is-sending [type="submit"] { opacity: .7; cursor: progress; }
.form__done { grid-column: 1 / -1; display: flex; flex-direction: column; align-items: flex-start; gap: 20px; padding: 12px 0; }
.form__done:focus { outline: none; }
.motion .form__done:not([hidden]) { animation: done-in .9s var(--ease) both; }
@keyframes done-in { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }

@media (max-width: 1080px) {
  .occ { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .quote__intro { grid-column: 1 / -1; position: static; }
  .form { grid-column: 1 / -1; }
  .proof { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .proof li:nth-child(3) { border-left: 0; padding-left: 0; }
}
@media (max-width: 720px) {
  .occ { grid-template-columns: 1fr; }
  .form { grid-template-columns: minmax(0, 1fr); padding: 22px 18px; }
  .proof li { padding-right: 12px; }
  .proof li + li { padding-left: 12px; }
  .steps { grid-template-columns: 1fr; padding-top: 0; padding-left: 36px; gap: 36px; }
  .steps::before, .steps::after { left: 6px; right: auto; top: 0; bottom: 0; width: 1px; height: auto; }
  .steps::after { transform: scaleY(var(--sp, 0)); transform-origin: top; }
  .step::before { left: -36px; top: 2px; }
  .compare thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .compare tr { display: block; padding: 18px 0; border-bottom: 1px solid var(--line); }
  .compare th, .compare td { display: flex; justify-content: space-between; gap: 16px; padding: 6px 0; border: 0; }
  .compare td::before { content: attr(data-label); font: 500 12px/1.6 var(--f-text); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); flex: none; }
  .compare td { text-align: right; }
  .form__foot .btn { width: 100%; }
  .photo-hero { height: auto; min-height: 100svh; }
  .photo-hero__content { position: relative; bottom: auto; padding: calc(var(--header-h) + 96px) 0 48px; }
  .tabs__list { display: grid; grid-template-columns: 1fr 1fr; width: 100%; gap: 0; }
  .tabs__list [role="tab"] { padding: 8px 10px; white-space: normal; line-height: 1.3; letter-spacing: .1em; }
}

/* zones tactiles des petits liens (salle conseillée, tableau, téléphone) */
.occ__card dd a, .compare tbody th a { display: inline-block; padding: 12px 0; margin: -12px 0; }
.quote__alt .footer__phone { padding: 8px 0; }

/* =========================================================
   Navette & contact
   ========================================================= */
:root { --ok: #9BD9A8; }
.proof--plain { margin-top: clamp(56px, 7vw, 104px); }
.steps--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }


/* réservation */
.book { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 32px; align-items: start; }
.form--book { grid-column: 1 / span 8; grid-template-columns: minmax(0, 1fr); gap: 20px; }
.step-block { padding: 24px 0 28px; border-top: 1px solid var(--line) !important; }
.step-block:first-of-type { border-top: 0 !important; padding-top: 0; }
.step-block > legend { display: flex; align-items: center; gap: 12px; float: left; width: 100%; margin-bottom: 18px; font: 600 clamp(18px, 1.6vw, 22px)/1.2 var(--f-display); font-stretch: 105%; letter-spacing: -.01em; text-transform: uppercase; color: var(--ink); }
.step-block > legend + * { clear: both; }
.step-block__n { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; box-shadow: inset 0 0 0 1px var(--line-2); font: 500 13px/1 var(--f-text); color: var(--ink-2); transition: background-color .4s, color .4s, box-shadow .4s; }
.step-block.is-done .step-block__n { background: var(--gold); color: var(--dark); box-shadow: none; }
.book__row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 20px; }
.book__row--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 0; }
.book__row .field--full { grid-column: 1 / -1; }

.nights { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 14px; }
.night { position: relative; cursor: pointer; }
.field label.night { font: inherit; letter-spacing: normal; text-transform: none; color: inherit; }
.night input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.night__in { display: flex; flex-direction: column; gap: 6px; height: 100%; padding: 16px; box-shadow: inset 0 0 0 1px var(--line-2); transition: background-color .3s, box-shadow .3s, color .3s; }
.night:hover .night__in { box-shadow: inset 0 0 0 1px var(--ink); }
.night__d { font: 500 12.5px/1 var(--f-text); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); }
.night__d b { font: 600 22px/1 var(--f-display); letter-spacing: -.02em; color: var(--ink); }
.night__t { font-size: 16px; line-height: 1.35; color: var(--ink); }
.night__c { font-size: 13.5px; color: var(--ink-3); }
.night input:checked + .night__in { background: var(--gold); box-shadow: none; }
.night input:checked + .night__in * { color: var(--dark); }
.night input:focus-visible + .night__in { outline: 2px solid var(--gold); outline-offset: 3px; }
.night.is-late { cursor: not-allowed; }
.night.is-late .night__in { opacity: .45; background: repeating-linear-gradient(135deg, rgba(244, 239, 230, .04) 0 8px, transparent 8px 16px); }
.night.is-late:hover .night__in { box-shadow: inset 0 0 0 1px var(--line-2); }
.step-block.is-invalid .nights .night:not(.is-late) .night__in { box-shadow: inset 0 0 0 1px var(--danger); }

.stepper { display: grid; grid-template-columns: 54px minmax(0, 1fr) 54px; box-shadow: inset 0 0 0 1px var(--line-2); }
.stepper button { min-height: 54px; font: 400 22px/1 var(--f-text); color: var(--ink); transition: background-color .3s; }
.stepper button:hover { background: rgba(244, 239, 230, .08); }
.stepper input { min-height: 54px; text-align: center; box-shadow: none !important; background: transparent !important; font-variant-numeric: tabular-nums; -moz-appearance: textfield; }
.stepper input::-webkit-outer-spin-button, .stepper input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.stepper:focus-within { box-shadow: inset 0 0 0 2px var(--gold); }

.recap { grid-column: 9 / span 4; position: sticky; top: calc(var(--header-h) + 32px); display: flex; flex-direction: column; gap: 18px; padding: clamp(22px, 2.4vw, 36px); background: var(--panel); box-shadow: inset 0 0 0 1px var(--line-gold); }
.recap .kv dd { max-width: 60%; }
.recap__progress { font: 500 12.5px/1 var(--f-text); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); }
.recap__progress span { color: var(--gold); }
.recap__bar { height: 2px; background: var(--line-2); overflow: hidden; }
.recap__bar i { display: block; height: 100%; background: var(--gold); transform: scaleX(0); transform-origin: left; transition: transform .7s var(--ease); }

/* contact */
.channels { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; background: var(--line); box-shadow: 0 0 0 1px var(--line); }
.channel { display: flex; flex-direction: column; gap: 16px; padding: clamp(26px, 2.6vw, 40px) clamp(20px, 2vw, 30px); background: var(--bg); transition: background-color .5s; }
.channel:hover { background: var(--bg-raise); }
.channel__big { font: 600 clamp(26px, 2.3vw, 36px)/1.05 var(--f-display); font-stretch: 110%; letter-spacing: -.02em; font-variant-numeric: tabular-nums; transition: color .3s; }
.channel__big:hover { color: var(--gold); }
.channel__big--txt { text-transform: uppercase; }
.channel p { font-size: 15.5px; line-height: 1.6; color: var(--ink-2); }
.channel__acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; }
.hint { margin-top: 4px; padding: 14px 16px; font-size: 15px; line-height: 1.6; background: rgba(253, 200, 82, .07); box-shadow: inset 3px 0 0 var(--gold); color: var(--ink); }

@media (max-width: 1080px) {
  .form--book, .recap { grid-column: 1 / -1; }
  .recap { display: none; }
  .channels { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nights { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .steps--3 { grid-template-columns: 1fr; }
  .book__row, .book__row--2 { grid-template-columns: 1fr; }
  .channels { grid-template-columns: 1fr; }

}

/* =========================================================
   La carte (food & drinks)
   ========================================================= */
.svc { position: relative; }
.carte__demo { margin-bottom: clamp(28px, 3vw, 40px); padding: 14px 18px; font-size: 15px; line-height: 1.6; background: rgba(253, 200, 82, .07); box-shadow: inset 3px 0 0 var(--gold); color: var(--ink-2); }
.carte__demo b { color: var(--ink); font-weight: 500; }
.carte__demo code { font-size: 14px; color: var(--gold); }
.carte__bar { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px 28px; flex-wrap: wrap; margin-bottom: clamp(36px, 4vw, 60px); border-bottom: 1px solid var(--line); }
.carte__bar .tabs__list { margin-bottom: -1px; border-bottom: 0; }
.tabs__list--scroll { flex-wrap: nowrap; }
.carte__sep { flex: none; align-self: center; width: 1px; height: 22px; margin: 0 10px; background: var(--line-2); }
.carte__panel:focus-visible { outline-offset: 12px; }
.carte__print-title { display: none; }
.carte__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px 32px; flex-wrap: wrap; margin-bottom: clamp(28px, 3vw, 44px); }
.carte__head p { max-width: 70ch; font-size: 16px; line-height: 1.6; color: var(--ink-2); }
.carte__formules { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 1px; margin-bottom: clamp(40px, 4vw, 64px); background: var(--line-gold); box-shadow: 0 0 0 1px var(--line-gold); }
.carte__formule { display: flex; justify-content: space-between; align-items: baseline; gap: 20px; padding: 22px 26px; background: var(--bg-raise); font-size: 16.5px; }
.carte__formule b { font: 600 clamp(30px, 3vw, 44px)/1 var(--f-display); font-stretch: 110%; letter-spacing: -.02em; color: var(--gold); white-space: nowrap; }
.carte__grid { columns: 2; column-gap: clamp(40px, 6vw, 112px); }
.carte__sec { break-inside: avoid; margin-bottom: clamp(40px, 4vw, 56px); }
.carte__sec-t { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin: 0; padding-bottom: 14px; border-bottom: 1px solid var(--line-gold); font: 600 clamp(18px, 1.6vw, 22px)/1.1 var(--f-display); font-stretch: 105%; text-transform: uppercase; letter-spacing: -.005em; }
.carte__cols { display: flex; gap: 8px; }
.carte__cols span, .carte__price span { width: 76px; text-align: right; white-space: nowrap; }
.carte__cols span { font: 500 11.5px/1.3 var(--f-text); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-3); }
.carte__item { padding: 16px 0; border-bottom: 1px solid var(--line); }
.carte__row { display: flex; align-items: baseline; gap: 12px; }
.carte__name { font: 500 17.5px/1.35 var(--f-text); color: var(--ink); }
.carte__dots { flex: 1; min-width: 20px; border-bottom: 1px dotted var(--line-2); transform: translateY(-5px); }
.carte__price { display: flex; gap: 8px; flex: none; font: 500 16.5px/1.35 var(--f-text); color: var(--gold); font-variant-numeric: tabular-nums; white-space: nowrap; }
.carte__desc { margin-top: 4px; max-width: 52ch; font-size: 15px; line-height: 1.6; color: var(--ink-2); }
.carte__tags { display: inline-flex; gap: 5px; margin-left: 10px; vertical-align: 2px; }
.tag { display: inline-flex; align-items: center; min-height: 20px; padding: 0 6px; box-shadow: inset 0 0 0 1px var(--line-2); font: 500 11px/1 var(--f-text); font-size: 12px; letter-spacing: .06em; color: var(--ink-2); }
.tag--v { box-shadow: inset 0 0 0 1px rgba(155, 217, 168, .55); color: var(--ok); }
.tag--maison { box-shadow: inset 0 0 0 1px var(--line-gold); color: var(--gold); }
.tag--new { background: var(--gold); box-shadow: none; color: var(--dark); font-weight: 600; }
.carte__foot { display: flex; justify-content: space-between; gap: 12px 32px; flex-wrap: wrap; padding-top: 24px; border-top: 1px solid var(--line); }
.carte__legend { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 24px; font-size: 14px; color: var(--ink-3); }
.carte__leg { display: inline-flex; align-items: center; gap: 7px; }
/* coup de cœur : un petit cœur rouge, sans cadre */
.tag--coeur { min-height: 0; padding: 0; box-shadow: none; color: #C8323C; }
.tag--coeur svg { display: block; width: 15px; height: 15px; }
.carte__tags .tag--coeur { position: relative; top: 2px; }
.carte__note { font-size: 14px; color: var(--ink-3); }

@media (max-width: 900px) {
  .carte__grid { columns: 1; }
}
/* deux colonnes posées par le script quand une photo comble le trou de la plus courte (js : fillHoles) */
.carte__grid.is-split { columns: auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(40px, 6vw, 112px); }
.carte__colw { display: flex; flex-direction: column; min-width: 0; }
.carte__colw > :last-child { margin-bottom: 0; }
/* photos à leur format : colonnes et rangées posées par main.js */
.carte__ph { flex: 1 1 0; display: grid; align-content: start; gap: 6px; min-height: 170px; margin: 0 0 clamp(40px, 4vw, 56px); }
.carte__ph img { width: 100%; height: 100%; object-fit: cover; background: var(--bg-raise); }
/* pas de place à côté des rubriques : deux photos sous chaque colonne, à leur format */
.carte__phrow { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(40px, 6vw, 112px); margin: clamp(32px, 3vw, 48px) 0 0; }
.carte__phrow > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; align-content: start; }
.carte__phrow img { display: block; width: 100%; height: auto; background: var(--bg-raise); }
@media (max-width: 720px) {
  .tabs__list.tabs__list--scroll { display: flex; width: calc(100% + var(--gutter) * 2); min-width: 0; margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); max-width: none; -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
  .tabs__list--scroll [role="tab"] { white-space: nowrap; padding: 0 14px; }
  .carte__bar { flex-direction: column; align-items: stretch; }
  .carte__cols span, .carte__price span { width: 64px; }
  .carte__formule { flex-direction: column; gap: 10px; }
}

/* impression de la carte seule, sur fond clair */
@media print {
  .print-carte body { background: #fff !important; color: #111 !important; font-size: 11pt; }
  .print-carte main > section:not(#carte), .print-carte .footer, .print-carte .curtain, .print-carte .atmos { display: none !important; }
  .print-carte #carte { padding: 0 !important; border: 0 !important; }
  .print-carte #carte .shead__aside, .print-carte .carte__bar, .print-carte .carte__demo { display: none !important; }
  .print-carte #carte * { color: #111 !important; opacity: 1 !important; transform: none !important; clip-path: none !important; }
  .print-carte .carte__panel[hidden] { display: block !important; }
  .print-carte .carte__panel { break-before: page; }
  .print-carte .carte__panel:first-of-type { break-before: auto; }
  .print-carte .carte__print-title { display: block; margin: 0 0 16px; font: 600 22pt/1 var(--f-display); text-transform: uppercase; }
  .print-carte .carte__formule { background: #f4f1ea !important; }
  .print-carte .carte__item, .print-carte .carte__sec-t { border-color: #ccc !important; }
  .print-carte .carte__item[hidden], .print-carte .carte__sec[hidden] { display: block !important; }
}

/* =========================================================
   Réserver une table (volet latéral)
   ========================================================= */
.drawer { position: fixed; inset: 0; z-index: 140; }
/* connecté à WordPress : le volet commence sous la barre d'administration (fixe au-dessus de 600 px) */
.admin-bar .drawer { top: 32px; }
@media (max-width: 782px) { .admin-bar .drawer { top: 46px; } }
@media (max-width: 600px) { .admin-bar .drawer { top: 0; } }
.drawer__backdrop { position: absolute; inset: 0; background: rgba(5, 5, 4, .72); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); opacity: 0; transition: opacity .5s var(--ease); }
.drawer__panel {
  position: absolute; top: 0; right: 0; bottom: 0; width: min(600px, 100%); overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain;
  display: flex; flex-direction: column; gap: 20px; padding: clamp(24px, 3vw, 44px);
  background: var(--bg-raise); box-shadow: -30px 0 80px rgba(0, 0, 0, .5), inset 1px 0 0 var(--line-gold);
  transform: translateX(104%); transition: transform .6s var(--ease);
}
.drawer.is-open .drawer__backdrop { opacity: 1; }
.drawer.is-open .drawer__panel { transform: none; }
.drawer__panel:focus { outline: none; }
.drawer__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; }
.drawer__head .eyebrow { margin-bottom: 14px; }
.drawer__close { position: relative; flex: none; width: 48px; height: 48px; border-radius: 50%; box-shadow: inset 0 0 0 1px var(--line-2); transition: background-color .3s, color .3s, transform .5s var(--ease); }
.drawer__close::before, .drawer__close::after { content: ""; position: absolute; left: 50%; top: 50%; width: 16px; height: 1.5px; background: currentColor; transform: translate(-50%, -50%) rotate(45deg); }
.drawer__close::after { transform: translate(-50%, -50%) rotate(-45deg); }
.drawer__close:hover { background: var(--ink); color: var(--dark); transform: rotate(90deg); }
/* le téléphone en second, sous le formulaire : pour la dernière minute */
.drawer__alt { margin-top: 4px; font-size: 14px; color: var(--ink-3); }
/* « Dernière minute : 04… » sous les boutons de réservation en ligne */
.tel-urg { margin-top: 14px; font-size: 14px; color: var(--ink-3); }
.finfo__urg { margin-top: 14px; font-size: 13px; line-height: 1.6; color: var(--ink-3); }
.finfo__urg a { color: var(--ink-2); white-space: nowrap; }
.finfo__urg a:hover { color: var(--gold); }
.menu__bk { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.form--drawer { grid-template-columns: minmax(0, 1fr); padding: 0; background: none; box-shadow: none; gap: 8px; }
.form--drawer .step-block { padding: 20px 0 22px; }

.days-pick { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; margin-inline: calc(clamp(24px, 3vw, 44px) * -1); padding: 2px clamp(24px, 3vw, 44px) 4px; scroll-padding-inline: clamp(24px, 3vw, 44px); scroll-snap-type: x proximity; }
.days-pick::-webkit-scrollbar { display: none; }
.slots-pick { display: grid; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: 6px; margin-top: 14px; }
.pick { position: relative; cursor: pointer; scroll-snap-align: start; }
.pick input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.field label.pick { font: inherit; letter-spacing: normal; text-transform: none; color: inherit; }
.pick span { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; min-width: 70px; min-height: 60px; padding: 8px 12px; box-shadow: inset 0 0 0 1px var(--line-2); transition: background-color .3s, color .3s, box-shadow .3s; }
.pick b { font: 500 12.5px/1 var(--f-text); letter-spacing: .1em; text-transform: uppercase; }
.pick i { font-style: normal; font-size: 14px; color: var(--ink-2); white-space: nowrap; }
.pick b { white-space: nowrap; }
.pick--slot span { min-height: 48px; }
.pick--slot b { font: 500 15px/1 var(--f-text); letter-spacing: .02em; text-transform: none; font-variant-numeric: tabular-nums; }
.pick:hover span { box-shadow: inset 0 0 0 1px var(--ink); }
.pick input:checked + span { background: var(--gold); box-shadow: none; }
.pick input:checked + span b, .pick input:checked + span i { color: var(--dark); }
.pick input:focus-visible + span { outline: 2px solid var(--gold); outline-offset: 3px; }
.step-block.is-invalid .pick span { box-shadow: inset 0 0 0 1px var(--danger); }
.choice--sm span { min-height: 44px; padding: 9px 18px; font-size: 15px; }
.choice label.is-off { opacity: .35; pointer-events: none; }
.stepper--inline { display: inline-grid; width: 220px; }

/* soirées : ajouter à l'agenda, partager */
.event__acts { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 0 24px; margin-top: 2px; }
.event__acts .link { font-size: 12px; color: var(--ink-2); }
.event__acts .link:hover { color: var(--gold); }

/* mentions légales */
.legal { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 3fr); gap: 40px var(--gap); }
.legal__toc { position: sticky; top: calc(var(--header-h) + 32px); align-self: start; display: flex; flex-direction: column; }
.legal__toc a { padding: 10px 0; font-size: 15px; color: var(--ink-2); border-bottom: 1px solid var(--line); transition: color .3s; }
.legal__toc a:hover { color: var(--gold); }
.legal__body { max-width: 760px; }
.legal__body h2 { margin: 56px 0 18px; font: 600 clamp(22px, 2vw, 28px)/1.1 var(--f-display); font-stretch: 110%; text-transform: uppercase; letter-spacing: -.01em; }
.legal__body h2:first-child { margin-top: 0; }
.legal__body p { margin-bottom: 16px; color: var(--ink-2); line-height: 1.65; }
.legal__body strong { color: var(--ink); font-weight: 500; }
.legal__list { margin: 0 0 16px; }
.legal__list li { padding: 8px 0 8px 20px; position: relative; color: var(--ink-2); }
.legal__list li::before { content: ""; position: absolute; left: 0; top: 18px; width: 8px; height: 1px; background: var(--gold); }
.legal__list b { color: var(--ink); font-weight: 500; }
mark { padding: 2px 6px; background: rgba(253, 200, 82, .16); color: var(--gold); }

/* 404 */
.lost { min-height: 100svh; display: flex; align-items: center; padding: calc(var(--header-h) + 64px) 0 96px; }
.lost .wrap { display: flex; flex-direction: column; align-items: flex-start; gap: 28px; }
.lost__big { font-size: clamp(120px, 26vw, 380px); line-height: .8; }
.lost__links { display: flex; flex-wrap: wrap; gap: 10px; }

@media (max-width: 720px) {
  .legal { grid-template-columns: 1fr; }
  .legal__toc { position: static; }
  .drawer__panel { width: 100%; }
  .footer__legal a { text-decoration: underline; text-underline-offset: 3px; }
}
.footer__legal a { transition: color .3s; }
.footer__legal a:hover { color: var(--gold); }
/* Augustine, l'autre restaurant du groupe : une mention discrète à côté du copyright */
.footer__copy { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 4px 18px; }
.footer__group { font-size: 13px; letter-spacing: .02em; text-transform: none; opacity: .75; }
.footer__group a { text-decoration: underline; text-decoration-color: currentColor; text-decoration-thickness: 1px; text-underline-offset: 3px; }

/* =========================================================
   Thèmes de section : clair, papier, photo, or, texturé
   Chaque thème redéfinit les variables : tous les composants suivent.
   ========================================================= */
.theme-light, .theme-paper, .theme-gold, .theme-photo, .theme-texture { position: relative; isolation: isolate; }
.theme-light, .theme-paper {
  --bg: #F4EFE6; --bg-raise: #EAE3D6; --bg-raise-2: #E2D9C9;
  --ink: #15120E; --ink-2: rgba(21, 18, 14, .76); --ink-3: rgba(21, 18, 14, .62);
  --gold: #7A5710; --gold-soft: rgba(122, 87, 16, .1);
  --dark: #F4EFE6;
  --line: rgba(21, 18, 14, .14); --line-2: rgba(21, 18, 14, .3); --line-gold: rgba(122, 87, 16, .38);
  --panel: #EDE6DA; --field: rgba(21, 18, 14, .03); --field-focus: rgba(21, 18, 14, .05);
  --ok: #2E7443; --danger: #B3261E;
  --shadow: 0 24px 60px rgba(40, 30, 10, .18);
  background: var(--bg); color: var(--ink);
}
.theme-paper { background: #F1EADD; }
.theme-paper::before { content: ""; position: absolute; inset: 0; z-index: -1; background: url(../assets/grain.webp) repeat; background-size: 240px; opacity: .16; mix-blend-mode: multiply; pointer-events: none; }
.theme-light ::selection, .theme-paper ::selection { background: #15120E; color: #F4EFE6; }
.theme-light .field select, .theme-paper .field select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 6l5 5 5-5' fill='none' stroke='%2315120E' stroke-width='1.4'/%3E%3C/svg%3E"); }
.theme-light .grad, .theme-paper .grad { background: linear-gradient(100deg, #7A5710 0%, #9C7420 30%, #15120E 60%); -webkit-background-clip: text; background-clip: text; }
.theme-light .grad-rev, .theme-paper .grad-rev { background: linear-gradient(100deg, #15120E 30%, #9C7420 70%, #7A5710 100%); -webkit-background-clip: text; background-clip: text; }
.theme-light .media, .theme-paper .media { background: var(--bg-raise-2); }
.theme-light .media img, .theme-paper .media img { filter: saturate(.9) contrast(1.02); }

/* or : un bandeau festif, texte noir */
.theme-gold {
  --bg: #FDC852; --ink: #0A0908; --ink-2: rgba(10, 9, 8, .78); --ink-3: rgba(10, 9, 8, .62);
  --gold: #0A0908; --line: rgba(10, 9, 8, .2); --line-2: rgba(10, 9, 8, .35);
  background: var(--bg); color: var(--ink);
}
.theme-gold.marquee { border-block: 0; }

/* photo pleine largeur : image en parallaxe sous un voile sombre */
.theme-photo { background: var(--bg); }
.bgphoto { position: absolute; inset: 0; z-index: -2; overflow: hidden; }
.bgphoto .media__inner { inset: -9% -2px; }   /* 2 px de débord sur les côtés : pas de colonne vide au bord (Safari) */
.bgphoto img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.85) contrast(1.05); }
.theme-photo::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(180deg, rgba(10, 9, 8, .9) 0%, rgba(10, 9, 8, .62) 30%, rgba(10, 9, 8, .62) 70%, rgba(10, 9, 8, .92) 100%); }
.theme-photo--strong::after { background: linear-gradient(180deg, rgba(10, 9, 8, .94) 0%, rgba(10, 9, 8, .78) 35%, rgba(10, 9, 8, .78) 65%, rgba(10, 9, 8, .95) 100%); }
.closing.theme-photo::before { display: none; }
.theme-photo .fact { border-color: rgba(244, 239, 230, .22); }

/* texturé : noir chaud, grain marqué et halo doré */
.theme-texture { background: radial-gradient(ellipse 70% 55% at 85% 0%, rgba(253, 200, 82, .11), transparent 65%), radial-gradient(ellipse 60% 50% at 0% 100%, rgba(253, 200, 82, .06), transparent 60%), #0F0D0A; }
.theme-texture::before { content: ""; position: absolute; inset: 0; z-index: -1; background: url(../assets/grain.webp) repeat; background-size: 220px; filter: invert(1); opacity: .09; pointer-events: none; }

/* rythme : deux sections qui se suivent sur le même thème restent collées sans filet */
.theme-light + .theme-light, .theme-paper + .theme-paper { border-top: 1px solid var(--line); }
.section.theme-light, .section.theme-paper, .section.theme-photo, .section.theme-texture { border-top: 0; }

/* =========================================================
   Header sticky (toujours visible, compact au défilement)
   ========================================================= */
.site-header { transition: height .5s var(--ease), background-color .5s, box-shadow .5s, backdrop-filter .5s; }
.site-header.is-scrolled { height: 64px; }
.site-header .brand img { transition: height .5s var(--ease); }
.site-header.is-scrolled .brand img { height: 44px; }
.site-header.is-scrolled .btn--sm { --bh: 40px; }
@media (max-width: 720px) {
  .site-header.is-scrolled { height: 58px; }
  .site-header.is-scrolled .brand img { height: 38px; }
}

/* =========================================================
   Mega footer
   ========================================================= */
.footer { padding-top: clamp(64px, 7vw, 112px); }
/* plan du site + lettre */
.fmap { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) minmax(0, 1.6fr); gap: 40px var(--gap); padding-bottom: clamp(48px, 5vw, 80px); }
.fmap__col { display: flex; flex-direction: column; }
.fmap__col .label { margin-bottom: 8px; color: var(--gold); }
.fmap__col a { width: fit-content; padding: 9px 0; font-size: 15.5px; color: var(--ink-2); transition: color .3s, transform .5s var(--ease); }
.fmap__col a:hover { color: var(--ink); transform: translateX(6px); }
/* lettre d'information, puis « Suivez-nous » et les réseaux sur une ligne */
.fmap__news { display: flex; flex-direction: column; gap: 22px; min-width: 0; }
.fmap__soc { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 16px; }
.fmap__soc .label { color: var(--gold); }
.fmap__soc .fsoc { margin: 0; }
.fnews { display: flex; flex-direction: column; gap: 12px; padding: clamp(22px, 2.2vw, 32px); background: var(--panel); box-shadow: inset 0 0 0 1px var(--line-gold); }
.fnews__t { font: 600 clamp(20px, 1.8vw, 26px)/1.15 var(--f-display); font-stretch: 105%; text-transform: uppercase; letter-spacing: -.01em; }
.fnews__row { display: flex; gap: 8px; }
.fnews__row input { flex: 1; min-width: 0; min-height: 48px; padding: 0 14px; border: 0; border-radius: 0; background: var(--field); box-shadow: inset 0 0 0 1px var(--line-2); color: var(--ink); font: 400 16px/1 var(--f-text); }
.fnews__row input::placeholder { color: var(--ink-3); }
.fnews__row input:focus { outline: none; box-shadow: inset 0 0 0 2px var(--gold); }
.fnews__row input[aria-invalid="true"] { box-shadow: inset 0 0 0 2px var(--danger); }
.fnews__row .btn { --bh: 48px; }
.fnews__msg { font-size: 14px; color: var(--ink-3); }
.fnews__msg.is-err { color: var(--danger); }
.fnews__msg.is-ok { color: var(--ok); }

/* barre légale */
.footer__legal { align-items: center; }
.footer__legal-nav { display: flex; flex-wrap: wrap; gap: 4px 20px; }
.footer__legal-nav a { padding: 12px 0; }
.totop { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; font: inherit; letter-spacing: inherit; text-transform: inherit; color: var(--ink-2); transition: color .3s; }
.totop svg { width: 14px; height: 14px; transition: transform .5s var(--ease); }
.totop:hover { color: var(--gold); }
.totop:hover svg { transform: translateY(-4px); }

@media (max-width: 1080px) {
  .fmap { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fmap__news { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
  /* mobile : copyright et Augustine, les trois liens légaux sur une ligne, puis la signature et LUDS aux deux bouts */
  .footer__legal { flex-direction: column; align-items: stretch; gap: 0; padding: 18px 0 calc(14px + env(safe-area-inset-bottom)); font-size: 11px; letter-spacing: .08em; }
  .footer__copy { flex-direction: column; align-items: flex-start; gap: 6px; margin-bottom: 4px; }
  .footer__legal-nav { gap: 0 14px; }
  .footer__legal-nav a { padding: 10px 0; }
  .footer__end { justify-content: space-between; margin-right: -7px; }
}

/* =========================================================
   Polaroids : photos de soirées de nos clients (accueil)
   ========================================================= */
.polaroid {
  position: relative; flex: none; margin: 0; width: clamp(240px, 21vw, 340px);
  padding: 14px 14px 0; background: #F7F4EC; color: #15120E; scroll-snap-align: center;
  box-shadow: 0 2px 4px rgba(0, 0, 0, .25), 0 30px 60px rgba(0, 0, 0, .55);
  transform: translateY(var(--y, 0)) rotate(calc(var(--r, 0deg) + var(--tilt, 0deg)));
  transition: transform .7s var(--ease), box-shadow .7s var(--ease);
  user-select: none; -webkit-user-select: none;
}
/* ruban adhésif */
.polaroid::before { content: ""; position: absolute; top: -12px; left: 50%; width: 92px; height: 26px; transform: translateX(-50%) rotate(calc(var(--r, 0deg) * -1.4)); background: linear-gradient(180deg, rgba(236, 224, 196, .72), rgba(222, 208, 176, .62)); box-shadow: 0 1px 2px rgba(0, 0, 0, .18); clip-path: polygon(0 6%, 4% 0, 9% 7%, 14% 0, 100% 0, 97% 50%, 100% 100%, 0 100%, 3% 50%); -webkit-backdrop-filter: blur(1px); backdrop-filter: blur(1px); }
.polaroid:hover { z-index: 5; transform: translateY(calc(var(--y, 0) - 12px)) rotate(0deg) scale(1.04); box-shadow: 0 2px 4px rgba(0, 0, 0, .25), 0 44px 90px rgba(0, 0, 0, .7); }
.polaroid__img { aspect-ratio: 1 / 1; overflow: hidden; background: #1B1814; }
.polaroid__img img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.92) contrast(1.06) sepia(.06); pointer-events: none; }
.polaroid figcaption { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; min-height: 64px; padding: 14px 4px 16px; }
.polaroid__cap { font: italic 400 clamp(20px, 1.6vw, 25px)/1.1 var(--f-serif); letter-spacing: -.01em; }
.polaroid__date { flex: none; font: 500 12px/1 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: rgba(21, 18, 14, .6); }
@media (max-width: 720px) {
  .polaroid { width: min(72vw, 290px); }
}
@media (prefers-reduced-motion: reduce) {
  .polaroid, .polaroid:hover { transition: none; transform: translateY(var(--y, 0)) rotate(var(--r, 0deg)); }
}

/* Programmation de l'accueil : pleine largeur, quatre soirées par ligne */
/* affiches par lignes de 5 (accueil, programme du Club, autres soirées sous une fiche) */
.events--wide { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: clamp(40px, 4vw, 64px) clamp(12px, 1.2vw, 20px); padding-inline: clamp(12px, 1.4vw, 24px); }
.events--wide .event__title { font-size: clamp(18px, 1.3vw, 26px); }
@media (max-width: 1180px) { .events--wide { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px) { .events--wide { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* mobile : la programmation sur 2 colonnes, cartes resserrées (agenda et partage sur la page de la soirée) */
@media (max-width: 720px) {
  .events--wide { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 12px; padding-inline: var(--gutter); }
  .events--wide .event__date { top: 8px; left: 8px; min-width: 0; gap: 3px; padding: 7px 8px 6px; }
  .events--wide .event__date b { font-size: 20px; }
  .events--wide .event__date span { font-size: 11px; letter-spacing: .1em; }
  .events--wide .event__tag { top: 8px; right: 8px; padding: 6px 7px; font-size: 11px; letter-spacing: .08em; }
  .events--wide .event__must { left: 8px; right: 8px; bottom: 8px; padding: 7px 6px 6px; font-size: 11px; letter-spacing: .06em; }
  .events--wide .event__body { grid-template-columns: minmax(0, 1fr); gap: 5px; padding-top: 12px; margin-top: 12px; }
  .events--wide .event__title { font-size: 16px; }
  .events--wide .event__price { grid-column: 1; text-align: left; white-space: normal; font-size: 11.5px; letter-spacing: .04em; }
  .events--wide .event__when { font-size: 13px; line-height: 1.45; }
  .events--wide .event__age { margin-left: 6px; min-height: 18px; padding: 0 5px; font-size: 11px; }
  .events--wide .event__meta { font-size: 13px; line-height: 1.5; -webkit-line-clamp: 2; line-clamp: 2; }
  .events--wide .event__acts { margin-top: 0; }
  .events--wide .event__vip { min-height: 40px; font-size: 13px; }
  .events--wide .event__tools { display: none; }
}

/* Accueil : le planning ouvre la section, avant « Un restaurant, un club, cinq salles » */
.tl--lead { margin-top: 0; }


/* =========================================================
   Club : l'image s'agrandit au scroll jusqu'au plein écran, puis passe en vidéo
   ========================================================= */
.xpand { position: relative; margin-top: clamp(56px, 7vw, 112px); }
.xpand__frame { position: relative; overflow: hidden; width: calc(min(100%, var(--max)) - var(--gutter) * 2); margin-inline: auto; aspect-ratio: 21 / 9; background: var(--bg-raise); }
.xpand__media { position: absolute; inset: 0; }
.xpand__media img, .xpand__media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.xpand__media video { opacity: 0; transition: opacity 1.4s var(--ease); }
.xpand__media video.is-playing { opacity: 1; }
.xpand__cap { position: absolute; z-index: 1; left: 0; right: 0; bottom: clamp(32px, 5vw, 72px); display: flex; flex-direction: column; gap: 14px; opacity: 0; transform: translateY(24px); transition: opacity .8s var(--ease), transform 1s var(--ease); pointer-events: none; }
.xpand__cap .label { color: var(--gold); }
.xpand__line { font: 600 clamp(36px, 5.4vw, 96px)/.95 var(--f-display); font-stretch: 110%; text-transform: uppercase; letter-spacing: -.03em; max-width: 14ch; }
.xpand__line .serif { text-transform: none; color: var(--gold); }
.xpand__frame::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(10, 9, 8, .35) 0%, transparent 25%, transparent 50%, rgba(10, 9, 8, .78) 100%); opacity: var(--xo, 0); }

.xpand.is-on { --xt0: 88px; height: 250vh; margin-top: calc(clamp(56px, 7vw, 112px) - var(--xt0)); }
.xpand__sticky { pointer-events: none; }
.xpand.is-on .xpand__sticky { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; }
.xpand.is-on .xpand__frame { position: absolute; inset: 0; width: auto; margin: 0; aspect-ratio: auto; clip-path: inset(var(--xt, 0px) var(--xx, 0px) var(--xb, 0px) var(--xx, 0px)); will-change: clip-path; }
.xpand.is-on .xpand__media { transform: scale(var(--xs, 1)); transform-origin: 50% 30%; will-change: transform; }
.xpand.is-full .xpand__cap { opacity: 1; transform: none; }
@media (max-width: 720px) { .xpand__frame { aspect-ratio: 4 / 5; } .xpand.is-on { --xt0: 72px; } }

/* Mur de polaroids : bande de transition pleine largeur, à cheval sur la section du dessus
   (fond crème) et celle du dessous. Deux lignes plus larges que l'écran glissent en sens inverse au scroll. */
:root { --pw: min(46vw, 230px); }
@media (min-width: 721px) { :root { --pw: clamp(200px, 17vw, 290px); } }
.pwall { --ph: calc(var(--pw) + 64px); position: relative; z-index: 3; margin-top: calc(var(--ph) * -0.55); margin-bottom: calc(var(--ph) * -0.4); overflow-x: clip; pointer-events: none; }
@supports not (overflow: clip) { .pwall { overflow: hidden; } }
.pwall__rows { display: flex; flex-direction: column; }
.pwall__row { display: flex; align-items: center; width: max-content; padding: 16px 0; will-change: transform; }
.pwall__row--rev { margin-top: calc(var(--pw) * -0.14); }
.pwall .polaroid { width: var(--pw); padding: 11px 11px 0; pointer-events: auto; }
.pwall .polaroid + .polaroid { margin-left: calc(var(--pw) * -0.08); }
.pwall .polaroid:nth-child(even) { z-index: 1; }
.pwall .polaroid:hover { z-index: 6; }
.pwall .polaroid figcaption { min-height: 50px; padding: 11px 2px 13px; }
.pwall .polaroid__cap { font-size: clamp(16px, 1.3vw, 22px); }
.pwall .polaroid::before { width: 76px; height: 22px; top: -10px; }
.bleed-after { padding-bottom: calc(var(--sec) + (var(--pw) + 64px) * 0.55); }
.bleed-before { padding-top: calc(var(--sec) + (var(--pw) + 64px) * 0.4); }

/* Grands titres en dégradé : le dégradé ne peint que la boîte du texte.
   On l'agrandit (accents au-dessus, pente de l'italique à droite) sans décaler la mise en page. */
.shout.grad, .shout.grad-rev { padding: .16em .14em .06em .02em; margin: -.16em -.14em -.06em -.02em; }

/* Bloc final de l'accueil : une ligne Journée, une ligne Nuit */
.dn { display: flex; flex-direction: column; }
.dn__row { display: flex; align-items: flex-end; justify-content: space-between; gap: clamp(28px, 4vw, 72px); padding-block: clamp(32px, 4vw, 64px); }
.dn__row + .dn__row { border-top: 1px solid rgba(244, 239, 230, .22); }
.dn .closing__t { flex: none; }
.dn__info { display: flex; flex-direction: column; gap: 18px; width: min(100%, 420px); }
.dn__h { font: 500 13px/1.4 var(--f-text); letter-spacing: .16em; text-transform: uppercase; color: var(--gold); margin: 0; }
.dn__list { display: flex; flex-direction: column; }
.dn__list li { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 12px; padding: 10px 0; border-top: 1px solid rgba(244, 239, 230, .16); font-size: 16px; color: var(--ink-2); }
.dn__list b { font-weight: 500; color: var(--ink); }
.dn__info .btns { margin-top: 6px; }
@media (max-width: 900px) {
  .dn__row, .dn__row--b { flex-direction: column; align-items: flex-start; }
  .dn__row--b .closing__t { order: -1; }
  .dn .closing__t { font-size: clamp(48px, 16vw, 120px); }
}
/* Club : la légende plein écran de la vidéo sert de titre à l'agenda */
.xpand__cap .eyebrow { color: var(--gold); }
.xpand__txt { max-width: 46ch; font-size: clamp(16px, 1.2vw, 19px); line-height: 1.6; color: rgba(244, 239, 230, .86); }
.xpand:not(.is-on) .xpand__cap { opacity: 1; transform: none; }
/* Club : arrivée directe sur la vidéo plein écran, légende en bas à gauche */
.chero { position: relative; height: 100vh; height: 100svh; min-height: 560px; overflow: hidden; background: #000; }
/* comme le héros de l'accueil : la vidéo et le voile débordent de 2 px (rognés par .chero), sinon Safari laisse une colonne non voilée au bord */
.chero__media { position: absolute; inset: 0 -2px; }
.chero__media img, .chero__media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.chero__media video { opacity: 0; transition: opacity 1.4s var(--ease); }
.chero__media video.is-playing { opacity: 1; }
.chero::after { content: ""; position: absolute; inset: 0 -2px; transform: translateZ(0); pointer-events: none; background: linear-gradient(180deg, rgba(10, 9, 8, .45) 0%, transparent 28%, transparent 48%, rgba(10, 9, 8, .82) 100%); }
.chero__cap { position: absolute; z-index: 1; left: 0; right: 0; bottom: clamp(40px, 7vw, 104px); display: flex; flex-direction: column; gap: 14px; }
.chero__cap .eyebrow { color: var(--gold); }
.chero-next { padding-top: clamp(48px, 6vw, 88px); }
.fnews__msg:empty { display: none; }

/* Club : bloc « La nuit finit chez vous », tout centré */
.closing--center .closing__t, .closing--center .closing__t--b { margin-inline: auto; text-align: center; }
.closing--center .closing__mid { display: flex; justify-content: center; }
.closing--center .closing__body { align-items: center; text-align: center; max-width: 860px; }
.closing--center .kvs { display: grid; grid-template-columns: repeat(4, auto); justify-content: center; gap: 20px 44px; width: 100%; padding-block: 22px; border-block: 1px solid var(--line); }
.closing--center .kvs .kv { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 0; border: 0; }
.closing--center .kv dd { text-align: center; }
@media (min-width: 721px) { .closing--center .kv dd { white-space: nowrap; } }
.closing--center .btns { justify-content: center; }
@media (max-width: 720px) { .closing--center .kvs { grid-template-columns: repeat(2, auto); } }
#ouvert + #programme { padding-top: 0; }

/* Restaurant : bandeau d'infos sous le titre (midi, soir, terrasse) */
.hinfo { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: clamp(48px, 5vw, 80px); border-top: 1px solid var(--line); }
.hinfo__i { display: flex; flex-direction: column; gap: 8px; padding: 24px clamp(16px, 2vw, 32px) 0 0; }
.hinfo__i + .hinfo__i { padding-left: clamp(16px, 2vw, 32px); border-left: 1px solid var(--line); }
.hinfo__i .label { color: var(--gold); }
.hinfo__i b { font: 600 clamp(26px, 2.6vw, 40px)/1 var(--f-display); font-stretch: 110%; letter-spacing: -.02em; }
.hinfo__i small { font-size: 15px; color: var(--ink-2); }
a.hinfo__i b { transition: color .3s; }
a.hinfo__i:hover b { color: var(--gold); }
@media (max-width: 720px) {
  .hinfo { grid-template-columns: 1fr; }
  .hinfo__i, .hinfo__i + .hinfo__i { padding: 18px 0; border-left: 0; border-bottom: 1px solid var(--line); }
}

/* Pro & groupes : bandeau « Vous êtes un BDE ? » (fond or, texte noir) */
.btn--dark { background: #0A0908; color: #F4EFE6; }

.theme-gold .btn--line { box-shadow: inset 0 0 0 1px rgba(10, 9, 8, .45); color: #0A0908; }
.theme-gold .eyebrow { color: #0A0908; }
.bde__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(40px, 6vw, 120px); align-items: start; }
.bde__intro { display: flex; flex-direction: column; align-items: flex-start; gap: 26px; }
.bde__intro .lead { max-width: 30ch; color: rgba(10, 9, 8, .82); }
.bde__list { display: flex; flex-direction: column; counter-reset: bde; }
.bde__list li { display: grid; grid-template-columns: 56px minmax(0, 1fr); column-gap: 16px; row-gap: 6px; padding: 22px 0; border-top: 1px solid rgba(10, 9, 8, .22); counter-increment: bde; }
.bde__list li:last-child { border-bottom: 1px solid rgba(10, 9, 8, .22); }
.bde__list li::before { content: "0" counter(bde); grid-row: span 2; font: 500 13px/1.6 var(--f-text); letter-spacing: .16em; }
.bde__list b { font: 600 clamp(20px, 1.7vw, 26px)/1.1 var(--f-display); font-stretch: 110%; text-transform: uppercase; letter-spacing: -.01em; }
.bde__list span { font-size: 16px; line-height: 1.55; color: rgba(10, 9, 8, .78); }
@media (max-width: 900px) { .bde__grid { grid-template-columns: 1fr; } }
.btn--dark::before { background: #F4EFE6; }
.btn--dark:hover, .btn--dark:focus-visible { color: #0A0908; }
.theme-gold .btn--line::before { background: #0A0908; }
.theme-gold .btn--line:hover, .theme-gold .btn--line:focus-visible { color: #FDC852; box-shadow: inset 0 0 0 1px #0A0908; }

/* Planning : les créneaux du restaurant sont de simples boutons « Réserver » */
.tl__bar--book { align-items: center; justify-content: center; text-align: center; }
.tl__bar--book small { font: 600 11px/1 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: #7A5710; opacity: 1; }
.tl__bar--book:hover small, .tl__bar--book:focus-visible small { color: var(--dark); }
.tl__bar--book:hover, .tl__bar--book:focus-visible { filter: none; background: var(--gold); }
.tl__bar--book { padding: 0 4px; }
@media (max-width: 720px) { .tl__bar--book small { font-size: 11px; letter-spacing: .05em; } }

/* =========================================================
   Navette : formulaire seul + route vue du dessus, le van avance à chaque étape
   ========================================================= */
.navpage { padding-top: calc(var(--header-h) + clamp(56px, 7vw, 112px)); }
/* page Navette : l'essentiel en trois points, puis les boutons (ils ouvrent le volet de réservation) */
.navfacts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: clamp(40px, 5vw, 72px) 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line-2); }
.navfacts li { display: flex; flex-direction: column; gap: 8px; padding: 24px 24px 24px 0; border-bottom: 1px solid var(--line); }
.navfacts li + li { padding-left: 24px; border-left: 1px solid var(--line); }
.navfacts b { font: 600 clamp(20px, 2vw, 28px)/1.1 var(--f-display); font-stretch: 108%; text-transform: uppercase; color: var(--gold); }
.navfacts span { font-size: 15px; line-height: 1.5; color: var(--ink-2); }
.navpage__acts { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
/* le van : pleine largeur de la page, bords fondus dans le noir ; il entre par la gauche à l'arrivée */
.navvan { margin: clamp(24px, 4vw, 56px) calc(50% - 50vw) 0; overflow: hidden; }
.navvan img { display: block; width: min(100%, 1440px); height: auto; margin-inline: auto;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent), linear-gradient(transparent, #000 12%, #000 88%, transparent); -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent), linear-gradient(transparent, #000 12%, #000 88%, transparent); mask-composite: intersect; }
@media (max-width: 720px) { .navvan img { width: 122%; max-width: none; margin-left: -11%; } }   /* sur mobile, le van un peu plus grand : on rogne le noir des côtés */
.motion .navvan[data-reveal] img { transform: translateX(-12%); transition: transform 1.8s var(--ease); }
.motion .navvan[data-reveal].is-in img { transform: none; }
/* communes desservies, par secteur : les deux petits secteurs l'un sous l'autre */
.ncom { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); gap: 36px var(--gap); }
.ncom__s:nth-child(-n+2) { grid-row: span 2; }
.ncom__s:nth-child(3) { grid-column: 3; grid-row: 1; }
.ncom__s:nth-child(4) { grid-column: 3; grid-row: 2; }
.ncom h3 { margin: 0 0 14px; padding-bottom: 12px; border-bottom: 1px solid var(--line-2); font: 500 12px/1.3 var(--f-text); letter-spacing: .16em; text-transform: uppercase; color: var(--gold); }
.ncom ul { margin: 0; padding: 0; list-style: none; font-size: 16px; line-height: 2; color: var(--ink-2); }
.ncom__s:first-child ul { columns: 2; column-gap: var(--gap); }
@media (max-width: 900px) {
  .ncom { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ncom__s:nth-child(n) { grid-column: auto; grid-row: auto; }
}
@media (max-width: 720px) {
  .navfacts { grid-template-columns: 1fr; }
  .navfacts li + li { padding-left: 0; border-left: 0; }
  .ncom { grid-template-columns: 1fr; gap: 28px; }
}
.road { --p: 0; --pad: 44px; grid-column: 9 / span 4; position: sticky; top: calc(var(--header-h) + 24px); height: min(580px, calc(100vh - var(--header-h) - 48px)); }
.road__track { position: absolute; top: 0; bottom: 0; left: 0; width: 92px; }
.road__asphalt { position: absolute; inset: 0; overflow: hidden; border-radius: 46px; background: #1c1915; box-shadow: inset 0 0 0 1px rgba(244, 239, 230, .08); }
.road__asphalt::before, .road__asphalt::after { content: ""; position: absolute; top: 18px; bottom: 18px; width: 2px; background: rgba(244, 239, 230, .18); }
.road__asphalt::before { left: 10px; }
.road__asphalt::after { right: 10px; }
.road__dash { position: absolute; left: 50%; top: 0; bottom: 0; width: 3px; transform: translateX(-50%); background: repeating-linear-gradient(to bottom, rgba(253, 200, 82, .85) 0 18px, transparent 18px 40px); background-position: 0 calc(var(--p) * -800px); transition: background-position 1.4s var(--ease); }
.road__van { position: absolute; z-index: 2; left: 46px; bottom: calc(var(--pad) + (1 - var(--p)) * (100% - var(--pad) * 2)); width: 40px; transform: translate(-50%, 50%); transition: bottom 1.4s var(--ease), left 1.4s var(--ease); filter: drop-shadow(0 10px 14px rgba(0, 0, 0, .55)); }
.road__van svg { display: block; width: 40px; height: 80px; overflow: visible; transform: rotate(180deg); }
.road__beam { opacity: .7; }
.road.is-moving .road__van svg { animation: van-rumble .18s linear 7; }
@keyframes van-rumble { 50% { transform: rotate(180deg) translateX(.6px); } }
.road__stops { position: absolute; inset: 0; margin: 0; padding: 0; list-style: none; }
.road__stop { position: absolute; left: 0; right: 0; bottom: calc(var(--pad) + var(--at) * (100% - var(--pad) * 2)); transform: translateY(50%); display: flex; flex-direction: column; gap: 3px; padding-left: 118px; }
.road__stop::before { content: ""; position: absolute; left: 46px; top: 50%; width: 12px; height: 12px; border-radius: 50%; background: #1c1915; box-shadow: inset 0 0 0 2px rgba(244, 239, 230, .35); transform: translate(-50%, -50%); transition: background-color .4s, box-shadow .4s; }
.road__stop b { font: 600 16px/1.1 var(--f-display); font-stretch: 108%; text-transform: uppercase; letter-spacing: -.01em; color: var(--ink-2); transition: color .4s; }
.road__stop > span { overflow: hidden; font-size: 14px; color: var(--ink-3); white-space: nowrap; text-overflow: ellipsis; }
.road__stop.is-done::before { background: var(--gold); box-shadow: none; }
.road__stop.is-done b { color: var(--ink); }
.road__stop.is-next b { color: var(--gold); }
.road__stop--end b { font-size: 22px; color: var(--gold); }
.road__stop--end::before { width: 18px; height: 18px; border-radius: 4px; background: var(--gold); box-shadow: 0 0 0 6px rgba(253, 200, 82, .15); }
.road.is-arrived .road__stop--end::before { box-shadow: 0 0 0 12px rgba(253, 200, 82, .25); }
.road__stop--start b { color: var(--ink); }
@media (max-width: 1080px) {
  .book--road .form--book { grid-column: 1 / -1; }
  .road { --pad: 22px; grid-column: 1 / -1; order: -1; top: var(--header-h); z-index: 5; height: 60px; margin-inline: calc(var(--gutter) * -1); background: var(--bg); box-shadow: 0 1px 0 var(--line); }
  .road__track, .road__stops { left: var(--gutter); right: var(--gutter); top: 12px; bottom: auto; width: auto; height: 36px; }
  .road__asphalt { border-radius: 18px; }
  .road__asphalt::before, .road__asphalt::after { left: 16px; right: 16px; width: auto; height: 2px; }
  .road__asphalt::before { top: 6px; bottom: auto; }
  .road__asphalt::after { top: auto; bottom: 6px; }
  .road__dash { top: 50%; bottom: auto; left: 0; right: 0; width: auto; height: 3px; transform: translateY(-50%); background: repeating-linear-gradient(to right, rgba(253, 200, 82, .85) 0 18px, transparent 18px 40px); background-position: calc(var(--p) * -800px) 0; }
  .road__van { bottom: auto; top: 50%; left: calc(var(--pad) + var(--p) * (100% - var(--pad) * 2)); transform: translate(-50%, -50%) rotate(-90deg) scale(.5); }
  .road__stop { bottom: auto; top: 50%; right: auto; left: calc(var(--pad) + (1 - var(--at)) * (100% - var(--pad) * 2)); padding: 0; transform: translate(-50%, -50%); }
  .road__stop::before { left: 50%; width: 9px; height: 9px; }
  .road__stop--end::before { width: 13px; height: 13px; }
  .road__stop b, .road__stop > span { display: none; }
}
@media (prefers-reduced-motion: reduce) { .road__van, .road__dash { transition: none; } .road.is-moving .road__van svg { animation: none; } }

/* =========================================================
   Club : Carré VIP / Ultra VIP
   ========================================================= */
.vip__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 48px; align-items: start; }
.vip__intro { grid-column: 1 / span 5; display: flex; flex-direction: column; gap: 32px; }
.vip__offers { display: grid; grid-template-columns: 1fr; gap: 1px; background: var(--line-gold); box-shadow: 0 0 0 1px var(--line-gold); }
.vip__offer { display: flex; flex-direction: column; gap: 10px; padding: clamp(20px, 2vw, 28px); background: #0F0D0A; }
.vip__offer .label { color: var(--gold); }
.vip__offer--ultra { background: linear-gradient(135deg, rgba(253, 200, 82, .14), rgba(253, 200, 82, .03)), #0F0D0A; }
.vip__t { margin: 0; font: 600 clamp(20px, 1.7vw, 26px)/1.1 var(--f-display); font-stretch: 110%; text-transform: uppercase; letter-spacing: -.01em; }
.vip__offer p { font-size: 16px; line-height: 1.6; color: var(--ink-2); }
.vip__call { display: flex; flex-direction: column; gap: 8px; }
.vip__call .label { color: var(--ink-3); }
.vip__call p { font-size: 15px; color: var(--ink-3); }
.form--vip { grid-column: 7 / span 6; }
@media (max-width: 1080px) {
  .vip__intro, .form--vip { grid-column: 1 / -1; }
}

/* =========================================================
   Volet « Réserver » : un choix, puis le formulaire correspondant
   ========================================================= */
.bk-tabs { flex: none; display: flex; gap: 4px; margin: 4px calc(clamp(24px, 3vw, 44px) * -1) 2px; padding: 2px clamp(24px, 3vw, 44px); overflow-x: auto; scrollbar-width: none; scroll-padding-inline: clamp(24px, 3vw, 44px); }
.bk-tabs::-webkit-scrollbar { display: none; }
.bk-tabs button { flex: none; min-height: 44px; padding: 0 13px; font: 500 12px/1 var(--f-text); letter-spacing: .07em; white-space: nowrap; text-transform: uppercase; color: var(--ink-2); box-shadow: inset 0 0 0 1px var(--line-2); transition: background-color .3s, color .3s, box-shadow .3s; }
.bk-tabs button:hover { color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); }
.bk-tabs button[aria-selected="true"] { background: var(--gold); color: var(--dark); box-shadow: none; }
.bk-tabs button:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
@media (max-width: 480px) { .bk-tabs__more { display: none; } .bk-tabs button { padding: 0 11px; letter-spacing: .05em; } }
@media (max-width: 400px) { .bk-tabs { display: grid; grid-template-columns: 1fr 1fr; overflow: visible; margin-inline: 0; padding-inline: 0; } .bk-tabs button { padding: 0 8px; } }   /* petits téléphones : 2 × 2, rien ne défile sur le côté */   /* « Entreprises » seul : les quatre onglets tiennent sur la largeur */
.bk-panel[hidden] { display: none; }
.bk-panel .form--drawer .book__row { margin-top: 0; }
.bk-panel .choice--sm { flex-wrap: wrap; }
.bk-panel [data-company] { margin-top: 16px; }
/* navette dans le volet : formulaire pleine largeur, route horizontale collée en haut */
/* titre du volet : la partie en italique toujours sur sa ligne (« Réserver / en VIP. », « Réserver / une table. »…) */
.drawer [data-bk-title] .serif { display: block; }
.drawer .book--road { display: flex; flex-direction: column; align-items: stretch; gap: 20px; }
.drawer .book--road .form--book { padding: 0; background: none; box-shadow: none; }
.drawer .road { --pad: 22px; position: sticky; top: calc(clamp(24px, 3vw, 44px) * -1); z-index: 5; order: -1; height: 60px; margin: 0 calc(clamp(24px, 3vw, 44px) * -1); background: var(--bg-raise); box-shadow: 0 1px 0 var(--line); }
.drawer .road__track, .drawer .road__stops { left: clamp(24px, 3vw, 44px); right: clamp(24px, 3vw, 44px); top: 12px; bottom: auto; width: auto; height: 36px; }
.drawer .road__asphalt { border-radius: 18px; }
.drawer .road__asphalt::before, .drawer .road__asphalt::after { left: 16px; right: 16px; width: auto; height: 2px; }
.drawer .road__asphalt::before { top: 6px; bottom: auto; }
.drawer .road__asphalt::after { top: auto; bottom: 6px; }
.drawer .road__dash { top: 50%; bottom: auto; left: 0; right: 0; width: auto; height: 3px; transform: translateY(-50%); background: repeating-linear-gradient(to right, rgba(253, 200, 82, .85) 0 18px, transparent 18px 40px); background-position: calc(var(--p) * -800px) 0; }
.drawer .road__van { bottom: auto; top: 50%; left: calc(var(--pad) + var(--p) * (100% - var(--pad) * 2)); transform: translate(-50%, -50%) rotate(-90deg) scale(.5); }
.drawer .road__stop { bottom: auto; top: 50%; right: auto; left: calc(var(--pad) + (1 - var(--at)) * (100% - var(--pad) * 2)); padding: 0; transform: translate(-50%, -50%); }
.drawer .road__stop::before { left: 50%; width: 9px; height: 9px; }
.drawer .road__stop--end::before { width: 13px; height: 13px; }
.drawer .road__stop b, .drawer .road__stop > span { display: none; }

/* blocs d'appel qui ouvrent le volet (devis Pro & groupes) */
.cta-book { display: flex; flex-direction: column; align-items: center; gap: 26px; max-width: 720px; margin-inline: auto; text-align: center; }
.cta-book .btns { justify-content: center; }

/* Club : section VIP sans formulaire ; le titre en haut (téléphone à droite), les trois formules sur toute la largeur */
.vip__grid { align-items: end; }
.vip__intro { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 32px var(--gap); }
.vip__intro > .eyebrow { grid-column: 1 / -1; }
.vip__intro .vip__call { grid-column: 2; }
.vip__offers { grid-column: 1 / -1; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.vip__offer { justify-content: flex-start; }
.vip__offer .btn { align-self: flex-start; margin-top: auto; }
.vip__offer .vip__price { margin-bottom: 14px; }
@media (max-width: 720px) {
  .vip__intro { grid-template-columns: 1fr; }
  .vip__intro .vip__call { grid-column: 1; }
  .vip__offers { grid-template-columns: 1fr; }
}

/* Planning : fiche du créneau survolé ou choisi */
.tl__foot { align-items: flex-end; }
.tl__detail { flex: 1 1 520px; min-height: 96px; display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 18px 32px; }
.tl__detail > * { animation: tl-in .45s var(--ease) both; }
@keyframes tl-in { from { opacity: 0; transform: translateY(8px); } }
.tl__hint { align-self: center; font-size: 15.5px; color: var(--ink-2); max-width: 60ch; }
.tl__card { display: flex; flex-direction: column; gap: 8px; min-width: 0; max-width: 62ch; }
/* l'affiche de la soirée à gauche de la fiche du créneau */
.tl__card-main { display: flex; align-items: center; gap: clamp(16px, 1.6vw, 24px); min-width: 0; }
.tl__card-poster { flex: none; width: clamp(72px, 6.5vw, 104px); aspect-ratio: 4 / 5; overflow: hidden; box-shadow: 0 14px 30px rgba(0, 0, 0, .45), 0 0 0 1px rgba(244, 239, 230, .1); }
.tl__card-poster img { display: block; width: 100%; height: 100%; object-fit: cover; }
.tl__card-top { display: flex; align-items: center; gap: 14px; }
.tl__card-top .label { color: var(--gold); }
.tl__card-h { padding: 5px 10px; font: 500 13px/1 var(--f-text); letter-spacing: .04em; font-variant-numeric: tabular-nums; box-shadow: inset 0 0 0 1px var(--line-2); }
.tl__card-t { font: 600 clamp(22px, 2vw, 30px)/1.05 var(--f-display); font-stretch: 110%; text-transform: uppercase; letter-spacing: -.02em; }
.tl__card-t span { margin-left: 8px; font: italic 400 .72em/1 var(--f-serif); text-transform: none; letter-spacing: 0; color: var(--gold); }
.tl__card-d { font-size: 15.5px; line-height: 1.6; color: var(--ink-2); }
/* les DJ de la salle : photo dans une bulle cerclée d'or */
.tl__djs { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 2px 0 0; padding: 0; list-style: none; }
.tl__djs li { display: inline-flex; align-items: center; gap: 10px; font: 600 14px/1.1 var(--f-display); font-stretch: 108%; text-transform: uppercase; }
.tl__djs img, .tl__dj-ini { flex: none; width: 36px; height: 36px; object-fit: cover; border-radius: 50%; box-shadow: 0 0 0 2px var(--gold); }
.tl__dj-ini { display: grid; place-items: center; background: var(--bg-raise); color: var(--gold); }
.tl__card-acts { display: flex; flex-wrap: wrap; gap: 8px; }
.tl__bar.is-picked { box-shadow: inset 0 0 0 2px var(--ink), 0 0 0 2px var(--gold); z-index: 2; }
@media (prefers-reduced-motion: reduce) { .tl__detail > * { animation: none; } }

/* Volet : module de réservation externe du restaurant */
.bk-ext { display: flex; flex-direction: column; gap: 16px; }
.bk-ext__frame iframe { display: block; width: 100%; height: min(760px, 72vh); border: 0; background: #fff; }
.bk-ext:not(.is-live) .bk-ext__frame, .bk-ext.is-live .bk-ext__wait { display: none; }
.bk-ext__wait { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; padding: clamp(22px, 2.4vw, 32px); background: var(--panel); box-shadow: inset 0 0 0 1px var(--line-gold); }
.bk-ext__wait .label { color: var(--gold); }
.bk-ext__t { font: 600 clamp(24px, 2.2vw, 32px)/1.05 var(--f-display); font-stretch: 110%; text-transform: uppercase; letter-spacing: -.02em; }
.bk-ext__t .serif { text-transform: none; color: var(--gold); }
.bk-ext__d { font-size: 16px; line-height: 1.6; color: var(--ink-2); }
/* lien sous le module Overfull : à sa longueur (le soulignement ne traverse pas le volet) */
.bk-ext [data-ext-link] { align-self: flex-start; }

/* =========================================================
   Nous contacter : page partenaires
   ========================================================= */
.client-box { display: flex; flex-direction: column; gap: 12px; padding: 20px 22px; box-shadow: inset 0 0 0 1px var(--line-gold); background: var(--panel); }
.client-box .label { color: var(--gold); }
.client-box p { font-size: 15px; color: var(--ink-2); }
.profils { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; background: var(--line); box-shadow: 0 0 0 1px var(--line); }
.profil { position: relative; display: flex; flex-direction: column; gap: 14px; min-height: 260px; padding: clamp(24px, 2.6vw, 40px); background: var(--bg); transition: background-color .4s; }
.profil:hover, .profil:focus-visible { background: var(--bg-raise); }
.profil:focus-visible { outline-offset: -4px; }
.profil__n { font: 500 13px/1 var(--f-text); letter-spacing: .16em; color: var(--gold); }
.profil__t { margin: 0; font: 600 clamp(22px, 2vw, 30px)/1.05 var(--f-display); font-stretch: 110%; text-transform: uppercase; letter-spacing: -.02em; transition: color .3s; }
.profil:hover .profil__t { color: var(--gold); }
.profil p { font-size: 16px; line-height: 1.6; color: var(--ink-2); }
.profil .link { margin-top: auto; width: fit-content; }
.faq--big { max-width: none; }
.faq--big summary > span:first-child { display: flex; flex-direction: column; gap: 6px; }
.faq__cat { font: 500 11.5px/1 var(--f-text); font-style: normal; letter-spacing: .16em; text-transform: uppercase; color: var(--gold); }
.faq--big.is-filtered .faq__cat { display: none; }
@media (max-width: 1080px) { .profils { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { .profils { grid-template-columns: 1fr; } .profil { min-height: 0; } }

/* =========================================================
   Recrutement
   ========================================================= */
.perks { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gap); }
.perk { display: flex; flex-direction: column; gap: 12px; padding-top: 22px; border-top: 1px solid var(--line-gold); }
.perk__n { font: 500 13px/1 var(--f-text); letter-spacing: .16em; color: var(--gold); }
.perk__t { margin: 0; font: 600 clamp(20px, 1.7vw, 26px)/1.1 var(--f-display); font-stretch: 110%; text-transform: uppercase; letter-spacing: -.01em; }
.perk p { font-size: 16px; line-height: 1.65; color: var(--ink-2); }
.jobs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); }
.job { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; padding: clamp(22px, 2.4vw, 34px); background: var(--bg); box-shadow: inset 0 0 0 1px var(--line); transition: box-shadow .4s; }
.job:hover { box-shadow: inset 0 0 0 1px var(--gold); }
.job__top { display: flex; justify-content: space-between; align-items: center; gap: 12px; width: 100%; }
.job__tag { padding: 6px 10px; background: var(--gold); color: var(--dark); font: 600 11.5px/1 var(--f-text); letter-spacing: .12em; text-transform: uppercase; }
.job__where { font: 500 12px/1 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); }
.job__t { margin: 0; font: 600 clamp(22px, 2vw, 30px)/1.05 var(--f-display); font-stretch: 110%; text-transform: uppercase; letter-spacing: -.02em; }
.job p { font-size: 16px; line-height: 1.6; color: var(--ink-2); }
.job__kv { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 0 0 6px; padding: 0; list-style: none; font-size: 14.5px; color: var(--ink); }
.job__kv li::before { content: "—"; margin-right: 8px; color: var(--gold); }
.job .btn { margin-top: auto; }
.check { display: inline-flex; align-items: center; gap: 12px; cursor: pointer; font-size: 16px; }
.check input { width: 22px; height: 22px; margin: 0; accent-color: var(--gold); }
.profils .profil:last-child:nth-child(3n+2) { grid-column: span 2; }
@media (max-width: 1080px) {
  .perks { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .jobs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .profils .profil:last-child:nth-child(3n+2) { grid-column: auto; }
}
@media (max-width: 720px) { .perks, .jobs { grid-template-columns: 1fr; } }

/* FAQ : séparateur entre les filtres clients et professionnels */
.filters__sep { align-self: stretch; width: 1px; margin: 6px 6px; background: var(--line-2); }
@media (max-width: 720px) { .filters__sep { flex-basis: 100%; width: auto; height: 0; margin: 2px 0; background: none; } }

/* Pied de page : infos pratiques, en ligne et discrètes */
.finfo { display: grid; grid-template-columns: minmax(0, 1.75fr) minmax(0, 1fr) minmax(0, 1fr) max-content; gap: 28px var(--gap); padding-block: clamp(28px, 3vw, 44px); border-top: 1px solid var(--line); }
.finfo__i { display: flex; flex-direction: column; gap: 10px; }
/* bloc adresse : le logo à gauche */
.finfo__i--adr { flex-direction: row; align-items: flex-start; gap: clamp(24px, 2.4vw, 44px); }
/* le logo et, dessous, les réseaux sociaux */
.finfo__brand { flex: none; width: clamp(150px, 11vw, 190px); }
.finfo__logo { display: block; width: 100%; height: auto; }
@media (max-width: 520px) { .finfo__brand { width: 120px; } }
.finfo__adr { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.finfo__i .label { color: var(--ink-3); }
.finfo__i p { font-size: 15px; line-height: 1.65; color: var(--ink-2); }
.finfo__acts { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.finfo__acts button { font: inherit; color: inherit; }
.finfo__tel { font: 600 20px/1.3 var(--f-display); letter-spacing: -.01em; color: var(--ink); transition: color .3s; }
.finfo__tel:hover { color: var(--gold); }
.finfo__sub { font-size: 14px; }
/* numéros du pied de page : « ou en ligne → » ouvre le volet de réservation */
.finfo__tels { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; list-style: none; font-size: 14px; line-height: 1.6; color: var(--ink-2); }
.finfo__tels li { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 6px; }
/* fiche d'une soirée, « Au programme » : même lien après les numéros */
/* bloc Club : horaires exceptionnels lus dans l'agenda */
/* horaires exceptionnels : bandeau sur toute la largeur, une case par date */
.finfo__exc { grid-column: 1 / -1; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 14px clamp(24px, 3vw, 48px); padding: 18px clamp(18px, 2vw, 28px); box-shadow: inset 0 0 0 1px var(--line-2); background: rgba(253, 200, 82, .04); }
.finfo__exc[hidden] { display: none; }
.finfo__exc-t { margin: 0; font: 500 11px/1.4 var(--f-text); letter-spacing: .16em; text-transform: uppercase; color: var(--gold); }
.finfo__exc-l { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px 0; margin: 0; padding: 0; list-style: none; }
.finfo__exc-l li { display: flex; flex-direction: column; gap: 2px; padding-inline: clamp(14px, 1.6vw, 24px); border-left: 1px solid var(--line); font-size: 14px; line-height: 1.45; color: var(--ink-2); }
.finfo__exc-l b { font-weight: 600; color: var(--ink); }
.finfo__exc-l .is-ferme span { color: var(--gold); font-weight: 500; }
@media (max-width: 720px) {
  .finfo__exc { grid-template-columns: 1fr; }
  .finfo__exc-l li { padding-inline: 14px 0; }
}
/* réseaux sociaux, sous l'itinéraire */
.fsoc { display: flex; gap: 10px; margin: 16px 0 0; padding: 0; list-style: none; }
.fsoc a { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; color: var(--ink-2); box-shadow: inset 0 0 0 1px var(--line); transition: color .25s, background-color .25s, box-shadow .25s; }
.fsoc a:hover { color: var(--dark); background: var(--gold); box-shadow: inset 0 0 0 1px var(--gold); }
.fsoc a:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.fsoc svg { width: 19px; height: 19px; }
@media (max-width: 1080px) { .finfo { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .finfo { grid-template-columns: 1fr; } }

/* FAQ condensée : un sujet à la fois, deux colonnes, lignes resserrées */
.faq--big { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(28px, 4vw, 72px); align-items: start; border-bottom: 0; border-top: 1px solid var(--line); }
.faq--big details { border-top: 0; border-bottom: 1px solid var(--line); }
.faq--big summary { padding: 18px 0; font-size: clamp(16px, 1.25vw, 18px); }
.faq--big .plus { width: 32px; height: 32px; }
.faq--big .faq__a p { font-size: 15.5px; }
@media (max-width: 900px) {
  .faq--big { grid-template-columns: 1fr; }
}

/* Signature LUDS, en bas à droite */
.footer__end { display: inline-flex; align-items: center; gap: 18px; }
.footer__luds { display: inline-grid; place-items: center; min-width: 44px; min-height: 44px; opacity: .55; transition: opacity .3s; }
.footer__luds:hover, .footer__luds:focus-visible { opacity: 1; }
.footer__luds img { display: block; width: 30px; height: auto; }

/* Cartes de soirée : partage en icône */
/* Actions de la carte soirée : un lien discret + deux icônes (agenda, partager) sur une seule ligne */
.event__acts { align-items: center; justify-content: space-between; flex-wrap: nowrap; gap: 12px; margin-top: 4px; }
.event__vip { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font: 400 14px/1.3 var(--f-text); color: var(--ink-2); transition: color .25s; }
.event__vip svg { flex: none; width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 1.5; transition: transform .35s var(--ease); }
.event__vip:hover { color: var(--gold); }
.event__tools { display: flex; flex: none; margin-right: -11px; }
.event__ico { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; color: var(--ink-3); transition: color .25s, background-color .25s; }
.event__ico:hover { color: var(--ink); background: var(--line); }
.event__ico:focus-visible { outline: 2px solid var(--gold); outline-offset: -2px; color: var(--ink); }
.event__ico svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }

/* Fenêtre de choix (agenda, partage) : centrée sur ordinateur, feuille en bas sur mobile */
.sheet { position: fixed; inset: 0; z-index: 150; display: grid; place-items: center; padding: 20px; }
.sheet__backdrop { position: absolute; inset: 0; background: rgba(5, 5, 4, .7); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); opacity: 0; transition: opacity .3s var(--ease); }
.sheet__panel { position: relative; width: min(440px, 100%); max-height: calc(100vh - 40px); overflow-y: auto; padding: 26px; background: var(--bg-raise); box-shadow: 0 30px 80px rgba(0, 0, 0, .6), inset 0 0 0 1px var(--line-gold); opacity: 0; transform: translateY(16px) scale(.98); transition: opacity .3s var(--ease), transform .4s var(--ease); }
.sheet.is-open .sheet__backdrop { opacity: 1; }
.sheet.is-open .sheet__panel { opacity: 1; transform: none; }
.sheet__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 16px; }
.sheet__t { font: 600 22px/1.1 var(--f-display); font-stretch: 110%; text-transform: uppercase; letter-spacing: -.01em; }
.sheet__sub { margin-top: 6px; font-size: 14.5px; color: var(--ink-2); }
.sheet__list { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
.sheet__list li + li { border-top: 1px solid var(--line); }
.sheet__opt { display: flex; align-items: center; gap: 14px; width: 100%; min-height: 56px; padding: 8px 6px; text-align: left; font: inherit; color: var(--ink); transition: background-color .25s, color .25s; }
.sheet__opt:hover, .sheet__opt:focus-visible { background: rgba(253, 200, 82, .08); color: var(--gold); }
.sheet__opt:focus-visible { outline-offset: -2px; }
.sheet__ico { display: inline-grid; place-items: center; flex: none; width: 38px; height: 38px; border-radius: 50%; box-shadow: inset 0 0 0 1px var(--line-2); color: var(--gold); }
.sheet__ico svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.sheet__l { display: flex; flex-direction: column; gap: 2px; font-size: 16px; }
.sheet__l small { font-size: 13px; color: var(--ink-3); }
@media (max-width: 720px) {
  .sheet { place-items: end stretch; padding: 0; }
  .sheet__panel { width: 100%; max-height: 85vh; padding: 22px 20px calc(22px + env(safe-area-inset-bottom)); transform: translateY(100%); }
}
@media (prefers-reduced-motion: reduce) { .sheet__panel, .sheet__backdrop { transition: none; } }

/* Champ CV : zone de dépôt (le vrai <input type=file> la recouvre : clic, clavier et glisser-déposer natifs) */
.opt { margin-left: 6px; font-size: 13px; font-weight: 400; color: var(--ink-3); text-transform: none; letter-spacing: 0; }
.upload { position: relative; display: flex; align-items: center; justify-content: center; min-height: 128px; padding: 22px 24px; background: var(--field); border: 1.5px dashed var(--line-2); text-align: center; transition: border-color .25s, background-color .25s; }
.field .upload input { position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; padding: 0; opacity: 0; cursor: pointer; box-shadow: none; }
.upload:hover, .upload.is-drag { border-color: var(--gold); background: var(--field-focus); }
.upload.is-drag { border-style: solid; }
.upload:focus-within { outline: 2px solid var(--gold); outline-offset: 3px; }
.upload__empty { display: flex; flex-direction: column; align-items: center; gap: 10px; pointer-events: none; }
.upload__empty[hidden], .upload__file[hidden] { display: none; }
.upload__ico { width: 30px; height: 30px; color: var(--gold); transition: transform .3s; }
.upload:hover .upload__ico, .upload.is-drag .upload__ico { transform: translateY(-3px); }
.upload__t { margin: 0; font-size: 16px; line-height: 1.5; color: var(--ink-2); }
.upload__t b { font-weight: 500; color: var(--ink); }
.upload__t u { text-decoration-color: var(--gold); text-underline-offset: 4px; text-decoration-thickness: 1.5px; }
.upload__t--touch { display: none; }
@media (hover: none) { .upload__t--desk { display: none; } .upload__t--touch { display: block; } .upload__t--touch u { display: block; margin-top: 2px; font-size: 14px; color: var(--ink-3); } }
.upload.has-file { justify-content: flex-start; min-height: 80px; padding: 14px 14px 14px 18px; border-style: solid; border-color: var(--line-gold, var(--gold)); text-align: left; }
.upload__file { display: flex; align-items: center; gap: 14px; width: 100%; pointer-events: none; }
.upload__doc { flex: none; width: 26px; height: 26px; color: var(--gold); }
.upload__meta { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.upload__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 16px; font-weight: 500; color: var(--ink); }
.upload__size { font-size: 14px; color: var(--ink-3); }
.upload__rm { position: relative; z-index: 2; flex: none; min-height: 44px; padding: 0 16px; border: 0; background: transparent; box-shadow: inset 0 0 0 1px var(--line-2); color: var(--ink); font: 400 15px/1 var(--f-text); cursor: pointer; pointer-events: auto; transition: box-shadow .25s, color .25s; }
.upload__rm:hover { box-shadow: inset 0 0 0 1px var(--danger); color: var(--danger); }
.upload__rm:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.field.is-invalid .upload { border-color: var(--danger); border-style: solid; }

/* Case « 18 ans ou plus » : une vraie carte cliquable, case dessinée */
.consent { position: relative; display: flex; align-items: center; gap: 16px; min-height: 68px; padding: 14px 20px; background: var(--field); box-shadow: inset 0 0 0 1px var(--line-2); cursor: pointer; transition: box-shadow .25s, background-color .25s; }
.consent input { position: absolute; opacity: 0; width: 1px; height: 1px; min-height: 0; padding: 0; margin: 0; }
.consent__box { flex: none; display: grid; place-items: center; width: 26px; height: 26px; box-shadow: inset 0 0 0 1.5px var(--ink-3); color: var(--dark); transition: background-color .2s, box-shadow .2s; }
.consent__box svg { width: 16px; height: 16px; stroke-dasharray: 18; stroke-dashoffset: 18; transition: stroke-dashoffset .25s .05s; }
.consent__txt { display: flex; flex-direction: column; gap: 3px; }
.consent__txt b { font-size: 16px; font-weight: 500; line-height: 1.4; color: var(--ink); }
.consent__txt small { font-size: 14px; line-height: 1.45; color: var(--ink-3); }
.consent:hover { background: var(--field-focus); }
.consent:hover .consent__box { box-shadow: inset 0 0 0 1.5px var(--ink); }
.consent input:checked ~ .consent__box { background: var(--gold); box-shadow: none; }
.consent input:checked ~ .consent__box svg { stroke-dashoffset: 0; }
.consent:has(input:checked) { box-shadow: inset 0 0 0 1px var(--gold); }
.consent input:focus-visible ~ .consent__box { outline: 2px solid var(--gold); outline-offset: 3px; }
.field.is-invalid .consent { box-shadow: inset 0 0 0 2px var(--danger); }
.field.is-invalid .consent__box { box-shadow: inset 0 0 0 1.5px var(--danger); }
@media (prefers-reduced-motion: reduce) { .consent__box svg, .upload__ico { transition: none; } }
.field label.consent { padding: 14px 20px; font: inherit; letter-spacing: normal; text-transform: none; color: inherit; }

/* Carte : étiquette « Plage » et onglet sans plats (formule midi, boissons en PDF) */
.tag--plage { box-shadow: inset 0 0 0 1px var(--line-gold); color: var(--gold); }
.carte__panel .carte__head .btn { margin-top: 8px; }

/* Carte : sélecteur « À manger / À boire », seuls les onglets du groupe choisi s'affichent */
.carte__switch { display: inline-flex; margin-bottom: clamp(20px, 2.4vw, 32px); box-shadow: inset 0 0 0 1px var(--line-2); }
.carte__switch button { min-height: 50px; padding: 0 clamp(22px, 2.4vw, 34px); font: 500 13px/1 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-2); transition: background-color .3s, color .3s; }
.carte__switch button:hover { color: var(--ink); }
.carte__switch button[aria-pressed="true"] { background: var(--ink); color: var(--bg); }
.carte__switch button:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
[data-carte][data-group="food"] [role="tab"][data-type="drinks"],
[data-carte][data-group="drinks"] [role="tab"][data-type="food"],
[data-carte][data-group="food"] [data-only="drinks"],
[data-carte][data-group="drinks"] [data-only="food"] { display: none; }
.tag--big, .tag--grenouille { box-shadow: inset 0 0 0 1px var(--line-gold); color: var(--gold); }
@media (max-width: 900px) {
  .carte__switch { display: flex; }
  .carte__switch button { flex: 1; }
  .carte__sec--c3 .carte__cols span, .carte__sec--c3 .carte__price span { width: 58px; }
  .carte__sec--c4 .carte__cols span, .carte__sec--c4 .carte__price span { width: 50px; }
  .carte__sec--c3 .carte__price, .carte__sec--c4 .carte__price { font-size: 15px; }
  .carte__sec--c3 .carte__cols, .carte__sec--c4 .carte__cols, .carte__sec--c3 .carte__price, .carte__sec--c4 .carte__price { gap: 6px; }
}

/* Carte : case de prix vide = tiret discret (garde l'alignement), bières à 4 formats : prix sous le nom sur mobile */
.carte__price .is-none { color: var(--line-2); font-weight: 400; }
@media (max-width: 600px) {
  .carte__sec--c4 .carte__sec-t { flex-wrap: wrap; row-gap: 12px; }
  .carte__sec--c4 .carte__sec-t .carte__cols { margin-left: auto; }
  .carte__sec--c4 .carte__row { flex-wrap: wrap; row-gap: 6px; }
  .carte__sec--c4 .carte__name { flex: 1 0 100%; }
  .carte__sec--c4 .carte__dots { display: none; }
  .carte__sec--c4 .carte__price { margin-left: auto; }
  .carte__sec--c4 .carte__cols span, .carte__sec--c4 .carte__price span { width: 62px; }
}

/* FAQ : même bloc partout (deux colonnes, questions resserrées), ligne de sortie en bas */
.faq__more { margin-top: clamp(28px, 3vw, 44px); font-size: 15.5px; line-height: 1.6; color: var(--ink-2); }
.faq__col { min-width: 0; }

/* Mention légale alcool (loi Évin) : lisible, sur une ligne à part au-dessus de la barre légale */
.footer__alcool { margin: 0; padding: 18px 0; border-top: 1px solid var(--line); font: 400 14px/1.55 var(--f-text); color: var(--ink-2); text-align: center; text-wrap: balance; }

/* Cartes empilées : photo floutée de la carte en cours derrière les cartes (calque collé à l'écran) */
.has-stackc-bg { position: relative; isolation: isolate; }
.stackc-bg { position: absolute; inset: 0; z-index: -1; pointer-events: none; overflow: clip; }
.stackc-bg__in { position: sticky; top: 0; height: 100vh; height: 100lvh; overflow: hidden; }
.stackc-bg__in::after { content: ""; position: absolute; inset: 0; background: rgba(10, 9, 8, .28); }
.stackc-bg img { position: absolute; inset: -10%; width: 120%; height: 120%; object-fit: cover; filter: blur(60px) saturate(1.7) brightness(1.1); opacity: 0; transform: scale(1.1); transition: opacity 1.1s var(--ease), transform 1.6s var(--ease); }
.stackc-bg img.is-on { opacity: .95; transform: scale(1); }
.has-stackc-bg::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(180deg, var(--bg) 0, transparent 22vh, transparent calc(100% - 22vh), var(--bg) 100%); }
@media (prefers-reduced-motion: reduce) { .stackc-bg img { transition: none; transform: none; } }
/* ® du mot-symbole de l'accueil : en exposant, en haut à droite du S (comme dans le pied de page) */
.hero__word [data-letters] { display: flex; align-items: flex-start; }

/* Planning : pas de texte d'aide ; la zone de détail n'apparaît qu'une fois un créneau choisi */
.tl__foot:has(.tl__detail:empty) { display: none; }

/* Zones tactiles : au moins 44 px, sans changer l'apparence (marges négatives pour ne pas décaler la mise en page) */
.burger { min-width: 44px; }
.finfo__acts .inline-link { display: inline-flex; align-items: center; min-height: 44px; margin-block: -10px; }

/* Offres VIP / Ultra VIP : photo en tête de carte */
.vip__media { --pad: clamp(20px, 2vw, 28px); margin: calc(var(--pad) * -1) calc(var(--pad) * -1) 8px; aspect-ratio: 16 / 10; overflow: hidden; background: #000; }
.vip__media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 42%; transition: transform 1.2s var(--ease); }
.vip__offer:hover .vip__media img { transform: scale(1.04); }
@media (prefers-reduced-motion: reduce) { .vip__media img { transition: none; } }

/* Bandeau d'information : fermetures / ouvertures exceptionnelles (lues dans l'agenda) */
.notice { position: fixed; left: 50%; bottom: calc(20px + env(safe-area-inset-bottom)); z-index: 120; display: flex; align-items: center; gap: 14px; max-width: min(760px, calc(100% - 32px)); padding: 12px 12px 12px 22px; background: var(--gold); color: var(--dark); box-shadow: 0 20px 50px rgba(0, 0, 0, .45); transform: translate(-50%, calc(100% + 40px)); transition: transform .6s var(--ease); }
.notice.is-in { transform: translate(-50%, 0); }
.notice p { margin: 0; font: 400 15px/1.45 var(--f-text); }
.notice b { font-weight: 600; }
.notice button { flex: none; width: 40px; height: 40px; border-radius: 50%; font-size: 24px; line-height: 1; color: var(--dark); }
.notice button:hover { background: rgba(10, 9, 8, .1); }
@media (prefers-reduced-motion: reduce) { .notice { transition: none; } }

/* =========================================================
   Page Restaurant : grande photo + ardoise du midi, mosaïque « La maison », bar
   ========================================================= */
/* ouverture : grande photo, titre à gauche, l'ardoise du midi posée à droite */
.rhero { height: auto; min-height: clamp(720px, 100vh, 1080px); }
.rhero .photo-hero__content { position: relative; bottom: auto; display: flex; align-items: flex-end; min-height: clamp(720px, 100vh, 1080px); padding: calc(var(--header-h) + 64px) 0 clamp(48px, 6vw, 96px); }
.rhero__shade { background: linear-gradient(90deg, rgba(10, 9, 8, .82) 0%, rgba(10, 9, 8, .45) 45%, rgba(10, 9, 8, .25) 70%), linear-gradient(180deg, rgba(10, 9, 8, .6) 0%, rgba(10, 9, 8, 0) 30%, rgba(10, 9, 8, .35) 70%, var(--bg) 100%); }
.rhero__grid { display: grid; grid-template-columns: minmax(0, 1fr); width: 100%; }
.rhero__title { display: flex; flex-direction: column; gap: 28px; align-items: flex-start; }
.rhero__title .lead { max-width: 34ch; }
.rhero .display--xl { text-shadow: 0 4px 40px rgba(0, 0, 0, .35); }

/* l'ardoise */
.slate { position: relative; color: #EFEAE0; }
/* l'ardoise sombre posée sur la carte (fond papier) : on remet les couleurs du thème sombre */
.slate--carte { --ink: #F4EFE6; --ink-2: rgba(244, 239, 230, .76); --ink-3: rgba(244, 239, 230, .58); --gold: #FDC852; --dark: #0A0908; --line: rgba(244, 239, 230, .13); --line-2: rgba(244, 239, 230, .28);
  display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(250px, 1fr); gap: clamp(28px, 4vw, 72px); padding: clamp(28px, 3.6vw, 56px); background: #181A18;
  box-shadow: inset 0 0 0 8px #2A2219, inset 0 0 0 9px rgba(253, 200, 82, .35), 0 36px 70px -30px rgba(40, 30, 10, .55); }
/* Le Chalet : fond de planches (photo du shooting, assombrie, raccord en miroir pour se répéter sans couture) */
.chalet { background: #100C09 url(../assets/photos/bois-chalet.webp) center top / 1280px auto repeat; }
@media (max-width: 720px) { .chalet { background-size: 900px auto; } }
/* galerie de photos 3:4 sur une ligne, pleine largeur, qui ferme la section */
.chalet:has(.chalet__gal) { padding-bottom: 0; }
.chalet__gal { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; margin: clamp(56px, 7vw, 104px) 0 0; padding: 0; list-style: none; }
.chalet__gal li { aspect-ratio: 3 / 4; overflow: hidden; background: var(--bg-raise); }
.chalet__gal img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.chalet__gal li:hover img { transform: scale(1.04); }
@media (max-width: 720px) { .chalet__gal { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 44vw; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; } .chalet__gal li { scroll-snap-align: start; } }
/* les cocktails en photos, sous leurs cartes : même ligne de 6 photos, sortie de la grille jusqu'aux bords */
.bar__gal { margin: clamp(48px, 6vw, 88px) calc(50% - 50vw) 0; }
.bar__gal li { aspect-ratio: 2 / 3; }   /* le format des photos de cocktails */
/* menu de la semaine au-dessus des onglets de la carte */
.slate--carte + [data-carte] { margin-top: clamp(48px, 6vw, 88px); }
.slate--carte::before { content: ""; position: absolute; inset: 9px; background: url(../assets/grain.webp) repeat; background-size: 200px; filter: invert(1); opacity: .06; pointer-events: none; }
.slate__top { position: relative; display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 16px; }
.slate__t { margin: 0; font: 400 clamp(30px, 2.6vw, 42px)/1 var(--f-serif); font-style: italic; color: var(--gold); }
.slate__hours { font: 500 12px/1 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: rgba(239, 234, 224, .7); }
.slate__meta { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 16px 0 4px; padding-bottom: 14px; border-bottom: 1px dashed rgba(239, 234, 224, .25); font-size: 14px; color: rgba(239, 234, 224, .75); }
.slate__tag { padding: 5px 10px 4px; background: var(--gold); color: #0A0908; font: 600 11px/1 var(--f-text); letter-spacing: .16em; text-transform: uppercase; }
.slate__list { position: relative; list-style: none; margin: 0; padding: 0; }
.slate__list li { display: grid; grid-template-columns: 78px 1fr; gap: 14px; align-items: baseline; padding: 14px 0; border-bottom: 1px dashed rgba(239, 234, 224, .14); }
.slate__list li:last-child { border-bottom: 0; }
.slate__k { font: 500 11px/1 var(--f-text); letter-spacing: .18em; text-transform: uppercase; color: var(--gold); }
.slate__v { font: 400 clamp(22px, 1.7vw, 28px)/1.15 var(--f-serif); color: #F6F1E7; text-wrap: balance; }
.slate__note { position: relative; margin: 6px 0 0; font-size: 14px; color: rgba(239, 234, 224, .72); }
.slate__note::before { content: "\2731  "; color: var(--gold); }
.slate__empty { position: relative; display: flex; flex-direction: column; gap: 10px; padding: 14px 0 6px; }
.slate__empty p { margin: 0; color: rgba(239, 234, 224, .75); font-size: 15px; }
.slate__empty .slate__v { color: #F6F1E7; font-size: clamp(22px, 1.7vw, 28px); }
.slate__f { position: relative; list-style: none; margin: 16px 0 0; padding: 14px 0 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; border-top: 1px solid rgba(239, 234, 224, .2); }
.slate__f li { display: flex; flex-direction: column-reverse; gap: 6px; }
.slate__f span { font-size: 13px; line-height: 1.35; color: rgba(239, 234, 224, .7); }
.slate__f b { font: 600 30px/1 var(--f-display); font-stretch: 110%; color: var(--gold); }
.slate__days { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin: 14px 0 2px; }
.slate__days button { position: relative; display: flex; flex-direction: column; align-items: center; gap: 3px; min-height: 52px; padding: 8px 4px; color: rgba(239, 234, 224, .7); box-shadow: inset 0 0 0 1px rgba(239, 234, 224, .2); transition: background .3s, color .3s; }
.slate__days button span { font: 500 11px/1 var(--f-text); letter-spacing: .12em; text-transform: uppercase; }
.slate__days button b { font: 600 18px/1 var(--f-display); }
.slate__days button i { position: absolute; top: -8px; left: 50%; translate: -50% 0; padding: 3px 6px 2px; background: #EFEAE0; color: #0A0908; font: 600 8px/1 var(--f-text); font-style: normal; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
.slate__days button:hover { color: #F6F1E7; }
.slate__days button[aria-selected="true"] { background: var(--gold); color: #0A0908; box-shadow: none; }

/* « La maison » : chef, producteurs et photos, en mosaïque bord à bord */
.maison { padding-bottom: clamp(12px, 1vw, 16px); container-type: inline-size; }
/* cases carrées : une rangée a la hauteur d'une colonne, donc une case de 2 × 3 garde le format 2:3 des photos
   et la vidéo (4 × 4) reste carrée, quelle que soit la largeur de l'écran */
.mz { --n: 12; --g: clamp(6px, .7vw, 12px); --c: calc((100cqw - 2 * var(--g) - (var(--n) - 1) * var(--g)) / var(--n));
  --x: calc((2.5 * var(--c) - .75 * var(--g)) / 3);   /* 3 rangées de cette hauteur : une case de 2 colonnes au format 4:5 */
  display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); grid-auto-rows: var(--c); grid-template-rows: repeat(6, var(--c)) repeat(3, var(--x)); gap: var(--g); padding-inline: var(--g);
  grid-template-areas:
    "chef chef chef chef vid vid vid vid p1 p1 p2 p2"
    "chef chef chef chef vid vid vid vid p1 p1 p2 p2"
    "chef chef chef chef vid vid vid vid p1 p1 p2 p2"
    "chef chef chef chef vid vid vid vid t1 t1 t1 t1"
    "chef chef chef chef t2 t2 t2 t2 t1 t1 t1 t1"
    "chef chef chef chef t2 t2 t2 t2 t1 t1 t1 t1"
    "p3 p3 p4 p4 t3 t3 t3 t3 p5 p5 p6 p6"
    "p3 p3 p4 p4 t3 t3 t3 t3 p5 p5 p6 p6"
    "p3 p3 p4 p4 t3 t3 t3 t3 p5 p5 p6 p6"; }
@supports not (width: 1cqw) { .mz { --c: calc((100vw - 2 * var(--g) - (var(--n) - 1) * var(--g)) / var(--n)); } }
.mz__t { position: relative; margin: 0; overflow: hidden; background: var(--bg-raise); }
.mz__chef { grid-area: chef; } .mz__vid { grid-area: vid; } .mz__p1 { grid-area: p1; } .mz__t1 { grid-area: t1; } .mz__t2 { grid-area: t2; }
.mz__p2 { grid-area: p2; } .mz__p3 { grid-area: p3; } .mz__p4 { grid-area: p4; } .mz__t3 { grid-area: t3; } .mz__p5 { grid-area: p5; } .mz__p6 { grid-area: p6; }
.mz__t img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.9); }
.mz__t > img { position: absolute; inset: 0; }
/* le chef : photo pleine hauteur, citation posée dessus */
.mz__chef img { position: absolute; inset: 0; object-position: 50% 30%; }
.mz__chef::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(10, 9, 8, .95) 0%, rgba(10, 9, 8, .6) 35%, rgba(10, 9, 8, 0) 65%); }
.mz__chef-txt { position: absolute; z-index: 1; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; gap: 18px; padding: clamp(24px, 3vw, 52px); }
.mz__chef-txt blockquote { margin: 0; }
.mz__chef-txt blockquote p { margin: 0; font: 400 clamp(28px, 2.6vw, 46px)/1.08 var(--f-serif); color: #F6F1E7; text-wrap: balance; }
.mz__chef-txt em { color: var(--gold); }
.mz__sign { margin: 0; font: italic 400 clamp(22px, 1.6vw, 28px)/1 var(--f-serif); color: #F6F1E7; }
.mz__sign span { margin-left: 10px; font: 500 11px/1 var(--f-text); font-style: normal; letter-spacing: .16em; text-transform: uppercase; color: rgba(244, 239, 230, .65); }
/* tuiles de texte */
.mz__txt { display: flex; flex-direction: column; justify-content: flex-end; gap: 10px; padding: clamp(20px, 2vw, 34px); background: #15120E; box-shadow: inset 0 0 0 1px var(--line); }
.mz__txt span { font: 500 12px/1 var(--f-text); letter-spacing: .14em; color: var(--gold); }
.mz__txt b { font: 600 clamp(20px, 1.7vw, 28px)/1.1 var(--f-display); font-stretch: 108%; text-transform: uppercase; }
.mz__txt p { margin: 0; font-size: clamp(14px, 1vw, 16px); line-height: 1.55; color: var(--ink-2); max-width: 36ch; }
.mz__txt--gold { background: var(--gold); box-shadow: none; color: #0A0908; }
.mz__txt--gold span, .mz__txt--gold p { color: rgba(10, 9, 8, .78); }
/* la vidéo carrée occupe sa tuile */
.mz__vid.sqvid { aspect-ratio: auto; box-shadow: none; }

/* vidéo carrée (ou fondu de photos) */
.sqvid { position: relative; margin: 0; overflow: hidden; background: var(--bg-raise); }
.sqvid__stage, .sqvid__stage img, .sqvid__stage video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.sqvid__stage img { opacity: 0; scale: 1.02; transition: opacity 1.4s var(--ease-io); }
.sqvid__stage img.is-on { opacity: 1; animation: sqKen 9s linear both; }
.sqvid.is-paused .sqvid__stage img.is-on { animation-play-state: paused; }
@keyframes sqKen { from { scale: 1.02; } to { scale: 1.12; } }
.sqvid::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0, 0, 0, .55), transparent 40%); pointer-events: none; }
.sqvid__sound { z-index: 2; }
.sqvid__cap { position: absolute; left: 22px; bottom: 26px; z-index: 1; display: flex; align-items: center; gap: 10px; font: 500 12px/1 var(--f-text); letter-spacing: .16em; text-transform: uppercase; color: #F4EFE6; }


/* le bar : cartes cocktails, à la couleur de chaque recette */
.bar { overflow: hidden; background: #0C0A09; isolation: isolate; }
.bar__glow { position: absolute; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(ellipse 50% 40% at 12% 18%, rgba(240, 123, 36, .16), transparent 70%), radial-gradient(ellipse 45% 40% at 90% 55%, rgba(194, 24, 74, .13), transparent 70%), radial-gradient(ellipse 40% 35% at 30% 95%, rgba(111, 191, 115, .09), transparent 70%); }
.cocktails__filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: clamp(26px, 3vw, 40px); }
.cocktails__filters button { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; font: 500 13px/1 var(--f-text); letter-spacing: .1em; text-transform: uppercase; color: var(--ink-2); box-shadow: inset 0 0 0 1px var(--line-2); transition: background .3s, color .3s; }
.cocktails__filters button span { font-size: 11px; opacity: .6; }
.cocktails__filters button:hover { color: var(--ink); }
.cocktails__filters button[aria-pressed="true"] { background: var(--ink); color: #0A0908; box-shadow: none; }
.cocktails__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 10px; }
.ck { position: relative; display: flex; flex-direction: column; gap: 8px; padding: 18px 20px 18px 22px; overflow: hidden;
  background: radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--c) 30%, transparent), transparent 60%), #141210;
  box-shadow: inset 0 0 0 1px rgba(244, 239, 230, .08); transition: box-shadow .4s var(--ease), translate .5s var(--ease); }
.ck::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--c); }
.ck:hover { translate: 0 -3px; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--c) 55%, transparent), 0 24px 50px rgba(0, 0, 0, .45); }
.ck__top { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.ck__price { font: 600 19px/1 var(--f-display); font-stretch: 110%; color: var(--gold); white-space: nowrap; }
.ck__name { margin: 0; font: 400 clamp(24px, 1.8vw, 28px)/1.05 var(--f-serif); color: var(--ink); }
.ck__desc { margin: 0; font-size: 13.5px; line-height: 1.5; color: var(--ink-3); flex: 1; }
.ck__foot { display: flex; flex-wrap: wrap; gap: 6px; padding-top: 2px; }
.ck__tag { padding: 5px 8px 4px; font: 500 11px/1 var(--f-text); letter-spacing: .1em; text-transform: uppercase; color: var(--ink-2); box-shadow: inset 0 0 0 1px var(--line-2); }
.bar__more { margin-top: clamp(56px, 6vw, 96px); }
@media (max-width: 700px) {
  .cocktails__filters { flex-wrap: nowrap; overflow-x: auto; margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); scroll-padding-inline: var(--gutter); scroll-snap-type: x proximity; scrollbar-width: none; }
  .cocktails__filters::-webkit-scrollbar { display: none; }
  .cocktails__filters button { flex: none; scroll-snap-align: start; }
}
.bar__more-t { margin: 0 0 clamp(26px, 3vw, 40px); font: 600 clamp(28px, 3vw, 46px)/1.05 var(--f-display); font-stretch: 108%; text-transform: uppercase; letter-spacing: -.01em; }
.bar__more-t em { text-transform: none; font-weight: 400; color: var(--gold); }

@media (prefers-reduced-motion: reduce) {
  .sqvid__stage img.is-on { animation: none; }
}
@media (max-width: 1080px) {
  .rhero__grid { grid-template-columns: 1fr; align-items: start; }
  .mz { --n: 6;
    grid-template-areas:
      "chef chef chef chef p1 p1" "chef chef chef chef p1 p1" "chef chef chef chef p1 p1"
      "chef chef chef chef p2 p2" "chef chef chef chef p2 p2" "chef chef chef chef p2 p2"
      "vid vid vid vid t1 t1" "vid vid vid vid t1 t1" "vid vid vid vid t2 t2" "vid vid vid vid t2 t2"
      "p3 p3 p4 p4 p5 p5" "p3 p3 p4 p4 p5 p5" "p3 p3 p4 p4 p5 p5"
      "t3 t3 t3 t3 p6 p6" "t3 t3 t3 t3 p6 p6" "t3 t3 t3 t3 p6 p6";
    grid-template-rows: repeat(10, var(--c)) repeat(6, var(--x)); }
}
@media (max-width: 700px) {
  .rhero .photo-hero__content { padding-top: calc(var(--header-h) + 40px); }
  .mz { --n: 4;
    grid-template-areas:
      "chef chef chef chef" "chef chef chef chef" "chef chef chef chef" "chef chef chef chef" "chef chef chef chef" "chef chef chef chef"
      "vid vid vid vid" "vid vid vid vid" "vid vid vid vid" "vid vid vid vid"
      "t1 t1 t1 t1" "t1 t1 t1 t1"
      "p1 p1 p2 p2" "p1 p1 p2 p2" "p1 p1 p2 p2"
      "t2 t2 t2 t2" "t2 t2 t2 t2"
      "p3 p3 p4 p4" "p3 p3 p4 p4" "p3 p3 p4 p4"
      "t3 t3 t3 t3" "t3 t3 t3 t3"
      "p5 p5 p6 p6" "p5 p5 p6 p6" "p5 p5 p6 p6";
    grid-template-rows: repeat(17, var(--c)) repeat(3, var(--x)) repeat(2, var(--c)) repeat(3, var(--x)); }
  .mz__txt { padding: 16px; }
  .slate__list li { grid-template-columns: 1fr; gap: 6px; }
}

/* =========================================================
   Page d'une soirée (soiree-<slug>.html, générée par le back office)
   ========================================================= */
.sv { position: relative; overflow: hidden; isolation: isolate; padding: calc(var(--header-h) + clamp(40px, 6vw, 96px)) 0 clamp(64px, 8vw, 128px); }
.sv__bg { position: absolute; inset: -10%; z-index: -1; }
.sv__bg img { width: 100%; height: 100%; object-fit: cover; filter: blur(70px) saturate(1.3) brightness(.45); transform: scale(1.1); }
.sv__bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10, 9, 8, .35), rgba(10, 9, 8, .6) 60%, var(--bg)); }
.sv__grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(36px, 6vw, 110px); align-items: center; }
/* grands écrans : affiche et infos occupent 75 % de la largeur (au-delà de la largeur maximale commune du site) */
.wrap.sv__grid { max-width: max(var(--max), calc(75vw + 2 * var(--gutter))); }
.sv__poster img { display: block; width: 100%; height: auto; box-shadow: 0 40px 90px rgba(0, 0, 0, .6), 0 0 0 1px rgba(244, 239, 230, .1); }
.sv.is-past .sv__poster img { filter: grayscale(.7) brightness(.8); }
.sv__info { display: flex; flex-direction: column; gap: 22px; min-width: 0; }
.crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; font-size: 13px; color: var(--ink-3); }
.crumbs li + li::before { content: "/"; margin-right: 6px; opacity: .6; }
.crumbs a { color: var(--ink-2); text-decoration: none; }
.crumbs a:hover { color: var(--gold); }
.crumbs [aria-current] { color: var(--ink-2); }
.sv__kicker { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 0; font: 500 13px/1 var(--f-text); letter-spacing: .16em; text-transform: uppercase; color: var(--gold); }
.sv__count { padding: 7px 11px 6px; background: var(--gold); color: #0A0908; font-weight: 600; }
.sv.is-live .sv__count { animation: svPulse 1.6s ease-in-out infinite; }
@keyframes svPulse { 50% { box-shadow: 0 0 0 8px rgba(253, 200, 82, 0); } 0%, 100% { box-shadow: 0 0 0 0 rgba(253, 200, 82, .5); } }
.sv__t { margin: 0; font-size: clamp(40px, 5.6vw, 96px); text-wrap: balance; hyphens: none; }
.sv__accroche { margin: -6px 0 0; font: italic 400 clamp(26px, 2.6vw, 40px)/1.15 var(--f-serif); color: var(--ink); text-wrap: balance; }
.sv__past { margin: 0; padding: 14px 18px; background: rgba(244, 239, 230, .06); box-shadow: inset 3px 0 0 var(--gold); }
.sv__facts { margin: 6px 0 0; border-top: 1px solid var(--line-2); }
.sv__facts .kv { display: grid; grid-template-columns: 150px 1fr; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); align-items: baseline; }
.sv__facts dd { margin: 0; text-align: left; font-size: 16px; }
.sv__acts { display: flex; flex-direction: column; gap: 18px; margin-top: 8px; }
/* agenda, rappel, partage : pictos seuls (libellé en infobulle et pour les lecteurs d'écran) */
.sv__tools { display: flex; flex-wrap: wrap; gap: 10px; }
.sv__tool { display: inline-grid; place-items: center; width: 48px; height: 48px; padding: 0; border-radius: 50%; box-shadow: inset 0 0 0 1px var(--line-2); color: var(--ink-2); transition: color .3s, box-shadow .3s; }
.sv__tool:hover { color: var(--gold); box-shadow: inset 0 0 0 1px var(--gold); }
.sv__tool svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.5; }
.sv-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 1px; background: var(--line); box-shadow: 0 0 0 1px var(--line); }
.sv-step { display: flex; flex-direction: column; gap: 12px; padding: clamp(24px, 2.4vw, 36px); background: #100E0B; }
.sv-step__n { font: 500 12px/1 var(--f-text); letter-spacing: .14em; color: var(--gold); }
.sv-step h3 { margin: 0; font: 600 20px/1.15 var(--f-display); font-stretch: 108%; text-transform: uppercase; }
.sv-step p { margin: 0; flex: 1; font-size: 15px; line-height: 1.65; color: var(--ink-2); }
.sv-step .link { align-self: flex-start; }
.event__link { color: inherit; text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .5s var(--ease), color .3s; }
.event__link:hover { color: var(--gold); background-size: 100% 1px; }
@media (max-width: 900px) {
  .sv__grid { grid-template-columns: 1fr; }
  .sv__poster { max-width: 440px; }
  .sv__facts .kv { grid-template-columns: 1fr; gap: 4px; }
}
@media (prefers-reduced-motion: reduce) { .sv.is-live .sv__count { animation: none; } }

/* champ piège anti-robots des formulaires (invisible pour les visiteurs et les lecteurs d'écran) */
.hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* La Plage fermée pour la saison (réglage du back office, js/reglages.js) */
.no-plage [data-plage] { display: none !important; }
html:not(.no-plage) [data-plage-off] { display: none !important; }
.room__off { margin-left: auto; padding: 5px 10px 4px; background: var(--gold); color: #0A0908; font: 600 11px/1 var(--f-text); letter-spacing: .14em; text-transform: uppercase; }
.slate__main { position: relative; min-width: 0; }
.slate__side { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 18px; padding-left: clamp(28px, 4vw, 72px); border-left: 1px dashed rgba(239, 234, 224, .22); }
.slate--carte .slate__f { width: 100%; margin: 0; padding: 0; border: 0; grid-template-columns: 1fr; gap: 20px; }
.slate--carte .slate__f b { font-size: clamp(36px, 3.2vw, 52px); }
.slate--carte .slate__f span { font-size: 14px; }
.slate--carte .slate__f li { justify-content: flex-end; }
.slate__hours span { white-space: nowrap; }
.slate--carte .slate__list li { grid-template-columns: 96px 1fr; padding: 18px 0; }
.slate--carte .slate__v { font-size: clamp(24px, 2.1vw, 34px); }
@media (max-width: 860px) {
  .slate--carte { grid-template-columns: 1fr; }
  .slate__side { padding: 24px 0 0; border-left: 0; border-top: 1px dashed rgba(239, 234, 224, .22); }
  .slate--carte .slate__f { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) { .slate--carte .slate__list li { grid-template-columns: 1fr; gap: 6px; } }
@media print {
  .print-carte .slate--carte { display: block; padding: 0; background: none; box-shadow: none; }
  .print-carte .slate--carte::before, .print-carte .slate__side .btn, .print-carte .slate__days { display: none !important; }
  .print-carte .slate__side { padding: 16px 0 0; border: 0; }
}

/* =========================================================
   Inscriptions sur les pages soirée (Teens Party, exposants…)
   ========================================================= */
.insc { background: radial-gradient(ellipse 55% 60% at 0% 20%, rgba(253, 200, 82, .1), transparent 70%), #0E0C09; border-top: 1px solid var(--line); }
.insc__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(36px, 6vw, 110px); align-items: start; }
.insc__intro { position: sticky; top: calc(var(--header-h) + 32px); display: flex; flex-direction: column; gap: 22px; }
.insc__intro .display { margin: 0; font-size: clamp(34px, 3.8vw, 60px); line-height: .98; text-wrap: balance; hyphens: none; }
.insc__state { margin: 0; align-self: flex-start; padding: 10px 14px 9px; background: rgba(244, 239, 230, .08); font: 600 13px/1.3 var(--f-text); letter-spacing: .08em; text-transform: uppercase; color: var(--ink); box-shadow: inset 3px 0 0 var(--gold); }
.insc__state.is-low { background: var(--gold); color: #0A0908; box-shadow: none; }
.insc__state.is-full { box-shadow: inset 3px 0 0 #FF9B8A; }
.insc__state.is-off { color: var(--ink-2); box-shadow: inset 3px 0 0 var(--line-2); }
.insc__back { margin: 0; padding: 12px 16px; background: rgba(155, 217, 168, .12); color: #CDEFD4; font-size: 15px; }
.insc__facts { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line-2); }
.insc__facts li { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.insc__facts span { font: 500 12px/1.4 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); }
.insc__facts b { font-weight: 500; text-align: right; }
.insc__form { grid-column: auto; padding: clamp(24px, 3vw, 44px); background: rgba(20, 18, 15, .7); box-shadow: inset 0 0 0 1px var(--line); }
@media (max-width: 900px) {
  .insc__grid { grid-template-columns: 1fr; }
  .insc__intro { position: static; }
}

/* consentement : texte d'autorisation et signature */
.insc-info { padding: 20px 22px; background: rgba(253, 200, 82, .07); box-shadow: inset 3px 0 0 var(--gold); }
.insc-info__t { margin: 0 0 8px; font: 600 13px/1.3 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--gold); }
.insc-info__x { margin: 0; font: italic 400 clamp(19px, 1.5vw, 22px)/1.45 var(--f-serif); color: var(--ink); }
.sign { position: relative; }
.sign__pad { display: block; width: 100%; aspect-ratio: 3 / 1; background: #F7F3EC; cursor: crosshair; touch-action: none; box-shadow: inset 0 0 0 1px var(--line-2); }
.sign__pad:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.sign__line { position: absolute; left: 4%; right: 4%; bottom: 22%; padding-top: 6px; border-top: 1px dashed rgba(21, 18, 14, .35); font: 500 11px/1 var(--f-text); letter-spacing: .16em; text-transform: uppercase; color: rgba(21, 18, 14, .45); pointer-events: none; }
.is-signed .sign__line { opacity: 0; }
.sign__tools { display: flex; justify-content: space-between; gap: 16px; margin-top: 8px; }
.field.is-invalid .sign__pad { box-shadow: inset 0 0 0 2px var(--danger); }

/* « Inscription obligatoire » sur l'affiche */
.event__must { position: absolute; z-index: 3; left: 16px; right: 16px; bottom: 16px; padding: 10px 12px 9px; background: var(--gold); color: #0A0908; font: 700 12px/1.2 var(--f-text); letter-spacing: .14em; text-transform: uppercase; text-align: center; box-shadow: 0 10px 30px rgba(0, 0, 0, .35); }
.sv__poster { position: relative; }
.sv__must { position: absolute; z-index: 2; left: 50%; bottom: -18px; transform: translateX(-50%); white-space: nowrap; padding: 13px 22px 12px; background: var(--gold); color: #0A0908; font: 700 13px/1 var(--f-text); letter-spacing: .16em; text-transform: uppercase; text-decoration: none; box-shadow: 0 16px 40px rgba(0, 0, 0, .5); transition: background .3s; }
.sv__must:hover { background: var(--gold-2); }

/* Avis clients : bandeau doré qui défile entre la carte et le bar */
.avis { padding: clamp(80px, 10vw, 150px) 0 clamp(56px, 6vw, 96px); overflow: hidden; }
.avis__head { margin-bottom: clamp(36px, 4.4vw, 64px); }
.avis__side { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; }
.avis__score { display: flex; align-items: center; gap: 14px; }
.avis__score > b { font: 600 clamp(52px, 5vw, 76px)/.9 var(--f-display); font-stretch: 110%; letter-spacing: -.03em; }
.avis__score > span { display: flex; flex-direction: column; gap: 6px; }
.avis__score small { font: 500 12px/1.2 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-2); }
.avis__pause { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 18px 0 14px; font: 500 12px/1 var(--f-text); letter-spacing: .12em; text-transform: uppercase; color: var(--ink); box-shadow: inset 0 0 0 1px var(--line-2); transition: background .3s, color .3s; }
@media (hover: hover) { .avis__pause:hover { background: var(--ink); color: #FDC852; } }
.avis__pause svg { width: 18px; height: 18px; fill: currentColor; }
.avis__pause .i-play, .avis.is-paused .avis__pause .i-pause { display: none; }
.avis.is-paused .avis__pause .i-play { display: inline; }
.avis__stars { display: inline-flex; gap: 2px; color: var(--gold); }
.avis__stars svg { width: 15px; height: 15px; fill: currentColor; }
.avis__stars .is-off { opacity: .28; }
.avis__rail { -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); }
.avis__track { display: flex; width: max-content; margin: 0; padding: 0; list-style: none; animation: avis-defile var(--avis-dur, 90s) linear infinite; }
.avis.is-paused .avis__track, .avis.is-off .avis__track, .avis__rail:hover .avis__track { animation-play-state: paused; }
@keyframes avis-defile { to { transform: translate3d(-50%, 0, 0); } }
.avis__c { --ink: #F4EFE6; --ink-3: rgba(244, 239, 230, .6); --gold: #FDC852; --line: rgba(244, 239, 230, .13);
  flex: none; display: flex; flex-direction: column; gap: 18px; width: clamp(280px, 28vw, 400px); margin-right: 16px; padding: 28px 28px 24px; background: #0A0908; color: var(--ink); box-shadow: 0 24px 50px -24px rgba(10, 9, 8, .6); }
.avis__q { margin: 0; flex: 1; }
.avis__q p { margin: 0; font: 400 clamp(21px, 1.6vw, 25px)/1.3 var(--f-serif); text-wrap: pretty; }
.avis__c--long .avis__q p { font-size: clamp(18px, 1.3vw, 21px); }
.avis__by { display: flex; flex-direction: column; gap: 4px; margin: 0; padding-top: 16px; border-top: 1px solid var(--line); }
.avis__by b { font: 600 15px/1.2 var(--f-text); }
.avis__by span { font-size: 13px; color: var(--ink-3); }
.avis__src { margin-top: clamp(28px, 3vw, 40px); margin-bottom: 0; font-size: 14px; color: var(--ink-2); }
.avis__demo { display: inline-block; margin-right: 6px; padding: 4px 8px 3px; background: #0A0908; color: #FDC852; font-weight: 500; }
/* moins d'animations demandées : rien ne bouge, on fait défiler au doigt ou au trackpad */
.avis.is-static .avis__rail { overflow-x: auto; padding-inline: var(--gutter); scroll-padding-inline: var(--gutter); scroll-snap-type: x mandatory; -webkit-mask-image: none; mask-image: none; }
.avis.is-static .avis__track { animation: none; padding-bottom: 12px; }
.avis.is-static .avis__c { scroll-snap-align: start; }
@media (prefers-reduced-motion: reduce) { .avis__track { animation: none; } }
@media (max-width: 700px) {
  .avis__c { width: min(82vw, 340px); padding: 24px 22px 20px; }
  .avis__side { width: 100%; justify-content: space-between; }
}

/* Line-up d'une soirée : une ligne par salle (Grande salle, Bar Club, Warm'up…) */
.sv-lu { margin-top: 26px; }
.sv-lu__t { margin: 0 0 6px; font: 500 12px/1 var(--f-text); letter-spacing: .2em; text-transform: uppercase; color: var(--gold); }
.sv-lu__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line-2); }
.sv-lu__list li { display: grid; grid-template-columns: 150px 1fr; gap: 16px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--line); }
.sv-lu__s { font: 500 13px/1.3 var(--f-text); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); }
.sv-lu__s small { display: block; margin-top: 3px; font-size: 12px; letter-spacing: .04em; text-transform: none; color: var(--ink-3); }
.sv-lu__dj { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font: 600 clamp(20px, 1.6vw, 24px)/1.1 var(--f-display); font-stretch: 108%; text-transform: uppercase; }
.sv-lu__dj img { width: 48px; height: 48px; object-fit: cover; border-radius: 50%; box-shadow: 0 0 0 2px var(--gold); }
.sv-lu__dj a { color: inherit; text-decoration: none; background: linear-gradient(var(--gold), var(--gold)) 0 100%/0 2px no-repeat; transition: background-size .4s var(--ease); }
.sv-lu__dj a:hover { background-size: 100% 2px; }
.sv-lu__plus { color: var(--gold); font-weight: 400; }
.sv-lu__tag { display: inline-block; padding: 5px 8px 4px; font: 500 11px/1 var(--f-text); font-stretch: 100%; letter-spacing: .16em; text-transform: uppercase; color: var(--gold); box-shadow: inset 0 0 0 1px var(--gold); }
.sv-lu__tag--g { background: var(--gold); color: #0A0908; box-shadow: none; }
.sv-lu__tba { font: italic 400 clamp(20px, 1.6vw, 24px)/1.1 var(--f-serif); text-transform: none; color: var(--ink-2); }
.sv-lu__pic { display: contents; }
.sv-lu__tag--pic { display: none; }
@media (max-width: 600px) {
  .sv-lu__list li { grid-template-columns: 1fr; gap: 6px; }
  /* une ligne : photo (étiquette Résident / Guest posée dessous), puis le nom, un peu plus petit */
  .sv-lu__dj { font-size: 18px; font-stretch: 100%; }
  .sv-lu__pic { position: relative; display: inline-grid; flex: none; padding-bottom: 7px; }
  .sv-lu__tag--pic { display: block; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); padding: 3px 5px 2px; font-size: 8.5px; letter-spacing: .1em; white-space: nowrap; background: var(--bg); }
  .sv-lu__tag--pic.sv-lu__tag--g { background: var(--gold); }
  .sv-lu__tag--txt { display: none; }
}

/* Animations d'une soirée (déco, danseuses, percussionniste…) */
.sv-an__list { list-style: none; margin: 0; padding: 12px 0 0; display: flex; flex-wrap: wrap; gap: 10px; border-top: 1px solid var(--line-2); }
.sv-an__list li { display: inline-flex; align-items: center; gap: 10px; padding: 8px 14px; box-shadow: inset 0 0 0 1px var(--line-2); }
.sv-an__list li.is-artist { box-shadow: inset 0 0 0 1px var(--line-gold); }
.sv-an__list img { width: 40px; height: 40px; margin: -2px 0 -2px -6px; object-fit: cover; border-radius: 50%; }
.sv-an__list b { font: 500 15px/1.2 var(--f-text); letter-spacing: .02em; }
.sv-an__list a { color: inherit; text-decoration: none; border-bottom: 1px solid var(--gold); }
.sv-an__list small { display: block; font-size: 12px; color: var(--ink-3); }

/* cartes des soirées : tarif long sous le titre ; image cliquable vers la page de la soirée */
.event__body > * { min-width: 0; }
.event__price { max-width: 100%; overflow-wrap: anywhere; }
.event__price--long { grid-column: 1 / -1; text-align: left; white-space: normal; letter-spacing: .04em; }
.event__meta { overflow-wrap: anywhere; }
/* grilles de 5 affiches : description sur 3 lignes au plus (le reste est sur la page de la soirée) */
.events--wide .event__meta { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden; }
.event__mini { display: none; }
/* mobile, 2 colonnes : carte réduite au nom, à la date et l'heure, au prix et à l'âge */
@media (max-width: 720px) {
  .events--wide .event__price, .events--wide .event__when, .events--wide .event__meta, .events--wide .event__acts { display: none; }
  .events--wide .event__mini { display: block; grid-column: 1 / -1; margin: 0; font-size: 13px; line-height: 1.4; color: var(--ink-2); }
  .events--wide .event__mini b { font-weight: 500; color: var(--gold); }
  .events--wide .event__mini span { display: block; margin-top: 3px; color: var(--ink); }
}
/* sélections de 5 soirées (accueil, sous une fiche) : des rangées pleines quand il y a moins de 5 colonnes */
@media (min-width: 901px) and (max-width: 1180px) { .events--wide[data-events="5"] .event:nth-child(n+4) { display: none; } }
@media (max-width: 900px) { .events--wide[data-events="5"] .event:nth-child(n+5) { display: none; } }
.event__media-link { position: absolute; inset: 0; z-index: 4; }

/* téléphones cliquables dans les cartes (au-dessus du lien de la carte) */
.event__tel { position: relative; z-index: 5; color: inherit; text-decoration: underline; text-decoration-color: var(--gold); text-underline-offset: 3px; white-space: nowrap; }
.event__tel:hover { color: var(--gold); }
/* numéro + « ou en ligne → » : un seul style partout (lien or souligné, même taille), toujours sur la même ligne */
.tel-pair { white-space: nowrap; }
/* « en ligne » d'abord, puis le numéro, en retrait */
.tel-pair .tel-sec { color: var(--ink-3); }
/* fiche d'une soirée, ligne « Contacts » : libellé, puis numéro ou en ligne → */
.sv-tels { display: flex; flex-wrap: wrap; gap: 6px 28px; margin: 0; padding: 0; list-style: none; }
.sv-tels li { display: flex; align-items: baseline; gap: 10px; }
.sv-tels li > span:not(.tel-pair) { font: 500 11px/1.4 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); }
/* public majeur : pièce d'identité physique obligatoire */
.sv__facts dd:has(.sv__id) { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; }
.sv__id { display: inline-block; padding: 4px 8px 3px; background: var(--gold); color: #0A0908; font: 600 11px/1.3 var(--f-text); letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; }

.sv-lu__who { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.sv-lu__d { font: 400 14px/1.4 var(--f-text); color: var(--ink-2); }

/* numéros de téléphone : jamais coupés en fin de ligne */
/* un numéro de téléphone ne se coupe jamais */
a.inline-link[href^="tel:"], .sv__facts a[href^="tel:"] { white-space: nowrap; }
@media (max-width: 600px) { .sv__id-x { display: none; } }
@media (max-width: 360px) { .sv__id { white-space: normal; } }

.sv__acts .btns:empty { display: none; }
/* page d'une soirée : table, VIP, navette ; sur une ligne en grand écran, sinon les boutons remplissent la largeur */
.sv__acts .btns .btn { flex: 1 1 auto; }
@media (min-width: 1200px) { .sv__acts .btns .btn { padding: 0 18px; letter-spacing: .12em; } }

/* Le Chalet : espace restauration à part, avec sa carte ; caché tant qu'il est fermé (Indian's › Réglages) */
html:not(.has-chalet) [data-chalet] { display: none !important; }
.chalet__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 40px; align-items: center; margin-bottom: clamp(48px, 6vw, 88px); }
.chalet__media { grid-column: 1 / span 6; aspect-ratio: 4 / 3; overflow: hidden; background: #000; }
.chalet__media img { width: 100%; height: 100%; object-fit: cover; }
.chalet__media--reel { aspect-ratio: auto; overflow: visible; background: none; display: flex; justify-content: center; }
.chalet__reel { grid-column: auto; width: min(100%, 420px, calc((100svh - 140px) * 9 / 16)); }
.chalet__txt { grid-column: 8 / span 5; display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
/* « Le Chalet, » toujours sur une ligne : la taille du titre suit la largeur de la colonne (« Le Chalet, » ≈ 6,3 em de large) */
.chalet__txt { container-type: inline-size; }
.chalet__txt .display--l { font-size: clamp(34px, 15cqw, 92px); }
.chalet__txt .display--l .ln > span { white-space: nowrap; }
.chalet__when { margin: -8px 0 0; font: 500 15px/1.5 var(--f-text); color: var(--gold); }
/* le petit manifeste : des lignes courtes en italique, un trait d'or devant chacune */
.chalet__manif { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.chalet__manif li { position: relative; padding-left: 26px; font: italic 400 clamp(19px, 1.45vw, 23px)/1.3 var(--f-serif); color: var(--ink); text-wrap: balance; }
.chalet__manif li::before { content: ""; position: absolute; left: 0; top: .68em; width: 14px; height: 1px; background: var(--gold); }
@media (max-width: 900px) { .chalet__media, .chalet__txt { grid-column: 1 / -1; } }

/* volet › Pro & groupes : le formulaire de la page Entreprises (prestations à cocher, consentement) */
.q-tip { margin: 0 0 6px; }
.q-tip b { color: var(--gold); font-weight: 600; }
.q-pk { display: flex; flex-direction: column; gap: 10px; margin: 14px 0 18px; }
.q-pk__t { margin: 0; font: 600 13px/1.3 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--ink); }
.q-pk__t small { display: block; margin-top: 4px; font: 400 14px/1.4 var(--f-text); letter-spacing: 0; text-transform: none; color: var(--ink-3); }

/* club : prix des formules (page Club) et estimation dans le volet « Réserver » */
.vip__price { margin: 4px 0 0; font: 400 15px/1.5 var(--f-text) !important; color: var(--ink-2); }
.vip__price b { font: 600 26px/1 var(--f-display); font-stretch: 108%; color: var(--gold); margin-right: 4px; }
.vip__price small { display: block; margin-top: 2px; font-size: 13.5px; color: var(--ink-3); }
.vip-est { margin: -6px 0 0; padding: 12px 16px; background: rgba(253, 200, 82, .08); box-shadow: inset 2px 0 0 var(--gold); font: 500 15px/1.5 var(--f-text); color: var(--ink); }
.vip-est:empty { display: none; }

/* table réservée : choix des bouteilles dans le volet, carte bouteilles sur la page Club */
.vip-bt label small { margin-left: 6px; color: var(--gold); letter-spacing: .08em; }
.vip-bt__list { display: flex; flex-direction: column; margin-top: 4px; box-shadow: inset 0 0 0 1px var(--line-2); }
.vip-bt__rub { margin: 0; padding: 12px 16px 8px; font: 600 12px/1.3 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--gold); }
.vip-bt__it { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 14px; align-items: center; padding: 10px 16px; border-top: 1px solid var(--line); }
.vip-bt__n { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.vip-bt__n b { font: 500 15px/1.35 var(--f-text); color: var(--ink); }
.vip-bt__n b small { margin-left: 4px; font-size: 13px; color: var(--ink-3); }
.vip-bt__n em { font: 400 13px/1.4 var(--f-text); font-style: normal; color: var(--ink-3); }
.vip-bt__p { font: 600 15px/1 var(--f-text); color: var(--ink-2); white-space: nowrap; }
.stepper--sm { display: inline-flex; align-items: center; box-shadow: inset 0 0 0 1px var(--line-2); }
.stepper--sm button { width: 40px; height: 40px; border: 0; background: none; color: var(--ink); font-size: 20px; cursor: pointer; }
.stepper--sm button:hover { background: var(--field-focus); }
.stepper--sm output { min-width: 26px; text-align: center; font: 600 16px/1 var(--f-text); color: var(--ink); }
.field.is-invalid .vip-bt__list { box-shadow: inset 0 0 0 2px var(--danger); }

/* volet « Réserver » › club : bouteilles choisies, avec goût et soft */
.vip-bt .field__help { margin-top: 2px; }
.vip-bt__list { box-shadow: none; gap: 8px; margin-top: 6px; }
.vip-bt__list:empty { display: none; }
.vip-bt__it { display: flex; flex-direction: column; gap: 10px; padding: 12px 14px; border-top: 0; box-shadow: inset 0 0 0 1px var(--line-2); align-items: stretch; }
.vip-bt__top { display: flex; align-items: center; gap: 12px; }
.vip-bt__top b { flex: 1; font: 500 15px/1.35 var(--f-text); color: var(--ink); }
.vip-bt__top b small { margin-left: 4px; font-size: 13px; color: var(--ink-3); }
.vip-bt__x { width: 36px; height: 36px; border: 0; background: none; color: var(--ink-2); font-size: 22px; line-height: 1; cursor: pointer; }
.vip-bt__x:hover { color: var(--gold); }
.vip-bt__opts { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 8px 10px; }
.vip-bt__o { display: flex; flex-direction: column; gap: 4px; font: 500 11.5px/1.3 var(--f-text) !important; letter-spacing: .1em !important; text-transform: uppercase; color: var(--ink-3) !important; }
.vip-bt__o select { min-height: 42px; padding: 8px 34px 8px 12px; font-size: 15px; background-position: right 10px center; }
.choice__px { font-weight: inherit; margin-left: .25em; }

/* volet « Réserver » › VIP, version simple : soirée + personnes, formules en cartes, bouteilles en liste, jauge */
.vipf__when { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 16px; }
.vipf__show { margin: 4px 0 0; font: 500 14px/1.4 var(--f-text); color: var(--gold); }
.vipf__cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.vipf__card { position: relative; display: flex; flex-direction: column; gap: 4px; padding: 14px 14px 12px; cursor: pointer; box-shadow: inset 0 0 0 1px var(--line-2);
  font: 400 13.5px/1.35 var(--f-text) !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--ink-3) !important; transition: box-shadow .2s, background-color .2s; }
.vipf__card input { position: absolute; opacity: 0; width: 1px; height: 1px; min-height: 0; padding: 0; }
.vipf__card b { font: 600 15px/1.2 var(--f-text); color: var(--ink); }
.vipf__card em { margin-top: auto; padding-top: 6px; font: 600 14px/1.3 var(--f-text); font-style: normal; color: var(--gold); }
.vipf__card:hover { box-shadow: inset 0 0 0 1px var(--ink-3); }
.vipf__card:has(input:checked) { box-shadow: inset 0 0 0 2px var(--gold); background: rgba(253, 200, 82, .07); }
.vipf__card:has(input:focus-visible) { outline: 2px solid var(--gold); outline-offset: 2px; }
.vipf__card.is-off { opacity: .4; cursor: not-allowed; }
.vipf__card.is-off em { color: var(--ink-3); }
.vipf__note { margin: 8px 0 0; font: 400 14px/1.5 var(--f-text); color: var(--ink-2); }
.vipf__gauge { display: flex; flex-direction: column; gap: 8px; margin-bottom: 4px; }
.vipf__bar { height: 6px; background: var(--line-2); overflow: hidden; }
.vipf__bar span { display: block; height: 100%; width: 0; background: var(--gold); transition: width .3s; }
.vipf__gauge.is-over .vipf__bar span { background: #E8A33D; }
.vipf__gauge p { margin: 0; font: 600 15px/1.4 var(--f-text); color: var(--ink); }
.vipf__list { display: flex; flex-direction: column; }
.vipf__rub { margin: 14px 0 2px; font: 600 11.5px/1.3 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--gold); }
.vipf__b { border-top: 1px solid var(--line); }
.vipf__b.is-on { background: rgba(253, 200, 82, .05); }
.vipf__b-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 12px; align-items: center; padding: 8px 0 8px 10px; }
.vipf__b-n { font: 500 15px/1.35 var(--f-text); color: var(--ink); min-width: 0; }
.vipf__b-n small { margin-left: 4px; font-size: 13px; color: var(--ink-3); }
.vipf__b-n em { display: block; font: 400 12.5px/1.35 var(--f-text); font-style: normal; color: var(--ink-3); }
.vipf__b-p { font: 500 14px/1 var(--f-text); color: var(--ink-2); white-space: nowrap; }
.vipf__qty { display: inline-flex; align-items: center; }
.vipf__qty button { width: 38px; height: 38px; border: 0; border-radius: 50%; background: none; color: var(--ink); font-size: 20px; line-height: 1; cursor: pointer; box-shadow: inset 0 0 0 1px var(--line-2); }
.vipf__qty button:hover:not(:disabled) { box-shadow: inset 0 0 0 1px var(--gold); color: var(--gold); }
.vipf__qty button:disabled { opacity: .3; cursor: default; }
.vipf__qty output { min-width: 28px; text-align: center; font: 600 15px/1 var(--f-text); color: var(--ink); }
.vipf__b-opt { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px 10px; padding: 0 0 10px 10px; }
.vipf__b-i { align-self: center; width: 22px; font: 600 12px/1 var(--f-text); color: var(--ink-3); }
.vipf__o { display: flex; flex-direction: column; gap: 4px; flex: 1 1 130px; font: 500 11px/1.3 var(--f-text) !important; letter-spacing: .1em !important; text-transform: uppercase; color: var(--ink-3) !important; }
.vipf__o select { min-height: 40px; padding: 6px 30px 6px 10px; font-size: 14px; background-position: right 8px center; }
/* écran tactile : un champ en moins de 16 px fait zoomer la page sur iPhone (et elle reste zoomée, on peut la faire glisser) */
@media (pointer: coarse) { .vipf__o select, .vip-bt__o select { font-size: 16px; } }
@media (max-width: 560px) { .vipf__cards { grid-template-columns: minmax(0, 1fr); } .vipf__when { grid-template-columns: minmax(0, 1fr); } }

.vipf__cards .vipf__card { padding: 14px 14px 12px; }
.vipf__gauge { position: sticky; top: 0; z-index: 3; margin: 0 -2px 4px; padding: 10px 2px; background: var(--bg-raise, #15120E); }
.vipf__o:has(select[data-f="soft"]) { flex-basis: 170px; }
.vipf__gauge { top: calc(-1 * clamp(24px, 3vw, 44px)); padding-top: calc(clamp(24px, 3vw, 44px) + 10px); margin-top: calc(-1 * clamp(24px, 3vw, 44px)); }
.vipf .form__foot { display: flex; flex-direction: row-reverse; align-items: center; justify-content: flex-end; gap: 18px; }
.vipf .form__foot .muted { flex: 1; margin: 0; font-size: 13px; line-height: 1.5; }
@media (max-width: 560px) { .vipf .form__foot { flex-direction: column-reverse; align-items: stretch; } }
.vipf [data-bottles] > legend { position: relative; z-index: 4; }
.vipf .form__foot a[href^="tel:"] { white-space: nowrap; }

/* volet VIP : récapitulatif en fin de carte */
.vipf__recap { margin-top: 16px; padding: 16px 18px; background: rgba(253, 200, 82, .06); box-shadow: inset 0 0 0 1px var(--line-gold); }
.vipf__recap-t { margin: 0 0 10px; font: 600 12px/1.3 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--gold); }
.vipf__recap ul { list-style: none; margin: 0 0 10px; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.vipf__recap li, .vipf__recap dl > div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; }
.vipf__recap li span { display: flex; flex-direction: column; gap: 2px; font: 500 14.5px/1.35 var(--f-text); color: var(--ink); }
.vipf__recap li small { font-size: 12.5px; color: var(--ink-3); }
.vipf__recap li b, .vipf__recap dd { font: 600 14.5px/1.3 var(--f-text); color: var(--ink); white-space: nowrap; margin: 0; }
.vipf__recap-0 { margin: 0 0 10px; font-size: 14px; color: var(--ink-3); }
.vipf__recap dl { margin: 0; padding-top: 10px; border-top: 1px solid var(--line-2); display: flex; flex-direction: column; gap: 6px; }
.vipf__recap dt { font: 400 14px/1.35 var(--f-text); color: var(--ink-2); }
.vipf__recap .is-total { margin-top: 4px; }
.vipf__recap .is-total dt { font: 600 15px/1.3 var(--f-text); color: var(--ink); }
.vipf__recap .is-total dd { font: 600 22px/1 var(--f-display); font-stretch: 108%; color: var(--gold); }
.vipf__recap-n { margin: 8px 0 0; font-size: 13px; color: var(--ink-3); }
.vipf__recap .is-gift dt, .vipf__recap .is-gift dd { color: var(--gold); }
.vipf__recap .is-gift dt::after { content: " ✓"; }

/* « Complet » et précommande (Weezevent) */
.btn.is-off { opacity: .45; pointer-events: none; }
.event__vip.is-off { color: var(--ink-3); }
.vipf__card.is-full em { color: var(--danger) !important; }
.sv-pre__frame { margin: 24px 0 12px; background: #fff; box-shadow: inset 0 0 0 1px var(--line-2); }
.sv-pre__frame iframe { display: block; width: 100%; min-height: 760px; border: 0; }

/* Pro & groupes : séminaires en vidéo (format reel 9:16) */
.reel-sec__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 40px; align-items: center; }
.reel-sec__txt { grid-column: 1 / span 6; display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
/* logos des clients : sous la vidéo, le titre dans la grille et la bande sur toute la largeur de l'écran, sans fondu */
.logos { margin-top: clamp(88px, 11vw, 168px); display: flex; flex-direction: column; gap: 18px; }
.reel-sec:has(.logos) { padding-bottom: clamp(40px, 4.5vw, 72px); }   /* les logos ferment la section, près du bas */
.logos__t { margin: 0; font: 500 12px/1.3 var(--f-text); letter-spacing: .16em; text-transform: uppercase; color: var(--ink-2); }
.logos__vp { position: relative; margin-inline: calc(50% - 50vw); overflow: hidden; cursor: grab; touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.logos__vp.is-dragging { cursor: grabbing; }
.logos__track { display: flex; width: max-content; margin: 0; padding: 0; list-style: none; will-change: transform; }
.logos__i { flex: none; width: clamp(124px, 11vw, 190px); padding-inline: clamp(10px, 1.3vw, 22px); }
.logos__i img { display: block; width: 100%; height: auto; opacity: .78; pointer-events: none; -webkit-user-drag: none; transition: opacity .3s; }
.logos__i:hover img { opacity: 1; }
.reel { position: relative; grid-column: 7 / span 6; justify-self: center; width: min(100%, 560px, calc((100svh - 24px) * 9 / 16)); aspect-ratio: 9 / 16; margin: 0; overflow: hidden; background: #000; box-shadow: 0 30px 80px rgba(0, 0, 0, .5); }
.reel__v { display: block; width: 100%; height: 100%; object-fit: cover; }
.reel__sound { position: absolute; right: 14px; bottom: 14px; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: rgba(10, 9, 8, .6); color: var(--ink); cursor: pointer; backdrop-filter: blur(6px); transition: background-color .25s, color .25s; }
.reel__sound svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.reel__sound .i-hp { fill: currentColor; stroke: none; }
.reel__sound .i-on, .reel__sound[aria-pressed="true"] .i-off { display: none; }
.reel__sound[aria-pressed="true"] .i-on { display: inline; }
.reel__sound:hover, .reel__sound[aria-pressed="true"] { background: var(--gold); color: var(--dark); }
.reel__sound:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
@media (max-width: 900px) { .reel-sec__txt, .reel { grid-column: 1 / -1; } }

/* page d'une soirée : les artistes en vidéo (format reel), défilement horizontal */
.sv-reels__list { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(220px, 260px); gap: 18px; margin: 0; padding: 4px 0 18px; list-style: none; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; scrollbar-width: thin; }
.sv-reels__list > li { scroll-snap-align: start; }
.sv-reels .reel { grid-column: auto; width: 100%; box-shadow: 0 20px 50px rgba(0, 0, 0, .45); }
.reel__cap { position: absolute; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; gap: 4px; padding: 60px 64px 16px 16px; background: linear-gradient(180deg, rgba(10, 9, 8, 0), rgba(10, 9, 8, .88)); pointer-events: none; }
.reel__cap span { font: 500 11.5px/1.2 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--gold); }
.reel__cap b { font: 600 20px/1.05 var(--f-display); font-stretch: 108%; text-transform: uppercase; color: var(--ink); }
.reel__cap a { align-self: flex-start; min-height: 28px; display: inline-flex; align-items: center; font-size: 13.5px; color: var(--ink-2); pointer-events: auto; }
.reel__cap a:hover { color: var(--gold); }
@media (max-width: 600px) { .sv-reels__list { grid-auto-columns: 68vw; } }
/* « Ils sont déjà venus à l'Indian's » : bande des artistes sur toute la largeur, boucle infinie et défilement libre */
.loop__vp { position: relative; overflow: hidden; cursor: grab; touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.loop__vp.is-dragging { cursor: grabbing; }
.loop__track { display: flex; width: max-content; margin: 0; padding: 4px 0 24px; list-style: none; will-change: transform; }
.loop__i { flex: none; width: clamp(200px, 17vw, 260px); padding-inline: 9px; }
.loop__i img, .loop__i video { -webkit-user-drag: none; }
.sv-deja .shead { margin-bottom: clamp(28px, 3vw, 44px); }
/* deux bandes : entre elles, le même espace qu'entre deux cartes (18 px) */
.sv-deja .loop__track { padding-block: 0; }
.sv-deja .loop + .loop { margin-top: 18px; }
/* « Me rappeler » */
.sheet__body { margin-top: 4px; }
.rap { display: flex; flex-direction: column; gap: 14px; }
.rap__txt { font-size: 14.5px; line-height: 1.55; color: var(--ink-2); }
.rap .btn { align-self: flex-start; }
.rap__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.rap__msg { min-height: 1.4em; font-size: 14px; color: var(--ink-2); }
.rap__msg.is-ok { color: var(--gold); }
.rap__msg.is-err { color: #ff9b85; }
.rap__cal { align-self: flex-start; min-height: 44px; padding: 0; font: 500 14px/1.3 var(--f-text); color: var(--ink-2); text-decoration: underline; text-underline-offset: 3px; text-align: left; }
.rap__cal:hover { color: var(--gold); }

/* line-up : anneau animé « story » autour de la photo d'un artiste qui a des vidéos (comme une story active sur Instagram) */
@property --sv-a { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
.sv-lu__av { position: relative; flex: none; display: inline-grid; place-items: center; width: 56px; height: 56px; padding: 0; border: 0; border-radius: 50%; background: transparent; cursor: pointer; }
.sv-lu__av::before { content: ""; position: absolute; inset: 0; border-radius: 50%; background: conic-gradient(from var(--sv-a), #FDC852, #ff8a3d, #e8336f, #b347d9, #FDC852); -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 3px)); mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 3px)); animation: sv-ring 3s linear infinite; }
.sv-lu__av:hover::before { animation-duration: 1.2s; }
.sv-lu__av:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.sv-lu__dj .sv-lu__av img { width: 46px; height: 46px; box-shadow: none; }
.sv-lu__ini { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: var(--bg-raise); font: italic 400 26px/1 var(--f-serif); color: var(--gold); text-transform: none; }
@keyframes sv-ring { to { --sv-a: 360deg; } }
@media (prefers-reduced-motion: reduce) { .sv-lu__av::before { animation: none; } }
/* les vidéos de l'artiste en pop-up, au format story */
.stv { position: fixed; inset: 0; z-index: 160; display: grid; place-items: center; padding: 16px; }
.stv[hidden] { display: none; }
.stv__backdrop { position: absolute; inset: 0; background: rgba(5, 5, 4, .86); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); opacity: 0; transition: opacity .3s var(--ease); }
.stv__box { position: relative; width: min(420px, 100%, calc((100vh - 32px) * 9 / 16)); width: min(420px, 100%, calc((100dvh - 32px) * 9 / 16)); aspect-ratio: 9 / 16; overflow: hidden; border-radius: 14px; background: #000; box-shadow: 0 30px 80px rgba(0, 0, 0, .6); opacity: 0; transform: scale(.96); transition: opacity .3s var(--ease), transform .4s var(--ease); }
.stv.is-open .stv__backdrop { opacity: 1; }
.stv.is-open .stv__box { opacity: 1; transform: none; }
.stv__box::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 120px; z-index: 2; background: linear-gradient(rgba(0, 0, 0, .6), transparent); pointer-events: none; }
.stv__v { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.stv__bars { position: absolute; top: 10px; left: 10px; right: 10px; z-index: 3; display: flex; gap: 4px; }
.stv__bars span { flex: 1; height: 3px; overflow: hidden; border-radius: 2px; background: rgba(244, 239, 230, .35); }
.stv__bars i { display: block; height: 100%; background: var(--ink); transform: scaleX(0); transform-origin: left; }
.stv__head { position: absolute; top: 20px; left: 12px; right: 6px; z-index: 3; display: flex; align-items: center; gap: 10px; }
.stv__av { display: grid; place-items: center; flex: none; width: 36px; height: 36px; overflow: hidden; border-radius: 50%; background: var(--bg); box-shadow: 0 0 0 2px var(--gold); font: italic 400 20px/1 var(--f-serif); color: var(--gold); }
.stv__av img { width: 100%; height: 100%; object-fit: cover; }
.stv__who { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; margin: 0; }
.stv__who b { font: 600 15px/1.1 var(--f-display); font-stretch: 108%; text-transform: uppercase; color: var(--ink); }
.stv__ig { align-self: flex-start; font-size: 13px; color: var(--ink-2); text-decoration: none; }
.stv__ig:hover { color: var(--gold); }
.stv__x { display: grid; place-items: center; flex: none; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--ink); cursor: pointer; }
.stv__x svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.stv__x:hover { color: var(--gold); }
.stv__x:focus-visible, .stv__nav:focus-visible { outline: 2px solid var(--gold); outline-offset: -4px; }
.stv__nav { position: absolute; top: 76px; bottom: 76px; z-index: 2; width: 34%; padding: 0; border: 0; background: transparent; cursor: pointer; }
.stv__nav--prev { left: 0; } .stv__nav--next { right: 0; }
.stv__nav[hidden] { display: none; }
.stv__snd { position: absolute; right: 14px; bottom: 14px; z-index: 3; }

/* volet VIP : récapitulatif court */
.vipf__recap .vipf__recap-n { margin: 6px 0 0; text-align: right; }
.vipf__recap-gift { margin: 12px 0 0; padding-top: 10px; border-top: 1px solid var(--line); font: 500 14px/1.3 var(--f-text); color: var(--gold); }

/* réservations VIP : la personne qui répond, petite photo ronde */
.drawer__who { display: inline-flex; align-items: center; gap: 12px; }
.drawer__av { display: grid; place-items: center; flex: none; width: 44px; height: 44px; overflow: hidden; border-radius: 50%; background: var(--bg-raise); box-shadow: 0 0 0 2px var(--gold); font: italic 400 22px/1 var(--f-serif); color: var(--gold); }
.drawer__av img { width: 100%; height: 100%; object-fit: cover; display: block; }
.vip__call .drawer__who { color: var(--ink-2); font-size: 15px; }

/* volet VIP : envoi de la demande sur WhatsApp (vert WhatsApp, texte sombre pour le contraste) */
.btn--wa { gap: 12px; background: #25D366; color: #0A0908; }
.btn--wa::before { background: #F4EFE6; }
.btn--wa .wa-ico { width: 20px; height: 20px; flex: none; fill: currentColor; }

/* volet VIP : bouton WhatsApp en pleine largeur, la mention de la direction en dessous */
.vipf .form__foot { flex-direction: column-reverse; align-items: stretch; gap: 14px; }
.vipf .form__foot .btn--wa { width: 100%; justify-content: center; }