/* =========================================================
   Bonin Tech — AI / Tech Theme  (theme.css)
   统一覆盖旧模板样式，暗色科技风 + 玻璃拟态 + 青紫渐变
   ========================================================= */

:root{
  --bg:#05070f;
  --bg-2:#080d1a;
  --surface:rgba(255,255,255,.045);
  --surface-2:rgba(255,255,255,.075);
  --line:rgba(120,196,255,.16);
  --line-strong:rgba(120,196,255,.32);
  --text:#e8f1ff;
  --text-2:#a8bbd4;
  --text-3:#6f849f;
  --cyan:#22d3ee;
  --blue:#3b82f6;
  --violet:#8b5cf6;
  --grad:linear-gradient(120deg,#22d3ee 0%,#4f8cff 45%,#a855f7 100%);
  --radius:16px;
  --radius-sm:10px;
  --shadow:0 24px 60px rgba(0,0,0,.45);
  --glow:0 0 0 1px rgba(120,196,255,.18), 0 20px 60px -20px rgba(34,211,238,.35);
  --font:"Inter","Segoe UI","PingFang SC","Microsoft YaHei",system-ui,-apple-system,sans-serif;
  --mono:"JetBrains Mono","SF Mono",Consolas,"Courier New",monospace;
}

*{ -webkit-tap-highlight-color:transparent; }

html{ scroll-behavior:smooth; }

body{
  margin:0;
  background:
    radial-gradient(1200px 600px at 12% -8%, rgba(59,130,246,.16), transparent 60%),
    radial-gradient(900px 520px at 88% 0%, rgba(139,92,246,.14), transparent 62%),
    radial-gradient(1000px 700px at 50% 120%, rgba(34,211,238,.08), transparent 65%),
    var(--bg);
  color:var(--text);
  font-family:var(--font);
  font-size:15px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

/* 细网格背景质感 */
body::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
  background-image:
    linear-gradient(rgba(120,196,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(120,196,255,.045) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(circle at 50% 20%, #000 0%, transparent 75%);
  -webkit-mask-image:radial-gradient(circle at 50% 20%, #000 0%, transparent 75%);
}

body > *{ position:relative; z-index:1; }

a, a:link, a:visited, a:hover, a:active{ color:inherit; text-decoration:none; }

::selection{ background:rgba(34,211,238,.32); color:#fff; }

::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:#05070f; }
::-webkit-scrollbar-thumb{ background:linear-gradient(#22d3ee,#8b5cf6); border-radius:8px; }

/* 通用容器：拉宽到 1200 */
.container{ width:1200px; max-width:calc(100% - 48px); margin:0 auto; }

/* ============  头部  ============ */
.com-header{
  position:sticky;
  top:0;
  z-index:1000;
  min-width:0;
  width:100%;
  overflow:visible;
  background:rgba(5,7,15,.72);
  backdrop-filter:blur(18px) saturate(160%);
  -webkit-backdrop-filter:blur(18px) saturate(160%);
  border-bottom:1px solid rgba(120,196,255,.14);
  transition:background .3s ease, box-shadow .3s ease;
}
.com-header.is-scrolled{
  background:rgba(5,7,15,.92);
  box-shadow:0 12px 40px rgba(0,0,0,.5);
}
.com-header-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:1200px;
  max-width:calc(100% - 48px);
  height:auto;
  min-height:78px;
  padding:12px 0;
  margin:0 auto;
}
.com-header-top h2{
  float:none;
  height:auto;
  margin:0;
  line-height:0;
}
/* 品牌标识：渐变菱形标记 + 公司名文字（V1 方案） */
.brand{
  display:inline-flex;
  align-items:center;
  gap:13px;
  line-height:1;
}
.brand-mark{
  width:42px;
  height:42px;
  border-radius:11px;
  flex:0 0 auto;
  background:linear-gradient(135deg,rgba(34,211,238,.16),rgba(139,92,246,.16));
  box-shadow:inset 0 0 0 1px rgba(34,211,238,.45), 0 0 20px rgba(34,211,238,.25);
  display:flex;
  align-items:center;
  justify-content:center;
}
.brand-mark i{
  width:15px;
  height:15px;
  border-radius:4px;
  background:var(--grad);
  transform:rotate(45deg);
  box-shadow:0 0 14px rgba(34,211,238,.8);
}
.brand-text{
  display:flex;
  flex-direction:column;
  gap:5px;
}
.brand-cn{
  font-size:24px;
  font-weight:800;
  color:#fff;
  letter-spacing:.10em;
  line-height:1.1;
}
.brand-en{
  font-family:var(--mono);
  font-size:10.5px;
  letter-spacing:.42em;
  color:var(--text-3);
}
.com-header-right{ float:none; padding:0; height:auto; }
.com-header-right .com-header-tel{
  float:none;
  padding-left:26px;
  height:auto;
  line-height:1.4;
  font-family:var(--mono);
  font-size:17px;
  letter-spacing:.06em;
  color:var(--text-2);
  background:none;
}
.com-header-right .com-header-tel::before{
  content:"";
  display:inline-block;
  width:7px; height:7px;
  margin-right:10px;
  border-radius:50%;
  vertical-align:middle;
  background:var(--cyan);
  box-shadow:0 0 12px var(--cyan);
}
.com-header-box{
  height:auto;
  margin:0;
  background:none;
  border-top:1px solid rgba(120,196,255,.10);
}
.com-header-nav{
  width:1200px;
  max-width:calc(100% - 48px);
  margin:0 auto;
  display:flex;
  align-items:center;
}
.com-header-navOne{ display:none; }
.com-header-nav ul{
  display:flex;
  align-items:center;
  gap:6px;
  width:auto;
  margin:0;
  padding:8px 0;
  list-style:none;
}
.com-header-nav ul::before,
.com-header-nav ul::after{ display:none; content:none; }
.com-header-nav li{
  position:relative;
  float:none;
  flex:0 0 auto;
  padding:0;
  height:auto;
  line-height:1;
  text-align:left;
}
.com-header-nav li b{ display:none; }
.com-header-nav li a{
  display:block;
  padding:11px 18px;
  border-radius:999px;
  font-size:16px;
  font-weight:500;
  letter-spacing:.02em;
  color:var(--text-2);
  transition:color .25s, background .25s, box-shadow .25s;
}
.com-header-nav li a:hover{
  color:#fff;
  background:rgba(34,211,238,.10);
  box-shadow:inset 0 0 0 1px rgba(34,211,238,.28);
}
.com-header-nav li.is-active a{
  color:#fff;
  background:linear-gradient(120deg,rgba(34,211,238,.22),rgba(139,92,246,.22));
  box-shadow:inset 0 0 0 1px rgba(34,211,238,.45), 0 6px 20px -8px rgba(34,211,238,.6);
}

/* 移动端导航按钮 */
.nav-toggle{
  display:none;
  width:44px; height:38px;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--surface);
  cursor:pointer;
  padding:0;
}
.nav-toggle span{
  display:block;
  width:20px; height:2px;
  margin:4px auto;
  background:var(--text);
  border-radius:2px;
  transition:.3s;
}

/* ============  首页 Hero  ============ */
.hero{
  position:relative;
  overflow:hidden;
  min-height:600px;
  display:flex;
  align-items:center;
  border-bottom:1px solid rgba(120,196,255,.12);
  background:#05070f;
}
.hero-bg{
  position:absolute;
  inset:0;
  z-index:0;
  background-image:
    linear-gradient(100deg, #05070f 0%, rgba(5,7,15,.96) 30%, rgba(5,7,15,.62) 58%, rgba(5,7,15,.38) 100%),
    url("../project/temp1459.jpg");
  background-position:center right, center right;
  background-size:cover, cover;
  background-repeat:no-repeat, no-repeat;
  filter:saturate(.9);
}
.hero-bg::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(120,196,255,.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(120,196,255,.10) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(circle at 62% 50%, #000 0%, transparent 68%);
  -webkit-mask-image:radial-gradient(circle at 62% 50%, #000 0%, transparent 68%);
}
.hero-bg::after{
  content:"";
  position:absolute;
  right:-140px;
  top:-160px;
  width:820px;
  height:820px;
  border-radius:50%;
  background:
    radial-gradient(circle, rgba(34,211,238,.26) 0%, rgba(34,211,238,.10) 34%, transparent 66%),
    radial-gradient(circle at 32% 72%, rgba(139,92,246,.22) 0%, transparent 62%);
  pointer-events:none;
}
.hero-inner{
  position:relative;
  z-index:3;
  width:100%;
  padding:96px 0 104px;
}
.hero-inner .container{ pointer-events:auto; }
.hero-kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:7px 16px;
  border:1px solid rgba(34,211,238,.35);
  border-radius:999px;
  background:rgba(34,211,238,.06);
  font-family:var(--mono);
  font-size:12px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--cyan);
}
.hero-kicker::before{
  content:"";
  width:6px; height:6px;
  border-radius:50%;
  background:var(--cyan);
  box-shadow:0 0 10px var(--cyan);
}
.hero-title{
  margin:26px 0 0;
  font-size:60px;
  line-height:1.12;
  font-weight:700;
  letter-spacing:.01em;
  color:#fff;
  text-shadow:0 20px 60px rgba(0,0,0,.45);
}
.hero-title em{
  font-style:normal;
  background:var(--grad);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.hero-desc{
  margin:22px 0 0;
  max-width:600px;
  font-size:17px;
  line-height:1.85;
  color:var(--text-2);
}
.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:38px;
}
.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:14px 28px;
  border-radius:999px;
  font-size:15px;
  font-weight:600;
  letter-spacing:.02em;
  transition:transform .25s ease, box-shadow .25s ease, background .25s;
  cursor:pointer;
}
.btn-primary{
  color:#04121a;
  background:var(--grad);
  box-shadow:0 16px 40px -14px rgba(34,211,238,.8);
}
.btn-primary:hover{ transform:translateY(-2px); box-shadow:0 22px 50px -14px rgba(139,92,246,.85); }
.btn-ghost{
  color:var(--text);
  background:rgba(255,255,255,.04);
  box-shadow:inset 0 0 0 1px rgba(120,196,255,.3);
}
.btn-ghost:hover{ background:rgba(255,255,255,.09); transform:translateY(-2px); }
.btn .arrow{ font-family:var(--mono); }

.hero-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:0;
  margin-top:54px;
  max-width:660px;
  border-top:1px solid rgba(120,196,255,.18);
  padding-top:26px;
}
.hero-stats .stat{
  padding-right:24px;
  border-right:1px solid rgba(120,196,255,.14);
}
.hero-stats .stat:last-child{ border-right:0; }
.hero-stats .num{
  font-family:var(--mono);
  font-size:32px;
  line-height:1.1;
  font-weight:600;
  color:#fff;
}
.hero-stats .num small{
  font-size:14px;
  color:var(--cyan);
  margin-left:4px;
}
.hero-stats .label{
  margin-top:6px;
  font-size:13px;
  color:var(--text-3);
  letter-spacing:.08em;
}

/* ============  通用区块标题  ============ */
.z-n-h{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  height:auto;
  padding-bottom:14px;
  border-bottom:1px solid rgba(120,196,255,.16);
  margin-bottom:6px;
}
.z-n-h-t{ float:none; display:flex; align-items:baseline; gap:12px; }
.z-n-h-t .icon,
.z-n-h-t .icon_u{
  display:none;
}
.z-n-h-t .text{
  position:relative;
  padding-left:16px;
  font-size:24px;
  font-weight:700;
  letter-spacing:.02em;
  color:#fff;
}
.z-n-h-t .text::before{
  content:"";
  position:absolute;
  left:0; top:50%;
  width:4px; height:20px;
  margin-top:-10px;
  border-radius:2px;
  background:var(--grad);
}
.z-n-h-t .text-en{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--text-3);
}
.z-n-h-m{ float:none; height:auto; }
.z-n-h-m a{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  color:var(--text-2);
  transition:color .25s;
}
.z-n-h-m a:hover{ color:var(--cyan); }
.z-n-h-m .icon{
  display:none;
}
.z-n-h-m .text{ margin:0; font-size:13px; color:inherit; }
.z-n-h-m a::after{
  content:"→";
  font-family:var(--mono);
  transition:transform .25s;
}
.z-n-h-m a:hover::after{ transform:translateX(4px); }

/* ============  首页：新闻 + 公司概况  ============ */
.z-bottom{
  display:flex;
  gap:24px;
  margin:72px 0 0;
}
.z-c-left{ float:none; flex:1 1 auto; min-width:0; width:auto; }
.z-c-right{ float:none; flex:0 0 360px; width:360px; }
.z-c-right .zd-content{
  width:auto;
  height:auto;
  max-height:none;
  margin-top:20px;
  padding:22px 24px;
  font-size:14px;
  line-height:1.9;
  text-indent:0;
  color:var(--text-2);
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius);
}
.z-l-c{ display:flex; gap:22px; margin-top:22px; }
.z-l-c .zn-img{
  float:none;
  flex:0 0 320px;
  width:320px; height:220px;
  margin:0;
  border-radius:var(--radius);
  overflow:hidden;
  border:1px solid var(--line);
}
.z-l-c .zn-img img{
  width:100%; height:100%;
  object-fit:cover;
  transition:transform .6s ease;
}
.z-l-c .zn-img:hover img{ transform:scale(1.06); }
.z-l-c .zn-list{
  float:none;
  flex:1 1 auto;
  width:auto;
  margin:0;
}
.z-l-c .zn-list li{
  width:auto;
  height:auto;
  padding:13px 0;
  border-bottom:1px dashed rgba(120,196,255,.14);
  font-size:14px;
  line-height:1.6;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.z-l-c .zn-list li a{
  display:flex;
  gap:12px;
  color:var(--text-2);
  transition:color .25s;
}
.z-l-c .zn-list li a::before{
  content:"";
  flex:0 0 auto;
  width:6px; height:6px;
  margin-top:12px;
  border-radius:50%;
  background:rgba(34,211,238,.5);
}
.z-l-c .zn-list li a:hover{ color:var(--cyan); }
.z-l-c .zn-list li a:hover::before{ background:var(--cyan); box-shadow:0 0 10px var(--cyan); }

/* 核心能力卡片 */
.cap-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  margin-top:26px;
}
.cap-card{
  position:relative;
  padding:30px 28px 34px;
  border-radius:var(--radius);
  background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.02));
  border:1px solid var(--line);
  overflow:hidden;
  transition:transform .35s ease, border-color .35s, box-shadow .35s;
}
.cap-card::before{
  content:"";
  position:absolute;
  inset:-1px;
  background:radial-gradient(400px 200px at 50% -20%, rgba(34,211,238,.22), transparent 70%);
  opacity:0;
  transition:opacity .35s;
}
.cap-card:hover{
  transform:translateY(-6px);
  border-color:var(--line-strong);
  box-shadow:var(--shadow);
}
.cap-card:hover::before{ opacity:1; }
.cap-card .idx{
  font-family:var(--mono);
  font-size:12px;
  letter-spacing:.2em;
  color:var(--text-3);
}
.cap-card h3{
  margin:14px 0 12px;
  font-size:19px;
  font-weight:600;
  color:#fff;
}
.cap-card p{
  margin:0;
  font-size:14px;
  line-height:1.85;
  color:var(--text-2);
}
.cap-card .link{
  display:inline-flex;
  gap:8px;
  align-items:center;
  margin-top:20px;
  font-size:13px;
  color:var(--cyan);
}
.cap-card .link::after{ content:"→"; font-family:var(--mono); }

/* ============  实施案例卡片  ============ */
.z-zz{ margin:72px 0 0; }
.z-p-container{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
  margin:26px 0 0;
}
.z-p-container .item{
  float:none;
  width:auto;
  margin:0 !important;
  border-radius:var(--radius);
  overflow:hidden;
  border:1px solid var(--line);
  background:var(--surface);
  transition:transform .4s ease, box-shadow .4s, border-color .4s;
}
.z-p-container .item:hover{
  transform:translateY(-6px);
  border-color:var(--line-strong);
  box-shadow:var(--shadow);
}
.z-p-container .item .item-img{
  position:relative;
  width:100%;
  height:240px;
  margin:0;
  overflow:hidden;
}
.z-p-container .item .item-img::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 45%,rgba(5,7,15,.85) 100%);
}
.z-p-container .item .item-img img{
  display:block;
  width:100%;
  height:100%;
  margin:0 !important;
  object-fit:cover;
  transition:transform .7s ease;
}
.z-p-container .item:hover .item-img img{ transform:scale(1.05); margin:0 !important; }
.z-p-container .item .item-text{
  padding:18px 20px 20px;
  text-align:left;
  font-size:16px;
  font-weight:600;
  color:#fff;
}
.z-p-container .item .item-text::before{
  content:"METRO CASE";
  display:block;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.22em;
  color:var(--text-3);
  margin-bottom:8px;
}

