/* Les Inséparables · v2 (14/10 soir), après le refus de la v1 : « police illisible », « voir le menu en entier ».
   Parti pris : la nuit chaude de la salle (marbre sombre, bois, lumière d'ambre) pour l'accueil,
   et le menu imprimé sur papier crème, lisible comme une vraie carte. Une police de titre robuste
   (Young Serif, traits épais), un texte courant à 17 px (Hanken Grotesk).
   Contrastes : crème sur nuit 16:1 ; crème 2 sur nuit 10:1 ; sauge sur nuit 8,6:1 ; crème sur brique 5,4:1 ;
   encre sur papier 14:1 ; encre 2 sur papier 7,3:1 ; brique foncée sur papier 6,6:1. */
:root {
  --nuit: #16130F;
  --nuit-2: #221D18;
  --trait-nuit: rgba(244,238,228,.16);
  --creme: #F4EEE4;
  --creme-2: #CFC7BA;
  --sauge: #AEBC9F;
  --brique: #A9442B;
  --brique-fonce: #8A3520;
  --papier: #F6F1E8;
  --papier-2: #EDE5D7;
  --encre: #1E1B17;
  --encre-2: #4E4A43;
  --trait: #DCD2C1;
  --titre: "Young Serif", Georgia, "Times New Roman", serif;
  --texte: "Hanken Grotesk", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
* { box-sizing: border-box; }
html, body { margin: 0; }
body { font-family: var(--texte); background: #0d0c0a; -webkit-font-smoothing: antialiased; }
h1, h2, h3, p, figure, ul { margin: 0; }
ul { padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; }
img { display: block; width: 100%; height: 100%; object-fit: cover; }
.scr { position: relative; overflow: hidden; display: flex; flex-direction: column; background: var(--nuit); color: var(--creme); }
.nw { white-space: nowrap; }
.tn { font-variant-numeric: tabular-nums lining-nums; }

/* commandes */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 54px; padding: 0 24px;
  border-radius: 999px; font: 600 17px/1 var(--texte); white-space: nowrap; }
.btn.prim { background: var(--brique); color: var(--creme); }
.btn.sec { border: 1.5px solid rgba(244,238,228,.7); color: var(--creme); }
.papier .btn.sec { border-color: var(--encre); color: var(--encre); }
.sur { font: 600 14px/1.3 var(--texte); letter-spacing: .1em; text-transform: uppercase; color: var(--sauge); }
.papier .sur, .papier-plein .sur { color: var(--brique-fonce); }
.marque { font: 400 22px/1 var(--titre); color: var(--creme); }

/* ---------- en-tête posé sur la photo ---------- */
.tete { position: absolute; z-index: 2; top: 0; left: 0; right: 0; height: 64px; display: flex; align-items: center;
  justify-content: space-between; padding: 0 20px; background: linear-gradient(rgba(10,9,7,.62), rgba(10,9,7,0)); }
.tete .lien { font: 600 16px/1 var(--texte); padding: 14px 0 14px 16px; color: var(--creme); }

/* ---------- accueil téléphone ---------- */
.m .photo { height: 452px; flex: none; position: relative; }
.m .photo::after { content: ""; position: absolute; inset: auto 0 0 0; height: 120px; background: linear-gradient(rgba(22,19,15,0), var(--nuit)); }
.m .accueil { padding: 0 20px; margin-top: -8px; position: relative; display: flex; flex-direction: column; gap: 12px; }
.m h1 { font: 400 34px/1.14 var(--titre); letter-spacing: -.005em; text-wrap: balance; }
.m .faits { font: 400 16px/1.45 var(--texte); color: var(--creme-2); }
.m .actions { display: flex; flex-direction: column; gap: 10px; margin-top: 8px; }
.m .actions .btn { width: 100%; }

/* ---------- le menu imprimé (papier) ---------- */
.papier { background: var(--papier); color: var(--encre); }
.choix { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.choix a { display: flex; flex-direction: column; justify-content: center; gap: 5px; min-height: 66px; padding: 10px 12px; border-radius: 12px;
  border: 1.5px solid var(--trait); color: var(--encre); background: transparent; }
.choix a b { font: 600 15px/1.2 var(--texte); }
.choix a span { font: 400 19px/1 var(--titre); }
.choix a.on { background: var(--encre); border-color: var(--encre); color: var(--papier); }
.carte-titre { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.carte-titre h2 { font: 400 32px/1.1 var(--titre); }
.carte-titre .prix { font: 400 32px/1 var(--titre); }
.carte-sous { font: 400 16px/1.5 var(--texte); color: var(--encre-2); }
.temps { display: flex; flex-direction: column; gap: 14px; padding-top: 18px; border-top: 1px solid var(--trait); }
.temps h3 { font: 600 14px/1.3 var(--texte); letter-spacing: .1em; text-transform: uppercase; color: var(--brique-fonce); }
.temps h3 span { font-weight: 500; letter-spacing: .02em; text-transform: none; color: var(--encre-2); }
.plat { display: flex; flex-direction: column; gap: 4px; }
.plat b { font: 400 20px/1.25 var(--titre); }
.plat p { font: 400 16px/1.5 var(--texte); color: var(--encre-2); }
.ou { font: italic 400 16px/1 var(--titre); color: var(--encre-2); }
.note { font: 400 15px/1.5 var(--texte); color: var(--encre-2); }

/* ---------- page complète téléphone ---------- */
.m .bloc { padding: 40px 20px; display: flex; flex-direction: column; gap: 22px; }
.m .bloc.papier { gap: 22px; }
.m h2.sec-titre { font: 400 30px/1.15 var(--titre); text-wrap: balance; }
.m .intro-txt { font: 400 17px/1.55 var(--texte); color: var(--creme-2); }
.galerie { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.galerie figure { aspect-ratio: 4 / 5; border-radius: 6px; overflow: hidden; }
.galerie figure.large { grid-column: span 2; aspect-ratio: 4 / 3.4; }
.lieu-photo { aspect-ratio: 4 / 4.4; border-radius: 6px; overflow: hidden; }
.infos { display: flex; flex-direction: column; }
.infos > div { display: flex; flex-direction: column; gap: 4px; padding: 14px 0; border-top: 1px solid var(--trait-nuit); }
.infos dt, .infos .k { font: 600 14px/1.3 var(--texte); letter-spacing: .1em; text-transform: uppercase; color: var(--sauge); }
.infos .v { font: 400 17px/1.5 var(--texte); color: var(--creme); }
.infos .v a { text-decoration: underline; text-underline-offset: 3px; }
.question { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 20px; border-radius: 10px; background: var(--nuit-2); }
.question p { font: 400 16px/1.45 var(--texte); color: var(--creme-2); }
.question p b { display: block; font: 600 17px/1.3 var(--texte); color: var(--creme); }
.barre { position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; display: flex; gap: 10px; padding: 12px 16px 16px;
  background: var(--nuit); border-top: 1px solid var(--trait-nuit); }
.barre .btn { flex: 1; min-height: 50px; font-size: 16px; padding: 0 12px; }
.fin { text-align: left; }

/* ---------- ordinateur ---------- */
.d .tete { height: 84px; padding: 0 56px; position: absolute; }
.d .tete .marque { font-size: 27px; }
.d .tete nav { display: flex; align-items: center; gap: 34px; font: 500 16px/1 var(--texte); color: var(--creme); }
.d .tete nav .btn { min-height: 48px; font-size: 16px; padding: 0 22px; }
.d .accueil-d { flex: 1; display: grid; grid-template-columns: 1fr 672px; min-height: 0; }
.d .col { padding: 120px 72px 56px 80px; display: flex; flex-direction: column; justify-content: center; gap: 22px; }
.d h1 { font: 400 60px/1.08 var(--titre); letter-spacing: -.01em; text-wrap: balance; max-width: 600px; }
.d .faits { font: 400 18px/1.5 var(--texte); color: var(--creme-2); max-width: 540px; }
.d .actions { display: flex; gap: 12px; margin-top: 8px; }
.d .photo-d { position: relative; }
.d .photo-d::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 140px; z-index: 1; background: linear-gradient(90deg, var(--nuit), rgba(22,19,15,0)); }
.d .apercu { display: flex; gap: 0; border-top: 1px solid var(--trait-nuit); margin-top: 28px; max-width: 600px; }
.d .apercu a { flex: 1; padding: 16px 0 0; display: flex; flex-direction: column; gap: 4px; }
.d .apercu a + a { padding-left: 22px; border-left: 1px solid var(--trait-nuit); margin-left: 22px; }
.d .apercu b { font: 600 16px/1.3 var(--texte); color: var(--creme); }
.d .apercu span { font: 400 16px/1.3 var(--texte); color: var(--creme-2); }
.d .apercu .px { font: 400 26px/1.1 var(--titre); color: var(--creme); margin-top: 4px; }

.d.papier-plein { background: var(--papier); color: var(--encre); }
.d .menu-d { padding: 72px 80px; display: grid; grid-template-columns: 380px 1fr; gap: 72px; }
.d .menu-d .gauche { display: flex; flex-direction: column; gap: 20px; }
.d .menu-d .gauche h2 { font: 400 44px/1.1 var(--titre); }
.d .menu-d .gauche .choix { grid-template-columns: 1fr; max-width: 260px; }
.d .menu-d .droite { display: flex; flex-direction: column; gap: 22px; }
.d .menu-d .cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 36px; }
.d .menu-d .carte-titre h2, .d .menu-d .carte-titre .prix { font-size: 38px; }
.d .menu-d .photo-menu { border-radius: 8px; overflow: hidden; aspect-ratio: 4 / 5; width: 300px; }

/* =================== v3 (14/10) : l'allée d'entrée en accueil, le menu en carte classique =================== */
.m .hero { position: relative; height: 682px; flex: none; }
.m .hero::after { content: ""; position: absolute; inset: 0; background:
  linear-gradient(rgba(12,10,8,.45) 0, rgba(12,10,8,0) 22%, rgba(12,10,8,0) 38%, rgba(22,19,15,.72) 62%, var(--nuit) 100%); }
.m .hero .sur-photo { position: absolute; z-index: 1; left: 20px; right: 20px; bottom: 22px; display: flex; flex-direction: column; gap: 12px; }
.m .hero h1 { font: 400 36px/1.12 var(--titre); letter-spacing: -.005em; text-wrap: balance; }
.m .actions-v3 { padding: 6px 20px 0; display: flex; flex-direction: column; gap: 10px; }
.m .actions-v3 .btn { width: 100%; }

/* la carte : une colonne centrée, comme une carte imprimée */
.carte3 { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 0; }
.carte3 .cap { font: 600 13.5px/1.3 var(--texte); letter-spacing: .14em; text-transform: uppercase; color: var(--brique-fonce); }
.carte3 h2 { font: 400 40px/1.05 var(--titre); margin-top: 10px; }
.carte3 .prix3 { font: 400 22px/1.2 var(--titre); margin-top: 8px; }
.carte3 .quand { font: 400 16px/1.5 var(--texte); color: var(--encre-2); margin-top: 6px; }
.carte3 .filet { width: 40px; height: 1px; background: var(--encre); opacity: .35; margin: 30px 0; flex: none; }
.carte3 .temps3 { display: flex; flex-direction: column; align-items: center; gap: 14px; max-width: 320px; }
.carte3 .temps3 h3 { font: 600 13.5px/1.3 var(--texte); letter-spacing: .14em; text-transform: uppercase; color: var(--encre-2); }
.carte3 .plat3 b { display: block; font: 400 21px/1.28 var(--titre); }
.carte3 .plat3 p { font: 400 16px/1.5 var(--texte); color: var(--encre-2); margin-top: 4px; }
.carte3 .ou3 { font: italic 400 16px/1 var(--texte); color: var(--encre-2); }
.carte3 .apres { font: 400 16px/1.5 var(--texte); color: var(--encre-2); margin-top: 30px; max-width: 300px; }
.carte3 .btn { margin-top: 26px; min-width: 260px; }

/* les autres menus : une liste sobre */
.autres { display: flex; flex-direction: column; }
.autres .t { font: 600 13.5px/1.3 var(--texte); letter-spacing: .14em; text-transform: uppercase; color: var(--encre-2); padding-bottom: 6px; }
.autres a { display: flex; align-items: center; gap: 12px; min-height: 64px; border-top: 1px solid var(--trait); }
.autres a:last-child { border-bottom: 1px solid var(--trait); }
.autres a b { font: 400 21px/1.2 var(--titre); }
.autres a span { font: 400 16px/1.3 var(--texte); color: var(--encre-2); }
.autres a .px { margin-left: auto; font: 400 19px/1 var(--titre); color: var(--encre); }
.autres a svg { flex: none; width: 18px; height: 18px; stroke: var(--encre-2); fill: none; stroke-width: 1.8; }

/* ordinateur v3 */
.d .accueil-v3 { flex: 1; display: grid; grid-template-columns: 1fr 700px; min-height: 0; }
.d .accueil-v3 .photo-d::before { width: 180px; }
.d .menu-v3 { padding: 80px 0; display: grid; grid-template-columns: 1fr 520px 1fr; gap: 64px; align-items: start; }
.d .menu-v3 .carte3 h2 { font-size: 46px; }
.d .menu-v3 .carte3 .temps3 { max-width: 440px; }
.d .menu-v3 .cote { padding-top: 8px; display: flex; flex-direction: column; gap: 18px; }
.d .menu-v3 .cote.g { padding-left: 80px; }
.d .menu-v3 .cote.dr { padding-right: 80px; }
.d .menu-v3 figure { border-radius: 8px; overflow: hidden; aspect-ratio: 4 / 5; }

/* =================== police retenue (14/10) : Helvetica Neue, titres en graisse normale =================== */
:root{--titre:'Helvetica Neue',Helvetica,Arial,sans-serif;--texte:'Helvetica Neue',Helvetica,Arial,sans-serif}
.m .hero h1{font-weight:400;font-size:36px;line-height:1.08;letter-spacing:-.025em}
.d h1{font-weight:400;font-size:64px;line-height:1.02;letter-spacing:-.025em}
.carte3 h2{font-weight:400;font-size:40px;letter-spacing:-.025em}
.carte3 .prix3{font-weight:400;font-size:21px}
.carte3 .plat3 b,.autres a b{font-weight:500;font-size:18.5px;letter-spacing:-.005em;line-height:1.3}
.marque{font-weight:500;font-size:20px;letter-spacing:-.01em}
.m h2.sec-titre{font-weight:400;letter-spacing:-.025em}
.carte3 .ou3{font-style:normal}


/* =================== ordinateur v3b (14/10) : la photo en plein écran, plus de moitié noire =================== */
.d .hero-d { position: relative; flex: 1; min-height: 0; }
.d .hero-d img { position: absolute; inset: 0; object-position: 50% 55%; }
.d .hero-d::after { content: ""; position: absolute; inset: 0; background:
  linear-gradient(rgba(10,9,7,.55) 0, rgba(10,9,7,0) 16%, rgba(10,9,7,0) 46%, rgba(10,9,7,.55) 74%, rgba(10,9,7,.82) 100%); }
.d .hero-d .texte-d { position: absolute; z-index: 1; left: 80px; right: 80px; bottom: 64px; display: flex; align-items: flex-end; justify-content: space-between; gap: 48px; }
.d .hero-d .bloc-d { display: flex; flex-direction: column; gap: 16px; max-width: 720px; }
.d .hero-d h1 { font-size: 66px; max-width: 720px; }
.d .hero-d .faits { color: rgba(244,238,228,.88); }
.d .hero-d .actions { display: flex; gap: 12px; flex: none; }
.d .hero-d .actions .btn { min-height: 56px; padding: 0 30px; }

/* =================== v3c (14/10) : WhatsApp en avant, fin de menu nette, horaires vérifiés =================== */
.btn.wa { background: #128C4A; color: #FFFFFF; gap: 10px; }
.btn.wa svg { width: 22px; height: 22px; flex: none; }
.m .actions-v3 .rang { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.m .actions-v3 .rang .btn { padding: 0 12px; }
.fin-carte { width: 100%; margin-top: 34px; padding-top: 30px; border-top: 1px solid var(--trait); display: flex; flex-direction: column; align-items: stretch; gap: 12px; text-align: center; }
.fin-carte h3 { font: 400 26px/1.2 var(--titre); letter-spacing: -.02em; color: var(--encre); }
.fin-carte p { font: 400 16px/1.5 var(--texte); color: var(--encre-2); margin-bottom: 6px; }
.fin-carte .btn { width: 100%; min-width: 0; margin: 0; }
.carte3 .fin-carte .btn { margin-top: 0; }
.bloc-autres { background: var(--papier-2); }
.autres .t { font-size: 15px; padding-bottom: 10px; }
.barre .btn.wa { flex: 0 0 auto; padding: 0 18px; }
.d .hero-d .actions .btn.wa { padding: 0 24px; }
.question .btn.wa { min-height: 48px; padding: 0 18px; font-size: 16px; }
.d .menu-v3 .fin-carte { max-width: 440px; }

/* =================== v3d (14/10) : « Une question ? » remplace le bouton WhatsApp (Steeve : « WhatsApp ça veut rien dire ») =================== */
.q-pill { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 14px 0 12px; border-radius: 999px;
  background: rgba(244,238,228,.14); border: 1px solid rgba(244,238,228,.55); color: var(--creme);
  font: 600 15px/1 var(--texte); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); white-space: nowrap; }
.q-pill svg, .btn.q svg { width: 20px; height: 20px; flex: none; }
.btn.q { gap: 9px; border: 1.5px solid rgba(244,238,228,.7); color: var(--creme); }
.papier .btn.q, .papier-plein .btn.q { border-color: var(--encre); color: var(--encre); }
.barre .btn.q { flex: 0 0 auto; padding: 0 16px; }
.d .tete nav .q-pill { height: 44px; }
/* v3e (14/10) : le logo WhatsApp sur « Une question ? » (Steeve) */
.q-pill svg, .btn.q svg { color: #25D366; width: 21px; height: 21px; }
.papier .btn.q svg, .papier-plein .btn.q svg { color: #128C4A; }

/* =================== v3f (14/10) : « Une question ? » dans le ton de la marque (Steeve : la pastille fait « codée ») =================== */
.q-pill { height: auto; padding: 8px 0 8px 12px; background: none; border: 0; -webkit-backdrop-filter: none; backdrop-filter: none;
  font: 400 17px/1 var(--texte); letter-spacing: -.01em; color: var(--creme); gap: 8px; }
.q-pill svg { width: 19px; height: 19px; color: #25D366; }
.q-pill span { border-bottom: 1px solid rgba(244,238,228,.55); padding-bottom: 3px; }
.d .tete nav .q-pill { height: auto; font-size: 16px; }

/* =================== v4 (14/10 soir) : le corps de page refait (Steeve : menus pas assez visibles, sections « basiques ») =================== */
.m .ch { display: flex; flex-direction: column; }
.m .ch-titre { padding: 44px 20px 0; display: flex; flex-direction: column; gap: 10px; }
.m .ch-titre h2 { font: 400 32px/1.1 var(--titre); letter-spacing: -.025em; text-wrap: balance; }
.m .ch-titre p { font: 400 17px/1.5 var(--texte); color: var(--creme-2); }
/* les quatre choix, en photos */
.choix4 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 22px 20px 0; }
.choix4 a { position: relative; aspect-ratio: 4 / 5; border-radius: 10px; overflow: hidden; display: block; outline: 2px solid transparent; outline-offset: 3px; }
.choix4 a img { position: absolute; inset: 0; }
.choix4 a::after { content: ""; position: absolute; inset: 0; background: linear-gradient(rgba(12,10,8,0) 35%, rgba(12,10,8,.86) 100%); }
.choix4 a .t4 { position: absolute; z-index: 1; left: 12px; right: 12px; bottom: 12px; display: flex; flex-direction: column; gap: 3px; }
.choix4 a b { font: 500 19px/1.15 var(--texte); letter-spacing: -.01em; color: var(--creme); }
.choix4 a span { font: 400 15px/1.3 var(--texte); color: rgba(244,238,228,.86); }
.choix4 a em { font-style: normal; font: 400 21px/1 var(--titre); color: var(--creme); margin-top: 4px; }
.choix4 a.on { outline-color: var(--creme); }
.choix4 a.on .badge4 { position: absolute; z-index: 1; top: 10px; left: 10px; font: 600 13px/1 var(--texte); letter-spacing: .02em; color: var(--encre); background: var(--creme); border-radius: 999px; padding: 6px 10px; }
.m .carte-v4 { margin-top: 28px; }
/* récit en grandes images */
.recit { display: flex; flex-direction: column; margin-top: 52px; }
.recit figure { position: relative; height: 520px; }
.recit figure.court { height: 440px; }
.recit figure::after { content: ""; position: absolute; inset: 0; background: linear-gradient(rgba(22,19,15,0) 45%, rgba(22,19,15,.9) 100%); }
.recit figure figcaption { position: absolute; z-index: 1; left: 20px; right: 20px; bottom: 24px; font: 400 27px/1.18 var(--titre); letter-spacing: -.02em; color: var(--creme); text-wrap: balance; }
.recit figure figcaption small { display: block; margin-top: 10px; font: 400 16px/1.5 var(--texte); letter-spacing: 0; color: rgba(244,238,228,.86); }
.recit .duo4 { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; margin-top: 3px; }
.recit .duo4 figure { height: 230px; }
.recit .duo4 figure::after { display: none; }
/* nous trouver */
.trouver { padding: 52px 20px 0; display: flex; flex-direction: column; gap: 18px; }
.trouver h2 { font: 400 32px/1.1 var(--titre); letter-spacing: -.025em; }
.trouver .adr { font: 400 18px/1.5 var(--texte); color: var(--creme); }
.trouver .adr span { color: var(--creme-2); }
.trouver .boutons { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.trouver .boutons .btn { min-height: 50px; font-size: 16px; padding: 0 10px; }
.horaires4 { display: flex; flex-direction: column; border-top: 1px solid var(--trait-nuit); }
.horaires4 div { display: flex; justify-content: space-between; gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--trait-nuit); font: 400 17px/1.3 var(--texte); }
.horaires4 div span:last-child { color: var(--creme-2); text-align: right; }
/* dernier appel sur photo */
.dernier { position: relative; margin-top: 52px; height: 560px; }
.dernier::after { content: ""; position: absolute; inset: 0; background: linear-gradient(rgba(12,10,8,.2), rgba(12,10,8,.82)); }
.dernier .in { position: absolute; z-index: 1; left: 20px; right: 20px; bottom: 32px; display: flex; flex-direction: column; gap: 12px; }
.dernier h2 { font: 400 34px/1.1 var(--titre); letter-spacing: -.025em; color: var(--creme); text-wrap: balance; }
.dernier p { font: 400 17px/1.5 var(--texte); color: rgba(244,238,228,.88); margin-bottom: 6px; }
.dernier .btn { width: 100%; }

/* ===== v5 ===== */
.wa-logo { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: #25D366; color: #FFFFFF; }
.wa-logo svg { width: 19px; height: 19px; }
.question-wa { display: inline-flex; align-items: center; gap: 9px; padding: 6px 0 6px 10px; font: 500 17px/1 var(--texte); letter-spacing: -.01em; color: var(--creme); white-space: nowrap; }
.tete .question-wa span { text-shadow: 0 1px 8px rgba(0,0,0,.35); }

/* barre épinglée */
.barre-haut { position: absolute; z-index: 5; top: 0; left: 0; right: 0; height: 60px; display: flex; align-items: center; justify-content: space-between;
  padding: 0 12px 0 20px; background: rgba(22,19,15,.9); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border-bottom: 1px solid var(--trait-nuit); }
.barre-haut .marque { font-size: 18px; }
.bh-actions { display: flex; align-items: center; gap: 10px; }
.bh-wa { display: inline-flex; width: 44px; height: 44px; align-items: center; justify-content: center; }
.bh-wa .wa-logo { width: 36px; height: 36px; }
.bh-wa .wa-logo svg { width: 22px; height: 22px; }
.btn.bh-res { min-height: 40px; padding: 0 18px; font-size: 16px; }
.defile { display: flex; flex-direction: column; flex: none; }
.m.papier-fond { background: var(--papier); }

/* sections : un seul rythme */
.s5 { display: flex; flex-direction: column; padding-top: 56px; }
.t-sec { padding: 0 20px; display: flex; flex-direction: column; gap: 10px; }
.t-sec h2, .txt5 h2 { font: 400 32px/1.1 var(--titre); letter-spacing: -.025em; text-wrap: balance; color: var(--creme); }
.t-sec p { font: 400 17px/1.5 var(--texte); color: var(--creme-2); }
.txt5 { padding: 22px 20px 0; display: flex; flex-direction: column; gap: 10px; }
.txt5.sans-haut { padding-top: 0; }
.txt5 p { font: 400 17px/1.55 var(--texte); color: var(--creme-2); }
.txt5 h3 { font: 400 24px/1.2 var(--titre); letter-spacing: -.02em; color: var(--creme); }
.txt5 .sur { margin-bottom: 2px; }
.ph5 { position: relative; overflow: hidden; }
.ph5.h45 { height: 460px; }
.ph5.haut5 { margin-top: 40px; }

/* tuiles des menus, sans photo */
.tuiles5 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 24px 20px 0; }
.t5 { position: relative; display: flex; flex-direction: column; min-height: 150px; padding: 16px 16px 14px; border-radius: 14px;
  border: 1px solid rgba(244,238,228,.3); color: var(--creme); }
.t5 .t5-det, .t5 .t5-etiq { font: 400 14px/1.3 var(--texte); color: var(--creme-2); }
.t5 b { font: 500 20px/1.15 var(--texte); letter-spacing: -.01em; margin-top: 6px; }
.t5 .t5-prix { margin-top: auto; font: 300 36px/1 var(--texte); letter-spacing: -.03em; }
.t5 .t5-saison { margin-top: auto; font: 400 16px/1.2 var(--texte); color: var(--creme-2); padding-bottom: 4px; }
.t5 .fl { position: absolute; right: 14px; bottom: 16px; width: 20px; height: 20px; color: var(--creme-2); }
.t5.on { background: var(--creme); border-color: var(--creme); color: var(--encre); }
.t5.on .t5-etiq { font-weight: 600; color: var(--brique-fonce); }
.t5.on .fl { color: var(--encre-2); transform: rotate(90deg); }

/* carte papier collée aux tuiles, sans bande noire */
.carte5 { margin-top: 32px; padding: 48px 20px 52px; }
.carte5.seul { margin-top: 0; padding-top: 120px; }
.carte3 .fin5 { width: 100%; margin-top: 34px; padding-top: 30px; border-top: 1px solid var(--trait); display: flex; flex-direction: column; gap: 16px; }
.carte3 .fin5 h3 { font: 400 24px/1.2 var(--titre); letter-spacing: -.02em; color: var(--encre); }
.carte3 .fin5 .btn { margin-top: 0; width: 100%; min-width: 0; }

/* le chef */
.duo5 { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin-top: 28px; }
.duo5 figure { height: 230px; overflow: hidden; }

/* nous trouver */
.trouver5 .adr { font: 400 18px/1.5 var(--texte); color: var(--creme); }
.trouver5 .adr span { color: var(--creme-2); }
.boutons5 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 20px 20px 0; }
.boutons5 .btn { min-height: 50px; font-size: 16px; padding: 0 10px; }
.trouver5 .horaires4 { margin: 24px 20px 0; }

/* fin de page */
.ph5.h-fin { height: 340px; }
.pile5 { display: flex; flex-direction: column; gap: 8px; padding: 22px 20px 0; }
.pile5 .btn { width: 100%; }
.question-wa.lien5 { justify-content: center; min-height: 50px; padding: 0; font-size: 17px; }
.pied5 { padding: 40px 20px 36px; font: 400 14px/1.4 var(--texte); color: var(--creme-2); text-align: center; }

/* ordinateur */
.d .tete nav .question-wa { font-size: 16px; }
.d-bh { height: 72px; padding: 0 56px; }
.d-bh .marque { font-size: 22px; }
.d-bh nav { display: flex; align-items: center; gap: 30px; font: 500 16px/1 var(--texte); color: var(--creme); }
.d-bh .btn.bh-res { min-height: 44px; padding: 0 20px; }
.d .menu5-d { padding: 136px 0 88px; display: grid; grid-template-columns: 1fr 520px 1fr; gap: 64px; align-items: start; }
.d .menu5-d .carte3 h2 { font-size: 46px; }
.d .menu5-d .carte3 .temps3 { max-width: 440px; }
.d .menu5-d .cote { padding-top: 8px; display: flex; flex-direction: column; gap: 14px; }
.d .menu5-d .cote.g { padding-left: 80px; }
.d .menu5-d .cote.dr { padding-right: 80px; }
.d .menu5-d figure { border-radius: 8px; overflow: hidden; aspect-ratio: 4 / 5; }
.d .menu5-d .t-col { font: 500 16px/1.3 var(--texte); color: var(--encre-2); }
.tuiles5.col { grid-template-columns: 1fr; padding: 0; gap: 10px; }
.papier-plein .t5 { border-color: var(--trait); color: var(--encre); min-height: 0; padding: 16px 48px 16px 18px; }
.papier-plein .t5 .t5-det, .papier-plein .t5 .t5-saison { color: var(--encre-2); }
.papier-plein .t5 b { margin-top: 4px; }
.papier-plein .t5 .t5-prix { font-size: 26px; margin-top: 8px; }
.papier-plein .t5 .t5-saison { margin-top: 8px; padding: 0; }
.papier-plein .t5 .fl { top: 50%; bottom: auto; margin-top: -10px; color: var(--encre-2); }
.papier-plein .t5.on { background: var(--encre); border-color: var(--encre); color: var(--papier); }
.papier-plein .t5.on .t5-etiq { color: var(--sauge); }
.papier-plein .t5.on .fl { color: var(--papier-2); }
.s5.histoire5.colle { padding-top: 0; }
.s5.lieu5.colle-duo { padding-top: 4px; }

/* ===== v6 ===== */
body.live { background: var(--nuit); }
.live .scr { overflow: visible; }
.actions6 { padding: 6px 20px 0; }
.actions6 .btn { width: 100%; }

/* barres épinglées */
.barre6 { position: absolute; z-index: 6; left: 0; right: 0; bottom: 0; display: flex; gap: 10px; padding: 12px 16px 18px;
  background: rgba(22,19,15,.92); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border-top: 1px solid var(--trait-nuit); }
.barre6 .btn { min-height: 50px; font-size: 16px; }
.barre6 .btn.prim { flex: 1; padding: 0 14px; }
.btn.q6 { flex: none; gap: 8px; padding: 0 14px 0 10px; border: 1.5px solid rgba(244,238,228,.6); color: var(--creme); font-weight: 500; }
.btn.q6 .wa-logo { width: 28px; height: 28px; }
.btn.q6 .wa-logo svg { width: 18px; height: 18px; }
.haut6 { position: absolute; z-index: 6; top: 0; left: 0; right: 0; height: 60px; display: flex; align-items: center; justify-content: space-between;
  padding: 0 12px 0 20px; background: rgba(22,19,15,.92); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border-bottom: 1px solid var(--trait-nuit); }
.haut6 .marque { font-size: 18px; }
.live .barre6, .live .haut6 { position: fixed; transition: transform .3s ease, opacity .3s ease; }
.live .barre6:not(.vue) { transform: translateY(100%); opacity: 0; }
.live .haut6:not(.vue) { transform: translateY(-100%); opacity: 0; }
.cale6 { height: 84px; flex: none; }

/* menus : en-tête de carte imprimée */
.menus6 { padding: 56px 20px 52px; display: flex; flex-direction: column; }
.tete6 { display: flex; flex-direction: column; gap: 10px; text-align: center; align-items: center; }
.tete6 h2 { font: 400 30px/1.12 var(--titre); letter-spacing: -.025em; color: var(--encre); text-wrap: balance; max-width: 300px; }
.trois6 { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 28px; border-top: 1px solid var(--encre); border-bottom: 1px solid var(--trait); }
.m6 { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px; padding: 22px 4px 20px; color: var(--encre); }
.m6 + .m6 { border-left: 1px solid var(--trait); }
.m6 .px6 { font: 300 46px/1 var(--texte); letter-spacing: -.04em; }
.m6 .px6 small { font-size: 20px; letter-spacing: 0; margin-left: 2px; vertical-align: 18px; }
.m6 b { font: 500 17px/1.2 var(--texte); margin-top: 8px; }
.m6 .d6 { font: 400 14px/1.3 var(--texte); color: var(--encre-2); }
.m6 i { font-style: normal; font: 600 13px/1 var(--texte); letter-spacing: .02em; color: var(--brique-fonce); margin-top: 8px; }
.m6.on::after { content: ""; position: absolute; left: 22%; right: 22%; bottom: -1px; height: 3px; background: var(--brique); }
.carte6 { position: relative; display: flex; flex-direction: column; gap: 3px; padding: 18px 40px 18px 0; border-bottom: 1px solid var(--trait); font: 500 17px/1.2 var(--texte); color: var(--encre); }
.carte6 span { font: 400 15px/1.3 var(--texte); color: var(--encre-2); }
.carte6 .fl { position: absolute; right: 4px; top: 50%; margin-top: -10px; width: 20px; height: 20px; color: var(--encre-2); }
.carte-in6 { margin-top: 44px; }

/* photos qui se fondent dans le fond */
.fondu6 { position: relative; overflow: hidden; flex: none; -webkit-mask-image: linear-gradient(#000 62%, transparent 100%); mask-image: linear-gradient(#000 62%, transparent 100%); }
.fondu6.h45 { height: 480px; }
.fondu6.h-chef { height: 470px; }
.fondu6.esp6 { margin-top: 40px; }
.txt6 { padding: 0 20px; display: flex; flex-direction: column; gap: 10px; position: relative; }
.txt6.sur-fondu { margin-top: -64px; }
.txt6 h2 { font: 400 30px/1.12 var(--titre); letter-spacing: -.025em; color: var(--creme); text-wrap: balance; }
.txt6 h3 { font: 400 24px/1.2 var(--titre); letter-spacing: -.02em; color: var(--creme); }
.txt6 p { font: 400 17px/1.55 var(--texte); color: var(--creme-2); }
.txt6 .sur { margin-bottom: 2px; }

/* le chef */
.chef6 { display: flex; flex-direction: column; padding-top: 0; }
.maisons6 { margin: 24px 20px 0; border-top: 1px solid var(--trait-nuit); }
.maisons6 li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 0; border-bottom: 1px solid var(--trait-nuit); }
.maisons6 .n6 { font: 500 17px/1.25 var(--texte); color: var(--creme); }
.maisons6 .n6 small { display: block; font: 400 14px/1.3 var(--texte); color: var(--creme-2); margin-top: 2px; }
.maisons6 .et6 { display: inline-flex; gap: 3px; color: #E9D7B5; flex: none; }
.maisons6 .et6 svg { width: 17px; height: 17px; }
.chef6 > .txt6:not(.sur-fondu) { margin-top: 24px; }
.citation6 { font: 400 21px/1.35 var(--titre) !important; letter-spacing: -.015em; color: var(--creme) !important; margin-top: 8px; }
.distinctions6 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 24px 20px 0; }
.distinctions6 span { display: flex; flex-direction: column; gap: 3px; padding: 14px 14px; border: 1px solid var(--trait-nuit); border-radius: 12px; font: 400 14px/1.3 var(--texte); color: var(--creme-2); }
.distinctions6 b { font: 600 15px/1.25 var(--texte); color: var(--creme); }
.chef6 .duo5 { margin-top: 36px; }

/* le lieu */
.lieu6 { display: flex; flex-direction: column; padding-top: 4px; }

/* la fin : l'allée floutée, « Nous trouver » dedans */
.fin6 { position: relative; margin-top: 48px; display: flex; flex-direction: column; }
.fond6 { position: absolute; inset: 0 0 auto 0; height: 640px; overflow: hidden; -webkit-mask-image: linear-gradient(#000 70%, transparent 100%); mask-image: linear-gradient(#000 70%, transparent 100%); }
.fond6 img { position: absolute; inset: 0; }
.fond6 .flou6 { position: absolute; inset: 0; -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); background: linear-gradient(rgba(22,19,15,0) 0%, rgba(22,19,15,.55) 60%, rgba(22,19,15,.8) 100%);
  -webkit-mask-image: linear-gradient(transparent 22%, #000 52%); mask-image: linear-gradient(transparent 22%, #000 52%); }
.in6 { position: relative; padding: 300px 20px 0; display: flex; flex-direction: column; gap: 16px; }
.in6 h2 { font: 400 34px/1.1 var(--titre); letter-spacing: -.025em; color: var(--creme); }
.adr6 { font: 400 17px/1.5 var(--texte); color: var(--creme); }
.adr6 > span:last-child { color: var(--creme-2); }
.heures6 { display: grid; grid-template-columns: 1fr 1fr; margin-top: 6px; border-top: 1px solid var(--trait-nuit); border-bottom: 1px solid var(--trait-nuit); }
.heures6 div { display: flex; flex-direction: column; gap: 4px; padding: 16px 0; }
.heures6 div + div { border-left: 1px solid var(--trait-nuit); padding-left: 18px; }
.heures6 b { font: 600 14px/1.3 var(--texte); letter-spacing: .1em; text-transform: uppercase; color: var(--sauge); }
.heures6 span { font: 400 19px/1.25 var(--texte); color: var(--creme); }
.heures6 small { font: 400 14px/1.3 var(--texte); color: var(--creme-2); }
.liens6 { display: flex; flex-direction: column; }
.liens6 a { position: relative; display: flex; align-items: center; min-height: 52px; border-bottom: 1px solid var(--trait-nuit); font: 500 17px/1 var(--texte); color: var(--creme); }
.liens6 .fl { position: absolute; right: 2px; width: 20px; height: 20px; color: var(--creme-2); }

/* ordinateur */
.d-bh6 { position: absolute; background: rgba(22,19,15,.94); }
.d .tete nav .btn.prim { min-height: 46px; }
.menus6-d { padding: 148px 0 96px; display: flex; flex-direction: column; align-items: center; }
.menus6-d .tete6 h2 { font-size: 46px; max-width: none; }
.trois-d { width: 760px; }
.trois-d .m6 .px6 { font-size: 60px; }
.trois-d .m6 .px6 small { font-size: 24px; vertical-align: 26px; }
.trois-d .m6 b { font-size: 19px; }
.trois-d .m6 .d6 { font-size: 15px; }
.carte-d6 { width: 520px; margin-top: 64px; }
.carte-d6 .carte3 .temps3 { max-width: 460px; }
.defile { position: relative; }
.btn.q6 { border: 0; padding: 0 4px 0 6px; gap: 8px; }
.barre6 { gap: 6px; }
.actions6 { padding: 6px 20px 44px; }

/* ===== v7 : menus lisibles, moins de traits ===== */
.liste7 { display: flex; flex-direction: column; gap: 10px; margin-top: 28px; }
.mb7 { display: flex; flex-direction: column; gap: 6px; padding: 18px 20px 18px; border-radius: 18px; background: var(--papier-2); color: var(--encre); }
.mb7 .l7 { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.mb7 b { font: 500 21px/1.2 var(--texte); letter-spacing: -.015em; }
.mb7 .px7 { font: 300 30px/1 var(--texte); letter-spacing: -.03em; flex: none; }
.mb7 .px7.fl7 { align-self: center; }
.mb7 .px7.fl7 .fl { width: 22px; height: 22px; color: var(--encre-2); display: block; }
.mb7 .q7 { font: 400 15px/1.45 var(--texte); color: var(--encre-2); }
.mb7 .et7 { font: 600 13px/1.3 var(--texte); letter-spacing: .02em; color: var(--sauge); }
.mb7.on { background: var(--encre); color: var(--papier); }
.mb7.on .q7 { color: var(--creme-2); }
.carte-in6 { margin-top: 52px; }

/* moins de traits : listes aérées, sans filets */
.maisons6 { border-top: 0; display: flex; flex-direction: column; gap: 16px; margin-top: 26px; }
.maisons6 li { border-bottom: 0; padding: 0; }
.maisons6 .et6 { color: #D22630; gap: 4px; }
.maisons6 .et6 svg { width: 20px; height: 20px; }
.distinctions6 span { border: 0; padding: 0; }
.distinctions6 { margin-top: 30px; gap: 16px; }
.heures6 { border: 0; gap: 16px; margin-top: 10px; }
.heures6 div { padding: 0; }
.heures6 div + div { border-left: 0; padding-left: 0; }
.liens7 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
.liens7 .btn { min-height: 50px; font-size: 16px; padding: 0 10px; }

/* ordinateur */
.liste-d7 { width: 760px; }
.liste-d7 .liste7 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.liste-d7 .mb7 { padding: 22px 24px; }
.fond6 { -webkit-mask-image: linear-gradient(transparent 0, #000 16%, #000 70%, transparent 100%); mask-image: linear-gradient(transparent 0, #000 16%, #000 70%, transparent 100%); }

/* ===== v8 ===== */
/* menus : onglets qui restent en haut, un menu affiché à la fois */
.menus8 { padding: 56px 0 56px; display: flex; flex-direction: column; }
.menus8 .tete6 { padding: 0 20px; }
.zone8 { position: relative; margin-top: 24px; }
.onglets8 { position: sticky; top: 0; z-index: 4; display: flex; justify-content: space-between; gap: 4px; padding: 0 16px;
  background: var(--papier); box-shadow: 0 1px 0 rgba(30,27,23,.08); }
.onglets8 a { position: relative; flex: 1; display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 12px 2px 14px; text-align: center; color: var(--encre-2); cursor: pointer; }
.onglets8 a b { font: 500 16px/1.15 var(--texte); letter-spacing: -.01em; white-space: nowrap; }
.onglets8 a span { font: 400 14px/1.2 var(--texte); }
.onglets8 a.on { color: var(--encre); }
.onglets8 a.on b { font-weight: 600; }
.onglets8 a.on::after { content: ""; position: absolute; left: 18%; right: 18%; bottom: 0; height: 3px; border-radius: 3px 3px 0 0; background: var(--brique); }
.onglets8.epingle8 { position: absolute; left: 0; right: 0; top: 0; z-index: 6; box-shadow: 0 6px 18px rgba(0,0,0,.18); }
.panneau8 { display: none; padding: 30px 20px 0; }
.panneau8.on { display: block; }
.live .panneau8 { animation: entree8 .28s ease; }
@keyframes entree8 { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

.quand8 { display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px; border-radius: 999px; background: var(--encre); color: var(--papier); }
.quand8 .qi8 { display: inline-flex; align-items: center; gap: 7px; font: 600 16px/1 var(--texte); }
.quand8 svg { width: 19px; height: 19px; flex: none; }
.quand8.midi { background: var(--brique); color: #FFFFFF; }
.precis8 { font: 400 15px/1.45 var(--texte); color: var(--encre-2); margin-top: 10px; }
.carte3 h2 { margin-top: 18px; }
.formules8 { width: 100%; max-width: 330px; display: flex; flex-direction: column; gap: 8px; margin-top: 18px; }
.f8 { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; text-align: left; font: 400 16px/1.35 var(--texte); color: var(--encre-2); }
.f8 b { font: 400 22px/1 var(--texte); letter-spacing: -.02em; color: var(--encre); flex: none; }
.f8:first-child { color: var(--encre); }
.pc8 span { display: block; font: 400 16px/1.4 var(--texte); color: var(--encre-2); margin-top: 3px; }
.panneau8 .carte3 .temps3 { gap: 14px; }

/* le chef : une maison en vedette, les autres en une phrase */
.chef8 { display: flex; flex-direction: column; }
.phare8 { display: flex; flex-direction: column; gap: 6px; padding: 0 20px; margin-top: 26px; }
.phare8 b { font: 400 34px/1.05 var(--titre); letter-spacing: -.03em; color: var(--creme); margin-top: 6px; }
.phare8 small { font: 400 15px/1.3 var(--texte); color: var(--creme-2); }
.et8 { display: inline-flex; gap: 4px; color: #D22630; vertical-align: -2px; }
.et8 svg { width: 14px; height: 14px; }
.et8.grand svg { width: 26px; height: 26px; }
.parcours8 { padding: 0 20px; margin-top: 18px; font: 400 17px/1.7 var(--texte); color: var(--creme-2); }
.parcours8 .nw { color: var(--creme); }
.suite8 { margin-top: 22px; }

/* galeries à faire glisser */
.cuisine8, .lieu8 { display: flex; flex-direction: column; padding-top: 64px; }
.galerie8 { margin-top: 22px; }
.rail8 { display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 0 20px; scroll-padding: 0 20px; scrollbar-width: none; }
.rail8::-webkit-scrollbar { display: none; }
.rail8 figure { flex: 0 0 300px; scroll-snap-align: start; display: flex; flex-direction: column; gap: 8px; }
.ph8 { position: relative; aspect-ratio: 4 / 5; border-radius: 14px; overflow: hidden; }
.ph8 img { position: absolute; inset: 0; }
.rail8 figcaption { font: 400 15px/1.3 var(--texte); color: var(--creme-2); }
.points8 { display: flex; justify-content: center; gap: 7px; margin-top: 16px; }
.points8 i { width: 7px; height: 7px; border-radius: 50%; background: rgba(244,238,228,.3); }
.points8 i.on { background: var(--creme); }
.fin6 { margin-top: 64px; }

/* ordinateur */
.menus8-d { padding: 148px 0 96px; display: flex; flex-direction: column; align-items: center; }
.menus8-d .tete6 h2 { font-size: 46px; max-width: none; }
.zone8.d8 { width: 680px; }
.zone8.d8 .onglets8 { position: relative; padding: 0; }
.zone8.d8 .onglets8 a b { font-size: 19px; }
.zone8.d8 .onglets8 a span { font-size: 15px; }
.zone8.d8 .panneau8 { padding: 40px 60px 0; }
.onglets8 { justify-content: space-between; gap: 0; padding: 0 20px; }
.onglets8 a { flex: none; padding: 12px 0 14px; }
.onglets8 a b { font-size: 15.5px; }
.onglets8 a.on::after { left: -6px; right: -6px; }
.zone8.d8 .onglets8 { justify-content: space-around; }
.zone8.d8 .carte3 .temps3 { max-width: 460px; }

/* ===== v9 ===== */
/* en-tête : plus d'air entre le nom et « Une question ? » */
.m .tete .marque { font-size: 18px; }
.m .tete .question-wa { font-size: 15.5px; gap: 8px; }
.m .tete .question-wa .wa-logo { width: 26px; height: 26px; }
.m .tete .question-wa .wa-logo svg { width: 16px; height: 16px; }

/* accroche : le parcours du chef */
.accroche9 { display: inline-flex; align-items: center; gap: 10px; font: 600 16px/1.2 var(--texte); color: var(--creme); }
.et8.moyen svg { width: 18px; height: 18px; }
.et8.moyen { gap: 3px; }

/* en-tête d'un menu : nom, quand, formules côte à côte */
.panneau8 .carte3 h2 { margin-top: 0; }
.panneau8 .quand8 { margin-top: 16px; }
.formules9 { display: flex; justify-content: center; gap: 36px; margin-top: 24px; width: 100%; }
.f9 { display: flex; flex-direction: column; align-items: center; gap: 6px; max-width: 150px; }
.f9 b { font: 300 34px/1 var(--texte); letter-spacing: -.03em; color: var(--encre); }
.f9 span { font: 400 15px/1.35 var(--texte); color: var(--encre-2); text-wrap: balance; }
.formules9.n1 .f9 { max-width: 240px; }

/* le chef : son parcours dans un seul cadre */
.parcours9 { margin: 26px 20px 0; padding: 22px 20px 20px; border-radius: 18px; background: var(--nuit-2); display: flex; flex-direction: column; }
.chiffre9 { display: flex; align-items: center; gap: 16px; margin-top: 10px; }
.chiffre9 b { font: 300 64px/.9 var(--texte); letter-spacing: -.04em; color: var(--creme); flex: none; }
.chiffre9 span { font: 400 16px/1.4 var(--texte); color: var(--creme-2); }
.parcours9 ul { display: flex; flex-direction: column; gap: 12px; margin-top: 22px; }
.parcours9 li { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.parcours9 .n9 { font: 500 16px/1.25 var(--texte); color: var(--creme); }
.parcours9 .n9 small { display: block; font: 400 14px/1.3 var(--texte); color: var(--creme-2); margin-top: 1px; }
.et8.ligne svg { width: 16px; height: 16px; }
.et8.ligne { gap: 3px; flex: none; }
.sceau9 { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px; margin: 40px 20px 0; color: var(--creme); }
.sceau9 svg { width: 64px; height: 40px; color: #D9C8A4; margin-bottom: 6px; }
.sceau9 b { font: 400 24px/1.15 var(--titre); letter-spacing: -.02em; }
.sceau9 span { font: 400 15px/1.35 var(--texte); color: var(--creme-2); }

/* galeries : flèches pour la souris seulement */
.bas9 { position: relative; display: flex; justify-content: center; align-items: center; margin-top: 16px; padding: 0 20px; }
.bas9 .points8 { margin-top: 0; }
.fleches9 { display: none; position: absolute; right: 20px; gap: 8px; }
.fleches9 button { width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(244,238,228,.4); background: transparent; color: var(--creme); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; }
.fleches9 svg { width: 18px; height: 18px; }
@media (hover: hover) and (pointer: fine) { .live .fleches9 { display: inline-flex; } }
.sceau9 svg { width: 84px; height: 74px; color: #D9C8A4; margin-bottom: -46px; }
.sceau9 b { position: relative; }
.sceau9 svg { width: 72px; height: 61px; margin-bottom: 6px; }

/* ===== v11 ===== */
/* petits titres sur fond sombre : crème, plus de vert */
:root { --sur-nuit: rgba(244,238,228,.8); }
.sur { color: var(--sur-nuit); }
.papier .sur, .papier-plein .sur, .menus8 .sur { color: var(--brique-fonce); }
.heures6 b { color: var(--sur-nuit); }
.hero .sur, .d .hero-d .sur { color: rgba(244,238,228,.86); }

/* les prénoms sur la photo du duo */
.duo11 { position: relative; }
.nom11 { position: absolute; bottom: 96px; display: flex; flex-direction: column; gap: 2px; text-shadow: 0 1px 10px rgba(0,0,0,.55); }
.nom11.g { left: 20px; }
.nom11.d { right: 20px; text-align: right; }
.nom11 b { font: 600 17px/1.2 var(--texte); color: var(--creme); }
.nom11 span { font: 400 14px/1.2 var(--texte); color: rgba(244,238,228,.86); }
.chef8 .txt6.sur-fondu { margin-top: -40px; }

/* page à faire défiler, ouverte seule sur un grand écran : une colonne de téléphone centrée */
body.live { background: #0d0c0a; }
.live .scr { max-width: 480px; margin: 0 auto; }
.live .barre6 { left: max(0px, calc(50% - 240px)); right: max(0px, calc(50% - 240px)); }

/* photo du duo : le cadre suit la photo (4:5), rien n'est rogné en haut, les têtes restent entières */
.fondu6.h-chef { height: auto; aspect-ratio: 4 / 5; }
.fondu6.h-chef img { object-position: 50% 0%; }

/* ===== page de retour après réservation ===== */
.hero-r { position: relative; height: 420px; flex: none; }
.hero-r::after { content: ""; position: absolute; inset: 0; background: linear-gradient(rgba(12,10,8,.45) 0, rgba(12,10,8,0) 25%, rgba(22,19,15,.7) 65%, var(--nuit) 100%); }
.hero-r .sur-photo { position: absolute; z-index: 1; left: 20px; right: 20px; bottom: 20px; display: flex; flex-direction: column; gap: 12px; }
.hero-r h1 { font: 400 34px/1.1 var(--titre); letter-spacing: -.025em; color: var(--creme); text-wrap: balance; }
.corps-r { display: flex; flex-direction: column; gap: 36px; padding: 24px 20px 0; }
.recap-r { display: flex; flex-direction: column; gap: 14px; padding: 20px; border-radius: 18px; background: var(--nuit-2); }
.lignes-r { display: flex; flex-direction: column; gap: 12px; }
.lignes-r div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; }
.lignes-r span { font: 400 16px/1.3 var(--texte); color: var(--creme-2); }
.lignes-r b { font: 500 19px/1.25 var(--texte); color: var(--creme); text-align: right; }
.thefork-r { font: 400 17px/1.55 var(--texte); color: var(--creme-2); }
.venir-r, .contact-r { display: flex; flex-direction: column; gap: 12px; }
.venir-r .liens7 { margin-top: 2px; }
.btn.q6.wa-r { border: 1.5px solid rgba(244,238,228,.6); padding: 0 20px 0 14px; align-self: flex-start; min-height: 50px; font-size: 16px; }
.tel-r { font: 400 16px/1.4 var(--texte); color: var(--creme-2); }
.tel-r b { color: var(--creme); font-weight: 500; }
.menu-r { font: 500 17px/1.3 var(--texte); color: var(--creme); text-decoration: underline; text-underline-offset: 4px; text-decoration-color: rgba(244,238,228,.45); }

.d .retour-d { flex: 1; display: grid; grid-template-columns: 1fr 640px; min-height: 0; }
.d .photo-rd { position: relative; overflow: hidden; }
.d .photo-rd img { position: absolute; inset: 0; object-position: 50% 55%; }
.d .col-rd { padding: 120px 72px 48px 64px; display: flex; flex-direction: column; gap: 24px; justify-content: center; }
.d .col-rd h1 { font: 400 46px/1.06 var(--titre); letter-spacing: -.03em; color: var(--creme); text-wrap: balance; }
.d .deux-rd { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; margin-top: 8px; }
.d .tete { background: linear-gradient(rgba(10,9,7,.7), rgba(10,9,7,0)); }

/* ===== site en ligne ===== */
body { background: #0d0c0a; }
.live .onglets8 { top: env(safe-area-inset-top, 0px); }
.live .barre6 { padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px)); }
.pied5 a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
a:focus-visible, button:focus-visible { outline: 2px solid var(--creme); outline-offset: 3px; }
[hidden] { display: none !important; }

/* accord cookies : posé en bas, deux choix de même poids */
.accord { position: fixed; z-index: 20; left: max(0px, calc(50% - 240px)); right: max(0px, calc(50% - 240px)); bottom: 0;
  padding: 18px 20px calc(18px + env(safe-area-inset-bottom, 0px)); background: var(--nuit-2); border-top: 1px solid var(--trait-nuit);
  display: flex; flex-direction: column; gap: 14px; box-shadow: 0 -10px 30px rgba(0,0,0,.35); }
.accord p { margin: 0; font: 400 15px/1.5 var(--texte); color: var(--creme-2); }
.accord a { color: var(--creme); text-decoration: underline; text-underline-offset: 3px; }
.accord-boutons { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.accord button { min-height: 48px; border-radius: 999px; font: 600 16px/1 var(--texte); cursor: pointer;
  border: 1.5px solid rgba(244,238,228,.6); background: transparent; color: var(--creme); }

/* page entreprises : le devis avant les menus */
.entreprise-r { display: flex; flex-direction: column; gap: 12px; padding: 48px 20px 52px; }
.entreprise-r h2 { margin: 0; font: 400 30px/1.12 var(--titre); letter-spacing: -.025em; color: var(--creme); text-wrap: balance; }
.entreprise-r p { margin: 0; font: 400 17px/1.55 var(--texte); color: var(--creme-2); }
.entreprise-r .points-r { list-style: disc; margin: 4px 0 0; padding-left: 20px; display: flex; flex-direction: column; gap: 8px; font: 400 17px/1.5 var(--texte); color: var(--creme-2); }
.entreprise-r .points-r li::marker { color: var(--brique); }
.entreprise-r .deux-boutons-r { display: grid; grid-template-columns: 1fr; gap: 10px; margin-top: 10px; }
.entreprise-r .deux-boutons-r .btn { width: 100%; }

/* ===== ordinateur (à partir de 900 px) : même contenu, mise en page large ===== */
.nav-d, .tete-res { display: none; }
@media (min-width: 900px) {
  body.live { background: var(--nuit); }
  .live .scr { max-width: none; margin: 0; }
  .live .tete { height: 84px; padding: 0 max(48px, calc(50% - 600px)); gap: 32px;
    background: linear-gradient(rgba(10,9,7,.7), rgba(10,9,7,0)); }
  .live .tete .marque { font-size: 24px; margin-right: auto; }
  .nav-d { display: flex; gap: 30px; font: 500 16px/1 var(--texte); }
  .nav-d a { color: var(--creme); }
  .nav-d a:hover, .live .tete .question-wa:hover span { text-decoration: underline; text-underline-offset: 5px; }
  .tete-res { display: inline-flex; min-height: 46px; padding: 0 22px; font-size: 16px; }
  .live .tete .question-wa { font-size: 16px; }

  .live .hero { height: min(86vh, 880px); min-height: 600px; }
  .live .hero picture, .live .hero img { position: absolute; inset: 0; width: 100%; height: 100%; }
  .live .hero img { object-position: 50% 60%; }
  .live .hero .sur-photo { left: max(48px, calc(50% - 600px)); right: auto; bottom: 64px; max-width: 760px; gap: 16px; }
  .live .hero h1 { font-size: 64px; line-height: 1.02; }
  .live .hero .faits { font-size: 18px; }
  .live .actions6 { max-width: none; margin: 0; padding: 28px max(48px, calc(50% - 600px)) 64px; }
  .live .actions6 .btn { width: auto; padding: 0 40px; min-height: 56px; font-size: 17px; }

  /* menus : la carte au centre, large et lisible */
  .live .menus8 { padding: 88px 0; }
  .live .menus8 .tete6 h2 { font-size: 46px; max-width: none; }
  .live .zone8 { width: min(760px, calc(100% - 96px)); margin: 36px auto 0; }
  .live .panneau8 { padding: 44px 40px 0; }
  .live .carte3 .temps3 { max-width: 520px; }

  /* entreprises */
  .live .entreprise-r { max-width: none; margin: 0; padding: 40px max(48px, calc(50% - 600px)) 88px; }
  .live .entreprise-r > * { max-width: 720px; }
  .live .entreprise-r h2 { font-size: 40px; }
  .live .entreprise-r .deux-boutons-r { grid-template-columns: auto auto; justify-content: start; }
  .live .entreprise-r .deux-boutons-r .btn { padding: 0 36px; }

  /* le chef : photo à gauche, parcours à droite */
  .live .chef8 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 64px; align-items: start;
    max-width: 1200px; margin: 0 auto; padding: 96px 48px 0; }
  .live .chef8 > .duo11 { grid-column: 1; grid-row: 1 / span 4; }
  .live .chef8 > :not(.duo11) { grid-column: 2; }
  .live .chef8 .fondu6.h-chef { -webkit-mask-image: none; mask-image: none; border-radius: 18px; }
  .live .chef8 .nom11 { bottom: 24px; }
  .live .chef8 .txt6, .live .chef8 .parcours9 { padding-left: 0; padding-right: 0; margin-left: 0; margin-right: 0; }
  .live .chef8 .txt6.sur-fondu { margin-top: 0; }
  .live .chef8 .parcours9 { padding: 26px 28px; }
  .live .txt6 h2 { font-size: 40px; }

  /* galeries : toutes les photos visibles d'un coup, sans défilement */
  .live .cuisine8, .live .lieu8 { max-width: 1200px; margin: 0 auto; padding: 96px 48px 0; }
  .live .cuisine8 .txt6, .live .lieu8 .txt6 { padding: 0; max-width: 720px; }
  .live .rail8 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; overflow: visible; padding: 0; }
  .live .lieu8 .rail8 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .live .rail8 figure { flex: none; min-width: 0; }
  .live .points8, .live .bas9 { display: none; }

  /* la fin : l'allée en large, les infos sur deux colonnes */
  .live .fin6 { margin-top: 96px; }
  .live .fond6 { height: 720px; }
  .live .fond6 img { object-position: 50% 60%; }
  .live .in6 { max-width: 1200px; margin: 0 auto; padding: 380px 48px 0; display: grid; grid-template-columns: 1fr 1fr; column-gap: 64px; row-gap: 20px; align-items: start; }
  .live .in6 h2 { grid-column: 1 / -1; font-size: 52px; }
  .live .in6 .liens7 { max-width: 420px; }
  .live .pied5 { padding-bottom: 120px; }

  /* les blocs prennent toute la largeur prévue (sinon ils se rétrécissent à leur contenu dans la colonne flexible) */
  .live .chef8, .live .cuisine8, .live .lieu8, .live .in6, .live .entreprise-r, .live .menus8 { width: 100%; box-sizing: border-box; align-self: stretch; }
  .live .zone8 { box-sizing: border-box; }
  /* le bouton « Réserver » dans la grande photo, sous le titre */
  .live .hero .sur-photo { bottom: 150px; }
  .live .actions6 { position: relative; z-index: 2; margin-top: -122px; padding-bottom: 72px; }
  /* photos : des formats réguliers, jamais minuscules */
  .live .rail8 { gap: 16px; }
  .live .lieu8 .ph8 { aspect-ratio: 4 / 4.6; }

  /* barre du bas : une capsule centrée */
  .live .barre6 { left: calc(50% - 300px); right: calc(50% - 300px); bottom: 20px; border-radius: 999px; border: 1px solid var(--trait-nuit);
    padding: 10px 12px; box-shadow: 0 12px 40px rgba(0,0,0,.45); }

  /* retour de réservation et confidentialité */
  .live .hero-r { height: 520px; }
  .live .hero-r img { object-position: 50% 60%; }
  .live .hero-r .sur-photo, .live .corps-r, .texte-legal { max-width: 760px; margin-left: auto; margin-right: auto; }
  .live .hero-r .sur-photo { left: 0; right: 0; padding: 0 48px; }
  .live .hero-r h1 { font-size: 52px; }
  .live .corps-r { padding: 32px 48px 0; }
  .texte-legal { padding: 120px 48px 48px; }
  .accord { left: calc(50% - 300px); right: calc(50% - 300px); bottom: 20px; border-radius: 18px; border: 1px solid var(--trait-nuit); }
}

/* page confidentialité */
.texte-legal { padding: 48px 20px 24px; display: flex; flex-direction: column; gap: 14px; }
.texte-legal h1 { font: 400 36px/1.1 var(--titre); letter-spacing: -.025em; color: var(--creme); margin: 0 0 8px; }
.texte-legal h2 { font: 500 19px/1.3 var(--texte); color: var(--creme); margin: 18px 0 0; }
.texte-legal p { margin: 0; font: 400 17px/1.6 var(--texte); color: var(--creme-2); }
.texte-legal .sur a { color: inherit; text-decoration: none; }