/* 第二輪補充：局部上色、示範標記、方案價格、常見問題。延續 site.css 的 tokens。 */

/* logo 防壓扁：非方形 logo 以 contain 置中，頁首與頁尾共用 */
.brand-logo { object-fit: contain; }

.accent { color: var(--brand); }
.eyebrow-center { border-left: 0; padding-left: 0; text-align: center; display: block; }
.demo-tag { display: inline-block; align-self: flex-start; font-size: 12px; color: var(--muted); border: 1px solid var(--line); border-radius: 999px; padding: 2px 10px; }

/* 方案價格 */
.pricing { padding: 96px 0; background: #fff8f3; text-align: center; }
.plan-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; text-align: left; margin-top: 48px; }
.plan-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 32px; display: flex; flex-direction: column; gap: 16px; }
.plan-featured { border-color: var(--brand); box-shadow: 0 16px 40px rgba(242, 98, 42, .15); }
.plan-name { font-size: 18px; font-weight: 700; }
.plan-price { font-size: 32px; font-weight: 800; }
.plan-period { font-size: 15px; font-weight: 400; color: var(--muted); }
.plan-list { display: flex; flex-direction: column; gap: 8px; color: var(--muted); font-size: 15px; flex: 1; }
.plan-card .btn { width: 100%; }
.pricing-note { margin-top: 32px; color: var(--muted); font-size: 13px; }

/* 常見問題 */
.faq { padding: 96px 0; text-align: center; }
.faq-inner { max-width: 820px; }
.faq-list { display: flex; flex-direction: column; gap: 16px; margin-top: 40px; text-align: left; }
.faq-item { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 24px 28px; }
.faq-q { font-size: 17px; font-weight: 700; margin-bottom: 8px; }
.faq-a { color: var(--muted); font-size: 15px; }

@media (max-width: 860px) {
  .plan-grid { grid-template-columns: 1fr; }
}
