/* ═══════════════════════════════════════════
   오상신경외과 — 통합 디자인 토큰
   ═══════════════════════════════════════════ */

:root {
  /* ─── 브랜드 색상 (통합 팔레트) ─── */
  --color-primary:      #363636;
  --color-olive:        #515c3e;
  --color-olive-light:  #6c7a53;
  --color-olive-dark:   #3a422c;
  --color-gold:         #c3a990;
  --color-gold-deep:    #b08860;
  --color-cream:        #f2efea;
  --color-warm-bg:      #f9f8f6;
  --color-warm-bg-alt:  #f4f2ed;

  /* ─── 텍스트 ─── */
  --color-text:         #2c2c2c;
  --color-text-light:   #666666;
  --color-text-muted:   #888888;
  --color-text-faint:   #b0a898;

  /* ─── 배경 ─── */
  --color-bg:           #ffffff;
  --color-bg-dark:      #111111;
  --color-bg-section:   #f8f8f8;
  --color-border:       #e5e5e5;
  --color-border-warm:  #f0ece7;
  --color-overlay:      rgba(0, 0, 0, 0.5);

  /* ─── 폰트 (통일) ─── */
  --font-main:    'Noto Sans KR', 'Pretendard', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-serif:   'Noto Serif KR', serif;
  --font-display: 'Playfair Display', serif;

  --font-weight-light:    300;
  --font-weight-regular:  400;
  --font-weight-medium:   500;
  --font-weight-semibold: 600;
  --font-weight-bold:     700;

  /* ─── 레이아웃 ─── */
  --max-width:        1200px;
  --max-width-narrow: 800px;
  --max-width-wide:   1440px;
  --section-padding:  100px 0;
  --section-padding-mobile: 60px 0;
  --container-padding: 0 24px;

  /* ─── 효과 ─── */
  --border-radius:    8px;
  --border-radius-lg: 16px;
  --shadow:           0 4px 24px rgba(0, 0, 0, 0.08);
  --shadow-lg:        0 8px 40px rgba(0, 0, 0, 0.12);
  --transition:       0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-fast:  0.15s ease;
}

/* ─── 반응형 모바일 그리드 수정 (전역) ─── */
@media (max-width: 768px) {
  .ab-symptoms__grid,
  .ab-causes__grid,
  .hub-cards,
  .research-grid,
  .npt-cards__grid,
  .method-cards,
  .treatment-grid {
    grid-template-columns: 1fr !important;
  }

  .stats-row {
    flex-direction: column !important;
    gap: 32px !important;
  }

  .hero-stat__numbers {
    flex-wrap: wrap !important;
    gap: 24px !important;
  }
}

@media (max-width: 1024px) {
  .ab-symptoms__grid,
  .ab-causes__grid,
  .hub-cards,
  .research-grid,
  .npt-cards__grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}