body {
  isolation: isolate;
}

.lst-sakura-stage {
  position: fixed;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  overflow: hidden;
  contain: layout paint style;
  opacity: 0.74;
}

body :where(
  .lst-home-container,
  .lst-services-nav,
  .lst-menu-progress,
  .lst-services-progress,
  .lst-service-menu-card,
  .lst-menu-card,
  .lst-menu-panel,
  .lst-menu-visual,
  .lst-brand-card,
  .elementor-heading-title,
  .elementor-button,
  .elementor-image,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  p,
  a,
  button,
  img,
  picture,
  video,
  iframe,
  form,
  label,
  input,
  textarea,
  select,
  table
):not(.lst-sakura-stage):not(.lst-sakura-petal) {
  position: relative;
  z-index: 3;
}

.lst-sakura-petal {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: var(--lst-sakura-size, 10px);
  height: calc(var(--lst-sakura-size, 10px) * 1.55);
  border-radius: 78% 22% 74% 26%;
  background:
    radial-gradient(circle at 30% 26%, rgba(255, 223, 220, 0.34), transparent 29%),
    linear-gradient(
      var(--lst-sakura-degree, 120deg),
      var(--lst-sakura-start, rgba(190, 20, 36, 0.48)),
      var(--lst-sakura-end, rgba(92, 8, 18, 0.34)) 66%,
      rgba(232, 93, 98, 0.2)
    );
  box-shadow:
    0 0 7px rgba(184, 24, 36, 0.13),
    0 0 14px rgba(198, 154, 82, 0.04);
  opacity: 0;
  will-change: transform, opacity;
  animation-name: lstSakuraFall;
  animation-duration: var(--lst-sakura-duration, 12s);
  animation-timing-function: linear;
  animation-fill-mode: forwards;
  transform-origin: 50% 68%;
}

.lst-sakura-petal::after {
  content: "";
  position: absolute;
  inset: 18% 44% 17% 45%;
  border-radius: 999px;
  background: rgba(255, 232, 224, 0.28);
  opacity: 0.42;
}

@keyframes lstSakuraFall {
  0% {
    opacity: 0;
    transform:
      translate3d(var(--lst-sakura-x, 50vw), -12vh, 0)
      rotateX(0deg)
      rotateY(0deg)
      rotateZ(var(--lst-sakura-rotate-start, 0deg));
  }

  9% {
    opacity: var(--lst-sakura-opacity, 0.3);
  }

  34% {
    transform:
      translate3d(calc(var(--lst-sakura-x, 50vw) + var(--lst-sakura-drift-a, 8vw)), 32vh, 0)
      rotateX(108deg)
      rotateY(150deg)
      rotateZ(calc(var(--lst-sakura-rotate-start, 0deg) + 150deg));
  }

  62% {
    opacity: calc(var(--lst-sakura-opacity, 0.3) * 0.86);
    transform:
      translate3d(calc(var(--lst-sakura-x, 50vw) + var(--lst-sakura-drift-b, -6vw)), 64vh, 0)
      rotateX(212deg)
      rotateY(260deg)
      rotateZ(calc(var(--lst-sakura-rotate-start, 0deg) + 285deg));
  }

  88% {
    opacity: calc(var(--lst-sakura-opacity, 0.3) * 0.62);
  }

  100% {
    opacity: 0;
    transform:
      translate3d(calc(var(--lst-sakura-x, 50vw) + var(--lst-sakura-drift-c, 14vw)), 112vh, 0)
      rotateX(340deg)
      rotateY(390deg)
      rotateZ(calc(var(--lst-sakura-rotate-start, 0deg) + var(--lst-sakura-spin, 520deg)));
  }
}

@media (max-width: 767px) {
  .lst-sakura-petal {
    box-shadow:
      0 0 8px rgba(184, 24, 36, 0.16),
      0 0 16px rgba(198, 154, 82, 0.06);
  }
}

@media (prefers-reduced-motion: reduce) {
  .lst-sakura-stage {
    display: none;
  }
}