/* =============================================================================
   NEXILIA NETWORK — responsive.css
   Shared breakpoints. Page-specific overrides stay grouped under the same
   breakpoint so each width tier tells one coherent story.
   ============================================================================= */

/* -----------------------------------------------------------------------
   TABLET  (≤ 900px)
   ----------------------------------------------------------------------- */
@media (max-width: 900px) {
  .nav-links { display: none; }
  .nav-burger { display: flex; }

  .footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: var(--space-6);
  }
  .footer-brand, .footer-desc, .footer-socials { grid-column: 1 / -1; }

  .hud { grid-template-columns: repeat(3, 1fr); }
  .hud-cell:nth-child(3) { border-right: none; }
  .hud-cell:nth-child(4),
  .hud-cell:nth-child(5) { border-top: 1px solid var(--glass-border); }

  .news-grid { grid-template-columns: repeat(2, 1fr); }
  .features-grid { grid-template-columns: repeat(2, 1fr); }
  .steps-grid { grid-template-columns: repeat(2, 1fr); }
  .store-grid { grid-template-columns: repeat(2, 1fr); }

  .contact-grid { grid-template-columns: 1fr; }
}

/* -----------------------------------------------------------------------
   PHONE  (≤ 620px)
   ----------------------------------------------------------------------- */
@media (max-width: 620px) {
  /* The nav bar was overflowing on narrow phones — brand label + primary
     button + burger all fighting for one row pushed the burger button
     off-screen entirely. The mobile drawer already has its own prominent
     download CTA, so the inline nav button is redundant here anyway. */
  .nav-actions .btn-primary { display: none; }
  .nav-brand { font-size: 14px; }
  .nav-brand img { width: 26px; height: 26px; }

  .hero-actions { flex-direction: column; width: 100%; }
  .hero-actions .btn { width: 100%; }

  .nav-inner { padding: 0 var(--space-4); gap: var(--space-3); }

  .hud { grid-template-columns: repeat(2, 1fr); }
  .hud-cell:nth-child(2n) { border-right: none; }
  .hud-cell:nth-child(n+3) { border-top: 1px solid var(--glass-border); }

  .news-grid { grid-template-columns: 1fr; }
  .features-grid { grid-template-columns: 1fr; }

  .footer-grid { grid-template-columns: 1fr; }

  .footer-bottom {
    flex-direction: column;
    gap: var(--space-2);
    text-align: center;
  }

  .section-head {
    flex-direction: column;
    align-items: flex-start;
  }

  .cta-band { padding: var(--space-7) var(--space-4); }

  .contact-form-row { grid-template-columns: 1fr; }

  /* Icon + name/meta + button in one row was tight enough to clip the
     button on narrow phones (<380px) — stack it instead, same treatment
     as .hero-actions above. */
  .download-card {
    flex-direction: column;
    align-items: stretch;
    text-align: center;
  }
  .download-card-info { text-align: center; }
  .download-card #launcherDownloadBtn,
  .download-card .btn { width: 100%; }

  .steps-grid,
  .store-grid,
  .staff-grid,
  .vote-grid { grid-template-columns: 1fr; }
}