/* ============================================================================
   闲仙科技 · 东方水墨 v3「重排版」
   ----------------------------------------------------------------------------
   与 v2 的根本区别：
     v2 = 在旧页面上换颜色变量（结果仍是满屏线框 + 八等分格子 → 方正）
     v3 = 重新定义版面结构：非对称栅格、字号悬殊、去框靠留白、错落排列
   只依赖：index.html 的新结构 + 其余 11 页的旧类名兼容层
   ============================================================================ */

/* ---------- 0. 自托管字体（国内服务器不能依赖 Google Fonts） ---------- */
@font-face{
  font-family:"Noto Serif SC";
  src:url("../fonts/noto-serif-sc-600.woff2") format("woff2");
  font-weight:400 600;
  font-display:swap;
}
@font-face{
  font-family:"Noto Serif SC";
  src:url("../fonts/noto-serif-sc-900.woff2") format("woff2");
  font-weight:700 900;
  font-display:swap;
}
@font-face{
  font-family:"Noto Sans SC";
  src:url("../fonts/noto-sans-sc-300.woff2") format("woff2");
  font-weight:300 350;
  font-display:swap;
}
@font-face{
  font-family:"Noto Sans SC";
  src:url("../fonts/noto-sans-sc-400.woff2") format("woff2");
  font-weight:400 500;
  font-display:swap;
}
@font-face{
  font-family:"Ma Shan Zheng";
  src:url("../fonts/ma-shan-zheng-400.woff2") format("woff2");
  font-weight:400;
  font-display:swap;
}

/* ---------- 1. 设计令牌 ---------- */
:root{
  --paper:#F7F2E7;
  --paper-2:#F0E9D9;
  --card:#FFFCF5;
  --ink:#23201B;
  --ink-2:#6E655A;
  --ink-3:#A0968A;
  --cinnabar:#B5382A;
  --cinnabar-d:#9A2E21;
  --gold:#96773F;
  --rule:#E3D9C5;

  --serif:"Noto Serif SC","Songti SC","STSong",serif;
  --sans:"Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  --calli:"Ma Shan Zheng",var(--serif);

  --ease:cubic-bezier(.22,.61,.36,1);
  --shadow-soft:0 1px 0 rgba(35,32,27,.03), 0 30px 56px -38px rgba(35,32,27,.38);

  /* —— 旧变量重映射：兼容其余 11 个页面的内联样式 —— */
  --bg:#F7F2E7;
  --bg2:#F0E9D9;
  --ink2:#6E655A;
  --ink3:#A0968A;
  --pink:#B5382A;
  --pink-d:#9A2E21;
  --line:#E3D9C5;
  --line-strong:#D8CCB4;
}

/* ---------- 2. 基础 ---------- */
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;
  font-family:var(--sans);
  font-weight:400;
  font-size:15px;
  line-height:1.8;
  letter-spacing:.01em;
  color:var(--ink);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
img{max-width:100%;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px;}

/* 通用按钮：实心墨块（不是胶囊） */
.btn{
  display:inline-flex;
  align-items:center;
  gap:.6em;
  padding:15px 34px;
  border-radius:2px;
  border:1px solid transparent;
  font-family:var(--sans);
  font-size:14px;
  font-weight:400;
  letter-spacing:.14em;
  line-height:1;
  cursor:pointer;
  transition:background .32s var(--ease), color .32s var(--ease),
             border-color .32s var(--ease), transform .32s var(--ease);
}
.btn:active{transform:translateY(1px);}
.btn-ink{background:var(--ink);color:var(--paper);}
.btn-ink:hover{background:var(--cinnabar);}
/* 旧按钮类 → 新观感 */
.btn-pink{background:var(--ink);color:var(--paper);box-shadow:none;}
.btn-pink:hover{background:var(--cinnabar);transform:none;box-shadow:none;}
.btn-line{border-color:var(--rule);color:var(--ink);background:transparent;}
.btn-line:hover{background:transparent;color:var(--cinnabar);border-color:var(--cinnabar);}

/* 文字链接（朱砂下划线，替代第二个按钮） */
.link-arrow{
  display:inline-flex;
  align-items:center;
  gap:.55em;
  font-size:13.5px;
  letter-spacing:.1em;
  color:var(--ink);
  padding-bottom:4px;
  border-bottom:1px solid rgba(181,56,42,.28);
  transition:color .3s var(--ease), border-color .3s var(--ease);
}
.link-arrow svg{width:14px;height:14px;stroke:currentColor;transition:transform .3s var(--ease);}
.link-arrow:hover{color:var(--cinnabar);border-color:var(--cinnabar);}
.link-arrow:hover svg{transform:translateX(4px);}

