/*
Theme Name: Le Bar'Ouf
Theme URI: https://lebarouf76.fr/
Author: DevWebPro
Author URI: https://devwebpro.fr/
Description: Thème one-page ultra léger pour Le Bar'Ouf — Bar à ambiance musicale à Rouen. Aucune dépendance, aucun framework, aucune police externe.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: lebarouf
*/

/* ==========================================================
   1. Polices auto-hébergées & variables
   ========================================================== */
@font-face{
  font-family:'Montserrat';font-style:normal;font-weight:400;font-display:swap;
  src:url('assets/fonts/montserrat-v31-latin-regular.woff2') format('woff2');
}
@font-face{
  font-family:'Montserrat';font-style:normal;font-weight:500;font-display:swap;
  src:url('assets/fonts/montserrat-v31-latin-500.woff2') format('woff2');
}
:root{
  --noir:       #0f0f0f;
  --noir-2:     #161616;
  --brun:       #160b00;
  --peche:      #ffcf9a;   /* accent principal (boutons, formulaire) */
  --creme:      #ffebb7;   /* titres du héros */
  --sable:      #ffebd6;
  --blanc:      #ffffff;
  --gris:       #cfcfcf;   /* texte courant sur fond sombre (contraste AA) */
  --ombre:      0 10px 30px rgba(0,0,0,.55);
  --rayon:      8px;
  --largeur:    1600px;
  --titres: 'Montserrat',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --sans: 'Montserrat',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{overflow-x:clip}
/* En-tête collant : les ancres s'arrêtent sous lui. */
main [id],#contenu{scroll-margin-top:160px}
@media (max-width:1200px){
  main [id],#contenu{scroll-margin-top:160px}
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}
body{
  margin:0;
  font-family:var(--sans);
  font-weight:400;
  font-size:18px;
  line-height:1.7;
  color:var(--gris);
  background:var(--noir);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4{line-height:1.2;margin:0 0 .6em;color:var(--blanc)}

.conteneur{max-width:var(--largeur);margin:0 auto;padding:0 24px}
.section{padding:64px 0}
.section--noir{background:var(--noir)}
.section--noir2{background:var(--noir-2)}

/* Titres de sections : Montserrat 500, capitales, soulignées d'un trait pêche */
.titre-section{
  font-family:var(--titres);
  text-align:center;
  text-transform:uppercase;
  letter-spacing:2px;
  font-weight:500;
  font-size:50px;
  color:var(--blanc);
  text-shadow:0em 0em 0.2em #FFFFFF;
  margin-bottom:1.6em;
  position:relative;
  padding-bottom:.45em;
}
.titre-section::after{
  content:'';position:absolute;left:50%;bottom:0;transform:translateX(-50%);
  width:86px;height:2px;background:var(--blanc);opacity:.85;
}
.surtitre{
  display:block;text-align:center;
  font-size:14px;font-weight:500;letter-spacing:3px;text-transform:uppercase;
  color:var(--peche);margin-bottom:14px;
}

.bouton{
  display:inline-block;
  background:var(--peche);
  color:var(--brun);
  border:0;
  border-radius:4px;
  padding:.8em 1.7em;
  font-family:var(--sans);
  font-size:15px;
  font-weight:500;
  letter-spacing:.14em;
  text-transform:uppercase;
  text-decoration:none;
  cursor:pointer;
  transition:transform .15s ease, filter .15s ease;
}
.bouton:hover{filter:brightness(1.06);transform:translateY(-1px)}
.bouton--sombre{background:var(--brun);color:var(--peche)}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{
  outline:3px solid var(--peche);outline-offset:2px;
}

/* Lien d'évitement (visible uniquement au focus clavier) */
.evitement{
  position:absolute;left:-9999px;top:0;z-index:300;
  background:var(--peche);color:var(--brun);
  padding:.9em 1.4em;text-decoration:none;font-weight:500;
}
.evitement:focus{left:0}

.visually-hidden{
  position:absolute!important;width:1px;height:1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;
}

/* ==========================================================
   2. En-tête
   ========================================================== */
.entete{
  position:sticky;top:0;z-index:50;
  background:rgba(10,10,10,.92);
  backdrop-filter:blur(6px);
  box-shadow:0 2px 14px rgba(0,0,0,.6);
}
.entete__int{
  display:flex;align-items:center;justify-content:space-between;
  gap:24px;padding-top:0;padding-bottom:0;
}
.entete__logo img{width:200px;height:auto;display:block}
.nav{display:flex;gap:26px;flex-wrap:wrap}
.nav a{
  text-decoration:none;font-size:19px;font-weight:500;
  letter-spacing:1px;text-transform:uppercase;color:var(--blanc);
  padding:6px 2px;border-bottom:2px solid transparent;
  transition:color .15s ease,border-color .15s ease;
}
.nav a:hover{color:var(--peche);border-color:var(--peche)}
/* ---- Bouton burger « verre à cocktail » ----
   Trois barres en largeurs décroissantes (silhouette de verre à pied vue
   de face) + une olive dorée. À l'ouverture, les barres haute et basse
   se rejoignent en croix et l'olive s'éclipse. */
.burger{
  display:none;position:relative;
  width:48px;height:48px;padding:0;
  background:none;border:0;cursor:pointer;
}
.burger__barre{
  position:absolute;left:50%;height:3px;border-radius:3px;
  background:linear-gradient(90deg,var(--or-clair),var(--peche));
  transform:translateX(-50%);
  transition:
    transform .38s cubic-bezier(.68,-.4,.27,1.35),
    top .38s cubic-bezier(.68,-.4,.27,1.35),
    width .3s ease,opacity .22s ease;
}
.burger__barre--1{top:15px;width:32px}
.burger__barre--2{top:23px;width:21px}
.burger__barre--3{top:31px;width:10px}
.burger__olive{
  position:absolute;top:10px;right:5px;
  width:6px;height:6px;border-radius:50%;
  background:var(--or-clair);
  box-shadow:0 0 6px rgba(247,224,163,.8);
  transition:transform .3s ease,opacity .22s ease;
}
@media (hover:hover){
  .burger:hover .burger__barre--2{width:27px}
  .burger:hover .burger__barre--3{width:18px}
  .burger:hover .burger__olive{transform:translateY(2px)}
}
.burger[aria-expanded="true"] .burger__barre--1{top:23px;width:30px;transform:translateX(-50%) rotate(45deg)}
.burger[aria-expanded="true"] .burger__barre--2{width:0;opacity:0}
.burger[aria-expanded="true"] .burger__barre--3{top:23px;width:30px;transform:translateX(-50%) rotate(-45deg)}
.burger[aria-expanded="true"] .burger__olive{transform:scale(0);opacity:0}
.burger:focus-visible{outline:3px solid var(--peche);outline-offset:3px;border-radius:8px}

/* Pied du panneau mobile : masqué en version ordinateur */
.nav__extra{display:none}

@media (max-width:1000px){
  .entete{z-index:100}
  .burger{position:relative;z-index:95}
  .entete__logo{position:relative;z-index:95}
  .entete__logo img{width:120px}
  main [id],#contenu{scroll-margin-top:97px}
  .burger{display:block}

  /* ---- Panneau plein écran ---- */
  .nav{
    position:fixed;inset:0;z-index:90;
    display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
    flex-wrap:nowrap;               /* neutralise le wrap hérité du mode ordinateur */
    overflow-y:auto;                /* défilement si l'écran est court */
    -webkit-overflow-scrolling:touch;
    gap:4px;padding:116px 24px 40px;
    background:
      radial-gradient(120% 65% at 50% 0%, rgba(255,207,154,.10), transparent 60%),
      linear-gradient(#0c0c0c,#050505);
    opacity:0;visibility:hidden;
    transition:opacity .35s ease,visibility 0s linear .35s;
    counter-reset:lien;
  }
  .nav::before{
    content:'';position:absolute;top:0;left:0;right:0;height:3px;
    background:linear-gradient(90deg,transparent,var(--or-clair) 30%,var(--peche) 70%,transparent);
  }
  .nav.ouvert{opacity:1;visibility:visible;transition:opacity .35s ease}

  /* Liens : numérotés, en cascade, trait pêche qui s'étire */
  .nav > a:first-of-type{margin-top:auto}
  .nav .nav__extra{margin-bottom:auto}
  .nav > a{
    position:relative;
    font-size:23px;letter-spacing:3px;padding:13px 6px;
    border-bottom:0;text-align:center;
    opacity:0;transform:translateY(16px);
    transition:opacity .4s ease,transform .4s ease,color .15s ease;
  }
  .nav > a::before{
    counter-increment:lien;
    content:"0" counter(lien);
    display:block;
    font-size:11px;letter-spacing:5px;
    color:var(--or-clair);opacity:.85;
    margin-bottom:2px;
  }
  .nav > a::after{
    content:'';position:absolute;left:50%;bottom:6px;
    width:30px;height:2px;background:var(--peche);
    transform:translateX(-50%) scaleX(0);
    transition:transform .25s ease;
  }
  .nav > a:hover::after,.nav > a:focus-visible::after{transform:translateX(-50%) scaleX(1)}
  .nav.ouvert > a{opacity:1;transform:none}
  .nav.ouvert > a:nth-of-type(1){transition-delay:.06s}
  .nav.ouvert > a:nth-of-type(2){transition-delay:.12s}
  .nav.ouvert > a:nth-of-type(3){transition-delay:.18s}
  .nav.ouvert > a:nth-of-type(4){transition-delay:.24s}
  .nav.ouvert > a:nth-of-type(5){transition-delay:.3s}

  /* Pied du panneau : slogan + réseaux */
  .nav__extra{
    display:flex;flex-direction:column;align-items:center;gap:18px;
    margin-top:30px;
    opacity:0;transform:translateY(16px);
    transition:opacity .4s ease .38s,transform .4s ease .38s;
  }
  .nav.ouvert .nav__extra{opacity:1;transform:none}
  .nav__slogan{
    margin:0;color:var(--creme);
    font-size:12px;font-weight:500;
    letter-spacing:.32em;text-transform:uppercase;
  }
}

/* ==========================================================
   3. Héros
   ========================================================== */
.heros{
  position:relative;
  min-height:min(88vh,860px);
  display:flex;align-items:center;justify-content:center;
  text-align:center;
  background:var(--noir);
  isolation:isolate;
  padding:9vw 24px;
}
.heros__fond{
  position:absolute;inset:0;z-index:-2;
  width:100%;height:100%;object-fit:cover;
}
/* Léger dégradé sombre, uniquement derrière le logo et le slogan,
   pour garder le texte lisible sans ternir la photo */
.heros::after{
  content:'';position:absolute;inset:0;z-index:-1;
  background:linear-gradient(rgba(0,0,0,.28), rgba(0,0,0,.14) 55%, rgba(0,0,0,.32));
}
.heros__logo{width:min(340px,60vw);margin:0 auto 26px;filter:drop-shadow(0 6px 20px rgba(0,0,0,.6))}
.heros h1{
  font-family:var(--sans);
  font-weight:500;
  letter-spacing:1px;
  text-transform:uppercase;
  font-size:25px;
  color:var(--creme);
  text-shadow:0 2px 10px rgba(0,0,0,.7);
  margin:0;
}
@media (max-width:1000px){
  .titre-section{font-size:32px}
}
@media (max-width:480px){
  .heros h1{font-size:19px}
}

/* ==========================================================
   4. Carrousel d'affiches (Évènements à suivre)
   ========================================================== */
.affiches{position:relative;max-width:var(--largeur);margin:0 auto;padding:10px 0 26px;overflow:hidden}
.affiches__scene{
  position:relative;
  display:flex;align-items:center;justify-content:center;
  min-height:660px;
  perspective:1200px;
}
.affiches__scene img{
  position:absolute;
  width:min(430px,72vw);
  border-radius:var(--rayon);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:var(--ombre);
  cursor:pointer;
  opacity:0;
  pointer-events:none;
  transition:transform .45s ease,opacity .45s ease;
  transform:translateX(0) scale(.7);
}
.affiches__scene img.actif{
  position:relative;
  opacity:1;pointer-events:auto;z-index:3;
  transform:translateX(0) scale(1);
}
.affiches__scene img.prec,
.affiches__scene img.suiv{
  opacity:.55;pointer-events:auto;z-index:2;
}
.affiches__scene img.prec{transform:translateX(-105%) scale(.82) rotateY(28deg)}
.affiches__scene img.suiv{transform:translateX(105%) scale(.82) rotateY(-28deg)}
@media (max-width:760px){
  .affiches__scene{min-height:0}
  .affiches__scene img.prec,.affiches__scene img.suiv{
    opacity:0;pointer-events:none;
    transform:translateX(-50%) scale(.8);
  }
}
.affiches__nav{
  position:absolute;top:50%;transform:translateY(-50%);z-index:5;
  width:44px;height:44px;border-radius:50%;border:0;cursor:pointer;
  background:var(--blanc);color:#2B2B2B;font-size:18px;line-height:1;
  box-shadow:0 4px 14px rgba(0,0,0,.5);
}
.affiches__nav:hover{background:var(--peche)}
.affiches__nav--prec{left:-4px}
.affiches__nav--suiv{right:-4px}
.affiches__points{display:flex;justify-content:center;gap:10px;margin-top:26px}
.affiches__points button{
  position:relative;width:26px;height:26px;border-radius:50%;border:0;
  cursor:pointer;padding:0;background:transparent;
}
.affiches__points button::after{
  content:'';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:11px;height:11px;border-radius:50%;
  background:rgba(255,255,255,.55);
}
.affiches__points button.actif::after{background:var(--blanc)}

/* ==========================================================
   5. Galerie photos (maçonnerie CSS)
   ========================================================== */
.galerie{columns:3 320px;column-gap:14px}
.galerie__item{
  position:relative;overflow:hidden;
  margin:0 0 14px;border-radius:4px;
  box-shadow:0 1px 21px -1px rgba(0,0,0,.5);
  break-inside:avoid;
}
.galerie img{
  width:100%;margin:0;border-radius:4px;
  cursor:pointer;display:block;
  transition:transform .3s ease;
}
/* Légende en surimpression : voile dégradé + texte, révélés au survol
   ou au focus clavier ; toujours visibles sur écran tactile */
.galerie__legende{
  position:absolute;left:0;right:0;bottom:0;
  padding:44px 16px 14px;
  background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.78) 100%);
  color:var(--blanc);
  font-size:14px;font-weight:500;
  letter-spacing:1px;text-transform:uppercase;
  pointer-events:none;
  opacity:0;transform:translateY(8px);
  transition:opacity .25s ease,transform .25s ease;
}
.galerie__item:hover .galerie__legende,
.galerie__item:focus-within .galerie__legende{
  opacity:1;transform:none;
}
.galerie__item:hover img{transform:scale(1.04)}
@media (hover:none){
  .galerie__legende{opacity:1;transform:none}
}
@media (prefers-reduced-motion: reduce){
  .galerie img,.galerie__legende{transition:none}
  .galerie__item:hover img{transform:none}
}
@media (max-width:900px){.galerie{columns:2 240px}}
@media (max-width:560px){.galerie{columns:1 auto}}

/* ==========================================================
   6. Avis (Trustindex) — la section n'apparaît que si le plugin est actif
   ========================================================== */
.avis-conteneur{max-width:1100px;margin:0 auto}

/* ==========================================================
   7. Le Bar (#carte)
   ========================================================== */
.lebar{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center;max-width:1100px;margin:0 auto}
.lebar__texte h2{
  font-family:var(--titres);font-size:50px;text-shadow:0em 0em 0.2em #FFFFFF;
  text-transform:uppercase;letter-spacing:2px;
  font-weight:500;color:var(--blanc);
}
.lebar__image{position:relative;justify-self:center}
.lebar__image img{
  width:min(380px,100%);border:1px solid var(--peche);
  border-radius:2px;padding:0;box-shadow:var(--ombre);
}
@media (max-width:900px){
  .lebar{grid-template-columns:1fr;gap:36px}
}

/* ==========================================================
   8. Privatisation (CTA)
   ========================================================== */
.privatisation{
  position:relative;isolation:isolate;
  padding:9vw 24px;
  background:var(--noir);
}
.privatisation__fond{
  position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;
}
.privatisation::after{
  content:'';position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,#000000 0%,rgba(22,11,0,.35) 100%);
}
.privatisation__carte{
  max-width:520px;margin:0 auto;text-align:center;
  border:1px solid var(--peche);border-radius:2px;
  padding:44px 34px;
  background:rgba(10,6,0,.55);
  backdrop-filter:blur(2px);
}
.privatisation__carte h2{
  font-family:var(--titres);font-size:50px;text-shadow:0em 0em 0.2em #FFFFFF;
  text-transform:uppercase;letter-spacing:2px;
  font-weight:500;color:var(--blanc);
}
/* Mobile : mêmes 32px que les titres de sections. Cette règle doit rester
   APRÈS les règles de base de .lebar__texte h2 et .privatisation__carte h2,
   sinon leurs 50px reprennent le dessus (même sélecteur = le dernier gagne). */
@media (max-width:1000px){
  .lebar__texte h2,.privatisation__carte h2{font-size:32px}
}
.privatisation__carte p{color:var(--sable)}
.privatisation__carte .bouton{margin-top:14px}

/* ==========================================================
   9. Contact
   ========================================================== */
.contact__blocs{
  max-width:560px;margin:0 auto 34px;
  display:grid;gap:22px;text-align:center;
}
/* Comme la maquette : intitulé blanc, valeur pêche,
   fine ligne de séparation sous chaque bloc */
.contact__bloc{
  border-bottom:1px solid rgba(255,255,255,.22);
  padding-bottom:22px;
}
.contact__bloc h3{
  font-size:18px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;
  color:var(--blanc);margin-bottom:4px;
}
@media (max-width:640px){
  .contact__bloc h3{font-size:14px}
}
.contact__bloc p{margin:0;color:var(--peche);font-size:17px}
.contact__bloc a{text-decoration:none;color:var(--peche)}
.contact__bloc a:hover{color:var(--blanc)}
.sociaux{display:flex;justify-content:center;gap:16px;margin:8px 0 0}
.sociaux a{
  width:46px;height:46px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--peche);color:var(--brun);
  transition:transform .15s ease,filter .15s ease;
}
.sociaux a:hover{transform:translateY(-2px);filter:brightness(1.06)}
.sociaux svg{width:22px;height:22px;fill:currentColor}

