/* ╔══════════════════════════════════════════════════════════════╗
   ║  LM COUVERTURE — NAV PREMIUM  v2.0                          ║
   ║  Chargé EN DERNIER (override propre de tous les patches)    ║
   ║  luxury.css V4/V5/V7/V9  ·  index.css patches nav           ║
   ╚══════════════════════════════════════════════════════════════╝ */

/* ── 0. VARIABLE GLOBALE HAUTEUR ─────────────────────────────── */
:root { --nav-h: 80px; }
html  { scroll-padding-top: var(--nav-h); }

/* ── 1. BARRE NAV ─────────────────────────────────────────────── */
.nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 900;
  height: var(--nav-h);
  display: flex;
  align-items: center;
  padding: 0;               /* reset luxury.css padding:1.6rem 0 */
  background: transparent;
  border-bottom: 1px solid transparent;
  transition: background .4s cubic-bezier(.19,1,.22,1),
              border-color .4s, box-shadow .4s;
}
.nav.stuck {
  padding: 0;               /* reset luxury.css .stuck padding:.9rem 0 */
  background: rgba(14,12,10,.97);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border-bottom-color: rgba(184,149,90,.2);
  box-shadow: 0 8px 40px rgba(0,0,0,.45);
}
.nav > .wrap {
  width: min(var(--max,1280px), calc(100% - var(--gutter,clamp(1.25rem,4vw,3rem)) * 2));
  margin-inline: auto;
}

/* ── 2. LIGNE NAV-ROW ─────────────────────────────────────────── */
.nav-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  height: var(--nav-h);
}