/* ---------- 3. 导航 ---------- */
.nav{
  position:sticky;top:0;z-index:60;
  background:rgba(247,242,231,.88);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(227,217,197,.75);
}
.nav-in{
  display:flex;align-items:center;gap:26px;
  height:66px;
}
.brand{
  display:flex;align-items:center;gap:11px;
  font-family:var(--serif);
  font-weight:600;
  font-size:17px;
  letter-spacing:.06em;
  line-height:1.1;
  color:var(--ink);
}
.brand img{
  width:34px;height:34px;
  border-radius:50%;
  object-fit:cover;
  background:transparent;
  box-shadow:0 0 0 1px rgba(227,217,197,.9);
}
.brand small{
  display:block;
  margin-top:3px;
  font-family:var(--sans);
  font-size:10px;
  font-weight:300;
  letter-spacing:.1em;
  color:var(--ink-3);
}
.menu{display:flex;align-items:center;gap:22px;margin-left:auto;font-size:13.5px;letter-spacing:.06em;}
.menu a{
  position:relative;
  padding:5px 0;
  color:var(--ink-2);
  transition:color .26s var(--ease);
}
.menu a::after{
  content:"";position:absolute;left:0;right:0;bottom:-2px;
  height:1px;background:var(--cinnabar);
  transform:scaleX(0);transform-origin:left;
  transition:transform .3s var(--ease);
}
.menu a:hover,.menu a.active{color:var(--ink);}
.menu a:hover::after,.menu a.active::after{transform:scaleX(1);}

/* ---------- 4. 首屏：非对称 58 / 42，视觉块略出格 ---------- */
.hero{
  position:relative;
  overflow:hidden;
  background-color:var(--paper);
  background-image:
    radial-gradient(760px 540px at 10% -10%, rgba(255,255,255,.62), transparent 62%),
    radial-gradient(600px 460px at 94% 4%, rgba(181,56,42,.042), transparent 62%);
  background-repeat:no-repeat;
}
/* 天头一道朱砂短线 */
.hero::before{
  content:"";position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,var(--cinnabar) 0%, rgba(181,56,42,.3) 26%, rgba(181,56,42,0) 60%);
  z-index:3;
}
/* 书法水印：整屏最抓眼的东方符号 */
.hero .seal-mark{
  position:absolute;
  right:2.5%;
  left:auto;
  bottom:-2%;
  font-family:var(--calli);
  font-weight:400;
  font-size:clamp(170px,16.5vw,255px);
  line-height:.86;
  letter-spacing:0;
  color:var(--ink);
  opacity:.052;
  pointer-events:none;
  user-select:none;
  z-index:0;
}
.hero-in{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(0,1.16fr) minmax(0,.84fr);
  gap:0 clamp(28px,4.4vw,72px);
  align-items:center;
  max-width:1240px;
  min-height:clamp(470px, calc(100vh - 66px), 720px);
  padding:clamp(56px,6.4vw,92px) 24px clamp(58px,6vw,86px);
}
.hero-copy{position:relative;z-index:2;}

/* 眉标：唯一使用朱砂的小字 */
.eyebrow{
  margin:0;
  font-family:var(--sans);
  font-size:11.5px;
  font-weight:400;
  letter-spacing:.32em;
  color:var(--cinnabar);
  text-indent:.32em;
}

/* 主标题：字号与正文拉开 4~5 倍，这是“不方正”的第一关键 */
.hero h1{
  margin:22px 0 0;
  font-family:var(--serif);
  font-weight:600;
  font-size:clamp(2.35rem,4.35vw,4rem);
  line-height:1.17;
  letter-spacing:.004em;
  color:var(--ink);
  text-wrap:pretty;
}
.hero h1 em{
  position:relative;
  font-style:normal;
  color:var(--cinnabar);
  padding-bottom:.06em;
}
/* 朱砂短笔：只给一个词加笔，而不是整句变色 */
.hero h1 em::after{
  content:"";position:absolute;left:.01em;right:.01em;bottom:-.06em;
  height:.085em;background:var(--cinnabar);opacity:.78;
}

/* 副文：无衬线 300，行高 2 —— 与标题的紧行高形成呼吸反差 */
.hero .lede{
  margin:28px 0 0;
  max-width:30em;
  font-family:var(--sans);
  font-weight:300;
  font-size:15.5px;
  line-height:2.1;
  letter-spacing:.02em;
  color:var(--ink-2);
  text-wrap:pretty;
}

