/* =========================================================
   雄安城事 CITORY · 官网样式
   依据《雄安城事五组色彩系统 · 终版 V2.0》
   第 03 节「雄安城事 · 母品牌」+ 第 02 节「通用品牌色彩 · 统一层」

   色彩纪律（与规范逐条对齐）
   - 唯一主色：湖淀青 #0E7C7B；浅底小号青字改用深淀青 #123F42
   - 唯一深底：淀墨青黑 #0B1E2D（hero / 联系区 / 页脚）
   - 默认浅底：暖白 #F7F5EF；标题与正文：墨黑 #1A1A1A
   - 深底文字：云白 #F5F7FA；深底次级文字：淀蓝灰 #B8C4C0；深底强调：芦苇金 #D9A441
   - 事印朱 #B5402E 只做印章级点睛（全站仅 .seal 一处）
   - 签名渐变：5 停 · 45° · OKLab 感知插值（规范：禁用 sRGB 直插）
   - 强调色总额 ≤5%；单场景只启用一条线色
   - 所有色值一律在 :root 声明，规则区内不再出现硬编码色值
   ========================================================= */
:root{
  --ink:#1A1A1A;            /* 墨黑 · 标题与正文（规范：任何浅底上的文字） */
  --gray:rgba(26,26,26,.70);/* 墨黑派生 · 浅底次级文字 */
  --paper:#F7F5EF;          /* 暖白 · 默认浅底 */
  --panel:#F2EDE4;          /* 浅米 · 面板底（规范「暖白页面上的面板底」） */
  --surface:#FFFFFF;        /* 派生中性 · 卡片/分区底（非色卡色，显式声明） */
  --on-accent:#FFFFFF;      /* 派生 · 主色块上的文字 */
  --cloud:#F5F7FA;          /* 云白 · 深底正文（星白） */
  --teal:#0E7C7B;           /* 湖淀青 · 唯一主色 */
  --teal-deep:#123F42;      /* 深淀青 · 浅底小号青字 / 主色悬停按压 */
  --blue:#2D6CDF;           /* 未来蓝 · 科技线 */
  --violet:#7A3B66;         /* 织锦绛紫 · 千年城事录（子品牌色） */
  --clay:#8A4B22;           /* 深陶棕 · 城事 Citories（子品牌色） */
  --dian:#0B1E2D;           /* 淀墨青黑 · 唯一深底 */
  --slate:#B8C4C0;          /* 淀蓝灰 · 深底次级文字 */
  --gold:#D9A441;           /* 芦苇金 · 深底强调 */
  --seal:#B5402E;           /* 事印朱 · 印章级点睛 */
  --hair:#E5DDD2;           /* 线灰 · 暖色系分隔线/描边 */

  /* 上面各色的 RGB 分量，供 rgba() 派生透明度使用（保证规则区不出现字面色值） */
  --paper-rgb:247,245,239;
  --cloud-rgb:245,247,250;
  --ink-rgb:26,26,26;
  --teal-rgb:14,124,123;
  --blue-rgb:45,108,223;
  --deep-rgb:18,63,66;
  --slate-rgb:184,196,192;
  --gold-rgb:217,164,65;

  /* 签名渐变：sRGB 五停兜底；下方 @supports 用 OKLab 版本覆盖 */
  --grad:linear-gradient(45deg,#0E7C7B 0%,#127A95 25%,#1977AE 50%,#2372C6 75%,#2D6CDF 100%);
  --grad-qncsl:linear-gradient(45deg,#D9A441 0%,#A0763B 25%,#6B4A31 50%,#72444D 75%,#7A3B66 100%);
  --grad-citories:linear-gradient(45deg,#E85D26 0%,#C16D69 25%,#987395 50%,#6B73BB 75%,#2D6CDF 100%);
  --grad-citor:linear-gradient(45deg,#1FD9F0 0%,#4FC9F2 25%,#5BAEFF 50%,#6B94FF 75%,#7D61FF 100%);

  --en:'Segoe UI',system-ui,-apple-system,'Helvetica Neue',Arial,sans-serif;
  --cn:'PingFang SC','Hiragino Sans GB','Source Han Sans SC','Noto Sans SC','Microsoft YaHei',sans-serif;
}
/* 渐变一律 OKLab 感知插值（规范明写「禁用 sRGB 直插」）；不支持的浏览器自动回落到上方 sRGB 五停版本 */
@supports (background-image:linear-gradient(in oklab,red,blue)){
  :root{
    --grad:linear-gradient(45deg in oklab,#0E7C7B 0%,#127A95 25%,#1977AE 50%,#2372C6 75%,#2D6CDF 100%);
    --grad-qncsl:linear-gradient(45deg in oklab,#D9A441 0%,#A0763B 25%,#6B4A31 50%,#72444D 75%,#7A3B66 100%);
    --grad-citories:linear-gradient(45deg in oklab,#E85D26 0%,#C16D69 25%,#987395 50%,#6B73BB 75%,#2D6CDF 100%);
    --grad-citor:linear-gradient(45deg in oklab,#1FD9F0 0%,#4FC9F2 25%,#5BAEFF 50%,#6B94FF 75%,#7D61FF 100%);
  }
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--cn);background:var(--paper);color:var(--ink);font-size:15.5px;line-height:1.85;-webkit-font-smoothing:antialiased}
.en{font-family:var(--en)}
a{color:inherit;text-decoration:none}
ul{list-style:none}
img,svg{max-width:100%;display:block}
.wrap{max-width:1120px;margin:0 auto;padding:0 28px}
section{scroll-margin-top:78px}

/* ---------- 顶部导航 ---------- */
.site-header{position:sticky;top:0;z-index:50;background:rgba(var(--paper-rgb),.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid transparent;transition:border-color .25s,box-shadow .25s}
.site-header.scrolled{border-bottom-color:var(--hair);box-shadow:0 2px 14px rgba(var(--ink-rgb),.05)}
.header-in{display:flex;align-items:center;justify-content:space-between;height:66px}
.brand{display:flex;align-items:center;gap:11px}
.brand-mark svg{width:34px;height:34px}
.brand-t{display:flex;flex-direction:column;line-height:1.2}
.brand-t b{font-size:17.5px;font-weight:800;letter-spacing:2px;color:var(--ink)}
.brand-t i{font-style:normal;font-family:var(--en);font-size:11px;letter-spacing:5px;color:var(--teal-deep);margin-top:2px}
.nav{display:flex;align-items:center;gap:30px}
.nav > a:not(.btn){font-size:14.5px;color:var(--ink);font-weight:500;position:relative;padding:4px 0}
.nav > a.btn{padding:9px 20px;font-size:14px;letter-spacing:.5px;border-radius:10px;line-height:1.25}
.nav > a:not(.btn)::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:2px;background:var(--teal);transition:width .25s}
.nav > a:not(.btn):hover::after{width:100%}
.nav-toggle{display:none;background:none;border:0;cursor:pointer;padding:8px}
.nav-toggle span{display:block;width:20px;height:2px;background:var(--ink);margin:4.5px 0;transition:.25s}

/* ---------- 按钮 ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 28px;border-radius:10px;font-weight:700;font-size:15px;letter-spacing:1px;transition:background .2s,border-color .2s,transform .2s,box-shadow .2s;cursor:pointer}
.btn:active{transform:translateY(1px)}
.btn-sm{padding:9px 20px;font-size:13.5px;border-radius:8px}
.btn-primary{background:var(--teal);color:var(--on-accent)}
.btn-primary:hover{background:var(--teal-deep)}
.btn-gradient{background:var(--grad);color:var(--on-accent);box-shadow:0 8px 22px rgba(var(--teal-rgb),.28)}
.btn-gradient:hover{box-shadow:0 10px 26px rgba(var(--blue-rgb),.36)}
.btn-ghost-light{border:1px solid rgba(var(--cloud-rgb),.38);color:var(--cloud)}
.btn-ghost-light:hover{border-color:var(--cloud)}

/* ---------- HERO ---------- */
.hero{background:var(--dian);color:var(--cloud);position:relative;overflow:hidden}
.hero-in{padding:180px 28px 160px;position:relative;z-index:2}
.eyebrow{font-family:var(--en);font-size:clamp(10px,2.9vw,12px);letter-spacing:.22em;color:var(--slate);text-transform:uppercase;white-space:nowrap}
.hero h1{font-size:clamp(20px,6.5vw,40px);font-weight:800;line-height:1.42;letter-spacing:.035em;margin:40px 0 40px;color:var(--cloud);white-space:nowrap}
.hero h1 .gold{display:block;line-height:1.14;color:var(--gold);font-size:clamp(31px,4.8vw,54px)}
.hero h1 .h1-rule{display:block;width:64px;height:4px;border-radius:2px;background:var(--gold);margin:20px 0 18px}
.hero-sub{color:var(--slate);font-size:16px;max-width:560px;line-height:2.05}
/* 按钮与标签跟随文字列（与 hero-sub 同宽 560px）居中，而非整页居中 */
.hero-cta{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;max-width:560px;margin-top:56px}
.hero-tags{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;max-width:560px;margin-top:48px}
.hero-tags li{font-family:var(--en);font-size:11.5px;letter-spacing:.18em;padding:6px 15px;border:1px solid rgba(var(--slate-rgb),.35);border-radius:99px;color:var(--slate)}
.hero-ring{position:absolute;right:-140px;top:-120px;width:560px;height:560px;opacity:.05;z-index:1}
.px{position:absolute;border-radius:3px;z-index:1}
.px-grad{width:30px;height:30px;right:14%;top:26%;background:var(--grad);opacity:.9}
.px-gold{width:16px;height:16px;right:9.5%;top:47%;background:var(--gold);opacity:.85}
.px-line{width:10px;height:10px;right:16.5%;top:58%;border:1.5px solid var(--teal);opacity:.55}
.hero-bar{height:4px;background:var(--grad)}

/* ---------- 速览 ---------- */
.stats{background:var(--surface);border-bottom:1px solid var(--hair);padding:44px 0 8px}
.stats-in{display:grid;grid-template-columns:repeat(4,1fr)}
.stat{padding:6px 26px;border-left:1px solid var(--hair)}
.stat:first-child{border-left:0;padding-left:0}
.stat b{display:block;font-size:21px;font-weight:900;color:var(--ink);letter-spacing:1px}
.stat span{font-size:13px;color:var(--gray)}

/* ---------- 章节公共 ---------- */
.sec{padding:86px 0 44px}
/* 01-03 内容板块底部增加间距，板块间留白更舒展 */
#about,#services,#ip{padding-bottom:88px}
.sec-alt{background:var(--surface)}
.sec-alt .svc-card,.sec-alt .case-card{background:var(--paper)}
.sechead{display:flex;align-items:baseline;gap:16px;border-bottom:2px solid var(--ink);padding-bottom:14px;margin-bottom:34px}
.sechead .no{font-family:var(--en);font-size:38px;font-weight:700;color:var(--teal);line-height:1}
.sechead h2{font-size:26px;font-weight:900;letter-spacing:1px;color:var(--ink)}
.sechead .en-sub{font-family:var(--en);margin-left:auto;font-size:11.5px;letter-spacing:.3em;color:var(--gray);text-transform:uppercase}
.sec-intro{font-size:15px;color:var(--gray);margin:-12px 0 34px;line-height:2}

/* ---------- 01 关于 ---------- */
.about-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:44px;align-items:start}
.seal{display:inline-block;width:56px;transform:rotate(-6deg);margin-bottom:6px}
.seal svg path{fill:var(--seal)}
.seal svg rect{fill:var(--gold)}
.big-quote{font-size:30px;font-weight:900;color:var(--ink);letter-spacing:1px;margin-bottom:16px}
.about-lead p:not(.big-quote){font-size:14.5px;color:var(--ink);line-height:2.05;margin-bottom:14px;text-align:justify}
.tri{display:grid;gap:14px}
.tri-card{background:var(--surface);border:1px solid var(--hair);border-radius:14px;padding:20px 24px}
.tri-card h3{font-size:16.5px;font-weight:800;color:var(--ink);display:flex;align-items:center;gap:10px;margin-bottom:6px}
.tri-card p{font-size:13.5px;color:var(--gray);line-height:1.95;text-align:justify}
.dot{width:9px;height:9px;border-radius:2.5px;flex:none}
.dot-blue{background:var(--blue)}
.dot-teal{background:var(--teal)}
.dot-gold{background:var(--gold)}
.value-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;background:var(--panel);border:1px solid var(--hair);border-radius:14px;padding:22px 26px;margin-top:26px}
.value-strip div{display:flex;flex-direction:column;gap:2px}
.value-strip b{font-size:15px;color:var(--teal-deep);letter-spacing:1px}
.value-strip b::before{content:"";display:inline-block;width:7px;height:7px;background:var(--teal);border-radius:2px;margin-right:8px;vertical-align:1px}
.value-strip span{font-size:13px;color:var(--gray)}

/* ---------- 02 核心业务 ---------- */
.svc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.svc-card{background:var(--surface);border:1px solid var(--hair);border-radius:16px;padding:28px 30px;transition:transform .25s,box-shadow .25s}
.svc-card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(var(--ink-rgb),.08)}
.svc-icon{display:inline-flex;width:46px;height:46px;border-radius:12px;background:rgba(var(--teal-rgb),.09);color:var(--teal);align-items:center;justify-content:center;margin-bottom:16px}
.svc-icon svg{width:23px;height:23px}
.svc-card h3{font-size:18px;font-weight:800;color:var(--ink);margin-bottom:4px}
.svc-pos{font-size:13px;color:var(--gray);margin-bottom:14px}
.svc-card ul li{position:relative;padding-left:18px;font-size:13.5px;color:var(--ink);line-height:2.1}
.svc-card ul li::before{content:"";position:absolute;left:2px;top:.95em;width:6px;height:6px;background:var(--teal);border-radius:2px}
.svc-ai .svc-icon{background:rgba(var(--blue-rgb),.09);color:var(--blue)}
.svc-ai ul li::before{background:var(--blue)}

/* ---------- 03 内容 IP ---------- */
.ip-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.ip-card{background:var(--surface);border:1px solid var(--hair);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;transition:transform .25s,box-shadow .25s}
.ip-card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(var(--ink-rgb),.08)}
.ip-bar{height:6px;flex:none}
.ip-card--qncsl .ip-bar{background:var(--grad-qncsl)}
.ip-card--citories .ip-bar{background:var(--grad-citories)}
.ip-card--citor .ip-bar{background:var(--grad-citor)}
.ip-body{padding:24px 26px 26px;display:flex;flex-direction:column;flex:1}
.ip-en{font-family:var(--en);font-size:10px;letter-spacing:.28em;color:var(--gray);text-transform:uppercase}
.ip-body h3{font-size:21px;font-weight:900;color:var(--ink);margin:6px 0 2px}
.ip-body h3 i{font-style:normal;font-size:14px;font-weight:600;color:var(--gray);margin-left:4px}
.ip-slogan{font-size:14.5px;font-weight:700;margin:6px 0 10px}
.ip-card--qncsl .ip-slogan{color:var(--violet)}   /* 文脉 · 织锦绛紫 */
.ip-card--citories .ip-slogan{color:var(--clay)}  /* 深陶棕 */
.ip-card--citor .ip-slogan{color:var(--blue)}     /* 未来蓝 */
.ip-desc{font-size:13px;color:var(--gray);line-height:1.95;flex:1;text-align:justify}
.ip-chips{display:flex;flex-wrap:wrap;gap:7px;margin:16px 0 14px}
.ip-chips li{font-size:11.5px;color:var(--teal-deep);background:rgba(var(--deep-rgb),.07);border-radius:99px;padding:3px 11px}
.ip-link{font-family:var(--en);font-size:12.5px;letter-spacing:.08em;color:var(--teal-deep);border-top:1px solid var(--hair);padding-top:13px}
.ip-link:hover{color:var(--blue)}

/* ---------- 04 案例 ---------- */
.case-sub{font-size:17px;font-weight:800;color:var(--ink);margin:34px 0 16px;display:flex;align-items:center;gap:10px}
.case-sub::before{content:"";width:8px;height:8px;background:var(--teal);border-radius:2px}
.case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.case-card{background:var(--surface);border:1px solid var(--hair);border-radius:14px;padding:20px 22px;transition:transform .25s,box-shadow .25s}
.case-card:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(var(--ink-rgb),.07)}
.case-tag{display:inline-block;font-size:11px;font-weight:600;letter-spacing:1px;color:var(--teal-deep);background:rgba(var(--deep-rgb),.07);border-radius:99px;padding:3px 11px;margin-bottom:10px}
.case-card h4{font-size:15.5px;font-weight:800;color:var(--ink);margin-bottom:5px;line-height:1.5}
.case-card p{font-size:12.8px;color:var(--gray);line-height:1.85}

/* ---------- 联系（深底） ---------- */
.contact{background:var(--dian);color:var(--cloud);margin-top:112px}
.contact::before{content:"";display:block;height:4px;background:var(--grad)}
.contact-lead{display:flex;flex-direction:column;justify-content:flex-start}
.contact-in{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;padding:96px 28px 88px}
/* 联系区信息行：标签 + 值（浅色横线分隔，竖线弱化标签列） */
.c-rows{display:flex;flex-direction:column}
.c-rows li{display:flex;align-items:baseline;gap:14px;padding:13px 0;border-bottom:1px solid rgba(var(--slate-rgb),.28)}
/* 信息行（官网/地址/区域/团队）整体下方保留横线，与下方内容块分隔 */
.c-rows li:last-child{border-bottom:1px solid rgba(var(--slate-rgb),.28)}
.c-label{flex:none;width:86px;font-size:12px;letter-spacing:.04em;color:rgba(var(--slate-rgb),.7)}
.c-val{font-size:14.5px;letter-spacing:.01em;color:var(--cloud);word-break:break-word}
a.c-val:hover{color:var(--gold)}

/* ---------- 联系区 · 微信名片（唯一洽谈入口）---------- */
.contact-side{display:flex;flex-direction:column;gap:30px}
.wx-card{position:relative;overflow:hidden;display:flex;align-items:center;gap:26px;background:var(--paper);border-radius:16px;padding:26px 26px 24px}
.wx-card::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--grad)}
.wx-info{flex:1;min-width:0}
.wx-id{display:flex;align-items:center;gap:13px}
/* 头像防盗：pointer-events:none 使右键/拖拽/长按事件全部落到父容器上，浏览器不出「图片另存为」菜单 */
.wx-av{width:56px;height:56px;border-radius:14px;object-fit:cover;flex:none;background:var(--panel);pointer-events:none;-webkit-user-drag:none;-webkit-touch-callout:none;user-select:none}
.wx-nm{display:flex;flex-direction:column;line-height:1.4;min-width:0}
.wx-nm b{font-size:16px;font-weight:800;color:var(--ink);letter-spacing:.5px}
.wx-nm i{font-style:normal;font-size:12px;color:var(--gray);margin-top:3px}
.wx-tip{position:relative;margin-top:16px;padding-left:14px;font-size:13.5px;font-weight:600;color:var(--teal-deep);line-height:1.7}
.wx-tip::before{content:"";position:absolute;left:0;top:.6em;width:6px;height:6px;background:var(--teal);border-radius:2px}
.wx-qr{width:168px;height:168px;flex:none}