/* ── 3. BRAND ─────────────────────────────────────────────────── */
.nav-brand {
  display: flex;
  align-items: center;
  gap: .85rem;
  flex-shrink: 0;
  text-decoration: none;
  min-width: 0;
}
.nav-brand-img {
  width: 48px; height: 48px;  /* +12px vs V11 original */
  flex-shrink: 0;
  opacity: .9;
  display: block;
}
.nav-brand-copy {
  display: flex;
  flex-direction: column;
  gap: .22rem;
  min-width: 0;
}
.nav-brand-name {
  font-family: var(--serif,'Playfair Display',Georgia,serif);
  font-size: 1.05rem;
  font-weight: 600;
  letter-spacing: .01em;
  color: var(--stone2,#F4F0EB);
  line-height: 1.1;
  white-space: nowrap;
  max-width: none; /* reset patch mobile */
}
/* Baseline en OR — visible (l'original était var(--muted) = gris #8F8478) */
.nav-brand-tag {
  font-family: var(--mono,'Space Mono',monospace);
  font-size: .58rem;
  letter-spacing: .22em;
  color: var(--or,#B8955A);
  text-transform: uppercase;
  white-space: nowrap;
  opacity: .78;
  display: block; /* reset display:none des patches */
}

/* ── 4. LIENS CENTRE ──────────────────────────────────────────── */
.nav-links {
  display: flex;
  align-items: center;
  gap: 0;          /* reset gap:.05rem du Patch V4 */
  flex: 1 1 auto;
  justify-content: center;
  min-width: 0;
  overflow: hidden;
}
.nav-links a {
  font-family: var(--mono,'Space Mono',monospace);
  font-size: .65rem;
  font-weight: 400;
  letter-spacing: .11em;
  color: var(--muted2,#9B9189);
  padding: .5rem .7rem;
  white-space: nowrap;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 1px;
  transition: color .22s;
  background: transparent;
}
.nav-links a:hover          { color: var(--stone2,#F4F0EB); background: transparent; }
.nav-links a.active,
.nav-links a.cur            { color: var(--or,#B8955A); background: transparent; }

/* ── 5. ACTIONS DROITE ────────────────────────────────────────── */
.nav-actions {
  display: flex;
  align-items: center;
  gap: .65rem;
  flex-shrink: 0;
}
.nav-tel {
  font-family: var(--mono,'Space Mono',monospace);
  font-size: .67rem;
  letter-spacing: .09em;
  color: var(--muted,#8F8478);
  text-decoration: none;
  white-space: nowrap;
  transition: color .22s;
}
.nav-tel:hover { color: var(--stone,#E8E2D9); }

/* Urgence — sobre, contour rouge */
.nav-urgence {
  display: inline-flex;
  align-items: center;
  padding: .44rem .85rem;
  border: 1px solid rgba(185,65,65,.45);
  color: #cc8080;
  font-family: var(--mono,'Space Mono',monospace);
  font-size: .6rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  border-radius: 1px;
  transition: border-color .22s, color .22s, background .22s;
}
.nav-urgence:hover {
  border-color: rgba(185,65,65,.85);
  background: rgba(185,65,65,.1);
  color: #e09090;
}

/* Devis — CTA or plein */
.nav-devis {
  display: inline-flex;
  align-items: center;
  padding: .52rem 1.2rem;
  background: var(--or,#B8955A);
  color: var(--ch,#0E0C0A);
  font-family: var(--mono,'Space Mono',monospace);
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  border-radius: 1px;
  box-shadow: 0 4px 18px rgba(184,149,90,.3);
  transition: background .22s, color .22s,
              transform .2s cubic-bezier(.34,1.56,.64,1), box-shadow .22s;
}
.nav-devis:hover {
  background: var(--or2,#D4AD72);
  color: var(--ch,#0E0C0A);
  transform: translateY(-2px);
  box-shadow: 0 10px 32px rgba(184,149,90,.42);
}

/* Burger — masqué desktop */
.nav-burger {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 42px; height: 42px;
  border-radius: 50%;
  border: 1px solid rgba(232,226,217,.18);
  background: transparent;
  padding: 0;
  cursor: pointer;
  flex-shrink: 0;
  position: relative;
  z-index: 902;
}
.nav-burger span {
  display: block;
  height: 1.5px; width: 18px;
  background: var(--stone,#E8E2D9);
  border-radius: 1px;
  transition: transform .28s cubic-bezier(.19,1,.22,1), opacity .22s, width .22s;
}
.nav-burger.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.nav-burger.open span:nth-child(2) { opacity: 0; width: 0; }
.nav-burger.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* ── 6. DRAWER MOBILE ─────────────────────────────────────────── */
.nav-drawer {
  position: fixed;
  inset: 0;
  z-index: 901;
  background: rgba(10,8,6,.98);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding-top: calc(env(safe-area-inset-top,0px) + 5rem);
  padding-right: max(var(--gutter,1.5rem), env(safe-area-inset-right,0px));
  padding-bottom: calc(env(safe-area-inset-bottom,0px) + 2.5rem);
  padding-left: max(var(--gutter,1.5rem), env(safe-area-inset-left,0px));
  gap: 0;
  /* Fermé — slide droite */
  transform: translateX(100%);
  visibility: hidden;
  pointer-events: none;
  transition: transform .42s cubic-bezier(.19,1,.22,1),
              visibility 0s linear .42s;
}
.nav-drawer.open {
  transform: translateX(0);
  visibility: visible;
  pointer-events: auto;
  transition: transform .42s cubic-bezier(.19,1,.22,1),
              visibility 0s linear 0s;
}
.nav-drawer[inert] { pointer-events: none; visibility: hidden; }

/* Scroll lock */
html.menu-open,
html.menu-open body { overflow: hidden; }

/* ── 7. CLOSE BUTTON ──────────────────────────────────────────── */
.nav-drawer-close {
  position: fixed;
  top: calc(env(safe-area-inset-top,0px) + 1rem);
  right: calc(max(var(--gutter,1.5rem), env(safe-area-inset-right,0px)));
  z-index: 903;
  width: 48px; height: 48px;
  border-radius: 50%;
  border: 1px solid rgba(184,149,90,.45);
  background: rgba(20,17,14,.85);
  cursor: pointer;
  display: grid;
  place-items: center;
  opacity: 0;
  pointer-events: none;
  transform: scale(.85);
  transition: opacity .3s, transform .3s cubic-bezier(.34,1.56,.64,1),
              background .22s, border-color .22s;
}
.nav-drawer.open .nav-drawer-close {
  opacity: 1;
  pointer-events: auto;
  transform: scale(1);
}
.nav-drawer-close:hover {
  background: rgba(184,149,90,.12);
  border-color: rgba(184,149,90,.7);
}
/* Croix via ::before / ::after — 1 seul <span> requis */
.nav-drawer-close span {
  position: relative;
  display: block;
  width: 18px; height: 18px;
  pointer-events: none;
}
.nav-drawer-close span::before,
.nav-drawer-close span::after {
  content: '';
  position: absolute;
  top: 50%; left: 0;
  width: 100%;
  height: 1.5px;
  background: var(--stone2,#F4F0EB);
  border-radius: 1px;
}
.nav-drawer-close span::before { transform: translateY(-50%) rotate(45deg); }
.nav-drawer-close span::after  { transform: translateY(-50%) rotate(-45deg); }

/* ── 8. LIENS DRAWER ──────────────────────────────────────────── */
.nav-drawer a {
  font-family: var(--serif,'Playfair Display',Georgia,serif);
  font-size: clamp(1.75rem, 7vw, 3rem);
  font-weight: 400;
  color: var(--stone2,#F4F0EB);
  padding: .4rem 0;
  border-bottom: 1px solid rgba(232,226,217,.07);
  text-decoration: none;
  line-height: 1.2;
  transition: color .22s, padding-left .3s cubic-bezier(.19,1,.22,1);
}
.nav-drawer a:hover { color: var(--or,#B8955A); padding-left: .65rem; }

.nav-drawer .drawer-phone {
  font-family: var(--mono,'Space Mono',monospace);
  font-size: clamp(.95rem,3.5vw,1.2rem);
  font-weight: 700;
  color: var(--or,#B8955A);
  letter-spacing: .06em;
  margin-top: 1.8rem;
  padding: .4rem 0;
  border-bottom: none;
}
.nav-drawer .drawer-phone:hover { color: var(--or2,#D4AD72); padding-left: 0; }

.nav-drawer .drawer-devis {
  display: inline-flex;
  align-items: center;
  margin-top: .8rem;
  padding: .9rem 1.8rem;
  background: var(--or,#B8955A);
  color: var(--ch,#0E0C0A);
  font-family: var(--mono,'Space Mono',monospace);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  text-decoration: none;
  border-bottom: none;
  width: fit-content;
  box-shadow: 0 4px 24px rgba(184,149,90,.3);
  transition: background .22s;
}
.nav-drawer .drawer-devis:hover {
  background: var(--or2,#D4AD72);
  color: var(--ch,#0E0C0A);
  padding-left: 1.8rem;
}

/* ── 9. FOCUS ─────────────────────────────────────────────────── */
.nav-burger:focus-visible,
.nav-devis:focus-visible,
.nav-urgence:focus-visible,
.nav-tel:focus-visible,
.nav-links a:focus-visible,
.nav-brand:focus-visible,
.nav-drawer a:focus-visible,
.nav-drawer-close:focus-visible {
  outline: 2px solid var(--or,#B8955A);
  outline-offset: 4px;
}

/* ╔══════════════════════════════════════════════════════════════╗
   ║  RESPONSIVE                                                  ║
   ╚══════════════════════════════════════════════════════════════╝ */

@media (max-width: 1280px) {
  .nav-links a { padding-inline: .6rem; }
}

@media (max-width: 1100px) {
  .nav-links a { padding-inline: .5rem; font-size: .61rem; }
  .nav-tel { display: none; }
  .nav-actions { gap: .55rem; }
}

@media (max-width: 1000px) {
  .nav-links a[href*="recrutement"] { display: none; }
}

/* ── 960px : BASCULE MOBILE ──────────────────────────────────── */
@media (max-width: 960px) {
  :root { --nav-h: 68px; }
  .nav { background: rgba(14,12,10,.97); border-bottom-color: rgba(184,149,90,.15); }
  .nav.stuck { background: rgba(14,12,10,.99); }
  .nav-links  { display: none; }
  .nav-urgence { display: none; }
  .nav-tel    { display: none; }
  .nav-burger { display: flex; }
  .nav-actions { gap: .5rem; }
  .nav-row { gap: 1rem; }
}

@media (max-width: 480px) {
  .nav-devis { display: none; }
  .nav-brand-img  { width: 40px; height: 40px; }
  .nav-brand-name { font-size: .95rem; }
  .nav-brand-tag  { font-size: .54rem; letter-spacing: .18em; }
}

@media (max-width: 360px) {
  .nav-brand-tag { display: none; }
  .nav-brand-img { width: 36px; height: 36px; }
}