/* Additional custom styles beyond Tailwind */
#ip-input::placeholder {
    color: #9CA3AF;
    opacity: 1;
}

/* Animation for the validate button */
#validate-btn {
    transition: all 0.3s ease;
}

#validate-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

/* Mobile menu animation */
#mobile-menu {
    transition: all 0.3s ease;
}

/* Highlight for IP address classes */
.ipv4-class-a {
    color: #3B82F6; /* blue */
}

.ipv4-class-b {
    color: #10B981; /* green */
}

.ipv4-class-c {
    color: #F59E0B; /* amber */
}

.ipv4-class-d {
    color: #EC4899; /* pink */
}

.ipv4-class-e {
    color: #8B5CF6; /* purple */
}

/* Responsive adjustments */
@media (max-width: 640px) {
    #hero h1 {
        font-size: 2rem;
    }
    
    #hero p {
        font-size: 1rem;
    }
}