/* A brief, decorative white meteor travels only within the capsule outline. */
@property --button-meteor-angle {
  syntax: '<angle>';
  inherits: false;
  initial-value: 0deg;
}
.button-meteor{position:relative}
.button-meteor::after{
  content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1.5px;
  background:conic-gradient(from var(--button-meteor-angle),transparent 0deg 300deg,rgba(249,245,235,0) 300deg,rgba(249,245,235,.32) 342deg,rgba(249,245,235,.95) 356deg,#fff 359deg,transparent 360deg);
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  pointer-events:none;opacity:0;animation:button-meteor-orbit 9s linear infinite;animation-delay:1s;
}
.hero-register.button::after{inset:-1.3px;animation-delay:2.5s}
.price-card:nth-child(1)>.button::after{animation-delay:1.5s}
.price-card:nth-child(2)>.button::after{animation-delay:3s}
.price-card:nth-child(3)>.button::after{animation-delay:4.5s}
@keyframes button-meteor-orbit{
  0%{--button-meteor-angle:0deg;opacity:0}
  3%{opacity:1}
  30%{opacity:1}
  33%,100%{--button-meteor-angle:360deg;opacity:0}
}
.button-meteor:is(:hover,:focus-visible,:active)::after{visibility:hidden}
@media(prefers-reduced-motion:reduce){.button-meteor::after{display:none;animation:none}}