/* =========================================================
   Bizi, bar-restaurant au lac de Saint-Pée-sur-Nivelle
   Base claire et chaleureuse ; bleu nuit et laiton en accents
   (bandeau d'accueil, bande des menus, pied de page).
   Titres : Ibarra Real Nova (romain espagnol du XVIIIe s.) ; texte : Rethink Sans.
   ========================================================= */
@font-face { font-family: "Ibarra Real Nova"; src: url(/fonts/ibarra-real-nova.woff2) format("woff2"); font-weight: 400 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Ibarra Real Nova"; src: url(/fonts/ibarra-real-nova-italic.woff2) format("woff2"); font-weight: 400 700; font-style: italic; font-display: swap; }
@font-face { font-family: "Rethink Sans"; src: url(/fonts/rethink-sans.woff2) format("woff2"); font-weight: 400 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Ibarra repli"; src: local("Georgia"); size-adjust: 96%; ascent-override: 92%; }
@font-face { font-family: "Rethink repli"; src: local("Arial"); size-adjust: 98%; }

:root {
  --nuit: #0F1A2C;
  --nuit-2: #1A2840;
  --nuit-3: #24365A;
  --sur-nuit: #F4EFE4;
  --sur-nuit-2: #BCC5D6;
  --fond: #FBFAF6;
  --fond-2: #F2EEE6;
  --blanc: #FFFFFF;
  --encre: #14203A;
  --encre-2: #4A546A;
  --filet: #E1DACC;
  --or: #CDA75A;
  --or-vif: #DDB96C;
  --or-fonce: #86661F;
  --or-clair: #E2C788;
  --piment: #B8281D;
  --ok: #2F6B3F;
  --err: #A3261B;

  --f-titre: "Ibarra Real Nova", "Ibarra repli", Georgia, serif;
  --f-texte: "Rethink Sans", "Rethink repli", system-ui, sans-serif;

  --r: 6px;
  --r-lg: 14px;
  --ombre: 0 18px 40px -22px rgba(15, 26, 44, .45);
  --ombre-l: 0 6px 18px -10px rgba(15, 26, 44, .35);
  --ease: cubic-bezier(.16, 1, .3, 1);
  --head-h: 76px;
  --wrap: 1240px;
  --pad: clamp(1.15rem, 4vw, 2.5rem);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--head-h) + 1rem); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; animation: none !important; } }
body { margin: 0; background: var(--fond); color: var(--encre); font: 400 1.0625rem/1.62 var(--f-texte); text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .2em; }
a:hover { text-decoration-color: var(--or); }
::selection { background: var(--or-clair); color: var(--nuit); }
:focus-visible { outline: 2px solid var(--or-fonce); outline-offset: 3px; border-radius: 3px; }
.foot :focus-visible, .hero :focus-visible, .menus :focus-visible { outline-color: var(--or-clair); }
html { scrollbar-color: #C9BFAD var(--fond); }
input, select, textarea { caret-color: var(--or-fonce); }

h1, h2, h3, h4 { font-family: var(--f-titre); font-weight: 600; line-height: 1.08; letter-spacing: -.012em; margin: 0 0 .5em; text-wrap: balance; color: var(--encre); }
h1 { font-size: clamp(2.35rem, 5.2vw, 4.4rem); line-height: 1.02; }
h2 { font-size: clamp(1.85rem, 3.4vw, 2.9rem); }
h3 { font-size: clamp(1.3rem, 1.8vw, 1.55rem); line-height: 1.15; }
h1 em, h2 em { font-style: italic; font-weight: 500; color: var(--or-fonce); }
p { margin: 0 0 1em; }
.nw { white-space: nowrap; }
.wrap { width: 100%; max-width: var(--wrap); margin: 0 auto; padding: 0 var(--pad); }
.skip { position: absolute; left: -999px; top: 0; background: var(--nuit); color: #fff; padding: .6rem 1rem; z-index: 99; }
.skip:focus { left: 1rem; top: 1rem; }
.lead { font-size: clamp(1.1rem, 1.5vw, 1.25rem); color: var(--encre-2); max-width: 62ch; }
.prose { max-width: 68ch; }
.prose p, .prose li { color: var(--encre-2); }
.prose strong { color: var(--encre); }
.ico { width: 1.15em; height: 1.15em; flex: none; vertical-align: -.2em; }

/* Boutons */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .55em; padding: .78em 1.25em; border-radius: var(--r); border: 1.5px solid transparent;
  font: 600 1rem/1.1 var(--f-texte); text-decoration: none; cursor: pointer; transition: background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease), box-shadow .25s var(--ease), transform .25s var(--ease); }
