/* Le Séjour Parfait — MAJ 48 (23/10/2026) : accueil calqué sur la disposition du site de référence (resort).
   Même ordre et même placement des blocs, même famille de police (Optima, sinon Marcellus),
   tailles de texte du Séjour Parfait. S'ajoute à accueil-v47.css (cartes qui déroulent les catalogues). */
:root{--bbr-or:#B8922A;--bbr-or-clair:#D4B256;--bbr-noir:#0A0A0A;--bbr-creme:#FAF7F2;--bbr-bord:#E6E6E6;
  --bbr-police:Optima,"Optima Web","Marcellus","Quattrocento Sans",Georgia,serif}

/* ---------- En-tête (même disposition : logo à gauche, menu à droite, « Réserver » en contour or) ---------- */
body.page-accueil .entete,body.page-accueil .entete-nav,body.page-accueil .entete-nav a{font-family:var(--bbr-police)!important}
body.page-accueil.avec-lx .entete .entete-ligne{min-height:96px}
body.page-accueil.avec-lx .entete-nav a:not(.bouton){font-size:12px!important;font-weight:500!important;letter-spacing:.22em!important}
body.page-accueil.avec-lx .entete-nav a.bouton{font-size:11.2px!important;font-weight:500!important;letter-spacing:.3em!important;padding:10px 24px!important;border:1px solid var(--bbr-or)!important;border-radius:0!important}
body.page-accueil.avec-lx .entete.defile{background:rgba(255,255,255,.95)!important;box-shadow:none!important}
body.page-accueil.avec-lx .entete.defile .entete-nav a.bouton{background:var(--bbr-or)!important;color:#fff!important}
@media (min-width:901px){body.page-accueil.avec-lx .entete.defile .entete-nav a:not(.bouton){color:rgba(10,10,10,.8)!important}}
/* Téléphone : en-tête blanc, menu ☰ à gauche, logo au centre */
@media (max-width:900px){
  body.page-accueil.avec-lx .entete,body.page-accueil.avec-lx .entete:not(.defile){background:#fff!important;border-bottom:1px solid #f0ece4!important}
  body.page-accueil.avec-lx .entete:not(.defile) .entete-logo img{filter:none!important}
  body.page-accueil.avec-lx .entete .entete-ligne{min-height:66px;position:relative;justify-content:center}
  body.page-accueil.avec-lx .entete-burger{position:absolute!important;left:12px;top:50%;transform:translateY(-50%);background:transparent!important}
  body.page-accueil.avec-lx .entete:not(.defile) .entete-burger span{background:var(--bbr-noir)!important}
  body.page-accueil .lx-kicker{top:calc(66px + 14px)!important}
}

/* ---------- Bloc vidéo : police de référence ---------- */
body.page-accueil .lx h1,body.page-accueil .lx p,body.page-accueil .lx-kicker{font-family:var(--bbr-police)!important}
body.page-accueil .lx h1{font-weight:400!important}
body.page-accueil .lx p{font-weight:300!important}

/* ---------- Commun ---------- */
.bbr-cadre{max-width:1232px;margin:0 auto;padding:0 24px}
.bbr-sur{display:block;font:400 9.6px/1.4 var(--bbr-police);letter-spacing:.55em;text-transform:uppercase;color:var(--bbr-or);margin-bottom:16px}
.bbr-tete{text-align:center;max-width:720px;margin:0 auto clamp(36px,5vw,64px)}
.bbr-tete h2,.bbr-mot h2,.bbr-edito h2{font:400 clamp(26px,2.8vw,38px)/1.1 var(--bbr-police);letter-spacing:-.01em;color:var(--bbr-noir);margin:0 0 18px}
.bbr-tete p{font:300 15px/1.6 var(--bbr-police);color:rgba(10,10,10,.65);max-width:576px;margin:0 auto}
.bbr-lien{display:inline-flex;align-items:center;gap:10px;font:400 11.5px/1.5 var(--bbr-police);letter-spacing:.4em;text-transform:uppercase;color:var(--bbr-noir)!important;text-decoration:none!important;padding-bottom:8px;border-bottom:1px solid currentColor;transition:color .25s,gap .25s}
.bbr-lien:hover{color:var(--bbr-or)!important;gap:14px}
.bbr-lien--blanc{color:#fff!important}

/* « Choisissez votre expérience » : même en-tête que la référence (points au lieu de tirets) */
body.page-accueil .lsp-univers,body.page-accueil .lsp-univers *{font-family:var(--bbr-police)}
body.page-accueil .lsp-univers{padding-top:clamp(64px,8vw,128px)!important;padding-bottom:clamp(48px,7vw,112px)!important}
body.page-accueil .lsp-univers__sur{font-size:9.6px!important;letter-spacing:.55em!important}
body.page-accueil .lsp-univers__sur::before{content:"· "!important}
body.page-accueil .lsp-univers__sur::after{content:" ·"!important}
body.page-accueil .lsp-univers h2{font-weight:400!important;color:var(--bbr-noir)!important}
body.page-accueil .lsp-univers__tete p{font-weight:300!important;color:rgba(10,10,10,.7)!important}

/* ---------- Blocs éditoriaux : grande photo, carte blanche à gauche puis à droite ---------- */
.bbr-edito{position:relative;height:92vh;min-height:620px;overflow:hidden;background:var(--bbr-noir);display:flex;align-items:center}
.bbr-edito__fond{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bbr-edito__carte{position:relative;z-index:1;width:min(576px,calc(100% - 32px));background:#fff;padding:56px;box-shadow:0 30px 80px -20px rgba(0,0,0,.5)}
.bbr-edito--gauche .bbr-edito__carte{margin-left:8.2%}
.bbr-edito--droite{justify-content:flex-end}
.bbr-edito--droite .bbr-edito__carte{margin-right:7.6%}
.bbr-edito h2{font-size:clamp(24px,2.4vw,32px)}
.bbr-edito p{font:300 15px/1.6 var(--bbr-police);color:rgba(10,10,10,.75);margin:0 0 32px}

/* ---------- Le mot de l'équipe : photo à gauche, texte à droite ---------- */
.bbr-mot{background:#fff;padding:clamp(72px,10vw,160px) 0}
.bbr-mot__grille{display:grid;grid-template-columns:5fr 7fr;gap:clamp(32px,7vw,100px);align-items:center}
.bbr-mot__photo{width:100%;aspect-ratio:4/5;object-fit:cover}
.bbr-mot p{font:300 15.5px/1.6 var(--bbr-police);color:rgba(10,10,10,.75);margin:0 0 20px;max-width:660px}
.bbr-mot__signe{font:400 22px/1.2 var(--bbr-police);color:var(--bbr-noir);margin-top:44px}
.bbr-mot__role{font:400 10.5px/1.5 var(--bbr-police);letter-spacing:.4em;text-transform:uppercase;color:rgba(10,10,10,.55);margin-top:8px}

/* ---------- Les offres : 4 cartes, photo en haut, prix en bas ---------- */
.bbr-offres{background:var(--bbr-creme);padding:clamp(72px,9vw,128px) 0}
.bbr-offres__grille{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px}
.bbr-offre{display:flex;flex-direction:column;background:#fff;border:1px solid var(--bbr-bord);color:var(--bbr-noir)!important;text-decoration:none!important;transition:box-shadow .3s,transform .3s}
.bbr-offre:hover{box-shadow:0 18px 40px -18px rgba(10,10,10,.55);transform:translateY(-3px)}
.bbr-offre__img{position:relative;aspect-ratio:4/5;overflow:hidden}
.bbr-offre__img img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s ease}
.bbr-offre:hover .bbr-offre__img img{transform:scale(1.05)}
.bbr-offre__badge{position:absolute;top:20px;left:16px;background:rgba(255,255,255,.9);padding:4px 8px;font:500 8.8px/1.5 var(--bbr-police);letter-spacing:.32em;text-transform:uppercase;color:var(--bbr-noir)}
.bbr-offre__corps{padding:22px 24px 24px;display:flex;flex-direction:column;flex:1}
.bbr-offre h3{font:400 20px/1.3 var(--bbr-police);margin:0 0 6px;color:var(--bbr-noir)}
.bbr-offre p{font:300 13px/1.4 var(--bbr-police);color:rgba(10,10,10,.6);margin:0 0 22px}
.bbr-offre__bas{margin-top:auto;display:flex;align-items:flex-end;justify-content:space-between;gap:10px}
.bbr-offre__des{display:block;font:400 8.8px/1.5 var(--bbr-police);letter-spacing:.28em;text-transform:uppercase;color:rgba(10,10,10,.4)}
.bbr-offre__prix{display:block;font:500 17px/1.5 var(--bbr-police);color:var(--bbr-noir)}
.bbr-offre__go{font:400 10.4px/1.5 var(--bbr-police);letter-spacing:.32em;text-transform:uppercase;color:var(--bbr-noir);white-space:nowrap}
.bbr-offre:hover .bbr-offre__go{color:var(--bbr-or)}

/* ---------- FAQ ---------- */
.bbr-faq{background:#fff;padding:clamp(72px,9vw,128px) 0}
.bbr-faq__cadre{max-width:720px;margin:0 auto;padding:0 24px}
.bbr-faq .bbr-tete{margin-bottom:48px}
.bbr-faq details{border-bottom:1px solid var(--bbr-bord)}
.bbr-faq details:first-of-type{border-top:1px solid var(--bbr-bord)}
.bbr-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px;font:500 15px/1.5 var(--bbr-police);color:var(--bbr-noir)}
.bbr-faq summary::-webkit-details-marker{display:none}
.bbr-faq summary::after{content:"+";font:300 20px/1 var(--bbr-police);color:var(--bbr-or);transition:transform .3s}
.bbr-faq details[open] summary::after{transform:rotate(45deg)}
.bbr-faq details p{font:400 14px/1.6 var(--bbr-police);color:rgba(10,10,10,.75);margin:0;padding:0 20px 20px}

/* ---------- Appel final ---------- */
.bbr-appel{position:relative;overflow:hidden;padding:clamp(120px,16vw,224px) 24px;text-align:center}
.bbr-appel__fond{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bbr-appel::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.55)}
.bbr-appel__txt{position:relative;z-index:1}
.bbr-appel h2{font:400 clamp(30px,3.8vw,52px)/1.05 var(--bbr-police);letter-spacing:-.01em;color:#fff;margin:0 0 48px}

/* ---------- Pied de page ---------- */
.bbr-pied{background:var(--bbr-creme);padding:96px 0 40px;font-family:var(--bbr-police)}
.bbr-pied a.bbr-pied__logo{display:block;width:max-content;margin:0 auto 72px}
.bbr-pied__logo img{height:52px;width:auto;display:block}
.bbr-pied__grille{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:48px}
.bbr-pied__titre{font:400 9.6px/2 var(--bbr-police);letter-spacing:.4em;text-transform:uppercase;color:rgba(10,10,10,.55);margin-bottom:18px}
.bbr-pied a,.bbr-pied p{display:block;font:400 14px/1.4 var(--bbr-police);color:rgba(10,10,10,.8);text-decoration:none;margin:0 0 15px}
.bbr-pied a:hover{color:var(--bbr-or)}
.bbr-pied .bbr-pied__petit{font-size:12px;color:rgba(10,10,10,.65)}
.bbr-pied__bas{margin-top:72px;padding-top:24px;border-top:1px solid var(--bbr-bord);display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;font-size:12px;color:rgba(10,10,10,.5)}
.bbr-pied__bas .pied-liens{display:flex;gap:24px;align-items:center}
.bbr-pied__bas a,.bbr-pied__bas button{display:inline;font:400 12px var(--bbr-police);color:rgba(10,10,10,.5);background:none;border:0;padding:0;margin:0;cursor:pointer}
.bbr-pied .credits{margin-top:16px;font-size:12px}

/* ---------- Bouton « Réserver » flottant (téléphone) ---------- */
.bbr-fab{position:fixed;left:50%;bottom:calc(22px + env(safe-area-inset-bottom));z-index:45;transform:translate(-50%,30px);opacity:0;pointer-events:none;background:var(--bbr-or);color:#fff!important;text-decoration:none!important;border-radius:999px;padding:15px 40px;font:500 12px/1 var(--bbr-police);letter-spacing:.32em;text-transform:uppercase;box-shadow:0 10px 25px -8px rgba(10,10,10,.5);transition:opacity .5s ease-out,transform .5s ease-out;display:none}
.bbr-fab.on{opacity:1;transform:translate(-50%,0);pointer-events:auto}

/* ---------- Tablette et téléphone ---------- */
@media (max-width:1024px){.bbr-offres__grille{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.bbr-pied__grille{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){.bbr-fab{display:block}}
@media (max-width:760px){.bbr-fab{bottom:calc(78px + env(safe-area-inset-bottom))}}
@media (max-width:700px){
  .bbr-edito{height:auto;min-height:0;padding:56px 0;justify-content:center!important}
  .bbr-edito__carte,.bbr-edito--gauche .bbr-edito__carte,.bbr-edito--droite .bbr-edito__carte{margin:0 16px;padding:36px 24px}
  .bbr-mot__grille{grid-template-columns:1fr}
  .bbr-offres__grille{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;margin:0 -24px;padding:0 24px 4px;scrollbar-width:none}
  .bbr-offres__grille::-webkit-scrollbar{display:none}
  .bbr-offre{flex:0 0 74%;scroll-snap-align:start}
  .bbr-pied__grille{grid-template-columns:1fr 1fr;gap:32px 20px}
  .bbr-pied__bas{flex-direction:column}
}
@media (prefers-reduced-motion:reduce){.bbr-offre,.bbr-offre__img img,.bbr-fab{transition:none}}