/* ============  友情链接  ============ */
.z-link{ margin:72px 0 0; }
.z-link-content{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  margin:26px 0 0;
}
.z-link-img{
  float:none;
  display:flex;
  align-items:center;
  justify-content:center;
  width:auto;
  height:auto;
  margin:0 !important;
  padding:14px 20px;
  border-radius:14px;
  background:var(--surface);
  border:1px solid var(--line);
  transition:border-color .3s, transform .3s, box-shadow .3s;
}
.z-link-img:hover{
  transform:translateY(-3px);
  border-color:var(--line-strong);
  box-shadow:0 18px 40px -20px rgba(34,211,238,.5);
}
.z-link-img img{
  width:auto !important;
  height:36px !important;
  max-width:130px;
  object-fit:contain;
  filter:brightness(1.05);
}

/* ============  内页：banner  ============ */
.contact-banner{
  position:relative;
  overflow:hidden;
  width:100%;
  min-width:0;
  height:200px;
  background:
    linear-gradient(120deg,rgba(34,211,238,.22),rgba(139,92,246,.22)),
    linear-gradient(180deg,#070b16,#0a1020);
}
.contact-banner img{ display:none; }
.contact-banner::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(120,196,255,.12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(120,196,255,.12) 1px, transparent 1px);
  background-size:44px 44px;
  mask-image:radial-gradient(circle at 30% 50%, #000, transparent 72%);
  -webkit-mask-image:radial-gradient(circle at 30% 50%, #000, transparent 72%);
}
.contact-banner::after{
  content:"";
  position:absolute;
  right:-60px; top:-80px;
  width:420px; height:420px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(139,92,246,.45), transparent 65%);
  filter:blur(10px);
}
.tb-hero{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  justify-content:center;
  height:100%;
  width:1200px;
  max-width:calc(100% - 48px);
  margin:0 auto;
}
.tb-hero .kicker{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.26em;
  text-transform:uppercase;
  color:rgba(34,211,238,.9);
}
.tb-hero h1{
  margin:12px 0 0;
  font-size:34px;
  line-height:1.2;
  font-weight:700;
  color:#fff;
  letter-spacing:.02em;
}
.tb-hero .line{
  width:56px; height:2px;
  margin-top:16px;
  background:var(--grad);
}
.tb-hero .crumb{
  margin-top:16px;
  font-size:13px;
  color:var(--text-3);
}
.tb-hero .crumb a{ color:var(--text-2); }
.tb-hero .crumb a:hover{ color:var(--cyan); }
.tb-hero .crumb span{ margin:0 8px; color:var(--text-3); }

/* 内页：隐藏原面包屑（标题已上移） */
.contact-content > .contact-nav-top{ display:none; }

/* ============  内页：布局  ============ */
.contact-content{
  width:1200px;
  max-width:calc(100% - 48px);
  margin:0 auto;
  padding:56px 0 20px;
}
.contact-bottom-list{
  display:flex;
  gap:32px;
  align-items:flex-start;
}
.contact-left-nav{
  float:none;
  flex:0 0 260px;
  width:260px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
  overflow:hidden;
  position:sticky;
  top:110px;
}
.contact-left-title{
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 22px;
  height:56px;
  line-height:56px;
  font-size:16px;
  font-weight:600;
  color:#fff;
  background:linear-gradient(120deg,rgba(34,211,238,.18),rgba(139,92,246,.16));
  border-bottom:1px solid var(--line);
}
.contact-left-title img{
  width:18px; height:18px;
  margin:0;
  filter:brightness(0) invert(1);
  opacity:.85;
}
.contact-left-title span{ display:inline-block; }
.contact-left-list{
  width:100%;
  padding:10px 12px 16px;
}
.contact-left-list li{
  position:relative;
  padding-left:22px;
  width:100%;
  height:auto;
  line-height:1.5;
  border-bottom:0;
  border-radius:10px;
  transition:background .25s;
}
.contact-left-list li + li{ margin-top:2px; }
.contact-left-list li b{
  left:10px;
  top:50%;
  margin-top:-3px;
  width:6px; height:6px;
  background:var(--text-3);
  transition:background .25s, box-shadow .25s;
}
.contact-left-list li a{
  display:block;
  padding:11px 0;
  font-size:14px;
  color:var(--text-2);
  transition:color .25s;
}
.contact-left-list li:hover{ background:rgba(120,196,255,.07); }
.contact-left-list li:hover a{ color:#fff; }
.contact-left-list li:hover b{ background:var(--cyan); }
.contact-left-list .list-active{
  background:linear-gradient(120deg,rgba(34,211,238,.14),rgba(139,92,246,.10));
  box-shadow:inset 0 0 0 1px rgba(34,211,238,.3);
}
.contact-left-list .list-active a{ color:#fff; font-weight:600; }
.contact-left-list .list-active b,
.contact-left-list .contact-left-listOn b{
  background:var(--cyan);
  box-shadow:0 0 10px rgba(34,211,238,.9);
}
.contact-left-list .contact-left-listOn{ background:rgba(120,196,255,.07); }
.contact-right-text{
  float:none;
  flex:1 1 auto;
  width:auto;
  min-width:0;
}
.contact-right-title{
  height:auto;
  padding-bottom:0;
  border-bottom:0;
  margin-bottom:8px;
}
.contact-right-title h2{
  height:auto;
  line-height:1.3;
  text-align:left;
  font-size:26px;
  font-weight:700;
  color:#fff;
  letter-spacing:.02em;
}
.contact-right-title b{
  display:none;
}

/* 正文排版 */
.about-index-content{
  margin:18px 0 70px;
  font-size:15px;
  line-height:2;
  text-indent:0;
  text-align:left;
  color:var(--text-2);
}
.about-index-content p{
  margin:0 0 18px;
  text-indent:2em;
}
.about-index-content p:last-child{ margin-bottom:0; }
.about-index-content br{ line-height:2; }
.about-index-content img{
  display:block;
  max-width:100%;
  height:auto;
  margin:22px auto;
  border-radius:12px;
  border:1px solid var(--line);
}
.about-index-content table{
  width:100% !important;
  max-width:820px;
  table-layout:fixed;
  margin:20px auto;
  border-collapse:separate;
  border-spacing:14px;
  background:transparent;
}
.about-index-content table td{
  padding:0;
  vertical-align:middle;
  text-align:center;
}
.about-index-content table img{
  margin:0 auto;
  width:auto !important;
  max-width:100%;
  height:280px !important;
  object-fit:contain;
  background:rgba(255,255,255,.03);
  border-radius:14px;
}
.about-index-content table td:nth-child(2){ width:14px; }

/* 联系我们信息块 */
.contact-link-detail{
  margin:8px 0 0;
  padding:26px 28px;
  font-size:15px;
  line-height:2.1;
  color:var(--text);
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius);
}
.contact-link-detail dd{
  position:relative;
  padding-left:20px;
}
.contact-link-detail dd::before{
  content:"";
  position:absolute;
  left:0; top:50%;
  width:6px; height:6px;
  margin-top:-3px;
  border-radius:50%;
  background:rgba(34,211,238,.65);
}
#map{
  margin:26px auto 60px !important;
  width:100% !important;
  max-width:100%;
  height:460px !important;
  border-radius:var(--radius);
  overflow:hidden;
  border:1px solid var(--line);
  background:var(--surface);
}
#map > div,
#map .BMap_cpyCtrl,
#map .anchorBL{ filter:invert(1) hue-rotate(180deg) brightness(.82) contrast(.92) saturate(.55); }
#map .BMap_mask,
#map .BMap_pop,
#map .BMap_bubble_content,
#map .BMap_bubble_title,
#map .BMap_infowindow{ filter:none !important; }

/* ============  新闻列表  ============ */
.common-list-container{ margin-top:14px; }
.common-list-container ul{
  margin:0 0 30px;
  width:100%;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.common-list-container ul::before,
.common-list-container ul::after{ display:none; content:none; }
.common-list-container ul li{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  width:100%;
  height:auto;
  padding:0;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--surface);
  transition:border-color .3s, background .3s, transform .3s;
}
.common-list-container ul li:hover{
  border-color:var(--line-strong);
  background:rgba(34,211,238,.06);
  transform:translateX(4px);
}
.common-list-container ul li > a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  width:100%;
  padding:16px 22px;
  text-decoration:none;
}
.common-list-container ul li > a > span:empty{
  display:none;
}
.common-list-container ul li .list-name{
  float:none;
  flex:1 1 auto;
  min-width:0;
  width:auto;
  height:auto;
  line-height:1.55;
  font-size:15px;
  color:var(--text);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.common-list-container ul li .list-date{
  float:none;
  flex:0 0 auto;
  height:auto;
  line-height:1.5;
  font-family:var(--mono);
  font-size:13px;
  letter-spacing:.04em;
  color:var(--text-3);
}

/* 分页 */
.pagination-container{ margin:30px 0 70px; padding-left:0; font-size:0; }
.pagination-container .pagination{ height:auto; line-height:1.4; padding:0; text-align:left; }
.pagination-container .pagination a,
.pagination-container .pagination b,
.pagination-container span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:36px;
  height:36px;
  padding:0 8px;
  margin:0 8px 0 0;
  border:1px solid var(--line) !important;
  border-radius:10px;
  background:none !important;
  background-color:transparent !important;
  box-shadow:none !important;
  color:var(--text-2) !important;
  font-family:var(--mono);
  font-size:13px !important;
  line-height:1 !important;
  transition:.25s;
}
.pagination-container .pagination a:hover{
  border-color:var(--line-strong) !important;
  color:#fff !important;
  background:rgba(34,211,238,.08) !important;
}
.pagination-container .pagination b,
.pagination-container span.active{
  color:#fff !important;
  border-color:transparent !important;
  background:var(--grad) !important;
}
.pagination-container .pagination a b{
  background:none !important;
  color:var(--text-3) !important;
  border:0 !important;
}
.pagination-container .pagination a.page-total{
  border:0 !important;
  color:var(--text-3) !important;
  font-family:var(--font);
  font-size:13px !important;
  letter-spacing:.02em;
  padding:0 6px 0 0;
}

