/* ============================================================
   潮升科技官网 V6.0 · 设计系统「潮汐 Tide」
   Windows 11 Fluent 双主题 + 旧站品牌橙点缀
   --------------------------------------------------------
   与 V5.0 的差异：
     1. 引入品牌橙（旧站 #FDAF4C），按主题分工使用
     2. 新增内页 banner、案例卡、新闻日期块、时间轴、流程、
        服务卡、联系表单等旧站内容所需的组件
     3. 所有组件一律引用令牌，禁止硬编码颜色/间距
   ============================================================ */

/* ============================================================
   1. TOKENS —— 双主题（亮色为默认，暗色由 [data-theme="dark"] 覆盖）
   ============================================================ */
:root{
  /* —— 亮色主题（Win11 Light）—— */
  --bg:#F3F3F3;              /* 应用背景 Mica 基色 */
  --bg-layer:#FFFFFF;        /* 卡片 / Flyout 层 */
  --bg-layer-alt:#FAFAFA;    /* 次级层 */
  --bg-elevated:#FFFFFF;     /* 悬浮层 */
  --mica:rgba(255,255,255,.72);
  --mica-strong:rgba(255,255,255,.85);
  --stroke:rgba(0,0,0,.08);
  --stroke-strong:rgba(0,0,0,.16);
  --divider:rgba(0,0,0,.06);

  --ink:#1A1A1A;             /* 主文字 15.68:1 */
  --ink-2:#5D5D5D;           /* 次级 5.93:1 */
  --ink-3:#6B6B6B;           /* 弱化 5.33:1（于卡片面） */
  --ink-invert:#FFFFFF;      /* 深底之上的文字 */

  /* Fluent 主色 */
  --accent:#005FB8;
  --accent-solid:#005FB8;
  --accent-hover:#004E9E;
  --accent-ink:#FFFFFF;
  --accent-soft:rgba(0,95,184,.10);
  --accent-softer:rgba(0,95,184,.06);
  --focus:#005FB8;

  /* —— 品牌橙（旧站 #FDAF4C）：亮色主题下文字级需加深 —— */
  --brand:#FDAF4C;           /* 亮橙块底（配深字 9.46:1）*/
  --brand-hover:#F5A03C;     /* 橙块悬停 */
  --brand-ink:#1A1A1A;       /* 橙块之上文字 9.46:1 */
  --brand-text:#B45309;      /* 橙文字级 5.02:1（白底达标）*/
  --brand-soft:rgba(253,175,76,.18);
  --brand-softer:rgba(253,175,76,.10);

  --ok:#0E7A0E; --warn:#9D5D00; --bad:#C42B1C;

  --sh-1:0 1px 2px rgba(0,0,0,.06),0 0 1px rgba(0,0,0,.04);
  --sh-2:0 2px 4px rgba(0,0,0,.08),0 0 2px rgba(0,0,0,.04);
  --sh-3:0 8px 16px rgba(0,0,0,.10),0 2px 4px rgba(0,0,0,.06);
  --sh-4:0 16px 32px rgba(0,0,0,.14),0 4px 8px rgba(0,0,0,.08);
  --sh-brand:0 8px 20px rgba(253,175,76,.32);

  --halo-1:rgba(0,120,215,.10);
  --halo-2:rgba(253,175,76,.08);   /* 橙色柔光入微光层 */
  --halo-3:rgba(120,80,220,.06);

  /* 图片遮罩（Fluent 渐隐，保证叠加文字可读） */
  --scrim:linear-gradient(to top,rgba(0,0,0,.82),rgba(0,0,0,.45)55%,rgba(0,0,0,.1));
}

/* 暗色主题 */
[data-theme="dark"]{
  --bg:#202020;
  --bg-layer:#2B2B2B;
  --bg-layer-alt:#272727;
  --bg-elevated:#323232;
  --mica:rgba(43,43,43,.72);
  --mica-strong:rgba(43,43,43,.85);
  --stroke:rgba(255,255,255,.09);
  --stroke-strong:rgba(255,255,255,.17);
  --divider:rgba(255,255,255,.07);

  --ink:#FFFFFF;             /* 16.29:1 */
  --ink-2:#C8C8C8;           /* 9.74:1 */
  --ink-3:#A0A0A0;           /* 5.41:1（于卡片面）*/
  --ink-invert:#1A1A1A;

  --accent:#4CC2FF;
  --accent-solid:#4CC2FF;
  --accent-hover:#42B5EB;
  --accent-ink:#000000;
  --accent-soft:rgba(76,194,255,.14);
  --accent-softer:rgba(76,194,255,.08);
  --focus:#7FD4FF;

  /* 暗色下原橙即可做文字（8.85:1）*/
  --brand:#FDAF4C;
  --brand-hover:#FFC46B;
  --brand-ink:#1A1A1A;
  --brand-text:#FDAF4C;      /* 8.85:1 */
  --brand-soft:rgba(253,175,76,.16);
  --brand-softer:rgba(253,175,76,.08);

  --ok:#6CCB5F; --warn:#FCE100; --bad:#FF99A4;

  --sh-1:0 1px 2px rgba(0,0,0,.32),0 0 1px rgba(0,0,0,.24);
  --sh-2:0 2px 4px rgba(0,0,0,.36),0 0 2px rgba(0,0,0,.28);
  --sh-3:0 8px 16px rgba(0,0,0,.40),0 2px 4px rgba(0,0,0,.32);
  --sh-4:0 16px 32px rgba(0,0,0,.48),0 4px 8px rgba(0,0,0,.36);
  --sh-brand:0 8px 24px rgba(253,175,76,.24);

  --halo-1:rgba(0,120,215,.16);
  --halo-2:rgba(253,175,76,.10);
  --halo-3:rgba(120,80,220,.10);

  --scrim:linear-gradient(to top,rgba(0,0,0,.88),rgba(0,0,0,.5)55%,rgba(0,0,0,.15));
}

/* ============================================================
   2. 共用 SCALE TOKENS（与主题无关）
   ============================================================ */
:root{
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px;
  --s6:32px; --s7:48px; --s8:64px; --s9:96px; --s10:144px;

  --r-xs:4px; --r-sm:6px; --r:8px; --r-md:12px; --r-lg:16px; --r-xl:20px; --r-pill:999px;

  --ease:cubic-bezier(.25,.46,.45,.94);
  --ease-out:cubic-bezier(.16,1,.3,1);

  --font:"Segoe UI Variable Display","Segoe UI Variable Text","Segoe UI",
         -apple-system,"PingFang SC","Microsoft YaHei",sans-serif;
  --font-mono:"Cascadia Code","JetBrains Mono","SF Mono",Menlo,Consolas,monospace;

  --maxw:1360px;
  --gutter:clamp(20px,5vw,64px);
}

