/* =========================================
   tablet.css — 平板（768px–1024px）覆寫，需最後載入
   首屏的平板樣式在 hero.css（課程頁共用）
   ========================================= */
@media (min-width:768px) and (max-width:1024px){
  /* 各區塊左右留 30px（首屏除外） */
  .pain-points,
  .course-modules,
  .core-capabilities,
  .student-outcomes,
  .scenarios-section,
  .consultation-section{padding-left:30px;padding-right:30px}

  /* 區塊一：維持電腦版三欄錯落，標題允許換行避免溢出 */
  .pain-points .card__question{display:block;white-space:normal;font-size:18px}
  .pain-points .card__icon{display:inline-block;margin-right:.3em;vertical-align:-.15em}
  .pain-points .card__answer{font-size:16px}

  /* 區塊三：維持電腦版「卡片 / 圖 / 卡片」三欄，圖片與兩側卡片同高 */
  .capabilities-grid{grid-template-columns:1.2fr 1fr 1.2fr;gap:16px}
  .cards-column{gap:16px}
  .cap-card{flex:1;padding:18px 14px}
  .cap-card .card-title{font-size:16px;white-space:normal}
  .card-list li{font-size:14px;white-space:normal}
}