/* Disposable KOUM motion V2. Load after the complete baseline cascade.
   Keep the existing menu layout, type scale and controller. Only motion changes.
   The scope and menu ancestor intentionally outrank the legacy important locks. */
body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]) {
  --v2-menu-panel-enter-y: 8px;
  --v2-menu-row-enter-y: 18px;
  --v2-menu-row-enter-duration: 360ms;
}

/* A short fade replaces the full-screen clipped curtain. Visibility remains
   available during the exit; the existing controller makes the dialog inert. */
body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]) .c-motion-menu {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  clip-path: none !important;
  filter: none !important;
  animation: none !important;
  transition:
    opacity 200ms var(--v2-ease-scene, cubic-bezier(.37, 0, .63, 1)),
    visibility 0s linear 220ms !important;
  will-change: opacity;
}

body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]).c-motion-menu-open .c-motion-menu {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transition:
    opacity 200ms var(--v2-ease-out, cubic-bezier(.22, 1, .36, 1)),
    visibility 0s linear 0s !important;
}

body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]) .c-motion-menu .c-motion-menu-panel {
  opacity: 1 !important;
  transform: translateY(var(--v2-menu-panel-enter-y)) !important;
  clip-path: none !important;
  filter: none !important;
  animation: none !important;
  transition: transform 220ms var(--v2-ease-scene, cubic-bezier(.37, 0, .63, 1)) !important;
  will-change: transform;
}

body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]).c-motion-menu-open .c-motion-menu .c-motion-menu-panel {
  transform: translateY(0) !important;
  transition: transform 280ms var(--v2-ease-out, cubic-bezier(.22, 1, .36, 1)) !important;
}

/* Five crisp rows arrive every 50ms. Color feedback has no entry delay.
   Use the open class throughout: the baseline ready class arrives at 1020ms,
   after this entire sequence, and must not restart or lengthen transitions. */
body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]) .c-motion-menu .c-motion-menu-nav {
  perspective: none !important;
}

body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]) .c-motion-menu .c-motion-menu-nav a {
  opacity: 0 !important;
  transform: translateY(var(--v2-menu-row-enter-y)) !important;
  transform-style: flat !important;
  clip-path: none !important;
  filter: none !important;
  animation: none !important;
  transition:
    opacity 160ms var(--v2-ease-scene, cubic-bezier(.37, 0, .63, 1)) 0s,
    transform 180ms var(--v2-ease-scene, cubic-bezier(.37, 0, .63, 1)) 0s,
    color 180ms var(--v2-ease-out, cubic-bezier(.22, 1, .36, 1)) 0s !important;
  transition-delay: 0s !important;
  will-change: opacity, transform;
}

body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]).c-motion-menu-open .c-motion-menu .c-motion-menu-nav a {
  --v2-menu-row-delay: 100ms;
  opacity: 1 !important;
  transform: translateY(0) !important;
  transition:
    opacity 260ms var(--v2-ease-out, cubic-bezier(.22, 1, .36, 1)) var(--v2-menu-row-delay),
    transform var(--v2-menu-row-enter-duration) var(--v2-ease-out, cubic-bezier(.22, 1, .36, 1)) var(--v2-menu-row-delay),
    color 180ms var(--v2-ease-out, cubic-bezier(.22, 1, .36, 1)) 0s !important;
  transition-delay: var(--v2-menu-row-delay), var(--v2-menu-row-delay), 0s !important;
}

body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]).c-motion-menu-open .c-motion-menu .c-motion-menu-nav a:nth-child(1) { --v2-menu-row-delay: 100ms; }
body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]).c-motion-menu-open .c-motion-menu .c-motion-menu-nav a:nth-child(2) { --v2-menu-row-delay: 150ms; }
body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]).c-motion-menu-open .c-motion-menu .c-motion-menu-nav a:nth-child(3) { --v2-menu-row-delay: 200ms; }
body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]).c-motion-menu-open .c-motion-menu .c-motion-menu-nav a:nth-child(4) { --v2-menu-row-delay: 250ms; }
body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]).c-motion-menu-open .c-motion-menu .c-motion-menu-nav a:nth-child(5) { --v2-menu-row-delay: 300ms; }

/* The close button is visible immediately because the controller focuses it
   on opening. The footer resolves just after the last row begins. */
body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]) .c-motion-menu .c-motion-menu-close {
  opacity: 0 !important;
  transform: none !important;
  animation: none !important;
  transition: opacity 140ms var(--v2-ease-out, cubic-bezier(.22, 1, .36, 1)) 0s !important;
}

body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]).c-motion-menu-open .c-motion-menu .c-motion-menu-close {
  opacity: 1 !important;
}

body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]) .c-motion-menu .c-motion-menu-meta,
body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]) .c-motion-menu .c-motion-menu-foot,
body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]) .c-motion-menu .kc-primary-menu__signature {
  opacity: 0 !important;
  transform: translateY(6px) !important;
  animation: none !important;
  transition:
    opacity 140ms var(--v2-ease-scene, cubic-bezier(.37, 0, .63, 1)) 0s,
    transform 180ms var(--v2-ease-scene, cubic-bezier(.37, 0, .63, 1)) 0s !important;
}