.hero-act{
  display:flex;align-items:center;flex-wrap:wrap;
  gap:14px 28px;
  margin-top:38px;
}

/* 数字：衬线大字号，衬出层次 */
.hero-stats{
  display:flex;flex-wrap:wrap;
  gap:0 clamp(22px,3.2vw,46px);
  margin:52px 0 0;
  padding:0;
}
.hero-stats .stat{
  padding-left:0;
  border-left:none;
}
.hero-stats b{
  display:block;
  font-family:var(--serif);
  font-weight:600;
  font-size:32px;
  line-height:1.15;
  letter-spacing:.02em;
  color:var(--ink);
}
.hero-stats span{
  display:block;
  margin-top:5px;
  font-family:var(--sans);
  font-size:11px;
  font-weight:300;
  letter-spacing:.16em;
  color:var(--ink-3);
}

/* 视觉区：形象立轴在上、视频在下，两者只“相接”不“相压” */
.hero-visual{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  padding:0 0 0 clamp(10px,2vw,30px);
  margin-right:0;
}
.hero-video{
  position:relative;
  order:2;
  width:100%;
  margin:0;
  border-radius:2px;
  overflow:hidden;
  box-shadow:0 30px 54px -34px rgba(35,32,27,.5);
  background:#1A1713;
}
.hero-video video{
  display:block;
  width:100%;
  aspect-ratio:16/10;
  object-fit:cover;
  background:#1A1713;
}
.hero-video .v-sound{
  position:absolute;right:12px;bottom:12px;
  display:flex;align-items:center;justify-content:center;
  width:36px;height:36px;
  padding:0;border:none;border-radius:2px;
  background:rgba(23,19,15,.6);
  color:#F7EFE2;
  cursor:pointer;
  backdrop-filter:blur(6px);
  transition:background .26s var(--ease);
}
.hero-video .v-sound:hover{background:var(--cinnabar);}
.hero-video .v-sound svg{width:17px;height:17px;}

/* 形象：站在视频上沿右端，只压住视频的边，不压住画面内容 */
.hero-mascot{
  position:relative;
  order:1;
  left:auto;top:auto;
  width:clamp(118px,11.6vw,164px);
  margin:0 clamp(18px,3.4vw,54px) 0 0;
  z-index:3;
}
.hero-mascot img{
  display:block;
  width:100%;
  height:auto;
  border-radius:0;
  background:none;
  /* 透明通道素材：用投影沿轮廓落地，而不是套一个矩形阴影 */
  filter:drop-shadow(0 18px 28px rgba(35,32,27,.26));
}
/* 朱砂闲章：旋转，与所有水平线对抗 */
.hero-mascot .seal{
  position:absolute;
  left:-20px;top:-16px;
  display:flex;align-items:center;justify-content:center;
  width:56px;height:56px;
  border-radius:2px;
  background:var(--cinnabar);
  color:#FFF4EE;
  font-family:var(--calli);
  font-size:12.5px;
  line-height:1.14;
  letter-spacing:.06em;
  text-align:center;
  transform:rotate(-7deg);
  box-shadow:0 14px 24px -14px rgba(154,46,33,.9), inset 0 0 0 2px rgba(255,244,238,.34);
}

/* 旧云朵若还有页面在用，压到不可见 */
.clouds{position:absolute;inset:0;opacity:0;pointer-events:none;}

/* ---------- 5. 区块标题：左对齐 + 朱砂竖笔（去掉居中与短横线） ---------- */
.sec-head{
  position:relative;
  margin:0 0 clamp(34px,4.4vw,58px);
  padding-left:0;
  text-align:left;
}
.sec-head::before{
  content:"";position:absolute;left:-20px;top:7px;bottom:9px;
  width:2px;background:var(--cinnabar);opacity:.82;
}
.sec-head .en{
  margin:0;
  font-family:var(--sans);
  font-size:11px;
  font-weight:400;
  letter-spacing:.32em;
  color:var(--gold);
}
.sec-head h2{
  margin:9px 0 0;
  font-family:var(--serif);
  font-weight:600;
  font-size:clamp(1.6rem,2.5vw,2.25rem);
  line-height:1.28;
  letter-spacing:.02em;
  color:var(--ink);
}
.sec-head .line{display:none;}
.sec-head .note{
  margin:12px 0 0;
  max-width:34em;
  font-family:var(--sans);
  font-weight:300;
  font-size:13.5px;
  line-height:1.95;
  color:var(--ink-2);
}

