.vg-added{white-space:normal;scroll-margin-top:110px}.vg-welcome{padding:100px 0;background:var(--cream)}.vg-editorial-grid{display:grid;grid-template-columns:1fr 390px;align-items:center;gap:95px}.vg-editorial .h-2{font-size:clamp(48px,5.5vw,78px);color:var(--navy);margin:25px 0}.vg-editorial p{max-width:470px;color:var(--muted);line-height:1.85}.vg-editorial .portes-sur{color:var(--gold-dk)}.vg-editorial .vg-intro{font-size:21px;line-height:1.7}.vg-editorial .btn{margin:22px 0 40px}.vg-chapter{display:block;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-dk)}.vg-film{position:relative;aspect-ratio:9/16;background:var(--navy);border-radius:15px;overflow:hidden;box-shadow:0 18px 55px #16152e20}.vg-film video{width:100%;height:100%;object-fit:contain;display:block}.vg-film-control{position:absolute;right:18px;bottom:18px;z-index:2;background:#16152eb0;color:#fff;border:1px solid #ffffff88;border-radius:24px;padding:9px 16px;font:13px var(--sans);cursor:pointer;backdrop-filter:blur(8px)}.vg-food{background:var(--navy);color:var(--cream);padding:100px 0}.vg-food .vg-editorial-grid{grid-template-columns:390px 1fr}.vg-food .h-2{color:var(--cream)}.vg-food .vg-editorial p{color:var(--sand)}.vg-food .portes-sur,.vg-food .vg-chapter{color:var(--gold-lt)}
@media(max-width:900px){.vg-editorial-grid{grid-template-columns:1fr 340px;gap:35px}.vg-food .vg-editorial-grid{grid-template-columns:340px 1fr}.vg-editorial .vg-intro{font-size:18px}}
@media(max-width:650px){.vg-welcome,.vg-food{padding:58px 0}.vg-editorial-grid,.vg-food .vg-editorial-grid{grid-template-columns:1fr;gap:30px}.vg-editorial .h-2{font-size:54px}.vg-editorial .btn{margin-bottom:24px}.vg-film{width:100%;max-width:390px;margin:auto}.vg-food .vg-editorial{grid-row:1}}

/* ══════════════════════════════════════════════════════════════════════════
   RETOURS DE CAMERON, 21/09/2026, sur iPhone. Quatre points.
   ══════════════════════════════════════════════════════════════════════════ */

/* 1. LE TROU SOUS LA PREMIÈRE VIDÉO.
   58 px sous la section d'accueil + 84 px au-dessus de « Par où commencer ? »
   faisaient 142 px — et les deux sections sont du MÊME crème, donc rien ne
   marquait la coupure : ça se lisait comme un oubli, pas comme une
   respiration. On ramène le total à 56 px, exactement la valeur de la
   jointure suivante, pour que le rythme de la page reste régulier.

   Le sélecteur de voisinage ne touche QUE la section qui suit la nôtre : les
   espacements du reste du site ne bougent pas d'un pixel. C'est aussi pour ça
   que tout tient dans CE fichier, sans jamais modifier site.css. */
.vg-welcome { padding-bottom: 0; }
.vg-welcome + * { padding-top: 56px; }

/* 2. LE BOUTON DE LA VIDÉO OUVRE LE PLEIN ÉCRAN, il ne met plus en pause.
   La vidéo démarre et s'arrête toute seule selon qu'on la voit ou non : un
   bouton « Lire / Pause » doublait une décision déjà prise. Le seul geste qui
   manquait, c'était de la regarder en grand — et là, les commandes natives du
   téléphone prennent le relais pour le son et la pause. */
.vg-film-control { padding: 10px 13px; font-size: 16px; line-height: 1; }

/* 3. LA BARRE « RÉSERVER UNE TABLE » DU BAS.
   L'en-tête est collant et son bouton RÉSERVER reste visible pendant tout le
   défilement — vérifié à 390 px. La barre faisait donc doublon, juste
   au-dessus du bouton de l'assistant. On la retire et on rend au corps de page
   les 78 px que le site réservait pour elle.

   ⚠️ Ce fichier n'est chargé que sur l'accueil : les autres pages gardent leur
   barre. C'est volontaire — elles n'ont pas été examinées. */
.resa-bar { display: none !important; }
body.has-resa-bar { padding-bottom: 0 !important; }

/* 4. LE VOILE PENDANT QUE ZENCHEF CHARGE.
   L'iframe de réservation est vide tant qu'on n'a pas cliqué : elle ne se
   remplit qu'à l'ouverture. Entre les deux, le client regardait un rectangle
   blanc pendant une à deux secondes — juste après avoir décidé de réserver,
   c'est-à-dire au pire moment possible. Le voile met la maison à cet
   endroit-là, et s'efface dès que Zenchef répond. */
#vg-resa-modal .modal-body { position: relative; }
.vg-resa-voile {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 18px;
  background: var(--navy, #16152E);
  color: var(--cream, #FBF9F4);
  text-align: center;
}
.vg-resa-voile[hidden] { display: none; }
.vg-resa-voile img { width: 74px; height: 74px; opacity: .95; }
.vg-resa-voile span {
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--gold-lt, #E0BF71);
}
.vg-resa-voile i {
  display: block;
  width: 26px; height: 26px;
  border: 2px solid var(--gold, #C9A24B);
  border-right-color: transparent;
  border-radius: 50%;
  animation: vgResaTourne .8s linear infinite;
}
@keyframes vgResaTourne { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .vg-resa-voile i { animation: vgResaBat 1.4s ease-in-out infinite; }
  @keyframes vgResaBat { 0%,100% { opacity:.3 } 50% { opacity:.95 } }
}