/* ---------- 底部左栏：品牌签名 + 品牌家族（原页脚内容上移到这里） ---------- */
.c-name{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:13px;align-self:center;width:max-content}
.c-name b{font-size:clamp(19px,6vw,40px);font-weight:800;line-height:1.25;color:var(--cloud);letter-spacing:clamp(1px,.3vw,3px)}
/* 品牌字标：CITY 与 STORY 以「字母归位」方式组合成 CITORY 的滚动触发循环动画；
   未触发 / 无 JS / reduced-motion 时静态显示 CITORY。
   结构：两段词各为一行逐字母 flex（字母间距 .3em 由 margin 提供，flex 不吃 letter-spacing），
   CITY 居左（云白·城市基底）、STORY 居右（芦苇金·苇荡故事），共享一个居中画布（宽 9.4em）。
   合体时多余字母（CITY 的 Y、STORY 的 S/T）隐去并收拢为 0 宽，两词间距同步收拢，
   剩下的 C·I·T·O·R·Y 由 flex 居中无缝拼成 CITORY —— 字母不整词消失，而是直接归位成词。 */
.c-wm{display:flex;justify-content:center;width:9.4em;height:1.5em;margin:0 auto;font-style:normal;font-size:clamp(17px,1.9vw,23px);font-weight:700;line-height:1.5;color:var(--cloud)}
.c-wm .wm-seg{display:flex;white-space:nowrap}
.c-wm .wm-seg i{margin-right:.3em}
.c-wm .wm-seg:last-child i:last-child{margin-right:0}
.c-wm .wm-city{color:var(--cloud)}
.c-wm .wm-story{color:var(--gold);margin-left:0}
.c-wm i.cut{max-width:0;margin-right:0;opacity:0;overflow:hidden}
.js .c-wm.run{animation:wmShow 6s ease-in-out infinite}
.js .c-wm.run .wm-city{animation:wmCity 6s ease-in-out infinite}
.js .c-wm.run .wm-story{animation:wmStory 6s ease-in-out infinite}
.js .c-wm.run i.cut{animation:wmCut 6s ease-in-out infinite}
/* 6s 循环：两词滑入并并排（0–5%）→ 短停留（5–16%）→ 多余字母隐去收拢、两词拼成 CITORY（16–28%）
   → CITORY 停留（28–88%）→ 整体淡出（88–100%） */
