/* iOS / iPhone 最佳化（主頁與門口共用） */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { -webkit-tap-highlight-color: transparent; }
a, button, label, summary { touch-action: manipulation; }

/* 避免短字斷行：標題與短句平衡換行，內文避免最後一行只剩一兩字 */
h1, h2, h3, h4, .lead, .hero-sub, .gate-sub, .hint, .zoom-hint, .tl-t, .tl-d,
.card .sub, .dc-hint, .dc-panel-head p, .progress-label, .eyebrow { text-wrap: balance; }
p, li, .ck-t, .tip, .dc-group li span, .dc-note { text-wrap: pretty; line-break: strict; }
.nowrap { white-space: nowrap; }
.zoom-hint .zh-action { display: inline-block; }

/* 瀏海與 Home 指示條安全區 */
.nav-inner { padding-left: max(22px, env(safe-area-inset-left)); padding-right: max(22px, env(safe-area-inset-right)); }
.footer { padding-bottom: calc(60px + env(safe-area-inset-bottom)); }
.gate-foot { padding-bottom: calc(24px + env(safe-area-inset-bottom)); }
.lb-close { top: calc(12px + env(safe-area-inset-top)); right: calc(16px + env(safe-area-inset-right)); width: 44px; height: 44px; }
.lightbox { padding: max(20px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)); }
html.lb-open, html.lb-open body { overflow: hidden; }

/* 門口頁：Safari 網址列伸縮時維持置中 */
@supports (min-height: 100dvh) { body:has(.gate) { min-height: 100dvh; } }

/* 觸控裝置：取消會「卡住」的 hover 效果，改用按壓回饋 */
@media (hover: none) {
  .flow li:hover { transform: none; box-shadow: none; }
  .ex:hover img, .dc-slide:hover { transform: none; }
  .ck-item:hover { background: var(--bg-alt); }
  .ck-item:active { transform: scale(.985); background: #ececf0; }
  .btn:active, .go:active, .segmented button:active { opacity: .7; }
  .ex:active, .dc-slide:active, .dc-m:active, .guide-hero:active { opacity: .85; }
}
.ck-item { -webkit-user-select: none; transition: background .2s, transform .15s; }

/* iPhone 寬度 */
@media (max-width: 520px) {
  .hero { padding: 72px 20px 64px; }
  .section-head { margin-bottom: 36px; }
  .lead { font-size: 18px; }
  /* 擺放順序：5 台一排、不換行，代碼獨立一行 */
  .phones { flex-wrap: nowrap; gap: 6px; }
  .phone { flex: 1 1 0; min-width: 0; }
  .phone .swatch { width: 30px; height: 58px; border-radius: 10px; }
  .phone .pn { font-size: 12px; text-wrap: balance; }
  .phone .pc { font-size: 10.5px; line-height: 1.35; }
  .phone .pc .sep { display: none; }
  .phone .pc .code { display: block; }
  .card { padding: 22px 18px; }
  .ck-item { padding: 16px; gap: 14px; }
  .ck-t { font-size: 15px; }
  .dc-slide { flex-basis: 82%; }
  .segmented button { padding: 9px 16px; }
  #dcTabs { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
  #dcTabs::-webkit-scrollbar { display: none; }
  #dcTabs button { white-space: nowrap; padding: 8px 12px; font-size: 14px; }
}

/* 項目清單改為區塊排版，讓綁定的句尾與前文同一行流動 */
.list li { display: block; position: relative; padding-left: 20px; }
.list li::before { position: absolute; left: 4px; top: 10px; }
.list li:first-child::before { top: 0; }