/* ---------- 7. 产品：横向条目，三项完全同款 ----------
   结构与类名必须保持 .prod-grid > .prod-card > .p-ico / h3 / p / .p-link，
   因为管理台「官网管理 → 产品介绍」写入时只会生成这套类名。
   这里只靠 CSS 把它们重排成横条，不靠改 DOM。 */
.products{
  padding:clamp(36px,4vw,58px) 0 clamp(62px,7vw,96px);
  background:transparent;
}

.products .prod-grid{
  display:flex;
  flex-direction:column;
  gap:0;
  border:none;
}

.products .prod-card{
  position:relative;
  display:grid;
  grid-template-columns:46px minmax(0,1fr) auto;
  grid-template-rows:auto auto;
  align-items:center;
  gap:0 24px;
  padding:30px 26px;
  border:none;
  border-top:1px solid var(--rule);
  border-radius:0;
  background:transparent;
  box-shadow:none;
  text-align:left;
  transition:background .34s var(--ease), color .34s var(--ease);
}
.products .prod-card:last-child{border-bottom:1px solid var(--rule);}
.products .prod-card:hover{
  transform:none;
  box-shadow:none;
  background:rgba(255,252,245,.7);
}

/* 图标：第一列，朱砂笔画，无框无底 */
.products .prod-card .p-ico{
  grid-column:1;
  grid-row:1 / span 2;
  align-self:center;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0;
  color:var(--cinnabar);
  font-size:21px;
  line-height:1;
}
.products .prod-card .p-ico svg{
  width:29px;height:29px;
  stroke:currentColor;
  stroke-width:1.3;
}

.products .prod-card h3{
  grid-column:2;
  grid-row:1;
  margin:0;
  font-family:var(--serif);
  font-weight:600;
  font-size:clamp(1.14rem,1.72vw,1.5rem);
  line-height:1.4;
  letter-spacing:.03em;
}
.products .prod-card p{
  grid-column:2;
  grid-row:2;
  margin:8px 0 0;
  max-width:60em;
  font-family:var(--sans);
  font-weight:300;
  font-size:13.6px;
  line-height:1.95;
  letter-spacing:.015em;
  color:var(--ink-2);
}
.products .prod-card .p-link{
  grid-column:3;
  grid-row:1 / span 2;
  align-self:center;
  margin:0;
  padding-bottom:3px;
  font-family:var(--sans);
  font-size:12px;
  letter-spacing:.15em;
  color:var(--cinnabar);
  white-space:nowrap;
  border-bottom:1px solid rgba(181,56,42,.28);
  transition:border-color .3s var(--ease);
}
.products .prod-card .p-link:hover{border-color:var(--cinnabar);}

/* 首项不再做任何特殊化：三项完全同一套样式，只靠上下细线分隔。
   （2026-11-05 用户反馈"其中一个还是和别的不一样"，去掉底色与竖笔） */

