/* ============================================================
   PPC VITRINE — Navigation CSS
   ============================================================ */

/* ── NAV ────────────────────────────────────────────────────── */
.nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 500;
  transition: all 0.35s ease;
}
.nav.scrolled {
  background: rgba(7,7,9,0.9);
  backdrop-filter: blur(24px) saturate(1.5);
  border-bottom: 1px solid var(--bordure);
}
.nav__inner {
  display: flex; align-items: center; gap: 32px;
  max-width: 1180px; margin: 0 auto; padding: 22px 32px;
  transition: padding 0.35s;
}
.nav.scrolled .nav__inner { padding: 14px 32px; }

/* Logo */
.nav__logo {
  text-decoration: none; display: flex; flex-direction: column;
  line-height: 1; flex-shrink: 0;
}
.nav__logo-ppc {
  font-family: var(--font-display);
  font-size: 1.7rem; font-weight: 700; letter-spacing: 0.05em;
  background: var(--grad-or); background-size: 200% auto;
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text; animation: shimmer 4s linear infinite;
}
.nav__logo-sub {
  font-size: 0.52rem; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--texte-mute); font-weight: 500;
}

/* Liens */
.nav__links {
  display: flex; gap: 28px; margin-left: auto;
  list-style: none;
}
.nav__links li { line-height: 1; }
.nav__link {
  text-decoration: none; color: var(--texte-dim);
  font-size: 0.875rem; font-weight: 400; letter-spacing: 0.01em;
  transition: color 0.2s; position: relative; padding-bottom: 2px;
}
.nav__link::after {
  content: ''; position: absolute; bottom: -2px; left: 0; right: 0;
  height: 1px; background: var(--or);
  transform: scaleX(0); transform-origin: left; transition: transform 0.3s;
}
.nav__link:hover { color: var(--texte); }
.nav__link:hover::after, .nav__link--active::after { transform: scaleX(1); }
.nav__link--active { color: var(--or-light); }

/* CTAs */
.nav__ctas { display: flex; gap: 10px; flex-shrink: 0; }

/* Burger */
.nav__burger {
  display: none; flex-direction: column; gap: 5px;
  background: none; border: none; cursor: pointer; padding: 6px;
}
.nav__burger span {
  display: block; width: 22px; height: 1.5px;
  background: var(--texte); border-radius: 2px; transition: all 0.3s;
}
.nav__burger.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.nav__burger.open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.nav__burger.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* ── MOBILE MENU ────────────────────────────────────────────── */
.mobile-menu {
  display: none; position: fixed; inset: 0; z-index: 490;
  background: rgba(7,7,9,0.97); backdrop-filter: blur(20px);
  flex-direction: column; align-items: center; justify-content: center; gap: 28px;
  opacity: 0; transition: opacity 0.3s;
}
.mobile-menu.open { display: flex; opacity: 1; }
.mobile-menu nav {
  display: flex; flex-direction: column; align-items: center; gap: 24px;
}
.mobile-menu a {
  font-family: var(--font-display);
  font-size: 2.2rem; font-weight: 600;
  color: var(--texte); text-decoration: none; transition: color 0.2s;
}
.mobile-menu a:hover { color: var(--or-light); }
.mobile-menu__sep {
  width: 60px; height: 1px; background: var(--bordure); margin: 8px 0;
}
.mobile-menu__ado    { color: #FF9ACD !important; font-size: 1.4rem !important; }
.mobile-menu__adulte { color: var(--or-light) !important; font-size: 1.4rem !important; }
.mobile-menu__close {
  position: absolute; top: 24px; right: 32px;
  background: none; border: none; cursor: pointer;
  font-size: 1.5rem; color: var(--texte-dim); padding: 8px;
  transition: color 0.2s;
}
.mobile-menu__close:hover { color: var(--texte); }

/* ── RESPONSIVE ─────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .nav__links { display: none; }
  .nav__ctas  { display: none; }
  .nav__burger { display: flex; }
  .nav__inner { padding: 18px 24px; }
}