/* ==========================================================================
   ECONOVO — responsive.css
   ========================================================================== */

/* Lighter blur on phones — real backdrop-filter blur is real GPU cost, and
   with the navbar + mobile menu + several badges all blurring at once, a
   smaller radius keeps scrolling smooth on mid-range Android hardware. */
@media (max-width: 768px) {
    :root { --sp-96: 3.5rem; --sp-128: 4.5rem; --glass-blur: 14px; --glass-blur-sm: 10px; }
    .nav-links { display: none; }
    .nav-toggle { display: inline-flex; }
    .mobile-join { display: block; }
    body { padding-bottom: 90px; } /* room for the floating join bar */
    .cta-section .mobile-join-spacer { display: none; }
    .floating-badge { left: 12px; bottom: 16px; padding: var(--sp-12) var(--sp-16); }
    .cta-section { margin: 0 var(--sp-16); padding: var(--sp-64) var(--sp-16); }
}

@media (max-width: 992px) {
    .hero-grid { grid-template-columns: 1fr; text-align: center; }
    .hero-content p { margin: 0 auto var(--sp-32); }
    .hero-tags, .hero-actions { justify-content: center; }
    .hero-img-container { height: 380px; }
    .timeline::before { left: 0; }
    .timeline-item, .timeline-item:nth-child(even) { flex-direction: column !important; align-items: flex-start; padding-left: var(--sp-32); }
    [lang="ar"] .timeline-item { padding-left: 0; padding-right: var(--sp-32); }
    .timeline-content { width: 100%; }
    .timeline-dot { left: 0; }
    [lang="ar"] .timeline-dot { left: auto; right: 0; }
    .footer-grid { grid-template-columns: 1fr; gap: var(--sp-32); }
    .stats-row { grid-template-columns: repeat(2, 1fr); }
    .stat-cell:nth-child(2) { border-right: none; }
    [lang="ar"] .stat-cell:nth-child(2) { border-left: none; }
    .stat-cell:nth-child(3), .stat-cell:nth-child(4) { border-top: 1px solid var(--glass-border); }
    .floating-tag { display: none; }
}

@media (max-width: 768px) {
    :root { --sp-96: 3.5rem; --sp-128: 4.5rem; }
    .nav-links { display: none; }
    .nav-toggle { display: inline-flex; }
    .mobile-join { display: block; }
    body { padding-bottom: 90px; } /* room for the floating join bar */
    .cta-section .mobile-join-spacer { display: none; }
    .floating-badge { left: 12px; bottom: 16px; padding: var(--sp-12) var(--sp-16); }
    .cta-section { margin: 0 var(--sp-16); padding: var(--sp-64) var(--sp-16); }
}

@media (max-width: 480px) {
    .stats-row { grid-template-columns: 1fr 1fr; }
    .hero-img-container { height: 300px; }
}