/* ---------- 8. 页脚：深墨收口 ---------- */
.footer{
  background:var(--ink);
  color:rgba(247,242,231,.66);
  border-top:none;
  padding:clamp(52px,6vw,76px) 0 26px;
  font-family:var(--sans);
  font-weight:300;
  font-size:13px;
  line-height:1.95;
}
.footer-grid{
  display:grid;
  grid-template-columns:1.1fr .9fr auto;
  gap:clamp(28px,4vw,58px);
  align-items:start;
}
.footer h4{
  margin:0 0 14px;
  font-family:var(--serif);
  font-weight:600;
  font-size:14.5px;
  letter-spacing:.1em;
  color:#FBF6EA;
}
.footer p{margin:0;}
.footer a{
  color:rgba(247,242,231,.8);
  border-bottom:1px solid rgba(247,242,231,.18);
  transition:color .26s var(--ease), border-color .26s var(--ease);
}
.footer a:hover{color:#F3B7A8;border-color:rgba(243,183,168,.6);}
.footer .qr-row{display:flex;gap:14px;}
.footer .qr{width:74px;text-align:center;font-size:11px;}
.footer .qr img{
  width:74px;height:74px;
  border-radius:2px;
  border:none;
  background:#fff;
  box-shadow:0 0 0 1px rgba(247,242,231,.12);
}
.footer .qr .cap{margin-top:7px;font-size:10.5px;letter-spacing:.1em;color:rgba(247,242,231,.5);}
.footer .copy{
  margin-top:42px;
  padding-top:20px;
  border-top:1px solid rgba(247,242,231,.13);
  text-align:left;
  font-size:11.5px;
  letter-spacing:.04em;
  color:rgba(247,242,231,.44);
}
.footer .copy a{color:rgba(247,242,231,.6);border-bottom-color:rgba(247,242,231,.15);}

/* ---------- 9. 内页头部：纸底 + 朱砂竖笔 + 大标题（不再是深墨大色块） ---------- */
.page-head{
  position:relative;
  overflow:hidden;
  background-color:var(--paper);
  background-image:
    radial-gradient(680px 420px at 88% -20%, rgba(181,56,42,.05), transparent 64%),
    radial-gradient(600px 400px at 6% 0%, rgba(255,255,255,.6), transparent 66%);
  border-bottom:none;
  /* 这 11 个页面的 page-head 内部没有 .wrap，只能靠自身 padding 对齐容器 */
  padding-top:clamp(52px,6.4vw,88px);
  padding-bottom:clamp(34px,4vw,52px);
  padding-left:max(24px, calc((100% - 1120px) / 2 + 24px));
  padding-right:max(24px, calc((100% - 1120px) / 2 + 24px));
  color:var(--ink);
  text-align:left;
}
/* 底边不用硬线，改成两端淡出的发丝线 */
.page-head::before{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,transparent 0%,var(--rule) 18%,var(--rule) 84%,transparent 100%);
  z-index:2;
}
.page-head::after{
  content:"";position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,var(--cinnabar) 0%, rgba(181,56,42,.26) 24%, rgba(181,56,42,0) 58%);
}
.page-head h1{position:relative;}
.page-head h1::before{
  content:"";position:absolute;
  left:-19px;top:-34px;bottom:1px;
  width:2px;background:var(--cinnabar);opacity:.8;
}
.page-head .en{
  margin:0;
  font-family:var(--sans);
  font-size:11px;
  font-weight:400;
  letter-spacing:.34em;
  color:var(--gold);
}
.page-head h1{
  margin:13px 0 0;
  font-family:var(--serif);
  font-weight:600;
  font-size:clamp(1.95rem,3.3vw,2.9rem);
  line-height:1.24;
  letter-spacing:.015em;
  color:var(--ink);
}
.page-head .line{display:none;}
.page-head h1 em{font-style:normal;color:var(--cinnabar);}

.page-body{padding:clamp(46px,5.4vw,76px) 0 clamp(58px,6.6vw,92px);}

/* ---------- 10. 内页通用组件：去框、淡投影、微圆角 ---------- */
.card,
.news-card,
.ip-card,
.high-card,
.license-box,
.copyright-card,
.message-card{
  background:transparent;
  border:none;
  border-radius:0;
  box-shadow:none;
}
/* 视频卡需要一点载体感，单独给极淡投影 */
.video-card{
  background:rgba(255,252,245,.55);
  border:none;
  border-radius:3px;
  box-shadow:0 22px 40px -38px rgba(35,32,27,.3);
}
.card h3,.news-card h3,.ip-card h3{
  font-family:var(--serif);
  font-weight:600;
  letter-spacing:.03em;
}

/* 列表项：只用发丝线分隔，不加整框 */
.about-list li,
.scope-item{
  border:none;
  border-bottom:1px solid var(--rule);
  background:none;
  padding:13px 0;
  font-family:var(--sans);
  font-weight:300;
  font-size:13.8px;
  line-height:1.95;
  color:var(--ink-2);
}
.about-list li:last-child,
.scope-item:last-child{border-bottom:none;}
.about-list li::before{color:var(--cinnabar);}

/* 图标：朱砂笔画线稿，无框无底 */
.dl-icon,
.ci-ico{
  border:none;
  border-radius:0;
  background:none;
  color:var(--cinnabar);
  font-family:var(--calli);
  font-size:21px;
  box-shadow:none;
}
.ico{color:var(--cinnabar);}
.ico svg{stroke:currentColor;}
/* 内页小图标块（原来是渐变圆底）统一去底 */
.scope-item .i,
.scope-item .ico,
.about-list .i{
  background:none;
  border:none;
  border-radius:0;
  color:var(--cinnabar);
  box-shadow:none;
}
.scope-item .i svg,
.about-list .i svg{stroke:currentColor;fill:none;}

