/* 首頁專用樣式（build 發成 /css/home.css，只在首頁載入） */

/* ---------- Hero ---------- */
.hero { position: relative; overflow: clip; isolation: isolate; padding: clamp(40px, 6vw, 84px) 0 clamp(48px, 7vw, 96px); }
.hero-bg { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.hero-bg::before { content: ""; position: absolute; top: -6%; right: -14%; width: min(1180px, 92vw); aspect-ratio: 1; background-image: url(/img/hero-bg-1600.webp); background-image: image-set(url(/img/hero-bg-1600.webp) 1x, url(/img/hero-bg-2400.webp) 2x); background-size: cover; background-position: center; opacity: .62; -webkit-mask-image: radial-gradient(closest-side, #000 52%, transparent 100%); mask-image: radial-gradient(closest-side, #000 52%, transparent 100%); }
.hero-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--bg) 0%, rgba(11, 14, 13, .92) 30%, rgba(11, 14, 13, .35) 62%, rgba(11, 14, 13, .15) 100%), linear-gradient(180deg, transparent 70%, var(--bg) 100%); }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); gap: clamp(24px, 4vw, 56px); align-items: center; }
.hero-copy { max-width: 620px; }
.hero-kicker { margin-bottom: 18px; }
.hero h1 { font-size: clamp(2.35rem, 1.2rem + 4.4vw, 4.5rem); line-height: 1.1; margin-bottom: 18px; letter-spacing: .015em; }
.hero-line2 { display: block; }
html[lang="en"] .hero h1 { font-size: clamp(2.3rem, 1.1rem + 4.2vw, 4.3rem); letter-spacing: 0; }
.hero-sub { font-size: clamp(1.08rem, .98rem + .5vw, 1.35rem); font-weight: 700; color: #dedad0; margin-bottom: 24px; }
/* 6 顆膠囊排成 3＋3（en 窄欄 2＋2＋2），不留落單的一顆 */
.hero-chips { display: grid; grid-template-columns: repeat(3, max-content); gap: 10px; margin-bottom: 30px; max-width: none; }
@media (max-width: 540px), (min-width: 861px) and (max-width: 980px) { html[lang="en"] .hero-chips { grid-template-columns: repeat(2, max-content); } }
.hero-cta { margin-bottom: 16px; }
.hero-sub, .hero-note { text-wrap: balance; }
.hero-note { font-size: .88rem; color: var(--muted); margin: 0; }
.hero-media { display: flex; justify-content: center; }
.hero .phone-pair { width: 100%; max-width: 560px; }
.hero .phone { --w: clamp(220px, 21vw, 280px); }

@media (max-width: 860px) {
  .hero { padding-top: 32px; }
  .hero-grid { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  .hero-copy { max-width: none; }
  .hero-bg::before { top: auto; bottom: -4%; right: 50%; transform: translateX(50%); width: 150vw; max-width: 900px; opacity: .55; }
  .hero-bg::after { background: linear-gradient(180deg, var(--bg) 0%, rgba(11, 14, 13, .88) 38%, rgba(11, 14, 13, .35) 70%, var(--bg) 100%); }
  .hero .phone { --w: min(46vw, 230px); }
}
@media (max-width: 420px) {
  .hero h1 { font-size: 2.3rem; }
  html[lang="en"] .hero h1 { font-size: 2.25rem; }
  .hero-chips { gap: 8px; margin-bottom: 26px; }
  .hero-chips .chip { padding: 5px 13px 5px 11px; font-size: .86rem; min-height: 34px; }
  .hero-cta { gap: 16px; }
  .hero-cta .btn { padding: 0 18px; }
}

/* ---------- 功能卡 ---------- */
.feature-grid .card h3 { font-size: 1.16rem; }
.feature-grid .card p { font-size: .95rem; line-height: 1.75; }
.feature-more { margin: 28px auto 0; color: var(--muted); font-size: .95rem; max-width: 52em; text-align: center; text-wrap: balance; }

/* ---------- 截圖畫廊 ---------- */
.gallery-section .section-head { margin-bottom: 32px; }
.gallery-head { position: relative; }
.gallery-head .gallery-nav { justify-content: center; margin: -12px 0 24px; }
@media (min-width: 1080px) { .gallery-head .gallery-nav { position: absolute; right: var(--gutter); bottom: 0; margin: 0; } }

/* ---------- 免費 vs Pro ---------- */
.pro-split { align-items: start; }
.pro-split .list-check { margin: 22px 0 18px; }
.compare-mini th[scope="row"] { font-weight: 700; color: #dedad0; }
@media (max-width: 420px) { .compare-mini th, .compare-mini td { padding: 12px 12px; font-size: .9rem; } }

/* ---------- 開始使用（四欄步驟 .steps-4 在 site.css） ---------- */

/* ---------- 收尾 CTA ---------- */
.cta-panel h2 { margin-bottom: 12px; }
.cta-qr .qr-code { width: 168px; height: 168px; }