/* Homepage petal scene and landing effects. */
.petal-scene-effect {
  display: none;
}

@media (prefers-reduced-motion: no-preference) {
  /* Hold Games in place for the dissolve, then let its full height scroll normally. */
  .company-home.has-games-crossfade .company-games-stage {
    position: relative;
    height: var(--games-stage-height, 100svh);
    margin-top: clamp(90px, 14vh, 170px);
  }

  .company-home.has-games-crossfade .company-games-section {
    position: fixed;
    inset: 0 0 auto;
    width: 100%;
    margin-top: 0;
    opacity: var(--games-reveal, 0);
    visibility: var(--games-visibility, hidden);
    will-change: opacity;
  }

  .company-home.has-games-crossfade .company-games-stage.is-released .company-games-section {
    position: relative;
  }

  .company-home.has-games-crossfade .company-games-section::before {
    display: none;
  }

  .company-home.has-games-crossfade .company-games-section.has-entrance .company-games-copy > *,
  .company-home.has-games-crossfade .company-games-section.has-entrance .company-game-card-wrap {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .company-home .company-leaf-transition {
    height: 180vh;
    height: 180svh;
  }

  .company-home .petal-scene-effect {
    display: block;
    position: absolute;
    pointer-events: none;
  }

  .company-home .company-leaf-transition-viewport {
    opacity: var(--petal-scene-opacity, 0);
  }

  .company-home .company-leaf-transition .company-grass-platform {
    top: var(--petal-platform-top, 70%);
    opacity: 1;
    transform: translate3d(-50%, var(--petal-platform-dip, 0px), 0);
    will-change: transform;
  }

  .company-home .company-leaf-transition-image {
    filter: drop-shadow(0 4px 5px rgba(26, 15, 46, 0.18));
  }

  .petal-atmosphere {
    inset: 0;
    z-index: 0;
  }

  .petal-atmosphere img {
    position: absolute;
    top: 0;
    left: var(--ambient-left);
    width: var(--ambient-size);
    height: auto;
    opacity: var(--ambient-opacity);
    filter: blur(1px);
    transform: translate3d(var(--ambient-x, 0px), var(--ambient-y, -100px), 0)
      rotate(var(--ambient-rotation, 0deg));
    will-change: transform;
    user-select: none;
  }

  .petal-atmosphere img:nth-child(1) { --ambient-left: 19%; --ambient-size: 27px; --ambient-opacity: 0.22; }
  .petal-atmosphere img:nth-child(2) { --ambient-left: 77%; --ambient-size: 37px; --ambient-opacity: 0.28; }
  .petal-atmosphere img:nth-child(3) { --ambient-left: 33%; --ambient-size: 18px; --ambient-opacity: 0.15; }
  .petal-atmosphere img:nth-child(4) { --ambient-left: 87%; --ambient-size: 22px; --ambient-opacity: 0.18; }

  .petal-landing-aura,
  .petal-ground-shadow,
  .petal-landing-ring,
  .petal-landing-sparks {
    left: 50%;
    top: var(--petal-surface-y, 75%);
  }

  .petal-landing-aura {
    z-index: 1;
    width: min(600px, 95vw);
    height: 390px;
    border-radius: 50%;
    background: radial-gradient(ellipse, rgba(189, 148, 255, 0.48), rgba(117, 68, 229, 0.15) 38%, transparent 70%);
    opacity: var(--petal-glow, 0);
    transform: translate3d(-50%, -50%, 0) scale(var(--petal-glow-scale, 0.8));
    will-change: transform, opacity;
  }

  .petal-ground-shadow {
    z-index: 2;
    width: 90px;
    height: 18px;
    border-radius: 50%;
    background: radial-gradient(ellipse, rgba(20, 16, 35, 0.78), transparent 70%);
    opacity: var(--petal-shadow-opacity, 0);
    transform: translate3d(calc(-50% + var(--petal-shadow-x, 0px)), calc(-50% + var(--petal-platform-dip, 0px)), 0)
      scale(var(--petal-shadow-scale, 1.7));
    will-change: transform, opacity;
  }

  .petal-landing-ring {
    z-index: 3;
    width: 140px;
    height: 38px;
    border: 1px solid rgba(226, 198, 255, 0.7);
    border-radius: 50%;
    box-shadow: 0 0 16px rgba(187, 144, 255, 0.24), inset 0 0 12px rgba(187, 144, 255, 0.15);
    opacity: var(--petal-ring-opacity, 0);
    transform: translate3d(-50%, -50%, 0) scale(var(--petal-ring-scale, 0.25));
    will-change: transform, opacity;
  }

  .petal-landing-sparks {
    z-index: 4;
  }

  .petal-landing-sparks i {
    position: absolute;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #eee1ff;
    box-shadow: 0 0 9px 2px rgba(197, 156, 255, 0.45);
    opacity: var(--spark-opacity, 0);
    transform: translate3d(var(--spark-x, 0px), var(--spark-y, 0px), 0) scale(var(--spark-scale, 1));
    will-change: transform, opacity;
  }

  .company-home .company-games-section.has-entrance .company-game-card-wrap {
    transition-delay: 0.38s;
  }

  @media (max-width: 600px) {
    .company-home .company-leaf-transition {
      height: 150vh;
      height: 150svh;
    }

    .petal-atmosphere img:nth-child(n + 3) { display: none; }
    .petal-landing-aura { height: 290px; }
  }
}