.carte-map{margin-top:44px}
.carte-map iframe{display:block;width:100%;border:0}
/* Encadré tarteaucitron avant consentement : lisible sur fond sombre */
.carte-map .tac_activate{min-height:340px}

/* ==========================================================
   10. Formulaire de réservation (#formulaire)
   ========================================================== */
.reservation{background:var(--noir-2);padding:64px 0}
.reservation__int{
  display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:center;
  max-width:1120px;margin:0 auto;
}
.reservation__marque{text-align:center}
.reservation__marque img{width:min(210px,50vw);margin:0 auto 18px}
.reservation__marque p{
  font-weight:500;letter-spacing:.28em;text-transform:uppercase;
  color:var(--creme);font-size:15px;
}
.formulaire{
  background:var(--peche);
  border-radius:2px;
  padding:36px 32px;
  color:var(--brun);
  box-shadow:var(--ombre);
}
.formulaire .champs{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.formulaire input,
.formulaire select,
.formulaire textarea{
  width:100%;
  font-family:var(--sans);font-size:14px;font-weight:500;
  letter-spacing:.08em;text-transform:uppercase;
  color:var(--brun);
  background:transparent;
  border:1px solid var(--brun);
  border-radius:2px;
  padding:.95em 1em;
}
.formulaire textarea{min-height:150px;resize:vertical;text-transform:none;letter-spacing:normal;font-weight:400;font-size:16px}
.formulaire ::placeholder{color:var(--brun);opacity:.85}
.formulaire select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--brun) 50%),linear-gradient(135deg,var(--brun) 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px;background-repeat:no-repeat}
.formulaire .champ--large{grid-column:1 / -1}
.formulaire .rgpd{font-size:13px;line-height:1.5;margin:18px 0;text-transform:none;letter-spacing:normal}
.formulaire .rgpd a{color:var(--brun);font-weight:500}
.formulaire .rgpd input{width:auto;margin-right:.5em}
.formulaire__pied{margin-top:6px}
.formulaire .bouton{background:var(--brun);color:var(--peche)}
.pot-de-miel{position:absolute;left:-9999px}
.notice{
  max-width:640px;margin:0 auto 26px;
  background:var(--noir-2);border-left:4px solid var(--peche);
  color:var(--blanc);padding:1em 1.3em;border-radius:4px;
}
@media (max-width:900px){
  .reservation__int{grid-template-columns:1fr}
  .formulaire .champs{grid-template-columns:1fr}
}
/* Habillage Contact Form 7 (si le plugin est actif) */
.formulaire .wpcf7-form p{margin:0}
.formulaire .wpcf7-not-valid-tip{color:#8c1d18;font-size:13px;text-transform:none;letter-spacing:normal}
.formulaire .wpcf7-response-output{
  border:0;border-left:4px solid var(--brun);background:rgba(22,11,0,.08);
  margin:18px 0 0;padding:.9em 1.1em;font-size:14px;text-transform:none;letter-spacing:normal;
}
.formulaire .wpcf7-spinner{display:block;margin:8px auto 0}
/* Règles d'état normalement fournies par la feuille CSS de CF7 (désactivée) :
   zone de réponse masquée tant qu'il n'y a rien à dire, et conteneur
   destiné aux lecteurs d'écran masqué visuellement */
.formulaire .wpcf7 form.init .wpcf7-response-output,
.formulaire .wpcf7 form.resetting .wpcf7-response-output,
.formulaire .wpcf7 form.submitting .wpcf7-response-output,
.formulaire .wpcf7-response-output:empty{display:none}
/* Garde-fous : neutralise les éléments à bordure par défaut du navigateur
   qui pourraient traîner dans le contenu d'un formulaire CF7 */
.formulaire hr{display:none}
.formulaire fieldset{border:0;padding:0;margin:0;min-width:0}
.formulaire iframe:not([src]){display:none}
.wpcf7 .screen-reader-response{
  position:absolute;overflow:hidden;clip:rect(1px,1px,1px,1px);
  clip-path:inset(50%);height:1px;width:1px;margin:0;padding:0;border:0;
  word-wrap:normal!important;
}

/* ==========================================================
   11. Partenaires & pied de page
   ========================================================== */
.partenaires{background:var(--noir);text-align:center}
.partenaires__logos{
  display:flex;justify-content:center;align-items:center;
  gap:min(9vw,110px);flex-wrap:wrap;margin-top:8px;
}
.partenaires__logos img{width:300px;height:auto}
@media (max-width:640px){
  .partenaires__logos img{width:200px}
}

.pied{background:var(--noir);border-top:1px solid rgba(255,255,255,.08)}
.pied__int{
  padding:34px 24px 20px;text-align:center;
  display:grid;gap:14px;justify-items:center;
}
.pied__int nav{display:flex;gap:10px 28px;flex-wrap:wrap;justify-content:center}
.pied__int nav a{
  font-size:13px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;
  color:var(--blanc);text-decoration:none;
}
.pied__int nav a:hover{color:var(--peche)}
.pied__nap{margin:0;font-size:14px;color:var(--gris)}
.pied__nap a{text-decoration:none}
.pied-credit{
  background:var(--noir);text-align:center;padding:4px 24px 26px;
}
.pied-credit__titre{
  margin:0 0 8px;font-size:12px;font-weight:500;letter-spacing:.18em;
  text-transform:uppercase;color:var(--gris);
}
.pied-credit__logo img{margin:0 auto;width:150px}
.mention-alcool{
  background:#000;color:var(--gris);
  text-align:center;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;
  padding:12px 20px;margin:0;
}

/* ==========================================================
   12. Lightbox
   ========================================================== */
.lightbox{
  position:fixed;inset:0;z-index:200;
  display:none;align-items:center;justify-content:center;
  background:rgba(0,0,0,.94);padding:30px;
}
.lightbox.ouverte{display:flex}
.lightbox figure{margin:0;max-width:min(1100px,92vw);text-align:center}
.lightbox img{max-width:100%;max-height:82vh;margin:0 auto;border-radius:4px}
.lightbox figcaption{color:var(--blanc);margin-top:12px;font-size:15px}
.lightbox button{
  position:absolute;background:rgba(255,255,255,.12);color:var(--blanc);
  border:0;border-radius:50%;width:48px;height:48px;font-size:20px;cursor:pointer;
}
.lightbox button:hover{background:var(--peche);color:var(--brun)}
.lightbox__fermer{top:22px;right:22px}
.lightbox__prec{left:22px;top:50%;transform:translateY(-50%)}
.lightbox__suiv{right:22px;top:50%;transform:translateY(-50%)}

/* ==========================================================
   13. Pages internes & 404
   ========================================================== */
.contenu-page{background:var(--noir);padding:64px 0;min-height:50vh}
.contenu-page h1{
  font-family:var(--titres);text-transform:uppercase;letter-spacing:1px;
  font-size:clamp(28px,3vw,40px);
}
.contenu-page a{color:var(--peche)}
.contenu-page h2,.contenu-page h3,.contenu-page h4{margin-top:1.4em}

.p404{
  min-height:70vh;display:flex;align-items:center;justify-content:center;
  text-align:center;background:var(--noir);padding:60px 24px;
}
.p404__chiffres{
  display:flex;align-items:center;justify-content:center;gap:6px;
  font-family:var(--titres);font-weight:500;font-size:clamp(90px,16vw,170px);
  color:var(--peche);margin:0 0 10px;line-height:1;
}
.p404__verre{width:clamp(74px,12vw,130px);height:auto}
.p404__verre path,.p404__verre line{stroke:var(--peche);stroke-width:5;fill:none;stroke-linecap:round}
.p404__olive{fill:var(--peche)}
.p404__titre{font-family:var(--titres);font-size:clamp(24px,3vw,34px)}
.p404__texte{color:var(--gris);max-width:460px;margin:0 auto 26px}

/* ==========================================================
   12 bis. Soin du responsive mobile
   ========================================================== */
@media (max-width:640px){
  .conteneur{padding:0 18px}
  .section,.reservation{padding:44px 0}
  .titre-section{margin-bottom:1.2em}
  .heros{padding:16vw 20px}
  .heros__logo{margin-bottom:18px}
  .lebar{gap:28px}
  .formulaire{padding:26px 18px}
  .affiches__nav{width:38px;height:38px;font-size:16px}
  .affiches__nav--prec{left:2px}
  .affiches__nav--suiv{right:2px}
  .sociaux a{width:52px;height:52px}
  .pied-credit__logo img{width:120px}
  .mention-alcool{font-size:11px;padding-left:18px;padding-right:18px}
}
/* Le panneau et le bouton restent sobres si l'utilisateur réduit les animations */
@media (prefers-reduced-motion: reduce){
  .burger__barre,.burger__olive,.nav,.nav a,.nav__extra{transition:none!important}
}

/* ==========================================================
   13. Tarteaucitron — bandeau et panneau cookies à la charte
   (surclasse la feuille par défaut chargée depuis /tarteaucitron/)
   Boutons dorés, cartes sombres liserées d'or.
   ========================================================== */
:root{
  --or:        #e6c368;
  --or-clair:  #f7e0a3;
  --or-fonce:  #c9a24a;
}
#tarteaucitronRoot *{
  font-family:var(--sans)!important;
  box-sizing:border-box!important;
}
/* Voile derrière la fenêtre */
#tarteaucitronRoot #tarteaucitronBack{
  background:#000!important;opacity:.8!important;
}

