/* ADR-3392 首页精修:只由首页加载,叠在 site.css 与 brand-sections.css 之上(段落级组件已移到 brand-sections.css,ADR-7513)。字号阶梯与模块节奏、首屏与演示带(含 X 段窗口框)、信任带与收尾带、轻动效。
   动效只在 home.js 运行时生效(.reveal 由脚本加),无脚本与爬虫看到完整页面;全部尊重 prefers-reduced-motion。 */
:root{--home-display:clamp(46px,6.4vw,88px)}
:root:lang(zh-CN),:root:lang(zh-TW),:root:lang(ja),:root:lang(ko){--home-display:clamp(42px,5.8vw,76px)}

/* 吸顶、磨砂与滚动底线已移到共享 core/web-header.css(ADR-3393);首页只多一个:滚过首屏按钮后出现与首屏同一主按钮的小号版本(home.js 复制,≤1100px 不出现)。 */
.topbar-cta{display:none;min-height:38px;padding:6px 16px;font-size:14px}
/* 只在按钮出现时多开一列;隐藏时保持 web-header.css 原有列,空列的间距也会挤字标。
   ≤1100px 不出现:导航仍是整行时,按钮会把字标挤没(es 约 1020px 才放得下)。 */
@media(min-width:1101px){
  .show-topbar-cta .topbar.wt-header{grid-template-columns:minmax(0,1fr) auto auto auto auto;gap:12px}
  .show-topbar-cta .topbar-cta{display:inline-flex;grid-column:3;grid-row:1}
  .show-topbar-cta .topbar.wt-header :is(.account-pill,.wt-account-slot){grid-column:5;grid-row:1} /* ADR-2710: the account now sits in the bell's slot */
  /* ADR-2710: with the message bell the extra column would squeeze the wordmark again (es/de at 1101px); while the
     button shows, the account entry keeps only its icon/avatar, as the header does at 761–1000px (name kept for screen readers). */
  .show-topbar-cta .topbar.wt-header .account-pill{min-width:44px;padding:6px;justify-content:center}
  .show-topbar-cta .topbar.wt-header .account-pill :is(.account-when-out,.account-when-in){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
}

/* 首屏:徽章一句、display 标题放大、说明段落全文保留只改排版(站点名与「本地视频文件」加深)。 */
.hero{padding-block:40px 0}
.hero-copy h1{font-size:var(--home-display);line-height:1.04;letter-spacing:-.015em;margin-bottom:20px}
.hero-copy h1 .cap{padding:.04em .22em .1em;margin-top:.06em}
.hero-lead{font-size:20px;font-weight:600;margin-bottom:16px}
.hero-sub{max-width:640px;font-size:16.5px;line-height:1.75;text-wrap:pretty}
.hero-sub>span[data-text="YouTube、X、Bilibili 等网站"],.hero-sub>span[data-text="本地视频文件"]{color:var(--text);font-weight:600}
.hero .actions{margin-top:28px}.hero .actions .button{min-height:52px;padding:10px 26px;font-size:16px}
.hero-more{margin-top:14px;font-size:14px}
/* 桌面按钮区收紧(Owner 2026-11-02 方案一):首屏少占约 48px,演示视频上移;手机间距与 44px 点击区不变。 */
@media(min-width:721px){.hero .actions{margin-top:20px}.hero .actions .button{min-height:48px}.hero-more{margin-top:6px}}
@media(min-width:721px) and (pointer:fine) and (not (any-pointer:coarse)){.hero-more a{min-height:28px}}
@media(max-width:720px){.hero{padding-block:32px 0}.hero-lead{font-size:18px}.hero-sub{font-size:15.5px}}

/* 演示带:放宽到正文同宽 1120px;阴影挪到 .stage-frame(它裁圆角)。 */
.stage{--band:260px;margin-top:36px;padding-bottom:var(--home-section)}
@media(min-width:721px){.stage{margin-top:24px}}
.stage-figure,.stage .hero-points{max-width:1120px}
.stage-frame{overflow:hidden;border-radius:22px;box-shadow:0 40px 90px #060B1259,0 0 0 1px #FFFFFF14}
.stage-shot{border-radius:0;box-shadow:none}
.stage-figure figcaption{font-size:13.5px;margin-top:18px}
.stage-tags,.stage-pause{z-index:2}
/* X 段(ADR-0563 D4 素材是居中 66% 的小窗、四周模糊):home.js 在 9.05–13.75 s 给 .stage-frame 加 .is-x,
   画面与重画字幕一起放大 1.2 倍,外圈换成深色底 + 浏览器窗口框(装饰)。 */
.stage-zoom{transform-origin:50% 50%}
.stage-frame.is-x .stage-zoom{transform:scale(1.2)}
.x-window{display:none;position:absolute;inset:0;z-index:1;pointer-events:none}
.stage-frame.is-x .x-window{display:block}
.x-hole{position:absolute;left:10.39%;top:10.37%;width:79.22%;height:79.27%;border-radius:0 0 10px 10px;box-shadow:0 0 0 100vmax #121A22,0 0 0 1px #FFFFFF1F}
.x-bar{position:absolute;z-index:1;left:10.39%;width:79.22%;top:calc(10.37% - 30px);height:30px;display:flex;align-items:center;gap:6px;padding:0 12px;border-radius:10px 10px 0 0;background:#24303C;box-shadow:0 0 0 1px #FFFFFF1F}
.x-bar i{width:9px;height:9px;border-radius:50%;background:#FFFFFF33}
.x-bar span{margin-inline:auto;padding:2px 14px;border-radius:999px;background:#FFFFFF14;color:#C7D0D9;font:500 11.5px/1.4 -apple-system,BlinkMacSystemFont,sans-serif;transform:translateX(-14px)}
/* 卖点:图标 + 衬线小标题。 */
.stage .hero-points{margin-top:56px;padding-top:40px;gap:28px 40px}
.stage .hero-points li{grid-template-columns:1fr;gap:10px}
.stage .hero-points li::before{display:none}
.stage .hero-points strong{font-family:var(--serif);font-size:19px;font-weight:600;line-height:1.35}
.stage .hero-points span:not(.point-icon){font-size:14.5px;line-height:1.6}
@media(max-width:720px){.stage{--band:120px;margin-top:32px}.stage-frame{border-radius:12px}.stage .hero-points{margin-top:36px;padding-top:28px;gap:26px}
  .x-bar{height:18px;top:calc(10.37% - 18px);padding:0 8px;gap:4px}.x-bar i{display:none}.x-bar span{font-size:9px;padding:0 8px;transform:none}
  .stage-frame.is-x .stage-tags{top:calc(10.37% + 6px);left:calc(10.39% + 6px)}.stage-frame.is-x .stage-pause{top:calc(10.37% + 6px);right:calc(10.39% + 6px)}}


/* 三种用法:卡片悬停上浮;手机上只让本设备最完整的那张实心,其余描边(与首屏一主一描边一致)。 */
[data-device] .offer-cards .button.primary{background:transparent;border-color:var(--wt-ghost-line);box-shadow:inset 0 0 0 .5px var(--wt-ghost-line);color:var(--text)}
[data-device] .offer-cards .button.primary:active{background:var(--wt-ghost-active)}
[data-device] .offer-cards .offer-app .button.primary{background:var(--cta);border-color:transparent;box-shadow:none;color:var(--cta-ink)}
[data-device] .offer-cards .offer-app .button.primary:active{background:var(--cta-active)}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.offer{transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s,border-color .25s}.offer:hover{transform:translateY(-4px);box-shadow:0 2px 4px #0C14200A,0 24px 48px #0C14201F;border-color:transparent}}

/* 流程对比与对比表放大一档。 */
.flow-row{padding:28px 32px;border-radius:20px}.flow-ours h3{font-size:20px}.flow-track{height:36px}
.compare-table{font-size:15.5px}.compare-table th,.compare-table td{padding:20px 28px}.compare-table thead th:last-child{font-size:20px}.compare-table tbody th{font-size:14px}
@media(max-width:820px){.flow-row{padding:18px 16px}.compare-table th,.compare-table td{padding:14px 16px}}
@media(max-width:600px){.flow-row{padding:16px 18px}.compare-table th,.compare-table td{padding:0}}


/* 页尾链接:去掉「 · 」分隔(容器字号 0,子元素恢复),两行整齐的链接目录。 */
.guide-links{display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:baseline;gap:6px 20px;padding-block:20px;font-size:0;line-height:1.6;border-top:1px solid var(--line)}
.guide-links:not(.guide-links-need){margin-top:96px;padding-top:40px}
.guide-links-need{border-top:0;padding-top:0}
.guide-links>*{font-size:14px}
.guide-links a{color:var(--muted);text-decoration:none}.guide-links a:hover{color:var(--text);text-decoration:underline;text-underline-offset:4px}
.guide-links-label,.guide-links a[data-text="开始使用"]{flex:0 0 auto;font-size:13px;font-weight:650;color:var(--text)}
@media(max-width:720px){.guide-links{gap:6px 16px}.guide-links:not(.guide-links-need){margin-top:56px}.guide-links-label{flex-basis:100%}}

/* 手机底部吸附主按钮:滚过演示带后出现,收尾带进入视口时收起(home.js 切 .show-sticky-cta)。 */
.sticky-cta{display:none}
@media(max-width:720px){.sticky-cta{position:fixed;z-index:60;inset:auto calc(16px + env(safe-area-inset-right,0px)) calc(12px + env(safe-area-inset-bottom,0px)) calc(16px + env(safe-area-inset-left,0px));display:flex;visibility:hidden;transform:translateY(140%)}
  .sticky-cta .button{flex:1;box-shadow:0 10px 30px #0C142040}
  .show-sticky-cta .sticky-cta{visibility:visible;transform:none}}
@media(max-width:720px) and (prefers-reduced-motion:no-preference){.sticky-cta{transition:transform .3s cubic-bezier(.2,.7,.2,1),visibility .3s}}

/* 进入视口:时间条依次走完一次、模块淡入。 */
@media(prefers-reduced-motion:no-preference){
  .reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease-out,transform .6s cubic-bezier(.2,.7,.2,1)}
  .reveal.in-view{opacity:1;transform:none}
  .flow-compare.reveal .flow-track>i{transform:scaleX(0);transform-origin:left center;transition:transform .5s cubic-bezier(.3,.7,.3,1)}
  [dir=rtl] .flow-compare.reveal .flow-track>i{transform-origin:right center}
  .flow-compare.in-view .flow-track>i{transform:none}
  .flow-compare.in-view .flow-row:not(.flow-ours) .flow-track>i:nth-child(2){transition-delay:.25s}
  .flow-compare.in-view .flow-row:not(.flow-ours) .flow-track>i:nth-child(3){transition-delay:.5s;transition-duration:2.2s}
  .flow-compare.in-view .flow-row:not(.flow-ours) .flow-track>i:nth-child(4){transition-delay:2.7s}
  .flow-compare.in-view .flow-row:not(.flow-ours) .flow-track>i:nth-child(5){transition-delay:2.95s}
  .flow-compare.in-view .flow-row:not(.flow-ours) .flow-track>i:nth-child(6){transition-delay:3.2s}
  .flow-compare.in-view .flow-ours .flow-track>i:nth-child(2){transition-delay:.2s}
  .flow-compare.in-view .flow-ours .flow-track>i:nth-child(3){transition-delay:.4s;transition-duration:.25s}
  .flow-compare.in-view .flow-ours .flow-track>i:nth-child(4){transition-delay:.6s;transition-duration:1.4s}
}