/* ==========================================================================
   玄甲科技 / BLACKARMOR LABS — 品牌视觉层
   --------------------------------------------------------------------------
   品牌立意：「玄」者黑也，「甲」者护也。古之玄甲军以玄铁札甲护身，
   片片相缀、密不透风；今之玄甲科技以同样的编缀逻辑造实验装备——
   每一片甲是一道工序，每一处铆是一次检验，整阵列即一份可追溯的交付。

   视觉母题：札甲片（八边切角）+ 编缀铆线 + 朱砂封印
   60-30-10：玄黑 60% · 铁面 / 暖纸白 30% · 玄金 / 朱砂 10%
   单一难忘元素：首屏 ARMOR MATRIX 玄甲阵列（扫描点亮 + 中央朱印）
   字体：Cinzel（罗马碑铭）/ Bebas Neue（军工宽体）/ Noto Serif SC（宋体碑铭）
         / Noto Sans SC（正文）/ IBM Plex Mono（数据）
   本地化：内网部署请把 Google Fonts 下载到 fonts/ 后改为 @font-face
   本文件必须最后加载，用于覆盖前序样式表的颜色与形状。
   ========================================================================== */

:root {
  --ink: #07080A;
  --surface: #101318;
  --surface-2: #181D24;
  --signal: #D9A441;              /* 玄金：甲片铆线、编号、强调 */
  --copper: #C5342B;              /* 朱砂：封印、主 CTA、警戒 */
  --paper: #EDE7DA;
  --text-hi: #E9E4D8;
  --text-dim: #8A8B8E;
  --steel: #A9B4BE;               /* 冷钢银：辅助线与数据 */
  --line: rgba(168, 178, 190, .16);
  --grid: rgba(217, 164, 65, .075);
  --grid-strong: rgba(217, 164, 65, .16);
  --jade-dim: rgba(217, 164, 65, .13);

  --font-display: "Cinzel", "Noto Serif SC", "Songti SC", "STSong", serif;
  --font-mega: "Bebas Neue", "Cinzel", "Impact", sans-serif;
  --font-stamp: "Noto Serif SC", "Songti SC", "STSong", "SimSun", serif;
  --font-body: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-mono: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;

  /* 甲片切角：八边形，取自札甲片轮廓 */
  --cut: polygon(10px 0, calc(100% - 10px) 0, 100% 10px, 100% calc(100% - 10px),
                 calc(100% - 10px) 100%, 10px 100%, 0 calc(100% - 10px), 0 10px);

  --bs-body-color: #E9E4D8;
  --bs-body-bg: #07080A;
  --bs-heading-color: #E9E4D8;
  --bs-light-rgb: 16, 19, 24;
  --bs-white-rgb: 16, 19, 24;
  --bs-dark-rgb: 237, 231, 218;
  --bs-secondary-rgb: 138, 139, 142;
  --bs-primary-rgb: 217, 164, 65;
  --bs-border-color: rgba(168, 178, 190, .18);
  --bs-border-color-translucent: rgba(168, 178, 190, .18);
  --bs-emphasis-color-rgb: 233, 228, 216;
  --bs-link-color: #D9A441;
  --bs-link-hover-color: #C5342B;
}

/* ---------------------------------------------------------------- 全局氛围 */
body {
  background:
    radial-gradient(1000px 560px at 78% -14%, rgba(217, 164, 65, .085), transparent 60%),
    radial-gradient(760px 620px at 4% 46%, rgba(197, 52, 43, .045), transparent 66%),
    repeating-linear-gradient(90deg, rgba(217, 164, 65, .022) 0 1px, transparent 1px 96px),
    var(--ink);
  color: var(--text-hi);
  font-family: var(--font-body);
}

/* 甲片鳞纹：叠在每个区块上，密度极低，只做质感不做干扰 */
.bl-section::before,
.ba-creed::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    repeating-linear-gradient(135deg, rgba(217, 164, 65, .028) 0 1px, transparent 1px 26px),
    repeating-linear-gradient(45deg, rgba(168, 178, 190, .018) 0 1px, transparent 1px 26px);
  mask-image: linear-gradient(to bottom, transparent, #000 18%, #000 82%, transparent);
  opacity: .7;
}
.bl-section, .ba-creed { position: relative; }
.bl-section > *, .ba-creed > * { position: relative; z-index: 1; }