/* ---- Dessin commun des boutons : dorés ---- */
#tarteaucitronRoot #tarteaucitronAlertBig .tarteaucitronCTAButton,
#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronCloseAlert,
#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronPrivacyUrl,
#tarteaucitronRoot #tarteaucitron #tarteaucitronClosePanel,
#tarteaucitronRoot #tarteaucitron .tarteaucitronAllow,
#tarteaucitronRoot #tarteaucitron .tarteaucitronDeny,
#tarteaucitronRoot .tac_activate .tac_float .tarteaucitronAllow,
.tac_activate .tac_float .tarteaucitronAllow{
  background:linear-gradient(180deg,var(--or-clair) 0%,var(--or) 55%,var(--or-fonce) 100%)!important;
  color:var(--brun)!important;
  border:1px solid var(--or-fonce)!important;
  border-radius:4px!important;
  font-size:14px!important;
  font-weight:500!important;
  letter-spacing:.1em!important;
  text-transform:uppercase!important;
  padding:.78em 1.5em!important;
  cursor:pointer!important;
  box-shadow:0 3px 10px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.55)!important;
  transition:filter .15s ease, transform .15s ease!important;
}
#tarteaucitronRoot #tarteaucitronAlertBig .tarteaucitronCTAButton:hover,
#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronCloseAlert:hover,
#tarteaucitronRoot #tarteaucitron #tarteaucitronClosePanel:hover,
#tarteaucitronRoot #tarteaucitron .tarteaucitronAllow:hover,
#tarteaucitronRoot #tarteaucitron .tarteaucitronDeny:hover,
.tac_activate .tac_float .tarteaucitronAllow:hover{
  filter:brightness(1.08)!important;
  transform:translateY(-1px)!important;
}
#tarteaucitronRoot button:focus-visible{
  outline:3px solid var(--or-clair)!important;outline-offset:2px!important;
}

