/* ================= ANIMATIONS ================= */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes slideIn {
    from { transform: translateY(100%); }
    to { transform: translateY(0); }
}

@keyframes countUp {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.count-animate {
    animation: countUp 0.6s ease-out forwards;
}

/* ================= BUTTON ICONS ================= */
.btn-icon { 
    width: 36px; 
    height: 36px; 
    border-radius: 50%; 
    background: var(--bg-surface-hover); 
    color: var(--text-muted); 
    border: 1px solid var(--border); 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    transition: 0.2s; 
    cursor: pointer; 
}
.btn-icon:hover { 
    background: var(--primary-light); 
    color: var(--primary); 
    border-color: var(--primary-light); 
}
.btn-icon.small { 
    width: 28px; 
    height: 28px; 
    font-size: 0.8rem; 
}