/* ============================================================
   3. RESET + BASE
   ============================================================ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--font);
  background:var(--bg);
  color:var(--ink);
  font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  transition:background-color .35s var(--ease),color .35s var(--ease);
}
/* 常驻背景微光（Fluent 标志性柔光） */
body::before{
  content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:
    radial-gradient(900px 600px at 12% -8%,var(--halo-1),transparent 60%),
    radial-gradient(800px 560px at 88% 6%,var(--halo-2),transparent 60%),
    radial-gradient(760px 520px at 50% 108%,var(--halo-3),transparent 60%);
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
::selection{background:var(--accent);color:var(--accent-ink)}

:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:var(--r-sm)}
:focus:not(:focus-visible){outline:none}

.skip-link{
  position:absolute;left:var(--s4);top:-100px;z-index:300;
  background:var(--accent-solid);color:var(--accent-ink);
  padding:12px 20px;border-radius:var(--r);font-weight:600;
  transition:top .2s var(--ease-out);
}
.skip-link:focus{top:var(--s4)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}

.theme-anim,.theme-anim *{transition:background-color .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease),box-shadow .35s var(--ease) !important}

.progress{position:fixed;top:0;left:0;height:3px;width:0;z-index:400;
  background:linear-gradient(90deg,var(--accent),var(--brand));transition:width .1s linear}

/* ============================================================
   4. LAYOUT
   ============================================================ */
.wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding-inline:var(--gutter)}
.grid12{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--s5)}
.col-3{grid-column:span 3}.col-4{grid-column:span 4}.col-5{grid-column:span 5}
.col-6{grid-column:span 6}.col-7{grid-column:span 7}.col-8{grid-column:span 8}
.col-9{grid-column:span 9}.col-12{grid-column:span 12}
.band{padding-block:var(--s9)}
.band--tight{padding-block:var(--s8)}
.band--alt{background:var(--bg-layer-alt)}

/* ============================================================
   5. TYPOGRAPHY
   ============================================================ */
.t-display{font-size:clamp(2.5rem,6.5vw,5.5rem);line-height:1.05;
  font-weight:700;letter-spacing:-.035em}

.t-h2{font-size:clamp(1.5rem,2.6vw,2.25rem);line-height:1.25;font-weight:650;letter-spacing:-.02em}
.t-h3{font-size:clamp(1.125rem,1.6vw,1.375rem);line-height:1.4;font-weight:600}
.t-body{font-size:1rem;line-height:1.85;color:var(--ink-2)}
.t-lead{font-size:clamp(1.0625rem,1.4vw,1.25rem);line-height:1.8;color:var(--ink-2)}

.t-meta{font-family:var(--font-mono);font-size:.6875rem;color:var(--ink-3);letter-spacing:.06em;text-transform:uppercase}
.grad{background:linear-gradient(100deg,var(--accent),var(--brand-text));
  -webkit-background-clip:text;background-clip:text;color:transparent}

/* 区块标题（沿用旧站 .title 结构：中文大标题 + 英文副标 + 橙色短线） */
.sec-title{margin-bottom:var(--s7);max-width:760px}
.sec-title__zh{font-size:clamp(1.75rem,3.2vw,2.75rem);line-height:1.2;font-weight:700;
  letter-spacing:-.02em;display:flex;align-items:center;gap:var(--s3)}
.sec-title__zh::after{content:"";width:64px;height:4px;flex:none;border-radius:2px;
  background:var(--brand)}
.sec-title__en{font-family:var(--font-mono);font-size:.8125rem;color:var(--ink-3);
  letter-spacing:.18em;text-transform:uppercase;margin-top:var(--s2)}
.sec-title__desc{margin-top:var(--s3);font-size:1.0625rem;line-height:1.8;color:var(--ink-2)}

/* ============================================================
   6. HEADER —— Mica 材质 + 主题切换
   ============================================================ */
.site-header{position:sticky;top:0;z-index:100;
  background:var(--mica);backdrop-filter:blur(28px) saturate(160%);
  -webkit-backdrop-filter:blur(28px) saturate(160%);
  border-bottom:1px solid var(--stroke)}
.site-header>.wrap{display:flex;align-items:center;gap:var(--s5);height:64px}
.brand{display:flex;align-items:center;gap:10px;font-weight:650;font-size:1.0625rem;flex:none}
.brand__logo{height:30px;width:auto;display:block}
.brand__zh{white-space:nowrap}
.nav{margin-left:auto;display:flex;align-items:center;gap:2px}
.nav a{position:relative;padding:10px 14px;border-radius:var(--r);
  font-size:.9375rem;color:var(--ink-2);transition:background-color .2s,color .2s;
  white-space:nowrap}
.nav a:hover{background:var(--accent-softer);color:var(--ink)}
.nav a[aria-current="page"]{color:var(--accent);font-weight:600;background:var(--accent-soft)}
.nav-tools{display:flex;align-items:center;gap:var(--s2);flex:none}
.theme-btn{width:38px;height:38px;border-radius:var(--r);display:grid;place-items:center;
  border:1px solid var(--stroke);background:var(--bg-layer);
  transition:background-color .2s,border-color .2s,transform .2s}
.theme-btn:hover{background:var(--accent-softer);border-color:var(--stroke-strong)}
.theme-btn:active{transform:scale(.94)}
.theme-btn .i-moon{display:none;font-size:1.125rem;line-height:1}
.theme-btn .i-sun{display:block;font-size:1.125rem;line-height:1}
[data-theme="dark"] .theme-btn .i-moon{display:block}
[data-theme="dark"] .theme-btn .i-sun{display:none}
.nav-toggle{display:none;width:38px;height:38px;border-radius:var(--r);font-size:1.25rem;
  border:1px solid var(--stroke);background:var(--bg-layer)}
.hotline{display:none;font-family:var(--font-mono);font-size:.75rem;color:var(--ink-3)}
.hotline b{color:var(--brand-text);font-weight:600}

/* ============================================================
   7. BUTTONS
   ============================================================ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-size:.9375rem;font-weight:600;border-radius:var(--r);
  padding:11px 22px;min-height:42px;white-space:nowrap;
  transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s}
.btn--primary{background:var(--accent-solid);color:var(--accent-ink)}
.btn--primary:hover{background:var(--accent-hover)}
.btn--secondary{background:var(--bg-layer);color:var(--ink);border:1px solid var(--stroke-strong)}
.btn--secondary:hover{background:var(--accent-softer);border-color:var(--accent);color:var(--accent)}
.btn--brand{background:var(--brand);color:var(--brand-ink);box-shadow:var(--sh-brand)}
.btn--brand:hover{background:var(--brand-hover)}
.btn--ghost{color:var(--ink-2);border:1px solid var(--stroke)}
.btn--ghost:hover{color:var(--accent);border-color:var(--accent);background:var(--accent-softer)}
.btn--lg{padding:14px 30px;font-size:1.0625rem;min-height:50px}
.btn--sm{padding:8px 16px;font-size:.875rem;min-height:36px}

/* ============================================================
   8. HERO —— 旧站三屏轮播文案 + Fluent 层次
   ============================================================ */
.hero{position:relative;overflow:hidden;
  background:linear-gradient(160deg,var(--bg-layer),var(--bg) 62%)}
