.video-shell video {
  object-fit: contain;
}

.hero-proof {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  max-width: 820px;
}

.hero-proof span {
  max-width: 155px;
}

.hero-proof div {
  align-items: flex-start;
  flex-direction: column;
  gap: 4px;
}

.hero-proof strong {
  white-space: nowrap;
}

.founder-copy h2 {
  font-size: clamp(34px, 3.65vw, 56px);
}

.final-actions {
  flex-wrap: wrap;
}

body.dollhouse-celebrating::before {
  animation: dollhouse-confetti-fall 5s cubic-bezier(.22, .68, .26, 1) forwards;
  background-image:
    radial-gradient(circle at 18px 22px, #f1a9bf 0 3px, transparent 3.8px),
    radial-gradient(circle at 54px 36px, #c85d80 0 2.5px, transparent 3.3px),
    radial-gradient(circle at 31px 74px, #fffaf5 0 3px, transparent 3.8px),
    radial-gradient(circle at 76px 18px, #211c20 0 2.5px, transparent 3.3px),
    radial-gradient(circle at 92px 91px, #ef84a8 0 2px, transparent 2.8px),
    radial-gradient(circle at 16px 102px, #fffaf5 0 2px, transparent 2.8px);
  background-position: 0 0, 18px 12px, 42px 7px, 8px 38px, 28px 22px, 64px 36px;
  background-size: 117px 139px, 149px 113px, 137px 157px, 163px 127px, 181px 149px, 151px 173px;
  content: "";
  inset: -25vh 0 0;
  pointer-events: none;
  position: fixed;
  z-index: 998;
}

body.dollhouse-celebrating::after {
  animation: dollhouse-celebration-card 5s ease forwards;
  background: rgba(18, 16, 20, .96);
  border: 1px solid rgba(241, 169, 191, .72);
  border-radius: 22px;
  box-shadow: 0 24px 80px rgba(18, 16, 20, .32);
  color: #fffaf5;
  content: "DOLLHOUSE.AI 2.0 УЖЕ ДОСТУПЕН\A ОБНОВЛЕНИЕ КУРСА • СКИДКА 20%";
  font-size: clamp(16px, 1.8vw, 24px);
  font-weight: 800;
  left: 50%;
  letter-spacing: .035em;
  line-height: 1.45;
  max-width: min(620px, calc(100vw - 40px));
  padding: 22px 30px;
  pointer-events: none;
  position: fixed;
  text-align: center;
  text-transform: uppercase;
  top: 50%;
  transform: translate(-50%, -50%);
  white-space: pre-line;
  width: max-content;
  z-index: 999;
}

@keyframes dollhouse-confetti-fall {
  0% {
    opacity: 0;
    transform: translateY(-12vh) rotate(-2deg);
  }

  10% {
    opacity: 1;
  }

  76% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    transform: translateY(112vh) rotate(5deg);
  }
}

@keyframes dollhouse-celebration-card {
  0% {
    opacity: 0;
    transform: translate(-50%, -44%) scale(.92);
  }

  12%, 72% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }

  100% {
    opacity: 0;
    transform: translate(-50%, -54%) scale(1.02);
  }
}

@media (width <= 760px) {
  .hero-proof {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 100%;
  }

  .hero-proof div {
    align-items: flex-start;
    flex-direction: row;
    gap: 11px;
  }

  .mobile-cta {
    padding: 0 18px;
    text-align: center;
  }

  body.dollhouse-celebrating::after {
    border-radius: 18px;
    padding: 18px 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.dollhouse-celebrating::before {
    display: none;
  }

  body.dollhouse-celebrating::after {
    animation: dollhouse-celebration-fade 5s ease forwards;
  }
}

@keyframes dollhouse-celebration-fade {
  0%, 80% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}
