/* Reveal-on-scroll (substitui animações do Framer) */
.sc-reveal {
  opacity: 0 !important;
  transform: translateY(18px) !important;
  transition:
    opacity 0.7s ease,
    transform 0.7s cubic-bezier(0.22, 1, 0.36, 1) !important;
  will-change: opacity, transform;
}

.sc-reveal.sc-deep {
  transform: translateY(50px) !important;
}

.sc-reveal.sc-in {
  opacity: 1 !important;
  transform: none !important;
}

/* Galeria do estúdio: marquee vaza para fora da seção (1140px) até as
   bordas da tela, como no original. O corte fica na seção avó
   (.framer-72rtr7), que já tem overflow:clip. */
.framer-hH7C7 .framer-b76i6q,
.framer-b76i6q {
  overflow: visible !important;
}

@media (prefers-reduced-motion: reduce) {
  .sc-reveal {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* Glow do fundo dos cards de serviços no hover (como no original):
   o gradiente radial cresce de 50%/149.8% para 75%/88% na borda inferior.
   CSS não interpola radial-gradient, então o estado de hover fica numa
   camada ::before que faz crossfade por cima do gradiente de repouso. */
.framer-hH7C7 .framer-15zywak::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(
    75% 88% at 48.2% 100%,
    var(--token-35a15c71-005a-432b-b025-130cf97c8fdc, rgb(0, 154, 255)) 0%,
    var(--token-68aaa51c-ad13-4570-a94e-0dde067e24fc, rgb(27, 27, 27)) 100%
  );
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.45s ease;
}

.framer-hH7C7 .framer-15zywak:hover::before {
  opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
  .framer-hH7C7 .framer-15zywak::before {
    transition: none;
  }
}