.hero__field{position:absolute;inset:0;pointer-events:none;opacity:.55}
.hero__field canvas{width:100%;height:100%;display:block}
.hero>.wrap{position:relative;z-index:1;padding-block:var(--s9) var(--s8)}
.hero__kicker{display:inline-flex;align-items:center;gap:10px;
  font-family:var(--font-mono);font-size:.75rem;letter-spacing:.1em;
  color:var(--accent);background:var(--accent-soft);
  padding:7px 14px;border-radius:var(--r-pill);margin-bottom:var(--s5)}
.hero__kicker::before{content:"";width:6px;height:6px;border-radius:50%;
  background:var(--brand);flex:none}
.hero__title{margin-bottom:var(--s5)}

.hero__lead{max-width:640px;margin-bottom:var(--s6)}
.hero__actions{display:flex;flex-wrap:wrap;gap:var(--s3)}

/* 旧站「多种互联网解决方案」分隔词组 */
.hero__tags{display:flex;flex-wrap:wrap;gap:var(--s4);margin-top:var(--s6);
  font-family:var(--font-mono);font-size:.8125rem;color:var(--ink-3)}
.hero__tags span{display:inline-flex;align-items:center;gap:var(--s4)}
.hero__tags span+span::before{content:"";width:4px;height:4px;border-radius:50%;
  background:var(--brand);flex:none}

/* 旧站「品牌定制 精致服务」口号带 */
.slogan-band{background:linear-gradient(120deg,var(--accent-solid),var(--accent-hover));
  color:#fff;padding-block:var(--s8)}
.slogan-band__main{font-size:clamp(1.75rem,4.2vw,3.25rem);font-weight:700;
  letter-spacing:-.02em;line-height:1.2;text-align:center}
.slogan-band__sub{font-size:clamp(.9375rem,1.4vw,1.125rem);text-align:center;
  opacity:.92;margin-top:var(--s3);letter-spacing:.04em}
.slogan-band__en{font-family:var(--font-mono);font-size:.75rem;text-align:center;
  opacity:.75;margin-top:var(--s2);letter-spacing:.2em;text-transform:uppercase}

/* ============================================================
   9. 业务范围 —— 6 大板块（Win11 设置磁贴，桌面 3×2）
   ============================================================ */
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4)}
.tile{background:var(--bg-layer);border:1px solid var(--stroke);border-radius:var(--r-lg);
  padding:var(--s5);box-shadow:var(--sh-1);
  transition:box-shadow .25s var(--ease),transform .25s var(--ease),border-color .25s}
