/* Responsive styles */

/* Tablet: 768px - 1199px */
@media (max-width: 1199px) {
  .sidebar { display: none; }
  .mobile-header { display: flex; }
  .top-bar { display: none; }
  .main-content { margin-left: 0; padding-top: 0; }
  .site-footer { margin-left: 0; }
  .mobile-only { display: flex; }
  
  .ag-column { width: 190px; }
  .hero-arrow { display: none; }
  .hero-carousel {
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .hero-carousel::-webkit-scrollbar { display: none; }
  .hero-track { transition: none !important; transform: none !important; }
  .hero-slide { scroll-snap-align: start; }
  .hero-dots {
    position: relative;
    bottom: auto;
    left: auto;
    transform: none;
    justify-content: center;
    margin-top: -30px;
    margin-bottom: 16px;
    z-index: 10;
  }
  .hero-slide-content { padding: 44px 32px; }
  .hero-slide-content.hero-slide-content-top { left: 0; padding: 16px 32px 56px; }
  .hero-slide-content h2, .hero-slide-content h1 { font-size: 24px; }
  .hero-slide-content .hero-h1 { font-size: 28px; }
  .sl-grid { grid-template-columns: repeat(3, 1fr); }
  .gp-banner { height: 215px; }
}

/* Mobile: < 768px */
@media (max-width: 767px) {
  .hero-slide { aspect-ratio: 16/9; }
  .hero-slide-content { padding: 36px 20px; }
  .hero-slide-content.hero-slide-content-top { left: 0; padding: 16px 20px 48px; }
  .hero-slide-content h2, .hero-slide-content h1 { font-size: 18px; }
  .hero-slide-content .hero-h1 { font-size: 20px; }
  .hero-slide-content p { font-size: 13px; }
  .hero-btn { padding: 10px 24px; font-size: 14px; }
  .hero-arrow { width: 32px; height: 32px; font-size: 18px; }
  .hero-prev { left: 8px; }
  .hero-next { right: 8px; }
  .hero-nav-buttons { display: flex; }

  .carousel-section { padding: 0 12px; margin-bottom: 24px; }
  .section-title-wrap h2 { font-size: 18px; }
  .section-icon { width: 24px; height: 24px; }
  .game-card { width: 163px; }
  .lc-column { width: 163px; }
  .tw-card { width: 180px; }
  .gp-banner { height: 215px; }
  .gp-banner-content { padding: 16px 20px; }
  .gp-banner-logo { width: 40px; height: 40px; }
  .gp-banner-name { font-size: 24px; }
  .gp-banner-desc { margin-bottom: 16px; font-size: 13px; }

  .ag-track { gap: 8px; }
  .ag-column { width: 163px; }

  .carousel-arrow { display: none; }

  .sl-grid {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    height: 112px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    gap: 8px;
  }
  .sl-grid::-webkit-scrollbar { display: none; }
  .sl-card {
    width: 180px;
    height: calc(50% - 4px);
    flex-shrink: 0;
  }

  .footer-links { flex-direction: column; gap: 0; }
  .footer-column { border-bottom: 1px solid var(--bg-tertiary); }
  .footer-column-header {
    cursor: pointer;
    padding: 16px 0;
    margin-bottom: 0;
  }
  .footer-column-header .chevron { display: block; transition: transform 0.3s; }
  .footer-column-header.open .chevron { transform: rotate(180deg); }
  .footer-list {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
    padding-bottom: 0;
  }
  .footer-list.open {
    max-height: 500px;
    padding-bottom: 16px;
  }

  .mobile-logo { font-size: 20px; }
}

/* Small mobile: < 480px */
@media (max-width: 479px) {
  .game-card { width: 140px; }
  .lc-column { width: 140px; }
  .ag-column { width: 140px; }
  .hero-slide { aspect-ratio: 4/3; }
  .hero-slide-content.hero-slide-content-top { padding-bottom: 40px; }
  .hero-slide-content h2, .hero-slide-content h1 { font-size: 16px; }
  .hero-slide-content .hero-h1 { font-size: 18px; }
  .login-modal { min-width: auto; max-width: calc(100% - 32px); }
}