/* ============================================================
   观时 Orbit · 月光星轨系皮肤
   在 orbit.css 之后加载；只覆盖视觉，不改版式与文案。
   夜空色由品牌深空蓝向暗推导，不引入新色相。
   ============================================================ */
:root{
  --st-night-0:#070B22;--st-night-1:#121A40;--st-night-2:#252C66;--st-night-3:#343A7E;
}

/* ---- 页面底：月光白透出薄雾紫 ---- */
body{background:radial-gradient(900px 480px at 88% -90px, rgba(201,137,255,.13), transparent 62%),radial-gradient(720px 440px at -12% 32%, rgba(107,94,215,.09), transparent 60%),#F5F4FB}

/* ---- 导航：星轨渐变线 + 激活态渐变下划线 ---- */
.site-header::after{content:"";display:block;height:2px;background:linear-gradient(90deg,transparent,rgba(107,94,215,.45),rgba(230,199,143,.65),rgba(201,137,255,.45),transparent)}
.nav>a.active::after{background:linear-gradient(90deg,var(--purple),var(--mist))}
.brand-en{color:var(--purple)}

/* ---- 按钮：主按钮金色流光 ---- */
.primary-btn{position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s}
.primary-btn:hover{transform:translateY(-1px);box-shadow:0 16px 34px rgba(107,94,215,.46)}
.primary-btn::after{content:"";position:absolute;top:0;left:-70%;width:42%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-20deg);transition:left .55s ease}
.primary-btn:hover::after{left:125%}
.ghost-btn{transition:border-color .18s,box-shadow .18s}
.ghost-btn:hover{border-color:rgba(107,94,215,.5);box-shadow:0 8px 20px rgba(107,94,215,.14)}
.cosmos .ghost-btn{backdrop-filter:blur(4px)}
.cosmos .ghost-btn:hover{border-color:rgba(230,199,143,.6);box-shadow:0 8px 20px rgba(0,0,0,.25)}