/* ---- Bandeau d'accueil (fenêtre centrale) ---- */
#tarteaucitronRoot #tarteaucitronAlertBig{
  background:#141414!important;
  border:1px solid var(--or)!important;
  border-top:4px solid var(--or)!important;
  border-radius:6px!important;
  box-shadow:0 30px 80px rgba(0,0,0,.7)!important;
  padding:38px 34px 32px!important;
}
#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronDisclaimerAlert{
  display:block!important;
  color:#eaeaea!important;
  font-size:15px!important;
  line-height:1.7!important;
  margin-bottom:18px!important;
}
#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronDisclaimerAlert strong,
#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronDisclaimerAlert b{
  display:block!important;
  color:var(--or-clair)!important;
  text-transform:uppercase!important;
  letter-spacing:2px!important;
  font-size:18px!important;
  margin-bottom:10px!important;
}
#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronPrivacyUrl{
  background:transparent!important;
  border:1px solid rgba(255,255,255,.35)!important;
  color:#eaeaea!important;
  box-shadow:none!important;
}
#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronPrivacyUrl:hover{
  border-color:var(--or)!important;color:var(--or-clair)!important;
}
#tarteaucitronRoot #tarteaucitronAlertBig .tarteaucitronCTAButton,
#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronCloseAlert{
  margin:8px 5px 0!important;
}