.tile:hover{box-shadow:var(--sh-3);transform:translateY(-4px);border-color:var(--stroke-strong)}
.tile__well{width:48px;height:48px;border-radius:var(--r-md);display:grid;place-items:center;
  margin-bottom:var(--s4);color:#fff}
.tile__well svg{width:24px;height:24px}
.tile__t{font-size:1rem;font-weight:600;margin-bottom:var(--s2)}
.tile__d{font-size:.8125rem;line-height:1.75;color:var(--ink-3)}

/* 业务板块配色（Win11 磁贴彩色井） */
.w-c1{background:linear-gradient(135deg,#0F6CBD,#3A96DD)}
.w-c2{background:linear-gradient(135deg,#8764B8,#B4A0D6)}
.w-c3{background:linear-gradient(135deg,#038387,#3AB0B3)}
.w-c4{background:linear-gradient(135deg,#C239B3,#E06EC7)}
.w-c5{background:linear-gradient(135deg,#E16A1B,#FDAF4C)}
.w-c6{background:linear-gradient(135deg,#4F5BD5,#7B8DF8)}

/* ============================================================
   10. 内页 BANNER
   ============================================================ */
.pbanner{position:relative;overflow:hidden;
  background:linear-gradient(135deg,var(--accent-solid),var(--accent-hover))}
.pbanner__bg{position:absolute;inset:0;opacity:.22;object-fit:cover;width:100%;height:100%}
.pbanner>.wrap{position:relative;z-index:1;padding-block:var(--s8) var(--s7)}
.pbanner h1{font-size:clamp(2rem,4vw,3.25rem);font-weight:700;color:#fff;
  letter-spacing:-.025em;line-height:1.15}
.pbanner p{font-family:var(--font-mono);font-size:.8125rem;color:rgba(255,255,255,.82);
  letter-spacing:.2em;text-transform:uppercase;margin-top:var(--s2)}
.pbanner .pbanner__bar{width:112px;height:5px;border-radius:3px;
  background:var(--brand);margin-top:var(--s4)}

/* 面包屑 */
.crumbs{display:flex;align-items:center;gap:10px;font-family:var(--font-mono);
  font-size:.75rem;color:var(--ink-3);padding-block:var(--s4)}
.crumbs a:hover{color:var(--accent)}

/* ============================================================
   11. 关于我们 —— 文字块 + 配图
   ============================================================ */
.about{display:grid;grid-template-columns:1fr 1fr;gap:var(--s7);align-items:center}
.about__text{background:var(--accent-soft);border-left:4px solid var(--brand);
  border-radius:var(--r-md);padding:var(--s6)}
.about__text p+p{margin-top:var(--s4)}
.about__text p{font-size:1rem;line-height:2;color:var(--ink-2);text-indent:2em}
.about__fig{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-3);position:relative}
.about__fig img{width:100%;height:auto;display:block}
.about__cap{position:absolute;left:0;right:0;bottom:0;padding:var(--s3) var(--s4);
  background:linear-gradient(transparent,rgba(0,0,0,.55));color:var(--ink-invert);
  font-size:.8125rem;letter-spacing:.01em}

/* 公司介绍 · 品牌引言 + 关键数据 + 企业理念（V6.1 美化） */
.about-lead{margin:0 0 var(--s6);padding:var(--s5) var(--s6);
  background:var(--bg-layer);border:1px solid var(--stroke);border-radius:var(--r-lg);
  border-left:4px solid var(--brand);box-shadow:var(--sh-1)}
.about-lead p{margin:0;font-size:clamp(1.125rem,2vw,1.5rem);line-height:1.7;font-weight:600;color:var(--ink)}
.about-lead p::before{content:"\201C";color:var(--brand-text);margin-right:1px}
.about-lead p::after{content:"\201D";color:var(--brand-text);margin-left:1px}
.keyfacts{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s4);margin-top:var(--s6)}
.kf{background:var(--bg-layer);border:1px solid var(--stroke);border-radius:var(--r-lg);
  padding:var(--s5);box-shadow:var(--sh-1);text-align:center;
  transition:box-shadow .25s var(--ease),transform .25s var(--ease)}
.kf:hover{box-shadow:var(--sh-3);transform:translateY(-4px)}
.kf__no{font-family:var(--font-mono);font-size:1.75rem;font-weight:700;color:var(--accent);line-height:1.1}
.kf__t{font-size:.9375rem;font-weight:600;color:var(--ink);margin:var(--s2) 0 var(--s1)}
.kf__d{font-size:.8125rem;line-height:1.6;color:var(--ink-3)}
.about-motto{margin-top:var(--s6);padding:var(--s6);display:flex;gap:var(--s5);align-items:center;
  background:var(--accent-soft);border-radius:var(--r-lg);border:1px solid var(--stroke)}
.about-motto__label{font-family:var(--font-mono);font-size:.8125rem;font-weight:700;color:var(--brand-text);
  white-space:nowrap;letter-spacing:.08em;padding:var(--s2) var(--s4);
  border:1px solid var(--brand);border-radius:var(--r-pill);background:var(--brand-soft)}
.about-motto p{margin:0;font-size:1.0625rem;line-height:1.8;color:var(--ink-2)}
@media(max-width:860px){
  .about{grid-template-columns:1fr;gap:var(--s5);align-items:start}
  .keyfacts{grid-template-columns:repeat(2,1fr)}
  .about-motto{flex-direction:column;align-items:flex-start;gap:var(--s3)}
}
@media(max-width:480px){.keyfacts{grid-template-columns:1fr}}

/* 我们的优势 01-03 */
.strengths{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s5)}
.strength{background:var(--bg-layer);border:1px solid var(--stroke);border-radius:var(--r-lg);
  padding:var(--s6) var(--s5);box-shadow:var(--sh-1);position:relative;
  transition:box-shadow .25s var(--ease),transform .25s var(--ease)}
.strength:hover{box-shadow:var(--sh-3);transform:translateY(-4px)}
.strength__no{font-family:var(--font-mono);font-size:2.75rem;font-weight:700;
  color:var(--brand);opacity:.9;line-height:1;margin-bottom:var(--s4)}
.strength p{font-size:.9375rem;line-height:1.95;color:var(--ink-2)}

/* 团队 */
.team{background:var(--bg-layer);border:1px solid var(--stroke);border-radius:var(--r-lg);
  padding:var(--s7);box-shadow:var(--sh-1)}
.team p{font-size:1rem;line-height:2.1;color:var(--ink-2);text-indent:2em}
.team__quote{margin-top:var(--s5);padding-top:var(--s5);border-top:1px solid var(--divider);
  display:flex;flex-wrap:wrap;gap:var(--s3)}
.chip{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;
  border-radius:var(--r-pill);background:var(--brand-soft);color:var(--brand-text);
  font-size:.875rem;font-weight:600}
.chip::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--brand)}

/* ============================================================
   12. 价值主张 —— 更省钱 / 更赚钱
   ============================================================ */
.value{display:grid;grid-template-columns:1fr 1fr;gap:var(--s5)}
.value__card{background:var(--bg-layer);border:1px solid var(--stroke);border-radius:var(--r-lg);
  overflow:hidden;box-shadow:var(--sh-1);display:flex;
  transition:box-shadow .25s var(--ease)}
.value__card:hover{box-shadow:var(--sh-3)}
.value__fig{width:38%;flex:none}
.value__fig img{width:100%;height:100%;object-fit:cover}
.value__body{padding:var(--s5);display:flex;flex-direction:column;justify-content:center}
.value__t{font-size:1.375rem;font-weight:700;color:var(--accent);margin-bottom:var(--s2)}
.value__sub{font-size:.9375rem;font-weight:600;margin-bottom:var(--s3)}
.value__d{font-size:.875rem;line-height:1.9;color:var(--ink-3)}

/* ============================================================
   13. 项目流程 —— 5 步
   ============================================================ */
.flow{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--s3)}
.flow__step{background:var(--bg-layer);border:1px solid var(--stroke);border-radius:var(--r-lg);
  padding:var(--s5) var(--s4);position:relative;box-shadow:var(--sh-1);
  transition:box-shadow .25s var(--ease),transform .25s var(--ease)}
.flow__step:hover{box-shadow:var(--sh-3);transform:translateY(-4px)}
.flow__step::after{content:"";position:absolute;top:38px;right:-11px;width:20px;height:2px;
  background:var(--stroke-strong);z-index:1}
.flow__step:last-child::after{display:none}
.flow__ic{width:44px;height:44px;border-radius:var(--r-md);display:grid;place-items:center;
  background:var(--brand-soft);color:var(--brand-text);margin-bottom:var(--s4)}
.flow__ic svg{width:22px;height:22px}
.flow__no{position:absolute;top:var(--s4);right:var(--s4);font-family:var(--font-mono);
  font-size:.75rem;color:var(--ink-3);opacity:.6}
.flow__t{font-size:1rem;font-weight:600;margin-bottom:var(--s2)}
.flow__p{font-size:.8125rem;line-height:1.8;color:var(--ink-3)}
.flow__step{display:flex;flex-direction:column}

/* ============================================================
   14. 服务支持 —— 6 项服务
   ============================================================ */
.services{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s5)}
.service{background:var(--bg-layer);border:1px solid var(--stroke);border-radius:var(--r-lg);
  overflow:hidden;box-shadow:var(--sh-1);display:flex;flex-direction:column;
  transition:box-shadow .25s var(--ease),transform .25s var(--ease)}
.service:hover{box-shadow:var(--sh-3);transform:translateY(-4px)}
.service__fig{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--bg-layer-alt)}
.service__fig img{width:100%;height:100%;object-fit:cover;
  transition:transform .5s var(--ease-out)}
.service:hover .service__fig img{transform:scale(1.05)}
.service__no{position:absolute;top:var(--s3);left:var(--s3);z-index:2;
  font-family:var(--font-mono);font-size:.6875rem;font-weight:600;
  background:var(--brand);color:var(--brand-ink);padding:4px 10px;border-radius:var(--r-pill)}
.service__body{padding:var(--s5);flex:1}
.service__t{font-size:1.0625rem;font-weight:600;margin-bottom:var(--s2)}
.service__d{font-size:.875rem;line-height:1.9;color:var(--ink-3)}

/* ============================================================
   15. 案例展示
   ============================================================ */
/* 分类筛选 */
.filters{display:flex;flex-wrap:wrap;gap:var(--s2);margin-bottom:var(--s6)}
.filter{padding:9px 20px;border-radius:var(--r-pill);font-size:.875rem;font-weight:600;
  border:1px solid var(--stroke);background:var(--bg-layer);color:var(--ink-2);
  transition:all .2s;min-height:40px}
.filter:hover{border-color:var(--accent);color:var(--accent)}
.filter[aria-pressed="true"]{background:var(--accent-solid);border-color:var(--accent-solid);
  color:var(--accent-ink)}
.cases{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s5)}
.case{background:var(--bg-layer);border:1px solid var(--stroke);border-radius:var(--r-lg);
  overflow:hidden;box-shadow:var(--sh-1);display:flex;flex-direction:column;
  transition:box-shadow .25s var(--ease),transform .25s var(--ease)}
.case:hover{box-shadow:var(--sh-3);transform:translateY(-4px)}
.case__fig{position:relative;aspect-ratio:550/360;overflow:hidden;background:var(--bg-layer-alt)}
.case__fig img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease-out)}
.case:hover .case__fig img{transform:scale(1.06)}
.case__tag{position:absolute;top:var(--s3);left:var(--s3);z-index:2;
  font-size:.6875rem;font-weight:600;padding:5px 12px;border-radius:var(--r-pill);
  background:var(--mica-strong);backdrop-filter:blur(12px);color:var(--ink);
  border:1px solid var(--stroke)}
.case__body{padding:var(--s5);flex:1;display:flex;flex-direction:column}
.case__t{font-size:1.0625rem;font-weight:600;margin-bottom:6px}
.case__d{font-size:.875rem;color:var(--ink-3);flex:1}
.case__more{margin-top:var(--s4);padding-top:var(--s3);border-top:1px solid var(--divider);
  display:flex;align-items:center;justify-content:space-between;
  font-size:.8125rem;color:var(--accent);font-weight:600}
.case__arrow{transition:transform .25s var(--ease)}
.case:hover .case__arrow{transform:translateX(4px)}
.case.is-hidden{display:none}

/* ============================================================
   16. 新闻资讯 —— 日期块列表
   ============================================================ */
.newslist{display:flex;flex-direction:column;gap:var(--s4)}
.news{display:flex;gap:var(--s5);align-items:stretch;background:var(--bg-layer);
  border:1px solid var(--stroke);border-radius:var(--r-lg);overflow:hidden;
  box-shadow:var(--sh-1);transition:box-shadow .25s var(--ease),transform .25s var(--ease)}
.news:hover{box-shadow:var(--sh-3);transform:translateX(4px)}
.news__date{width:112px;flex:none;background:var(--accent-solid);color:#fff;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:var(--s5) var(--s3);position:relative}
.news__day{font-size:2.25rem;font-weight:700;line-height:1;
  font-family:var(--font-mono);letter-spacing:-.02em}
.news__ym{font-family:var(--font-mono);font-size:.75rem;opacity:.85;margin-top:6px}
.news__body{padding:var(--s5);flex:1;display:flex;flex-direction:column;justify-content:center}
.news__t{font-size:1.0625rem;font-weight:600;margin-bottom:6px;line-height:1.5}
.news__d{font-size:.875rem;line-height:1.8;color:var(--ink-3)}

/* ============================================================
   17. 发展历程 —— 交错时间轴
   ============================================================ */
/* ---------- 发展历程（history）— 曲线动态时间轴 ---------- */
.timeline{position:relative;max-width:960px;margin-inline:auto;padding:var(--s5) var(--s4)}
.timeline__svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:0}
.timeline__spine{fill:none;stroke:url(#tl-grad);stroke-width:3;stroke-linecap:round;
  stroke-dasharray:1000;stroke-dashoffset:1000}
.timeline.is-drawn .timeline__spine{stroke-dashoffset:0;transition:stroke-dashoffset 2s cubic-bezier(.4,0,.2,1)}
.timeline__link{fill:none;stroke:var(--brand-soft);stroke-width:2;opacity:.55}
.tl-grad .s0{stop-color:var(--brand)}
.tl-grad .s1{stop-color:var(--accent)}
.tl-node{position:absolute;z-index:2;width:15px;height:15px;border-radius:50%;
  background:var(--brand);border:3px solid var(--bg-layer);box-shadow:0 0 0 4px var(--brand-soft);
  transform:translate(-50%,-50%) scale(.2);opacity:0;
  transition:transform .5s var(--ease),opacity .5s var(--ease)}
.tl-node.is-in{transform:translate(-50%,-50%) scale(1);opacity:1}
.tl-node::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid var(--brand);
  opacity:.55;animation:tl-pulse 2.6s ease-out infinite}
@keyframes tl-pulse{0%{transform:scale(.6);opacity:.55}70%{transform:scale(2.3);opacity:0}100%{opacity:0}}
.tl-card{position:absolute;z-index:3;width:330px;max-width:44vw;padding:14px 18px;
  background:var(--bg-layer);border:1px solid var(--stroke);border-radius:var(--r-lg);
  box-shadow:var(--sh-1);transition:box-shadow .25s var(--ease),transform .6s var(--ease),opacity .6s var(--ease)}
.tl-card:hover{box-shadow:var(--sh-3)}
.tl-card--right{transform:translate(28px,-50%);opacity:0}
.tl-card--left{transform:translate(-28px,-50%);opacity:0}
.tl-card--right.is-in,.tl-card--left.is-in{transform:translate(0,-50%);opacity:1}
.tl-card__year{font-family:var(--font-mono);font-size:1.4rem;font-weight:700;line-height:1.1;
  color:var(--accent);letter-spacing:-.5px;margin-bottom:2px}
.tl-card__date{display:inline-block;font-family:var(--font-mono);font-size:.72rem;font-weight:600;
  color:var(--brand-ink);background:var(--brand);padding:2px 10px;border-radius:var(--r-pill);margin-bottom:8px}
.tl-card__t{font-size:1rem;font-weight:600;line-height:1.5;margin:0 0 6px}
.tl-card__desc{font-size:.86rem;line-height:1.7;color:var(--ink-3)}
/* 无 JS 兜底静态列表 */
.timeline--fallback{display:flex;flex-direction:column;gap:var(--s4)}
.tl-fb{background:var(--bg-layer);border:1px solid var(--stroke);border-radius:var(--r-lg);padding:var(--s4) var(--s5)}
.tl-fb__year{font-family:var(--font-mono);font-size:1.4rem;font-weight:700;color:var(--accent);margin-bottom:4px}
.tl-fb__date{display:inline-block;font-family:var(--font-mono);font-size:.72rem;font-weight:600;
  color:var(--brand-ink);background:var(--brand);padding:2px 10px;border-radius:var(--r-pill);margin-bottom:8px}
.tl-fb__t{font-size:1rem;font-weight:600;line-height:1.5;margin:0}
@media(prefers-reduced-motion:reduce){
  .timeline__spine{stroke-dashoffset:0!important;transition:none!important}
  .tl-node{opacity:1!important;transform:translate(-50%,-50%) scale(1)!important}
  .tl-node::after{animation:none}
  .tl-card--right,.tl-card--left{opacity:1!important;transform:translate(0,-50%)!important}
}

/* ============================================================
   18. 联系我们 —— 信息行 + 表单
   ============================================================ */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s6)}
