/* ================================================================
   responsive.css — GOLD.DUAL-GAMING.RO
   Media queries for tablet and mobile breakpoints
   ================================================================ */

/* ── TABLET — ≤ 1024px ───────────────────────────────────────────── */
@media (max-width: 1024px) {
  .join-server__status-grid { grid-template-columns: repeat(2, 1fr); }
  .features__grid     { grid-template-columns: repeat(2, 1fr); }
  .stats__grid        { grid-template-columns: repeat(2, 1fr); }
  .vip__pricing-grid  { grid-template-columns: repeat(2, 1fr); }
  .gt__grid           { grid-template-columns: repeat(2, 1fr); }
  .ts__grid           { grid-template-columns: repeat(2, 1fr); }
  .news__grid         { grid-template-columns: repeat(2, 1fr); }
  .staff__grid        { grid-template-columns: repeat(2, 1fr); }
  .footer__top        { grid-template-columns: 1fr 1fr; gap: 36px; }
}

/* ── MOBILE — ≤ 768px ────────────────────────────────────────────── */
@media (max-width: 768px) {
  .section { padding: 72px 0; }

  /* Navbar */
  .navbar__toggle { display: flex; }

  .navbar__nav {
    position: fixed;
    top: var(--nav-h); left: 0; right: 0;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    background: rgba(13,13,13,0.98);
    backdrop-filter: blur(18px);
    border-bottom: 1px solid var(--border);
    padding: 12px 0 20px;
    transform: translateY(-110%);
    opacity: 0;
    transition: transform .38s cubic-bezier(0.4,0,0.2,1),
                opacity .38s cubic-bezier(0.4,0,0.2,1);
    pointer-events: none;
    z-index: 999;
  }

  .navbar__nav.is-open {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
  }

  .navbar__link {
    padding: 13px 28px;
    border-radius: 0;
    border-bottom: 1px solid rgba(255,255,255,0.04);
    font-size: .95rem;
  }

  .navbar__link--vip {
    border: none;
    border-bottom: 1px solid rgba(255,255,255,0.04);
  }

  /* Hero */
  .hero__title      { font-size: clamp(1.9rem, 9vw, 3.2rem); letter-spacing: -.5px; }
  .hero__welcome    { letter-spacing: 4px; }
  .hero__actions    { flex-direction: column; align-items: center; }
  .hero__actions .btn { width: 100%; max-width: 300px; justify-content: center; }
  .hero__mouse      { display: none; } /* hide on small screens to save space */

  /* Stats */
  .stats__grid { grid-template-columns: repeat(2, 1fr); }

  /* Join Server */
  .join-server__status-grid { grid-template-columns: repeat(2, 1fr); }
  .join-server__banner { padding: 56px 20px; }
  .join-server__info { padding: 24px 20px; gap: 18px 20px; }

  /* Features */
  .features__grid { grid-template-columns: 1fr; }

  /* VIP */
  .vip__pricing-grid { grid-template-columns: 1fr; }
  .vip__benefits { gap: 8px; }

  /* TeamSpeak */
  .ts__grid--3col { grid-template-columns: 1fr; }
  .ts__actions { flex-direction: column; align-items: center; }
  .ts__action-btn { width: 100%; max-width: 300px; justify-content: center; }
  .ts__guide { padding: 28px 20px; }

  /* News */
  .news__grid { grid-template-columns: 1fr; }

  /* Footer */
  .footer__top { grid-template-columns: 1fr; gap: 32px; padding: 48px 0 36px; }
  .footer__tagline { max-width: 100%; }

  /* About */
  .about__card { padding: 36px 24px; }
}

/* ── SMALL MOBILE — ≤ 480px ──────────────────────────────────────── */
@media (max-width: 480px) {
  :root { --nav-h: 62px; }

  .container { padding: 0 18px; }

  .stats__grid    { grid-template-columns: 1fr; }
  .join-server__status-grid { grid-template-columns: 1fr; }
  .btn--xl        { padding: 15px 28px; font-size: 1rem; }

  .hero__title    { letter-spacing: -0.5px; }

  .btn--lg        { padding: 13px 22px; font-size: .9rem; }

  .section-title  { font-size: 1.75rem; }

  .back-to-top    { bottom: 18px; right: 18px; }

  .navbar__actions { gap: 8px; margin-left: 6px; }
  .auth-btn { padding: 5px 10px; font-size: .68rem; }
  .user-dropdown__name { display: none; }
  .user-dropdown__trigger { padding: 5px 8px 5px 5px; }
}