/* ---- Bandeau : corrections mobile ----
   - fenêtre défilable sur petit écran (jamais coupée)
   - liste « Nos partenaires » : blanche par défaut -> carte sombre
   - croix de fermeture à la charte
   - boutons empilés pleine largeur */
#tarteaucitronRoot #tarteaucitronAlertBig{
  max-height:88vh!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch;
}
/* La liste des partenaires et tout encart interne du bandeau : fond sombre
   (sélecteurs volontairement larges : les noms varient selon les versions) */
#tarteaucitronRoot #tarteaucitronAlertBig [id*="Partners"],
#tarteaucitronRoot #tarteaucitronAlertBig [class*="Partners"],
#tarteaucitronRoot #tarteaucitronAlertBig [id*="partners"],
#tarteaucitronRoot #tarteaucitronAlertBig [class*="partners"]{
  background:#0d0d0d!important;
  color:#eaeaea!important;
  border:1px solid rgba(230,195,104,.35)!important;
  border-radius:4px!important;
}
#tarteaucitronRoot #tarteaucitronAlertBig [id*="Partners"] *,
#tarteaucitronRoot #tarteaucitronAlertBig [class*="Partners"] *,
#tarteaucitronRoot #tarteaucitronAlertBig [id*="partners"] *,
#tarteaucitronRoot #tarteaucitronAlertBig [class*="partners"] *{
  background:transparent!important;
  color:#eaeaea!important;
}
/* Croix de fermeture */
#tarteaucitronRoot #tarteaucitronAlertBig .tarteaucitronCross,
#tarteaucitronRoot #tarteaucitronAlertBig span[id*="Cross"],
#tarteaucitronRoot #tarteaucitronAlertBig button[id*="Close"]:not(#tarteaucitronCloseAlert){
  color:var(--or-clair)!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  font-size:22px!important;
  line-height:1!important;
}
@media (max-width:640px){
  #tarteaucitronRoot #tarteaucitronAlertBig{
    padding:26px 18px 22px!important;
    /* Pleine largeur (moins une fine marge), quel que soit le mode de
       centrage de tarteaucitron : seule la largeur est forcée, le
       positionnement d'origine est conservé */
    width:calc(100vw - 20px)!important;
    max-width:calc(100vw - 20px)!important;
    box-sizing:border-box!important;
  }
  #tarteaucitronRoot #tarteaucitronAlertBig .tarteaucitronCTAButton,
  #tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronCloseAlert,
  #tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronPrivacyUrl{
    display:block!important;
    width:100%!important;
    margin:8px 0 0!important;
  }
}

