/* === SCENE 2: 會議 === */
.meeting-visual{display:flex;gap:16px;justify-content:center;margin-top:32px}
/* GSAP handles meeting-visual */
.person{width:60px;height:60px;border-radius:50%;background:rgba(255,255,255,.05);border:2px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;font-size:24px}

/* === SCENE 3: 音訊波形 === */
.wave-container{display:flex;align-items:center;justify-content:center;gap:3px;height:80px;margin:32px 0}
/* GSAP handles wave-container */
.wave-bar{width:4px;height:20px;border-radius:4px;background:linear-gradient(to top,var(--purple),var(--accent));transition:height .15s ease}

/* === SCENE 4: 文字浮現 === */
.text-reveal{font-size:clamp(16px,2.5vw,24px);color:var(--bright);line-height:2;text-align:left;max-width:500px;margin:24px auto 0;opacity:0}
.text-reveal span{display:inline-block}
.js-ready .text-reveal span{opacity:0}

/* === SCENE 5: 程式碼 === */
.code-block{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:28px 24px;text-align:left;font-family:'SF Mono',monospace;font-size:14px;line-height:1.8;margin:20px auto 0;width:100%;overflow:hidden}
/* GSAP handles code-block */
.code-line{color:var(--dim)}
.js-ready .code-line{opacity:0}
.code-line .kw{color:var(--purple)}
.code-line .str{color:var(--accent)}
.code-line .fn{color:#60a5fa}

/* === SCENE 6: 網站誕生 === */
.website-frame{background:#fff;border-radius:16px;overflow:hidden;max-width:500px;margin:24px auto 0;box-shadow:0 8px 40px rgba(0,0,0,.3)}
/* GSAP handles website-frame */
.frame-bar{display:flex;gap:6px;padding:10px 14px;background:#f1f5f9;border-bottom:1px solid #e2e8f0}
.frame-dot{width:8px;height:8px;border-radius:50%}
.frame-dot.r{background:#ef4444}.frame-dot.y{background:#eab308}.frame-dot.g{background:#22c55e}
.frame-body{padding:24px;min-height:200px;text-align:center;font-family:'PingFang TC','Microsoft JhengHei',sans-serif;color:#1a1a2e}
.frame-hero{background:linear-gradient(135deg,#1e3a5f,#2d5a87);color:#fff;padding:32px 20px;border-radius:12px;margin-bottom:16px}
.frame-hero h2{font-size:18px;margin-bottom:6px}.frame-hero p{font-size:12px;opacity:.8}

/* === TESTIMONIAL SECTION === */
.testimonial-section{scroll-snap-align:start;scroll-snap-stop:always;min-height:100vh;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;padding:60px 16px;content-visibility:auto;contain-intrinsic-size:auto 100vh}
.testimonial-inner{max-width:900px;width:100%;text-align:center;position:relative;z-index:2}
.testimonial-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:32px}
.testimonial-card{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:28px 24px;text-align:left;transition:border-color .3s cubic-bezier(.22,1,.36,1),transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s;will-change:transform}
.testimonial-card:hover{border-color:rgba(8,145,178,.2);transform:translateY(-6px) scale(1.01);box-shadow:0 12px 40px rgba(0,0,0,.2)}
.testimonial-card:active{transform:translateY(-2px) scale(.99);transition-duration:.15s}
.testimonial-quote{font-size:15px;color:var(--text);line-height:1.8;margin-bottom:16px;position:relative;padding-left:16px;border-left:2px solid var(--accent)}
.testimonial-author{display:flex;align-items:center;gap:12px}
.testimonial-avatar{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--accent),#22d3ee);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}
.testimonial-name{font-size:13px;font-weight:700;color:var(--bright)}
.testimonial-role{font-size:11px;color:var(--dim)}
.testimonial-metrics{display:flex;justify-content:center;gap:48px;margin-top:40px}
.testimonial-metric{text-align:center}
.testimonial-metric-val{font-size:32px;font-weight:900;background:linear-gradient(135deg,var(--accent),#22d3ee);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.testimonial-metric-lbl{font-size:12px;color:var(--dim);margin-top:4px}
.testimonial-cta{display:inline-block;margin-top:32px;color:var(--accent);font-size:14px;font-weight:600;border-bottom:1px solid transparent;transition:border-color .3s,transform .25s cubic-bezier(.22,1,.36,1)}
.testimonial-cta:hover{border-color:var(--accent);transform:translateX(4px)}
/* GSAP 控制 testimonial 動畫 */
@media(max-width:768px){
  .testimonial-grid{grid-template-columns:1fr;gap:16px}
  .testimonial-metrics{gap:24px;flex-wrap:wrap}
  .testimonial-metric-val{font-size:24px}
}
@media(max-width:480px){
  .testimonial-section{padding:56px 20px}
  .testimonial-quote{font-size:14px}
  .testimonial-metrics{gap:20px}
}

/* === SCENE 7: CTA === */
.cta-big{font-size:clamp(20px,3vw,32px);font-weight:900;color:var(--bright);margin-bottom:12px}
.cta-contact{margin-top:24px;font-size:14px;color:var(--dim);line-height:2}
/* GSAP handles cta-big + cta-contact */

/* Stats Bar */
.stats-float{display:flex;justify-content:center;gap:48px;margin-top:40px}
/* GSAP handles stats-float */
.stat-item{text-align:center}
.stat-val{font-size:28px;font-weight:900;color:var(--accent)}
.stat-lbl{font-size:12px;color:var(--dim)}

/* Nav Mobile — 已移至 inline CSS 避免 CLS */

/* === 手機端優化 (≤480px) — 首屏樣式已移至 inline CSS === */
@media(max-width:480px){
  .stats-float{gap:20px;margin-top:28px}
  .stat-val{font-size:24px}
  .stat-lbl{font-size:11px}
  .code-block{font-size:12px;padding:20px 16px;border-radius:12px;line-height:1.9}
  .website-frame{margin:20px auto 0;border-radius:12px}
  .cta-big{font-size:clamp(22px,6vw,32px);line-height:1.4}
  .cta-contact{font-size:13px;line-height:2.2}
  .meeting-visual{gap:12px;margin-top:24px}
  .person{width:52px;height:52px}
  /* 手機版 ghost 按鈕加強邊框可見度 */
  .btn-ghost{border-color:rgba(255,255,255,0.6);color:var(--bright)}
  .btn-ghost:hover{border-color:rgba(255,255,255,0.85)}
}
@media(min-width:481px) and (max-width:768px){
  .hero-actions{gap:12px}
  .stats-float{gap:32px}
  .code-block{font-size:13px}
}

/* ===== Performance: Deferred (fold-below) CSS ===== */

/* === FAQ 區塊 === */
.faq-section{padding:80px 16px;position:relative;overflow:hidden}
.faq-inner{max-width:700px;margin:0 auto;text-align:center;position:relative;z-index:2}
.faq-list{margin-top:0;text-align:left;border:1px solid rgba(255,255,255,.07);border-radius:16px;overflow:hidden;background:rgba(255,255,255,.02)}
.faq-item{border-bottom:1px solid rgba(255,255,255,.06)}
.faq-q{width:100%;background:none;border:none;color:var(--bright);font-family:inherit;font-size:16px;font-weight:700;padding:20px 24px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;text-align:left;transition:background .2s,color .2s;line-height:1.4}
.faq-q:hover{background:rgba(8,145,178,.06);color:var(--bright)}
.faq-q[aria-expanded="true"]{background:rgba(8,145,178,.08);color:var(--accent)}
.faq-icon{flex-shrink:0;width:20px;height:20px;position:relative;transition:transform .3s ease}
.faq-icon svg{width:20px;height:20px;stroke:var(--dim);position:absolute;top:0;left:0;transition:opacity .2s,transform .2s}
.faq-q[aria-expanded="true"] .faq-icon svg{stroke:var(--accent)}
.faq-icon .icon-plus{opacity:1;transform:rotate(0deg)}
.faq-icon .icon-minus{opacity:0;transform:rotate(-90deg)}
.faq-q[aria-expanded="true"] .faq-icon .icon-plus{opacity:0;transform:rotate(90deg)}
.faq-q[aria-expanded="true"] .faq-icon .icon-minus{opacity:1;transform:rotate(0deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease,padding .3s ease}
.faq-a.open{max-height:300px}
.faq-a p{padding:0 24px 20px;font-size:14px;color:var(--dim);line-height:1.8}
/* FAQ fade-in */
.faq-section.faq-hidden{opacity:0;transform:translateY(24px)}
.faq-section{transition:opacity .6s ease,transform .6s ease}

/* === 痛點卡片 === */
.pain-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:36px}
.pain-card{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:24px 20px;text-align:left;transition:border-color .3s,transform .3s}
.pain-card:hover{border-color:rgba(239,68,68,.3);transform:translateY(-3px)}
.pain-icon{width:44px;height:44px;border-radius:10px;background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.15);display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.pain-title{font-size:15px;font-weight:700;color:var(--bright);margin-bottom:6px}
.pain-desc{font-size:13px;color:var(--dim);line-height:1.6}
.pain-cost{margin-top:12px;padding-top:12px;border-top:1px dashed rgba(239,68,68,.2);display:flex;align-items:flex-start;gap:8px;font-size:12px;font-weight:700;color:#ef4444;letter-spacing:.2px;line-height:1.5}
.pain-cost svg{width:14px;height:14px;flex-shrink:0;margin-top:2px}
.pain-cost > span{flex:1}
.pain-cost strong{color:#fca5a5;font-weight:900;font-size:13px;white-space:nowrap}

/* === 專有技術卡片 === */
.tech-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:36px;text-align:left}
.tech-card{background:var(--bg2,rgba(255,255,255,.025));border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:16px 18px;display:flex;align-items:flex-start;gap:14px;transition:border-color .3s,transform .3s}
.tech-card:hover{border-color:rgba(8,145,178,.25);transform:translateY(-2px)}
.tech-card:hover .tech-icon{background:rgba(8,145,178,.18)}
.tech-icon{width:38px;height:38px;border-radius:9px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .3s}
.tech-body{flex:1;min-width:0}
.tech-name{font-size:14px;font-weight:700;color:var(--bright);margin-bottom:4px}
.tech-subtitle{font-size:13px;color:rgba(255,255,255,.7);margin-top:2px;font-weight:400}
.tech-desc{font-size:12px;color:var(--dim);line-height:1.6}

/* === 解決方案特色 grid === */
.feature-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:36px;text-align:left}
.feature-card{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:22px 20px;transition:border-color .3s,transform .3s;display:flex;flex-direction:column}
/* 三能力卡片底部 chip 對齊（Cindy 4/30 8:05 報修：底部 chip 沒對齊）— description 撐滿剩餘空間把 chip 推到底 */
.feature-card > div:nth-last-of-type(2){flex:1}
.feature-card:hover{border-color:rgba(8,145,178,.25);transform:translateY(-3px)}
.feature-card-icon{width:40px;height:40px;border-radius:10px;background:rgba(8,145,178,.1);border:1px solid rgba(8,145,178,.15);display:flex;align-items:center;justify-content:center;margin-bottom:12px}
.feature-card-title{font-size:15px;font-weight:700;color:var(--bright);margin-bottom:6px}
.feature-card-desc{font-size:13px;color:var(--dim);line-height:1.6}

/* === 知識圖譜視覺 === */
.graph-visual{position:relative;width:100%;max-width:600px;margin:32px auto 0;height:280px}
.graph-node{position:absolute;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:var(--bright);animation:node-pulse 3s ease-in-out infinite}
.graph-node.core{width:72px;height:72px;background:radial-gradient(circle,rgba(8,145,178,.3),rgba(8,145,178,.05));border:2px solid rgba(8,145,178,.6);font-size:11px;animation-delay:0s}
.graph-node.mid{width:52px;height:52px;background:radial-gradient(circle,rgba(139,92,246,.25),rgba(139,92,246,.04));border:1px solid rgba(139,92,246,.4);animation-delay:.4s}
.graph-node.outer{width:38px;height:38px;background:radial-gradient(circle,rgba(59,130,246,.2),rgba(59,130,246,.03));border:1px solid rgba(59,130,246,.3);font-size:9px;animation-delay:.8s}
@keyframes node-pulse{0%,100%{box-shadow:0 0 0 0 rgba(8,145,178,.1)}50%{box-shadow:0 0 0 8px rgba(8,145,178,0)}}
.graph-line{position:absolute;background:linear-gradient(90deg,rgba(8,145,178,.15),rgba(139,92,246,.15));height:1px;transform-origin:left center}

/* === 政府補助卡片 === */
.subsidy-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:36px}
.subsidy-card{border-radius:14px;padding:24px 20px;text-align:center;transition:transform .3s}
.subsidy-card:hover{transform:translateY(-4px)}
.subsidy-card.tier1{background:linear-gradient(135deg,rgba(34,197,94,.08),rgba(34,197,94,.03));border:1px solid rgba(34,197,94,.2)}
.subsidy-card.tier2{background:linear-gradient(135deg,rgba(8,145,178,.08),rgba(8,145,178,.03));border:1px solid rgba(8,145,178,.25)}
.subsidy-card.tier3{background:linear-gradient(135deg,rgba(139,92,246,.08),rgba(139,92,246,.03));border:1px solid rgba(139,92,246,.25)}
.subsidy-card{position:relative;text-align:left;padding:28px 22px 22px}
.subsidy-amount{font-size:36px;font-weight:900;margin:4px 0 2px;letter-spacing:-1px}
.subsidy-card.tier1 .subsidy-amount{color:#22c55e}
.subsidy-card.tier2 .subsidy-amount{color:var(--accent)}
.subsidy-card.tier3 .subsidy-amount{background:linear-gradient(135deg,var(--purple),#60a5fa);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.subsidy-type{font-size:15px;font-weight:700;color:var(--bright);margin-bottom:6px}
.subsidy-desc{font-size:12px;color:var(--dim)}
.subsidy-pill{display:inline-block;font-size:12px;font-weight:600;padding:4px 10px;border-radius:100px;background:rgba(255,255,255,.05);color:var(--dim);border:1px solid rgba(255,255,255,.08);margin-bottom:6px}
.subsidy-card.tier2 .subsidy-pill{background:rgba(8,145,178,.1);color:var(--accent);border-color:rgba(8,145,178,.3)}
.subsidy-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);font-size:12px;font-weight:700;padding:5px 14px;border-radius:100px;background:linear-gradient(135deg,#0891b2,#0e7490);color:#fff;letter-spacing:.5px;box-shadow:0 4px 12px rgba(8,145,178,.3);white-space:nowrap}
.subsidy-subsidy{font-size:13px;color:var(--dim);margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.06)}
.subsidy-subsidy strong{color:var(--bright);font-weight:800}
.subsidy-features{list-style:none;padding:0;margin:0 0 16px;display:flex;flex-direction:column;gap:10px}
.subsidy-features li{display:flex;align-items:flex-start;gap:9px;font-size:13px;color:var(--bright);line-height:1.5}
.subsidy-features li svg{width:14px;height:14px;flex-shrink:0;margin-top:3px;color:#22c55e}
.subsidy-card.tier2 .subsidy-features li svg{color:var(--accent)}
.subsidy-card.tier3 .subsidy-features li svg{color:#a78bfa}
.subsidy-features li.moat{color:#fff;font-weight:600}
.subsidy-features li.moat svg{color:#fbbf24}
.subsidy-bonus{font-size:12px;font-weight:600;color:var(--accent);padding:10px 12px;background:rgba(8,145,178,.08);border:1px dashed rgba(8,145,178,.25);border-radius:8px;text-align:center;margin-top:4px}
.subsidy-card.tier1 .subsidy-bonus{color:#22c55e;background:rgba(34,197,94,.06);border-color:rgba(34,197,94,.22)}
.subsidy-card.tier3 .subsidy-bonus{color:#a78bfa;background:rgba(139,92,246,.08);border-color:rgba(139,92,246,.25)}

/* === 定價區各方案 CTA 按鈕 === */
.subsidy-plan-cta{display:block;margin-top:16px;text-align:center;background:transparent;color:var(--dim);padding:10px 16px;border-radius:100px;font-size:13px;font-weight:600;text-decoration:none;border:1px solid rgba(255,255,255,.15);transition:background .2s,color .2s,border-color .2s}
.subsidy-plan-cta:hover{background:rgba(255,255,255,.06);color:var(--bright);border-color:rgba(255,255,255,.35)}
.subsidy-plan-cta-accent{background:rgba(8,145,178,.12);color:var(--accent);border-color:rgba(8,145,178,.3)}
.subsidy-plan-cta-accent:hover{background:rgba(8,145,178,.22);color:#22d3ee;border-color:rgba(8,145,178,.55)}

/* === 月費 add-on 區塊 === */
.addon-section{margin-top:56px;padding:32px 28px;background:linear-gradient(180deg,rgba(8,145,178,.03),rgba(8,145,178,.01));border:1px solid rgba(8,145,178,.12);border-radius:18px}
.addon-header{text-align:center;margin-bottom:24px}
.addon-label{display:inline-block;font-size:12px;font-weight:600;letter-spacing:1px;color:var(--accent);text-transform:uppercase;margin-bottom:8px}
.addon-title{font-size:24px;font-weight:800;color:var(--bright);margin:0 0 6px}
.addon-sub{font-size:13px;color:var(--dim);margin:0;line-height:1.7}
.addon-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.addon-card{position:relative;padding:20px 18px;border-radius:12px;background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.06);transition:transform .2s,border-color .2s}
.addon-card:hover{transform:translateY(-2px);border-color:rgba(8,145,178,.25)}
.addon-card.addon-popular{background:linear-gradient(135deg,rgba(8,145,178,.08),rgba(8,145,178,.02));border-color:rgba(8,145,178,.3)}
.addon-flag{position:absolute;top:-10px;right:14px;font-size:12px;font-weight:700;padding:3px 10px;border-radius:100px;background:#0e7490;color:#fff;letter-spacing:.3px}
.addon-price{font-size:24px;font-weight:900;color:var(--bright);margin-bottom:4px;letter-spacing:-.5px}
.addon-price span{font-size:13px;font-weight:600;color:var(--dim);margin-left:2px}
.addon-name{font-size:14px;font-weight:700;color:var(--bright);margin-bottom:6px}
.addon-desc{font-size:12px;color:var(--dim);line-height:1.6}

/* ===== 迭代 21-25：Scroll Animations ===== */

/* 迭代 21: Scroll Reveal 基礎 */
.scene{will-change:auto}
.reveal{opacity:0;transform:translateY(40px);transition:opacity 0.8s ease,transform 0.8s ease}
.reveal.visible{opacity:1;transform:translateY(0)}

/* Reveal fallback: 3 秒後若未觸發 IntersectionObserver，自動顯示 */
/* 手機版縮短至 2s，避免長 section 黑屏 */
@keyframes reveal-fallback{0%{opacity:0;transform:translateY(40px)}100%{opacity:1;transform:translateY(0)}}
.reveal:not(.visible){animation:reveal-fallback 0.8s ease 3s forwards}
.pain-card:not(.visible){animation:reveal-fallback 0.7s ease 2.5s forwards}
.tech-card:not(.visible){animation:reveal-fallback 0.6s ease 2.5s forwards}
.feature-card:not(.visible){animation:reveal-fallback 0.7s ease 2.5s forwards}
.step-card:not(.visible){animation:reveal-fallback 0.7s ease 2.5s forwards}
.step-arrow:not(.visible){animation:reveal-fallback 0.5s ease 3s forwards}
.trust-badge:not(.visible){animation:reveal-fallback 0.7s ease 2.5s forwards}
.compare-card:not(.visible){animation:reveal-fallback 0.7s ease 2.5s forwards}
/* 手機版：縮短 fallback 延遲，防止黑屏 */
@media(max-width:768px){
  .reveal:not(.visible){animation:reveal-fallback 0.8s ease 1.5s forwards}
  .pain-card:not(.visible){animation:reveal-fallback 0.7s ease 1.8s forwards}
  .tech-card:not(.visible){animation:reveal-fallback 0.6s ease 1.8s forwards}
  .feature-card:not(.visible){animation:reveal-fallback 0.7s ease 1.8s forwards}
  .step-card:not(.visible){animation:reveal-fallback 0.7s ease 1.8s forwards}
  .trust-badge:not(.visible){animation:reveal-fallback 0.7s ease 1.8s forwards}
  .compare-card:not(.visible){animation:reveal-fallback 0.7s ease 1.8s forwards}
}
/* 偏好減少動態的使用者直接顯示 */
@media(prefers-reduced-motion:reduce){.reveal{opacity:1!important;transform:none!important;transition:none!important;animation:none!important}.pain-card,.tech-card,.feature-card,.step-card,.step-arrow,.trust-badge,.compare-card{opacity:1!important;transform:none!important;animation:none!important}}

/* 迭代 22: 痛點卡片 — 從左 slide in + stagger */
.pain-card{opacity:0;transform:translateX(-30px);transition:opacity 0.7s ease,transform 0.7s ease,border-color 0.3s,box-shadow 0.3s}
.pain-card.visible{opacity:1;transform:translateX(0)}
.pain-card:nth-child(1){transition-delay:0ms}
.pain-card:nth-child(2){transition-delay:100ms}
.pain-card:nth-child(3){transition-delay:200ms}
.pain-card:nth-child(4){transition-delay:300ms}
.pain-card:nth-child(5){transition-delay:400ms}
.pain-card:nth-child(6){transition-delay:500ms}
.pain-card:nth-child(7){transition-delay:600ms}
.pain-card:nth-child(8){transition-delay:700ms}

/* 專有技術卡片 stagger */
.tech-card{opacity:0;transform:translateY(20px);transition:opacity 0.6s ease,transform 0.6s ease,border-color 0.3s}
.tech-card.visible{opacity:1;transform:translateY(0)}
.tech-card:nth-child(1){transition-delay:0ms}
.tech-card:nth-child(2){transition-delay:60ms}
.tech-card:nth-child(3){transition-delay:120ms}
.tech-card:nth-child(4){transition-delay:180ms}
.tech-card:nth-child(5){transition-delay:240ms}
.tech-card:nth-child(6){transition-delay:300ms}
.tech-card:nth-child(7){transition-delay:360ms}
.tech-card:nth-child(8){transition-delay:420ms}
.tech-card:nth-child(9){transition-delay:480ms}
.tech-card:nth-child(10){transition-delay:540ms}

/* 迭代 23: 功能卡片 — 從右 slide in + stagger */
.feature-card{opacity:0;transform:translateX(30px);transition:opacity 0.7s ease,transform 0.7s ease,border-color 0.3s,box-shadow 0.3s}
.feature-card.visible{opacity:1;transform:translateX(0)}
.feature-card:nth-child(1){transition-delay:0ms}
.feature-card:nth-child(2){transition-delay:100ms}
.feature-card:nth-child(3){transition-delay:200ms}
.feature-card:nth-child(4){transition-delay:300ms}

/* 迭代 25: CTA 按鈕 pulse glow */
@keyframes pulse-glow{
  0%,100%{box-shadow:0 0 20px rgba(0,212,255,0.3),0 0 30px rgba(8,145,178,0.15)}
  50%{box-shadow:0 0 40px rgba(0,212,255,0.5),0 0 60px rgba(8,145,178,0.25)}
}
.btn-glow{animation:pulse-glow 2s ease-in-out infinite}
.btn-glow:hover{animation:none;transform:translateY(-3px) scale(1.03);box-shadow:0 4px 40px rgba(8,145,178,.5),0 0 80px rgba(0,212,255,.3)}

/* === Scene 3a: How it works 三步驟 === */
.steps-grid{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:0 8px;margin-top:48px;position:relative;align-items:center}
.step-card{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:28px 22px 22px;text-align:left;opacity:0;transform:translateY(30px);transition:opacity 0.7s ease,transform 0.7s ease,border-color .3s}
.step-card.visible{opacity:1;transform:translateY(0)}
.step-card:nth-child(1){transition-delay:0ms}
.step-card:nth-child(2){transition-delay:150ms}
.step-card:nth-child(3){transition-delay:300ms}
.step-card:hover{border-color:rgba(8,145,178,.25);transform:translateY(-3px)}
.step-num{font-size:48px;font-weight:900;line-height:1;color:var(--accent);opacity:.18;position:absolute;top:16px;right:16px;letter-spacing:-2px;pointer-events:none}
.step-icon-wrap{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.step-icon-accent{background:rgba(8,145,178,.1);border:1px solid rgba(8,145,178,.2)}
.step-icon-purple{background:rgba(139,92,246,.1);border:1px solid rgba(139,92,246,.2)}
.step-icon-green{background:rgba(34,197,94,.08);border:1px solid rgba(34,197,94,.2)}
.step-title{font-size:16px;font-weight:700;color:var(--bright);margin-bottom:8px;line-height:1.4}
.step-desc{font-size:13px;color:var(--dim);line-height:1.7}
.step-meta{margin-top:16px;padding-top:14px;border-top:1px dashed rgba(255,255,255,.08);font-size:12px;font-weight:600;color:var(--dim);letter-spacing:.2px}
.step-meta-accent{color:var(--accent)}
.step-meta-purple{color:#a78bfa}
.step-meta-green{color:#4ade80}
/* 水平連接箭頭（桌面） */
.step-arrow{display:flex;align-items:center;justify-content:center;padding:0 4px;align-self:center;margin-top:-20px;opacity:0;transform:scaleX(0);transition:opacity 0.5s ease .45s,transform 0.5s ease .45s;transform-origin:left}
.step-arrow.visible{opacity:1;transform:scaleX(1)}
/* Scene 3a 底部 CTA */
.steps-cta{margin-top:48px;display:flex;flex-direction:column;align-items:center;gap:10px}
.steps-cta-note{font-size:12px;color:var(--dim);letter-spacing:.3px}

/* === 信任標誌帶 (iter #6) === */
.trust-bar{padding:56px 24px;background:linear-gradient(180deg,rgba(255,255,255,.04) 0%,rgba(255,255,255,.025) 50%,rgba(255,255,255,.04) 100%);border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.06);position:relative}
.trust-bar-label{font-size:12px;color:var(--dim);letter-spacing:3px;text-transform:uppercase;text-align:center;margin-bottom:32px;font-weight:600}
.trust-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;max-width:960px;margin:0 auto}
.trust-badge{display:flex;flex-direction:column;align-items:center;text-align:center;padding:18px 12px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.05);transition:transform 0.25s ease,box-shadow 0.25s ease,border-color 0.25s ease;opacity:0;transform:translateY(24px);transition:opacity 0.7s ease,transform 0.7s ease,box-shadow 0.25s ease,border-color 0.25s ease}
.trust-badge.visible{opacity:1;transform:translateY(0)}
.trust-badge:hover{transform:translateY(-4px);box-shadow:0 8px 24px rgba(0,0,0,.25),0 0 20px rgba(8,145,178,.08);border-color:rgba(8,145,178,.2)}
.trust-icon-wrap{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:10px;flex-shrink:0}
.trust-icon-green{background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.2)}
.trust-icon-accent{background:rgba(8,145,178,.1);border:1px solid rgba(8,145,178,.2)}
.trust-icon-yellow{background:rgba(251,191,36,.1);border:1px solid rgba(251,191,36,.2)}
.trust-main{font-size:13px;font-weight:800;color:var(--bright);line-height:1.35;margin-bottom:4px}
.trust-sub{font-size:12px;color:#b0bec5;line-height:1.5}
.trust-footer{text-align:center;margin-top:28px;font-size:12px;color:var(--dim)}
.trust-footer a{color:var(--accent);text-decoration:none;font-weight:600;transition:color .2s;display:inline-block;padding:12px 4px;min-height:44px;line-height:20px}
.trust-footer a:hover{color:#22d3ee}

/* === Mobile 響應式：fold-below 元素 === */
@media(max-width:768px){
.trust-grid{grid-template-columns:repeat(3,1fr)}
.feature-grid{grid-template-columns:1fr}
.subsidy-grid{grid-template-columns:1fr;gap:12px}
.pain-grid{grid-template-columns:repeat(2,1fr)}
.tech-grid{grid-template-columns:1fr}
.steps-grid{grid-template-columns:1fr;gap:16px}
.step-arrow{display:none}
#graphVis{height:220px!important;max-width:100%!important}
}
@media(max-width:480px){
.pain-grid{grid-template-columns:1fr}
.feature-grid{grid-template-columns:1fr}
.subsidy-grid{grid-template-columns:1fr}
.tech-grid{grid-template-columns:1fr}
.addon-grid{grid-template-columns:1fr}
.addon-section{padding:24px 18px;margin-top:40px}
.addon-title{font-size:20px}
.subsidy-amount{font-size:30px}
.trust-grid{grid-template-columns:repeat(2,1fr)}
.trust-bar{padding:40px 20px}
}

/* === Scene 4b: 四方案比較表 === */
.compare-section{max-width:1100px;width:100%;margin:0 auto;text-align:center;position:relative;z-index:2;padding:0 16px}
.compare-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:40px;text-align:left}
.compare-card{border-radius:16px;padding:28px 22px 24px;position:relative;opacity:0;transform:translateY(32px);transition:opacity 0.7s ease,transform 0.7s ease,box-shadow 0.3s}
.compare-card.visible{opacity:1;transform:translateY(0)}
.compare-card:hover{transform:translateY(-6px)}
.compare-card.danger{background:linear-gradient(160deg,rgba(220,38,38,.14),rgba(239,68,68,.06));border:1px solid rgba(239,68,68,.22)}
.compare-card.danger:hover{box-shadow:0 8px 32px rgba(239,68,68,.15)}
.compare-card.neutral{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)}
.compare-card.neutral:hover{border-color:rgba(255,255,255,.16);box-shadow:0 8px 24px rgba(0,0,0,.2)}
.compare-card.recommended{background:linear-gradient(160deg,rgba(8,145,178,.18),rgba(8,145,178,.06));border:2px solid rgba(8,145,178,.7);box-shadow:0 0 0 1px rgba(8,145,178,.2),0 0 40px rgba(8,145,178,.2),inset 0 1px 0 rgba(255,255,255,.05)}
.compare-card.recommended:hover{transform:translateY(-8px);box-shadow:0 0 0 2px rgba(8,145,178,.3),0 12px 48px rgba(8,145,178,.25)}
.compare-pill{display:inline-block;font-size:12px;font-weight:700;padding:4px 12px;border-radius:100px;letter-spacing:.5px;margin-bottom:14px}
.compare-pill.pill-red{background:rgba(239,68,68,.15);color:#f87171;border:1px solid rgba(239,68,68,.3)}
.compare-pill.pill-orange{background:rgba(249,115,22,.12);color:#fb923c;border:1px solid rgba(249,115,22,.25)}
.compare-pill.pill-yellow{background:rgba(234,179,8,.1);color:#facc15;border:1px solid rgba(234,179,8,.22)}
.compare-pill.pill-accent{background:rgba(8,145,178,.15);color:#22d3ee;border:1px solid rgba(8,145,178,.35);box-shadow:0 0 12px rgba(8,145,178,.2)}
.compare-plan-name{font-size:17px;font-weight:800;color:var(--bright);margin-bottom:20px;line-height:1.3}
.compare-row{display:flex;align-items:flex-start;gap:10px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.05)}
.compare-row:last-of-type{border-bottom:none}
.compare-row-icon{width:28px;height:28px;border-radius:7px;background:rgba(255,255,255,.05);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}
.compare-card.danger .compare-row-icon{background:rgba(239,68,68,.08)}
.compare-card.recommended .compare-row-icon{background:rgba(8,145,178,.12)}
.compare-row-body{flex:1;min-width:0}
.compare-row-label{font-size:12px;font-weight:600;color:#94a3b8;text-transform:uppercase;letter-spacing:1px;margin-bottom:3px}
.compare-row-value{font-size:13px;font-weight:700;color:var(--bright);line-height:1.5}
.compare-card.danger .compare-row-value{color:#fecaca}
.compare-result{margin-top:16px;padding:12px 14px;border-radius:10px;font-size:12px;line-height:1.6;font-weight:600}
.compare-card.danger .compare-result{background:rgba(239,68,68,.08);color:#fca5a5;border:1px solid rgba(239,68,68,.15)}
.compare-card.neutral .compare-result{background:rgba(255,255,255,.04);color:#b0bec5;border:1px solid rgba(255,255,255,.07)}
.compare-card.recommended .compare-result{background:rgba(8,145,178,.1);color:#67e8f9;border:1px solid rgba(8,145,178,.2)}
.compare-cta{display:block;margin-top:20px;text-align:center;background:var(--accent);color:#fff;padding:12px 20px;border-radius:100px;font-size:13px;font-weight:700;text-decoration:none;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 16px rgba(8,145,178,.3)}
.compare-cta:hover{transform:translateY(-2px);box-shadow:0 8px 28px rgba(8,145,178,.45)}
.compare-card:nth-child(1){transition-delay:0ms}
.compare-card:nth-child(2){transition-delay:100ms}
.compare-card:nth-child(3){transition-delay:200ms}
.compare-card:nth-child(4){transition-delay:320ms}
@media(max-width:900px){.compare-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.compare-grid{grid-template-columns:1fr;gap:12px}.compare-section{padding:0 8px}}
/* Testimonial Before/After (iter #8) */
.testimonial-ba{margin-top:16px;padding-top:16px;border-top:1px dashed rgba(255,255,255,.08);display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center;font-size:12px}
.ba-before{color:var(--dim);text-align:right}
.ba-before-label,.ba-after-label{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:1px;margin-bottom:4px;opacity:.6}
.ba-before-label{color:var(--dim)}
.ba-after-label{color:var(--accent)}
.ba-arrow{color:var(--accent);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ba-after{color:var(--bright);font-weight:600;text-align:left}
.ba-pill-row{margin-top:10px;text-align:center;grid-column:1/-1}
.ba-pill{display:inline-block;padding:4px 12px;border-radius:20px;background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.3);color:#22c55e;font-size:12px;font-weight:700}
@media(max-width:640px){.testimonial-ba{grid-template-columns:1fr;gap:8px}.ba-arrow{transform:rotate(90deg)}.ba-before{text-align:left}.ba-before-label,.ba-after-label{display:none}}

/* === 浮動 CTA 列（從 inline 移出）=== */
.floating-cta{transition:transform 0.4s cubic-bezier(.22,1,.36,1)}
.floating-cta.visible{transform:translateY(0);pointer-events:auto}
.floating-cta.dismissed{display:none}
.floating-cta-inner{max-width:1000px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px;background:rgba(5,5,16,.95);backdrop-filter:blur(20px);border-top:1px solid rgba(8,145,178,.2)}
.floating-cta-text{display:flex;align-items:center;gap:10px;flex:1;min-width:0}
.floating-cta-text svg{width:18px;height:18px;flex-shrink:0;color:#f59e0b}
.floating-cta-text span{font-size:13px;color:var(--dim)}
.floating-cta-text span strong{color:var(--bright)}
.floating-cta-btn{background:#0e7490;color:#fff;padding:10px 22px;border-radius:100px;font-size:13px;font-weight:700;text-decoration:none;white-space:nowrap;flex-shrink:0;transition:transform .2s cubic-bezier(.22,1,.36,1),box-shadow .2s;box-shadow:0 2px 12px rgba(8,145,178,.3)}
.floating-cta-btn:hover{transform:scale(1.05);box-shadow:0 4px 20px rgba(8,145,178,.5)}
.floating-cta-btn:active{transform:scale(.97);transition-duration:.1s}
.floating-cta-close{background:none;border:none;cursor:pointer;padding:6px;border-radius:6px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .2s;color:var(--dim)}
.floating-cta-close:hover{background:rgba(255,255,255,.08);color:var(--bright)}
.floating-cta-close svg{width:16px;height:16px}
@media(max-width:600px){
.floating-cta-inner{flex-wrap:wrap;padding:12px 16px;gap:10px;position:relative}
.floating-cta-text{flex:1 1 100%}
.floating-cta-btn{flex:1;text-align:center}
.floating-cta-close{position:absolute;top:10px;right:14px}
}
/* === 客服 Widget 字體覆寫 === */
[id^="chatbot-"],[id^="chatbot-"] *,[class*="chatbot"],[class*="chatbot"] *{font-family:'Space Grotesk','PingFang TC','Noto Sans TC',sans-serif!important}

/* 聊天按鈕 emoji → SVG 替代（規範：禁用 emoji） */
[id^="chatbot-"] button[style*="position:fixed"],.chatbot-toggle{font-size:0!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:center!important;background-size:24px!important}