/* ============================================================
 * responsive.css — Breakpoint corrections (tablet + mobile).
 * Loaded LAST so it wins.
 * ============================================================ */

@media (max-width: 1200px) {
    .container,
    .top-bar-content,
    .header-content {
        padding: 0 40px;
    }
}

@media (max-width: 992px) {
    .container,
    .top-bar-content,
    .header-content {
        padding: 0 30px;
    }
}

/* Tablet & mobile: hide top bar, collapse nav to hamburger */
@media (max-width: 768px) {
    .top-bar { display: none !important; }
    .header { top: 0 !important; }
    .header-content {
        height: 70px;
        padding: 0 20px;
    }
    .logo img { height: 50px; }

    .nav-menu { display: none; }
    .mobile-menu-toggle { display: inline-flex; align-items: center; justify-content: center; }

    #mobileMenu {
        top: 70px !important;
        max-height: calc(100vh - 70px) !important;
    }

    .lang-dropdown-content {
        right: -60px;
        min-width: 220px;
    }
    html[dir="rtl"] .lang-dropdown-content {
        right: auto;
        left: -60px;
    }

    .footer-bottom {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0.4rem;
        padding-top: 1rem;
    }
}

@media (max-width: 480px) {
    .header { top: 0; }
    #mobileMenu { top: 70px; }
    .lang-btn span { display: none; }   /* show flag only on tiny screens */
    .header-content { padding: 0 14px; }
    .logo img { height: 44px; }

    .hero-buttons { flex-direction: column; }
    .btn-hero-primary,
    .btn-hero-outline {
        width: 100%;
        text-align: center;
    }
}