.button_main_wrap::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  transform: translateX(-100%);
  transition: all 0.6s ease;
  border-radius: 100vw;
  filter: blur(20px);
}

.button_main_wrap[data-wf--button-main--style="primary"]::before {
  background-image: linear-gradient(111deg, #5e97eb, #194499, #5e97eb);
}

.button_main_wrap[data-wf--button-main--style="secondary"]::before {
  background-color: var(--_theme---text);
}

.button_main_wrap[data-wf--button-main--style="tertiary"]::before {
  background-color: var(--_theme---text);
}

.button_main_wrap:hover {
  &::before {
    transform: translateX(100%);
  }
}

.button_main_wrap[data-wf--button-main--style="secondary"]:hover {
}

@property --rotation {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}

@keyframes rotate {
  from {
    --rotation: 0deg;
  }
  to {
    /* (320deg + 360deg) for a full circle rotation */
    --rotation: 360deg;
  }
}

[stroke="gradient"] {
  position: relative;
}

[stroke="gradient"]::after {
  content: "";
  position: absolute;
  inset: 0px;
  border-radius: inherit;
  border: 1.5px solid transparent;
  background: linear-gradient(
      var(--rotation),
      transparent 0%,
      rgba(255, 255, 255, 0.3) 60%,
      rgba(255, 255, 255, 0.6) 100%
    )
    border-box;
  -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
  animation: rotate 8s linear infinite;
}
.nav_2_wrap {
  transition: all 0.3s ease;
}
.nav_2_component:has(.w-nav-button.w--open) {
  .nav_2_wrap {
    margin-top: unset;
    /* transform: translateY(-2rem); */
  }

  .nav_2_mobile_layout {
    backdrop-filter: unset;
    background-color: transparent;
  }
}
.nav_2_logo_wrap {
  transition: filter 0.4s ease;
}
.nav_2_component.is-light {
  .nav_2_logo_wrap {
    filter: invert(100%);
  }

  /* .button_main_wrap {
    background-color: #00000080;
  } */
}

details[open]::after {
  content: "";
  position: absolute;
  inset: 0px;
  border-radius: inherit;
  border: 1.5px solid transparent;
  background: linear-gradient(
      var(--rotation),
      transparent 0%,
      rgba(255, 255, 255, 0.05) 60%,
      rgba(255, 255, 255, 0.6) 100%
    )
    border-box;
  -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
  animation: rotate 8s linear infinite;
}

/* Base avatar styling */
.about_avatar_wrap {
  transition: none; /* Remove any existing transitions */
  will-change: transform, filter;
  backface-visibility: hidden;
}

/* Individual avatar animations with randomized timing and effects */
[data-lock-avatar="1"] {
  animation: scaleBlur1 8.2s ease-in-out infinite;
}

[data-lock-avatar="2"] {
  animation: scaleBlur2 9.8s ease-in-out infinite;
}

[data-lock-avatar="3"] {
  animation: scaleBlur3 7.1s ease-in-out infinite;
}

[data-lock-avatar="4"] {
  animation: scaleBlur4 6.3s ease-in-out infinite;
}

[data-lock-avatar="5"] {
  animation: scaleBlur5 7.7s ease-in-out infinite;
}

[data-lock-avatar="6"] {
  animation: scaleBlur6 5.9s infinite;
}

/* Keyframe animations - each with different scale/blur values */
@keyframes scaleBlur1 {
  0%,
  50% {
    transform: scale(1);
    filter: blur(0px);
  }
  50% {
    transform: scale(0.75);
    filter: blur(2px);
  }
}

@keyframes scaleBlur2 {
  0%,
  100% {
    transform: scale(1);
    filter: blur(0px);
  }
  50% {
    transform: scale(0.6);
    filter: blur(3px);
  }
}

@keyframes scaleBlur3 {
  0%,
  100% {
    transform: scale(1);
    filter: blur(0px);
  }
  50% {
    transform: scale(0.8);
    filter: blur(1.5px);
  }
}

@keyframes scaleBlur4 {
  0%,
  100% {
    transform: scale(1);
    filter: blur(0px);
  }
  50% {
    transform: scale(0.65);
    filter: blur(2.5px);
  }
}

@keyframes scaleBlur5 {
  0%,
  100% {
    transform: scale(1);
    filter: blur(0px);
  }
  50% {
    transform: scale(0.7);
    filter: blur(1.8px);
  }
}

@keyframes scaleBlur6 {
  0%,
  100% {
    transform: scale(1);
    filter: blur(0px);
  }
  50% {
    transform: scale(0.85);
    filter: blur(1.2px);
  }
}

/* Animation delays for more randomness */
[data-lock-avatar="1"] {
  animation-delay: 0s;
}
[data-lock-avatar="2"] {
  animation-delay: 0.7s;
}
[data-lock-avatar="3"] {
  animation-delay: 1.2s;
}
[data-lock-avatar="4"] {
  animation-delay: 0.3s;
}
[data-lock-avatar="5"] {
  animation-delay: 1.8s;
}
[data-lock-avatar="6"] {
  animation-delay: 0.9s;
}

/* WAITLIST FORM CONTENT */
@media screen and (min-width: 992px) and (max-width: 1180px) {
  .waitlist_form_input_wrap.is-250 {
    width: 100%;
  }
  .waitlist_content_left_wrap {
    max-width: "none";
  }
  .waitlist_content_right_wrap {
    width: 100%;
  }
}

/* [data-nav="logo"] {
  background-color: transparent;
  .u-embed-svg {
    isolation: isolate;
    svg {
      mix-blend-mode: difference;
    }
  }
}

.nav_2_layout {
  mix-blend-mode: difference;
} */