/* ========================================================================
   美辰信息技术 · 公司简介页样式（借鉴海报视觉语言的完整网页版）
   —— 三区块：Hero（企业主题背景）/ 公司简介（左栏粘性 · 右栏正文）/ 我们擅长的方向
   依赖 home-glass.css 的基础重置；本页覆盖其玻璃背景为扁平深墨。
   配色取自 logo：主绿 #6bcc5f / 黄绿 #caef00（不套用全站蓝粉青玻璃）。
   ======================================================================== */

/* =============== 设计令牌（仅作用于本页 main） =============== */
main {
  --ab-ink:#f5f3ee; --ab-dim:#c3cbd6; --ab-mute:#8e98a8;
  --ab-gold:#6bcc5f; --ab-gold-deep:#4fa63f; --ab-lime:#caef00;
  --ab-hair:rgba(255,255,255,.10); --ab-shell:1440px;
  color: var(--ab-ink);
  font-family:'Microsoft YaHei','PingFang SC','Noto Sans SC',sans-serif;
}

/* =============== 覆盖全站玻璃背景（仅 about 生效） =============== */
.page-bg { background:#080b10 !important; }
.page-bg .orb,
.page-bg .grid-overlay { display:none !important; }

/* 顶部导航改为浮层（仅 about）：脱离文档流，使 Hero 背景图顶到最上沿，导航浮在图上 */
.top-nav { position: fixed; left: 0; right: 0; top: 0; }

/* =============== 通用元素 =============== */
.ab-shell { width:100%; max-width:var(--ab-shell); margin:0 auto; padding:0 32px; }
.ab-gold { color:var(--ab-gold); }
.ab-kicker { display:inline-flex; align-items:center; gap:12px; font-size:14px; letter-spacing:5px; color:var(--ab-dim); }
.ab-kicker i { width:10px; height:10px; background:var(--ab-lime); flex:none; }
.ab-kicker b { color:var(--ab-gold); font-weight:700; }

/* =============== Hero（企业主题背景 · 整屏铺满） =============== */
/* 破除 home-glass.css 全站 section{max-width:1440px;margin:0 auto} 的限宽，让背景满 100vw */
.ab-hero { position:relative; min-height:100vh; display:flex; align-items:center;
  max-width:none; margin-left:0; margin-right:0;
  padding:130px 0 90px;
  background:
    linear-gradient(180deg,rgba(8,11,16,.72),rgba(8,11,16,.5) 45%,rgba(8,11,16,.95)),
    url('/assets/images/about/about-bg-hero.jpg') center 58% / cover no-repeat; }
/* 电影质感叠层（压在背景上、文案下）：四角暗角 vignette + 胶片颗粒 grain */
.ab-hero::before {
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:radial-gradient(130% 105% at 50% 42%, rgba(0,0,0,0) 46%, rgba(0,0,0,.40) 80%, rgba(0,0,0,.74) 100%);
}
.ab-hero::after {
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  opacity:.10; mix-blend-mode:overlay; filter:grayscale(1);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-repeat:repeat; background-size:160px 160px;
}
.ab-hero__inner { position:relative; z-index:2; max-width:900px; }
.ab-hero__title { margin:22px 0 0; font-weight:900; font-size:clamp(40px,6.6vw,78px); line-height:1.14; letter-spacing:-.01em;
  color:var(--ab-ink); text-shadow:0 2px 30px rgba(0,0,0,.6); }
.ab-hero__lede { margin:22px 0 0; max-width:680px; font-size:clamp(16px,1.7vw,20px); line-height:1.8;
  color:var(--ab-dim); text-shadow:0 1px 14px rgba(0,0,0,.6); }
.ab-points { margin:26px 0 0; padding:0; list-style:none; display:flex; flex-wrap:wrap; align-items:center; gap:12px 18px;
  font-size:15px; letter-spacing:1px; color:var(--ab-dim); }
.ab-points li { display:flex; align-items:center; gap:18px; }
.ab-points li + li::before { content:""; width:6px; height:6px; background:var(--ab-gold); transform:rotate(45deg); }

/* =============== 公司简介（左栏标签 · 右栏正文） =============== */
.ab-intro { padding:clamp(64px,9vw,110px) 0; }
.ab-intro__grid { display:grid; grid-template-columns:300px 1fr; gap:64px; align-items:start; }
.ab-intro__aside { position:sticky; top:100px; }
.ab-intro__big { margin:20px 0 0; font-weight:900; font-size:clamp(24px,3vw,34px); line-height:1.3; color:var(--ab-ink); }
.ab-intro__mono { margin:14px 0 0; font-family:'Courier New',ui-monospace,monospace; font-size:12px; letter-spacing:3px; color:var(--ab-mute); }
.ab-intro__body p { margin:0; font-size:clamp(15px,1.6vw,18px); line-height:2; color:var(--ab-dim); }
.ab-intro__body p + p { margin-top:22px; }
.ab-intro__body b { color:var(--ab-ink); font-weight:700; }

/* =============== 我们擅长的方向（2×2 扁平卡片） =============== */
.ab-biz { padding:clamp(64px,9vw,110px) 0; }
.ab-sec__title { margin:20px 0 0; font-weight:800; font-size:clamp(24px,3.4vw,36px); line-height:1.3; color:var(--ab-ink); max-width:760px; }
.ab-sec__sub { margin:12px 0 0; font-size:15px; line-height:1.7; color:var(--ab-mute); max-width:760px; }
.ab-biz__grid { margin-top:44px; display:grid; grid-template-columns:repeat(2,1fr); gap:22px; }
.ab-card { position:relative; padding:32px 28px 30px; background:rgba(255,255,255,.025);
  border:1px solid var(--ab-hair); border-radius:4px; transition:border-color .2s,background .2s,transform .2s; }
.ab-card:hover { border-color:rgba(255,255,255,.20); background:rgba(255,255,255,.045); transform:translateY(-4px); }
.ab-card__no { font-weight:900; font-size:38px; line-height:1; color:transparent; -webkit-text-stroke:1.3px var(--ab-gold); }
.ab-card__title { margin:18px 0 0; font-size:20px; font-weight:800; color:var(--ab-ink); }
.ab-card__desc { margin:14px 0 0; font-size:15px; line-height:1.9; color:var(--ab-dim); }
.ab-card__list { margin:16px 0 0; padding:0; list-style:none; display:flex; flex-direction:column; gap:9px; }
.ab-card__list li { position:relative; padding-left:18px; font-size:14px; line-height:1.6; color:var(--ab-dim); }
.ab-card__list li::before { content:""; position:absolute; left:0; top:8px; width:6px; height:6px; background:var(--ab-gold); transform:rotate(45deg); }

/* =============== 响应式 =============== */
@media (max-width:960px) {
  .ab-shell { padding:0 28px; }
  .ab-intro__grid { grid-template-columns:1fr; gap:28px; }
  .ab-intro__aside { position:static; }
  .ab-biz__grid { grid-template-columns:1fr; }
}
@media (max-width:560px) {
  .ab-shell { padding:0 20px; }
}
