/* public/css/style.css */

/* --- 1. Font Setup --- */
@font-face {
    font-family: 'Poppins-Regular';
    src: url('/font/Poppins/Poppins-Regular.ttf') format('truetype');
}
@font-face {
    font-family: 'Poppins-Bold';
    src: url('/font/Poppins/Poppins-Bold.ttf') format('truetype');
}

/* --- 2. Global Setup --- */
body {
    font-family: 'Poppins-Regular', sans-serif;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

/* --- 3. Custom Animations --- */
@keyframes float {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-15px); }
}

@keyframes glow-pulse {
    0% { box-shadow: 0 0 15px rgba(59, 130, 246, 0.3); border-color: rgba(255, 255, 255, 0.8); }
    50% { box-shadow: 0 0 30px rgba(59, 130, 246, 0.8), 0 0 60px rgba(59, 130, 246, 0.5); border-color: #60a5fa; }
    100% { box-shadow: 0 0 15px rgba(59, 130, 246, 0.3); border-color: rgba(255, 255, 255, 0.8); }
}

/* --- 4. Utility Classes --- */
.animate-float-slow {
    animation: float 6s ease-in-out infinite;
}

.animate-float-delayed {
    animation: float 7s ease-in-out infinite;
    animation-delay: 3s;
}

.logo-main-glow {
    /* Border lebih tipis agar logo makin penuh */
    border-width: 3px; 
    animation: glow-pulse 3s infinite;
}

/* Efek Kaca (Glassmorphism) */
.glass-panel {
    background: rgba(255, 255, 255, 0.1); /* Sedikit lebih terang */
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 2px solid rgba(255, 255, 255, 0.3); /* Border lebih tegas */
    box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);
}