/* Shared styles for the Vaytax Chinese (/zh/) layer. Loaded after styles-v2 + nav.css.
   GENERATED by scripts/gen-zh.py. Edit the template there, not this file. */
article, .blog-hero, .zh-hub { font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", Roboto, sans-serif; }
article p, article li { line-height: 1.9; }
article h2 { line-height: 1.45; }
.zh-faq { border-bottom: 1px solid #e8e4dc; padding: 14px 0; }
.zh-faq summary { cursor: pointer; font-weight: 500; color: #14203b; }
.zh-faq p { margin-top: 10px; color: #4a4a4a; }
.zh-en-note { font-size: 0.9rem; color: #6a6a6a; margin-top: 6px; }
.zh-hub { max-width: 860px; margin: 0 auto; padding: 0 20px 60px; font-size: 17px; line-height: 1.9; color: #262626; }
/* Body typography for the hub. blog.css resets every margin to 0 at the top of the
   file and restores content rhythm ONLY under `article`. The four /zh/blog pages are
   <article> so they inherit it; the hub is <div class="zh-hub">, matched none of it,
   and rendered with zero heading margins, 24px headings and grey inherited body text.
   Mirrors blog.css `article >` so the hub reads as one layer with its guides. */
.zh-hub > h2 { font-family: 'Marcellus', serif; font-weight: 400; color: #233985; font-size: 2rem; line-height: 1.3; letter-spacing: -0.3px; margin: 48px 0 20px; text-wrap: balance; }
.zh-hub > h2::before { content: ''; display: block; width: 24px; height: 8px; margin-bottom: 18px; border-radius: 1px; background: linear-gradient(90deg, #000 0%, #000 33.333%, #dd0000 33.333%, #dd0000 66.666%, #ffcc00 66.666%, #ffcc00 100%); }
.zh-hub > p { margin: 0 0 22px; }
.zh-hub > ul { margin: 0 0 22px 22px; padding: 0; }
.zh-hub li { margin-bottom: 8px; }
.zh-hub > p strong, .zh-hub li strong { color: #14203b; }
.zh-hub > p a, .zh-hub li a { color: #233985; border-bottom: 1px solid rgba(35,57,133,0.2); }
.zh-hub > p a:hover, .zh-hub li a:hover { color: #14203b; border-bottom-color: #14203b; }
.zh-hub-hero { text-align: center; padding: 56px 20px 32px; }
.zh-hub-hero h1 { font-family: 'Marcellus', serif; color: #233985; font-size: clamp(1.7rem, 4vw, 2.5rem); line-height: 1.3; margin: 0 auto 18px; max-width: 780px; }
.zh-hub-hero .lede { font-size: 17px; line-height: 1.9; color: #555; max-width: 660px; margin: 0 auto 28px; }
.zh-cta-row { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.zh-card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 18px; margin: 24px 0 8px; }
.zh-card { border: 1px solid #e8e4dc; border-radius: 8px; padding: 20px 22px; background: #fff; }
.zh-card h3 { font-family: 'Marcellus', serif; color: #14203b; font-size: 1.05rem; margin: 0 0 8px; font-weight: 400; }
.zh-card p { font-size: 14.5px; line-height: 1.8; color: #5a5a5a; margin: 0 0 10px; }
.zh-price { border: 1px solid #e8e4dc; border-radius: 8px; padding: 22px 24px; background: #fbfaf7; margin: 22px 0; }
.zh-price strong { color: #233985; }
@media (max-width: 600px) { .zh-hub-hero { padding: 36px 16px 24px; } }