@keyframes wmShow{
  0%,88%{opacity:1}
  100%{opacity:0}
}
@keyframes wmCity{
  0%{opacity:0;transform:translateX(-.6em)}
  5%,100%{opacity:1;transform:translateX(0)}
}
@keyframes wmStory{
  0%{opacity:0;transform:translateX(.6em);margin-left:.9em}
  5%,16%{opacity:1;transform:translateX(0);margin-left:.9em}
  28%,100%{opacity:1;transform:translateX(0);margin-left:0}
}
@keyframes wmCut{
  0%,16%{opacity:1;max-width:1em;margin-right:.3em}
  28%,100%{opacity:0;max-width:0;margin-right:0}
}
.c-desc{margin-top:16px;margin-inline:auto;font-size:16px;line-height:2;color:var(--slate);max-width:460px;text-align:center}
.c-desc .en{white-space:nowrap}
/* 品牌家族：深底金字标题 + 云白链接；无横线，底部与右栏二维码卡对齐 */
.c-fam{display:flex;flex-direction:column;gap:32px;margin-top:auto}
.c-fam b{font-size:12px;font-weight:700;letter-spacing:.22em;color:var(--gold);text-transform:uppercase}
.c-fam-links{display:flex;flex-direction:column;gap:12px}
.c-fam-links a{display:flex;align-items:baseline;justify-content:space-between;gap:16px;color:var(--cloud);font-size:14.5px}
.c-fam-links a .en{color:rgba(var(--slate-rgb),.78);font-size:11.5px;letter-spacing:.04em}
/* 悬停引导虚线：填在名称与网址之间、垂直居中；悬停整行时浮现（芦苇金，与悬停态文字同色） */
.c-fam-links a .ln{flex:1;height:0;align-self:center;border-bottom:1px dashed rgba(var(--gold-rgb),.55);opacity:0;transition:opacity .25s ease}
.c-fam-links a:hover .ln{opacity:1}
.c-fam-links a:hover{color:var(--gold)}
.c-fam-links a:hover .en{color:var(--gold)}