body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]).c-motion-menu-open .c-motion-menu .c-motion-menu-meta,
body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]).c-motion-menu-open .c-motion-menu .c-motion-menu-foot,
body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]).c-motion-menu-open .c-motion-menu .kc-primary-menu__signature {
  opacity: 1 !important;
  transform: translateY(0) !important;
  transition:
    opacity 220ms var(--v2-ease-out, cubic-bezier(.22, 1, .36, 1)) 320ms,
    transform 260ms var(--v2-ease-out, cubic-bezier(.22, 1, .36, 1)) 320ms !important;
}

body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]).c-motion-menu-open .c-motion-menu .kc-primary-menu__signature {
  opacity: .65 !important;
}

/* Animate the parent footer once, keeping the nested video control stable. */
body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]) .c-motion-menu .c-motion-video-control-menu {
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
  transition: none !important;
}

/* Retain the existing yellow hover/focus colors and focus outline. Text stays
   in place; only the small direction arrow travels by 3px on fine pointers. */
body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]) .c-motion-menu .c-motion-menu-nav a strong {
  transform: none !important;
  animation: none !important;
  transition: color 180ms var(--v2-ease-out, cubic-bezier(.22, 1, .36, 1)) 0s !important;
}

body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]) .c-motion-menu .c-motion-menu-nav a > i {
  transform: none !important;
  transition: transform 180ms var(--v2-ease-out, cubic-bezier(.22, 1, .36, 1)) 0s !important;
}

body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]) .c-motion-menu-toggle::before {
  transform: translate(-50%, -50%) !important;
  animation: none !important;
  transition: opacity 140ms var(--v2-ease-out, cubic-bezier(.22, 1, .36, 1)) !important;
}

@media (hover: hover) and (pointer: fine) {
  body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]).c-motion-menu-open .c-motion-menu .c-motion-menu-nav a:is(:hover, :focus-visible) > i {
    transform: translateX(3px) !important;
  }
}

@media (max-width: 700px) {
  body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]) {
    --v2-menu-panel-enter-y: 6px;
    --v2-menu-row-enter-y: 12px;
    --v2-menu-row-enter-duration: 320ms;
  }
}

/* Match the strongest open/nth-child rules so reduced motion also cancels
   stagger delays. Geometry, colors and dialog focus behavior are unchanged. */
@media (prefers-reduced-motion: reduce) {
  body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]):is(.c-motion-menu-open, :not(.c-motion-menu-open)) .c-motion-menu,
  body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]):is(.c-motion-menu-open, :not(.c-motion-menu-open)) .c-motion-menu .c-motion-menu-panel,
  body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]):is(.c-motion-menu-open, :not(.c-motion-menu-open)) .c-motion-menu .c-motion-menu-nav a:nth-child(n),
  body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]):is(.c-motion-menu-open, :not(.c-motion-menu-open)) .c-motion-menu .c-motion-menu-nav a strong,
  body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]):is(.c-motion-menu-open, :not(.c-motion-menu-open)) .c-motion-menu .c-motion-menu-nav a:nth-child(n) > i,
  body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]):is(.c-motion-menu-open, :not(.c-motion-menu-open)) .c-motion-menu .c-motion-menu-close,
  body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]):is(.c-motion-menu-open, :not(.c-motion-menu-open)) .c-motion-menu .c-motion-menu-meta,
  body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]):is(.c-motion-menu-open, :not(.c-motion-menu-open)) .c-motion-menu .c-motion-menu-foot,
  body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]):is(.c-motion-menu-open, :not(.c-motion-menu-open)) .c-motion-menu .kc-primary-menu__signature,
  body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]) .c-motion-menu-toggle::before {
    animation: none !important;
    transition: none !important;
    transition-delay: 0s !important;
    will-change: auto;
  }

  body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]):is(.c-motion-menu-open, :not(.c-motion-menu-open)) .c-motion-menu .c-motion-menu-panel,
  body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]):is(.c-motion-menu-open, :not(.c-motion-menu-open)) .c-motion-menu .c-motion-menu-nav a:nth-child(n),
  body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]):is(.c-motion-menu-open, :not(.c-motion-menu-open)) .c-motion-menu .c-motion-menu-nav a:nth-child(n) > i,
  body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]):is(.c-motion-menu-open, :not(.c-motion-menu-open)) .c-motion-menu .c-motion-menu-meta,
  body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]):is(.c-motion-menu-open, :not(.c-motion-menu-open)) .c-motion-menu .c-motion-menu-foot,
  body.concept-c[data-motion-lab-v2="true"]:not([data-motion-variant="original"]):is(.c-motion-menu-open, :not(.c-motion-menu-open)) .c-motion-menu .kc-primary-menu__signature {
    transform: none !important;
  }
}