/* ---- 宇宙层：星空 / 流星 / 月亮 / 行星轨道 / 山影 ---- */
.cosmos{position:relative;overflow:hidden;color:#fff;background:linear-gradient(180deg,var(--st-night-0) 0%,var(--st-night-1) 42%,var(--st-night-2) 76%,var(--st-night-3) 100%);box-shadow:0 26px 64px rgba(18,26,61,.34)}
.hero.cosmos::after{display:none}
.page-hero.cosmos{border:0;padding:0}
.cosmos-layers{position:absolute;inset:-16px;z-index:1;will-change:transform}
.cosmos-nebula{position:absolute;inset:0;background:radial-gradient(560px 360px at 76% 16%, rgba(201,137,255,.20), transparent 62%),radial-gradient(500px 320px at 10% 80%, rgba(107,94,215,.20), transparent 60%),radial-gradient(400px 280px at 32% 10%, rgba(255,199,217,.10), transparent 65%);animation:st-nebula 28s ease-in-out infinite alternate}
.cosmos-stars{position:absolute;inset:0}
.cosmos-stars span{position:absolute;border-radius:50%;animation:st-twinkle var(--tw-d,3s) ease-in-out var(--tw-delay,0s) infinite}
.cosmos-meteors{position:absolute;inset:0}
.cosmos-meteors i{position:absolute;width:var(--m-len,120px);height:2px;border-radius:2px;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.92));opacity:0;transform:rotate(-32deg);animation:st-meteor var(--m-dur,9s) linear var(--m-delay,0s) infinite}
.cosmos-meteors i::before{content:"";position:absolute;right:-3px;top:-2.5px;width:7px;height:7px;border-radius:50%;background:#fff;box-shadow:0 0 10px 2px rgba(255,255,255,.85),0 0 22px 6px rgba(201,137,255,.5)}
.cosmos-moonbox{position:absolute;right:9%;top:11%;width:170px;height:170px;z-index:2}
.cosmos-moon{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 34% 30%, #FFFEF8 0%, #F6EDD6 42%, #E3D4AE 72%, #C9B789 100%);box-shadow:inset -16px -14px 36px rgba(122,102,62,.35), 0 0 48px rgba(230,199,143,.5), 0 0 140px rgba(201,137,255,.26);animation:st-moon 9s ease-in-out infinite}
.cosmos-moon::before{content:"";position:absolute;left:24%;top:44%;width:18%;height:18%;border-radius:50%;background:rgba(150,128,84,.26);box-shadow:30px -20px 0 -3px rgba(150,128,84,.22), 10px 30px 0 -5px rgba(150,128,84,.2)}
.cosmos-moon::after{content:"";position:absolute;right:22%;top:26%;width:12%;height:12%;border-radius:50%;background:rgba(150,128,84,.22)}
.cosmos-orbit{position:absolute;left:50%;top:50%;border:1px solid rgba(255,255,255,.16);border-radius:50%;animation:st-spin var(--o-dur,30s) linear infinite}
.cosmos-orbit.o1{width:238px;height:238px;margin:-119px 0 0 -119px;--o-dur:26s}
.cosmos-orbit.o2{width:318px;height:318px;margin:-159px 0 0 -159px;--o-dur:42s;animation-direction:reverse}
.cosmos-orbit i{position:absolute;top:-4px;left:50%;width:8px;height:8px;margin-left:-4px;border-radius:50%;background:var(--mist);box-shadow:0 0 10px 2px rgba(201,137,255,.75)}
.cosmos-orbit.o2 i{width:6px;height:6px;top:-3px;margin-left:-3px;background:var(--gold);box-shadow:0 0 10px 2px rgba(230,199,143,.75)}
.cosmos-mountains{position:absolute;left:0;right:0;bottom:-2px;height:34%;z-index:2;pointer-events:none}
.cosmos-mountains svg{display:block;width:100%;height:100%}
.cosmos-content{position:relative;z-index:3}
.page-hero .cosmos-mountains{height:46%}
.page-hero .cosmos-moonbox{right:7%;top:9%;width:112px;height:112px}
.page-hero .cosmos-orbit.o1{width:166px;height:166px;margin:-83px 0 0 -83px}
.page-hero .cosmos-orbit.o2{width:222px;height:222px;margin:-111px 0 0 -111px}
.page-hero-copy{padding:38px 40px}
.page-hero.cosmos h1{color:#fff;text-shadow:0 0 22px rgba(201,137,255,.35)}
.page-hero.cosmos p{color:#DCDDF4}
.hero.cosmos h1{text-shadow:0 0 26px rgba(201,137,255,.35)}

@keyframes st-twinkle{0%,100%{opacity:var(--tw-min,.25);transform:scale(.75)}50%{opacity:1;transform:scale(1.15)}}
@keyframes st-meteor{0%{opacity:0;transform:rotate(-32deg) translateX(0)}2.5%{opacity:1}16%{opacity:1;transform:rotate(-32deg) translateX(calc(-1 * var(--m-run,420px)))}17.5%,100%{opacity:0;transform:rotate(-32deg) translateX(calc(-1 * var(--m-run,420px)))}}
@keyframes st-nebula{from{transform:translate3d(-14px,-8px,0)}to{transform:translate3d(16px,10px,0)}}
@keyframes st-moon{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@keyframes st-spin{to{transform:rotate(360deg)}}
@keyframes st-rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.rise{animation:st-rise .7s cubic-bezier(.22,.8,.32,1) both}
.rise-1{animation-delay:.06s}.rise-2{animation-delay:.14s}.rise-3{animation-delay:.22s}.rise-4{animation-delay:.3s}

/* ---- 卡片 / 报告行 / 缩略图 / 金句 ---- */
.card{background:rgba(255,255,255,.84);backdrop-filter:blur(8px);transition:transform .24s,border-color .24s,box-shadow .24s}
.card:hover{transform:translateY(-4px);border-color:rgba(107,94,215,.42);box-shadow:0 18px 42px rgba(107,94,215,.16)}
.feature-icon{box-shadow:inset 0 0 0 1px rgba(201,137,255,.35)}
.report-row{background:rgba(255,255,255,.86);transition:transform .22s,border-color .22s,box-shadow .22s}
.report-row:hover{transform:translateY(-2px);border-color:rgba(107,94,215,.45);box-shadow:0 14px 32px rgba(107,94,215,.15)}
.report-thumb{position:relative;overflow:hidden;background:linear-gradient(155deg,#0D1330 0%,#232A63 62%,#3A3E8C 100%)}
.report-thumb::before{content:"";position:absolute;right:10px;top:9px;width:24px;height:24px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#FFFDF2,#EAD9AC 72%,#C9B789);box-shadow:0 0 12px rgba(230,199,143,.75)}
.report-thumb::after{content:"";position:absolute;inset:0;background-image:radial-gradient(1.6px 1.6px at 14% 32%, #fff, transparent 60%),radial-gradient(1.2px 1.2px at 30% 64%, rgba(255,255,255,.9), transparent 60%),radial-gradient(1.4px 1.4px at 46% 22%, rgba(201,137,255,.95), transparent 60%),radial-gradient(1.1px 1.1px at 62% 56%, rgba(255,255,255,.85), transparent 60%),radial-gradient(1.5px 1.5px at 78% 76%, rgba(230,199,143,.9), transparent 60%),radial-gradient(1.2px 1.2px at 8% 74%, rgba(255,255,255,.8), transparent 60%)}
.report-row:nth-child(2n) .report-thumb{background:linear-gradient(155deg,#101638 0%,#2A2E6E 58%,#473D9E 105%)}
.report-row:nth-child(2n) .report-thumb::before{right:auto;left:12px;top:12px;width:20px;height:20px}
.report-row:nth-child(3n) .report-thumb::before{width:18px;height:18px;top:16px}
.quote::before{content:"";display:block;width:56px;height:1px;margin:0 auto 14px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}

/* ---- 响应式（断点与 orbit.css 一致） ---- */
@media(max-width:820px){
  .cosmos-moonbox{right:6%;top:8%;width:120px;height:120px}
  .cosmos-orbit{display:none}
  .page-hero-copy{padding:28px 24px}
}
@media(max-width:520px){
  .cosmos-moonbox{width:88px;height:88px;right:5%;top:6%}
  .page-hero .cosmos-moonbox{width:80px;height:80px}
}

/* ---- 减少动态（无障碍） ---- */
@media (prefers-reduced-motion: reduce){
  .cosmos-nebula,.cosmos-moon,.cosmos-orbit,.cosmos-stars span,.cosmos-meteors i,.rise,.primary-btn::after{animation:none!important;transition:none!important}
  .cosmos-meteors i{display:none}
}