/* ---- Panneau détaillé des services ---- */
#tarteaucitronRoot #tarteaucitron{
  background:transparent!important;
}
#tarteaucitronRoot #tarteaucitron #tarteaucitronServices{
  background:#141414!important;
  border:1px solid var(--or)!important;
  border-top:4px solid var(--or)!important;
  border-radius:6px!important;
  box-shadow:0 30px 80px rgba(0,0,0,.7)!important;
  overflow:hidden!important;
}
#tarteaucitronRoot #tarteaucitron #tarteaucitronClosePanel{
  position:absolute!important;
  top:0!important;
  right:0!important;
  width:auto!important;
  padding:.7em 1.3em!important;
  border-radius:0 6px 0 6px!important;
  z-index:20!important;
}
/* Titres et bandeaux */
#tarteaucitronRoot #tarteaucitron #tarteaucitronServices .tarteaucitronMainLine,
#tarteaucitronRoot #tarteaucitron #tarteaucitronServices .tarteaucitronTitle,
#tarteaucitronRoot #tarteaucitron .tarteaucitronBorder{
  background:#0d0d0d!important;
  border:0!important;
}
#tarteaucitronRoot #tarteaucitron #tarteaucitronServices .tarteaucitronTitle{
  border-bottom:1px solid rgba(230,195,104,.35)!important;
}
#tarteaucitronRoot .tarteaucitronH1,
#tarteaucitronRoot .tarteaucitronH2,
#tarteaucitronRoot .tarteaucitronH3,
#tarteaucitronRoot #tarteaucitron #tarteaucitronServices .tarteaucitronTitle{
  color:#ffffff!important;
  text-transform:uppercase!important;
  letter-spacing:1.5px!important;
  font-weight:500!important;
}
#tarteaucitronRoot .tarteaucitronH1{
  font-size:22px!important;
  position:relative!important;
  padding-bottom:14px!important;
}
#tarteaucitronRoot .tarteaucitronH1::after{
  content:''!important;position:absolute!important;left:50%!important;bottom:0!important;
  transform:translateX(-50%)!important;width:86px!important;height:2px!important;
  background:var(--or)!important;
}
/* Lignes de services : cartes sombres espacées, état signalé par un
   liseré à gauche (vert = autorisé, rouge = interdit) pour rester
   lisible malgré des boutons tous dorés */
