.fswgl-hero {
  --vh: 1vh;
  --fswgl-title: #eaf6ff;
  --fswgl-body: rgba(234, 246, 255, 0.86);
  --fswgl-muted: rgba(234, 246, 255, 0.74);
  --fswgl-shadow: 0 0 1.35rem rgba(0, 0, 0, 0.36);
  min-height: clamp(560px, calc(var(--fswgl-h-desktop, 86) * var(--vh)), 980px);
  touch-action: pan-y;
  -webkit-user-select: none;
  user-select: none;
}

@supports (height: 100dvh) {
  .fswgl-hero {
    --vh: 1dvh;
  }
}

@supports (height: 100svh) {
  .fswgl-hero {
    --vh: 1svh;
  }
}

@media screen and (max-width: 749px) {
  .fswgl-hero {
    min-height: clamp(520px, calc(var(--fswgl-h-mobile, 76) * var(--vh)), 920px);
  }
}

.fswgl-hero .fs-hero__bg {
  overflow: hidden;
}

.fswgl-hero__fallback,
.fswgl-hero__fallback-img,
.fswgl-hero__overlay {
  pointer-events: none;
  -webkit-user-drag: none;
}

.fswgl-hero .fs-hero__canvas {
  pointer-events: none;
  opacity: 1;
  transform: translateZ(0);
}

.fswgl-hero .fs-hero__overlay {
  background: radial-gradient(1200px 820px at 50% 0%, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0) 60%),
    linear-gradient(180deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.36));
}

.fswgl-hero .fs-hero__inner {
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

.fswgl-hero__playui {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.72rem;
  text-align: center;
  max-width: 560px;
  padding-bottom: max(env(safe-area-inset-bottom, 0px), 10px);
  pointer-events: none;
}

.fswgl-hero.is-grabbing {
  touch-action: none;
}

.fswgl-hero__playui .button {
  pointer-events: auto;
  min-width: min(360px, 86vw);
  justify-content: center;
}

.fswgl-hero__toast {
  pointer-events: none;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity 220ms ease, transform 220ms ease;
  padding: 0.55rem 0.9rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(0, 0, 0, 0.32);
  color: rgba(234, 246, 255, 0.92);
  box-shadow: 0 0 1.35rem rgba(0, 0, 0, 0.26);
}

@supports ((-webkit-backdrop-filter: blur(10px)) or (backdrop-filter: blur(10px))) {
  .fswgl-hero__toast {
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    background: rgba(0, 0, 0, 0.24);
  }
}

.fswgl-hero__toast.is-on {
  opacity: 1;
  transform: translateY(0);
}

.fswgl-hero .fs-hero__kicker,
.fswgl-hero .fs-hero__sub,
.fswgl-hero .fs-hero__bullets li,
.fswgl-hero .fs-hero__micro {
  text-shadow: var(--fswgl-shadow);
}

.fswgl-hero .fs-hero__kicker {
  color: var(--fswgl-muted);
}

.fswgl-hero .fs-hero__title {
  background-image: none;
  -webkit-background-clip: initial;
  background-clip: initial;
  color: var(--fswgl-title);
  -webkit-text-fill-color: currentColor;
  text-shadow: 0 0 1.65rem rgba(0, 0, 0, 0.38), 0 0 3.2rem rgba(var(--fs-accent-cyan), 0.10);
}

.fswgl-hero .fs-hero__sub {
  color: var(--fswgl-body);
}

.fswgl-hero .fs-hero__bullets li {
  color: rgba(234, 246, 255, 0.84);
}

.fswgl-hero .fs-hero__micro {
  color: rgba(234, 246, 255, 0.70);
}

.fswgl-hero .fs-hero__cta .button {
  background: rgba(var(--fs-accent-cyan), 0.18);
  border-color: rgba(var(--fs-accent-cyan), 0.52);
  color: rgba(234, 246, 255, 0.96);
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.fswgl-hero .fs-hero__cta .button:hover {
  background: rgba(var(--fs-accent-cyan), 0.24);
  border-color: rgba(var(--fs-accent-cyan), 0.70);
}

.fswgl-hero .fs-hero__cta .button:focus-visible {
  outline: 2px solid rgba(var(--fs-accent-cyan), 0.95);
  outline-offset: 3px;
}

.fswgl-hero .fs-hero__cta .button--secondary {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.14);
  color: rgba(234, 246, 255, 0.92);
}

.fswgl-hero .fs-hero__cta .button--secondary:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.20);
}

.fswgl-hero__fallback {
  background: radial-gradient(1100px 740px at 65% 35%, rgba(var(--fs-accent-cyan), 0.22), rgba(0, 0, 0, 0) 62%),
    radial-gradient(900px 680px at 20% 25%, rgba(var(--fs-accent-purple), 0.22), rgba(0, 0, 0, 0) 60%),
    radial-gradient(900px 680px at 55% 88%, rgba(var(--fs-accent-pink), 0.16), rgba(0, 0, 0, 0) 60%),
    radial-gradient(900px 680px at 15% 88%, rgba(var(--fs-accent-yellow), 0.12), rgba(0, 0, 0, 0) 60%);
  filter: saturate(1.08) contrast(1.06);
}

.fswgl-hero__fallback-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  opacity: 0.92;
  filter: saturate(1.05) contrast(1.05);
}

.fswgl-hero.is-webgl-ready .fswgl-hero__fallback-img {
  opacity: 0;
}

.fswgl-hero--safe-center .fs-hero__content {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.fswgl-hero--safe-center .fs-hero__cta {
  justify-content: center;
}

.fswgl-hero--safe-center .fs-hero__trust {
  justify-content: center;
}

@media screen and (max-width: 749px) {
  .fswgl-hero--safe-left .fs-hero__content {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
  }

  .fswgl-hero--safe-left .fs-hero__cta {
    justify-content: center;
  }

  .fswgl-hero--safe-left .fs-hero__trust {
    justify-content: center;
  }
}

@media (prefers-reduced-motion: reduce) {
  .fswgl-hero .fs-hero__canvas {
    opacity: 0.92;
  }
}