/* Homepage neon-motion hero. Loaded after front-page.css. */
.hero--motion {
  --hero-neon: linear-gradient(100deg, var(--blue), var(--purple) 35%, var(--violet) 58%, var(--purple) 78%, var(--blue));
  position: relative; isolation: isolate; display: block; width: 100%; height: 100svh;
  min-height: 36rem; max-height: 58rem; padding: 0; overflow: hidden;
  background: var(--void); border-bottom: 1px solid var(--line);
}
.hero--motion::after { display: none; }
.hero-logo-clip { position: absolute; pointer-events: none; }
.hero-atmosphere { position: absolute; z-index: -1; inset: 0; overflow: hidden; pointer-events: none; }
.hero-atmosphere__image { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 68% center; }
.hero-mist { position: absolute; border-radius: 50%; filter: blur(55px); opacity: .13; will-change: transform; animation: hero-mist-drift 17s ease-in-out infinite alternate; }
.hero-mist--blue { top: 23%; left: 36%; width: 40%; height: 50%; background: radial-gradient(ellipse, var(--blue), transparent 68%); }
.hero-mist--purple { top: 18%; right: -4%; width: 34%; height: 58%; background: radial-gradient(ellipse, var(--purple), transparent 68%); animation-duration: 23s; animation-delay: -7s; }
.hero-stars { position: absolute; inset: 0; }
.hero-star { position: absolute; top: var(--y); left: var(--x); width: var(--size); height: var(--size); background: #fff; border-radius: 50%; opacity: .05; box-shadow: 0 0 5px 1px rgba(200,201,255,.55); animation: hero-star-twinkle var(--duration) ease-in-out var(--delay) infinite; }
.hero-star:nth-child(3n) { box-shadow: 0 0 8px 1px rgba(45,123,255,.73); }
.hero-star:nth-child(4n) { box-shadow: 0 0 7px 1px rgba(168,85,255,.73); }
.hero-spectrum { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.hero-spectrum__paths { filter: drop-shadow(0 0 5px rgba(45,123,255,.8)); animation: hero-ambient-breathe 6.7s ease-in-out infinite alternate; }
.hero-spectrum-line { opacity: .2; transform-box: fill-box; transform-origin: center; animation: hero-spectrum-shimmer var(--duration) ease-in-out var(--delay) infinite alternate; }
.hero-light-threads { filter: drop-shadow(0 0 5px rgba(168,85,255,.8)); animation: hero-ambient-breathe 8.1s ease-in-out -3s infinite alternate; }

.hero-motion__inner { display: grid; grid-template-columns: 42% 58%; align-items: center; width: min(100%,1600px); height: 100%; padding: 5.6rem var(--section-pad) 0; margin: 0 auto; }
.hero-motion__copy { position: relative; z-index: 3; padding: 0 0 1.4svh clamp(0rem,3vw,3.5rem); }
.hero-motion__copy h1 { margin: 0; font-family: var(--display); font-size: min(4.6vw,9.2svh); font-weight: 800; letter-spacing: .04em; line-height: 1.03; }
.hero-heading-row { display: block; }
.hero-heading-row em { display: block; color: transparent; font-style: normal; background: var(--hero-neon); background-size: 240% 100%; background-clip: text; -webkit-background-clip: text; text-shadow: 0 0 24px rgba(168,85,255,.08); animation: hero-color-flow 8s ease-in-out infinite alternate; }
.hero-motion__description { margin-top: 3.6svh; color: #e1dfea; font-size: clamp(.65rem,1vw,.82rem); font-weight: 500; letter-spacing: .105em; line-height: 1.8; }
.hero-motion__description p { margin: 0; }
.hero-motion__description p + p { margin-top: 1.9svh; }
.hero--motion .hero__actions { display: flex; flex-wrap: wrap; gap: clamp(.8rem,1.65vw,1.75rem); margin-top: 4.3svh; }
.hero--motion .hero__actions .primary-link { min-width: 10.4rem; margin-top: 0; }

.hero-motion__art { position: relative; display: grid; min-width: 0; min-height: 0; height: 100%; place-items: center; transform: translate(-1.2vw,-2.5svh); }
.hero-logo { position: relative; flex: none; width: min(61%,calc((100svh - 5.6rem - 185px) * 1.1711)); aspect-ratio: 657 / 561; }
.hero-logo__power { position: absolute; inset: 0; filter: drop-shadow(-3px 0 5px rgba(45,123,255,.56)) drop-shadow(3px 0 6px rgba(168,85,255,.56)); }
.hero-logo__white { position: absolute; top: -22.04731495%; left: -11.74757282%; width: 121.74757282%; height: 142.58138207%; background: #fff; -webkit-mask: url("../images/hero-logo-white.webp") center / 100% 100% no-repeat; mask: url("../images/hero-logo-white.webp") center / 100% 100% no-repeat; }
.hero-logo__color { position: absolute; top: -22.04731495%; left: -11.74757282%; width: 121.74757282%; height: 142.58138207%; background: var(--hero-neon); background-size: 280% 100%; clip-path: url(#hero-logo-color-regions); -webkit-mask: url("../images/hero-logo-color.webp") center / 100% 100% no-repeat; mask: url("../images/hero-logo-color.webp") center / 100% 100% no-repeat; filter: drop-shadow(0 0 2px rgba(168,85,255,.33)); animation: hero-color-flow 7.4s ease-in-out infinite alternate; }
.hero-logo__waves { position: absolute; inset: 0; }
.hero-logo-wave { position: absolute; top: 44.56328%; width: 25.6%; height: 26%; color: var(--blue); filter: drop-shadow(0 0 5px rgba(45,123,255,.6)); transform: translateY(-50%); }
.hero-logo-wave--left { left: -.9%; }
.hero-logo-wave--right { right: -.9%; color: var(--violet); filter: drop-shadow(0 0 5px rgba(210,108,255,.6)); }
.hero-logo-wave__axis { position: absolute; top: 50%; right: 0; left: 0; height: 2px; background: currentColor; box-shadow: 0 0 5px currentColor; }
.hero-logo-wave__dot { position: absolute; top: 50%; right: -2px; width: 5px; height: 5px; background: currentColor; border-radius: 50%; box-shadow: 0 0 6px currentColor; transform: translateY(-50%); }
.hero-logo-wave--left .hero-logo-wave__dot { right: auto; left: -2px; }
.hero-logo-wave--right .hero-logo-wave__dot { right: -2px; left: auto; }
.hero-logo-wave__bars { position: absolute; inset: 0 14%; display: flex; align-items: center; justify-content: center; gap: 3px; }
.hero-logo-wave__bar { flex: 1; width: 100%; max-width: 3px; height: 100%; min-width: 0; background: currentColor; border-radius: 5px; box-shadow: 0 0 5px currentColor; transform: scaleY(var(--rest)); transform-origin: center; will-change: transform; animation: hero-wave-dance var(--speed) ease-in-out var(--delay) infinite; }
.hero-motion-toggle { position: absolute; z-index: 10; right: 18px; bottom: 16px; display: grid; width: 30px; height: 30px; padding: 7px; color: #c5bfdd; background: rgba(10,10,15,.55); border: 1px solid rgba(170,170,255,.17); border-radius: 50%; place-items: center; cursor: pointer; }
.hero-motion-toggle svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.4; }
.hero-motion-toggle:hover { border-color: var(--purple); }

.hero--motion.is-loading .hero-atmosphere,
.hero--motion.is-loading .hero-logo__power,
.hero--motion.is-loading .hero-logo__waves,
.hero--motion.is-loading .hero-motion__copy h1,
.hero--motion.is-loading .hero-motion__description,
.hero--motion.is-loading .hero__actions { opacity: 0; }
.hero--motion.is-ready .hero-atmosphere { animation: hero-atmosphere-arrive 1.5s .15s ease-out both; }
.hero--motion.is-ready .hero-logo__power { animation: hero-tube-start .72s 1.6s linear both; }
.hero--motion.is-ready .hero-motion__copy h1 { animation: hero-copy-arrive .78s 2.45s var(--ease) both; }
.hero--motion.is-ready .hero-motion__description { animation: hero-copy-arrive .72s 2.68s var(--ease) both; }
.hero--motion.is-ready .hero__actions { animation: hero-copy-arrive .72s 2.9s var(--ease) both; }
.hero--motion.is-ready .hero-logo__waves,
.hero--motion.is-ready .hero-spectrum { animation: hero-wave-arrive 2.4s 2.65s cubic-bezier(.2,.7,.3,1) both; }
.hero--motion.is-paused *, .hero--motion.is-paused *::before, .hero--motion.is-paused *::after { animation-play-state: paused !important; }
.hero--motion.is-audio-reactive .hero-logo-wave__bar { animation: none; transform: scaleY(var(--audio-level,var(--rest))); }
.hero--motion.is-lite .hero-mist { animation: none; filter: blur(34px); }
.hero--motion.is-lite .hero-spectrum__paths,
.hero--motion.is-lite .hero-light-threads { filter: none; }
.hero--motion.is-lite .hero-logo__power { filter: drop-shadow(0 0 4px rgba(168,85,255,.42)); }
.hero--motion.is-lite .hero-star { opacity: .22; animation: none; }
.hero--motion.is-lite .hero-star:nth-child(3n) { opacity: .38; }
.hero--motion.is-lite .hero-star:nth-child(4n) { opacity: .12; }
.hero--motion.is-lite .hero-logo-wave__bar { animation: none; transform: scaleY(var(--rest)); }

@keyframes hero-atmosphere-arrive { from { opacity: 0; transform: scale(1.025); } to { opacity: 1; transform: scale(1); } }
@keyframes hero-tube-start { 0%,8% { opacity: 0; } 9%,14% { opacity: .75; } 15%,25% { opacity: .04; } 26%,36% { opacity: .95; } 37%,47% { opacity: .25; } 48%,57% { opacity: .88; } 58%,67% { opacity: .38; } 68%,76% { opacity: .96; } 77%,82% { opacity: .72; } 83%,100% { opacity: 1; } }
@keyframes hero-copy-arrive { from { opacity: 0; transform: translateY(1.1rem); filter: blur(5px); } to { opacity: 1; transform: translateY(0); filter: blur(0); } }
@keyframes hero-wave-arrive { from { opacity: 0; clip-path: inset(0 48%); } to { opacity: 1; clip-path: inset(0); } }
@keyframes hero-color-flow { from { background-position: 0 50%; } to { background-position: 100% 50%; } }
@keyframes hero-mist-drift { to { opacity: .22; transform: translate(4%,-5%) scale(1.12); } }
@keyframes hero-star-twinkle { 0%,100% { opacity: .03; transform: scale(.6); } 13% { opacity: .12; } 29% { opacity: .8; transform: scale(1); } 43% { opacity: .07; } 67% { opacity: .28; transform: scale(.75); } 81% { opacity: .06; } }
@keyframes hero-ambient-breathe { to { opacity: .32; transform: translateY(4px); } }
@keyframes hero-spectrum-shimmer { to { opacity: .6; transform: scaleY(.48); } }
@keyframes hero-wave-dance { 0%,100% { transform: scaleY(var(--rest)); } 17% { transform: scaleY(var(--peak)); } 36% { transform: scaleY(var(--low)); } 53% { transform: scaleY(var(--mid)); } 71% { transform: scaleY(var(--peak)); } 88% { transform: scaleY(var(--low)); } }

@media (min-width: 681px) {
  .hero--motion.is-ready .hero-logo__power { animation-duration: 1.12s; }
  .hero--motion.is-ready .hero-motion__copy h1 { animation-delay: 2.85s; }
  .hero--motion.is-ready .hero-motion__description { animation-delay: 3.08s; }
  .hero--motion.is-ready .hero__actions { animation-delay: 3.3s; }
  .hero--motion.is-ready .hero-logo__waves,
  .hero--motion.is-ready .hero-spectrum { animation-delay: 2.9s; }
}

@media (min-width: 681px) and (max-width: 1100px) {
  .hero-motion__description { letter-spacing: .105em; }
  .hero--motion .hero__actions .primary-link { min-width: 0; width: 45%; }
  .hero-logo { width: 69%; }
}
@media (max-width: 680px) {
  .hero--motion { height: 100svh; min-height: 0; max-height: none; padding: 0; }
  .hero-motion__inner { grid-template-columns: minmax(0,1fr); grid-template-rows: minmax(0,1fr) auto; gap: clamp(4px,1.3svh,13px); height: 100%; padding: calc(4.5rem + 10px) 6vw max(52px,calc(env(safe-area-inset-bottom) + 32px)); }
  .hero-motion__art { grid-row: 1; width: 100%; height: 100%; min-height: 0; transform: none; container-type: size; }
  .hero-logo { width: min(76%,calc((100svh - 337px) * 1.1711)); max-width: 355px; }
  .hero-motion__copy { grid-row: 2; padding: 0; text-align: center; }
  .hero-motion__copy h1 { font-size: clamp(1.25rem,6.2vw,2.5rem); line-height: 1.17; letter-spacing: .025em; }
  .hero-heading-row { white-space: nowrap; }
  .hero-heading-row em { display: inline; }
  .hero-motion__description { margin-top: clamp(8px,1.5svh,14px); font-size: clamp(.5rem,2.3vw,.69rem); letter-spacing: .105em; line-height: 1.65; }
  .hero-desktop-break { display: none; }
  .hero-motion__description p + p { margin-top: 5px; }
  .hero--motion .hero__actions { justify-content: center; gap: 13px; margin-top: clamp(12px,2.2svh,20px); }
  .hero--motion .hero__actions .primary-link { width: 46%; min-width: 0; max-width: 208px; min-height: 2.9rem; font-size: .68rem; }
  .hero-atmosphere__image { position: absolute; top: var(--hero-scene-center-y,35svh); left: 50%; width: min(180vw,120svh); height: auto; max-width: none; aspect-ratio: 1672 / 941; object-fit: contain; object-position: center; -webkit-mask-image: linear-gradient(#000 85%,transparent); mask-image: linear-gradient(#000 85%,transparent); transform: translate(-66.9856459%,-44.6333688%); }
  .hero-mist--blue { top: 11%; left: -15%; width: 85%; height: 47%; filter: blur(30px); }
  .hero-mist--purple { top: 15%; right: -18%; width: 75%; height: 45%; filter: blur(30px); }
  .hero-spectrum { left: -58%; width: 158%; height: 72%; opacity: .5; }
  .hero-spectrum__paths { display: none; }
  .hero-stars { height: 69%; }
  .hero-logo-wave--right { right: -6%; width: 31%; color: var(--violet); filter: drop-shadow(0 0 7px rgba(210,108,255,.9)); }
  .hero-logo-wave--right .hero-logo-wave__axis { height: 2px; }
  .hero-logo-wave--right .hero-logo-wave__dot { width: 6px; height: 6px; box-shadow: 0 0 9px var(--violet); }
  .hero-logo-wave__bars { display: grid; grid-template-columns: repeat(19,minmax(0,1fr)); grid-template-rows: minmax(0,1fr); column-gap: 1%; row-gap: 0; }
  .hero--motion.is-lite .hero-logo-wave__bars { grid-template-columns: repeat(17,minmax(0,1fr)); }
  .hero-logo-wave__axis { height: 1px; }
  .hero-logo-wave__bar { width: 100%; min-width: 0; max-width: 2px; justify-self: center; }
  .hero-motion-toggle { right: 6px; bottom: 3px; width: 20px; height: 20px; padding: 4px; opacity: .6; }
}
@supports (width: 1cqh) {
  @media (max-width: 680px) { .hero-logo { width: min(76cqw,94cqh,355px); } }
}
@media (max-width: 680px) and (max-height: 650px) {
  .hero-motion__inner { gap: 4px; padding-top: calc(4.5rem + 5px); padding-bottom: max(42px,calc(env(safe-area-inset-bottom) + 24px)); }
  .hero-motion__copy h1 { font-size: clamp(1.18rem,5.9vw,1.75rem); }
  .hero-motion__description { margin-top: 7px; font-size: .5rem; }
  .hero-motion__description p + p { margin-top: 2px; }
  .hero--motion .hero__actions { margin-top: 10px; }
  .hero--motion .hero__actions .primary-link { min-height: 42px; }
  .hero-logo { max-width: 260px; }
}
@media (max-height: 510px) and (min-aspect-ratio: 4/3) {
  .hero-motion__inner { grid-template-columns: 48% 52%; grid-template-rows: minmax(0,1fr); gap: 10px; padding: calc(4.5rem + 10px) 5vw 20px; }
  .hero-motion__art { grid-row: 1; grid-column: 2; transform: none; container-type: size; }
  .hero-motion__copy { grid-row: 1; grid-column: 1; text-align: left; }
  .hero-motion__copy h1 { font-size: clamp(1.5rem,7.5svh,2.25rem); line-height: 1.05; }
  .hero-heading-row em { display: block; }
  .hero-motion__description { margin-top: 12px; font-size: .44rem; letter-spacing: .1em; }
  .hero-motion__description p + p { margin-top: 2px; }
  .hero--motion .hero__actions { gap: 10px; margin-top: 14px; }
  .hero--motion .hero__actions .primary-link { width: 46%; min-width: 0; min-height: 34px; gap: 7px; font-size: .5rem; }
  .hero-logo { width: min(72%,calc((100svh - 110px) * 1.1711)); }
  .hero-atmosphere__image { position: static; width: 100%; height: 100%; object-fit: cover; -webkit-mask: none; mask: none; transform: none; }
  .hero-spectrum { left: 0; width: 100%; height: 100%; }
  .hero-stars { height: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .hero--motion.is-loading .hero-atmosphere,
  .hero--motion.is-loading .hero-logo__power,
  .hero--motion.is-loading .hero-logo__waves,
  .hero--motion.is-loading .hero-motion__copy h1,
  .hero--motion.is-loading .hero-motion__description,
  .hero--motion.is-loading .hero__actions { opacity: 1; }
  .hero--motion .hero-star { opacity: .32; }
  .hero-motion-toggle { display: none; }
}