/* ============================================================
   響應式 Responsive — 手機／平板斷點與溢出保護
   ============================================================ */

/* ============ Mobile safety — prevent any horizontal overflow / off-center in either language ============ */
@media (max-width:720px){
  .section{ padding-left:22px; padding-right:22px; width:100%; max-width:100%; }
  .hero{ padding-left:22px; padding-right:22px; }
  /* every price/label row wraps instead of pushing width */
  /* 保持「名稱 | 價格」兩欄，長名稱換行而不是把價格擠下去 */
  .svc-row{ flex-wrap:nowrap; gap:12px; }
  .svc-row .prices{ text-align:right; }
  /* grids collapse */
  .work-grid{ grid-template-columns:1fr; }
  .service-showcase .sample-item{ max-width:100%; }
  .milestones-years{ display:flex; flex-wrap:wrap; gap:8px; }
  /* review cards full width */
  .review-card{ padding:22px; }
  /* namecard stack */
  .namecard{ padding:24px; }
  /* any mono text (prices, English) must break rather than overflow */
  .lang-en{ overflow-wrap:anywhere; word-break:break-word; }
  .svc-row .prices .twd, .svc-row .prices .myr{ white-space:nowrap; font-size:.78rem; }
  .svc-row .prices .myr{ font-size:.7rem; }
}
/* Belt-and-suspenders: nothing may exceed viewport width */
img, iframe, .glass, .work-card, .review-card, .bundle-card, .svc-group, .showcase-group{ max-width:100%; }