.cinfo{background:var(--bg-layer);border:1px solid var(--stroke);border-radius:var(--r-lg);
  padding:var(--s6);box-shadow:var(--sh-1)}
.cinfo__row{display:flex;gap:var(--s4);padding-block:var(--s4);
  border-bottom:1px solid var(--divider);align-items:flex-start}
.cinfo__row:last-child{border-bottom:0}
.cinfo__ic{width:38px;height:38px;flex:none;border-radius:var(--r-sm);display:grid;place-items:center;
  background:var(--accent-soft);color:var(--accent)}
.cinfo__ic svg{width:19px;height:19px}
.cinfo__l{font-family:var(--font-mono);font-size:.6875rem;color:var(--ink-3);
  letter-spacing:.1em;text-transform:uppercase;margin-bottom:4px}
.cinfo__v{font-size:.9375rem;color:var(--ink);line-height:1.7;word-break:break-all}
.cinfo__v a:hover{color:var(--accent)}

.cmap{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--stroke);
  box-shadow:var(--sh-1);position:relative}
.cmap img{width:100%;height:100%;object-fit:cover;display:block}

.qrcodes{display:flex;gap:var(--s4);justify-content:center;margin-top:var(--s5)}
.qr{text-align:center}
.qr img{width:132px;height:132px;border-radius:var(--r-md);background:#fff;padding:8px;
  border:1px solid var(--stroke)}