/* 提示块：水墨批注 */
.tip{
  position:relative;
  background:rgba(240,233,217,.66);
  border:none;
  border-left:2px solid var(--cinnabar);
  border-radius:0;
  padding:15px 20px 15px 22px;
  font-family:var(--sans);
  font-weight:300;
  font-size:13.2px;
  line-height:1.95;
  color:var(--ink-2);
}

/* 下载 / 新闻 / 视频等条目 */
.dl-row{
  border:none;
  border-top:1px solid var(--rule);
  border-radius:0;
  background:none;
  box-shadow:none;
}
.dl-row:last-child{border-bottom:1px solid var(--rule);}
.dl-row:hover{background:rgba(255,252,245,.6);}
.dl-info h3{font-family:var(--serif);font-weight:600;font-size:18px;letter-spacing:.03em;}
.dl-price{font-family:var(--serif);font-weight:600;color:var(--cinnabar);}

.video-card{border-radius:3px;overflow:hidden;}
.video-card .thumb{border-radius:0;}
.video-info h3{font-family:var(--serif);font-weight:600;font-size:17px;letter-spacing:.03em;}
.video-meta{font-family:var(--sans);font-weight:300;font-size:12.5px;color:var(--ink-3);}

.contact-item,.promo-benefit{
  border:none;
  border-top:1px solid var(--rule);
  border-radius:0;
  background:none;
  box-shadow:none;
}

/* 通用标题字族校正 */
h1,h2,h3{font-family:var(--serif);}

/* ---------- 11. 响应式 ---------- */
@media(max-width:980px){
  .hero-in{
    grid-template-columns:1fr;
    gap:38px;
    min-height:0;
    padding:52px 24px 58px;
  }
  .hero h1{font-size:clamp(2rem,6.4vw,2.7rem);}
  .hero .seal-mark{left:auto;right:-3%;bottom:2%;font-size:clamp(130px,30vw,180px);opacity:.048;}
  .hero-stats{margin-top:38px;}

  /* 单列时：视觉块回到正常流，形象图在视频上方居中偏右 */
  .hero-visual{padding:34px 0 0 0;margin-right:0;}
  .hero-mascot{position:relative;width:112px;margin:0 8% 0 0;left:auto;top:auto;}
  .hero-mascot .seal{width:50px;height:50px;font-size:11px;left:-10px;top:-10px;}


  .products .prod-card{
    grid-template-columns:34px minmax(0,1fr);
    gap:0 16px;
    padding:24px 14px;
  }
  .products .prod-card .p-link{grid-column:2;grid-row:3;justify-self:start;margin-top:12px;}

  .footer-grid{grid-template-columns:1fr 1fr;gap:30px 28px;}
  .footer-grid > :last-child{grid-column:1 / -1;}

  .sec-head::before{left:-15px;}
  .page-head h1::before{left:-14px;top:-30px;}

  /* 窄屏：菜单必须收起，靠汉堡勾选框展开（内联样式会设 display:none，
     这里补全是因为本文件的 .menu{display:flex} 在基础层会覆盖它） */
  .menu{
    position:fixed;
    top:66px;left:0;right:0;
    display:none;
    flex-direction:column;
    margin-left:0;
    padding:6px 24px 12px;
    max-height:calc(100vh - 66px);
    overflow:auto;
    background:var(--paper);
    border-bottom:1px solid var(--rule);
    box-shadow:0 24px 40px -30px rgba(35,32,27,.34);
  }
  .nav-toggle:checked ~ .menu{display:flex;}
  .menu a{padding:14px 10px;border-bottom:1px solid var(--rule);border-left:2px solid transparent;}
  .menu a:hover,.menu a.active{border-left-color:var(--cinnabar);border-bottom-color:var(--rule);}
  .menu a::after{display:none;}

  .prod-grid{grid-template-columns:1fr;}
}

@media(max-width:560px){
  body{font-size:14.5px;}
  .hero-in{padding:44px 18px 50px;}
  .hero h1{font-size:clamp(1.85rem,7.6vw,2.2rem);line-height:1.24;}
  .hero .lede{font-size:14.5px;margin-top:22px;}
  .hero-act{margin-top:30px;gap:12px 20px;}
  .btn{padding:13px 26px;font-size:13px;}
  .hero-stats{gap:0 20px;}
  .hero-stats dd{font-size:22px;}
  .sec-head h2{font-size:1.5rem;}
  .footer-grid{grid-template-columns:1fr;}
  .footer .copy{margin-top:32px;}
}

