<template>
  <div class="relative mx-auto flex items-center justify-center">
    <!-- Animated glowy blurred blobs behind slot content -->
    <div class="glow-bar animate-pulse" aria-hidden="true" />
    <slot />
  </div>
</template>

<style scoped>
.glow-bar {
  position: absolute;
  width: 460px;
  height: 53px;
  opacity: 0.6;
  background: rgba(0, 190, 215, 0.5);
  border-radius: 9999px;
  z-index: -1;
  box-shadow:
    0 0 47px 10px rgba(0, 190, 215, 1),
    inset 0 0 4px 4px rgba(0, 190, 215, 1);
  filter: blur(74px);
}
</style>
