/* v8 实时 3D 首屏（v7 冻结在 hero3d-v7.css） + 首页色彩节奏（只在 body.h3d-page 生效） */
.h3d-page{--navy:#081131;--navy2:#0C1A47;--cobalt:#1C3C97;--cream:#F6EEDF;--cream-m:rgba(246,238,223,.72);--cream-l:rgba(246,238,223,.5);
  --persimmon:#FF7A45;--band-cream:#F7F1E7;--band-blue:#EDF1FB;--accent:#1C3C97}

/* 页头：和首屏连成一片深蓝 */
.h3d-page .top{background:var(--navy);border-bottom:1px solid rgba(246,238,223,.07)}
.h3d-page .mark{color:var(--cream)}
.h3d-page .nav a,.h3d-page .fontbtn{color:var(--cream-m)}
.h3d-page .nav a:hover{color:var(--cream)}

/* ---------- 首屏 ---------- */
.h3d{position:relative;overflow:hidden;color:var(--cream);background:radial-gradient(70% 45% at 50% 42%,#173280 0%,rgba(23,50,128,0) 70%),linear-gradient(180deg,var(--navy) 0%,var(--navy2) 100%);
  height:calc(100svh - 60px);min-height:700px;max-height:960px}
.h3-stage{position:absolute;inset:0}
.h3-canvas,.h3-poster,.h3-poster img{position:absolute;inset:0;width:100%;height:100%;display:block}
.h3-poster img{object-fit:cover;object-position:50% 0}
.h3-canvas{opacity:0}
html.h3-full .h3-poster{visibility:hidden}  /* v19 R02：海报一直显示，直到 3D 画布完全淡入 */
html.h3-live .h3-canvas{opacity:1}
html:not(.js3d) .h3-canvas{display:none}
.h3-scrim{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(8,17,49,.5) 0%,rgba(8,17,49,0) 20%,rgba(8,17,49,0) 54%,rgba(8,17,49,.6) 66%,rgba(8,17,49,.9) 80%,rgba(8,17,49,.96) 100%)}
.h3-copy{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;padding:16px 22px 18px;pointer-events:none}
.h3-copy>*,.h3-copy h1>*{pointer-events:auto}
.h3d .eyebrow{margin:0;font-size:.72rem;letter-spacing:.14em;color:var(--cream-m);font-weight:500;display:flex;align-items:center;gap:9px}
.h3d .eyebrow::before{content:"";width:7px;height:7px;border-radius:2px;background:var(--persimmon);flex:none}
.h3d h1{flex:1;display:flex;flex-direction:column;margin:0;color:var(--cream);font-weight:700;letter-spacing:0}
.h3-big{display:block;margin-top:10px;font-size:clamp(4rem,23vw,6.2rem);line-height:1;font-weight:800;letter-spacing:-.02em;
  font-feature-settings:"palt" 1;text-shadow:0 2px 24px rgba(8,17,49,.3)}
.h3-big>span{display:inline-block;overflow:hidden;vertical-align:top;padding:.02em .015em .08em;margin-bottom:-.08em}
.h3-big i{display:inline-block;font-style:normal;will-change:transform,opacity}
.h3-sub{display:block;margin-top:auto;font-size:1.06rem;line-height:1.4;font-weight:500;letter-spacing:.04em;color:var(--cream)}
.h3-low{display:flex;flex-direction:column;gap:14px;margin-top:12px}
.h3-alt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* v19 R02：首屏文字、码卡、信任条默认可见，不等 3D（原来的「开场前隐藏」已删除） */
/* v19 R11：暂停 / 播放 3D 动画（只在 3D 真正在画时出现） */
.h3-pause{display:none;position:absolute;z-index:3;top:10px;right:12px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(246,238,223,.18);
  background:rgba(8,17,49,.42);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--cream);cursor:pointer;padding:0;align-items:center;justify-content:center}
html.h3-live .h3-pause{display:flex}
.h3-pause:focus-visible{outline:2px solid var(--persimmon);outline-offset:2px}
.h3-pause svg{width:16px;height:16px;fill:currentColor}
.h3-pause .i-play{display:none}
.h3-pause[aria-pressed="true"] .i-play{display:block}.h3-pause[aria-pressed="true"] .i-pause{display:none}
.h3-pause .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (min-width:900px){.h3-pause{top:auto;bottom:22px;right:28px}}

