/* Studio motion enhances the shared header without changing its DOM or geometry.
 * Never transform/filter the header: its fixed mega menus rely on the viewport. */
.vh-studio .vh-header::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(110deg, transparent 20%, rgba(255,255,255,.04) 40%, rgba(255,255,255,.65) 48%, rgba(124,58,237,.06) 51%, rgba(6,182,212,.06) 54%, transparent 65%);
  background-size: 280% 100%;
  animation: studio-header-light 8s cubic-bezier(.22,1,.36,1) infinite;
}
.vh-studio .vh-header.is-scrolled {
  box-shadow: 0 12px 40px rgba(44,40,37,.13), inset 0 1px 0 rgba(255,255,255,.9);
}
.vh-studio .vh-header__brand .vh-brand {
  animation: studio-header-arrive .7s cubic-bezier(.22,1,.36,1) both;
}
.vh-studio .vh-header__brand .vh-logo-glow {
  animation: studio-logo-breathe 6s ease-in-out infinite;
}
.vh-studio .vh-nav .s-nav-link {
  font-weight: var(--vh-weight-bold);
  transition: transform .42s cubic-bezier(.22,1,.36,1), background-position .7s ease;
}
.vh-studio .vh-nav .s-nav-link::after {
  height: 3px;
  background-size: 220% 100%;
  transition: width .42s cubic-bezier(.22,1,.36,1), background-position .7s ease;
}
.vh-studio .vh-nav .s-nav-link:where(:hover,:focus-visible)::after {
  width: 100%;
  background-position: 100% 50%;
}
.vh-studio .vh-nav .s-nav-link:focus-visible {
  background: var(--vivid-gradient-main);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
}
.vh-studio .vh-mobile-drawer.is-open .vh-mobile-drawer__link {
  animation: studio-header-arrive .5s cubic-bezier(.22,1,.36,1) both;
}
.vh-studio .vh-mobile-drawer.is-open li:nth-child(2) .vh-mobile-drawer__link { animation-delay: .05s; }
.vh-studio .vh-mobile-drawer.is-open li:nth-child(3) .vh-mobile-drawer__link { animation-delay: .1s; }
.vh-studio .vh-mobile-drawer.is-open li:nth-child(4) .vh-mobile-drawer__link { animation-delay: .15s; }
.vh-studio .vh-mobile-drawer.is-open li:nth-child(5) .vh-mobile-drawer__link { animation-delay: .2s; }
@keyframes studio-header-light {
  0%, 12% { background-position: 120% 50%; }
  58%, 100% { background-position: -20% 50%; }
}
@keyframes studio-logo-breathe {
  0%, 100% { opacity: .3; transform: scale(.95); }
  50% { opacity: .55; transform: scale(1.08); }
}
@keyframes studio-header-arrive {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
/* Keep every shared header control reachable on narrow phones. */
@media (max-width: 380px) {
  .vh-studio .vh-header__inner { padding-inline: 6px; }
  .vh-studio .vh-header__brand .vh-logo img { height: 28px; }
  .vh-studio .vh-lang__toggle { min-width: 44px; width: 44px !important; padding-inline: 0 !important; justify-content: center; }
  .vh-studio .vh-lang__caret { display: none; }
}
.vh-studio.studio-motion-paused :is(.vh-header,.vh-promo-bar,.vh-mobile-drawer) *,
.vh-studio.studio-motion-paused :is(.vh-header,.vh-promo-bar,.vh-mobile-drawer) *::before,
.vh-studio.studio-motion-paused :is(.vh-header,.vh-promo-bar,.vh-mobile-drawer) *::after,
.vh-studio.studio-motion-paused .vh-header::after { animation-play-state: paused !important; }
.vh-studio.studio-motion-paused .vh-header__brand .vh-brand,
.vh-studio.studio-motion-paused .vh-mobile-drawer__link {
  animation: none !important;
  opacity: 1;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  .vh-studio :is(.vh-header,.vh-promo-bar,.vh-mobile-drawer) *,
  .vh-studio :is(.vh-header,.vh-promo-bar,.vh-mobile-drawer) *::before,
  .vh-studio :is(.vh-header,.vh-promo-bar,.vh-mobile-drawer) *::after,
  .vh-studio .vh-header::after { animation: none !important; transition-duration: .01ms !important; }
}