.btn--lg { padding: .95em 1.5em; font-size: 1.04rem; }
.btn--or { background: var(--or); color: var(--nuit); box-shadow: 0 8px 20px -12px rgba(134, 102, 31, .9); }
.btn--or:hover { background: var(--or-vif); transform: translateY(-1px); box-shadow: 0 12px 26px -12px rgba(134, 102, 31, .95); }
.btn--nuit { background: var(--nuit); color: var(--sur-nuit); }
.btn--nuit:hover { background: var(--nuit-3); }
.btn--ligne { border-color: currentColor; color: var(--encre); background: transparent; }
.btn--ligne:hover { background: var(--encre); color: var(--fond); border-color: var(--encre); }
.btn[disabled], .btn[aria-busy="true"] { opacity: .65; cursor: progress; transform: none; }
.lien-fleche { display: inline-flex; align-items: center; gap: .45em; font-weight: 600; color: var(--or-fonce); text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 2px; }
.lien-fleche .ico { transition: transform .3s var(--ease); }
.lien-fleche:hover .ico { transform: translateX(4px); }

/* À compléter */
.a-completer { display: inline-block; border: 1.5px dashed var(--piment); color: var(--piment); background: #FFF5F2; padding: .15em .55em; border-radius: 4px; font: 600 .9rem/1.35 var(--f-texte); }

/* Note Google */
.note { display: inline-flex; align-items: center; gap: .6em; text-decoration: none; color: var(--encre-2); font-size: .95rem; }
.note b { color: var(--encre); }
.note__etoiles { display: inline-flex; color: var(--or); }
.note__etoiles .ico { width: 1em; height: 1em; }
.ico-star--demi { opacity: .45; }
.note--clair, .note--clair b { color: var(--sur-nuit); }
.note--clair { color: var(--sur-nuit-2); }
.note--clair .note__etoiles { color: var(--or-clair); }

/* ---------- En-tête ---------- */
.head { position: sticky; top: 0; z-index: 50; background: rgba(251, 250, 246, .96); backdrop-filter: saturate(1.4) blur(10px); border-bottom: 1px solid transparent; transition: border-color .3s, box-shadow .3s, transform .35s var(--ease); }
.head.is-scrolled { border-color: var(--filet); box-shadow: 0 8px 24px -20px rgba(15, 26, 44, .5); }
.head.is-cache { transform: translateY(-100%); }
.head__in { display: flex; align-items: center; gap: 1.5rem; height: var(--head-h); }
.logo { display: flex; align-items: center; gap: .75rem; text-decoration: none; flex: none; }
.logo img { width: auto; height: 54px; }
.logo__txt { display: flex; flex-direction: column; line-height: 1.1; border-left: 1px solid var(--filet); padding-left: .75rem; }
.logo__txt b { font: 600 1.08rem/1.1 var(--f-titre); letter-spacing: .01em; }
.logo__txt small { font-size: .78rem; color: var(--encre-2); letter-spacing: .06em; text-transform: uppercase; }
.nav { margin-left: auto; }
.nav__liste { list-style: none; display: flex; gap: .25rem; margin: 0; padding: 0; }
.nav__liste a { display: block; padding: .55rem .7rem; font-weight: 500; font-size: .98rem; text-decoration: none; border-radius: var(--r); white-space: nowrap; }
.nav__liste a:hover { background: var(--fond-2); }
.nav__liste a[aria-current="page"] { box-shadow: inset 0 -2px 0 var(--or); border-radius: 0; }
.nav__extra { display: none; }
.head__actions { display: flex; align-items: center; gap: .6rem; }
.head__tel { display: inline-flex; align-items: center; gap: .5rem; padding: .7rem 1.05rem; border-radius: var(--r); background: var(--nuit); color: var(--sur-nuit); font-weight: 600; text-decoration: none; white-space: nowrap; transition: background .25s; }
.head__tel:hover { background: var(--nuit-3); }
.head__tel .ico { color: var(--or-clair); }
.burger { display: none; width: 46px; height: 46px; border: 1px solid var(--filet); border-radius: var(--r); background: var(--blanc); cursor: pointer; padding: 0 12px; flex-direction: column; justify-content: center; gap: 5px; }
.burger span { display: block; height: 2px; background: var(--encre); border-radius: 2px; transition: transform .3s var(--ease), opacity .2s; }
.burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 1180px) {
  .nav__liste a { padding: .55rem .5rem; font-size: .94rem; }
  .logo__txt { display: none; }
}
@media (max-width: 1020px) {
  :root { --head-h: 66px; }
  .head { backdrop-filter: none; background: var(--fond); }
  .logo img { height: 46px; }
  .logo__txt { display: flex; }
  .burger { display: flex; }
  .nav { position: fixed; inset: var(--head-h) 0 0 0; background: var(--fond); padding: 1.25rem var(--pad) 6rem; overflow-y: auto; transform: translateX(100%); visibility: hidden; transition: transform .4s var(--ease), visibility 0s .4s; margin: 0; }
  .nav.is-open { transform: none; visibility: visible; transition: transform .4s var(--ease); }
  .nav__liste { flex-direction: column; gap: 0; }
  .nav__liste a { font: 600 1.6rem/1.2 var(--f-titre); padding: .7rem 0; border-bottom: 1px solid var(--filet); border-radius: 0; }
  .nav__liste a[aria-current="page"] { box-shadow: none; color: var(--or-fonce); }
  .nav__extra { display: grid; gap: .75rem; margin-top: 1.75rem; }
  .nav__note { margin: .5rem 0 0; }
  body.nav-open { overflow: hidden; }
}
@media (max-width: 520px) {
  .head__tel span { display: none; }
  .head__tel { padding: .75rem; }
  .logo__txt small { display: none; }
}
@media (max-width: 360px) { .logo__txt { display: none; } }