/* ---------- 页脚：仅版权与备案 ---------- */
.site-footer{background:var(--dian);color:var(--slate);font-size:13px}
.footer-bar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px 28px;padding:36px 28px 44px;border-top:1px solid rgba(var(--slate-rgb),.14);font-size:12px;color:rgba(var(--slate-rgb),.8)}
.beian{display:flex;align-items:center;flex-wrap:wrap;gap:18px}
.footer-bar .en{letter-spacing:.12em;font-size:10.5px}
.footer-bar a{color:rgba(var(--slate-rgb),.8);transition:color .2s}
.footer-bar a:hover{color:var(--gold)}
.beian a{margin-left:0}
.beian a + a::before{content:"";display:inline-block;width:1px;height:10px;background:rgba(var(--slate-rgb),.3);margin-right:18px;vertical-align:-1px}

/* ---------- 选择与焦点 ---------- */
::selection{background:var(--teal);color:var(--on-accent)}
a:focus-visible,button:focus-visible{outline:2px solid var(--teal);outline-offset:3px;border-radius:2px}
/* 深底区（hero/联系/页脚）青色焦点框对比不足，改用芦苇金 */
.hero a:focus-visible,.contact a:focus-visible,.site-footer a:focus-visible{outline-color:var(--gold)}

/* ---------- 入场动效（渐进增强）
   默认可见：无 JS 或脚本被拦时内容照常呈现；
   只有 JS 真的跑起来（html.js）才隐藏待入场元素。 ---------- */
