body {
    font-family: 'Inter', sans-serif;
}

.gradient-bg {
    background: linear-gradient(180deg, #004ff8 0%, #3d8bfd 35%, #7db3ff 65%, #c5e0ff 85%, #ffffff 100%);
}

/* Mobile gradient background - only applies on screens smaller than lg (1024px) */
@media (max-width: 1023px) {
    .mobile-gradient-bg {
         background: linear-gradient(180deg, #004ff8 0%, #ffffff 35%, #ffffff 65%, #ffffff 85%, #ffffff 100%);
    }
}

/* Desktop - no gradient, just white background */
@media (min-width: 1024px) {
    .mobile-gradient-bg {
        background: #ffffff;
    }
}

.input-focus:focus {
    outline: none;
    border-color: #d1d5db;
    background-color: #ffffff;
}

input[type="text"],
input[type="email"],
input[type="password"] {
    background-color: #f5f5f5;
}

.btn-hover:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.social-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.fade-in {
    animation: fadeIn 0.6s ease-in;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}