---
---
<div class="splash">
<div class="logo-anim">Astro Components</div>
</div>
<style>
.splash { position: fixed; inset: 0; background: #080b14; z-index: 9999; display: grid; place-items: center; animation: fade-out 1s forwards 2s; }
.logo-anim { font-size: 3rem; font-weight: 900; color: #fff; animation: scale-pulse 1.5s infinite linear; background: linear-gradient(135deg, #6366f1, #c084fc); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
@keyframes fade-out { to { opacity: 0; pointer-events: none; } }
@keyframes scale-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.1); } }
</style>
---
---
<div class="splash">
<div class="logo-anim">Astro Components</div>
</div>
<style>
.splash { position: fixed; inset: 0; background: #080b14; z-index: 9999; display: grid; place-items: center; animation: fade-out 1s forwards 2s; }
.logo-anim { font-size: 3rem; font-weight: 900; color: #fff; animation: scale-pulse 1.5s infinite linear; background: linear-gradient(135deg, #6366f1, #c084fc); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
@keyframes fade-out { to { opacity: 0; pointer-events: none; } }
@keyframes scale-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.1); } }
</style>
