/* ============================================================================
   霸天IM 官网 · 视觉精修层（在 main.css 之后加载，只做增强不改结构）
   ========================================================================== */

:root{
  --txt-2: #B6B6C2;
  --txt-3: #9394A2;
  --txt-4: #6E6F7C;
  --line: rgba(255,255,255,.09);
  --line-2: rgba(255,255,255,.15);
  --sec-y: clamp(64px, 7vw, 104px);
}

body{letter-spacing:.005em;}
.wrap{max-width:1180px;}

/* ---------- 顶部提示条（替代原先挤在导航里的说明） ---------- */
.topbar{
  position:relative;z-index:40;margin-top:var(--nav-h);
  display:flex;align-items:center;justify-content:center;gap:10px;
  padding:9px 18px;font-size:12.5px;color:#9C9CAB;
  background:linear-gradient(90deg,rgba(244,0,0,.10),rgba(244,0,0,.02) 45%,rgba(255,255,255,.02));
  border-bottom:1px solid rgba(255,255,255,.06);
}
.topbar b{color:#fff;font-weight:600;}
.topbar .dotp{width:6px;height:6px;border-radius:50%;background:var(--red-2);box-shadow:0 0 0 4px rgba(244,0,0,.14);}

/* ---------- 导航 ---------- */
.nav-links a{font-size:14.5px;letter-spacing:.02em;}
.nav.scrolled{background:rgba(10,10,11,.82);backdrop-filter:saturate(170%) blur(20px);border-bottom-color:rgba(255,255,255,.07);}
.nav-right .btn{height:42px;padding:0 20px;border-radius:11px;}

/* ---------- 首屏 ---------- */
.hero{padding:calc(var(--nav-h) + 34px) 0 76px;min-height:calc(100svh - 44px);}
.hero h1{font-size:clamp(40px, 4.4vw, 60px);line-height:1.16;letter-spacing:-.012em;}
.hero-sub{font-size:16.5px;line-height:1.88;color:#BEBECB;max-width:590px;}
.hero-meta{color:#82828F;font-size:12.5px;letter-spacing:.04em;}
.eyebrow{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08);padding:7px 14px;border-radius:999px;font-size:12.5px;letter-spacing:.04em;}

/* ---------- 通用区块 ---------- */
.sec{padding:var(--sec-y) 0;}
.sec-head{max-width:740px;margin:0 auto clamp(34px, 3.6vw, 52px);}
.sec-head h2{font-size:clamp(27px, 3.2vw, 40px);line-height:1.3;letter-spacing:-.008em;}
.sec-head p{font-size:16px;line-height:1.9;color:#ACACB9;margin-top:15px;}
.kicker{letter-spacing:.16em;font-size:12px;}
.link-arrow{font-size:14.5px;}

/* ---------- 能力横向标签 ---------- */
.wall-sec{padding:clamp(26px,3vw,40px) 0;border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.06);background:linear-gradient(180deg,rgba(255,255,255,.022),transparent);}
.wall-lb{font-size:12.5px;letter-spacing:.16em;color:#787986;margin-bottom:18px;text-align:center;}
.wall{gap:10px;row-gap:10px;}
.wall span{
  font-size:13.5px;font-weight:600;color:#D8D8E2;letter-spacing:.02em;
  padding:9px 18px;border-radius:999px;
  background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08);
  transition:color .25s var(--ease),border-color .25s,background .25s,transform .25s;
}
.wall span:hover{color:#fff;border-color:rgba(255,58,34,.45);background:rgba(244,0,0,.10);transform:translateY(-1px);}

/* ---------- 功能卡 ---------- */
.grid-9{gap:16px;}
.fcard{padding:26px 24px 22px;border-radius:20px;}
.fcard h3{font-size:17px;letter-spacing:.01em;margin-top:16px;}
.fcard p{font-size:13.8px;line-height:1.82;color:#A3A3B1;}
.fcard::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(420px 180px at 15% -10%,rgba(255,58,34,.16),transparent 70%);
  opacity:0;transition:opacity .35s var(--ease);
}
.fcard:hover::after{opacity:1;}
.fcard:hover{transform:translateY(-4px);border-color:rgba(255,58,34,.34);box-shadow:0 26px 50px -28px rgba(244,0,0,.55);}
.f-ico{color:#FF7B66;}
.f-no{font-size:12px;letter-spacing:.14em;color:#5D5D6A;}
.chip{font-size:11.5px;padding:5px 11px;border-radius:999px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.075);color:#A6A6B3;}

/* ---------- 三步上手 ---------- */
.steps{gap:16px;}
.step{padding:30px 26px 26px;border-radius:20px;background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012));}
.step .sn{font-size:40px;line-height:1;letter-spacing:-.03em;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
.step h3{font-size:17.5px;margin:14px 0 10px;}
.step p{font-size:14px;line-height:1.82;color:#A3A3B1;}
.step .tagline{display:inline-block;margin-top:14px;font-size:12.5px;color:#FF8672;background:rgba(244,0,0,.10);border:1px solid rgba(244,0,0,.20);padding:5px 11px;border-radius:999px;}

/* ---------- 数据安全面板 ---------- */
.dark-panel{border-radius:26px;border-color:rgba(255,255,255,.09);}
.dark-panel .muted{color:#ACACB9;line-height:1.9;}

/* ---------- CTA ---------- */
.cta-band{padding:clamp(40px,5vw,72px) clamp(26px,4vw,56px);border-radius:26px;}
.cta-band h2{font-size:clamp(25px,3.1vw,38px);line-height:1.28;}
.cta-band p{color:rgba(255,255,255,.78);font-size:15.5px;line-height:1.85;}
.cta-band .btn-ghost{border-color:rgba(255,255,255,.32);color:#fff;background:rgba(255,255,255,.06);}
.cta-band .btn-ghost:hover{background:rgba(255,255,255,.12);}

/* ---------- 按钮 ---------- */
.btn{letter-spacing:.01em;}
.btn-red{background:var(--grad);box-shadow:0 14px 30px -16px rgba(244,0,0,.75);}
.btn-red:hover{transform:translateY(-1px);box-shadow:0 18px 34px -16px rgba(244,0,0,.85);}
.btn-ghost{border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.02);}
.btn-ghost:hover{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.28);}

/* ---------- 页脚 ---------- */
.foot{padding-top:64px;background:linear-gradient(180deg,#0A0A0B,#070708);}
.foot-top{grid-template-columns:1.7fr .85fr .85fr .85fr .9fr;gap:34px;}
.foot-brand p{font-size:13px;line-height:1.85;color:#91919F;}
.foot-col h5{color:#7C7D8A;letter-spacing:.14em;}
.foot-col a{font-size:13.5px;color:#A8A8B5;}
.foot-col a:hover{color:#fff;}
.foot-bot{margin-top:8px;font-size:12.5px;color:#6E6F7C;border-top:1px solid rgba(255,255,255,.06);padding:20px 0 26px;}
.foot-bot .fl{gap:14px;}
.foot-note{display:block;margin-top:10px;font-size:12px;color:#5F606C;line-height:1.7;}

/* ---------- 协议页正文 ---------- */
.legal-meta{font-size:12.5px;color:#8B8C99;padding:12px 16px;margin-bottom:8px;border-radius:12px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);line-height:1.8;}
.prose h2{font-size:16.5px !important;font-weight:700;color:#fff;margin:30px 0 10px !important;padding-left:12px;position:relative;}
.prose h2::before{content:"";position:absolute;left:0;top:.55em;width:3px;height:14px;border-radius:2px;background:var(--grad);}
.prose p{font-size:14.5px !important;line-height:1.95 !important;color:#B0B0BE !important;margin:9px 0 !important;}
.prose{max-width:840px;}

/* ---------- 移动端 ---------- */
@media (max-width:960px){
  .hero{min-height:auto;padding:calc(var(--nav-h) + 26px) 0 48px;}
  .hero h1{font-size:clamp(31px,7.6vw,40px);}
  .sec-head h2{font-size:clamp(23px,5.4vw,29px);}
  .grid-9{grid-template-columns:repeat(2,1fr);}
  .steps{grid-template-columns:1fr;}
  .foot-top{grid-template-columns:1fr 1fr;gap:26px;}
  .topbar{font-size:11.5px;padding:8px 14px;}
}
@media (max-width:640px){
  .topbar{white-space:nowrap;font-size:11.5px;gap:6px;}
  .topbar .hide-m{display:none;}
  .grid-9{grid-template-columns:1fr;}
  .foot-top{grid-template-columns:1fr;}
  .wall span{font-size:12.5px;padding:7px 14px;}
  .sec{padding:52px 0;}
  .fcard{padding:22px 20px 18px;}
}