/* AKAZ x 4EVA / V1.4.16 — dynamic home logo signal */
.home-v1415-logo-stage[data-logo-fx="ready"] {
  --home-logo-image: url("/akaz-x-4eva-logo.png");
  --logo-shift-x: 0px;
  --logo-shift-y: 0px;
  --logo-rotate-x: 0deg;
  --logo-rotate-y: 0deg;
  position: relative;
  isolation: isolate;
  z-index: 1;
  overflow: visible;
  perspective: 1100px;
  transform-style: preserve-3d;
}

.home-v1415-logo-stage[data-logo-fx="ready"]::before {
  inset: -12% -4% -15%;
  z-index: -3;
  background:
    radial-gradient(ellipse at 50% 51%, rgba(224, 204, 255, .42) 0, rgba(147, 80, 255, .28) 28%, rgba(92, 30, 204, .16) 48%, transparent 72%),
    conic-gradient(from 218deg at 50% 50%, transparent 0 30%, rgba(205, 167, 255, .12) 37%, transparent 45% 69%, rgba(138, 68, 244, .1) 76%, transparent 84%);
  filter: blur(34px) saturate(145%);
  opacity: .72;
  animation: home-logo-aura 5.8s ease-in-out infinite;
}

.home-v1415-logo-stage[data-logo-fx="ready"]::after {
  inset: 9% 3% 12%;
  z-index: -2;
  border: 1px solid rgba(206, 174, 255, .11);
  border-radius: 50%;
  background: transparent;
  filter: drop-shadow(0 0 18px rgba(149, 79, 255, .24));
  opacity: .42;
  animation: home-logo-ring 9s linear infinite;
}

.home-v1415-logo-stage[data-logo-fx="ready"] .home-v1413-hero-logo {
  position: relative;
  z-index: 4;
  transform-origin: 50% 52%;
  will-change: transform, filter;
  animation:
    home-logo-float 6.8s cubic-bezier(.4, 0, .2, 1) infinite,
    home-logo-glow 4.4s ease-in-out infinite;
}

.home-logo-fx-halo,
.home-logo-fx-echo,
.home-logo-fx-sweep,
.home-logo-fx-particles {
  position: absolute;
  inset: 0;
  display: block;
  pointer-events: none;
}

.home-logo-fx-halo {
  inset: 21% 9% 18%;
  z-index: 1;
  border-radius: 50%;
  background:
    linear-gradient(90deg, transparent 0 5%, rgba(173, 108, 255, .2) 28%, rgba(241, 228, 255, .18) 50%, rgba(130, 52, 238, .2) 72%, transparent 95%),
    radial-gradient(ellipse, rgba(154, 80, 255, .2), transparent 67%);
  filter: blur(18px);
  mix-blend-mode: screen;
  animation: home-logo-halo 4.8s ease-in-out infinite;
}

.home-logo-fx-echo {
  z-index: 2;
  background: var(--home-logo-image) center / contain no-repeat;
  filter: brightness(1.45) saturate(1.8) hue-rotate(8deg) drop-shadow(0 0 12px rgba(169, 104, 255, .65));
  mix-blend-mode: screen;
  opacity: 0;
  animation: home-logo-echo 10s steps(1, end) infinite;
}

.home-logo-fx-sweep {
  z-index: 5;
  overflow: hidden;
  background: linear-gradient(108deg, transparent 38%, rgba(255, 255, 255, 0) 43%, rgba(255, 255, 255, .9) 49%, rgba(218, 181, 255, .72) 52%, transparent 59%);
  background-size: 260% 100%;
  background-position: 145% 0;
  -webkit-mask: var(--home-logo-image) center / contain no-repeat;
  mask: var(--home-logo-image) center / contain no-repeat;
  mix-blend-mode: screen;
  opacity: .9;
  animation: home-logo-sweep 6.2s cubic-bezier(.22, .61, .36, 1) infinite;
}

.home-logo-fx-particles {
  inset: -24% -4%;
  z-index: 3;
  overflow: visible;
}

.home-logo-fx-particle {
  --particle-x: 50%;
  --particle-y: 50%;
  --particle-size: 3px;
  --particle-drift-x: 10px;
  --particle-drift-y: -24px;
  --particle-duration: 5s;
  --particle-delay: 0s;
  --particle-opacity: .7;
  position: absolute;
  left: var(--particle-x);
  top: var(--particle-y);
  width: var(--particle-size);
  height: var(--particle-size);
  border-radius: 50%;
  background: rgba(235, 218, 255, .96);
  box-shadow:
    0 0 5px rgba(255, 255, 255, .9),
    0 0 13px rgba(187, 123, 255, .95),
    0 0 25px rgba(118, 45, 233, .7);
  opacity: 0;
  animation: home-logo-particle var(--particle-duration) ease-in-out var(--particle-delay) infinite;
}

