
@theme inline {
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --color-primary: var(--primary);
  --color-primary-foreground: var(--primary-foreground);
  --color-secondary: var(--secondary);
  --color-secondary-foreground: var(--foreground);
  --color-muted: var(--muted);
  --color-muted-foreground: var(--muted-foreground);
  --color-border: var(--border);
  --color-input: var(--border);
  --color-ring: var(--primary);
  --color-popover: var(--background);
  --color-popover-foreground: var(--foreground);
  --color-accent: var(--secondary);
  --color-accent-foreground: var(--foreground);
  --font-sans: 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
  --font-heading: 'Songti SC', 'STSong', 'Noto Serif CJK SC', 'SimSun', serif;
  --radius-lg: 2px;
}
:root { --background:#f6f4ee; --foreground:#242a25; --primary:#4f624d; --primary-foreground:#f6f4ee; --secondary:#ebe9e1; --muted:#ebe9e1; --muted-foreground:#62695f; --border:#d8d9cf; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:32px; }
body { margin:0; background:var(--background); color:var(--foreground); font-family:var(--font-sans); font-size:16px; line-height:1.85; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
button,a { -webkit-tap-highlight-color:transparent; }
a,button { transition:color .16s, background-color .16s, border-color .16s; }
a:focus-visible,button:focus-visible { outline:2px solid var(--primary); outline-offset:5px; }
img { display:block; max-width:100%; height:auto; }
figure,p,h1,h2,h3 { margin:0; }
h1,h2,h3 { text-wrap:balance; }
h1,h2 { font-family:var(--font-heading); font-weight:600; }
h2 { font-size:36px; line-height:1.5; letter-spacing:.03em; }
.wrap { width:calc(100% - 112px); max-width:1120px; margin-inline:auto; }
.site-header { min-height:113px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--border); gap:24px; }
.wordmark { font-size:19px; font-weight:600; letter-spacing:.12em; line-height:1.5; }
.wordmark span { display:block; font-size:9px; font-weight:400; letter-spacing:.2em; margin-top:5px; }
.site-header nav { display:flex; align-items:center; gap:37px; font-size:13px; }
.site-header nav a { display:flex; align-items:center; gap:8px; min-height:44px; }
.site-header a:hover,.text-link:hover { color:var(--primary); }
.hero { display:grid; grid-template-columns:1.15fr .85fr; padding-top:56px; }
.hero-copy { padding:29px 0 58px; }
.eyebrow { font-size:11px; font-weight:500; letter-spacing:.14em; display:flex; align-items:center; gap:9px; color:var(--primary); }
.tiny-dot { width:6px; height:6px; background:var(--primary); border-radius:50%; }
.hero h1 { margin:25px 0 20px; font-size:clamp(40px,4.3vw,59px); letter-spacing:.04em; line-height:1.35; white-space:nowrap; }
.title-dot { color:var(--primary); }
.hero-identity { font-size:15px; line-height:2.1; letter-spacing:.08em; }
.hero-identity span { border-bottom:1px solid #89947f; padding-bottom:3px; font-size:13px; }
.hero-description { margin-top:25px; font-size:17px; line-height:1.9; color:var(--muted-foreground); }
.hero-actions { display:flex; align-items:center; gap:27px; margin-top:33px; }
.solid-link,.text-link { display:inline-flex; align-items:center; justify-content:center; gap:23px; font-size:13px; min-height:46px; }
.solid-link { background:var(--primary); color:var(--primary-foreground); padding:11px 21px; border:1px solid var(--primary); }
.solid-link:hover { background:#354733; border-color:#354733; }
.text-link { gap:10px; border-bottom:1px solid var(--border); }
.hero-avatar { align-self:center; width:100%; padding:0 14px 20px; text-align:center; }
.hero-avatar img { width:400px; margin:auto; mix-blend-mode:multiply; }
.hero-avatar figcaption { margin-top:8px; color:var(--primary); font-family:var(--font-heading); font-size:16px; letter-spacing:.15em; }
.hero-avatar figcaption span { display:block; font-family:var(--font-sans); font-size:8px; letter-spacing:.15em; margin-top:3px; }
.hero-foot { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; border-top:1px solid var(--border); padding:16px 0 32px; font-size:10px; color:var(--muted-foreground); letter-spacing:.08em; }
.hero-foot span:last-child { display:flex; align-items:center; gap:14px; }
.space-photo img { width:100%; aspect-ratio:2.18; object-fit:cover; object-position:center 54%; }
figcaption { font-size:10px; color:var(--muted-foreground); }
.space-photo figcaption { display:flex; justify-content:space-between; margin-top:13px; letter-spacing:.06em; }
.intro-copy { max-width:740px; padding:60px 0 80px; }
.intro-copy h2 { margin:12px 0 20px; }
.intro-copy>p:last-child { color:var(--muted-foreground); font-size:15px; }
.section-heading { border-top:1px solid var(--border); padding-top:48px; padding-bottom:60px; }
.section-heading h2 { margin-top:10px; margin-bottom:15px; }
.skip-link { position:fixed; top:8px; left:8px; padding:8px 16px; background:var(--foreground); color:var(--background); transform:translateY(-180%); z-index:100; }
.skip-link:focus { transform:none; }
@media(max-width:760px) {
  .wrap { width:calc(100% - 40px); }
  .site-header { min-height:88px; gap:16px; }
  .wordmark { font-size:16px; letter-spacing:.06em; }
  .wordmark span { font-size:7px; }
  .site-header nav { gap:18px; font-size:12px; }
  .site-header nav a:nth-child(2) { display:none; }
  .site-header nav a:last-child { font-size:0; gap:0; }
  .site-header nav a:last-child svg { width:20px; height:20px; }
  .hero { grid-template-columns:1fr; padding-top:32px; }
  .hero-copy { padding:8px 0 18px; }
  .hero h1 { font-size:clamp(32px,8.4vw,48px); margin:22px 0 18px; }
  .hero-identity { font-size:14px; }
  .hero-description { font-size:16px; margin-top:22px; }
  .hero-actions { gap:25px; margin-top:27px; }
  .hero-avatar { padding:18px 0 25px; }
  .hero-avatar img { width:240px; }
  .hero-avatar figcaption { font-size:14px; }
  .hero-foot { font-size:9px; padding:15px 0 24px; }
  .hero-foot span:last-child { font-size:0; gap:0; }
  .space-photo img { aspect-ratio:1.2; object-position:60% center; }
  .space-photo figcaption { font-size:9px; }
  .space-photo figcaption span:last-child { display:none; }
  .intro-copy { padding:42px 0 54px; }
  h2 { font-size:28px; }
  .intro-copy>p:last-child { font-size:15px; }
  .section-heading { padding-top:36px; padding-bottom:40px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation:none!important; transition:none!important; } }
.video-cover>a { display:block; color:inherit; }
.video-cover .play-label { pointer-events:none; }
dialog::backdrop { background:rgba(27,34,28,.54); }
dialog { border:0; box-shadow:0 20px 60px rgba(20,27,20,.28); background:var(--background); color:var(--foreground); }
.contact-dialog { position:relative; width:min(470px,calc(100vw - 40px)); }
.dialog-close { position:absolute; top:11px; right:14px; border:0; background:transparent; color:var(--muted-foreground); font-size:28px; line-height:1; cursor:pointer; }
.qr-frame { display:block; width:min(285px,100%); margin:22px auto 10px; background:#fff; padding:10px; }
.qr-frame img { width:100%; }
.channel-qr-frame { width:min(310px,100%); }
.wechat-image-actions { display:flex; justify-content:center; gap:18px; margin:14px 0; }
@media(max-width:760px) { .featured-work,.intro-editorial,.service-group,.contact-layout,.case-body,.case-delivery { grid-template-columns:1fr; gap:28px; } .more-work,.brand-grid,.process-list,.audience-grid,.case-flow ol { grid-template-columns:1fr; gap:22px; } .brand-mark { min-height:118px; } .section-top,.brand-heading,.service-end { display:block; } .section-top>p,.brand-heading>p { margin-top:12px; } .audience-grid article { padding:24px 0; border:0; border-top:1px solid #c9cdbe; } .audience-grid article:first-child { border-top:0; } .contact-brief { border-left:0; border-top:1px solid #84927b; padding:25px 0 0; } .case-heading h1 { font-size:34px; } .case-meta { flex-wrap:wrap; gap:12px 20px; } .case-flow li { padding-bottom:14px; } }
/* Editorial content */
.hero-foot a { display:flex; align-items:center; gap:12px; min-height:28px; }
.intro-editorial { display:grid; grid-template-columns:1fr 1.3fr; gap:90px; padding:66px 0 86px; }
.intro-editorial h2 { margin-top:15px; }
.intro-body { padding-top:2px; font-size:16px; }
.intro-body p+p { margin-top:20px; }
.intro-body p:nth-child(2) { color:var(--muted-foreground); }
.intro-body .role-line { font-size:12px; padding-top:20px; border-top:1px solid var(--border); line-height:2.1; }
.role-line span { color:var(--muted-foreground); }
.section-top { display:flex; align-items:flex-end; justify-content:space-between; gap:32px; padding:45px 0 35px; border-top:1px solid var(--border); }
.section-top h2 { margin-top:12px; }
.section-top>p { font-size:14px; color:var(--muted-foreground); padding-bottom:4px; }
.work-section { padding-bottom:78px; }
.brand-section { padding-bottom:72px; }
.brand-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:32px; border-top:1px solid var(--border); padding:42px 0 28px; }
.brand-heading h2 { margin-top:12px; }
.brand-heading>p { color:var(--muted-foreground); font-size:14px; padding-bottom:4px; }
.brand-grid { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--border); border-left:1px solid var(--border); }
.brand-mark { min-height:136px; border-right:1px solid var(--border); border-bottom:1px solid var(--border); padding:23px 20px; display:flex; flex-direction:column; justify-content:space-between; gap:17px; }
.brand-mark strong { font-family:Arial,Helvetica,sans-serif; font-size:22px; letter-spacing:-.05em; font-weight:800; line-height:1.1; }
.brand-mark img { max-width:138px; max-height:44px; width:auto; height:auto; object-fit:contain; object-position:left center; }
.brand-mark img[src$="/benq.png"] { max-height:64px; }
.brand-mark span { color:var(--muted-foreground); font-size:11px; }
.featured-work { display:grid; grid-template-columns:1.3fr 1fr; gap:45px; align-items:center; }
.work-image,.small-work-image { display:block; position:relative; overflow:hidden; background:var(--secondary); }
.work-image img,.small-work-image img { width:100%; aspect-ratio:16/9; object-fit:contain; }
.image-corner { position:absolute; bottom:0; right:0; padding:12px 16px; display:flex; align-items:center; gap:22px; background:var(--background); font-size:12px; }
.work-category { font-size:12px; color:var(--primary); letter-spacing:.02em; margin-bottom:10px; }
.featured-copy h3 { font-family:var(--font-heading); font-weight:600; font-size:29px; line-height:1.6; margin:0 0 19px; }
.featured-copy>p:not(.work-category) { font-size:15px; color:var(--muted-foreground); }
.work-facts { display:flex; gap:14px; font-size:11px; margin-top:22px; color:var(--primary); }
.work-facts span+span { padding-left:14px; border-left:1px solid var(--border); }
.featured-copy>.text-link { margin-top:16px; }
.more-work-label { display:flex; gap:25px; align-items:center; border-top:1px solid var(--border); margin-top:42px; padding:26px 0 20px; font-size:13px; }
.more-work-label span:last-child { font-size:12px; color:var(--muted-foreground); }
.more-work { display:grid; grid-template-columns:1fr 1fr; gap:32px; }
.small-work-image { margin-bottom:20px; }
.play-label { position:absolute; bottom:12px; right:12px; display:flex; gap:8px; align-items:center; background:rgba(30,36,30,.91); color:#fff; padding:7px 10px; font-size:10px; }
.small-work h3 { font-size:20px; font-weight:500; line-height:1.65; margin:7px 0 10px; }
.small-work-note { font-size:12px; color:var(--muted-foreground); }
.source-note { font-size:12px; line-height:1.85; color:var(--muted-foreground); margin-top:25px; }
.services-section { padding-bottom:66px; }
.service-group { display:grid; grid-template-columns:240px 1fr; gap:55px; border-top:1px solid var(--border); }
.service-group-title { padding:34px 0; }
.service-group-title>span { color:var(--primary); font-size:13px; font-family:Georgia,serif; }
.service-group-title h3 { font-size:19px; font-weight:500; margin:9px 0 10px; }
.service-group-title p { color:var(--muted-foreground); font-size:13px; }
.service-item { display:grid; grid-template-columns:28px 1fr; gap:22px; padding:32px 0; }
.service-item+.service-item { border-top:1px solid var(--border); }
.service-number { color:var(--primary); font-family:Georgia,serif; font-size:14px; padding-top:5px; }
.service-title { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:12px; }
.service-title h3 { font-size:20px; font-weight:500; }
.service-title span { font-size:11px; color:var(--primary); white-space:nowrap; }
.service-item p { color:var(--muted-foreground); font-size:15px; }
.service-fit { display:block; font-size:12px; margin-top:14px; }
.service-end { display:flex; align-items:center; justify-content:space-between; gap:20px; border-top:1px solid var(--border); padding-top:22px; }
.service-end>p { color:var(--muted-foreground); font-size:12px; }
.audience-section { padding:16px 0 46px; background:var(--secondary); }
.audience-section .section-top { border:0; }
.audience-grid { display:grid; grid-template-columns:repeat(3,1fr); padding-top:15px; }
.audience-grid article { padding:0 30px; border-left:1px solid #c9cdbe; }
.audience-grid article:first-child { padding-left:0; border:0; }
.audience-grid article:last-child { padding-right:0; }
.platform-name { font-size:14px; }
.follower-count { font-size:49px; line-height:1.35; font-family:Georgia,serif; margin:15px 0 2px; letter-spacing:-.04em; }
.follower-count span { font-family:var(--font-sans); font-size:12px; letter-spacing:0; }
.follower-unit { font-size:11px; color:var(--muted-foreground); }
.audience-detail { font-size:12px; margin-top:26px; line-height:2; }
.audience-detail strong { font-weight:500; }
.audience-section .source-note { max-width:950px; margin-top:34px; }
.process-section { padding:40px 0 80px; }
.process-section .section-top { border:0; }
.process-list { display:grid; grid-template-columns:repeat(4,1fr); list-style:none; margin:0; padding:12px 0 0; gap:36px; }
.process-list li { border-top:1px solid var(--border); padding-top:20px; }
.process-number { font-family:Georgia,serif; color:var(--primary); font-size:13px; }
.process-list h3 { font-size:17px; font-weight:500; margin:14px 0 8px; }
.process-list p { font-size:12px; color:var(--muted-foreground); }
.contact-section { background:var(--primary); color:var(--background); padding:66px 0; }
.contact-layout { display:grid; grid-template-columns:1.6fr 1fr; gap:85px; }
.contact-section .eyebrow { color:#d8dfce; font-size:10px; }
.contact-section h2 { font-size:43px; margin:16px 0 22px; }
.contact-section p:not(.eyebrow) { font-size:15px; color:#e4e8db; line-height:1.9; }
.contact-actions { display:flex; align-items:center; gap:18px; margin-top:29px; }
.contact-button { height:47px; border-radius:0; padding:0 21px; gap:24px; background:var(--background); color:var(--primary); font-size:13px; }
.contact-button:hover { background:#e5e9dd; }
.contact-button.secondary { background:transparent; color:var(--background); border:1px solid #92a08c; }
.contact-button.secondary:hover { background:#445540; }
.contact-brief { border-left:1px solid #84927b; padding-left:44px; align-self:center; }
.contact-brief>span { font-size:12px; color:#d8dfce; }
.contact-brief p { margin:15px 0 18px; }
.contact-brief small { font-size:11px; color:#d8dfce; }
.site-footer { display:flex; justify-content:space-between; align-items:center; gap:20px; padding-block:39px; }
.site-footer .wordmark { font-size:16px; }
.site-footer p { color:var(--muted-foreground); font-size:11px; margin-top:8px; }
.site-footer>p { text-align:right; }
.contact-dialog { max-width:470px!important; padding:36px 30px; border-radius:2px; line-height:1.85; }
.dialog-title { font-family:var(--font-heading); font-size:25px; line-height:1.5; }
.dialog-description { font-size:14px; }
.wechat-placeholder { min-height:160px; border:1px dashed var(--border); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:13px; color:var(--muted-foreground); margin:10px 0; }
.wechat-placeholder span { font-size:12px; }
.draft-note { color:var(--muted-foreground); font-size:12px; }
.dialog-hint { font-size:14px; border-top:1px solid var(--border); padding-top:20px; }
.dialog-hint strong { font-weight:500; }
.platform-names { display:flex; gap:25px; padding:16px 0; font-size:14px; border-bottom:1px solid var(--border); }
.account-copy { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px 0; }
.account-copy strong { font-size:17px; font-weight:500; }
.copy-button { border-radius:2px; height:40px; padding-inline:12px; }
/* Case study */
.case-heading { padding-top:34px; padding-bottom:35px; }
.back-link { display:inline-flex; gap:10px; align-items:center; min-height:40px; font-size:12px; color:var(--muted-foreground); margin-bottom:42px; }
.case-heading h1 { font-size:52px; line-height:1.45; margin:22px 0; }
.case-lead { color:var(--muted-foreground); font-size:17px; }
.case-meta { display:flex; gap:45px; font-size:12px; margin-top:35px; padding-top:22px; border-top:1px solid var(--border); color:var(--muted-foreground); }
.case-meta strong { font-weight:400; margin-left:14px; color:var(--foreground); }
.case-cover img { width:100%; aspect-ratio:16/9; object-fit:contain; background:var(--secondary); }
.case-cover figcaption,.case-inline-photo figcaption { margin-top:11px; font-size:12px; }
.case-body { display:grid; grid-template-columns:1fr 2fr; gap:75px; padding-top:65px; }
.case-body aside>p:nth-child(2) { font-family:var(--font-heading); font-size:22px; line-height:1.8; margin:17px 0; }
.case-body aside .text-link { font-size:12px; }
.case-sections section { padding-bottom:45px; }
.case-number { color:var(--primary); font-size:12px; margin-bottom:12px; }
.case-sections h2 { font-size:27px; margin-bottom:17px; }
.case-sections section>p:not(.case-number) { color:var(--muted-foreground); font-size:16px; }
.case-sections blockquote { border-left:2px solid var(--primary); margin:25px 0 0; padding-left:23px; font-family:var(--font-heading); font-size:21px; line-height:1.8; }
.case-inline-photo { margin-top:25px; }
.case-inline-photo img { width:100%; }
.case-flow { padding:42px 0 45px; border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.case-flow h2 { font-size:29px; margin-top:12px; }
.case-flow ol { list-style:none; padding:30px 0 0; margin:0; display:grid; grid-template-columns:repeat(4,1fr); gap:30px; }
.case-flow li { position:relative; }
.case-flow li span { font-family:Georgia,serif; color:var(--primary); font-size:13px; }
.case-flow li p { font-size:17px; margin-top:8px; }
.case-flow li svg { position:absolute; right:15px; top:32px; color:var(--primary); }
.case-delivery { display:grid; grid-template-columns:1fr 2fr; gap:75px; padding-block:48px 65px; }
.case-delivery h2 { font-size:29px; margin-top:12px; }
.case-delivery>div>p:not(.eyebrow):not(.source-note) { font-size:16px; margin-bottom:24px; color:var(--muted-foreground); }
.case-contact { background:var(--secondary); padding:54px 0; }
.case-contact h2 { margin:18px 0 20px; font-size:33px; }
/* Design review surface, separate from the public-facing composition. */
.review-page { min-height:100vh; background:#e6e5df; padding:32px clamp(16px,4vw,56px) 40px; }
.review-header { max-width:1280px; margin:auto; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.review-header h1 { font-family:var(--font-sans); font-size:23px; font-weight:500; margin:6px 0; }
.review-header>div>p:last-child { font-size:12px; color:var(--muted-foreground); }
.review-controls { max-width:1280px; margin:26px auto 20px; display:flex; justify-content:space-between; align-items:center; gap:15px; flex-wrap:wrap; }
.review-controls>div { display:flex; gap:8px; }
.review-controls button { border-radius:2px; min-height:40px; padding:0 15px; font-size:12px; }
.review-stage { width:100%; max-width:1280px; margin:auto; }
.review-frame-holder { margin:auto; box-shadow:0 8px 35px #242a2510; }
.review-frame { border:0; display:block; transform-origin:top left; background:var(--background); }
.review-notes { max-width:1280px; margin:28px auto 0; font-size:12px; color:var(--muted-foreground); }
.review-notes strong { font-weight:500; color:var(--foreground); margin-right:10px; }
@media(max-width:1000px) and (min-width:761px) {
  .featured-work { gap:30px; grid-template-columns:1.15fr 1fr; }
  .featured-copy h3 { font-size:25px; }
  .service-group { grid-template-columns:190px 1fr; gap:25px; }
  .service-title { align-items:flex-start; flex-direction:column; gap:4px; }
  .intro-editorial { gap:45px; }
  .follower-count { font-size:40px; }
  .audience-grid article { padding-inline:20px; }
}
@media(max-width:760px) {
  .site-header { padding-block:20px 13px; display:block; }
  .site-header nav { margin-top:9px; justify-content:space-between; gap:12px; }
  .site-header nav a:nth-child(2) { display:flex; }
  .site-header nav a:last-child { font-size:12px; gap:7px; }
  .site-header nav a:last-child svg { width:14px; height:14px; }
  .site-header nav a { min-height:38px; }
  .hero-foot { font-size:10px; }
  .hero-foot a { font-size:0; gap:0; }
  .intro-editorial { display:block; padding:43px 0 53px; }
  .intro-editorial h2 br { display:none; }
  .intro-body { margin-top:23px; font-size:16px; }
  .intro-body .role-line { font-size:12px; }
  .section-top { display:block; padding:35px 0 25px; }
  .section-top h2 { margin-top:10px; }
  .section-top>p { margin-top:14px; font-size:14px; }
  .featured-work { display:block; }
  .featured-copy { padding-top:22px; }
  .featured-copy h3 { font-size:27px; margin-bottom:15px; }
  .featured-copy>p:not(.work-category) { font-size:16px; }
  .featured-copy>.text-link { margin-top:12px; }
  .more-work-label { margin-top:30px; display:block; padding:22px 0; }
  .more-work-label span:last-child { display:block; margin-top:5px; }
  .more-work { grid-template-columns:1fr; gap:29px; }
  .small-work-image { margin-bottom:16px; }
  .small-work h3 { font-size:20px; }
  .source-note { font-size:12px; }
  .work-section { padding-bottom:46px; }
  .service-group { display:block; }
  .service-group-title { padding:25px 0 5px; display:grid; grid-template-columns:22px 1fr; gap:0 12px; }
  .service-group-title>span { padding-top:5px; }
  .service-group-title h3 { margin:0 0 8px; }
  .service-group-title p { grid-column:2; }
  .service-group-title p br { display:none; }
  .service-item { gap:12px; grid-template-columns:22px 1fr; padding:25px 0; }
  .service-title { display:block; margin-bottom:11px; }
  .service-title h3 { font-size:19px; }
  .service-title span { font-size:12px; margin-top:3px; display:block; }
  .service-item p { font-size:16px; }
  .service-fit { font-size:12px; }
  .service-end { display:block; }
  .service-end .text-link { margin-top:12px; }
  .services-section { padding-bottom:42px; }
  .audience-section { padding:3px 0 35px; }
  .audience-grid { grid-template-columns:1fr; padding:0; }
  .audience-grid article,.audience-grid article:first-child,.audience-grid article:last-child { padding:20px 0; border-left:0; border-top:1px solid #c9cdbe; display:grid; grid-template-columns:1fr 1fr; column-gap:20px; }
  .platform-name { grid-column:1; }
  .follower-count { font-size:40px; grid-column:1; margin:8px 0 0; }
  .follower-unit { grid-column:1; }
  .audience-detail { grid-column:2; grid-row:1/4; align-self:center; margin:0; font-size:12px; }
  .audience-section .source-note { margin-top:13px; }
  .process-section { padding:14px 0 45px; }
  .process-list { grid-template-columns:1fr 1fr; gap:26px 20px; padding:0; }
  .process-list li { padding-top:14px; }
  .process-list h3 { font-size:17px; margin-top:9px; }
  .process-list p { font-size:12px; }
  .contact-section { padding:43px 0; }
  .contact-layout { grid-template-columns:1fr; gap:36px; }
  .contact-section h2 { font-size:33px; margin:16px 0; }
  .contact-section p:not(.eyebrow) { font-size:16px; }
  .contact-section p br { display:none; }
  .contact-brief { border-left:0; border-top:1px solid #84927b; padding:25px 0 0; }
  .contact-brief p { display:flex; flex-wrap:wrap; }
  .contact-brief p br { display:block; }
  .contact-brief p { line-height:2; }
  .contact-actions { gap:12px; }
  .contact-button { padding:0 18px; gap:14px; }
  .site-footer { align-items:flex-start; padding-block:29px; }
  .site-footer .wordmark { font-size:14px; }
  .site-footer p { font-size:10px; }
  .contact-dialog { padding:30px 22px; }
  .dialog-title { font-size:23px; }
  .account-copy { flex-wrap:wrap; gap:12px; }
  .case-heading { padding:20px 0 24px; }
  .back-link { margin-bottom:26px; }
  .case-heading h1 { font-size:32px; margin:20px 0; }
  .case-lead { font-size:16px; }
  .case-meta { margin-top:25px; gap:12px; flex-wrap:wrap; }
  .case-meta span { flex-basis:100%; }
  .case-meta strong { margin-left:20px; }
  .case-cover figcaption { font-size:11px; }
  .case-body { display:block; padding-top:32px; }
  .case-body aside { padding-bottom:32px; }
  .case-body aside>p:nth-child(2) br { display:none; }
  .case-body aside>p:nth-child(2) { font-size:21px; margin:8px 0; }
  .case-sections h2 { font-size:24px; }
  .case-sections section { padding-bottom:32px; }
  .case-sections blockquote { font-size:19px; padding-left:17px; }
  .case-flow { padding-block:32px; }
  .case-flow h2 { font-size:26px; }
  .case-flow ol { grid-template-columns:1fr 1fr; gap:25px; }
  .case-flow li p { font-size:16px; }
  .case-flow li svg { display:none; }
  .case-delivery { grid-template-columns:1fr; gap:22px; padding-block:35px; }
  .case-delivery h2 { font-size:26px; }
  .case-delivery h2 br { display:none; }
  .case-contact { padding:38px 0; }
  .case-contact h2 { font-size:26px; }
  .review-header { display:block; }
  .review-header h1 { font-size:19px; }
  .review-header .text-link { margin-top:12px; }
  .review-controls { margin-top:18px; }
  .review-controls button { padding-inline:12px; }
}
:root { --font-sans:'PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif; --font-heading:'Songti SC','STSong','Noto Serif CJK SC','SimSun',serif; }
.contact-dialog { max-width:min(470px,calc(100vw - 32px))!important; }
@media(max-width:760px) { .contact-brief p { display:block; } }
/* Original video covers with explicit external playback. */
.video-cover { display:block; position:relative; overflow:hidden; background:var(--secondary); }
.video-cover img { display:block; width:100%; height:auto; aspect-ratio:16/9; object-fit:contain; }
.video-play-button { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:64px; height:64px; display:grid; place-items:center; padding-left:3px; color:#fff; background:rgba(28,36,28,.84); border:1px solid rgba(255,255,255,.9); border-radius:50%; box-shadow:0 2px 14px #0003; transition:background-color .16s; }
.video-cover:hover .video-play-button,.video-cover:focus-visible .video-play-button { background:var(--primary); }
.video-duration,.video-destination { position:absolute; bottom:12px; display:inline-flex; align-items:center; gap:6px; color:#fff; background:rgba(24,29,25,.92); font-size:11px; line-height:1.5; padding:5px 9px; }
.video-duration { left:12px; font-variant-numeric:tabular-nums; }
.video-destination { right:12px; }
.platform-profile { display:inline-flex; align-items:center; gap:7px; width:fit-content; }
.platform-profile:hover { color:var(--primary); text-decoration:underline; text-underline-offset:4px; }
.contact-dialog { max-height:calc(100dvh - 32px); overflow-y:auto; }
.wechat-dialog { gap:12px; }
.qr-frame { display:flex; align-items:center; justify-content:center; margin:6px auto 0; background:var(--background); border:1px solid var(--border); box-shadow:inset 0 0 0 10px #f0eee7; overflow:hidden; }
.qr-frame img { width:100%; height:auto; }
.wechat-qr-frame { max-width:278px; padding:10px; }
.channel-qr-frame { max-width:330px; padding:10px; }
.wechat-image-actions { display:flex; align-items:center; justify-content:center; gap:28px; }
.wechat-image-actions .text-link { font-size:12px; gap:8px; }
.platform-profile-links { display:grid; gap:0; margin-top:4px; }
.platform-profile-links>a { display:flex; align-items:center; justify-content:space-between; min-height:75px; padding:13px 0; border-bottom:1px solid var(--border); font-size:16px; }
.platform-profile-links>a:hover { color:var(--primary); }
.platform-profile-links small { display:block; color:var(--muted-foreground); font-size:12px; margin-top:2px; }
@media(max-width:760px) {
  .video-play-button { width:52px; height:52px; }
  .video-play-button svg { width:22px; height:22px; }
  .video-duration,.video-destination { bottom:9px; font-size:10px; padding:4px 7px; }
  .video-duration { left:9px; }
  .video-destination { right:9px; }
  .wechat-qr-frame { max-width:250px; }
  .channel-qr-frame { max-width:288px; }
}
