/* --- Font Setup --- */
/* Font Outfit đã được load từ HTML, chỉ cần gọi tên ở đây */
.font-outfit {
    font-family: 'Outfit', 'Be Vietnam Pro', system-ui, sans-serif;
}

/* --- Background Animation --- */
.background-animation {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    overflow: hidden;
    background-color: #0f0f11;
}

.blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.6;
    animation: blob-bounce 10s infinite ease-in-out alternate;
}

.blob-1 {
    top: -10%; left: -10%; width: 50vw; height: 50vw;
    background: radial-gradient(circle, rgba(220, 38, 38, 0.4) 0%, rgba(0, 0, 0, 0) 70%);
    animation-duration: 12s;
}

.blob-2 {
    bottom: -10%; right: -10%; width: 60vw; height: 60vw;
    background: radial-gradient(circle, rgba(234, 88, 12, 0.3) 0%, rgba(0, 0, 0, 0) 70%);
    animation-duration: 15s;
    animation-direction: alternate-reverse;
}

.blob-3 {
    top: 40%; left: 40%; width: 40vw; height: 40vw;
    background: radial-gradient(circle, rgba(124, 58, 237, 0.2) 0%, rgba(0, 0, 0, 0) 70%);
    animation-duration: 18s;
}

@keyframes blob-bounce {
    0% { transform: translate(0, 0) scale(1); }
    100% { transform: translate(20px, -20px) scale(1.1); }
}

/* --- Animations --- */
@keyframes fadeInUp {
    from { opacity: 0; transform: translate3d(0, 40px, 0); }
    to { opacity: 1; transform: translate3d(0, 0, 0); }
}

.animate-fade-in-up {
    animation: fadeInUp 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
    opacity: 0;
}

@keyframes pulseSlow {
    0%, 100% { opacity: 0.4; transform: scale(1); }
    50% { opacity: 0.2; transform: scale(1.1); }
}

.animate-pulse-slow {
    animation: pulseSlow 8s infinite ease-in-out;
}

/* Delay Utils */
.delay-100 { animation-delay: 0.1s; }
.delay-200 { animation-delay: 0.2s; }
.delay-300 { animation-delay: 0.3s; }
.delay-1000 { animation-delay: 1s; }

/* --- Scrollbar --- */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #0a0a0c; }
::-webkit-scrollbar-thumb { background: #333; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #555; }