#tarteaucitronRoot #tarteaucitron #tarteaucitronServices .tarteaucitronLine{
  background:#1d1d1d!important;
  border:1px solid #2a2a2a!important;
  border-radius:4px!important;
  margin:10px 14px!important;
  padding:14px 16px!important;
}
/* Les liserés d'état colorés (vert/rouge) hérités de tarteaucitron sont
   neutralisés partout : l'état se lit sur le bouton doré cerclé */
#tarteaucitronRoot #tarteaucitron .tarteaucitronIsAllowed,
#tarteaucitronRoot #tarteaucitron .tarteaucitronIsDenied,
#tarteaucitronRoot #tarteaucitron #tarteaucitronServices .tarteaucitronMainLine,
#tarteaucitronRoot #tarteaucitron #tarteaucitronServices .tarteaucitronLine{
  border-left:1px solid #2a2a2a!important;
}
#tarteaucitronRoot #tarteaucitron #tarteaucitronServices .tarteaucitronMainLine{
  border-left:0!important;
}
#tarteaucitronRoot #tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronName,
#tarteaucitronRoot #tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronName a{
  color:#dedede!important;
}
#tarteaucitronRoot #tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronName a{
  text-decoration:underline!important;text-decoration-color:var(--or)!important;
}
/* Boutons Autoriser / Interdire : dorés, l'état actif est souligné */
#tarteaucitronRoot #tarteaucitron .tarteaucitronAllow,
#tarteaucitronRoot #tarteaucitron .tarteaucitronDeny{
  font-size:12.5px!important;
  padding:.65em 1.2em!important;
  margin-left:8px!important;
  opacity:.92;
}
#tarteaucitronRoot #tarteaucitron .tarteaucitronIsAllowed .tarteaucitronAllow,
#tarteaucitronRoot #tarteaucitron .tarteaucitronIsDenied .tarteaucitronDeny{
  box-shadow:0 0 0 3px #141414, 0 0 0 5px var(--or-clair)!important;
  opacity:1;
}
/* Zone d'information */
#tarteaucitronRoot #tarteaucitron #tarteaucitronInfo{
  background:#0d0d0d!important;
  border:0!important;
  color:#bdbdbd!important;
  font-size:13px!important;
  line-height:1.6!important;
}
#tarteaucitronRoot #tarteaucitron #tarteaucitronInfo a,
#tarteaucitronRoot a{
  color:var(--or-clair)!important;
}
/* Ascenseur du panneau, assorti */
#tarteaucitronRoot #tarteaucitron ::-webkit-scrollbar{width:10px}
#tarteaucitronRoot #tarteaucitron ::-webkit-scrollbar-track{background:#0d0d0d}
#tarteaucitronRoot #tarteaucitron ::-webkit-scrollbar-thumb{
  background:var(--or-fonce);border-radius:5px;
}

/* Pastilles de catégories (« Cookies obligatoires », « Autre »…) :
   blanches par défaut -> chips sombres bordées d'or */