.home-logo-fx-particle::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 1px;
  height: calc(var(--particle-size) + 10px);
  background: linear-gradient(180deg, rgba(218, 185, 255, .65), transparent);
  transform: translate(-50%, -10%);
  filter: blur(.4px);
  opacity: .6;
}

@keyframes home-logo-aura {
  0%, 100% { opacity: .58; transform: scale(.97) translate3d(-1%, 0, 0); }
  45% { opacity: .92; transform: scale(1.045) translate3d(1.2%, -1%, 0); }
  72% { opacity: .7; transform: scale(1.01) translate3d(0, 1%, 0); }
}

@keyframes home-logo-ring {
  0% { transform: rotate(-2deg) scale(.98); opacity: .2; }
  45% { opacity: .52; }
  100% { transform: rotate(358deg) scale(1.035); opacity: .2; }
}

@keyframes home-logo-float {
  0%, 100% {
    transform: translate3d(var(--logo-shift-x), calc(var(--logo-shift-y) + 1px), 22px) rotateX(var(--logo-rotate-x)) rotateY(var(--logo-rotate-y)) scale(1);
  }
  50% {
    transform: translate3d(var(--logo-shift-x), calc(var(--logo-shift-y) - 5px), 26px) rotateX(var(--logo-rotate-x)) rotateY(var(--logo-rotate-y)) scale(1.006);
  }
}

@keyframes home-logo-glow {
  0%, 100% {
    filter: drop-shadow(0 0 10px rgba(229, 211, 255, .28)) drop-shadow(0 0 31px rgba(144, 75, 255, .34)) drop-shadow(0 0 76px rgba(92, 26, 215, .2));
  }
  50% {
    filter: drop-shadow(0 0 16px rgba(255, 255, 255, .42)) drop-shadow(0 0 43px rgba(174, 104, 255, .58)) drop-shadow(0 0 105px rgba(99, 32, 238, .34));
  }
}

@keyframes home-logo-halo {
  0%, 100% { opacity: .38; transform: scaleX(.92) scaleY(.84); }
  50% { opacity: .92; transform: scaleX(1.08) scaleY(1.02); }
}

@keyframes home-logo-sweep {
  0%, 19% { background-position: 145% 0; opacity: 0; }
  25% { opacity: .85; }
  48% { background-position: -70% 0; opacity: .7; }
  55%, 100% { background-position: -70% 0; opacity: 0; }
}

@keyframes home-logo-echo {
  0%, 86%, 100% { opacity: 0; transform: translate3d(0, 0, 0); clip-path: inset(0); }
  87% { opacity: .18; transform: translate3d(-4px, 1px, 0); clip-path: inset(16% 0 58% 0); }
  88% { opacity: .1; transform: translate3d(5px, -1px, 0); clip-path: inset(58% 0 12% 0); }
  89% { opacity: 0; transform: translate3d(0, 0, 0); clip-path: inset(0); }
  94% { opacity: .13; transform: translate3d(3px, 0, 0); clip-path: inset(38% 0 43% 0); }
  95% { opacity: 0; transform: translate3d(0, 0, 0); clip-path: inset(0); }
}

@keyframes home-logo-particle {
  0%, 100% { opacity: 0; transform: translate3d(0, 10px, 0) scale(.45); }
  17% { opacity: var(--particle-opacity); }
  54% { opacity: .54; }
  78% { opacity: 0; transform: translate3d(var(--particle-drift-x), var(--particle-drift-y), 0) scale(1.35); }
}

@media (max-width: 760px) {
  .home-logo-fx-particles { inset: -18% 0; }
  .home-v1415-logo-stage[data-logo-fx="ready"]::before { inset: -8% 0 -10%; filter: blur(24px) saturate(135%); }
  .home-v1415-logo-stage[data-logo-fx="ready"]::after { inset: 13% 5% 14%; }
  .home-logo-fx-particle:nth-child(n + 13) { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .home-v1415-logo-stage[data-logo-fx="ready"]::before,
  .home-v1415-logo-stage[data-logo-fx="ready"]::after,
  .home-v1415-logo-stage[data-logo-fx="ready"] .home-v1413-hero-logo,
  .home-logo-fx-halo,
  .home-logo-fx-echo,
  .home-logo-fx-sweep,
  .home-logo-fx-particle {
    animation: none !important;
  }

  .home-v1415-logo-stage[data-logo-fx="ready"] .home-v1413-hero-logo {
    transform: none;
  }

  .home-logo-fx-sweep,
  .home-logo-fx-echo,
  .home-logo-fx-particles {
    display: none;
  }
}
