/* Obsidian Games — mobile responsiveness. Desktop (>768px) is unaffected. */

/* Hamburger hidden until mobile */
.og-hamburger { display: none; }

@media (max-width: 768px) {
  /* prevent any horizontal overflow (decorative blobs, etc.) */
  html, body { overflow-x: hidden; }

  /* ---- NAV ---- */
  .og-nav { padding-left: 20px !important; padding-right: 20px !important; }
  .og-nav-links { display: none !important; }
  .og-hamburger {
    display: inline-flex; align-items: center; justify-content: center;
    width: 44px; height: 44px; padding: 0; border: none;
    background: transparent; color: #fff; cursor: pointer;
  }
  .og-hamburger svg { width: 26px; height: 26px; }

  /* ---- Full-screen overlay (built by nav.js) ---- */
  .og-mobile-overlay {
    position: fixed; inset: 0; z-index: 100;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 6px; padding: 24px;
    background: rgba(7,7,11,.94); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);
    opacity: 0; visibility: hidden; transition: opacity .25s ease, visibility .25s ease;
  }
  .og-mobile-overlay.is-open { opacity: 1; visibility: visible; }
  .og-mobile-overlay a {
    font-family: 'Sora', system-ui, sans-serif; font-size: 22px; font-weight: 600;
    color: #ECEAF2; text-decoration: none; min-height: 48px;
    display: flex; align-items: center; justify-content: center; padding: 12px 24px;
  }
  .og-mobile-overlay a.is-active { color: #22D3EE; }
  .og-mobile-overlay a.nav-cta {
    margin-top: 22px; border: 1px solid rgba(255,255,255,.22);
    border-radius: 999px; background: rgba(255,255,255,.06);
  }
  .og-overlay-close {
    position: absolute; top: 18px; right: 18px; width: 44px; height: 44px;
    border: none; background: transparent; color: #fff; font-size: 30px; line-height: 1; cursor: pointer;
  }

  /* ---- Section padding ---- */
  .og-section { padding-left: 20px !important; padding-right: 20px !important; }

  /* ---- Stacking ---- */
  /* minmax(0,1fr) (not 1fr) lets tracks shrink below content min-width, preventing overflow */
  .og-split  { grid-template-columns: minmax(0, 1fr) !important; }
  .og-grid-3 { grid-template-columns: minmax(0, 1fr) !important; }
  .og-grid-4 { grid-template-columns: minmax(0, 1fr) !important; }

  /* Footer: brand full-width on top, link columns 2-up */
  .og-footer-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; gap: 28px 20px !important; }
  .og-footer-grid > :first-child { grid-column: 1 / -1; }

  /* Press facts bar exception: stay 2-up */
  .og-grid-4.og-facts { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; }
}

@media (max-width: 480px) {
  .og-section { padding-left: 16px !important; padding-right: 16px !important; }
  .og-footer-grid { grid-template-columns: minmax(0, 1fr) !important; }
  .og-grid-4.og-facts { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; }
  .og-mobile-overlay a { font-size: 20px; }
}