#tarteaucitronRoot #tarteaucitron #tarteaucitronServices .tarteaucitronTitle,
#tarteaucitronRoot #tarteaucitron #tarteaucitronServices .tarteaucitronTitle button,
#tarteaucitronRoot #tarteaucitron #tarteaucitronServices .tarteaucitronH2{
  background:#0d0d0d!important;
  color:#ffffff!important;
  border:1px solid rgba(230,195,104,.45)!important;
  border-radius:4px!important;
}
/* Bandes de description des catégories : blanches par défaut -> sombres */
#tarteaucitronRoot #tarteaucitron #tarteaucitronServices .tarteaucitronDetails{
  background:#0d0d0d!important;
  color:#bdbdbd!important;
  border:0!important;
}
/* Bouton « Politique de confidentialité » du panneau : même contour que
   celui du bandeau (le blanc par défaut jurait sur le fond sombre) */
#tarteaucitronRoot #tarteaucitron #tarteaucitronPrivacyUrl{
  background:transparent!important;
  border:1px solid rgba(255,255,255,.35)!important;
  color:#eaeaea!important;
  box-shadow:none!important;
  border-radius:4px!important;
  text-transform:uppercase!important;
  letter-spacing:.08em!important;
  font-size:13px!important;
  padding:.6em 1.2em!important;
}
#tarteaucitronRoot #tarteaucitron #tarteaucitronPrivacyUrl:hover{
  border-color:var(--or)!important;color:var(--or-clair)!important;
}

/* ---- Petit pictogramme persistant (bas gauche) ---- */
#tarteaucitronRoot #tarteaucitronIcon{
  background:transparent!important;
}
#tarteaucitronRoot #tarteaucitronIcon #tarteaucitronManager{
  padding:6px!important;
}

/* ---- Encart « ce contenu nécessite un consentement » (carte Google Maps) ---- */
#tarteaucitronRoot .tac_activate,
.tac_activate{
  background:#141414!important;
  border:1px solid var(--or)!important;
  border-top:4px solid var(--or)!important;
  border-radius:6px!important;
}
#tarteaucitronRoot .tac_activate .tac_float strong,
.tac_activate .tac_float strong{
  color:#ffffff!important;
  display:block!important;
  margin-bottom:12px!important;
  line-height:1.6!important;
}

/* ==========================================================
   14. Sienna — barre d'accessibilité à la charte
   (la couleur primaire pêche est réglée dans sienna.min.js ;
   ici, on assombrit le panneau et on corrige les contrastes)
   ========================================================== */
/* Bouton flottant (bas droite) : pêche, pictogramme brun */
.asw-menu-btn{
  background:var(--peche)!important;
  box-shadow:0 5px 18px rgba(0,0,0,.5)!important;
}
/* Le pictogramme seulement — le chemin de délimitation fill="none"
   de l'icône doit rester invisible (sinon : carré plein) */
.asw-menu-btn svg path:not([fill="none"]),
.asw-menu-btn .asw-fill-white:not([fill="none"]){
  fill:var(--brun)!important;
}

/* Panneau : carte sombre liserée pêche, comme le reste du site */
.asw-menu{
  background:#141414!important;
  border:1px solid var(--peche)!important;
  border-radius:6px!important;
  box-shadow:0 30px 80px rgba(0,0,0,.7)!important;
  color:#eaeaea!important;
}
.asw-menu-content{
  background:#141414!important;
}
/* Bandeau d'en-tête : dégradé pêche, texte brun (contraste) */
.asw-menu-header,
.asw-menu-header *{
  color:var(--brun)!important;
}
.asw-menu-header svg,
.asw-menu-header svg path{
  fill:var(--brun)!important;
}
.asw-menu-header button:hover{
  background:rgba(22,11,0,.12)!important;
}
/* Cartes de réglages : fond sombre, titres clairs */
.asw-menu .asw-card{
  background:#1d1d1d!important;
  border:1px solid #2a2a2a!important;
  box-shadow:none!important;
}
.asw-menu .asw-card-title{
  color:#ffffff!important;
  text-transform:uppercase!important;
  letter-spacing:1px!important;
  font-weight:500!important;
}
/* Boutons de réglage : tuiles sombres ; sélection = pêche + texte brun */
.asw-menu .asw-btn{
  background:#242424!important;
  color:#eaeaea!important;
  border:1px solid #333!important;
}
.asw-menu .asw-btn svg,
.asw-menu .asw-btn svg path{
  fill:#eaeaea!important;
}
.asw-menu .asw-btn:hover{
  border-color:var(--peche)!important;
}
.asw-menu .asw-btn.asw-selected{
  background:var(--peche)!important;
  border-color:var(--peche)!important;
  color:var(--brun)!important;
}
.asw-menu .asw-btn.asw-selected svg,
.asw-menu .asw-btn.asw-selected svg path{
  fill:var(--brun)!important;
}
/* Compteurs et libellés secondaires */
.asw-menu .asw-amount,
.asw-menu .asw-label{
  color:#eaeaea!important;
}
/* Pied du panneau */
.asw-menu .asw-footer{
  background:#0d0d0d!important;
  border-top:1px solid rgba(255,207,154,.25)!important;
  color:#bdbdbd!important;
}
.asw-menu .asw-footer a{
  color:var(--peche)!important;
}
/* Ascenseur assorti */
.asw-menu ::-webkit-scrollbar{width:10px}
.asw-menu ::-webkit-scrollbar-track{background:#0d0d0d}
.asw-menu ::-webkit-scrollbar-thumb{background:var(--peche);border-radius:5px}