.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .65s ease,transform .65s ease}
.js .reveal.in{opacity:1;transform:none}
/* 首屏不做入场过渡：LCP 不再被 opacity 过渡推迟（实测 1156ms → 约 500ms） */
.js .hero .reveal,.js .stats .reveal{opacity:1;transform:none;transition:none}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .js .reveal{opacity:1;transform:none;transition:none}
}

/* ---------- 响应式 ---------- */
@media (max-width:1000px){
  .ip-grid{grid-template-columns:1fr 1fr}
  .case-grid{grid-template-columns:1fr 1fr}
  .about-grid{grid-template-columns:1fr;gap:26px}
  .hero-ring{right:-220px}
}
@media (max-width:860px){
  .nav{position:fixed;inset:66px 0 auto 0;background:var(--paper);border-bottom:1px solid var(--hair);flex-direction:column;align-items:flex-start;gap:4px;padding:14px 28px 20px;transform:translateY(-12px);opacity:0;pointer-events:none;visibility:hidden;transition:transform .25s,opacity .25s,visibility .25s;box-shadow:0 18px 30px rgba(var(--ink-rgb),.08)}
  .nav.open{transform:none;opacity:1;pointer-events:auto;visibility:visible}
  .nav > a:not(.btn){padding:9px 0;font-size:15.5px}
  .nav .btn{margin-top:10px}
  .nav-toggle{display:block}
  .nav-toggle.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
  .nav-toggle.open span:nth-child(2){opacity:0}
  .nav-toggle.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
  .stats-in{grid-template-columns:1fr 1fr;gap:18px 0}
  .stat{padding:2px 18px}
  .stat:nth-child(odd){border-left:0;padding-left:0}
  .svc-grid{grid-template-columns:1fr}
  .ip-grid{grid-template-columns:1fr}
  .case-grid{grid-template-columns:1fr}
  .contact{margin-top:80px}
  .contact-in{grid-template-columns:1fr;gap:48px;padding:76px 28px 64px}
  .value-strip{grid-template-columns:1fr;gap:14px}
  .c-desc{font-size:15px}
  .c-fam{margin-top:64px}
  .c-fam-links{flex-direction:column;gap:12px}
  .c-rows li{gap:12px}
  .c-label{width:78px}
  .px,.hero-ring{display:none}
  /* 手机端 hero 收紧：深底高度与纵向间距取桌面与最初版之间 */
  .hero-in{padding:92px 28px 80px}
  .hero h1{margin:28px 0 28px}
  .hero-cta{margin-top:42px}
  .hero-tags{margin-top:34px}
}
/* 两栏中窄（861–1175px）：左栏收窄，公司全称按列宽收缩，保证不换行 */
@media (min-width:861px) and (max-width:1175px){
  .c-name b{font-size:clamp(26px,2.9vw,34px);letter-spacing:2px}
}
/* 手机端：速览四格改为单行列表，每条不换行 */
@media (max-width:560px){
  /* 首页标签三枚一行不换行：收窄字号/字距/内边距（按 360px 屏留有余量） */
  .hero-tags{flex-wrap:nowrap;gap:6px}
  .hero-tags li{font-size:clamp(8px,2.5vw,10.5px);letter-spacing:.08em;padding:5px 8px;white-space:nowrap}
  /* 板块标题单行收纳：整体缩比，编号/中文/英文一行排下且都不换行 */
  .sechead{gap:10px;padding-bottom:12px;margin-bottom:28px}
  .sechead .no{font-size:30px}
  .sechead h2{font-size:20px;white-space:nowrap}
  .sechead .en-sub{font-size:10px;letter-spacing:.18em;white-space:nowrap}
  .wx-card{flex-direction:column;align-items:flex-start;gap:18px}
  .wx-info{width:100%}
  .wx-qr{width:156px;height:156px;align-self:center}
  .wx-tip{margin-top:12px}
  .stats{padding:36px 0 10px}
  .stats-in{grid-template-columns:1fr 1fr;gap:22px 16px}
  .stat{padding:0;border-left:0}
  .stat span{display:block;font-size:clamp(11px,3.1vw,12.5px);line-height:1.6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  /* 页脚：© 行压缩字号保证整行不换行（360px 屏留有余量）；备案字号随继承与 © 行一致；整体上下排列 */
  .footer-bar{flex-direction:column;align-items:flex-start;gap:8px;font-size:11px}
  .footer-bar .en{font-size:10px}
  .beian{flex-direction:column;align-items:flex-start;gap:5px}
  .beian a{margin-left:0}
  .beian a + a::before{display:none}
}
/* 手机窄屏：首屏双按钮强制一行（收窄内边距与字号，360px 屏不换行） */
@media (max-width:420px){
  .hero-cta{flex-wrap:nowrap;gap:12px}
  .hero-cta .btn{padding:12px 18px;font-size:14px;letter-spacing:.5px;white-space:nowrap}
}
@media (max-width:359px){
  .stats-in{grid-template-columns:1fr}
}