/* Responsive — mobile-first breakpoints */

/* Mobil: sidebar kapalı, bottom nav açık */
@media (max-width: 1023px) {
  .app-shell {
    grid-template-columns: 1fr;
  }

  .sidebar {
    position: fixed;
    left: 0;
    top: 0;
    width: min(300px, 88vw);
    transform: translateX(-105%);
    transition: transform 260ms cubic-bezier(0.22, 1, 0.36, 1);
    box-shadow: var(--shadow-lg);
  }
  .sidebar.open { transform: translateX(0); }

  .menu-toggle { display: grid; }

  .bottom-nav { display: flex; }

  .search-trigger {
    min-width: 0;
    max-width: none;
    flex: 1;
  }
  .search-trigger span.label,
  .search-trigger kbd { display: none; }

  .content {
    padding: 1rem;
    padding-bottom: calc(1rem + var(--bottom-nav-height) + env(safe-area-inset-bottom));
  }

  .grid-4, .grid-3 { grid-template-columns: repeat(2, 1fr); }
  .grid-2 { grid-template-columns: 1fr; }

  .ai-fab span { display: none; }
  .ai-fab {
    padding: 0;
    width: 48px;
    height: 48px;
    justify-content: center;
    border-radius: 16px;
  }

  .fab {
    bottom: calc(var(--bottom-nav-height) + 0.85rem);
  }
  .ai-fab {
    bottom: calc(var(--bottom-nav-height) + 0.85rem);
  }
  .ai-panel {
    left: 0.75rem;
    right: 0.75rem;
    width: auto;
    bottom: calc(var(--bottom-nav-height) + 4.5rem);
  }
}

@media (max-width: 767px) {
  .grid-4, .grid-3, .grid-2 { grid-template-columns: 1fr; }

  .compare-panel .grid-3 { grid-template-columns: 1fr; }

  .topbar {
    padding: 0 0.75rem;
    gap: 0.5rem;
  }

  .page-title-wrap p { display: none; }

  .stat-value { font-size: 1.4rem; }

  .table { min-width: 520px; }

  .hide-sm { display: none !important; }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-3 { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
  .content {
    padding: 1.5rem 1.75rem;
    padding-bottom: 1.75rem;
  }
  .bottom-nav { display: none; }
  .fab { bottom: 1.5rem; }
  .ai-fab { bottom: 1.5rem; }
  .ai-panel { bottom: 5.5rem; }
}

@media (min-width: 1280px) {
  .content { padding: 1.75rem 2rem; }
  .grid-4 { grid-template-columns: repeat(4, 1fr); }
}

@media (min-width: 1440px) {
  .content { max-width: 1480px; }
}

/* Küçük telefonlar (320px) */
@media (max-width: 359px) {
  .stat-value { font-size: 1.25rem; }
  .btn { padding: 0.55rem 0.85rem; font-size: 0.82rem; }
  .bottom-nav-item { min-width: 48px; font-size: 0.6rem; }
}

/* Landing responsive */
@media (max-width: 767px) {
  .landing-nav .nav-links { display: none; }
  .hero-title { font-size: 2rem !important; }
  .feature-grid { grid-template-columns: 1fr !important; }
  .pricing-grid { grid-template-columns: 1fr !important; }
}