/* ============  新闻详情  ============ */
.news-detail-container{ margin-bottom:60px; }
.news-detail-container .title{
  position:relative;
  text-align:left;
  font-size:26px;
  line-height:1.4;
  font-weight:700;
  color:#fff;
  border-bottom:0;
  padding:0 0 18px;
  margin:0 0 16px;
}
.news-detail-container .title::after{
  content:"";
  position:absolute;
  left:0; bottom:0;
  width:100%; height:1px;
  background:linear-gradient(90deg, rgba(34,211,238,.65), rgba(139,92,246,.25), transparent);
}
.news-detail-container .des{
  text-align:left;
  font-family:var(--mono);
  font-size:13px;
  color:var(--text-3);
  margin-bottom:22px;
}
.news-detail-container .content{
  font-size:15px;
  line-height:2;
  color:var(--text-2);
}
.news-detail-container .content p{ margin:0 0 18px; text-indent:2em; }
.news-detail-container .content img{
  display:block;
  max-width:100%;
  height:auto;
  margin:24px auto;
  border-radius:14px;
  border:1px solid var(--line);
}
.news-detail-container .content div[style*="text-align: center"]{
  font-size:13px;
  color:var(--text-3);
}
.news-detail-container .content h3{
  margin:30px 0 12px;
  padding-left:12px;
  border-left:3px solid;
  border-image:linear-gradient(180deg,#22d3ee,#8b5cf6) 1;
  font-size:17px;
  font-weight:700;
  color:#fff;
}
/* 新闻详情配图 */
.news-imgs{
  margin-top:28px;
  display:grid;
  gap:18px;
}
.news-imgs .news-img{ margin:0; }
.news-imgs img{
  display:block;
  width:100%;
  max-width:860px;
  margin:0 auto;
  border-radius:12px;
  border:1px solid rgba(120,196,255,.18);
  box-shadow:0 18px 44px -18px rgba(0,0,0,.6);
}

/* 纯文本行首缩进块：行首两个TAB（或两个全角空格）开头的行 */
.news-detail-container .content .plist{
  margin:4px 0;
  padding-left:2.5em;
}
.news-detail-container .content .plist div{ line-height:1.9; }

.news-back{ margin:0 0 70px; }
.news-back a{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-family:var(--mono);
  font-size:13px;
  color:var(--text-3);
  transition:color .25s;
}
.news-back a:hover{ color:var(--cyan); }

/* ============  页脚  ============ */
.footer-box{
  margin-top:80px;
  min-width:0;
  height:auto;
  background:linear-gradient(180deg, rgba(8,13,26,0), rgba(8,13,26,.9));
  border-top:1px solid rgba(120,196,255,.12);
}
.footer-box .footer-center{
  width:1200px;
  max-width:calc(100% - 48px);
  margin:0 auto;
  padding:38px 0 34px;
  text-align:center;
}
.footer-des{
  margin:0 !important;
  font-size:13px;
  line-height:2;
  color:var(--text-3);
}
.footer-des a{ color:var(--text-2); }
.footer-des a:hover{ color:var(--cyan); }
.footer-logo{ display:none; }
.footer-box::after{
  content:"BONIN TECH  ·  SOFTWARE DEFINED TRANSIT";
  display:block;
  padding:0 0 26px;
  text-align:center;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.3em;
  color:rgba(111,132,159,.45);
}

/* ============  动效  ============ */
.reveal{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .75s cubic-bezier(.16,.8,.3,1), transform .75s cubic-bezier(.16,.8,.3,1);
}
.reveal.is-in{
  opacity:1;
  transform:none;
}
@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1 !important; transform:none !important; }
  html{ scroll-behavior:auto; }
}

