/* TitanMC motion performance layer — friends + creators.
   Keeps visible movement while moving continuous effects onto compositor-safe
   transform/opacity paths and reducing oversized blurred raster layers. */

@keyframes tmcMeshOrbit {
  0%, 100% { opacity: .52; transform: translate3d(-50%, -50%, 0) rotate(0deg) scale(.98); }
  50% { opacity: .7; transform: translate3d(-50%, -50%, 0) rotate(180deg) scale(1.045); }
}

@keyframes tmcTitleBreath {
  0%, 100% { opacity: .94; transform: translate3d(0, 0, 0); }
  50% { opacity: 1; transform: translate3d(0, -2px, 0) scale(1.004); }
}

@keyframes tmcAuraSpin {
  to { transform: rotate(360deg); }
}

@keyframes tmcAuraPulse {
  0%, 100% { opacity: .34; }
  50% { opacity: .82; }
}

@keyframes tmcSuccessBreath {
  0%, 100% { opacity: .9; transform: scale(.985); }
  50% { opacity: 1; transform: scale(1.025); }
}

/* /znajomi — preserve the aurora/orbits, shrink their raster cost. */
.hero-aurora {
  inset: -22% !important;
  opacity: .76 !important;
  background:
    radial-gradient(ellipse 52% 44% at 25% 30%, rgba(212, 160, 23, .15) 0%, rgba(212, 160, 23, .055) 36%, transparent 76%),
    radial-gradient(ellipse 48% 40% at 75% 60%, rgba(155, 89, 182, .08) 0%, rgba(155, 89, 182, .03) 40%, transparent 78%),
    radial-gradient(ellipse 44% 36% at 50% 90%, rgba(46, 204, 113, .05) 0%, rgba(46, 204, 113, .018) 42%, transparent 80%) !important;
  filter: none !important;
  contain: paint;
  transform: translateZ(0);
  will-change: transform, opacity;
}

.orbit-dot {
  background: rgba(22, 22, 34, .9) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  contain: paint;
}

.hero-particle {
  contain: strict;
}

/* /tworcy — replace paint-heavy border-radius, text-shadow and custom-property
   loops with equivalent breathing/rotation movement on composited properties. */
.cr-hero-mesh {
  width: min(640px, 86vw) !important;
  height: min(640px, 86vw) !important;
  border-radius: 50% !important;
  opacity: .6 !important;
  background:
    radial-gradient(ellipse at 30% 40%, rgba(155, 89, 182, .12) 0%, rgba(155, 89, 182, .045) 38%, transparent 78%),
    radial-gradient(ellipse at 70% 60%, rgba(155, 89, 182, .08) 0%, rgba(155, 89, 182, .03) 42%, transparent 80%) !important;
  filter: none !important;
  animation: tmcMeshOrbit 20s ease-in-out infinite !important;
  contain: paint;
  will-change: transform, opacity;
}

.cr-title-gradient {
  text-shadow: 0 0 36px rgba(155, 89, 182, .3), 0 0 68px rgba(155, 89, 182, .12) !important;
  animation: fadeInUp .8s .4s both, tmcTitleBreath 5.6s 1.25s ease-in-out infinite !important;
  will-change: transform, opacity;
}

.cr-float-icon,
.cr-hero .hero-particle {
  filter: none !important;
}

.benefit-icon::after {
  animation: tmcAuraSpin 9s linear infinite !important;
  will-change: transform;
}

.tier-card::before {
  animation: tmcAuraPulse var(--tmc-tier-pulse, 6s) ease-in-out infinite !important;
  will-change: opacity;
}

.tier-card.starter { --tmc-tier-pulse: 7s; }
.tier-card.silver { --tmc-tier-pulse: 6.5s; }
.tier-card.gold { --tmc-tier-pulse: 5.8s; }
.tier-card.diamond { --tmc-tier-pulse: 5.2s; }
.tier-card.titan { --tmc-tier-pulse: 4.8s; }

.form-success .success-check {
  filter: drop-shadow(0 0 22px rgba(46, 204, 113, .38));
  animation: tmcSuccessBreath 3s ease-in-out infinite !important;
  will-change: transform, opacity;
}

.scroll-progress {
  width: 100% !important;
  transform: scaleX(0);
  transform-origin: left center;
  transition: none !important;
  will-change: transform;
}

@media (max-width: 768px) {
  .hero-aurora {
    inset: -14% !important;
    filter: none !important;
  }

  .cr-hero-mesh {
    width: min(500px, 112vw) !important;
    height: min(500px, 112vw) !important;
    filter: none !important;
  }
}