/* review/assets/report-enhance.css · v1.0 (2026-06-03)
   리포트 모바일 최적화 + McKinsey 절제. 각 리포트 인라인 <style> 이후 로드되어 오버라이드.
   "너무 좁다" 수정: 풀블리드·타이포 스케일업·표 셀 최소폭(1글자 줄바꿈 방지). 그린 절제(신호로만). */

/* ── McKinsey 절제(데스크톱·모바일 공통): 그린은 신호로만, 위계는 흑백 ── */
:root { --green-glow: rgba(0,230,118,0.07); }           /* 과한 fill 완화 */
.insight { background: transparent; border-left: 3px solid var(--green); padding: 6px 0 6px 22px; }
.insight.amber { background: transparent; border-left-color: var(--amber); }
.data-page h2 { letter-spacing: -0.4px; }
.cover h1 { letter-spacing: -0.8px; }
.data-page .section-tag, .cover .kicker { letter-spacing: 1.4px; }

/* ── 모바일(≤768px): 너무 좁다 해결 ── */
@media (max-width: 768px) {
  html, body { overflow-x: hidden; max-width: 100vw; }
  body { gap: 22px; padding: 16px 0; }
  .page { width: 100%; max-width: 100vw; border-radius: 0; }

  .cover { height: auto; min-height: auto; padding-bottom: 26px; }
  .cover .top { padding: 22px 18px; }
  .cover .center { padding: 28px 18px; }
  .cover .kicker { font-size: 13px; margin-bottom: 14px; }
  .cover h1 { font-size: clamp(26px, 7.4vw, 34px); line-height: 1.22; margin-bottom: 18px; }
  .cover .sub { font-size: 16px; line-height: 1.62; }
  .cover .bottom { padding: 22px 18px; flex-direction: column; align-items: flex-start; gap: 16px; }
  .cover .report-meta { font-size: 12px; line-height: 1.7; }
  .cover .tag { font-size: 13px; padding: 10px 18px; }

  .data-page { padding: 28px 18px; }
  .data-page .section-tag { font-size: 12px; }
  .data-page h2 { font-size: clamp(21px, 6vw, 26px); line-height: 1.3; }
  .data-page .desc { font-size: 15px; line-height: 1.6; margin-bottom: 22px; }
  .divider { margin: 18px 0; }
  .watermark { font-size: 30px; letter-spacing: 3px; }

  /* 표: 가로 스크롤 + 셀 최소폭(좁아서 1글자씩 줄바꿈되는 것 방지) */
  .comp-table { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .comp-table th, .comp-table td { min-width: 92px; }
  .comp-table .brand { min-width: 116px; font-size: 17px; }
  .comp-table td { font-size: 14.5px; line-height: 1.5; padding: 13px 12px; }

  .stat-grid, .promo-grid, .budget-grid { grid-template-columns: 1fr; gap: 12px; }
  .stat-card, .promo-card, .budget-card { padding: 20px; }
  .stat-card .stat-val { font-size: 32px; }

  .bar-label { width: 78px; font-size: 12px; }
  .insight p { font-size: 15px; line-height: 1.65; }
  .checklist li { font-size: 15px; line-height: 1.9; }
  .page-footer, .references { padding-left: 18px; padding-right: 18px; }
  .references li { font-size: 11px; }

  .report-cta-section { width: auto; max-width: 100%; margin: 22px 12px; padding: 28px 20px; border-radius: 0 10px 10px 0; }
  .report-cta-section .cta-title { font-size: 21px; line-height: 1.35; }
  .report-cta-section .cta-desc { font-size: 15px; line-height: 1.65; }
  .report-cta-btn { display: block; text-align: center; padding: 16px 24px; font-size: 16px; }
  .report-cta-upcoming { flex-direction: column; align-items: flex-start; gap: 10px; }

  img, svg, canvas { max-width: 100%; height: auto; }
}

@media (max-width: 380px) {
  .cover h1 { font-size: 24px; }
  .data-page { padding: 24px 14px; }
  .cover .center { padding: 24px 14px; }
  .comp-table .brand { min-width: 104px; }
}