/* ---------- 12. 动效：一次编排，尊重系统偏好 ---------- */
@media(prefers-reduced-motion:no-preference){
  .hero-copy > *,
  .hero-visual{animation:rise .82s var(--ease) both;}
  .hero-copy .eyebrow{animation-delay:.04s;}
  .hero-copy h1{animation-delay:.12s;}
  .hero-copy .lede{animation-delay:.22s;}
  .hero-copy .hero-act{animation-delay:.32s;}
  .hero-copy .hero-stats{animation-delay:.42s;}
  .hero-visual{animation-delay:.5s;}
}
@keyframes rise{
  from{opacity:0;transform:translateY(16px);}
  to{opacity:1;transform:none;}
}
@media(prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;}
}

/* ---------- 13. 可访问性 ---------- */
a:focus-visible,
button:focus-visible,
.btn:focus-visible{
  outline:2px solid var(--cinnabar);
  outline-offset:3px;
}

/* ---------- 14. 下载中心：与新版面统一（去掉药丸按钮与白卡） ---------- */
.dl-list{max-width:none;margin:0;gap:0;}

.dl-row{
  background:transparent;
  border:none;
  border-top:1px solid var(--rule);
  border-radius:0;
  box-shadow:none;
  padding:26px 0;
  gap:22px;
}
.dl-row:last-child{border-bottom:1px solid var(--rule);}
.dl-row:hover{background:transparent;box-shadow:none;}

/* 图标：朱砂书法汉字，无底无框（原来是渐变圆角方块） */
.dl-row .dl-icon{
  flex:0 0 auto;
  width:42px;height:42px;
  border-radius:0;
  background:transparent;
  border:none;
  color:var(--cinnabar);
  font-family:var(--calli);
  font-size:23px;
  box-shadow:none;
}

.dl-info h3{font-size:19px;letter-spacing:.03em;}
.dl-info .meta{font-size:12.5px;color:var(--ink-3);margin-top:5px;}
.dl-price{font-size:13.5px;color:var(--cinnabar);font-weight:600;margin-top:6px;}

/* 版本标签：从"小方块"改成 · 分隔的纯文字 */
.dl-versions{gap:0;margin-top:8px;}
.dl-versions span{
  background:none;
  border:none;
  border-radius:0;
  padding:0;
  font-size:12px;
  line-height:1.9;
  color:var(--ink-2);
}
.dl-versions span + span::before{content:/·/;margin:0 .6em;color:var(--ink-3);}
.dl-versions b{color:var(--ink);font-weight:400;}

/* 下载按钮：药丸 → 墨块 */
.dl-btn{
  border-radius:2px;
  background:var(--ink);
  color:var(--paper);
  font-weight:400;
  font-size:13px;
  letter-spacing:.1em;
  padding:13px 26px;
}
.dl-btn:hover{background:var(--cinnabar);}
.dl-btn.soon{background:transparent;color:var(--ink-3);border:1px solid var(--rule);}

/* ---------- 15. 推广 / 联系 / 新闻：清掉渐变竖条、白卡、圆形徽章 ---------- */
/* 卡片标题前的渐变药丸 → 一竖朱砂笔 */
.card h3::before,
.news-card h3::before,
.promo-cta h3::before{
  content://;
  width:2px;
  height:.92em;
  background:var(--cinnabar);
  border-radius:0;
  opacity:.85;
}
.card h3,
.promo-cta h3,
.contact-item h4{font-family:var(--serif);font-weight:600;letter-spacing:.03em;}

/* 推广右侧“成为推广员”：不再是白色圆角浮卡 */
.promo-cta{
  background:transparent;
  border:none;
  border-radius:0;
  padding:0;
  box-shadow:none;
  text-align:left;
}

/* 权益条目前的小圆徽章 → 朱砂字标签 */
.promo-benefit{
  gap:14px;
  margin-top:16px;
  font-size:13.8px;
  line-height:1.95;
  color:var(--ink-2);
}
.promo-benefit .ico{
  flex:0 0 2.4em;
  width:2.4em;
  height:auto;
  border-radius:0;
  background:none;
  color:var(--cinnabar);
  font-family:var(--sans);
  font-size:12.5px;
  font-weight:400;
  line-height:1.95;
  text-align:left;
  display:block;
}

/* 二维码：去边框，留一道发丝线 */
.promo-qr img,
.promo-qr .qr img{
  border-radius:2px;
  border:none;
  box-shadow:0 0 0 1px var(--rule);
  background:#fff;
}
.promo-qr .cap{color:var(--ink-3);font-size:11px;}

