/* Header — masqué au scroll bas, visible au scroll haut (toutes les pages new_landing) */
.site-header {
  transform: translate3d(0, 0, 0);
  -webkit-transform: translate3d(0, 0, 0);
  transition: transform 0.32s cubic-bezier(0.23, 1, 0.32, 1);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.site-header.site-header--hidden {
  transform: translate3d(0, calc(-100% - 1px), 0);
  -webkit-transform: translate3d(0, calc(-100% - 1px), 0);
  pointer-events: none;
}

/* Transition cross-pages landing ↔ engagement */

@view-transition {
  navigation: auto;
}

::view-transition-old(root),
::view-transition-new(root) {
  animation-duration: 0.42s;
  animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
}

html:not(.page-no-enter) body {
  animation: page-enter 0.48s cubic-bezier(0.23, 1, 0.32, 1) both;
}

@keyframes page-enter {
  from { opacity: 0; }
  to { opacity: 1; }
}

body.page-leaving {
  opacity: 0 !important;
  transition: opacity 0.34s cubic-bezier(0.4, 0, 1, 1);
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .site-header { transition: none; }
  .site-header.site-header--hidden {
    transform: none;
    pointer-events: auto;
  }
  @view-transition { navigation: none; }
  ::view-transition-old(root),
  ::view-transition-new(root) { animation: none; }
  html:not(.page-no-enter) body { animation: none; }
  body.page-leaving {
    opacity: 1 !important;
    transition: none;
  }
}

/* Scrollbar verticale — new_landing */
html {
  scrollbar-width: thin;
  scrollbar-color: rgba(139, 92, 246, 0.55) rgba(18, 18, 36, 0.92);
}

html::-webkit-scrollbar {
  width: 9px;
}

html::-webkit-scrollbar-track {
  background: rgba(18, 18, 36, 0.92);
  border-left: 0.5px solid rgba(139, 92, 246, 0.08);
}

html::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(124, 58, 237, 0.72), rgba(109, 40, 217, 0.58));
  border-radius: 999px;
  border: 2px solid rgba(18, 18, 36, 0.92);
  background-clip: padding-box;
}

html::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, rgba(167, 139, 250, 0.88), rgba(124, 58, 237, 0.78));
  background-clip: padding-box;
}

html::-webkit-scrollbar-thumb:active {
  background: linear-gradient(180deg, rgba(196, 181, 253, 0.95), rgba(139, 92, 246, 0.85));
  background-clip: padding-box;
}

/* Tiroir nav / zones scroll internes */
.nav-panel--drawer {
  scrollbar-width: thin;
  scrollbar-color: rgba(139, 92, 246, 0.45) transparent;
}

.nav-panel--drawer::-webkit-scrollbar {
  width: 6px;
}

.nav-panel--drawer::-webkit-scrollbar-thumb {
  background: rgba(139, 92, 246, 0.4);
  border-radius: 999px;
}

.nav-panel--drawer::-webkit-scrollbar-thumb:hover {
  background: rgba(167, 139, 250, 0.65);
}