.page-photobooth {
  --paper: #f3fbf8;
  --violet: #88409b;
  --coral: #ee7182;
}

.page-photobooth .hero::before {
  inset: 64px -8vw auto !important;
  height: min(32vh, 290px) !important;
  background-size: 108% 100% !important;
  background-position: center top !important;
  opacity: .74 !important;
  filter: drop-shadow(0 18px 24px rgba(36, 22, 45, .11)) saturate(1.1);
  transform-origin: top center;
  animation: upper-showpiece 8.2s ease-in-out infinite !important;
}

@media (max-width: 760px) {
  .page-photobooth .service-gallery .gallery-item,
  .page-photobooth .service-gallery .gallery-item:first-child,
  .page-photobooth .service-gallery .gallery-item:nth-child(2),
  .page-photobooth .service-gallery .gallery-item:nth-child(3) {
    flex: 0 0 min(76vw, 310px);
    margin-top: 0;
    border-radius: 24px;
    transform: none;
  }
}

@media (max-width: 760px) {
  .page-photobooth .service-gallery .gallery-item,
  .page-photobooth .service-gallery .gallery-item:first-child,
  .page-photobooth .service-gallery .gallery-item:nth-child(2),
  .page-photobooth .service-gallery .gallery-item:nth-child(3) {
    flex: 0 0 min(84vw, 350px);
    margin-top: 0;
    border-radius: 28px;
    transform: none;
  }
}

.page-photobooth .hero::before {
  inset: 82px 0 auto !important;
  height: min(28vh, 250px) !important;
  background: url("../images/decor/photobooth-top.svg") top center / 100% 100% no-repeat !important;
  opacity: .66 !important;
  animation: theme-top-float 6s ease-in-out infinite !important;
}

.page-photobooth .hero {
  min-height: 96vh;
  background:
    radial-gradient(circle at 14% 22%, rgba(114, 209, 208, .28) 0 130px, transparent 132px),
    radial-gradient(circle at 84% 18%, rgba(238, 113, 130, .2) 0 150px, transparent 152px),
    linear-gradient(180deg, #f4fbf0 0%, #edfafa 58%, #f7eff8 100%);
}

.page-photobooth .hero::before {
  inset: 0 0 auto;
  height: min(31vh, 270px);
  background:
    linear-gradient(90deg, transparent 0 9%, rgba(136, 64, 155, .22) 9% 91%, transparent 91%) 0 36% / 100% 6px no-repeat,
    radial-gradient(circle at 50% 50%, transparent 0 24px, rgba(114, 209, 208, .46) 25px 32px, transparent 33px) 12% 32% / 86px 86px no-repeat,
    linear-gradient(180deg, rgba(136, 64, 155, .22), rgba(136, 64, 155, .08)) 15% 64% / 8px 72px no-repeat,
    radial-gradient(circle at 50% 50%, transparent 0 30px, rgba(255, 255, 255, .9) 31px 38px, transparent 39px) 45% 28% / 104px 104px no-repeat,
    radial-gradient(circle at 50% 50%, rgba(136, 64, 155, .28) 0 18px, transparent 19px) 45% 28% / 104px 104px no-repeat,
    linear-gradient(180deg, rgba(136, 64, 155, .22), rgba(136, 64, 155, .08)) 49% 68% / 8px 70px no-repeat,
    radial-gradient(circle at 50% 50%, transparent 0 24px, rgba(238, 113, 130, .38) 25px 32px, transparent 33px) 80% 32% / 86px 86px no-repeat,
    linear-gradient(180deg, rgba(136, 64, 155, .22), rgba(136, 64, 155, .08)) 83% 64% / 8px 72px no-repeat,
    linear-gradient(180deg, rgba(36, 22, 45, .22), rgba(36, 22, 45, .08)) 64% 48% / 90px 54px no-repeat,
    radial-gradient(circle at 50% 50%, rgba(255, 255, 255, .68) 0 18px, transparent 19px) 66% 52% / 50px 50px no-repeat,
    linear-gradient(180deg, rgba(244, 251, 240, .78), transparent 72%);
  opacity: .92;
  animation: light-rig-pulse 3.8s ease-in-out infinite;
}

.page-photobooth .hero::after {
  content: "";
  position: absolute;
  right: 8%;
  bottom: 13%;
  z-index: -1;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  pointer-events: none;
  background:
    radial-gradient(circle at center, rgba(255, 255, 255, .82) 0 34px, rgba(114, 209, 208, .24) 35px 92px, transparent 94px),
    conic-gradient(from 20deg, rgba(238, 113, 130, .24), transparent, rgba(246, 200, 95, .24), transparent, rgba(114, 209, 208, .24));
  animation: flash-pulse 1.9s ease-in-out infinite alternate;
}

@keyframes light-rig-pulse {
  0%, 100% { opacity: .72; filter: brightness(1); }
  50% { opacity: .98; filter: brightness(1.08); }
}

.page-photobooth .hero-grid {
  grid-template-columns: minmax(0, .92fr) minmax(420px, 1.08fr);
}

.page-photobooth .stage-card {
  border-width: 7px;
  border-color: #fff;
  border-radius: 28px;
}

.page-photobooth .stage-card.primary {
  width: 74%;
  height: 60%;
  right: 2%;
  top: 8%;
}

.page-photobooth .stage-card.side {
  width: 45%;
  height: 32%;
  left: 0;
  bottom: 15%;
}

.page-photobooth .stage-card.mini {
  width: 36%;
  height: 28%;
  right: 4%;
  bottom: 3%;
}

.page-photobooth .service-gallery {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  align-items: start;
  perspective: none;
}

.page-photobooth .service-gallery .gallery-item:first-child {
  aspect-ratio: 4 / 5;
  border-radius: 26px;
  transform: none;
}

.page-photobooth .service-gallery .gallery-item:nth-child(2),
.page-photobooth .service-gallery .gallery-item:nth-child(3) {
  aspect-ratio: 4 / 5;
  margin-top: 0;
  border-radius: 26px;
}

.page-photobooth .service-gallery .gallery-item:nth-child(2) {
  transform: none;
}

.page-photobooth .service-gallery .gallery-item:nth-child(3) {
  transform: none;
  border-radius: 26px;
}

.page-photobooth .service-gallery .gallery-item {
  border: 7px solid rgba(255, 255, 255, .92);
  box-shadow: 0 20px 48px rgba(36, 22, 45, .13);
}

.page-photobooth .service-gallery .gallery-item::before {
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  top: 14px;
  height: 12px;
  z-index: 2;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(255,255,255,.75), transparent 20%, rgba(255,255,255,.7) 40%, transparent 60%, rgba(255,255,255,.75));
  opacity: .62;
}