/* 新闻卡片：日期与标签降噪 */
.news-card .date,
.news-date{font-family:var(--sans);font-size:11.5px;color:var(--ink-3);letter-spacing:.06em;}
.news-card:hover{transform:none;}

/* ---------- 16. 视频页：头部左对齐、播放器去大圆角 ---------- */
.page-hero{
  position:relative;
  background-color:var(--paper);
  background-image:
    radial-gradient(680px 420px at 88% -20%, rgba(181,56,42,.05), transparent 64%),
    radial-gradient(600px 400px at 6% 0%, rgba(255,255,255,.6), transparent 66%);
  border-bottom:none;
  color:var(--ink);
  text-align:left;
  padding-top:clamp(52px,6.4vw,88px);
  padding-bottom:clamp(30px,3.6vw,46px);
}
.page-hero::before{
  content://;position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,var(--cinnabar) 0%, rgba(181,56,42,.26) 24%, rgba(181,56,42,0) 58%);
}
.page-hero::after{
  content://;position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--rule) 18%,var(--rule) 84%,transparent);
}
.page-hero .wrap{position:relative;}
.page-hero .wrap::before{
  content://;position:absolute;left:-15px;top:8px;bottom:8px;
  width:2px;background:var(--cinnabar);opacity:.8;
}
.page-hero h1{
  font-family:var(--serif);
  font-size:clamp(1.95rem,3.3vw,2.9rem);
  font-weight:600;
  letter-spacing:.015em;
  line-height:1.24;
}
.page-hero h1 em{font-style:normal;color:var(--cinnabar);}
.page-hero .subtitle{
  margin-top:14px;
  font-family:var(--sans);
  font-size:13.5px;
  font-weight:300;
  letter-spacing:.08em;
  color:var(--ink-2);
}
.page-hero .line{display:none;}

.video-main{
  background:transparent;
  border:none;
  border-radius:3px;
  overflow:hidden;
  box-shadow:var(--shadow-soft);
}
.video-player{background:#15120F;}
.video-info{padding:26px 4px 0;}
.video-info h2{
  font-family:var(--serif);
  font-weight:600;
  font-size:clamp(1.2rem,1.8vw,1.5rem);
  letter-spacing:.03em;
}

/* ---------- 17. 联系页表单：下划线输入，不用框 ---------- */
.msg-field label{
  font-family:var(--sans);
  font-size:12px;
  font-weight:400;
  letter-spacing:.1em;
  color:var(--ink-3);
  margin-bottom:6px;
}
.msg-field label em{color:var(--cinnabar);}
.msg-field input,
.msg-field select,
.msg-field textarea{
  width:100%;
  background:transparent;
  border:none;
  border-bottom:1px solid var(--rule);
  border-radius:0;
  padding:11px 0;
  font-family:var(--sans);
  font-size:14px;
  color:var(--ink);
  outline:none;
  transition:border-color .25s var(--ease);
}
.msg-field input:focus,
.msg-field select:focus,
.msg-field textarea:focus{
  border-bottom-color:var(--cinnabar);
  background:transparent;
  box-shadow:none;
}
.msg-field textarea{min-height:96px;resize:vertical;}

/* ---------- 18. 新闻分类标签：金色胶囊 → 朱砂点 + 小字 ---------- */
.news-tag{
  display:inline-block;
  background:none;
  border:none;
  border-radius:0;
  padding:0;
  font-family:var(--sans);
  font-size:11px;
  letter-spacing:.16em;
  color:var(--cinnabar);
}
.news-tag::before{
  content://;
  display:inline-block;
  width:4px;height:4px;
  border-radius:50%;
  background:var(--cinnabar);
  vertical-align:middle;
  margin-right:.7em;
}

/* ---------- 19. IP 页：胶囊标签改朱砂小字 ---------- */
.ip-main .badge{
  border-radius:0;
  background:rgba(35,32,27,.82);
  font-family:var(--sans);
  font-size:11px;
  letter-spacing:.14em;
  padding:5px 10px;
}
.ip-card .guard,
.guard{
  display:inline-block;
  margin-top:10px;
  background:none;
  border:none;
  border-radius:0;
  padding:0;
  font-family:var(--sans);
  font-size:11.5px;
  letter-spacing:.12em;
  color:var(--cinnabar);
}
.ip-card .name{
  font-family:var(--serif);
  font-weight:600;
  letter-spacing:.04em;
}
.ip-card .role{
  font-family:var(--sans);
  font-weight:300;
  letter-spacing:.1em;
  color:var(--ink-3);
}