/* ============================================================
   MediFind - mobile.css
   모바일 최적화: 전 페이지 대응 및 터치 UI 개선
   ============================================================ */

@media (max-width: 1024px) {
  .detail-grid { grid-template-columns: 1fr; gap: 24px; }
  /* 푸터: 브랜드 영역은 한 줄 전체, 링크 그룹은 가로 3단 */
  .footer-grid { grid-template-columns: repeat(3, 1fr); gap: 32px 24px; }
  .footer-info { grid-column: 1 / -1; }
  .quick-grid { grid-template-columns: repeat(2, 1fr); }
  .page-sidebar { display: none; }
}

@media (max-width: 768px) {
  :root {
    --header-height: 56px;
  }

  .container { padding: 0 16px; }

  /* 헤더: 로고 + 네비 + 검색이 한 줄에 들어가도록 압축 (글자 줄바꿈 방지) */
  .header-inner { gap: 8px; }
  .logo { font-size: 1.05rem; gap: 6px; }
  .logo-icon { width: 28px; height: 28px; }
  .main-nav { gap: 2px; flex-shrink: 0; }
  .nav-link { padding: 6px 9px; font-size: 0.82rem; }
  .header-search-toggle { width: 34px; height: 34px; flex-shrink: 0; }

  .hero { padding: 40px 0; }
  .hero-title { font-size: 1.75rem; }
  .hero-subtitle { font-size: 0.95rem; margin-bottom: 24px; }

  .search-input-wrap { border-radius: 10px; }
  .search-input { padding: 12px 15px; }
  .search-btn { padding: 0 16px; font-size: 0.9rem; }

  .quick-links { margin-top: -20px; }
  .quick-grid { gap: 10px; }
  .quick-card { padding: 16px; }
  .quick-icon { font-size: 2rem; margin-bottom: 12px; }
  .quick-card h3 { font-size: 0.9rem; }
  .quick-card p { font-size: 0.75rem; }

  .region-grid { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .region-card { padding: 12px 8px; font-size: 0.8rem; }

  .category-hero { padding: 30px 0 20px; }
  .category-hero-title { font-size: 1.5rem; }
  .category-hero-desc { font-size: 0.9rem; }
  .category-select-section { padding: 20px; margin-bottom: 30px; }
  /* 모바일에서도 시/도 · 시/군/구 를 한 줄에 (세로 쌓지 않음) */
  .category-select-row { flex-direction: row; gap: 8px; }
  .category-select-row .region-select { flex: 1 1 0; width: auto; min-width: 0; }
  .category-select-row .region-select-lg { padding: 12px 30px 12px 12px; font-size: 14px; min-width: 0; }
  .region-select { width: 100%; }

  .inst-card { padding: 16px; }
  .inst-name { font-size: 1.1rem; }
  /* 전화하기·지도보기·상세보기를 한 줄에 균등 배치 */
  .inst-card-footer { flex-direction: row; gap: 6px; }
  .btn-action {
    flex: 1;
    width: auto;
    padding: 10px 4px;
    font-size: 0.78rem;
    gap: 4px;
    white-space: nowrap;
  }
  .btn-action svg { width: 15px; height: 15px; flex-shrink: 0; }

  .detail-header { padding: 20px 0; }
  .detail-name { font-size: 1.5rem; line-height: 1.3; }
  .detail-info, .detail-hours { padding: 20px; }
  .info-row { flex-direction: column; gap: 4px; padding: 10px 0; }
  .info-row dt { width: 100%; font-size: 0.85rem; }
  .info-row dd { font-size: 0.95rem; }

  /* 좁은 화면에서도 링크 그룹은 가로 3단 유지 (브랜드는 가운데 정렬) */
  .footer-grid { grid-template-columns: repeat(3, 1fr); gap: 28px 14px; }
  .footer-info { grid-column: 1 / -1; text-align: center; }
  .footer-info .logo { justify-content: center; }
  .footer-title { font-size: 0.95rem; margin-bottom: 14px; }
  .footer-links a { font-size: 0.85rem; }
  .site-footer { padding: 40px 0 80px; }

  .ad-container { margin: 20px 0; }

  /* 하단 고정 광고가 마지막 콘텐츠/푸터를 가리지 않도록 본문 하단 여백 확보 */
  body { padding-bottom: calc(60px + env(safe-area-inset-bottom)); }

  .mobile-fab { display: flex; }
  /* height 고정 제거: 광고 실제 높이(50/100px)에 맞춰 클리핑 없이 노출(정책 안전) */
  .sticky-ad-mobile { display: block; min-height: 50px; }

  /* 헤더 검색 버튼 */
  .header-search-toggle { display: flex; }

  /* iOS 줌 방지 */
  .search-input, .region-select { font-size: 16px; }
}

@media (max-width: 480px) {
  .hero-title { font-size: 1.5rem; }
  .region-grid { grid-template-columns: repeat(2, 1fr); }
  .quick-grid { grid-template-columns: 1fr 1fr; }
  .pagination { flex-wrap: wrap; }
  .logo span { font-size: 0.98rem; }
  .nav-link { padding: 6px 7px; font-size: 0.78rem; }
}

@media (max-width: 360px) {
  /* 초소형 화면: 로고 텍스트 숨기고 아이콘만 (네비 줄바꿈 완전 방지) */
  .logo span { display: none; }
  .nav-link { padding: 6px 6px; }
}
