@media (max-width: 768px) {
    .navbar {
        flex-direction: column;
        gap: 15px;
    }

    .nav-links {
        flex-direction: column;
        gap: 10px;
        text-align: center;
    }

    .hero h1 {
        font-size: 2rem;
    }

    .hero-btns {
        flex-direction: column;
    }

    .top-bar {
        flex-direction: column;
        text-align: center;
        gap: 5px;
    }
}