.qr span{display:block;font-size:.75rem;color:var(--ink-3);margin-top:var(--s2)}

/* 表单 */
.form{background:var(--bg-layer);border:1px solid var(--stroke);border-radius:var(--r-lg);
  padding:var(--s6);box-shadow:var(--sh-1)}
.field{margin-bottom:var(--s4)}
.field label{display:block;font-size:.875rem;font-weight:600;margin-bottom:6px}
.field label .req{color:var(--bad)}
.field input,.field select,.field textarea{
  width:100%;padding:11px 14px;font:inherit;font-size:.9375rem;
  background:var(--bg);color:var(--ink);
  border:1px solid var(--stroke-strong);border-radius:var(--r);min-height:44px;
  transition:border-color .2s,box-shadow .2s}
.field textarea{min-height:120px;resize:vertical;line-height:1.7}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.field input[aria-invalid="true"],.field textarea[aria-invalid="true"]{border-color:var(--bad)}
.field__err{font-size:.75rem;color:var(--bad);margin-top:5px;display:none}
.field__err.is-on{display:block}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:var(--s4)}
.form__note{font-size:.75rem;color:var(--ink-3);margin-top:var(--s3);line-height:1.7}

/* ============================================================
   19. 文章 / 详情
   ============================================================ */
.article{background:var(--bg-layer);border:1px solid var(--stroke);border-radius:var(--r-lg);
  padding:var(--s7);box-shadow:var(--sh-1)}
.article h2{font-size:clamp(1.375rem,2.4vw,1.875rem);font-weight:700;line-height:1.4;
  margin-bottom:var(--s4);letter-spacing:-.02em}
.article__meta{display:flex;flex-wrap:wrap;gap:var(--s4);padding-bottom:var(--s4);
  margin-bottom:var(--s5);border-bottom:1px solid var(--divider);
  font-family:var(--font-mono);font-size:.75rem;color:var(--ink-3)}
.article p{font-size:1rem;line-height:2.05;color:var(--ink-2);margin-bottom:var(--s4)}
.article p:last-child{margin-bottom:0}
.article img{border-radius:var(--r-md);margin-block:var(--s4);box-shadow:var(--sh-1)}
.article figure{margin-block:var(--s5)}
.article figcaption{text-align:center;font-size:.8125rem;color:var(--ink-3);margin-top:var(--s2)}
.article blockquote{margin-block:var(--s5);padding:var(--s5);border-left:4px solid var(--brand);
  background:var(--brand-softer);border-radius:var(--r-md);
  font-size:.9375rem;line-height:1.9;color:var(--ink-2)}
.article__tags{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s6);
  padding-top:var(--s5);border-top:1px solid var(--divider)}
.tag{padding:5px 14px;border-radius:var(--r-pill);font-size:.75rem;
  background:var(--accent-soft);color:var(--accent);font-weight:600}
.tag--brand{background:var(--brand-soft);color:var(--brand-text)}

.layout{display:grid;grid-template-columns:1fr 300px;gap:var(--s6);align-items:start}
.aside{position:sticky;top:88px;display:flex;flex-direction:column;gap:var(--s4)}
.aside__box{background:var(--bg-layer);border:1px solid var(--stroke);border-radius:var(--r-lg);
  padding:var(--s5);box-shadow:var(--sh-1)}
.aside__t{font-size:.9375rem;font-weight:650;margin-bottom:var(--s4);
  padding-bottom:var(--s3);border-bottom:1px solid var(--divider)}
.aside__list a{display:block;padding:10px 0;font-size:.875rem;color:var(--ink-2);
  border-bottom:1px solid var(--divider);transition:color .2s}
.aside__list a:last-child{border-bottom:0}
.aside__list a:hover{color:var(--accent)}
.aside__cta{background:linear-gradient(135deg,var(--accent-solid),var(--accent-hover));
  color:#fff;border-radius:var(--r-lg);padding:var(--s5);box-shadow:var(--sh-3)}
.aside__cta p{font-size:.875rem;line-height:1.8;opacity:.92;margin-bottom:var(--s4)}

/* 上一篇 / 下一篇 */
.pager{display:grid;grid-template-columns:1fr 1fr;gap:var(--s4);margin-top:var(--s6)}
.pager a{background:var(--bg-layer);border:1px solid var(--stroke);border-radius:var(--r-lg);
  padding:var(--s4) var(--s5);box-shadow:var(--sh-1);transition:all .25s var(--ease)}
.pager a:hover{border-color:var(--accent);box-shadow:var(--sh-2)}
.pager span{display:block;font-family:var(--font-mono);font-size:.6875rem;color:var(--ink-3);
  text-transform:uppercase;letter-spacing:.1em;margin-bottom:4px}
.pager b{font-size:.9375rem;font-weight:600;line-height:1.5}
.pager a:last-child{text-align:right}

/* ============================================================
   20. 为什么选择我们 —— 图文错位
   ============================================================ */

.why__fig{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-3)}

/* 地图地址条 */
.mapband{position:relative;overflow:hidden;isolation:isolate}
.mapband__bg{position:absolute;inset:0;z-index:-1}
.mapband__bg img{width:100%;height:100%;object-fit:cover}
.mapband__bg::after{content:"";position:absolute;inset:0;background:var(--scrim)}
.mapband__card{max-width:460px;background:rgba(28,28,30,.82);
  backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);
  border:1px solid rgba(255,255,255,.16);border-radius:var(--r-lg);
  padding:var(--s6);color:#fff;box-shadow:var(--sh-4)}
.mapband__t{font-size:1.25rem;font-weight:700;margin-bottom:var(--s4)}
.mapband__row{display:flex;gap:12px;align-items:flex-start;margin-top:var(--s3);
  font-size:.9375rem;line-height:1.7;color:rgba(255,255,255,.86)}
.mapband__row svg{width:18px;height:18px;flex:none;color:var(--brand);margin-top:3px}

/* ============================================================
   21. CTA
   ============================================================ */
.cta{display:grid;grid-template-columns:1fr auto;gap:var(--s6);align-items:center;
  background:var(--bg-layer);border:1px solid var(--stroke);border-radius:var(--r-xl);
  padding:var(--s7);box-shadow:var(--sh-2);position:relative;overflow:hidden}
.cta::before{content:"";position:absolute;top:-40%;right:-10%;width:340px;height:340px;
  border-radius:50%;background:var(--brand-softer);z-index:0}
.cta>*{position:relative;z-index:1}
.cta__t{font-size:clamp(1.5rem,2.6vw,2.125rem);font-weight:700;letter-spacing:-.02em;
  margin-bottom:var(--s3)}
.cta__d{font-size:.9375rem;color:var(--ink-2);line-height:1.8;margin-bottom:var(--s5)}
.cta__actions{display:flex;gap:var(--s3);flex-wrap:wrap}

/* ============================================================
   22. FOOTER
   ============================================================ */