/* Fil d'Ariane */
.fil { padding-top: 1rem; padding-bottom: .25rem; font-size: .88rem; color: var(--encre-2); }
.fil ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .3rem .55rem; }
.fil li + li::before { content: "/"; margin-right: .55rem; color: #B5AC9B; }
.fil a { text-decoration: none; }
.fil a:hover { text-decoration: underline; }

/* ---------- Sections ---------- */
.section { padding: clamp(3.5rem, 8vw, 6.5rem) 0; }
.section--serre { padding: clamp(2.5rem, 5vw, 4rem) 0; }
.section--sable { background: var(--fond-2); }
.section--filet { border-top: 1px solid var(--filet); }
.h-sec { margin-bottom: 1.5rem; }
.sec-tete { display: grid; gap: .5rem 3rem; margin-bottom: clamp(1.75rem, 4vw, 3rem); }
.sec-tete p { color: var(--encre-2); max-width: 60ch; margin: 0; }
@media (min-width: 900px) { .sec-tete--cote { grid-template-columns: 1fr 1fr; align-items: end; } }

/* ---------- Accueil : bandeau ---------- */
.hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr); min-height: min(720px, calc(100svh - var(--head-h))); background: var(--nuit); color: var(--sur-nuit); }
.hero__txt { padding: clamp(2.5rem, 6vw, 5.5rem) clamp(1.25rem, 5vw, 4.5rem); display: flex; flex-direction: column; justify-content: center; position: relative; }
.hero__txt::after { content: ""; position: absolute; right: 0; top: 12%; bottom: 12%; width: 1px; background: linear-gradient(transparent, var(--or), transparent); opacity: .5; }
.hero h1 { color: var(--sur-nuit); max-width: 13ch; margin-bottom: .45em; }
.hero h1 em { color: var(--or-clair); }
.hero__sur { font: 500 .95rem/1.4 var(--f-texte); letter-spacing: .14em; text-transform: uppercase; color: var(--or-clair); margin-bottom: 1.4rem; display: flex; align-items: center; gap: .8rem; }
.hero__sur::before { content: ""; width: 2.2rem; height: 1px; background: currentColor; }
.hero__lead { font-size: clamp(1.08rem, 1.45vw, 1.24rem); line-height: 1.6; color: var(--sur-nuit-2); max-width: 46ch; margin-bottom: 1.8rem; }
.hero__btns { display: flex; flex-wrap: wrap; gap: .8rem 1.4rem; align-items: center; }
.hero__alt { color: var(--sur-nuit); font-weight: 600; text-decoration: none; border-bottom: 1px solid var(--or); padding-bottom: 2px; }
.hero__alt:hover { color: var(--or-clair); }
.hero__rea { margin: 2rem 0 0; display: flex; flex-wrap: wrap; gap: .6rem 1.5rem; font-size: .95rem; color: var(--sur-nuit-2); }
.hero__img { position: relative; overflow: hidden; }
.hero__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 55%; animation: hero-in 1.6s var(--ease) both; }
@keyframes hero-in { from { transform: scale(1.06); filter: saturate(.7) brightness(.85); } to { transform: none; filter: none; } }
.hero__legende { position: absolute; left: 1rem; bottom: 1rem; background: rgba(15, 26, 44, .78); color: var(--sur-nuit); font-size: .85rem; padding: .4rem .75rem; border-radius: 4px; backdrop-filter: blur(4px); }
@media (max-width: 900px) {
  .hero { grid-template-columns: 1fr; min-height: 0; }
  .hero__img { order: -1; aspect-ratio: 4 / 3; }
  .hero__txt::after { display: none; }
  .hero h1 { max-width: 16ch; }
}

/* Repères (sous le bandeau) */
.reperes { list-style: none; margin: 0; padding: 1.25rem 0; display: flex; flex-wrap: wrap; gap: .75rem 2.25rem; justify-content: center; border-bottom: 1px solid var(--filet); }
.reperes li { display: flex; align-items: center; gap: .55rem; font-weight: 500; color: var(--encre); font-size: .98rem; }
.reperes .ico { color: var(--or-fonce); width: 1.3em; height: 1.3em; }

