/* 首页：服务端正文 + 轻量 CSS 数据视觉，无第三方字体或动画依赖。 */
:root {
  color-scheme: dark;
  --ink: #edf4ff;
  --muted: #a2b2ca;
  --cyan: #59ead4;
  --blue: #669bff;
  --paper: #080f1e;
  --panel: #101c30;
  --line: #24344c;
  --radius: 18px;
}
* { box-sizing: border-box; }
.header-actions { display: flex; align-items: center; gap: 12px; }
.theme-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 42px; padding: 7px 12px; border: 1px solid var(--line); border-radius: 7px; color: var(--ink); background: var(--panel); cursor: pointer; white-space: nowrap; font-size: 12px; }
.theme-toggle[hidden] { display: none; }
.theme-toggle:hover { border-color: var(--cyan); }
.theme-icon { font-size: 18px; line-height: 1; }
.brand .brand-light { display: none; }
:root[data-theme="light"] .brand-dark { display: none; }
:root[data-theme="light"] .brand-light { display: block; }
:root[data-theme="light"] {
  color-scheme: light;
  --ink: #10263c; --muted: #50627a; --cyan: #087f72; --blue: #315fb8;
  --paper: #f7f9fc; --panel: #ffffff; --line: #d6e1ed;
}
/* 白色主题沿用青蓝品牌色，分别适配面板、文字和图表，不使用滤镜反色。 */
:root[data-theme="light"] .site-header { background: rgba(255,255,255,.95); }
:root[data-theme="light"] .main-nav>a { color: var(--muted); }
:root[data-theme="light"] .main-nav .nav-current,
:root[data-theme="light"] .main-nav>a:hover { color: var(--ink); }
:root[data-theme="light"] .nav-badge { background: #edf3fa; color: #50627a; border-color: var(--line); }
:root[data-theme="light"] .header-cta { border-color: #9bcac3; }
:root[data-theme="light"] .header-cta:hover { background: #e7f5f1; }
:root[data-theme="light"] .hero { background: radial-gradient(ellipse at 82% 35%,#dcebf8,transparent 55%),radial-gradient(ellipse at 5% 0,#e1f4ef,transparent 50%); }
:root[data-theme="light"] .accent-word { text-shadow: none; }
:root[data-theme="light"] .hero-lead,
:root[data-theme="light"] .button-text,
:root[data-theme="light"] .insight-dimensions,
:root[data-theme="light"] .card-punch,
:root[data-theme="light"] .audience-card .audience-subtitle { color: #304b68; }
:root[data-theme="light"] .button-primary { color: white; box-shadow: 0 5px 25px #087f721f; }
:root[data-theme="light"] .button-primary:hover { background: #06695f; }
:root[data-theme="light"] .platform-pill { background: white; }
:root[data-theme="light"] .douyin-dot { background: #087f72; }
:root[data-theme="light"] .xhs-dot { background: #c73360; }
:root[data-theme="light"] .hero-visual { background: linear-gradient(135deg,#fff,#eff5fc); border-color: #c1d4e8; box-shadow: 0 24px 60px #21456812,inset 0 1px 0 white; }
:root[data-theme="light"] .small-label { color: var(--muted); border-color: #bacbde; }
:root[data-theme="light"] .visual-code,
:root[data-theme="light"] .chart-kicker,
:root[data-theme="light"] .signal-grid span,
:root[data-theme="light"] .visual-bottom,
:root[data-theme="light"] .card-number,
:root[data-theme="light"] .card-foot,
:root[data-theme="light"] .small-note { color: var(--muted); }
:root[data-theme="light"] .chart-symbol { background: #e4f4ef; border-color: #a1ccc4; }
:root[data-theme="light"] .signal-grid { background: #eaf1f8; }
:root[data-theme="light"] .trend-chart g[stroke] { stroke: #b9cada; }
:root[data-theme="light"] #trend-line stop:first-child { stop-color: #315fb8; }
:root[data-theme="light"] #trend-line stop:last-child,
:root[data-theme="light"] #trend-fill stop { stop-color: #087f72; }
:root[data-theme="light"] .trend-chart circle { fill: #087f72; stroke: #fff; }
:root[data-theme="light"] .value-strip { background: linear-gradient(90deg,#e5f3ef,#edf3fd); border-color: var(--line); }
:root[data-theme="light"] .value-strip-inner>span,
:root[data-theme="light"] .overview-note { color: #405c77; }
:root[data-theme="light"] .capabilities-section { background: radial-gradient(ellipse at 50% 0,#e4edf9,transparent 65%),#f0f4fa; border-color: var(--line); }
:root[data-theme="light"] .capability-card { background: white; border-color: var(--line); }
:root[data-theme="light"] .capability-card:hover { border-color: #82b7ae; box-shadow: 0 16px 40px #21456812; }
:root[data-theme="light"] .featured-card { background: linear-gradient(135deg,#edf9f4,#fff); border-color: #a1ccc4; }
:root[data-theme="light"] .status-pill { background: #e2f3ed; border-color: #a1ccc4; color: #076c61; }
:root[data-theme="light"] .status-pill.muted { background: #edf2f8; border-color: #c5d4e5; color: #50627a; }
:root[data-theme="light"] .feature-icon { color: #087f72; background: #e5f3ef; border-color: #afcfc8; }
:root[data-theme="light"] .capability-card:nth-child(2) .feature-icon,
:root[data-theme="light"] .capability-card:nth-child(4) .feature-icon { color: #315fb8; background: #eaf0fc; border-color: #b9cdec; }
:root[data-theme="light"] .card-foot,
:root[data-theme="light"] .audience-card { border-color: var(--line); }
:root[data-theme="light"] .comparison-section { background: #edf3fa; border-color: var(--line); }
:root[data-theme="light"] .comparison-table-wrap { background: white; border-color: #c5d4e5; }
:root[data-theme="light"] th,
:root[data-theme="light"] td { border-color: var(--line); }
:root[data-theme="light"] thead th { background: #e3ecf7; color: #304b68; }
:root[data-theme="light"] .contact-section { background: radial-gradient(ellipse at 15% 30%,#dcf1eb,transparent 60%),radial-gradient(ellipse at 90% 90%,#e1eafa,transparent 55%),#f4f8fc; }
:root[data-theme="light"] .contact-section p { color: var(--muted); }
:root[data-theme="light"] .contact-tags span { background: #e5f3ef; border-color: #afcfc8; color: #27665d; }
:root[data-theme="light"] .contact-card { background: white; border-color: #c5d4e5; box-shadow: 0 20px 60px #21456812; }
:root[data-theme="light"] .contact-placeholder { background: #f3f7fb; border-color: #bacbde; }
:root[data-theme="light"] .contact-mark { text-shadow: none; }
:root[data-theme="light"] .copy-button { background: #e5f3ef; border-color: #afcfc8; }
:root[data-theme="light"] .site-footer { background: #edf2f8; }
:root[data-theme="light"] .site-footer p,
:root[data-theme="light"] .footer-links { color: var(--muted); }
html { scroll-behavior: smooth; scroll-padding-top: 110px; }
body { margin: 0; color: var(--ink); background: var(--paper); font: 16px/1.8 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
img { max-width: 100%; height: auto; }
p,h1,h2,h3 { margin: 0; }
a,button,summary { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid var(--cyan); outline-offset: 5px; }
.container { max-width: 1240px; margin: 0 auto; padding: 0 36px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: -90px; left: 20px; background: var(--cyan); color: var(--paper); padding: 12px 20px; z-index: 20; }
.skip-link:focus { top: 10px; }
.site-header { position: sticky; top: 0; background: rgba(8,15,30,.94); border-bottom: 1px solid var(--line); backdrop-filter: blur(18px); z-index: 10; }
.header-inner { height: 86px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: flex; gap: 12px; align-items: center; flex-shrink: 0; }
.brand img { display: block; width: 240px; height: auto; }
.main-nav { display: flex; align-items: center; gap: 38px; height: 100%; font-size: 14px; }
.main-nav>a { position: relative; display: flex; gap: 7px; align-items: center; height: 100%; color: #b6c6dd; }
.main-nav>a:hover,.main-nav .nav-current { color: var(--ink); }
.nav-current:after { content: ""; position: absolute; bottom: 18px; left: 0; width: 26px; height: 2px; background: var(--cyan); box-shadow: 0 0 12px #59ead488; }
.nav-badge { font-size: 10px; padding: 2px 7px; background: #15273c; color: #a1b6d3; border: 1px solid #2b405b; border-radius: 5px; }
.header-cta { font-size: 13px; color: var(--cyan); border: 1px solid #365b65; border-radius: 7px; padding: 9px 15px; white-space: nowrap; transition: background .2s; }
.header-cta:hover { background: #132e3b; }
.header-cta span { margin-left: 14px; }
.hero { position: relative; isolation: isolate; padding: 82px 0 78px; overflow: hidden; background: radial-gradient(ellipse at 82% 35%,#14345780,transparent 55%),radial-gradient(ellipse at 5% 0,#152b4b55,transparent 50%); }
.hero:before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background-image: linear-gradient(#40649a12 1px,transparent 1px),linear-gradient(90deg,#40649a12 1px,transparent 1px); background-size: 58px 58px; mask-image: linear-gradient(to bottom,#000,transparent); }
.hero-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.hero-copy,.hero-visual { min-width: 0; }
.eyebrow { color: var(--cyan); font-size: 12px; font-weight: 600; letter-spacing: 2px; margin-bottom: 23px; }
.signal-dot { display: inline-block; width: 6px; height: 6px; margin-right: 9px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 0 4px #59ead416,0 0 15px #59ead455; }
.hero h1 { font-size: clamp(42px,4.6vw,64px); letter-spacing: -2px; line-height: 1.3; font-weight: 750; }
.accent-word { color: var(--cyan); text-shadow: 0 0 38px #59ead42b; }
.hero-lead { font-size: 21px; line-height: 1.8; margin-top: 26px; font-weight: 500; color: #c8d8ef; }
.hero-description { font-size: 14px; color: var(--muted); margin-top: 16px; line-height: 1.9; }
.hero-actions { display: flex; align-items: center; gap: 23px; margin: 30px 0; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 26px; padding: 12px 21px; border-radius: 7px; font-size: 14px; font-weight: 600; transition: background .2s,box-shadow .2s,transform .2s; }
.button-primary { background: var(--cyan); color: #08212c; box-shadow: 0 5px 28px #59ead422; }
.button-primary:hover { background: #8ff9e6; box-shadow: 0 7px 35px #59ead43a; transform: translateY(-2px); }
.button-text { padding-left: 0; padding-right: 0; color: #ccd9ec; }
.button-text:hover { color: var(--cyan); }
.hero-platforms { display: flex; gap: 12px; align-items: center; font-size: 12px; color: var(--muted); }
.platform-pill { display: inline-flex; align-items: center; gap: 7px; background: #111f34; border: 1px solid var(--line); padding: 4px 12px; border-radius: 20px; color: var(--ink); }
.platform-dot { width: 6px; height: 6px; border-radius: 50%; }
.douyin-dot { background: #5ae9df; }
.xhs-dot { background: #ff7b9b; }
.hero-visual { position: relative; padding: 25px 26px 20px; background: linear-gradient(135deg,#152740ee,#0b172af5); border: 1px solid #36506c; border-radius: 20px; box-shadow: 0 30px 80px #0005,0 0 60px #3068b118,inset 0 1px 0 #ffffff0c; }
.hero-visual:before { content: ""; position: absolute; height: 1px; top: -1px; left: 12%; right: 12%; background: linear-gradient(90deg,transparent,#67e9e5,transparent); }
.visual-heading { display: flex; justify-content: space-between; align-items: center; font-size: 13px; gap: 12px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.small-label { font-size: 10px; color: #a2b2ca; white-space: nowrap; border: 1px solid #364b66; padding: 2px 7px; border-radius: 4px; }
.insight-dimensions { display: flex; justify-content: space-between; gap: 12px; align-items: center; margin: 22px 0; font-size: 12px; color: #cfdef3; }
.insight-dimensions b { color: var(--cyan); font-weight: 400; margin: 0 9px; }
.visual-code,.chart-kicker { font: 9px/1.7 Consolas,monospace; letter-spacing: 1.8px; color: #8ca9d2; }
.trend-heading { display: flex; align-items: center; justify-content: space-between; }
.trend-heading h2 { font-size: 22px; margin-top: 4px; font-weight: 500; letter-spacing: 0; }
.chart-symbol { width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid #2a535f; border-radius: 10px; color: var(--cyan); background: #12303b; font-size: 23px; }
.trend-chart { position: relative; margin-top: 12px; }
.trend-chart svg { display: block; width: 100%; height: auto; overflow: hidden; }
.trend-line { stroke-dasharray: 650; stroke-dashoffset: 650; animation: draw-trend 1.8s ease-out forwards; }
@keyframes draw-trend { to { stroke-dashoffset: 0; } }
.chart-legend { display: flex; gap: 23px; margin: 8px 0 22px; color: var(--muted); font-size: 10px; }
.chart-legend span { display: inline-flex; align-items: center; gap: 7px; }
.chart-legend i { width: 15px; height: 2px; background: var(--cyan); }
.chart-legend span+span i { height: 0; border-top: 2px dashed #7e8cb5; background: none; }
.signal-grid { display: grid; grid-template-columns: repeat(3,1fr); border: 1px solid var(--line); border-radius: 9px; padding: 13px 0; background: #080f1e44; }
.signal-grid>div { padding: 0 13px; }
.signal-grid>div+div { border-left: 1px solid var(--line); }
.signal-grid span { display: block; font-size: 9px; color: #94abcc; }
.signal-grid strong { display: block; font-size: 12px; font-weight: 500; margin-top: 3px; white-space: nowrap; }
.visual-bottom { padding-top: 17px; display: flex; gap: 12px; justify-content: space-between; align-items: center; font-size: 9px; color: #94a9c4; }
.visual-bottom strong { font-weight: 400; color: var(--cyan); }
.value-strip { background: linear-gradient(90deg,#10263a,#11213b 60%,#132b3d); border-block: 1px solid #29445a; }
.value-strip-inner { padding-top: 25px; padding-bottom: 25px; display: flex; justify-content: space-between; gap: 20px; align-items: center; }
.value-strip p { font-size: 18px; }
.value-strip p span { color: var(--cyan); margin-left: 5px; }
.value-strip-inner>span { font-size: 12px; letter-spacing: 2px; color: #a4bddb; }
.value-strip i { font-style: normal; margin: 0 15px; color: #507293; }
.section { padding: 88px 0; }
h2 { font-size: 34px; line-height: 1.5; letter-spacing: -1px; font-weight: 650; }
.overview-grid,.comparison-grid,.faq-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 90px; }
.overview-copy { padding-top: 3px; color: var(--muted); font-size: 16px; }
.overview-copy>p+p { margin-top: 16px; }
.overview-note { display: flex; gap: 12px; border-top: 1px solid var(--line); margin-top: 24px; padding-top: 20px; font-size: 12px; color: #b5c9e2; }
.overview-note>span:first-child { font-size: 22px; color: var(--cyan); }
.capabilities-section { background: radial-gradient(ellipse at 50% 0,#16335455,transparent 65%),#0b1425; border-block: 1px solid #19283e; }
.section-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 30px; margin-bottom: 36px; }
.section-heading>p { font-size: 13px; color: var(--muted); line-height: 1.9; text-align: right; }
.section-heading .eyebrow { margin-bottom: 15px; }
.capability-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.capability-card { position: relative; padding: 30px; background: linear-gradient(135deg,#132138,#0e192c); border: 1px solid #2b3b54; border-radius: var(--radius); transition: border-color .25s,transform .25s,box-shadow .25s; }
.capability-card:hover { border-color: #4b7f95; transform: translateY(-4px); box-shadow: 0 16px 40px #0003; }
.featured-card { border-color: #36696e; background: linear-gradient(135deg,#12303b,#102238 65%); }
.card-top { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.card-number { font: 10px/1.8 Consolas,monospace; letter-spacing: 1.5px; color: #9cb1d0; }
.status-pill { font-size: 10px; padding: 2px 9px; background: #1a4147; border: 1px solid #36656a; border-radius: 20px; color: #7fe8d7; white-space: nowrap; }
.status-pill.muted { background: #1b2940; border-color: #33445e; color: #a9bad2; }
.feature-icon { font-size: 26px; font-weight: 500; line-height: 1; width: 45px; height: 45px; display: flex; align-items: center; justify-content: center; border: 1px solid #365264; border-radius: 12px; color: var(--cyan); background: #213f4b55; margin: 27px 0 17px; box-shadow: inset 0 1px 0 #ffffff08; }
.capability-card:nth-child(2) .feature-icon,.capability-card:nth-child(4) .feature-icon { color: #8aafff; background: #263f6a44; border-color: #354e75; }
.capability-card h3 { font-size: 24px; line-height: 1.5; }
.card-punch { margin-top: 6px; color: #c1d2ea; font-size: 15px; }
.capability-card ul { list-style: none; margin: 19px 0 24px; padding: 0; color: var(--muted); font-size: 13px; line-height: 2.2; }
.capability-card li { position: relative; padding-left: 14px; }
.capability-card li:before { content: ""; width: 4px; height: 4px; position: absolute; left: 0; top: 13px; background: #6099ab; border-radius: 50%; }
.card-foot { font-size: 11px; border-top: 1px solid #2a3c50; padding-top: 17px; color: #a5b9ce; }
.audience-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 28px; }
.audience-card { padding: 26px 0 6px; border-top: 1px solid #36516e; }
.audience-index { font: 12px/1.8 Consolas,monospace; color: var(--cyan); letter-spacing: 2px; }
.audience-card h3 { font-size: 23px; margin: 13px 0; }
.audience-card p { font-size: 13px; color: var(--muted); }
.audience-card .audience-subtitle { font-weight: 500; color: #d0ddf0; margin-bottom: 13px; min-height: 48px; }
.audience-outcome { display: block; margin-top: 25px; font-size: 12px; color: var(--cyan); }
.comparison-section { background: #0d182a; border-block: 1px solid #1c2c42; }
.section-description { font-size: 14px; color: var(--muted); margin-top: 21px; }
.small-note { font-size: 11px; color: #9aaec8; margin-top: 20px; }
.comparison-table-wrap { min-width: 0; border: 1px solid #30445f; border-radius: var(--radius); overflow: hidden; background: #101e32; }
table { width: 100%; border-collapse: collapse; text-align: left; font-size: 13px; }
th,td { padding: 17px 20px; border-bottom: 1px solid #283950; }
thead th { background: #182c45; color: #c6dcf7; font-weight: 600; font-size: 12px; }
tbody th { font-weight: 500; width: 92px; white-space: nowrap; }
tbody td { color: var(--muted); }
tbody tr:last-child th,tbody tr:last-child td { border-bottom: 0; }
.contact-section { background: radial-gradient(ellipse at 15% 30%,#16445470,transparent 60%),radial-gradient(ellipse at 90% 90%,#253f7755,transparent 55%),#0b1729; }
.contact-grid { display: grid; grid-template-columns: 1.1fr .8fr; gap: 100px; align-items: center; }
.contact-section h2 { font-size: 40px; }
.contact-section p { color: #aec4dc; font-size: 14px; margin-top: 22px; }
.contact-tags { display: flex; gap: 12px; margin-top: 26px; font-size: 11px; }
.contact-tags span { border: 1px solid #3d5a71; background: #152d3e; border-radius: 20px; padding: 3px 12px; color: #c3dfeb; }
.contact-card { padding: 27px; background: linear-gradient(145deg,#1a2d44,#111f33); border: 1px solid #3a546b; border-radius: var(--radius); text-align: center; box-shadow: 0 20px 60px #0003; }
.contact-card h3 { font-size: 20px; }
.contact-card>p { color: var(--muted); font-size: 12px; margin-top: 10px; }
.contact-placeholder { display: flex; align-items: center; flex-direction: column; justify-content: center; gap: 8px; min-height: 170px; padding: 22px; background: #0b192a; border: 1px dashed #3a526e; border-radius: 12px; margin: 22px 0; }
.contact-mark { color: var(--cyan); font-size: 30px; line-height: 1.5; text-shadow: 0 0 25px #59ead44a; }
.contact-placeholder strong { font-size: 13px; font-weight: 500; }
.contact-placeholder>span:last-child { color: var(--muted); font-size: 11px; }
.contact-qr { display: block; margin: 22px auto; background: white; border: 8px solid white; border-radius: 8px; }
.wechat-contact { display: flex; justify-content: center; align-items: center; gap: 12px; flex-wrap: wrap; font-size: 12px; overflow-wrap: anywhere; }
.copy-button { border: 1px solid #45687a; border-radius: 5px; background: #1c3945; color: var(--cyan); padding: 3px 9px; cursor: pointer; font-size: 12px; }
.contact-card .contact-fineprint { font-size: 10px; color: #a5b7cc; line-height: 1.8; margin-top: 15px; }
.contact-card .copy-feedback { margin: 6px 0; font-size: 11px; min-height: 18px; }
.faq-list { border-top: 1px solid var(--line); }
details { border-bottom: 1px solid var(--line); padding: 19px 0; }
summary { cursor: pointer; font-weight: 500; font-size: 14px; list-style: none; position: relative; padding-right: 28px; }
summary::-webkit-details-marker { display: none; }
summary:after { content: "+"; position: absolute; right: 0; font-size: 19px; top: -4px; color: var(--cyan); }
details[open] summary:after { content: "−"; }
details p { font-size: 13px; color: var(--muted); margin-top: 15px; }
.site-footer { border-top: 1px solid var(--line); background: #070d18; padding: 32px 0; }
.footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 25px; }
.site-footer strong { font-size: 16px; }
.site-footer p { font-size: 10px; color: #9aadc7; }
.footer-links { display: flex; gap: 25px; font-size: 11px; color: #a8bbd6; }
.footer-links a:hover { color: var(--cyan); }
.footer-meta { white-space: nowrap; }
@media(min-width:1600px) { .hero { padding: 100px 0 94px; } }
@media(max-width:1000px) {
  .hero-grid { gap: 30px; } .container { padding: 0 28px; } .hero h1 { font-size: 50px; }
  .hero-visual { padding: 22px 18px 18px; } .visual-heading { font-size: 11px; }
  .signal-grid>div { padding: 0 9px; } .signal-grid strong { font-size: 11px; }
  .overview-grid,.comparison-grid,.faq-grid { gap: 45px; } .contact-grid { gap: 55px; } .footer-inner { flex-wrap: wrap; }
}
@media(max-width:760px) {
  .header-actions { margin-left: auto; }
  .theme-toggle { min-height: 40px; }
  html { scroll-padding-top: 120px; } .container { padding: 0 22px; }
  .header-inner { height: auto; min-height: 82px; flex-wrap: wrap; gap: 8px 18px; padding-top: 13px; padding-bottom: 13px; }
  .brand img { width: 184px; height: auto; }
  .main-nav { gap: 18px; height: 38px; margin-left: auto; font-size: 12px; } .nav-current:after { bottom: 0; }
  .nav-badge { font-size: 9px; padding: 1px 4px; } .header-cta { display: none; }
  .hero { padding: 45px 0; } .hero-grid,.overview-grid,.comparison-grid,.contact-grid,.faq-grid { grid-template-columns: 1fr; gap: 32px; }
  .hero h1 { font-size: 46px; } .hero-lead { font-size: 18px; } .hero-description { font-size: 12px; }
  .hero-actions { gap: 17px; } .button { font-size: 13px; padding: 11px 17px; } .button-text { padding: 0; }
  .hero-visual { max-width: 520px; width: 100%; margin: auto; padding: 21px 18px 17px; }
  .visual-heading { font-size: 12px; } .trend-heading h2 { font-size: 22px; } .insight-dimensions { margin: 18px 0; }
  .signal-grid strong { font-size: 12px; } .visual-bottom { flex-wrap: wrap; gap: 5px 12px; }
  .value-strip-inner { display: block; padding-top: 20px; padding-bottom: 20px; }
  .value-strip p { font-size: 14px; } .value-strip-inner>span { display: block; font-size: 10px; margin-top: 9px; } .value-strip i { margin: 0 12px; }
  .section { padding: 55px 0; } h2 { font-size: 27px; } .eyebrow { font-size: 10px; margin-bottom: 17px; }
  .section-heading { display: block; margin-bottom: 27px; } .section-heading>p { text-align: left; margin-top: 14px; font-size: 12px; }
  .capability-grid { grid-template-columns: 1fr; gap: 16px; } .capability-card { padding: 24px; }
  .audience-grid { grid-template-columns: 1fr; gap: 25px; } .audience-card .audience-subtitle { min-height: 0; } .audience-outcome { margin-top: 15px; }
  .contact-section h2 { font-size: 32px; } .contact-card { max-width: 440px; width: 100%; margin: auto; }
  .footer-inner { display: block; } .footer-links { margin: 20px 0; } .comparison-grid { gap: 26px; }
  th,td { padding: 14px; font-size: 12px; } .overview-copy { font-size: 14px; } .faq-grid { gap: 24px; }
}
@media(max-width:360px) {
  .container { padding-inline: 18px; } .hero h1 { font-size: 41px; }
  .card-number { font-size: 9px; letter-spacing: .6px; } .signal-grid strong { font-size: 10px; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; } *,*::before,*::after { transition: none!important; animation: none!important; }
  .trend-line { stroke-dashoffset: 0; }
}
@media print {
  :root { color-scheme: light; --ink: #142f32; --muted: #42525b; --cyan: #165c66; --line: #ccc; }
  body,.section,.hero,.site-footer,.value-strip { background: white; color: var(--ink); }
  .site-header { position: static; background: white; } .header-cta,.hero-actions,.copy-button { display: none; }
  .hero,.section { padding: 24px 0; } .container { padding: 0 15px; }
  .capability-card,.audience-card,details { break-inside: avoid; }
  .capability-card,.contact-card,.comparison-table-wrap { background: white; box-shadow: none; }
  .hero-visual { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .trend-line { animation: none; stroke-dashoffset: 0; }
}