::selection { background: var(--copper); color: #fff; }

:focus-visible {
  outline: 2px solid var(--signal);
  outline-offset: 3px;
}

/* ------------------------------------------------------------ 甲片切角母题 */
.ba-cut { clip-path: var(--cut); }

.bl-btn,
.bl-chip,
.bl-form,
.bl-inquiry,
.bl-console,
.bl-pcard,
.bl-card,
.bl-readout,
.bl-spec,
.bl-tile,
.bl-field input,
.bl-field select,
.bl-field textarea,
.bl-filters__item,
.bl-pager a,
.bl-page-top,
.bl-reply,
.bl-account__nav,
.bl-data {
  border-radius: 0 !important;
}

.bl-btn,
.bl-chip,
.bl-form,
.bl-inquiry,
.bl-console,
.bl-pcard,
.bl-card,
.bl-tile,
.bl-readout,
.bl-spec,
.bl-filters__item,
.bl-pager a,
.bl-reply,
.bl-page-top {
  clip-path: var(--cut);
}

/* 铆钉：切角容器右上角的两点，模拟甲片编缀 */
.bl-form::after,
.bl-console::after,
.ba-armor::after {
  content: "";
  position: absolute;
  top: 10px; right: 12px;
  width: 3px; height: 3px;
  background: var(--signal);
  box-shadow: -8px 0 0 rgba(217, 164, 65, .45), 0 8px 0 rgba(217, 164, 65, .45);
  opacity: .8;
  pointer-events: none;
}
.bl-form, .bl-console, .ba-armor { position: relative; }

/* ------------------------------------------------------------------ 导航 */
.bl-nav {
  background: rgba(7, 8, 10, .90);
  border-bottom: 1px solid rgba(217, 164, 65, .24);
  backdrop-filter: blur(14px);
}
.bl-nav::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--signal) 18%, transparent 42%,
                              var(--copper) 78%, transparent);
  opacity: .55;
  pointer-events: none;
}
.bl-brand { gap: 12px; }
.ba-brand__mark {
  width: 32px; height: 36px;
  flex: 0 0 auto;
  filter: drop-shadow(0 0 10px rgba(217, 164, 65, .28));
}
.bl-brand__mark {
  font-family: var(--font-mega);
  font-size: 27px;
  letter-spacing: .10em;
  line-height: 1;
  color: var(--text-hi);
}
.bl-brand__mark span { color: var(--signal); }
.bl-brand__sub {
  border-left: 1px solid rgba(217, 164, 65, .4);
  padding-left: 12px;
  font-family: var(--font-mono);
  font-size: 9px;
  letter-spacing: .12em;
  line-height: 1.65;
  color: var(--text-dim);
  text-transform: uppercase;
}
.bl-nav__link { letter-spacing: .04em; }
.bl-nav__link:hover, .bl-nav__link.is-active { color: var(--signal); }
.bl-lang {
  border: 1px solid rgba(217, 164, 65, .45);
  color: var(--signal);
  clip-path: var(--cut);
}
.bl-nav__cta, .bl-btn--copper {
  background: var(--copper);
  border-color: var(--copper);
  color: #fff;
}
.bl-nav__cta:hover, .bl-btn--copper:hover {
  background: #E04436; border-color: #E04436; color: #fff;
}
.bl-btn {
  background: var(--signal);
  border-color: var(--signal);
  color: #0B0A07;
  font-weight: 600;
}
.bl-btn:hover { background: #EFC46C; border-color: #EFC46C; color: #0B0A07; }
.bl-btn--ghost { background: transparent; border-color: rgba(217, 164, 65, .5); color: var(--signal); }
.bl-btn--ghost:hover { background: rgba(217, 164, 65, .10); color: #EFC46C; }
.bl-chip { border-color: rgba(168, 178, 190, .28); color: var(--text-dim); }
.bl-chip:hover { border-color: var(--signal); color: var(--signal); }
.bl-progress { background: linear-gradient(90deg, var(--copper), var(--signal)); height: 2px; }

/* -------------------------------------------------------------- 首屏重铸 */
.bl-hero {
  position: relative;
  overflow: hidden;
  padding: 0;
  border-bottom: 1px solid rgba(217, 164, 65, .18);
}
/* 基础层的底部遮罩太重，会盖住巨型描边字；这里减弱并让它退到文字下方 */
.bl-hero::after {
  background: linear-gradient(180deg, transparent 64%, rgba(7, 8, 10, .52) 100%);
  z-index: 0;
}
.bl-hero__grid { padding: 96px 0 88px; }
.bl-hero::before {
  content: "";
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(217, 164, 65, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(217, 164, 65, .055) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(ellipse 80% 76% at 62% 42%, #000, transparent 78%);
  pointer-events: none;
}
/* 巨型镂空字：排版冲击力，允许溢出容器 */
.ba-mega {
  position: absolute;
  left: -2.2vw;
  bottom: -1.6vw;
  margin: 0;
  font-family: var(--font-mega);
  font-size: clamp(150px, 20vw, 310px);
  line-height: .8;
  letter-spacing: -.01em;
  white-space: nowrap;
  color: transparent;
  -webkit-text-stroke: 1.2px rgba(217, 164, 65, .34);
  text-stroke: 1.2px rgba(217, 164, 65, .34);
  pointer-events: none;
  user-select: none;
  z-index: 1;
}
.bl-hero__grid { position: relative; z-index: 1; align-items: center; }
.bl-hero h1 {
  font-family: var(--font-display);
  font-weight: 700;
  letter-spacing: -.02em;
  text-shadow: 0 8px 40px rgba(0, 0, 0, .55);
}
.bl-hero h1 em { font-style: normal; color: var(--signal); }
.bl-hero h1 .bl-outline,
.bl-outline {
  color: transparent !important;
  -webkit-text-stroke: 1.4px var(--signal);
  text-stroke: 1.4px var(--signal);
  text-shadow: none;
}
.bl-eyebrow {
  font-family: var(--font-mono);
  color: var(--signal);
  letter-spacing: .22em;
}
.bl-eyebrow::before {
  content: "";
  display: inline-block;
  width: 7px; height: 7px;
  margin-right: 10px;
  background: var(--copper);
  transform: rotate(45deg);
  vertical-align: middle;
}
.bl-hero__sub { color: var(--steel); }
.bl-audience__label { font-family: var(--font-mono); letter-spacing: .16em; }

/* ------------------------------------------------- ARMOR MATRIX 玄甲阵列 */
.ba-armor {
  background: linear-gradient(155deg, #11161C 0%, #080A0D 62%, #14120C 100%);
  border: 1px solid rgba(217, 164, 65, .34);
  clip-path: var(--cut);
  box-shadow: 0 40px 100px rgba(0, 0, 0, .65), inset 0 0 60px rgba(217, 164, 65, .045);
  overflow: hidden;
}
.ba-armor__head,
.ba-armor__foot {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px;
  padding: 13px 18px;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--text-dim);
  background: rgba(7, 8, 10, .62);
}
.ba-armor__head { border-bottom: 1px solid rgba(217, 164, 65, .20); }
.ba-armor__foot { border-top: 1px solid rgba(217, 164, 65, .20); }
.ba-armor__head b { color: var(--signal); font-weight: 500; }
.ba-armor__status { color: var(--copper); }
.ba-armor__status::before {
  content: ""; display: inline-block;
  width: 6px; height: 6px; margin-right: 8px;
  background: var(--copper); border-radius: 50%;
  box-shadow: 0 0 10px var(--copper);
  animation: ba-pulse 2.2s ease-in-out infinite;
}
@keyframes ba-pulse { 0%,100% { opacity: 1; } 50% { opacity: .32; } }

.ba-armor__stage {
  position: relative;
  padding: 18px;
  background:
    radial-gradient(circle at 50% 48%, rgba(217, 164, 65, .10), transparent 58%),
    repeating-linear-gradient(90deg, rgba(217, 164, 65, .035) 0 1px, transparent 1px 28px);
}
.ba-armor__svg { display: block; width: 100%; height: auto; }

/* 单片甲：暗铁底 + 玄金细描边；点亮时转为玄金甲 */
.ba-plate__body {
  fill: #12171D;
  stroke: rgba(217, 164, 65, .26);
  stroke-width: 1;
  transition: fill .32s ease, stroke .32s ease;
}
.ba-plate__ridge {
  stroke: rgba(217, 164, 65, .16);
  stroke-width: 1;
  fill: none;
  transition: stroke .32s ease;
}
.ba-plate__rivet {
  fill: rgba(217, 164, 65, .34);
  transition: fill .32s ease;
}
.ba-plate.is-lit .ba-plate__body {
  fill: #2B2415;
  stroke: #D9A441;
  stroke-width: 1.35;
}
.ba-plate.is-lit .ba-plate__ridge { stroke: rgba(239, 196, 108, .72); }
.ba-plate.is-lit .ba-plate__rivet { fill: #EFC46C; }
.ba-plate.is-hot .ba-plate__body { fill: #4A3A18; stroke: #F4D48A; }

/* 中央朱砂封印：东方品牌符号，与工业甲片形成古今对撞 */
.ba-armor__seal {
  position: absolute;
  top: 50%; left: 50%;
  width: 92px; height: 92px;
  transform: translate(-50%, -50%) rotate(-7deg);
  background: var(--copper);
  clip-path: polygon(6% 2%, 96% 0, 100% 92%, 92% 100%, 2% 98%, 0 8%);
  box-shadow: 0 0 0 5px rgba(7, 8, 10, .55), 0 22px 50px rgba(0, 0, 0, .7);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-stamp);
  font-size: 54px;
  font-weight: 900;
  line-height: 1;
  color: #F6EDE0;
  text-shadow: 0 2px 8px rgba(0, 0, 0, .3);
  z-index: 3;
}
.ba-armor__seal::before {
  content: "";
  position: absolute; inset: 7px;
  border: 1.5px solid rgba(246, 237, 224, .62);
  clip-path: polygon(5% 3%, 95% 0, 100% 94%, 93% 100%, 2% 97%, 0 6%);
}
.ba-armor__seal small {
  position: absolute;
  bottom: 8px;
  font-family: var(--font-mono);
  font-size: 7px;
  letter-spacing: .12em;
  font-weight: 400;
}
.ba-armor__scan {
  position: absolute;
  top: 0; bottom: 0;
  width: 90px;
  left: -90px;
  background: linear-gradient(90deg, transparent, rgba(217, 164, 65, .13) 55%, rgba(239, 196, 108, .30) 88%, transparent);
  border-right: 1px solid rgba(239, 196, 108, .55);
  mix-blend-mode: screen;
  pointer-events: none;
  z-index: 2;
}
.ba-armor__caption {
  position: relative;
  z-index: 3;
  display: block;
  margin-top: 12px;
  padding-left: 4px;
  font-family: var(--font-mono);
  font-size: 9px;
  letter-spacing: .18em;
  color: rgba(233, 228, 216, .62);
}
.ba-armor__foot span:last-child { color: var(--signal); }

/* -------------------------------------------------------- 品牌立意 / 三柱 */
.ba-creed {
  padding: 108px 0;
  border-bottom: 1px solid rgba(217, 164, 65, .18);
  background:
    radial-gradient(700px 380px at 88% 10%, rgba(197, 52, 43, .06), transparent 70%),
    #090A0C;
}
.ba-creed__grid {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 72px;
  align-items: start;
}
.ba-creed__kicker {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: .26em;
  color: var(--copper);
  text-transform: uppercase;
}
.ba-creed__title {
  font-family: var(--font-display);
  font-size: clamp(38px, 4.2vw, 64px);
  line-height: 1.24;
  margin: 22px 0 26px;
  font-weight: 700;
  letter-spacing: -.02em;
}
.ba-creed__title em {
  font-style: normal;
  color: transparent;
  -webkit-text-stroke: 1.2px var(--signal);
}
.ba-creed__lead {
  font-family: var(--font-stamp);
  font-size: 18px;
  line-height: 2;
  color: var(--text-hi);
  max-width: 560px;
}
.ba-creed__lead b { color: var(--signal); font-weight: 700; }
.ba-creed__sub { color: var(--text-dim); font-size: 14px; line-height: 1.95; max-width: 540px; }

.ba-pillars { display: grid; gap: 1px; background: rgba(217, 164, 65, .20); border: 1px solid rgba(217, 164, 65, .20); }
.ba-pillar {
  background: #0C0E11;
  padding: 28px 30px;
  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 22px;
  align-items: start;
  clip-path: var(--cut);
  transition: background .35s ease;
}
.ba-pillar:hover { background: #14161A; }
.ba-pillar__glyph {
  font-family: var(--font-stamp);
  font-size: 62px;
  font-weight: 900;
  line-height: 1;
  color: transparent;
  -webkit-text-stroke: 1.2px var(--signal);
  user-select: none;
}
.ba-pillar:nth-child(2) .ba-pillar__glyph { -webkit-text-stroke-color: var(--copper); }
.ba-pillar__no {
  font-family: var(--font-mono);
  font-size: 9px;
  letter-spacing: .2em;
  color: var(--text-dim);
}
.ba-pillar h3 {
  font-family: var(--font-display);
  font-size: 19px;
  margin: 8px 0 10px;
  color: var(--text-hi);
  letter-spacing: .04em;
}
.ba-pillar p { margin: 0; color: var(--text-dim); font-size: 13px; line-height: 1.9; }
.ba-pillar__en { font-family: var(--font-mono); font-size: 9px; letter-spacing: .14em; color: var(--signal); }

/* ------------------------------------------------------------ 区块标题 */
.bl-section__head h2,
.bl-block__title h3,
.bl-inquiry h2,
.bl-page-top h1 {
  font-family: var(--font-display);
  letter-spacing: -.01em;
}
.bl-section__no, .bl-block__no, .bl-eyebrow--copper { color: var(--copper); }
.bl-section__head h2 em { font-style: normal; color: var(--signal); }

/* 甲片式卡片：切角 + 左上编号刻印 */
.bl-pcard, .bl-card, .bl-tile {
  background: linear-gradient(160deg, #12161B, #0A0C0F) !important;
  border-color: rgba(217, 164, 65, .22) !important;
}
.bl-pcard:hover, .bl-card:hover, .bl-tile:hover {
  border-color: var(--signal) !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, .5);
}
.bl-pcard::before, .bl-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 34px; height: 2px;
  background: var(--copper);
}
.bl-pcard, .bl-card, .bl-tile { position: relative; }

/* 表单：朱砂主按钮 + 玄金聚焦 */
.bl-form { border-color: rgba(217, 164, 65, .26) !important; }
.bl-field input:focus, .bl-field select:focus, .bl-field textarea:focus {
  border-color: var(--signal) !important;
  box-shadow: 0 0 0 2px rgba(217, 164, 65, .14);
}
.bl-field label { font-family: var(--font-mono); letter-spacing: .08em; font-size: 11px; }
.bl-form__head h3 { font-family: var(--font-display); }

/* ------------------------------------------------------------------ 页脚 */
.bl-footer {
  background: #060709;
  border-top: 1px solid rgba(217, 164, 65, .28);
}
.bl-footer__brand { font-family: var(--font-mega); font-size: 40px; letter-spacing: .08em; line-height: 1; }
.bl-footer__brand span { color: var(--signal); }
.bl-footer__cn {
  font-family: var(--font-stamp);
  font-size: 13px;
  letter-spacing: .22em;
  color: var(--text-hi);
  margin: 10px 0 2px;
}
.bl-footer__domain { margin: 0 0 18px; }
.bl-footer__domain a { color: var(--signal); text-decoration: none; border-bottom: 1px solid rgba(217, 164, 65, .4); }
.bl-footer__domain a:hover { color: var(--copper); border-bottom-color: var(--copper); }
.bl-footer h4 { font-family: var(--font-mono); letter-spacing: .16em; font-size: 11px; color: var(--signal); }
.bl-footer__domain {
  font-family: var(--font-mono);
  font-size: 13px;
  letter-spacing: .1em;
  color: var(--signal);
}
.bl-footer__bottom { border-top-color: rgba(217, 164, 65, .18); font-family: var(--font-mono); letter-spacing: .1em; }
.bl-float a { background: var(--surface); border-color: rgba(217, 164, 65, .35); color: var(--signal); }
.bl-float a:hover { background: var(--copper); color: #fff; }

/* -------------------------------------------------------------- 响应式 */
@media (max-width: 1200px) {
  .ba-creed__grid { gap: 44px; }
  .bl-hero { padding: 96px 0 88px; }
}
@media (max-width: 992px) {
  .ba-creed__grid { grid-template-columns: 1fr; gap: 40px; }
  .ba-armor__seal { width: 74px; height: 74px; font-size: 42px; }
}
@media (max-width: 768px) {
  .bl-hero { padding: 72px 0 68px; }
  .ba-mega { font-size: clamp(120px, 30vw, 210px); bottom: -4vw; }
  .ba-creed { padding: 72px 0; }
  .ba-pillar { grid-template-columns: 68px 1fr; gap: 16px; padding: 22px; }
  .ba-pillar__glyph { font-size: 46px; }
  .ba-armor__seal { width: 64px; height: 64px; font-size: 36px; }
  .ba-armor__caption { font-size: 8px; }
  .ba-armor__head, .ba-armor__foot { font-size: 9px; padding: 11px 13px; letter-spacing: .1em; }
}
@media (max-width: 480px) {
  .ba-armor__foot span:last-child { display: none; }
  .ba-armor__seal { width: 54px; height: 54px; font-size: 30px; }
  .bl-brand__sub { display: none; }
}

/* ------------------------------------------------------- 无障碍 / 动效兜底 */
@media (prefers-reduced-motion: reduce) {
  .ba-armor__scan { display: none; }
  .ba-armor__status::before { animation: none; }
  .ba-plate__body, .ba-plate__ridge, .ba-plate__rivet { transition: none; }
  *, *::before, *::after { scroll-behavior: auto !important; }
}