.site-footer{background:var(--bg-layer);border-top:1px solid var(--stroke);
  padding-block:var(--s7) var(--s5)}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:var(--s6)}
.footer-grid h4{font-size:.9375rem;font-weight:650;margin-bottom:var(--s4)}
.footer-grid p,.footer-grid li{font-size:.875rem;color:var(--ink-3);line-height:2}
.footer-list{list-style:none}
.footer-list a{transition:color .2s}
.footer-list a:hover{color:var(--accent)}
.footer-logo{height:32px;width:auto;margin-bottom:var(--s3)}
.footer-contact li{display:flex;gap:10px;align-items:flex-start}
.footer-contact svg{width:16px;height:16px;flex:none;color:var(--accent);margin-top:5px}
.footer-qr{display:flex;gap:var(--s3);margin-top:var(--s4)}
.footer-qr img{width:84px;height:84px;background:#fff;padding:6px;border-radius:var(--r-sm);
  border:1px solid var(--stroke)}
.footer-bot{margin-top:var(--s7);padding-top:var(--s5);border-top:1px solid var(--divider);
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--s4);
  font-family:var(--font-mono);font-size:.6875rem;color:var(--ink-3)}
.footer-bot a{color:var(--accent)}
.footer-bot a:hover{text-decoration:underline}

/* ============================================================
   23. REVEAL
   ============================================================ */
.js .reveal{opacity:0;transform:translateY(14px);
  transition:opacity .5s var(--ease-out),transform .5s var(--ease-out)}
.js .reveal.is-in{opacity:1;transform:none}
.js .reveal[data-d="1"]{transition-delay:.06s}
.js .reveal[data-d="2"]{transition-delay:.12s}
.js .reveal[data-d="3"]{transition-delay:.18s}
.js .reveal[data-d="4"]{transition-delay:.24s}
.js .reveal[data-d="5"]{transition-delay:.30s}

/* ============================================================
   24. ADMIN —— Fluent 控制面板
   ============================================================ */
.admin{display:grid;grid-template-columns:256px 1fr;min-height:100vh}
.admin__main{min-width:0}
.sider{background:var(--mica);backdrop-filter:blur(28px) saturate(160%);
  -webkit-backdrop-filter:blur(28px) saturate(160%);
  border-right:1px solid var(--stroke);padding:var(--s5) var(--s4);
  display:flex;flex-direction:column;gap:2px;position:sticky;top:0;height:100vh;overflow-y:auto}
.sider .brand{margin-bottom:var(--s6)}
.sider .brand--sm{font-size:.9375rem}
.sider a{display:flex;align-items:center;gap:12px;min-height:42px;padding:0 12px;
  border-radius:var(--r);color:var(--ink-2);font-size:.875rem;
  transition:background-color .2s,color .2s}
.sider a:hover{background:var(--accent-softer);color:var(--ink)}
.sider a[aria-current="page"]{background:var(--accent-soft);color:var(--accent);font-weight:600}
.sider .ic{width:18px;text-align:center;flex:none;color:var(--ink-3)}
.sider a[aria-current="page"] .ic{color:var(--accent)}
.sider__foot{margin-top:auto;padding-top:var(--s5);
  font-family:var(--font-mono);font-size:.6875rem;color:var(--ink-3)}
.topbar{height:60px;border-bottom:1px solid var(--stroke);display:flex;align-items:center;
  justify-content:space-between;padding-inline:var(--s6);position:sticky;top:0;
  background:var(--mica);backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);z-index:20}
.topbar__crumbs{font-family:var(--font-mono);font-size:.75rem;color:var(--ink-3)}
.topbar__user{display:flex;align-items:center;gap:10px;font-size:.8125rem;color:var(--ink-2)}
.avatar{width:30px;height:30px;border-radius:50%;
  background:linear-gradient(135deg,var(--accent),var(--accent-hover));
  color:var(--accent-ink);display:grid;place-items:center;font-size:.75rem;font-weight:600}
.pad{padding:var(--s6)}
.stack{display:flex;flex-direction:column;gap:var(--s5)}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s4)}
.kpi{background:var(--bg-layer);border:1px solid var(--stroke);border-radius:var(--r-lg);
  padding:var(--s5);box-shadow:var(--sh-1);
  transition:box-shadow .25s var(--ease),transform .25s var(--ease)}
.kpi:hover{box-shadow:var(--sh-3);transform:translateY(-3px)}
.kpi__l{font-size:.8125rem;color:var(--ink-3)}
.kpi__v{font-size:2rem;font-weight:700;letter-spacing:-.03em;margin-block:var(--s2) 4px}
.kpi__d{font-family:var(--font-mono);font-size:.6875rem;color:var(--ink-3)}
.kpi__d--up{color:var(--ok)}
.kpi__bar{display:flex;align-items:flex-end;gap:3px;height:30px;margin-top:var(--s4)}
.kpi__bar i{flex:1;background:linear-gradient(180deg,var(--accent),var(--accent-hover));
  border-radius:2px;opacity:.75}
.panel{background:var(--bg-layer);border:1px solid var(--stroke);border-radius:var(--r-lg);
  box-shadow:var(--sh-1);overflow:hidden}
.panel__hd{display:flex;align-items:center;justify-content:space-between;
  padding:var(--s4) var(--s5);border-bottom:1px solid var(--divider)}
.panel__hd h3{font-size:.9375rem;font-weight:600}
.panel__hd a{font-size:.8125rem;color:var(--accent)}
table{width:100%;border-collapse:collapse;font-size:.875rem}
th,td{text-align:left;padding:13px var(--s5);border-bottom:1px solid var(--divider)}
th{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-3);font-weight:500}
td{color:var(--ink-2)}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover{background:var(--accent-softer)}
.st{display:inline-flex;align-items:center;gap:6px;font-size:.75rem;font-family:var(--font-mono)}
.st::before{content:"";width:7px;height:7px;border-radius:50%;flex:none}
.st--ok{color:var(--ok)} .st--ok::before{background:var(--ok)}
.st--warn{color:var(--warn)} .st--warn::before{background:var(--warn)}
.st--off{color:var(--ink-3)} .st--off::before{background:var(--ink-3)}
.quick{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s4)}
.quick a{background:var(--bg-layer);border:1px solid var(--stroke);border-radius:var(--r-lg);
  padding:var(--s5);display:flex;flex-direction:column;gap:var(--s2);min-height:104px;
  justify-content:center;box-shadow:var(--sh-1);
  transition:box-shadow .25s var(--ease),transform .25s var(--ease),border-color .25s}
.quick a:hover{box-shadow:var(--sh-3);transform:translateY(-3px);border-color:var(--stroke-strong)}
.quick b{font-size:.9375rem;font-weight:600}
.quick span{font-size:.75rem;color:var(--ink-3)}
.quick .ic{color:var(--accent);font-size:1.125rem}

/* ============================================================
   25. RESPONSIVE
   ============================================================ */