.page-photobooth .service-gallery .gallery-item:hover {
  transform: translateY(-7px);
  box-shadow: 0 24px 58px rgba(36, 22, 45, .17);
}

.page-photobooth .service-gallery .gallery-item span {
  left: 14px;
  bottom: 14px;
  background: linear-gradient(135deg, rgba(136, 64, 155, .92), rgba(36, 30, 45, .88));
  color: #fff;
}

@media (max-width: 1080px) {
  .page-photobooth .hero-grid,
  .page-photobooth .service-gallery {
    grid-template-columns: 1fr;
  }

  .page-photobooth .service-gallery .gallery-item:nth-child(2),
  .page-photobooth .service-gallery .gallery-item:nth-child(3) {
    margin-top: 0;
  }
}

@media (max-width: 760px) {
  .page-photobooth .hero {
    background:
      radial-gradient(circle at 18% 8%, rgba(114, 209, 208, .28) 0 86px, transparent 88px),
      radial-gradient(circle at 86% 30%, rgba(238, 113, 130, .2) 0 118px, transparent 120px),
      linear-gradient(180deg, #f4fbf0, #edfafa 58%, #f7eff8);
  }

  .page-photobooth .hero-stage {
    min-height: 255px;
  }

  .page-photobooth .hero::after {
    right: -6%;
    bottom: 32%;
    width: 150px;
    height: 150px;
    opacity: .45;
  }

  .page-photobooth .stage-card.primary {
    width: 74%;
    height: 68%;
  }

  .page-photobooth .service-gallery {
    display: flex;
  }
}

.page-photobooth .hero::before {
  inset: 64px -8vw auto !important;
  height: min(32vh, 290px) !important;
  background-size: 108% 100% !important;
  background-position: center top !important;
  opacity: .74 !important;
  filter: drop-shadow(0 18px 24px rgba(36, 22, 45, .11)) saturate(1.1);
  transform-origin: top center;
  animation: upper-showpiece 8.2s ease-in-out infinite !important;
}