/* ═══════════════════════════════════════════════════════════
   WILDEN-MENU.CSS
   Feuille de style PARTAGÉE pour le header / menu de navigation.
   Toutes les pages du site incluent ce fichier. Une modification
   ici s'applique donc immédiatement à toutes les pages.
   ═══════════════════════════════════════════════════════════ */

/* ─── HEADER ─── */
header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 999;
  background: rgba(253, 250, 244, 0.96);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1.5px solid var(--vert-pale);
  padding: 0 5%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 72px;
  box-shadow: 0 2px 20px rgba(45,106,79,0.07);
  transition: top 0.6s cubic-bezier(0.4, 0, 0.2, 1), box-shadow .3s;
  margin-top: 0;
}

.logo-wrap {
  display: flex;
  align-items: center;
  gap: 12px;
}
.logo-wrap img {
  height: 62px;
  width: auto;
  object-fit: contain;
  transition: transform .4s cubic-bezier(.34,1.56,.64,1), filter .4s ease;
}
.logo-wrap:hover img {
  transform: scale(1.08) rotate(-3deg);
  filter: drop-shadow(0 4px 10px rgba(45,106,79,.35));
}

/* ─── NAV DESKTOP ─── */
nav { display: flex; align-items: center; gap: 2px; }

nav a {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--sombre);
  padding: 8px 14px;
  border-radius: 10px;
  transition: var(--transition);
}
nav a:hover { background: var(--vert-pale); color: var(--vert); }

.btn-nav {
  background: var(--vert) !important;
  color: var(--blanc) !important;
  padding: 9px 22px !important;
  border-radius: var(--rayon-pill) !important;
  font-weight: 700 !important;
  margin-left: 8px;
  box-shadow: 0 3px 12px rgba(45,106,79,0.25);
}
.btn-nav:hover {
  background: var(--sombre) !important;
  transform: translateY(-1px);
}

/* ─── BURGER (mobile) ─── */
.burger {
  display: none;
  flex-direction: column;
  gap: 5px;
  padding: 6px;
}
.burger span {
  display: block;
  width: 24px; height: 2px;
  background: var(--vert);
  border-radius: 2px;
  transition: .3s;
}

/* ─── MENU MOBILE ─── */
.mobile-nav {
  display: none;
  flex-direction: column;
  position: fixed;
  top: 72px; left: 0; right: 0;
  background: var(--beige);
  padding: 16px 5% 24px;
  border-bottom: 2px solid var(--vert-pale);
  z-index: 998;
  box-shadow: 0 6px 30px rgba(0,0,0,0.10);
}
.mobile-nav.open { display: flex; }
.mobile-nav a {
  padding: 13px 0;
  font-weight: 600;
  font-size: 1rem;
  color: var(--sombre);
  border-bottom: 1px solid rgba(0,0,0,0.05);
}

/* ─── BASCULE DESKTOP / MOBILE ─── */
@media (max-width: 900px) {
  nav     { display: none; }
  .burger { display: flex; }
}