/* =========================================================
   Responsive — 태블릿 / 모바일
   ========================================================= */
@media (max-width: 900px) {
  :root {
    --fs-display: 44px;
    --section-gap: 56px;
  }

  /* 좌측 라벨 컬럼을 위로 쌓기 */
  .section--split > .section__inner {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .hero {
    padding: 64px 0 48px;
    grid-template-columns: 1fr;
    gap: 36px;
  }
  .hero__frame { min-height: 300px; aspect-ratio: 16 / 10; }
}

@media (max-width: 640px) {
  :root {
    --fs-display: 34px;
    --fs-lead: 19px;
    --fs-sub: 16.5px;
    --page-pad-x: 20px;
    --row-pad-y: 13px;
  }

  .page { padding-bottom: 80px; }

  .topbar { font-size: 10px; }
  .topbar__date { margin-left: 0; }

  .hero__copy { min-width: 0; }
  .btn { width: 100%; justify-content: space-between; }
  .hero__url { word-break: break-all; }

  /* 타임라인: 연도/본문 간격 축소 */
  .timeline__item { grid-template-columns: 46px 1fr; gap: 16px; }

  /* 학사 일정: 주차+날짜 한 줄, 내용 아래 */
  .schedule__item { grid-template-columns: 46px 1fr; gap: 2px 16px; }
  .schedule__title { grid-column: 2; }

  /* 정보표: 라벨/값 세로 배치 */
  .spec th,
  .spec td { display: block; width: auto; }
  .spec th { padding: 14px 0 2px; }
  .spec td { padding: 0 0 14px; }

  /* 비교표: 가로 스크롤 대신 세로 배치 */
  .compare thead { display: none; }
  .compare tbody th,
  .compare tbody td { display: block; width: auto; padding: 0; }
  .compare tbody tr { padding: 14px 0; }
  .compare tbody th { padding-bottom: 4px; }
  .compare tbody td { padding-bottom: 6px; }
  .compare tbody td::before {
    content: attr(data-label);
    display: block;
    font-family: var(--font-mono);
    font-size: 10.5px;
    letter-spacing: 0.08em;
    color: var(--color-text-faint);
    margin-bottom: 2px;
  }
  .compare tbody td[colspan]::before { content: none; }
}