/* ═══════════════════════════════════════════════════════════════
   PRECELLENCE — CSS PARTAGÉ (navbar · footer · widgets)
   ═══════════════════════════════════════════════════════════════
   Chargé par toutes les pages pour garantir un rendu uniforme
   de la navbar, du footer, du menu mobile et des widgets partagés
   (cookie banner, bouton WhatsApp, skip link).

   Les styles spécifiques à chaque page restent dans leur propre
   <style> inline ou leur CSS dédié (ex: services/services.css).
   ═══════════════════════════════════════════════════════════════ */

/* ───── Variables globales ───── */
:root {
  --or: #B8960C;
  --or-l: #D4AF6A;
  --or-d: #8a7450;
  --noir: #0C0C09;
  --creme: #F2EDE4;
  --serif: 'Cormorant Garamond', Georgia, serif;
  --sans: 'Jost', sans-serif;
}

/* ───── Skip link (accessibilité) ───── */
.skip {
  position: absolute; top: -100px; left: 1rem;
  background: var(--or); color: var(--noir);
  padding: .5rem 1rem; z-index: 9999;
  transition: top .3s; font-size: .8rem;
  text-decoration: none;
}
.skip:focus { top: 1rem; }

/* ───── WhatsApp flottant ───── */
.wa {
  position: fixed; bottom: 2rem; right: 2rem; z-index: 9999;
  width: 54px; height: 54px; background: #B8960C; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 20px rgba(184,150,12,.4);
  transition: transform .3s;
  text-decoration: none;
}
.wa:hover { transform: scale(1.1); }
.wa svg { width: 28px; height: 28px; fill: #fff; }

/* ───── Cookie banner (simple, haut de page) ───── */
.cookie-banner {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 9998;
  background: rgba(26,23,20,.95); color: #F2EDE4;
  padding: 1rem 2rem; display: flex; justify-content: space-between;
  align-items: center; flex-wrap: wrap; gap: 1rem;
  font-size: .85rem; backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.cookie-banner p { margin: 0; }
.cookie-banner a { color: #B8960C; text-decoration: underline; }
.cookie-banner__actions { display: flex; gap: .75rem; align-items: center; flex-shrink: 0; }
.cookie-banner button {
  background: #B8960C; color: #fff; border: 1px solid #B8960C;
  padding: .6rem 1.5rem; cursor: pointer;
  font-family: 'Jost', sans-serif; font-size: .8rem;
  letter-spacing: .08em; text-transform: uppercase;
  transition: opacity .2s, background .2s, color .2s;
}
.cookie-banner button:hover { opacity: .85; }
.cookie-banner #cookieRefuse {
  background: transparent; color: #F2EDE4; border-color: #F2EDE4;
}
.cookie-banner #cookieRefuse:hover { background: #F2EDE4; color: #2A1E10; opacity: 1; }
@media (max-width: 600px) {
  .cookie-banner { flex-direction: column; align-items: flex-start; padding: 1rem 1.5rem; }
  .cookie-banner__actions { width: 100%; }
}

/* ═══════════════════════════════════════════════════════════════
   NAVBAR
   ═══════════════════════════════════════════════════════════════ */

#nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 800;
  display: flex; align-items: center; justify-content: space-between;
  padding: 1.5rem 3rem;
  background: rgba(242,237,228,.95);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  transition: padding .4s;
  border-bottom: 1px solid rgba(184,150,12,.15);
}
#nav.scrolled { padding: 1rem 3rem; }

.nav__logo { display: flex; flex-direction: column; line-height: 1; text-decoration: none; }
.nav__logo-top { font-size: .6rem; letter-spacing: .35em; text-transform: uppercase; color: #B8960C; }
.nav__logo-main { font-family: var(--serif); font-size: 1.3rem; letter-spacing: .12em; text-transform: uppercase; color: #2A1E10; }

.nav__links { display: flex; gap: 2.5rem; list-style: none; margin: 0; padding: 0; align-items: center; }
.nav__links > li { display: flex; align-items: center; }
.nav__links a { font-size: .65rem; letter-spacing: .2em; text-transform: uppercase; color: #2A1E10; text-decoration: none; transition: color .3s; line-height: 1; }
.nav__links a:hover { color: #B8960C; }

.nav__right { display: flex; align-items: center; gap: 1.5rem; }
.nav__phone {
  font-family: 'Jost', sans-serif; font-size: 0.72rem;
  letter-spacing: 0.08em; color: #2A1E10; text-decoration: none;
  opacity: 0.7; transition: opacity 0.2s;
  white-space: nowrap;
}
.nav__phone:hover { opacity: 1; color: #B8960C; }
.nav__lang { font-size: .65rem; color: #2A1E10; cursor: pointer; }
.nav__book {
  font-size: .65rem; letter-spacing: .2em; text-transform: uppercase;
  border: 1px solid #B8960C; color: #B8960C;
  padding: .65rem 1.4rem; text-decoration: none;
  transition: background .3s, color .3s;
}
.nav__book:hover { background: #B8960C; color: #fff; }

/* Dropdowns */
.nav-dropdown { position: relative; }
.nav-dropdown__trigger { display: flex; align-items: center; gap: 4px; cursor: pointer; text-decoration: none; }
.nav-dropdown__trigger svg { transition: transform .3s; }
.nav-dropdown:hover .nav-dropdown__trigger svg { transform: rotate(180deg); }
.nav-dropdown__menu {
  position: absolute; top: calc(100% + 16px); left: 50%;
  transform: translateX(-50%) translateY(-8px);
  background: #F2EDE4; border: 1px solid rgba(184,150,12,.2);
  border-radius: 4px; padding: 8px; min-width: 260px;
  opacity: 0; visibility: hidden;
  transition: opacity .25s, transform .25s, visibility .25s;
  z-index: 1000; box-shadow: 0 20px 60px rgba(0,0,0,.12);
}
.nav-dropdown:hover .nav-dropdown__menu {
  opacity: 1; visibility: visible;
  transform: translateX(-50%) translateY(0);
}
.nav-dropdown__item {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 12px; border-radius: 2px;
  text-decoration: none; transition: background .2s;
}
.nav-dropdown__item:hover { background: rgba(184,150,12,.08); }
.nav-dropdown__icon { font-size: 16px; width: 28px; text-align: center; flex-shrink: 0; }
.nav-dropdown__title { font-size: 13px; font-weight: 500; color: #1a1714; letter-spacing: .02em; }
.nav-dropdown__sub { font-size: 10px; color: #999; letter-spacing: .06em; margin-top: 2px; }

.nav__toggle { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; }
.nav__toggle span { width: 22px; height: 1px; background: #2A1E10; display: block; }

/* ───── Menu mobile ───── */
.mobile-menu {
  display: none; position: fixed; inset: 0;
  background: #F2EDE4; z-index: 900;
  flex-direction: column; align-items: center; justify-content: center;
  gap: 2rem;
}
.mobile-menu.open { display: flex; }
.mobile-menu a {
  font-family: var(--serif); font-size: 2rem; font-weight: 300;
  color: #2A1E10; text-decoration: none; transition: color .3s;
}
.mobile-menu a:hover { color: #B8960C; }
.mob-close {
  position: absolute; top: 1.5rem; right: 2rem;
  background: none; border: none; cursor: pointer;
  color: #2A1E10; font-size: 1.5rem;
}

/* ═══════════════════════════════════════════════════════════════
   FOOTER
   ═══════════════════════════════════════════════════════════════ */

footer {
  background: #E8C99A;
  border-top: 1px solid rgba(184,150,12,.3);
}
.footer__lion { display: none; }
.footer__top {
  padding: 3rem 3rem 2rem;
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 3rem;
}
.footer-brand-name {
  font-family: var(--serif); font-size: 1.4rem;
  text-transform: uppercase; letter-spacing: .1em;
  margin-bottom: .2rem; color: #2A1E10;
}
.footer-brand-sub {
  font-size: .58rem; color: #B8960C;
  letter-spacing: .2em; text-transform: uppercase;
  margin-bottom: 1.2rem;
}
.footer-tagline {
  font-family: var(--serif); font-style: italic;
  font-size: .88rem; color: #5a5040;
  line-height: 1.6; max-width: 260px;
  margin-bottom: 1.5rem;
}
.footer-contact {
  display: flex; align-items: center; gap: .6rem;
  font-size: .72rem; color: #2A1E10;
  margin-bottom: .5rem;
}
.footer-contact a { color: #2A1E10; text-decoration: none; }
.footer-contact a:hover { color: #B8960C; }
.footer-contact svg {
  width: 13px; height: 13px; stroke: #B8960C;
  fill: none; stroke-width: 1.5; min-width: 13px;
}
.footer-col-title {
  font-size: .58rem; letter-spacing: .2em;
  text-transform: uppercase; color: #B8960C;
  margin-bottom: 1.2rem; font-weight: 500;
}
.footer-links {
  display: flex; flex-direction: column; gap: .55rem;
  list-style: none; margin: 0; padding: 0;
}
.footer-links a { font-size: .7rem; color: #2A1E10; text-decoration: none; transition: color .3s; }
.footer-links a:hover { color: #B8960C; }
.footer-social { display: flex; gap: .7rem; margin-top: 1.2rem; }
.footer-social a {
  width: 32px; height: 32px;
  border: 1px solid rgba(42,30,16,.3);
  display: flex; align-items: center; justify-content: center;
  color: #2A1E10; font-size: .65rem; text-decoration: none;
  transition: border-color .3s, color .3s;
}
.footer-social a:hover { border-color: #B8960C; color: #B8960C; }
.footer__bottom {
  border-top: 1px solid rgba(42,30,16,.15);
  padding: 1.5rem 3rem;
  display: flex; justify-content: space-between;
  align-items: center; flex-wrap: wrap; gap: 1rem;
}
.footer-copy { font-size: .62rem; color: #5a5040; }
.footer-legal { display: flex; gap: 1.5rem; list-style: none; margin: 0; padding: 0; }
.footer-legal a { font-size: .6rem; color: #2A1E10; text-decoration: none; transition: color .3s; }
.footer-legal a:hover { color: #B8960C; }

/* Bouton gold réutilisable */
.btn-gold {
  background: #B8960C; color: #fff;
  font-size: 11px; letter-spacing: .14em;
  text-transform: uppercase; padding: 14px 36px;
  text-decoration: none; font-weight: 600;
  transition: opacity .2s; display: inline-block;
  border: none; cursor: pointer;
}
.btn-gold:hover { opacity: .85; }

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════════════ */

@media (max-width: 900px) {
  #nav { padding: 1.2rem 1.5rem; }
  .nav__links, .nav__right { display: none; }
  .nav__toggle { display: flex; }
  .footer__top { grid-template-columns: 1fr 1fr; gap: 2rem; }
}
@media (max-width: 600px) {
  .footer__top { grid-template-columns: 1fr; padding: 3rem 1.5rem 2rem; }
  #nav { padding: 1rem 1.5rem; }
  .footer__bottom { padding: 1.5rem; }
}

/* ═══════════════════════════════════════════════════════════════
   NAV V1 — Mega-menu consolidé (ajouts)
   ═══════════════════════════════════════════════════════════════ */

/* Mega-menu wide pour "Services" (3 colonnes) */
.nav-dropdown__menu--wide {
  min-width: 760px;
  padding: 24px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 24px;
}
.nav-dropdown__col { display: flex; flex-direction: column; gap: 4px; }
.nav-dropdown__colttl {
  font-size: 9px; letter-spacing: .2em; text-transform: uppercase;
  color: #B8960C; font-weight: 500; margin-bottom: 8px;
  padding-bottom: 6px; border-bottom: 1px solid rgba(184,150,12,.2);
}
.nav-dropdown__menu--wide .nav-dropdown__item { padding: 8px 10px; }

/* FR/EN switcher */
.nav__lang {
  display: flex; align-items: center; gap: .4rem;
  font-size: .62rem; letter-spacing: .15em;
  text-transform: uppercase; color: #2A1E10;
}
.nav__lang a {
  color: #2A1E10; text-decoration: none;
  transition: color .3s, opacity .3s; opacity: .55;
}
.nav__lang a.is-active { opacity: 1; color: #B8960C; }
.nav__lang a:hover { color: #B8960C; opacity: 1; }
.nav__lang span { color: rgba(42,30,16,.3); font-size: .6rem; }

/* Navbar v1 — masque l'ancien numéro s'il était là */
.navv1 .nav__phone { display: none; }

/* ═══════════════════════════════════════════════════════════════
   NAV V2 / V3 — Header luxe minimal (commun)
   ═══════════════════════════════════════════════════════════════ */

.lx-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 800;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 1.1rem 2.5rem;
  background: rgba(242,237,228,.92);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(184,150,12,.12);
  min-height: 64px;
  transition: padding .3s, background .3s;
}
.lx-header.scrolled { padding: .75rem 2.5rem; background: rgba(242,237,228,.98); }

/* Bouton MENU à gauche */
.lx-menu-trigger {
  display: flex; align-items: center; gap: .8rem;
  background: none; border: none; cursor: pointer;
  padding: .4rem .2rem;
  justify-self: start;
  transition: opacity .2s;
}
.lx-menu-trigger:hover { opacity: .6; }
.lx-menu-icon {
  width: 22px; height: 10px; position: relative; display: block;
}
.lx-menu-icon::before, .lx-menu-icon::after {
  content: ''; position: absolute; left: 0;
  width: 100%; height: 1px; background: #2A1E10;
  transition: transform .3s;
}
.lx-menu-icon::before { top: 2px; }
.lx-menu-icon::after  { bottom: 2px; }
.lx-menu-txt {
  font-family: 'Jost', sans-serif;
  font-size: .68rem; letter-spacing: .3em;
  text-transform: uppercase; color: #2A1E10;
  font-weight: 400;
}

/* Logo centré */
.lx-logo {
  display: flex; flex-direction: column; align-items: center;
  line-height: 1; text-decoration: none;
  justify-self: center;
}
.lx-logo-top {
  font-size: .55rem; letter-spacing: .38em;
  text-transform: uppercase; color: #B8960C;
  margin-bottom: 3px;
}
.lx-logo-main {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 1.35rem; letter-spacing: .15em;
  text-transform: uppercase; color: #2A1E10;
  font-weight: 500;
}

/* FR/EN switcher à droite */
.lx-lang {
  display: flex; align-items: center; gap: .4rem;
  font-size: .62rem; letter-spacing: .15em;
  text-transform: uppercase; color: #2A1E10;
  justify-self: end;
}
.lx-lang a {
  color: #2A1E10; text-decoration: none;
  transition: color .3s, opacity .3s; opacity: .5;
}
.lx-lang a.is-active { opacity: 1; color: #B8960C; }
.lx-lang a:hover { opacity: 1; color: #B8960C; }
.lx-lang span { color: rgba(42,30,16,.3); font-size: .6rem; }

/* ═══════════════════════════════════════════════════════════════
   DRAWER (commun v2 et v3)
   ═══════════════════════════════════════════════════════════════ */

/* Overlay (uniquement v2) */
.lx-overlay {
  position: fixed; inset: 0; z-index: 899;
  background: rgba(12,12,9,.4);
  opacity: 0; visibility: hidden;
  transition: opacity .35s ease, visibility .35s;
  backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px);
}
.lx-overlay.is-visible { opacity: 1; visibility: visible; }

/* Drawer de base */
.lx-drawer {
  position: fixed; top: 0; z-index: 900;
  background: #F5F0E8;
  display: flex; flex-direction: column;
  padding: 4.5rem 3rem 2.5rem;
  overflow-y: auto;
  opacity: 0; visibility: hidden;
  transition: transform .5s cubic-bezier(.4,0,.2,1),
              opacity .5s ease, visibility .5s;
}
.lx-drawer__close {
  position: absolute; top: 1.5rem; right: 2rem;
  background: none; border: none; cursor: pointer;
  font-size: 1.3rem; color: #2A1E10;
  padding: .3rem .6rem;
  transition: opacity .2s, transform .2s;
  z-index: 10;
}
.lx-drawer__close:hover { opacity: .5; transform: rotate(90deg); }

/* ───── V2 : Drawer latéral gauche (Chanel) ───── */
.lx-drawer--side {
  left: 0; bottom: 0;
  width: 420px; max-width: 90vw;
  transform: translateX(-100%);
  box-shadow: 0 0 80px rgba(0,0,0,.15);
}
.lx-drawer--side.is-open {
  transform: translateX(0);
  opacity: 1; visibility: visible;
}

/* ───── V3 : Drawer plein écran (Louis Vuitton) ───── */
.lx-drawer--full {
  left: 0; right: 0; bottom: 0;
  width: 100%;
  transform: translateY(-20px);
  padding: 6rem 5vw 3rem;
}
.lx-drawer--full.is-open {
  transform: translateY(0);
  opacity: 1; visibility: visible;
}

/* Navigation dans le drawer */
.lx-drawer__nav {
  display: flex; flex-direction: column; gap: 2.5rem;
  flex: 1;
}
.lx-drawer__nav--grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 3rem; max-width: 1400px; margin: 0 auto; width: 100%;
}
.lx-drawer__group { display: flex; flex-direction: column; gap: .5rem; }
.lx-drawer__title {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 1.05rem; letter-spacing: .18em;
  text-transform: uppercase; color: #B8960C;
  font-weight: 500; margin-bottom: .8rem;
  padding-bottom: .5rem;
  border-bottom: 1px solid rgba(184,150,12,.25);
}
.lx-drawer__group a {
  font-family: 'Jost', sans-serif;
  font-size: .82rem; letter-spacing: .04em;
  color: #2A1E10; text-decoration: none;
  padding: .4rem 0;
  transition: color .25s, padding-left .25s;
  font-weight: 300;
}
.lx-drawer__group a:hover {
  color: #B8960C;
  padding-left: .5rem;
}

/* Footer du drawer */
.lx-drawer__footer {
  margin-top: 2.5rem;
  padding-top: 2rem;
  border-top: 1px solid rgba(184,150,12,.2);
  display: flex; flex-direction: column; gap: 1.2rem;
}
.lx-drawer__footer--centered {
  align-items: center;
  text-align: center;
  max-width: 600px;
  margin-left: auto; margin-right: auto;
}
.lx-drawer__cta {
  display: inline-flex; justify-content: center; align-items: center;
  background: #B8960C; color: #F5F0E8;
  padding: 1rem 2.5rem;
  font-family: 'Jost', sans-serif;
  font-size: .72rem; letter-spacing: .22em;
  text-transform: uppercase; text-decoration: none;
  transition: opacity .3s, transform .3s;
  align-self: flex-start;
}
.lx-drawer__footer--centered .lx-drawer__cta {
  align-self: center;
}
.lx-drawer__cta:hover { opacity: .85; transform: translateY(-1px); }
.lx-drawer__contact {
  display: flex; flex-direction: column; gap: .4rem;
  font-size: .75rem; color: #5a5040;
}
.lx-drawer__footer--centered .lx-drawer__contact {
  flex-direction: row; justify-content: center; gap: 1rem;
}
.lx-drawer__contact a { color: #5a5040; text-decoration: none; transition: color .2s; }
.lx-drawer__contact a:hover { color: #B8960C; }

/* Responsive pour drawer plein écran */
@media (max-width: 900px) {
  .lx-drawer__nav--grid { grid-template-columns: repeat(2, 1fr); gap: 2rem; }
  .lx-header { padding: 1rem 1.5rem; }
  .lx-logo-main { font-size: 1.1rem; }
  .lx-drawer { padding: 4rem 2rem 2rem; }
  .lx-menu-txt { display: none; }
}
@media (max-width: 600px) {
  .lx-drawer__nav--grid { grid-template-columns: 1fr; }
  .lx-drawer--side { width: 100%; max-width: 100%; }
  .lx-drawer__footer--centered .lx-drawer__contact { flex-direction: column; gap: .3rem; }
}

/* Sous-items du drawer (indent visuel) */
.lx-drawer__sub {
  padding-left: 1rem !important;
  font-size: .78rem !important;
  opacity: .75;
  color: #5a5040 !important;
}
.lx-drawer__sub:hover {
  opacity: 1;
  color: #B8960C !important;
  padding-left: 1.5rem !important;
}

/* ═══════════════════════════════════════════════════════════════
   NAV V4 — Dior style (thumbnails + drill-down)
   ═══════════════════════════════════════════════════════════════ */

.lx-drawer--dior {
  left: 0; bottom: 0;
  width: 520px; max-width: 92vw;
  transform: translateX(-100%);
  box-shadow: 0 0 80px rgba(0,0,0,.15);
  padding: 0; /* Gestion interne */
}
.lx-drawer--dior.is-open {
  transform: translateX(0);
  opacity: 1; visibility: visible;
}

/* Slider intérieur (drill-down) — panneaux en position absolute empilés */
.lx-slider {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

/* Panneaux — chacun prend 100% du slider, padding indépendant */
.lx-panel {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  box-sizing: border-box;
  padding: 3.5rem 2.5rem 2rem;
  overflow-y: auto;
  display: flex; flex-direction: column; gap: 1.2rem;
  transition: transform .4s cubic-bezier(.4,0,.2,1);
}

/* Panneau principal : visible par défaut, slide à gauche quand on drill */
.lx-panel--main { transform: translateX(0); }
.lx-slider.is-sub .lx-panel--main { transform: translateX(-100%); }

/* Sous-panneaux : cachés à droite par défaut */
.lx-panel--sub {
  transform: translateX(100%);
  visibility: hidden;
}
/* Visible UNIQUEMENT si slider est en mode sub ET ce panneau est actif
   → sinon on reste caché (évite la superposition sur le retour) */
.lx-slider.is-sub .lx-panel--sub.is-active {
  transform: translateX(0);
  visibility: visible;
}

/* Zone 1 : Thumbnails */
.lx-thumbs {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: .6rem;
}
.lx-thumb {
  display: flex; flex-direction: column; align-items: center;
  text-decoration: none; color: #2A1E10;
  transition: transform .3s, opacity .3s;
}
.lx-thumb:hover {
  transform: translateY(-2px);
  opacity: .85;
}
.lx-thumb__img {
  width: 100%; aspect-ratio: 1;
  overflow: hidden; border-radius: 3px;
  margin-bottom: .5rem;
  background: #E8DFD0;
}
.lx-thumb__img img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .5s;
}
.lx-thumb:hover .lx-thumb__img img {
  transform: scale(1.06);
}
.lx-thumb__ttl {
  font-family: 'Jost', sans-serif;
  font-size: .68rem;
  letter-spacing: .06em;
  text-align: center;
  color: #2A1E10;
  font-weight: 300;
  line-height: 1.3;
}

/* Séparateur discret */
.lx-sep {
  border: none;
  border-top: 1px solid rgba(184,150,12,.2);
  margin: .5rem 0;
}

/* Zone 2 : Accès rapide */
.lx-quick {
  display: flex; flex-direction: column;
}
.lx-quick a {
  font-family: 'Jost', sans-serif;
  font-size: .85rem; letter-spacing: .02em;
  color: #2A1E10; text-decoration: none;
  padding: .55rem 0;
  font-weight: 400;
  transition: color .25s, padding-left .25s;
  border-bottom: 1px solid rgba(184,150,12,.08);
}
.lx-quick a:last-child { border-bottom: none; }
.lx-quick a:hover {
  color: #B8960C;
  padding-left: .4rem;
}

/* Zone 3 : Catégories */
.lx-cats {
  display: flex; flex-direction: column;
}
.lx-cat {
  display: flex; align-items: center; justify-content: space-between;
  width: 100%;
  background: none; border: none; cursor: pointer;
  padding: .95rem 0;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 1.15rem; letter-spacing: .05em;
  color: #2A1E10;
  font-weight: 500;
  text-align: left;
  border-bottom: 1px solid rgba(184,150,12,.22);
  transition: color .25s, padding-left .25s;
}
.lx-cat:last-child { border-bottom: none; }
.lx-cat:hover {
  color: #B8960C;
  padding-left: .3rem;
}
.lx-cat__lbl { flex: 1; }
/* Chevron SVG plus visible */
.lx-cat__arr {
  width: 20px; height: 20px;
  stroke: #B8960C;
  flex-shrink: 0;
  transition: transform .3s ease, stroke .25s;
  opacity: .9;
}
.lx-cat:hover .lx-cat__arr {
  transform: translateX(6px);
  opacity: 1;
}

/* ═══════════════════════════════════════════════════════════════
   SOUS-PANNEAUX — Design centré luxe (Dior / Four Seasons)
   ═══════════════════════════════════════════════════════════════ */

/* Conteneur centré avec max-width pour tout le contenu */
.lx-panel--sub {
  align-items: center;
  text-align: center;
  gap: 0;
}
/* Tous les enfants directs du sous-panneau sont centrés dans un bloc max 420px */
.lx-panel--sub > * {
  width: 100%;
  max-width: 420px;
  box-sizing: border-box;
}

/* Bouton RETOUR — reste en haut à gauche pour repère */
.lx-back {
  align-self: flex-start;
  max-width: none !important;
  background: none; border: none; cursor: pointer;
  font-family: 'Jost', sans-serif;
  font-size: .7rem; letter-spacing: .2em;
  text-transform: uppercase;
  color: #B8960C;
  padding: .3rem 0;
  margin-bottom: 1.5rem;
  transition: opacity .2s, transform .25s;
  display: inline-flex; align-items: center; gap: .3rem;
}
.lx-back:hover { opacity: .6; transform: translateX(-3px); }

/* Titre du panneau — serif, gros, centré avec trait or dessous */
.lx-panel__title {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 2.1rem; letter-spacing: .18em;
  text-transform: uppercase;
  color: #2A1E10;
  font-weight: 500;
  text-align: center;
  margin: .5rem auto 2.2rem;
  padding-bottom: 1.2rem;
  position: relative;
}
.lx-panel__title::after {
  content: '';
  position: absolute;
  left: 50%; bottom: 0;
  transform: translateX(-50%);
  width: 60px; height: 1px;
  background: #B8960C;
}

/* Groupe de liens (section) */
.lx-subgroup {
  display: flex; flex-direction: column;
  align-items: center;
  margin-bottom: 2.5rem;
}

/* Titre de section — "— AÉROPORTS —" entre 2 lignes or */
.lx-subgroup__ttl {
  display: flex; align-items: center; justify-content: center;
  gap: .8rem;
  font-family: 'Jost', sans-serif;
  font-size: .6rem; letter-spacing: .28em;
  text-transform: uppercase;
  color: #B8960C;
  font-weight: 400;
  margin-bottom: 1.3rem;
  padding-bottom: 0;
  border-bottom: none;
  width: 100%;
}
.lx-subgroup__ttl::before,
.lx-subgroup__ttl::after {
  content: '';
  flex: 1;
  height: 1px;
  background: rgba(184,150,12,.35);
  max-width: 50px;
}

/* Liens dans le sous-panneau — serif, centrés, aérés */
.lx-subgroup a {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 1.05rem; letter-spacing: .04em;
  color: #2A1E10; text-decoration: none;
  padding: .55rem 1rem;
  font-weight: 400;
  text-align: center;
  transition: color .25s, letter-spacing .3s;
  line-height: 1.4;
}
.lx-subgroup a:hover {
  color: #B8960C;
  letter-spacing: .1em;
}

/* Footer V4 (dans le panneau main) */
.lx-drawer--dior .lx-drawer__footer {
  margin-top: auto;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(184,150,12,.2);
  display: flex; flex-direction: column; gap: 1rem;
}
.lx-drawer--dior .lx-drawer__cta {
  align-self: stretch;
  text-align: center;
}

/* Responsive V4 */
@media (max-width: 600px) {
  .lx-drawer--dior { width: 100%; max-width: 100%; }
  .lx-panel { padding: 3.5rem 1.5rem 2rem; }
  .lx-thumbs { grid-template-columns: 1fr 1fr; gap: .8rem; }
  .lx-panel__title { font-size: 1.4rem; }
}

/* Liens directs dans la liste unifiée (même style que .lx-cat mais sans flèche) */
.lx-cat--link {
  text-decoration: none;
  display: flex; align-items: center;
  justify-content: flex-start;
}

/* Doctrine CTA 2V.0 - masquer le bouton tel quand la mention discrete est presente
   Compatible quel que soit l'ordre DOM (avant/apres) ou la profondeur via :has().
   Reprend en global la regle de blog/blog.css pour qu'elle soit chargee partout. */
.cta-secondary-contact ~ a[href^="tel:"],
section:has(.cta-secondary-contact) a[href^="tel:"],
.cta-band:has(.cta-secondary-contact) a[href^="tel:"],
.srv-cta-final:has(.cta-secondary-contact) a[href^="tel:"] {
  display: none;
}