@media(max-width:1180px){
  .hotline{display:none}
  .flow{grid-template-columns:repeat(3,1fr)}
  .flow__step::after{display:none}
  .services{grid-template-columns:repeat(2,1fr)}
  .cases{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:1100px){
  .col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9{grid-column:span 12}
  .footer-grid{grid-template-columns:1fr 1fr}
  .kpis,.quick{grid-template-columns:1fr 1fr}
  .layout{grid-template-columns:1fr}
  .aside{position:static}
}
@media(max-width:960px){
  .nav{
    position:absolute;top:64px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;
    background:var(--mica-strong);backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);
    border-bottom:1px solid var(--stroke);
    max-height:0;overflow:hidden;transition:max-height .3s var(--ease);
  }
  .nav.is-open{max-height:520px}
  .nav a{padding-block:15px;border-bottom:1px solid var(--divider);min-height:44px;
    display:flex;align-items:center}
  .nav-toggle{display:grid;place-items:center}
  .tiles{grid-template-columns:repeat(2,1fr)}
  .about,.contact-grid,.value,.strengths,.why{grid-template-columns:1fr}

  .timeline__svg{opacity:.9}
  .tl-card{padding:12px 14px}
  .tl-node{width:13px;height:13px}
  .cta{grid-template-columns:1fr}
  .band{padding-block:var(--s8)}
}
@media(max-width:720px){
  .grid12{gap:var(--s4)}
  .flow{grid-template-columns:1fr 1fr}
  .services,.cases{grid-template-columns:1fr}
  .form__row{grid-template-columns:1fr;gap:0}
  .footer-grid{grid-template-columns:1fr}
  .news{flex-direction:column}
  .news__date{width:100%;flex-direction:row;gap:var(--s3);padding:var(--s3)}
  .news__day{font-size:1.5rem}
  .news__ym{margin-top:0}
  .pager{grid-template-columns:1fr}
  .pager a:last-child{text-align:left}
  .admin{grid-template-columns:1fr}
  .sider{display:none}
  .article{padding:var(--s5)}
  .about__text{padding:var(--s5)}
}
@media(max-width:520px){
  .tiles,.flow,.kpis,.quick{grid-template-columns:1fr}
  .hero__actions .btn{width:100%}
  .value__card{flex-direction:column}
  .value__fig{width:100%;height:150px}
  .article{padding:var(--s4)}
  .cinfo{padding:var(--s5)}
}
@media(hover:none){
  .tile:hover,.service:hover,.case:hover,.strength:hover,.flow__step:hover,
  .kpi:hover,.quick a:hover{transform:none}
  .news:hover{transform:none}
  .case:hover .case__fig img,.service:hover .service__fig img{transform:none}
}

/* ============================================================
   26. A11Y
   ============================================================ */
/* 未手动切换过主题时（无本地偏好），跟随系统亮暗。
   令牌值与上方 [data-theme="dark"] 保持完全一致，避免内联脚本
   写入 data-theme 瞬间产生色差跳变。 */
@media(prefers-color-scheme:dark){
  :root:not([data-theme]){
    --bg:#202020;
    --bg-layer:#2B2B2B;
    --bg-layer-alt:#272727;
    --bg-elevated:#323232;
    --mica:rgba(43,43,43,.72);
    --mica-strong:rgba(43,43,43,.85);
    --stroke:rgba(255,255,255,.09);
    --stroke-strong:rgba(255,255,255,.17);
    --divider:rgba(255,255,255,.07);

    --ink:#FFFFFF;
    --ink-2:#C8C8C8;
    --ink-3:#A0A0A0;
    --ink-invert:#1A1A1A;

    --accent:#4CC2FF;
    --accent-solid:#4CC2FF;
    --accent-hover:#42B5EB;
    --accent-ink:#000000;
    --accent-soft:rgba(76,194,255,.14);
    --accent-softer:rgba(76,194,255,.08);
    --focus:#7FD4FF;

    --brand:#FDAF4C;
    --brand-hover:#FFC46B;
    --brand-ink:#1A1A1A;
    --brand-text:#FDAF4C;
    --brand-soft:rgba(253,175,76,.16);
    --brand-softer:rgba(253,175,76,.08);

    --ok:#6CCB5F; --warn:#FCE100; --bad:#FF99A4;

    --sh-1:0 1px 2px rgba(0,0,0,.32),0 0 1px rgba(0,0,0,.24);
    --sh-2:0 2px 4px rgba(0,0,0,.36),0 0 2px rgba(0,0,0,.28);
    --sh-3:0 8px 16px rgba(0,0,0,.40),0 2px 4px rgba(0,0,0,.32);
    --sh-4:0 16px 32px rgba(0,0,0,.48),0 4px 8px rgba(0,0,0,.36);
    --sh-brand:0 8px 24px rgba(253,175,76,.24);

    --halo-1:rgba(0,120,215,.16);
    --halo-2:rgba(253,175,76,.10);
    --halo-3:rgba(120,80,220,.10);

    --scrim:linear-gradient(to top,rgba(0,0,0,.88),rgba(0,0,0,.5)55%,rgba(0,0,0,.15));
  }
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;
    animation-iteration-count:1!important;transition-duration:.001ms!important}
  .js .reveal{opacity:1;transform:none}
  html{scroll-behavior:auto}
}
@media print{
  .site-header,.cta,.progress,.hero__field,.theme-btn,.nav-toggle,
  .filters,.pbanner__bg{display:none!important}
  body{background:#fff;color:#000}
}

/* ══ 荣誉资质（about 页，数据驱动占位） ══ */
.honor-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--s5);margin-top:var(--s6)}
.cert{margin:0;background:var(--bg-layer);border:1px solid var(--stroke);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-1);transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.cert:hover{transform:translateY(-4px);box-shadow:var(--sh-3)}
.cert__frame{aspect-ratio:4/5;background:var(--bg-layer-alt);display:flex;align-items:center;justify-content:center;overflow:hidden}
.cert__frame img{width:100%;height:100%;object-fit:cover;display:block}
.cert__cap{display:block;padding:var(--s3) var(--s4) 2px;font-weight:700;color:var(--ink);font-size:1.02rem}
.cert__note{margin:0;padding:0 var(--s4) var(--s4);color:var(--ink-2);font-size:.86rem;line-height:1.55}

/* ══ 案例详情：封面头图 + 项目截图画廊 ══ */
.case-hero{margin:var(--s5) 0 var(--s6);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-1);background:var(--bg-layer);border:1px solid var(--stroke)}
.case-hero img{display:block;width:100%;height:auto;max-height:480px;object-fit:cover}
.case-gallery{margin-top:var(--s7)}
.case-gallery__t{font-size:1.05rem;margin:0 0 var(--s4);padding-left:var(--s3);border-left:3px solid var(--brand);color:var(--ink)}
.case-gallery__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4)}
.case-gallery__item{display:block;border-radius:var(--r-md);overflow:hidden;box-shadow:var(--sh-1);background:var(--bg-layer);border:1px solid var(--stroke);transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.case-gallery__item:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
.case-gallery__item img{display:block;width:100%;height:168px;object-fit:cover}
@media (max-width:720px){.case-gallery__grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:480px){.case-gallery__item img{height:132px}}