/* W30：城市页、城市×分类页、常见问题、关于。只用 app.css 里的变量，页面自己的小样式。 */
.seo-page { padding-top: 8px; }
.seo-page h1 { font-size: 28px; font-weight: 850; line-height: 1.25; margin: 8px 0 6px; }
.lang-my .seo-page h1 { font-size: 23px; line-height: 1.5; }
.seo-page__lede { color: var(--ink-600); max-width: 62ch; margin: 0 0 18px; line-height: 1.6; }
.lang-my .seo-page__lede { line-height: 1.9; }
.seo-page h2 { font-size: 20px; font-weight: 800; margin: 28px 0 12px; }
.lang-my .seo-page h2 { font-size: 18px; line-height: 1.6; }
.seo-count { color: var(--ink-600); font-weight: 600; margin: 0 0 14px; }
.seo-chips { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
.seo-chips .chip { padding: 8px 14px; min-height: 40px; display: inline-flex; align-items: center; gap: 6px; }
.seo-chips .chip small { color: var(--ink-500); font-weight: 600; }
.seo-how { display: grid; gap: 10px; padding: 0; margin: 0; list-style: none; counter-reset: how; max-width: 62ch; }
.seo-how li { counter-increment: how; display: flex; gap: 10px; line-height: 1.6; }
.seo-how li::before { content: counter(how); flex: none; width: 24px; height: 24px; border-radius: 50%; background: var(--teal-50); color: var(--teal-700); font-weight: 800; text-align: center; line-height: 24px; font-size: 13px; }
.seo-empty { padding: 28px 20px; background: var(--teal-50); border-radius: var(--radius); max-width: 62ch; }
.seo-empty h2 { margin-top: 0; }
.seo-faq { max-width: 70ch; }
.seo-faq__item { padding: 16px 0; border-top: 1px solid var(--line); }
.seo-faq__item:first-child { border-top: 0; }
.seo-faq__item h2 { font-size: 18px; margin: 0 0 8px; }
.seo-faq__item p { margin: 0; line-height: 1.7; color: var(--ink-800); }
.lang-my .seo-faq__item p { line-height: 2; }
.seo-facts { max-width: 70ch; padding-left: 20px; line-height: 1.8; }
.seo-links { padding-left: 20px; line-height: 1.9; }
.seo-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.seo-more { margin-top: 14px; }
.product-grid--seo { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1023px) {
  .product-grid--seo { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
