/* React Bits effects for Zaldrin Solutions, ported to plain CSS and JS (see reactbits.js).
   Copyright (c) 2026 David Haz, MIT + Commons Clause. */
.rb-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* Aurora (Backgrounds/Aurora) */
.rb-aurora { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }
.rb-aurora-canvas { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.rb-aurora-fallback { background: radial-gradient(120% 70% at 30% 110%, rgba(61, 220, 194, 0.45), transparent 60%), radial-gradient(90% 60% at 80% 115%, rgba(10, 110, 97, 0.5), transparent 60%); }

/* BlurText */
.rb-blur-piece { display: inline-block; will-change: transform, filter, opacity; }

/* RotatingText (TextAnimations/RotatingText) */
.rb-rotate { display: inline-flex; overflow: hidden; vertical-align: bottom; padding-bottom: .08em; }
.rb-rotate-word { display: inline-flex; white-space: nowrap; }
.rb-rotate-char { display: inline-block; }

/* SpotlightCard (Components/SpotlightCard) */
.rb-spotlight { isolation: isolate; }
.rb-spotlight__light, .rb-spotlight__edge { position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; }
.rb-spotlight__light { z-index: -1; }
.rb-spotlight__edge {
  inset: -1px; z-index: 2; padding: 1px;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
}

/* ShinyText (TextAnimations/ShinyText), CSS variant */
.rb-shiny {
  display: inline-block; color: #FFFFFF;
  background: linear-gradient(120deg, #CFEFE9 0%, #CFEFE9 38%, #FFFFFF 50%, #CFEFE9 62%, #CFEFE9 100%);
  background-size: 250% 100%; background-position: 100% 0;
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
  animation: rb-shine 3.2s cubic-bezier(0.45, 0, 0.55, 1) 0.6s infinite;
}
@keyframes rb-shine { 0% { background-position: 100% 0; } 60%, 100% { background-position: 0% 0; } }

/* StarBorder (Animations/StarBorder), CSS variant: two light orbs travel along the edge of the button */
.rb-star { position: relative; display: inline-block; overflow: hidden; border-radius: 14px; padding: 1.5px; isolation: isolate; }
.rb-star::before, .rb-star::after { content: ""; position: absolute; width: 300%; height: 50%; opacity: .75; border-radius: 50%; z-index: 0; pointer-events: none;
  background: radial-gradient(circle, var(--rb-star-color, #3DDCC2), transparent 12%); }
.rb-star::before { bottom: -12px; right: -250%; animation: rb-star-bottom 6s linear infinite alternate; }
.rb-star::after { top: -12px; left: -250%; animation: rb-star-top 6s linear infinite alternate; }
.rb-star > * { position: relative; z-index: 1; }
@keyframes rb-star-bottom { 0% { transform: translate(0%, 0%); opacity: 1; } 100% { transform: translate(-100%, 0%); opacity: 0; } }
@keyframes rb-star-top { 0% { transform: translate(0%, 0%); opacity: 1; } 100% { transform: translate(100%, 0%); opacity: 0; } }

@media (prefers-reduced-motion: reduce) {
  .rb-shiny { animation: none; background: none; -webkit-text-fill-color: currentColor; }
  .rb-star::before, .rb-star::after { animation: none; opacity: 0; }
}
@media (forced-colors: active) {
  .rb-shiny { background: none; -webkit-text-fill-color: currentColor; }
  .rb-aurora, .rb-spotlight__light, .rb-spotlight__edge, .rb-star::before, .rb-star::after { display: none; }
}