/* ==========================================================================
   theme-2026.css — 两站统一视觉层（国内站 / 国外站共用同一份）
   原则：只使用「背景 / 边框 / 阴影 / 渐变 / 过渡」等视觉属性，
        不改变任何布局尺寸（宽高、内外边距、定位、层级），确保不破坏功能。
   回滚：删除页面里对本文件的 <link> 即可完全还原。
   ========================================================================== */

:root{
  --t26-hair: hsl(var(--primary) / .20);
  --t26-hair-strong: hsl(var(--primary) / .40);
  --t26-glass: hsl(var(--card) / .66);
  --t26-shadow-1: 0 1px 2px rgba(0,0,0,.20), 0 18px 44px -30px rgba(0,0,0,.55);
  --t26-shadow-glow: 0 0 0 1px hsl(var(--primary) / .18), 0 26px 64px -32px hsl(var(--primary) / .60);
  --t26-radius: 14px;
}

/* ---------- 1. 首屏：真实图像层（深色取 dark 图，浅色取 light 图）---------- */
.hero-bg::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:url("/assets/img/theme/hero-dark.jpg");
  background-size:cover;background-position:70% 40%;background-repeat:no-repeat;
  opacity:.55;mix-blend-mode:screen;
  -webkit-mask-image:radial-gradient(118% 96% at 74% 34%,#000 0%,rgba(0,0,0,.52) 54%,transparent 84%);
          mask-image:radial-gradient(118% 96% at 74% 34%,#000 0%,rgba(0,0,0,.52) 54%,transparent 84%);
}
html.light .hero-bg::after{
  background-image:url("/assets/img/theme/hero-light.jpg");
  background-position:80% 42%;opacity:.95;mix-blend-mode:normal;
  -webkit-mask-image:radial-gradient(120% 100% at 72% 28%,#000 0%,rgba(0,0,0,.42) 56%,transparent 86%);
          mask-image:radial-gradient(120% 100% at 72% 28%,#000 0%,rgba(0,0,0,.42) 56%,transparent 86%);
}
/* 首屏文字容器的可读性兜底：左半侧再加一层极淡的底色晕 */
.hero-in{position:relative}
.hero-in::before{
  content:"";position:absolute;inset:-2rem -50vw -2rem -1rem;pointer-events:none;
  background:linear-gradient(90deg,hsl(var(--background)/.72) 0%,hsl(var(--background)/.34) 42%,transparent 72%);
  z-index:-1;
}

/* ---------- 2. 顶部导航：玻璃质感 + 细描边 ---------- */
.site,header.site{
  backdrop-filter:saturate(1.15) blur(10px);
  -webkit-backdrop-filter:saturate(1.15) blur(10px);
}
header.site::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;pointer-events:none;
  background:linear-gradient(90deg,transparent,hsl(var(--primary)/.45),hsl(var(--primary)/.10) 60%,transparent);
}

/* ---------- 3. 卡片族：统一描边 / 玻璃 / 悬浮辉光 ---------- */
.card,.feature,.model-card,.term-card{
  border-color:var(--t26-hair);
  box-shadow:var(--t26-shadow-1);
}
.card,.feature{background-image:linear-gradient(165deg,hsl(var(--card)/.94),hsl(var(--surface-elevated)/.55) 70%,hsl(var(--card)/.9))}
.card:hover,.feature:hover,.model-card:hover{
  border-color:var(--t26-hair-strong);
  box-shadow:var(--t26-shadow-glow);
}
.model-card:hover,.faq-item:hover{transform:translateY(-2px)}
.model-card,.faq-item{transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
.term-card{box-shadow:0 30px 60px -30px hsl(var(--primary)/.35),0 0 0 1px hsl(var(--primary)/.14)}

/* ---------- 4. 按钮：主色渐变 + 悬浮发光 ---------- */
.btn{transition:transform .18s ease,box-shadow .22s ease,background-color .2s ease,border-color .2s ease}
.btn-primary{
  background-image:linear-gradient(135deg,hsl(var(--primary)) 0%,hsl(var(--grad-a)) 100%);
  box-shadow:0 6px 20px -10px hsl(var(--primary)/.75);
}
.btn-primary:hover{box-shadow:0 10px 30px -12px hsl(var(--primary)/.95);transform:translateY(-1px)}
.btn-outline:hover,.btn-ghost:hover{border-color:var(--t26-hair-strong);box-shadow:0 8px 24px -18px hsl(var(--primary)/.8)}

/* ---------- 5. 标签 / 信任条 / 指标 ---------- */
.pill{box-shadow:0 0 0 1px hsl(var(--primary)/.10),0 8px 20px -16px hsl(var(--primary)/.9)}
.trust-item{transition:border-color .2s ease,box-shadow .2s ease}
.trust-item:hover{border-color:var(--t26-hair-strong);box-shadow:0 8px 22px -18px hsl(var(--primary)/.9)}
.stat-icon{box-shadow:0 0 0 1px hsl(var(--primary)/.16),0 10px 24px -18px hsl(var(--primary)/.9)}

/* ---------- 6. 区块：细描边分隔 + 统一的顶部主色光 ---------- */
.sec-band::after{
  content:"";position:absolute;left:8%;right:8%;top:0;height:1px;pointer-events:none;
  background:linear-gradient(90deg,transparent,hsl(var(--primary)/.35),transparent);
}
.cta-final::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(70% 130% at 50% 118%,hsl(var(--primary)/.16),transparent 72%);
}
footer.site,footer{border-top-color:var(--t26-hair)}

/* ---------- 7. 表格 / 代码 / 价格条：统一质感 ---------- */
table{border-collapse:separate;border-spacing:0}
table th{background-image:linear-gradient(180deg,hsl(var(--primary)/.10),transparent)}
.term-model,.term-prices{border-color:var(--t26-hair)}
pre,code,.mono{text-shadow:none}

/* ---------- 7b. 浅色主题细节：压掉过重的装饰水印，提升小字对比 ---------- */
html.light .term-watermark{opacity:.45}
html.light .hero-bg::after{opacity:1;background-position:88% 38%}
html.light .hero-bg .glow1{background:radial-gradient(circle at center,hsl(var(--primary)/.20),hsl(var(--primary)/.06) 46%,transparent 72%)}
html.light .hero-bg .glow2{background:radial-gradient(circle at center,hsl(var(--primary)/.14),transparent 72%)}
html.light .ticker,html.light .ticker-track{color:hsl(var(--muted-foreground))}
html.light .hero .dots{opacity:.35}
html.light .m-price,html.light .small.muted,html.light .trust .tlbl{color:hsl(var(--muted-foreground))}
html.light .term-price-chip{border-color:hsl(var(--primary)/.22);background:hsl(var(--card)/.75)}

/* ---------- 8. 动效与无障碍 ---------- */
a,.btn,.model-card,.trust-item{will-change:transform}
@media(prefers-reduced-motion:reduce){
  .card:hover,.feature:hover,.model-card:hover,.btn-primary:hover{transform:none}
}

/* 后台无折扣 → 折扣文字与条目不显示（由价格跟随器写入） */
.tp-nodisc{display:none !important}
.m-off.nodisc{display:none !important}