/* ============  响应式  ============ */
@media (max-width:1240px){
  .container,
  .com-header-top,
  .com-header-nav,
  .tb-hero,
  .contact-content,
  .footer-box .footer-center{ width:auto; max-width:none; margin-left:24px; margin-right:24px; }
  .hero .z-swiper-container .swiper-pagination{ padding-left:24px; }
}

@media (max-width:1024px){
  .hero-title{ font-size:44px; }
  .z-bottom{ flex-direction:column; }
  .z-c-right{ flex:1 1 auto; width:auto; }
  .z-l-c .zn-img{ flex:0 0 280px; width:280px; height:190px; }
  .z-p-container{ grid-template-columns:repeat(2,1fr); }
  .cap-grid{ grid-template-columns:1fr; }
  .contact-bottom-list{ flex-direction:column; gap:24px; align-items:stretch; }
  .contact-right-text{ flex:0 0 auto; width:100%; min-width:0; }
  .contact-left-nav{ position:static; width:100%; flex:1 1 auto; }
}

@media (max-width:860px){
  .com-header-top{ min-height:66px; }
  .com-header-top h2 img{ height:32px; padding:5px 9px; }
  .com-header-right .com-header-tel{ font-size:14px; }
  .nav-toggle{ display:block; }
  .com-header-box{
    max-height:0;
    overflow:hidden;
    transition:max-height .35s ease;
    border-top:0;
    background:rgba(5,7,15,.96);
  }
  .com-header.is-open .com-header-box{ max-height:420px; border-top:1px solid var(--line); }
  .com-header-nav{ margin:0 24px; }
  .com-header-nav ul{
    flex-direction:column;
    align-items:stretch;
    gap:2px;
    padding:12px 0 18px;
  }
  .com-header-nav li a{ padding:12px 14px; border-radius:10px; }

  .hero{ min-height:0; display:block; }
  .hero-inner{ padding:64px 0 56px; }
  .hero-inner .container{ max-width:none; margin:0 24px; }
  .hero-title{ font-size:34px; margin-top:20px; }
  .hero-desc{ font-size:15px; }
  .hero-stats{ grid-template-columns:1fr; gap:18px; margin-top:36px; }
  .hero-stats .stat{ border-right:0; padding-right:0; }
  .hero-bg{
    background-image:
      linear-gradient(180deg, rgba(5,7,15,.95) 0%, rgba(5,7,15,.88) 46%, rgba(5,7,15,.97) 100%),
      url("../project/temp1459.jpg");
    background-position:center, center;
  }
  .hero-bg::after{ width:420px; height:420px; right:-120px; top:-80px; }

  .z-n-h{ position:relative; display:block; padding-bottom:20px; }
  .z-n-h-t{ display:block; }
  .z-n-h-t .text{ display:block; font-size:21px; }
  .z-n-h-t .text-en{ display:block; margin-top:8px; }
  .z-n-h-m{ position:absolute; right:0; top:2px; }
  .z-bottom{ margin-top:48px; }
  .z-l-c{ flex-direction:column; }
  .z-l-c .zn-img{ flex:1 1 auto; width:100%; height:200px; }
  .z-p-container{ grid-template-columns:1fr; }
  .contact-content{ padding-top:36px; }
  .tb-hero h1{ font-size:26px; }
  .contact-banner{ height:170px; }
  .about-index-content table{ border-spacing:8px; }
  .about-index-content table img{ max-width:220px; }
}

@media (max-width:560px){
  .hero-title{ font-size:28px; }
  .btn{ padding:12px 22px; font-size:14px; }
  .about-index-content,
  .news-detail-container .content{ font-size:14px; }
  .contact-right-title h2{ font-size:22px; }
  .hero-desc{ max-width:none; }
  .brand{ gap:10px; }
  .brand-mark{ width:36px; height:36px; border-radius:10px; }
  .brand-mark i{ width:13px; height:13px; }
  .brand-cn{ font-size:20px; white-space:nowrap; }
  .brand-en{ font-size:9px; letter-spacing:.34em; }
  .com-header-right{ display:none; }
}