/* Mosaïque d'assiettes */
.cuisine { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.cuisine__txt p { color: var(--encre-2); }
.mosaique { display: grid; grid-template-columns: repeat(6, 1fr); grid-auto-rows: clamp(70px, 9vw, 120px); gap: .65rem; }
.mosaique figure { margin: 0; overflow: hidden; border-radius: var(--r); position: relative; }
.mosaique img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.mosaique figure:hover img { transform: scale(1.04); }
.mosaique figcaption { position: absolute; left: .5rem; bottom: .5rem; background: rgba(251, 250, 246, .94); color: var(--encre); font-size: .8rem; font-weight: 600; padding: .25rem .55rem; border-radius: 3px; }
.m1 { grid-column: 1 / 4; grid-row: span 3; }
.m2 { grid-column: 4 / 7; grid-row: span 2; }
.m3 { grid-column: 4 / 7; grid-row: span 2; }
.m4 { grid-column: 1 / 4; grid-row: span 2; }
.m5 { grid-column: 1 / 4; grid-row: span 1; display: none; }
@media (max-width: 900px) { .cuisine { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .mosaique { grid-auto-rows: 64px; } }

/* ---------- Menus (bande sombre) ---------- */
.menus { background: var(--nuit); color: var(--sur-nuit); padding: clamp(3.5rem, 8vw, 6rem) 0; position: relative; overflow: hidden; }
.menus::before { content: ""; position: absolute; inset: 0; background: radial-gradient(60% 80% at 100% 0%, rgba(205, 167, 90, .14), transparent 60%); pointer-events: none; }
.menus__tete { display: grid; gap: .5rem 3rem; margin-bottom: 2.5rem; position: relative; }
@media (min-width: 900px) { .menus__tete { grid-template-columns: 1fr 1fr; align-items: end; } }
.menus h2 { color: var(--sur-nuit); margin: 0; }
.menus__tete p { color: var(--sur-nuit-2); margin: 0; max-width: 52ch; }
.menus__grille { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; position: relative; }
.menu { background: var(--nuit-2); border: 1px solid rgba(226, 199, 136, .22); border-radius: var(--r-lg); padding: 1.6rem 1.5rem 1.4rem; display: flex; flex-direction: column; }
.menu--jour { background: linear-gradient(180deg, #22324F, var(--nuit-2)); border-color: rgba(226, 199, 136, .5); }
.menu__tete { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; border-bottom: 1px solid rgba(226, 199, 136, .3); padding-bottom: .9rem; margin-bottom: .8rem; }
.menu h3 { color: var(--sur-nuit); margin: 0; font-size: 1.5rem; }
.menu__prix { font: 600 2.1rem/1 var(--f-titre); color: var(--or-clair); margin: 0; white-space: nowrap; font-variant-numeric: lining-nums; }
.menu__quand { color: var(--or-clair); font-size: .9rem; font-weight: 500; margin-bottom: 1rem; }
.menu__lignes { list-style: none; margin: 0; padding: 0; display: grid; gap: .85rem; }
.menu__lignes li { color: var(--sur-nuit); line-height: 1.5; font-size: .98rem; padding-left: 1.1rem; position: relative; }
.menu__lignes li::before { content: ""; position: absolute; left: 0; top: .62em; width: .4rem; height: 1px; background: var(--or); }
.mention-prix { font-size: .85rem; color: var(--encre-2); margin: 1rem 0 0; }
.mention-prix--clair { color: var(--sur-nuit-2); position: relative; }
@media (max-width: 900px) { .menus__grille { grid-template-columns: 1fr; } }

/* ---------- Rangées éditoriales (offres) ---------- */
.rangs { display: grid; gap: clamp(3rem, 7vw, 5.5rem); }
.rang { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(1.75rem, 5vw, 4.5rem); align-items: center; }
.rang:nth-child(even) .rang__img { order: 2; }
.rang__img { border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--ombre); aspect-ratio: 4 / 3; }
.rang__img img { width: 100%; height: 100%; object-fit: cover; }
.rang__txt p { color: var(--encre-2); }
.rang__liste { list-style: none; padding: 0; margin: 0 0 1.4rem; display: grid; gap: .45rem; }
.rang__liste li { display: flex; gap: .6rem; align-items: baseline; }
.rang__liste .ico { color: var(--or-fonce); }
@media (max-width: 860px) { .rang { grid-template-columns: 1fr; } .rang:nth-child(even) .rang__img { order: 0; } }

/* ---------- Lac (accueil) ---------- */
.lacband { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 0; background: var(--blanc); border: 1px solid var(--filet); border-radius: var(--r-lg); overflow: hidden; }
.lacband__img img { width: 100%; height: 100%; object-fit: cover; min-height: 320px; }
.lacband__txt { padding: clamp(1.75rem, 4vw, 3rem); }
.lacband__txt p { color: var(--encre-2); }
.chiffre-lac { font: 600 clamp(2.4rem, 4vw, 3.2rem)/1 var(--f-titre); color: var(--or-fonce); }
@media (max-width: 860px) { .lacband { grid-template-columns: 1fr; } .lacband__img img { min-height: 0; aspect-ratio: 16 / 9; } }

/* ---------- Avis ---------- */
.avis { display: grid; grid-template-columns: auto 1fr; gap: clamp(1.5rem, 5vw, 4rem); align-items: center; }
.avis__note { text-align: center; padding: 1.75rem 2.25rem; border: 1px solid var(--filet); border-radius: var(--r-lg); background: var(--blanc); }
.avis__note .avis__chiffre { margin: 0; font: 600 4.2rem/1 var(--f-titre); color: var(--encre); }
.avis__chiffre small { font-size: 1.6rem; color: var(--encre-2); }
.avis__note .note__etoiles { justify-content: center; margin: .4rem 0; font-size: 1.3rem; }
.avis__note p { margin: 0; color: var(--encre-2); font-size: .92rem; }
.sujets { list-style: none; padding: 0; margin: 1rem 0 1.25rem; display: flex; flex-wrap: wrap; gap: .5rem; }
.sujets li { border: 1px solid var(--filet); background: var(--blanc); border-radius: 99px; padding: .3rem .85rem; font-size: .92rem; }
.sujets b { color: var(--or-fonce); font-variant-numeric: tabular-nums; }
@media (max-width: 700px) { .avis { grid-template-columns: 1fr; } }

/* ---------- Infos pratiques ---------- */
.pratique { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.5rem 2rem; }
.pratique li { display: flex; gap: .85rem; align-items: flex-start; }
.pratique .ico { width: 1.6rem; height: 1.6rem; color: var(--or-fonce); margin-top: .1rem; }
.pratique div { display: flex; flex-direction: column; gap: .2rem; }
.pratique b { font-weight: 700; }
.pratique span { color: var(--encre-2); }
.pratique a { font-weight: 600; color: var(--or-fonce); }
.horaires p { margin: .6rem 0 0; color: var(--encre-2); }

/* ---------- En-tête de page intérieure ---------- */
.phero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 0; max-width: var(--wrap); margin: 0 auto; padding: clamp(1rem, 3vw, 2rem) var(--pad) clamp(2.5rem, 6vw, 4.5rem); align-items: center; }
.phero__txt { padding-right: clamp(1.5rem, 5vw, 4.5rem); }
.phero h1 { font-size: clamp(2.2rem, 4.6vw, 3.9rem); }
.phero__lead { font-size: clamp(1.08rem, 1.45vw, 1.22rem); color: var(--encre-2); max-width: 50ch; }
.phero__btns { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1.5rem; }
.phero__rea { margin: 1.25rem 0 0; }
.phero__img { border-radius: var(--r-lg); overflow: hidden; aspect-ratio: 5 / 4; box-shadow: var(--ombre); position: relative; }
.phero__img::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(15, 26, 44, .08); }
.phero__img img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 900px) {
  .phero { grid-template-columns: 1fr; padding-top: .5rem; }
  .phero__img { order: -1; aspect-ratio: 16 / 10; margin-bottom: 1.5rem; }
  .phero__txt { padding-right: 0; }
}

