/* ============================================
   HEADER — Archiprogramme
   ============================================ */

:root {
  --ap-signal:  #EA6928;
  --ap-carnet:  #EFE9DD;
  --ap-nuit:    #0D0D0D;
  --ap-blanc:   #FFFFFF;
  --ap-header-h: 80px;
}

.ap-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1000;
  height: var(--ap-header-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 40px;
  transition: background 0.3s;
}

.admin-bar .ap-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .ap-header { top: 46px; } }

body { padding-top: var(--ap-header-h) !important; }

/* ── Logo ── */
.ap-header__logo {
  display: flex;
  align-items: center;
  text-decoration: none !important;
  line-height: 0;
  z-index: 1001;
} 

.ap-logo-svg {
  width: 56px;
  height: 53px;
  display: block;
  overflow: visible;
} 

.ap-header--light  .ap-logo-svg path { fill: var(--ap-signal); transition: fill 0.3s; }
.ap-header--dark   .ap-logo-svg path { fill: var(--ap-blanc);  transition: fill 0.3s; }
.ap-header--signal .ap-logo-svg path { fill: var(--ap-blanc);  transition: fill 0.3s; }
.ap-header.is-open .ap-logo-svg path { fill: var(--ap-carnet) !important; transition: fill 0.3s; }

/* ── Burger ── */
.ap-header__burger {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  width: 56px;
  height: 56px;
  cursor: pointer;
  padding: 8px;
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  z-index: 1001;
}

.ap-burger__line {
  display: block;
  width: 34px;
  height: 2px;
  border-radius: 2px;
  transition: background-color 0.3s, transform 0.35s cubic-bezier(.77,0,.18,1), opacity 0.2s;
}

.ap-header--light  .ap-burger__line { background: var(--ap-signal); }
.ap-header--dark   .ap-burger__line { background: var(--ap-blanc); }
.ap-header--signal .ap-burger__line { background: var(--ap-blanc); }

.ap-header.is-open .ap-burger__line                { background: var(--ap-carnet) !important; }
.ap-header.is-open .ap-burger__line:nth-child(1)   { transform: translateY(10px) rotate(45deg); }
.ap-header.is-open .ap-burger__line:nth-child(2)   { opacity: 0; }
.ap-header.is-open .ap-burger__line:nth-child(3)   { transform: translateY(-10px) rotate(-45deg); }

/* ============================================
   OVERLAY — animation depuis la droite
   ============================================ */

.ap-nav-overlay {
  position: fixed;
  inset: 0;
  background: var(--ap-signal);
  z-index: 999;
  display: flex;
  align-items: flex-end;
  padding: 60px 60px 80px;
  /* Masqué : clipPath depuis la droite */
  clip-path: inset(0 100% 0 0);
  transition: clip-path 0.6s cubic-bezier(.77,0,.18,1);
  pointer-events: none;
}

.ap-nav-overlay.is-open {
  clip-path: inset(0 0% 0 0);
  pointer-events: all;
}

/* Liste */
.ap-nav-overlay__list {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.ap-nav-overlay__list li {
  line-height: 1.15;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  /* Liens apparaissent avec un léger délai */
  opacity: 0;
  transform: translateX(30px);
  transition: opacity 0.4s ease, transform 0.4s ease;
}

.ap-nav-overlay.is-open .ap-nav-overlay__list li:nth-child(1) { opacity: 1; transform: none; transition-delay: 0.25s; }
.ap-nav-overlay.is-open .ap-nav-overlay__list li:nth-child(2) { opacity: 1; transform: none; transition-delay: 0.32s; }
.ap-nav-overlay.is-open .ap-nav-overlay__list li:nth-child(3) { opacity: 1; transform: none; transition-delay: 0.38s; }
.ap-nav-overlay.is-open .ap-nav-overlay__list li:nth-child(4) { opacity: 1; transform: none; transition-delay: 0.44s; }
.ap-nav-overlay.is-open .ap-nav-overlay__list li:nth-child(5) { opacity: 1; transform: none; transition-delay: 0.50s; }

.ap-nav-overlay__list li a,
.ap-nav-overlay__list li a:visited {
  font-family: 'Epilogue', sans-serif !important;
  font-weight: 700 !important;
  font-size: clamp(44px, 6.5vw, 76px) !important;
  line-height: 1.15 !important;
  text-transform: uppercase !important;
  letter-spacing: -0.02em !important;
  color: var(--ap-carnet) !important;
  text-decoration: none !important;
  display: block;
  opacity: 0.6;
  transition: opacity 0.2s ease, color 0.2s ease;
}

.ap-nav-overlay__list li a:hover { opacity: 1 !important; color: var(--ap-blanc) !important; }

.ap-nav-overlay__list .current-menu-item a,
.ap-nav-overlay__list .current_page_item a {
  opacity: 1 !important;
  font-weight: 900 !important;
  color: var(--ap-blanc) !important;
}

/* ============================================
   RESPONSIVE
   ============================================ */
@media (max-width: 767px) {
  .ap-header { padding: 0 20px; }
  .ap-nav-overlay { padding: 60px 28px 60px; }
  .ap-nav-overlay__list { gap: 14px; }
  .ap-nav-overlay__list li a { font-size: clamp(44px, 11vw, 60px) !important; }
}