/* 运费折扣券卡片：深色玻璃 */
.h3d .hcode{background:linear-gradient(180deg,rgba(18,32,84,.62),rgba(9,18,54,.62));-webkit-backdrop-filter:blur(18px) saturate(1.25);backdrop-filter:blur(18px) saturate(1.25);
  border:1px solid rgba(246,238,223,.12);border-radius:14px;padding:13px 12px 14px 16px;box-shadow:inset 0 1px 0 rgba(246,238,223,.08),0 20px 44px rgba(3,8,26,.38)}
.h3d .hcode .lbl{display:flex;justify-content:space-between;align-items:baseline;color:var(--cream-l);font-size:.68rem;letter-spacing:.16em;margin:0 4px 0 0}
.h3d .hcode .lbl .off{color:var(--persimmon);letter-spacing:.06em;font-weight:600}
.h3d .hcode .row{margin-top:2px}
.h3d .hcode .val{color:var(--cream);font-size:1.9rem;letter-spacing:.2em;font-weight:600}
.h3d .hcode .btn{background:var(--persimmon);border-color:var(--persimmon);color:#160B05;border-radius:10px;min-height:46px;padding:0 22px;font-weight:700;box-shadow:0 6px 18px rgba(255,122,69,.28)}
.h3d .hcode .btn.ok{background:var(--cream);border-color:var(--cream);color:var(--navy)}
.h3d .hcode .how{color:var(--cream-m);font-size:.78rem;margin:10px 0 0;padding-top:10px;border-top:1px solid rgba(246,238,223,.08);line-height:1.55}
.h3d .trust{display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.h3d .trust li{display:flex;flex-direction:column;align-items:flex-start;gap:2px;font-size:.66rem;line-height:1.4;color:var(--cream-l);padding:0 0 0 12px;border-left:1px solid rgba(246,238,223,.12);min-width:0}
.h3d .trust li:first-child{padding-left:0;border-left:0}
.h3d .trust li b{color:var(--cream);font-weight:600;font-size:.72rem;white-space:nowrap}
.h3d .trust li span{white-space:nowrap}
.h3d .trust .ic{color:var(--persimmon);width:18px;height:18px;margin-bottom:4px}

@media (min-width:900px){
  .h3d-page .top .wrap{max-width:1240px;padding:0 56px}
  .h3d{height:calc(100vh - 68px);min-height:640px;max-height:900px}
  .h3-poster img{object-position:100% 50%}
  .h3-scrim{background:linear-gradient(90deg,rgba(8,17,49,.78) 0%,rgba(8,17,49,.5) 30%,rgba(8,17,49,0) 52%)}
  .h3-copy{max-width:1240px;margin:0 auto;padding:0 56px;justify-content:center}
  .h3d .eyebrow{font-size:.74rem}
  .h3d h1{flex:none}
  .h3-big{font-size:8rem;margin-top:16px;line-height:1}
  .h3-sub{margin-top:20px;font-size:1.5rem;letter-spacing:.05em}
  .h3-low{width:470px;gap:22px;margin-top:34px}
  .h3d .hcode{padding:16px 18px 16px 20px}
  .h3d .hcode .val{font-size:2.3rem}
  .h3d .hcode .how{font-size:.82rem}
  .h3d .trust li{font-size:.72rem;padding:0 0 0 18px}
  .h3d .trust li b{font-size:.8rem}
  .h3d .trust .ic{width:22px;height:22px;margin-bottom:6px}
}

/* ---------- 首屏以下：色彩节奏 ---------- */
.h3d-page main{position:relative;z-index:0;overflow-x:clip}
.h3d-page .band{position:relative;padding-bottom:44px}
.h3d-page .band::before{content:"";position:absolute;z-index:-1;top:0;bottom:0;left:calc(50% - 50vw);right:calc(50% - 50vw);background:var(--bandc)}
.h3d-page #why{--bandc:var(--band-cream)}
.h3d-page #fee{--bandc:var(--band-blue)}
.h3d-page #qa{--bandc:var(--band-cream)}
.h3d-page main .wrap>.toc:first-child{margin-top:0;padding:18px 0 4px}
.h3d-page .toc a{font-size:.8rem;line-height:1;padding:9px 13px;border-radius:999px;background:var(--band-blue);color:var(--cobalt);margin:4px 0}
.h3d-page .toc a:hover{text-decoration:none;background:#DFE6F8}
.h3d-page section>h2{font-size:1.45rem;font-weight:700;letter-spacing:-.01em}
.h3d-page section>h2::before{content:"";display:block;width:28px;height:3px;border-radius:2px;background:var(--persimmon);margin-bottom:14px}
/* 为什么选：彩色大数字 */
.h3d-page ol.why>li{border-top-color:rgba(28,60,151,.12)}
.h3d-page ol.why h3{font-size:1.3rem;gap:12px;align-items:center}
.h3d-page ol.why h3 .n{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:11px;background:var(--cobalt);color:var(--cream);font-size:1rem;font-weight:700;min-width:0}
.h3d-page ol.why>li.ours{border-top:0;margin-top:10px;padding:22px 20px;border-radius:18px;background:var(--navy);color:var(--cream)}
.h3d-page ol.why>li.ours h3,.h3d-page ol.why>li.ours p{color:var(--cream)}
.h3d-page ol.why>li.ours .n{background:var(--persimmon);color:#160B05}
.h3d-page ol.why>li.ours .kicker{color:var(--persimmon)}
.h3d-page ol.why>li.ours .src{color:var(--cream-l)}
.h3d-page ol.why>li.ours .more{color:#FFB08A}
.h3d-page ol.why>li.ours .code.slim{border-color:rgba(246,238,223,.16)}
.h3d-page ol.why>li.ours .code .val{color:var(--cream)}
.h3d-page .btn{background:var(--persimmon);border-color:var(--persimmon);color:#160B05}
.h3d-page .btn.ok{background:var(--navy);border-color:var(--navy);color:var(--cream)}
.h3d-page .track i.us,.h3d-page .track i.lo{background:var(--cobalt)}
.h3d-page .track{background:rgba(28,60,151,.1)}
/* 步骤：圆形编号 + 竖线 */
.h3d-page ol.steps.guide>li{grid-template-columns:44px 1fr;border-top:0;padding:18px 0;position:relative}
.h3d-page ol.steps.guide>li:last-child{border-bottom:0}
.h3d-page ol.steps.guide>li::before{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--band-blue);color:var(--cobalt);font-size:.92rem;font-weight:700;line-height:1;position:relative;z-index:1}
.h3d-page ol.steps.guide>li::after{content:"";position:absolute;left:15.5px;top:56px;bottom:-14px;width:1px;background:rgba(28,60,151,.16)}
.h3d-page ol.steps.guide>li:last-child::after{display:none}
.h3d-page ol.steps.guide>li.key{border-top:0;background:var(--band-cream);border-radius:18px;margin:8px -14px;padding:20px 14px}
.h3d-page ol.steps.guide>li.key::before{background:var(--persimmon);color:#160B05;font-size:.92rem}
.h3d-page ol.steps.guide>li.key::after{left:29.5px}
.h3d-page ol.steps.guide>li.key h3{color:var(--ink)}
.h3d-page .note{border-left-color:var(--persimmon)}
/* 运费、坑、问答 */
.h3d-page #fee .diagram{color:var(--cobalt)}
.h3d-page ul.pits{display:grid;gap:10px}
.h3d-page ul.pits li{border:0;background:#fff;border-radius:14px;padding:14px 16px;box-shadow:inset 0 0 0 1px rgba(28,60,151,.12)}
.h3d-page ul.pits li:last-child{border:0}
.h3d-page ul.pits b{color:var(--cobalt)}
.h3d-page .faq details{border-top-color:rgba(28,60,151,.14)}
.h3d-page .more{color:var(--cobalt)}
.h3d-page a{color:var(--cobalt)}
body.h3d-page{padding-bottom:0}
.h3d-page footer{background:var(--navy);color:var(--cream-l);border-top:0;margin-top:0;padding-top:30px;padding-bottom:120px}
.h3d-page footer a{color:var(--cream-m)}
.h3d-page footer .fine{border-top-color:rgba(246,238,223,.1);color:var(--cream-l)}
.h3d-page .dock{background:rgba(8,17,49,.96);border-top-color:rgba(246,238,223,.1)}
.h3d-page .dock .t{color:var(--cream-l)}.h3d-page .dock .t b{color:var(--cream)}