/* ---------- La carte ---------- */
.carte-nav { position: sticky; top: var(--head-h); z-index: 20; background: rgba(251, 250, 246, .97); border-block: 1px solid var(--filet); transition: top .35s var(--ease); }
.head.is-cache ~ main .carte-nav { top: 0; }
.carte-nav ul { list-style: none; margin: 0 auto; padding: .6rem var(--pad); display: flex; gap: .4rem; overflow-x: auto; scrollbar-width: none; max-width: var(--wrap); }
.carte-nav ul::-webkit-scrollbar { display: none; }
.carte-nav a { display: block; white-space: nowrap; padding: .45rem .9rem; border-radius: 99px; text-decoration: none; font-size: .92rem; font-weight: 600; border: 1px solid var(--filet); background: var(--blanc); }
.carte-nav a:hover { border-color: var(--or); }
.carte-nav a.is-actif { background: var(--nuit); color: var(--sur-nuit); border-color: var(--nuit); }
.carte-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(2.5rem, 5vw, 4.5rem) clamp(2.5rem, 6vw, 5.5rem); }
@media (max-width: 860px) { .carte-cols { grid-template-columns: 1fr; } }
.rub { scroll-margin-top: calc(var(--head-h) + 4.5rem); }
.rub__t { font-size: clamp(1.55rem, 2.3vw, 1.95rem); margin-bottom: .2em; display: flex; align-items: center; gap: .8rem; }
.rub__t::after { content: ""; flex: 1; height: 1px; background: var(--filet); }
.rub__note { color: var(--encre-2); font-size: .94rem; font-style: italic; margin-bottom: .6rem; }
.plats { list-style: none; margin: .5rem 0 0; padding: 0; }
.plat { display: grid; grid-template-columns: auto 1fr auto; column-gap: .6rem; align-items: baseline; padding: .7rem 0; border-bottom: 1px solid rgba(225, 218, 204, .7); }
.plat__nom { font-weight: 600; }
.plat__pt { border-bottom: 1.5px dotted #C8BEAA; transform: translateY(-.25em); min-width: 1rem; }
.plat__prix { font-variant-numeric: tabular-nums lining-nums; font-weight: 600; color: var(--encre); white-space: nowrap; text-align: right; }
.plat__var { font-weight: 500; color: var(--encre-2); font-size: .88em; }
.plat__sep { color: #B5AC9B; }
.plat__desc { grid-column: 1 / -1; color: var(--encre-2); font-size: .93rem; line-height: 1.5; margin-top: .15rem; max-width: 60ch; }
@media (max-width: 520px) {
  .plat { grid-template-columns: 1fr auto; }
  .plat__pt { display: none; }
  .plat__prix { white-space: normal; }
}
.carte-photo { border-radius: var(--r-lg); overflow: hidden; margin: 0; }
.carte-photo img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.carte-photo figcaption { font-size: .85rem; color: var(--encre-2); padding-top: .5rem; }
.encart { border: 1px solid var(--filet); background: var(--blanc); border-radius: var(--r-lg); padding: 1.4rem 1.6rem; }
.encart h3 { font-size: 1.25rem; }
.encart p:last-child { margin-bottom: 0; }

/* Vins */
.vins { width: 100%; border-collapse: collapse; font-size: .97rem; }
.vins caption { text-align: left; font: 600 1.35rem/1.2 var(--f-titre); padding: 1.5rem 0 .4rem; }
.vins th, .vins td { padding: .55rem .5rem; border-bottom: 1px solid rgba(225, 218, 204, .8); text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.vins th:first-child, .vins td:first-child { text-align: left; white-space: normal; padding-left: 0; }
.vins thead th { font: 600 .78rem/1.2 var(--f-texte); letter-spacing: .08em; text-transform: uppercase; color: var(--encre-2); border-bottom: 1.5px solid var(--encre); }
.vins td.vide { color: #B9B0A0; }
.table-defile { overflow-x: auto; }

/* ---------- Galerie simple ---------- */
.duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.trio { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.duo img, .trio img { border-radius: var(--r); aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }
@media (max-width: 700px) { .trio { grid-template-columns: 1fr 1fr; } .trio > :last-child { grid-column: 1 / -1; } }

/* ---------- Activités du lac ---------- */
.activites { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(2rem, 5vw, 4rem); }
.activite { display: grid; grid-template-columns: 132px 1fr; gap: 1.25rem; padding: 1.5rem 0; border-top: 1px solid var(--filet); align-items: start; }
.activite__img { border-radius: var(--r); overflow: hidden; aspect-ratio: 1; background: var(--fond-2); display: grid; place-items: center; color: var(--or-fonce); }
.activite__img img { width: 100%; height: 100%; object-fit: cover; }
.activite__img .ico { width: 2.4rem; height: 2.4rem; }
.activite h3 { font-size: 1.3rem; margin-bottom: .3em; }
.activite p { color: var(--encre-2); margin-bottom: .5rem; }
.activite a { font-size: .92rem; font-weight: 600; color: var(--or-fonce); }
@media (max-width: 860px) { .activites { grid-template-columns: 1fr; } }
@media (max-width: 460px) { .activite { grid-template-columns: 88px 1fr; gap: 1rem; } }

/* Journée type */
.journee { list-style: none; margin: 0; padding: 0; counter-reset: j; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.5rem; }
.journee li { border-top: 2px solid var(--nuit); padding-top: 1rem; }
.journee b { display: block; font: 600 1.25rem/1.2 var(--f-titre); margin-bottom: .35rem; }
.journee span { color: var(--encre-2); font-size: .97rem; }
@media (max-width: 860px) { .journee { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .journee { grid-template-columns: 1fr; } }

/* Villes */
.villes { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: .75rem; }
.villes a { display: flex; flex-direction: column; gap: .15rem; padding: 1rem 1.15rem; border: 1px solid var(--filet); border-radius: var(--r); background: var(--blanc); text-decoration: none; transition: border-color .25s, transform .25s var(--ease); }
.villes a:hover { border-color: var(--or); transform: translateY(-2px); }
.villes b { font: 600 1.15rem/1.2 var(--f-titre); }
.villes span { color: var(--encre-2); font-size: .92rem; }
.trajet { display: flex; flex-wrap: wrap; gap: 1rem 2.5rem; margin: 1.25rem 0 1.5rem; padding: 1.1rem 1.4rem; background: var(--blanc); border: 1px solid var(--filet); border-radius: var(--r); }
.trajet div { display: flex; flex-direction: column; }
.trajet b { font: 600 1.8rem/1 var(--f-titre); }
.trajet span { font-size: .88rem; color: var(--encre-2); }

/* ---------- Offres (maillage) ---------- */
.offres { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 0 2rem; }
.offres a { display: flex; align-items: center; gap: 1rem; padding: 1.1rem 0; border-bottom: 1px solid var(--filet); text-decoration: none; }
.offres a > .ico:first-child { width: 1.8rem; height: 1.8rem; color: var(--or-fonce); }
.offres span { display: flex; flex-direction: column; flex: 1; }
.offres b { font: 600 1.2rem/1.25 var(--f-titre); }
.offres small { color: var(--encre-2); font-size: .92rem; }
.offres__f { color: var(--encre-2); transition: transform .3s var(--ease); }
.offres a:hover .offres__f { transform: translateX(4px); color: var(--or-fonce); }

/* ---------- Étapes ---------- */
.etapes { list-style: none; margin: 0; padding: 0; counter-reset: e; display: grid; gap: 1.25rem; }
.etapes li { counter-increment: e; display: grid; grid-template-columns: 2.6rem 1fr; gap: 1rem; align-items: start; }
.etapes li::before { content: counter(e); font: 600 1.35rem/2.6rem var(--f-titre); text-align: center; border: 1px solid var(--or); border-radius: 50%; color: var(--or-fonce); }
.etapes b { display: block; font-size: 1.05rem; }
.etapes span { color: var(--encre-2); }
.liste-ok { list-style: none; padding: 0; margin: 0 0 1.25rem; display: grid; gap: .5rem; }
.liste-ok li { display: flex; gap: .6rem; align-items: baseline; color: var(--encre-2); }
.liste-ok .ico { color: var(--or-fonce); }

/* Espaces (groupes) */
.espaces { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.espace { background: var(--blanc); border: 1px solid var(--filet); border-radius: var(--r-lg); overflow: hidden; }
.espace img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.espace div { padding: 1.25rem 1.4rem 1.4rem; }
.espace b { display: block; font: 600 2.4rem/1 var(--f-titre); color: var(--encre); }
.espace span { color: var(--encre-2); }
@media (max-width: 700px) { .espaces { grid-template-columns: 1fr; } }

/* Deux colonnes génériques */
.deux { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
.deux--centre { align-items: center; }
@media (max-width: 860px) { .deux { grid-template-columns: 1fr; } }
.photo-r { border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--ombre); }
.photo-r img { width: 100%; height: auto; }

/* ---------- FAQ ---------- */
.faq__in { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); gap: clamp(1.5rem, 5vw, 4rem); }
.faq__liste details { border-bottom: 1px solid var(--filet); }
.faq__liste details:first-child { border-top: 1px solid var(--filet); }
.faq__liste summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 1rem; padding: 1.1rem 0; font-weight: 600; font-size: 1.05rem; }
.faq__liste summary::-webkit-details-marker { display: none; }
.faq__ico { transition: transform .3s var(--ease); color: var(--or-fonce); }
.faq__liste details[open] .faq__ico { transform: rotate(180deg); }
.faq__r { padding: 0 0 1.2rem; color: var(--encre-2); max-width: 66ch; }
.faq__r p:last-child { margin: 0; }
@media (max-width: 860px) { .faq__in { grid-template-columns: 1fr; } }

/* ---------- CTA ---------- */
.cta { background: var(--fond-2); border-top: 1px solid var(--filet); padding: clamp(3rem, 7vw, 5rem) 0; }
.cta__in { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 2rem 4rem; align-items: center; }
.cta h2 { margin-bottom: .35em; }
.cta__txt p { color: var(--encre-2); max-width: 54ch; margin: 0; }
.cta__actions { display: flex; flex-direction: column; align-items: flex-start; gap: .9rem; }
.cta__alt { font-weight: 600; color: var(--or-fonce); display: inline-flex; gap: .4em; align-items: center; }
.cta__note { margin: .25rem 0 0; }
.cta .note--clair, .cta .note--clair b { color: var(--encre); }
.cta .note--clair .note__etoiles { color: var(--or); }
@media (max-width: 860px) { .cta__in { grid-template-columns: 1fr; } }

/* ---------- Formulaire ---------- */
.form-zone { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: clamp(2rem, 5vw, 4rem); align-items: start; }
@media (max-width: 900px) { .form-zone { grid-template-columns: 1fr; } }
.form { background: var(--blanc); border: 1px solid var(--filet); border-radius: var(--r-lg); padding: clamp(1.4rem, 4vw, 2.4rem); box-shadow: var(--ombre-l); }
.form h2 { font-size: clamp(1.6rem, 2.6vw, 2.2rem); }
.choix { border: 0; margin: 0 0 1.25rem; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.choix legend { font-weight: 600; margin-bottom: .55rem; padding: 0; }
.choix label { position: relative; }
.choix input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.choix span { display: block; padding: .6rem 1rem; border: 1.5px solid var(--filet); border-radius: 99px; font-weight: 600; font-size: .95rem; transition: all .2s; }
.choix input:checked + span { background: var(--nuit); border-color: var(--nuit); color: var(--sur-nuit); }
.choix input:focus-visible + span { outline: 2px solid var(--or-fonce); outline-offset: 2px; }
.champs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem 1.1rem; }
.champs .large { grid-column: 1 / -1; }
@media (max-width: 560px) { .champs { grid-template-columns: 1fr; } }
.champ label { display: block; font-weight: 600; font-size: .95rem; margin-bottom: .35rem; }
.champ label small { font-weight: 400; color: var(--encre-2); }
.champ input, .champ select, .champ textarea { width: 100%; font: inherit; font-size: 1rem; color: var(--encre); background: var(--fond); border: 1.5px solid #D6CEBE; border-radius: var(--r); padding: .75rem .85rem; transition: border-color .2s, box-shadow .2s; }
.champ input::placeholder, .champ textarea::placeholder { color: #737A88; }
.champ input:focus, .champ select:focus, .champ textarea:focus { outline: none; border-color: var(--or-fonce); box-shadow: 0 0 0 3px rgba(205, 167, 90, .3); background: var(--blanc); }
.champ textarea { min-height: 120px; resize: vertical; }
.champ input:user-invalid, .champ textarea:user-invalid { border-color: var(--err); }
.rgpd { display: flex; gap: .65rem; align-items: flex-start; font-size: .9rem; color: var(--encre-2); margin: 1.1rem 0; }
.rgpd input { width: 1.15rem; height: 1.15rem; margin-top: .15rem; accent-color: var(--nuit); flex: none; }
.pot { position: absolute; left: -5000px; width: 1px; height: 1px; overflow: hidden; }
.form__msg { margin-top: 1rem; padding: 0; font-weight: 600; }
.form__msg:empty { display: none; }
.form__msg.ok { padding: .9rem 1.1rem; background: #EEF5EF; color: var(--ok); border-radius: var(--r); border: 1px solid #CFE3D3; }
.form__msg.err { padding: .9rem 1.1rem; background: #FFF3F1; color: var(--err); border-radius: var(--r); border: 1px solid #F1CFC9; }
.form__note { font-size: .88rem; color: var(--encre-2); margin: .9rem 0 0; }
.aside-contact { display: grid; gap: 1.5rem; }
.aside-contact .grosnum { font: 600 clamp(1.9rem, 3vw, 2.4rem)/1.1 var(--f-titre); text-decoration: none; display: inline-flex; align-items: center; gap: .5rem; }
.aside-contact .grosnum .ico { color: var(--or-fonce); }
.carte-plan { border-radius: var(--r-lg); overflow: hidden; border: 1px solid var(--filet); background: var(--fond-2); aspect-ratio: 4 / 3; display: grid; place-items: center; text-align: center; padding: 1.5rem; }
.carte-plan iframe { width: 100%; height: 100%; border: 0; }
.carte-plan p { color: var(--encre-2); font-size: .92rem; }

/* ---------- Pied de page ---------- */
.foot { background: var(--nuit); color: var(--sur-nuit-2); padding: clamp(3rem, 7vw, 4.5rem) 0 1.5rem; font-size: .96rem; }
.foot a { color: var(--sur-nuit); text-decoration: none; }
.foot a:hover { color: var(--or-clair); text-decoration: underline; }
.foot__grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 2rem; }
.foot__logo { font: 600 2.6rem/1 var(--f-titre); color: var(--sur-nuit); margin-bottom: .75rem; letter-spacing: .02em; }
.foot__h { font: 600 .82rem/1.2 var(--f-texte); text-transform: uppercase; letter-spacing: .12em; color: var(--or-clair); margin-bottom: 1rem; }
.foot ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.foot address { font-style: normal; line-height: 1.75; }
.foot__lien { display: inline-flex; align-items: center; gap: .4rem; margin-top: .5rem; }
.foot__bas { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; border-top: 1px solid rgba(188, 197, 214, .2); margin-top: 2.5rem; padding-top: 1.25rem; font-size: .88rem; }
.foot__bas p { margin: 0; }
.foot__liens { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; align-items: center; }
@media (max-width: 900px) { .foot__grid { grid-template-columns: 1fr 1fr; } .foot__brand { grid-column: 1 / -1; } }
@media (max-width: 520px) { .foot__grid { grid-template-columns: 1fr; } }

/* ---------- Barre mobile ---------- */
.mbar { display: none; }
@media (max-width: 1020px) {
  .mbar { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; padding: .55rem .6rem calc(.55rem + env(safe-area-inset-bottom)); background: rgba(15, 26, 44, .97); transform: translateY(110%); transition: transform .35s var(--ease); }
  .mbar.is-visible { transform: none; }
  .mbar.is-hidden { transform: translateY(110%); }
  .mbar a { display: flex; align-items: center; justify-content: center; gap: .5rem; padding: .85rem; border-radius: var(--r); font-weight: 700; text-decoration: none; }
  .mbar__tel { background: var(--or); color: var(--nuit); }
  .mbar__res { border: 1.5px solid rgba(226, 199, 136, .6); color: var(--sur-nuit); }
  body { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
}

/* ---------- Pages légales, plan, 404 ---------- */
.legal { max-width: 74ch; }
.legal h2 { font-size: 1.6rem; margin-top: 2.2rem; }
.legal p, .legal li { color: var(--encre-2); }
.plan h2 { font-size: 1.4rem; margin-top: 2rem; }
.plan ul { padding-left: 1.1rem; display: grid; gap: .35rem; }
.erreur { text-align: center; padding: clamp(4rem, 12vw, 8rem) 0; }
.erreur p { color: var(--encre-2); }
.erreur .btn { margin: .4rem; }

/* Apparition douce des rangées (un seul geste, au défilement) */
.revele { transition: opacity .9s var(--ease), transform .9s var(--ease), filter .9s var(--ease); }
.revele.a-reveler { opacity: 0; transform: translateY(22px); filter: blur(4px); }