/* ============================================================
   微略官网 V6 · 全局框架 + 通用组件 + 各页样式
   ============================================================ */

/* ============ 全站正文/标题 Web Font —— 资源圆体 ============
   来源：Resource Han Rounded（Cyano Hao），基于「中国版思源黑体」做圆角化改造
   授权：SIL Open Font License 1.1 —— 免费商用、可修改、可再分发，无字体侵权风险
   为什么是它：页眉 LOGO 字标是「圆黑」风格（横竖等粗、笔画端点半圆、转角圆滑），
               资源圆体与其同族（同一字骨 + 全圆角），因此全站正文/标题/导航/按钮/数字
               统一改用这一族，实现「全站字体风格一致」。
   子集：已按**本站全站真实字符集**裁剪（PHP 模板 + 后台文案 + JS/CSS + 数据库内容），
         1508 个字形；单文件覆盖 wght 400–800 全部字重（可变字体）
   体积：485KB（woff2）；font-display:swap —— 字体未就绪时先用系统字显示，不阻塞首屏
   ⚠️ 文件名带 -v2 是**故意的**：@font-face 的 url 无法带上 ?v=，若沿用原文件名，
      浏览器会一直命中旧字体缓存 → 改了字体也看不到效果。换文件名 = 最可靠的缓存失效。
      同时 <link rel=preload> 必须用**与之完全一致**的 URL（本项目用 base_url() 拼，
      不带查询串），否则 preload 命不中、字体被下载两次。
   注：weilue-rounded-cn-r60.woff2 为「半圆角」备选版本（圆角更克制），如需切换改此处的 src 即可 */
@font-face{
  font-family:"Weilue Rounded";
  src:url("../fonts/weilue-rounded-cn-v2.woff2") format("woff2");
  font-weight:400 800;font-style:normal;font-display:swap;
}

/* ============ 品牌字标 Web Font（已停用，保留以便回退） ============
   来源：思源宋体 / Noto Serif SC（SIL Open Font License 1.1，可免费商用，无字体侵权风险）
   仅子集「微」U+5FAE +「略」U+7565 两字，字重 700，文件 1.4KB
   2026-10-08 字标已改用客户艺术字位图（assets/img/logo-wordmark-*.png），本字体不再参与渲染 */
@font-face{
  font-family:"Weilue Wordmark";
  src:url("../fonts/weilue-wordmark.woff2") format("woff2");
  font-weight:700;font-style:normal;font-display:swap;
}

/* ============ 版心 / 布局 ============ */
.container{max-width:var(--container);margin:0 auto;padding:0 var(--sp-3);}
.container-narrow{max-width:var(--container-narrow);margin:0 auto;padding:0 var(--sp-3);}
.grid{display:grid;gap:var(--gutter);}
.grid--2{grid-template-columns:repeat(2,1fr);}
.grid--3{grid-template-columns:repeat(3,1fr);}
.grid--4{grid-template-columns:repeat(4,1fr);}
.section{padding:var(--sp-12) 0;}
.section--lg{padding:var(--sp-15) 0;}
.section--dark{background:var(--surface-dark);color:var(--on-indigo);}
.section--cream{background:var(--bg-cream);}
.section--white{background:var(--white);}
.section--tight{padding:var(--sp-8) 0;}
.text-center{text-align:center;}
.anchor-target{scroll-margin-top:calc(var(--header-h) + var(--sp-2));}

/* ============ 按钮 Button（四型） ============ */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-1);
  height:48px;padding:0 var(--sp-3);
  border-radius:var(--radius);
  font-size:var(--fs-body);font-weight:var(--fw-semibold);
  line-height:1;white-space:nowrap;cursor:pointer;
  transition:background-color var(--transition-fast),color var(--transition-fast),
             transform var(--transition-fast),box-shadow var(--transition-fast),
             border-color var(--transition-fast);
  border:1.5px solid transparent;
}
.btn--primary{background:var(--cta-bg);color:var(--white);}
.btn--primary:hover{background:var(--cta-bg-hover);transform:translateY(-2px);box-shadow:var(--shadow-hover);}
.btn--secondary{background:var(--white);color:var(--brand-indigo);border-color:var(--brand-indigo);}
.btn--secondary:hover{background:var(--bg-cream);transform:translateY(-2px);}
.btn--gold{background:var(--cta-accent-bg);color:var(--cta-accent-text);}
.btn--gold:hover{background:var(--gold-hover);transform:translateY(-2px);box-shadow:var(--shadow-hover);}
.btn--link{height:auto;padding:0;background:none;color:var(--brand-indigo);border:none;font-weight:var(--fw-semibold);}
.btn--link:hover{color:var(--gold-hover);}
.btn--link .arrow{transition:transform var(--transition-fast);}
.btn--link:hover .arrow{transform:translateX(2px);}
.btn--sm{height:36px;padding:0 var(--sp-2);font-size:var(--fs-sm);}
.btn--lg{height:56px;padding:0 var(--sp-4);font-size:var(--fs-h4);}
.btn--full{width:100%;}
.btn[disabled],.btn.is-disabled{opacity:.5;cursor:not-allowed;transform:none !important;box-shadow:none !important;}
.btn--ghost-light{background:transparent;color:var(--on-indigo);border-color:var(--on-indigo);}
.btn--ghost-light:hover{background:var(--on-indigo-soft);}

/* ============ 区块标题 SectionTitle ============ */
.c-sectiontitle{margin-bottom:var(--sp-6);}
.c-sectiontitle.is-center{text-align:center;}
.c-sectiontitle__label{
  display:inline-block;font-size:var(--fs-sm);font-weight:var(--fw-semibold);
  color:var(--brand-indigo);letter-spacing:1px;margin-bottom:var(--sp-1);
}
.c-sectiontitle__label::before{content:"— ";}
.c-sectiontitle__label::after{content:" —";}
.section--dark .c-sectiontitle__label{color:var(--brand-gold);}
.c-sectiontitle__title{
  font-size:var(--fs-h2);line-height:var(--lh-title);font-weight:var(--fw-bold);
  letter-spacing:var(--ls-h2);color:var(--brand-indigo);
}
.section--dark .c-sectiontitle__title{color:var(--on-indigo);}
.c-sectiontitle.is-center .c-sectiontitle__title::after{
  content:"";display:block;width:48px;height:3px;background:var(--brand-gold);
  margin:var(--sp-2) auto 0;border-radius:var(--radius-sm);
}
.c-sectiontitle.is-left .c-sectiontitle__title::after{
  content:"";display:block;width:48px;height:3px;background:var(--brand-gold);
  margin:var(--sp-2) 0 0;border-radius:var(--radius-sm);
}
.c-sectiontitle__sub{margin-top:var(--sp-2);font-size:var(--fs-body);color:var(--text-secondary);}
.section--dark .c-sectiontitle__sub{color:var(--on-indigo-dim);}
.c-sectiontitle__row{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--sp-3);}
.c-sectiontitle__more{flex:none;}

/* ============ 卡片 CardBase ============ */
.c-card{
  position:relative;display:block;background:var(--surface-card);
  border:1px solid var(--border-default);border-radius:var(--radius);
  padding:var(--sp-4);box-shadow:var(--shadow-card);
  transition:transform var(--transition-fast),box-shadow var(--transition-fast),
             border-color var(--transition-fast);
}
.c-card__icon{
  width:48px;height:48px;border-radius:var(--radius);background:var(--indigo-soft);
  display:flex;align-items:center;justify-content:center;font-size:22px;
  margin-bottom:var(--sp-3);
}
.c-card__title{font-size:var(--fs-h3);line-height:var(--lh-module);font-weight:var(--fw-semibold);color:var(--brand-indigo);}
.c-card__text{margin-top:var(--sp-2);font-size:var(--fs-sm);color:var(--text-secondary);}
.c-card__more{margin-top:var(--sp-3);}
.c-card--link{cursor:pointer;}
.c-card--link:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover);border-color:var(--brand-gold);}
.c-card--link .c-card__arrow{
  position:absolute;top:var(--sp-4);right:var(--sp-4);
  color:var(--brand-gold);opacity:0;transform:translateX(-4px);
  transition:opacity var(--transition-fast),transform var(--transition-fast);
}
.c-card--link:hover .c-card__arrow{opacity:1;transform:translateX(0);}
.c-card--dark{background:var(--indigo-700);border-color:transparent;color:var(--on-indigo);}
.c-card--dark .c-card__title{color:var(--white);}
.c-card--dark .c-card__text{color:var(--on-indigo-dim);}
.c-card--dark .c-card__icon{background:var(--on-indigo-soft);}
.c-card--gold-accent{border-left:4px solid var(--brand-gold);}
.c-card__list{margin-top:var(--sp-2);display:flex;flex-direction:column;gap:var(--sp-1);}
.c-card__list li{
  position:relative;padding-left:var(--sp-2);font-size:var(--fs-sm);color:var(--text-secondary);
}
.c-card__list li::before{content:"";position:absolute;left:2px;top:9px;width:5px;height:5px;border-radius:50%;background:var(--brand-gold);}
.c-card--dark .c-card__list li{color:var(--on-indigo-dim);}
.c-card__list li::marker{color:var(--brand-gold);}

/* ============ 左右图文块 ImageTextBlock ============ */
.c-imagetext{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--sp-6);align-items:center;}
.c-imagetext__text{grid-column:span 6;}
.c-imagetext__media{grid-column:span 6;}
.c-imagetext.is-media-left .c-imagetext__text{order:2;}
.c-imagetext.is-media-left .c-imagetext__media{order:1;}
/* 纯文字图文块（没有配图）：正文独占整行，行宽收到「窄栏」宽度保证长句可读。
   为什么不继续用 span 6：没有配图时右侧留一半空列，看起来像「配图没加载出来」。
   --container-narrow（880px）是页面既有的窄栏宽度，不新造常量。
   注：案例详情页 2026-10-11 起已整页改纯文字（走 .c-factgrid / .c-numlist /
   .c-cardgrid / .step-flow 新组件），不再使用本修饰类；保留给 .c-imagetext 的
   其它使用处（如「关于我们」页），需要「有正文无配图」时可继续用。 */
.c-imagetext.is-text-only{grid-template-columns:minmax(0,1fr);}
.c-imagetext.is-text-only .c-imagetext__text{grid-column:auto;max-width:var(--container-narrow);}
.c-imagetext__title{font-size:var(--fs-h2);line-height:var(--lh-title);font-weight:var(--fw-bold);color:var(--brand-indigo);margin-bottom:var(--sp-3);}
.c-imagetext__body{font-size:var(--fs-body);color:var(--text-secondary);display:flex;flex-direction:column;gap:var(--sp-2);}
.c-imagetext__tags{display:flex;flex-wrap:wrap;gap:var(--sp-1);margin-top:var(--sp-3);}

/* ============ 键值事实网格 FactGrid ============
   用于「标签：内容」这类结构化信息（案例的客户简介：所属行业 / 企业规模 / 主营业务）。
   每项顶部一条金色细线做锚，标签小、值大 —— 比原来的「标签：值。」一行行排更好扫读。
   列数用 auto-fit，窄屏自动折行，不需要额外媒体查询。 */
.c-factgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--sp-5);}
.c-factgrid__item{padding-top:var(--sp-2);border-top:2px solid var(--brand-gold);}
.c-factgrid__label{display:block;font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:var(--text-muted);letter-spacing:.4px;}
.c-factgrid__value{display:block;margin-top:var(--sp-2);font-size:var(--fs-h4);line-height:var(--lh-module);font-weight:var(--fw-semibold);color:var(--brand-indigo);}

/* ============ 编号清单 NumList ============
   并列条目的清单。序号用「金色柔和底 + 深靛紫数字」的小胶囊 ——
   直接用金色写字在浅底上看不清（对比不足），所以是做底、字仍用深色。
   条目之间用 1px 分隔线，最后一条去掉线，避免和区块边缘叠出双线。 */
.c-numlist{display:grid;}
.c-numlist__item{display:flex;gap:var(--sp-3);align-items:flex-start;padding:var(--sp-3) 0;border-bottom:1px solid var(--ink-100);}
.c-numlist__item:last-child{border-bottom:0;padding-bottom:0;}
.c-numlist__item:first-child{padding-top:0;}
.c-numlist__no{flex:none;display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:26px;border-radius:var(--radius-pill);background:var(--gold-soft);color:var(--brand-indigo);font-size:var(--fs-xs);font-weight:var(--fw-bold);letter-spacing:.5px;}
.c-numlist__text{font-size:var(--fs-body);line-height:var(--lh-body);color:var(--text-primary);}
.c-numlist--2col{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--sp-8);}

/* ============ 卡片网格 CardGrid ============
   每组内容独立成卡的并列结构。用在 cream 底上时白卡会自然浮起来。 */
.c-cardgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--sp-3);}
/* 按条目数定列数：auto-fit 会在 4 条时排成「3 + 1」，孤零零一张卡挂在第二行很难看。
   2 条→2 列、3 条→3 列、4 条→2×2、5/6 条→3 列。类名由模板按 count() 拼出来。 */
.c-cardgrid--c2,
.c-cardgrid--c4{grid-template-columns:repeat(2,minmax(0,1fr));}
.c-cardgrid--c3,
.c-cardgrid--c5,
.c-cardgrid--c6{grid-template-columns:repeat(3,minmax(0,1fr));}
.c-cardgrid__item{display:flex;gap:var(--sp-3);align-items:flex-start;background:var(--surface-card);border:1px solid var(--border-default);border-radius:var(--radius);padding:var(--sp-4);box-shadow:var(--shadow-card);}
.c-cardgrid__no{flex:none;display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:26px;border-radius:var(--radius-pill);background:var(--indigo-soft);color:var(--brand-indigo);font-size:var(--fs-xs);font-weight:var(--fw-bold);letter-spacing:.5px;}
.c-cardgrid__text{font-size:var(--fs-body);line-height:var(--lh-body);color:var(--text-primary);}

/* ============ 上下篇分页 Pager ============
   原来只是两个按钮，左「← 上一个」右「下一个 →」，看不出点什么主题。
   改成两张可点卡片：方向小字 + 客户名大字，hover 时描边转金色并轻微抬起。 */
.c-pager{display:flex;gap:var(--sp-3);justify-content:space-between;flex-wrap:wrap;}
.c-pager__item{flex:1 1 280px;max-width:calc(50% - var(--sp-2));display:block;padding:var(--sp-3) var(--sp-4);border:1px solid var(--border-default);border-radius:var(--radius);background:var(--surface-card);transition:border-color var(--transition-fast),box-shadow var(--transition-fast),transform var(--transition-fast);}
.c-pager__item:hover{border-color:var(--brand-gold);box-shadow:var(--shadow-card);transform:translateY(-2px);}
.c-pager__item.is-next{text-align:right;}
.c-pager__dir{display:block;font-size:var(--fs-xs);color:var(--text-muted);letter-spacing:.5px;}
.c-pager__name{display:block;margin-top:var(--sp-1);font-size:var(--fs-h4);font-weight:var(--fw-semibold);color:var(--brand-indigo);}
.c-pager__pad{flex:1 1 280px;max-width:calc(50% - var(--sp-2));}

/* 案例详情页的页头：客户名是该页唯一的一级信息，放大到 h1，页面才有「主标题」的气势 */
.page-hero--case .page-hero__title{font-size:var(--fs-h1);letter-spacing:var(--ls-h1);margin-top:var(--sp-2);}
.page-hero--case .hero-slide__tag{display:inline-block;padding:3px 12px;margin-bottom:0;border:1px solid var(--on-indigo-line);border-radius:var(--radius-pill);font-size:var(--fs-xs);font-weight:var(--fw-semibold);color:var(--brand-gold);letter-spacing:.5px;}

/* 案例详情页组件的移动端适配 —— 注意：**必须放在本组件的全部基础规则之后**。
   踩过的坑：原先写在这里（基础规则之前），而下面 L76x 的 .step-card{flex:1 1 240px}
   与这里的 .step-card{flex:0 0 auto} 权重相同（都是单类选择器）→ 后出现的赢了，
   移动端 override 变成死代码。后果是竖排时每张步骤卡仍按 flex-basis 撑成
   ~240px 高，文字只有两行 → 卡片底下留出大片空白（且不报错、只能靠看图发现）。
   CSS 里 @media 不提升权重，所以「媒体查询写在基础规则前面」是无效的。 */

.tag{
  display:inline-flex;align-items:center;height:30px;padding:0 var(--sp-2);
  border-radius:var(--radius-pill);background:var(--gold-soft);color:var(--brand-indigo);
  font-size:var(--fs-sm);font-weight:var(--fw-semibold);
}

/* 色块占位 */
.media-placeholder{
  width:100%;aspect-ratio:4/3;border-radius:var(--radius);
  background:var(--ink-100);border:1px dashed var(--border-default);
  display:flex;align-items:center;justify-content:center;text-align:center;
  color:var(--text-muted);font-size:var(--fs-sm);padding:var(--sp-2);
}
.media-placeholder--wide{aspect-ratio:16/9;}
.media-placeholder--square{aspect-ratio:1/1;}
.media-placeholder--dark{background:var(--indigo-700);border-color:var(--on-indigo-soft);color:var(--on-indigo-dim);}

/* ============ 轮播 CarouselBase ============ */
/* 切换按钮（‹ ›）改为「独立占位」布局：不再绝对定位漂浮在内容之上，
   而是与内容各自占一列 —— 内容列与按钮列在栅格上互不相交，
   从布局层面保证「按钮永远不可能遮挡/覆盖任何文字」。
   结构：grid 三列 [上一张] [内容视窗] [下一张] + 第二行 [圆点指示器] */
.c-carousel{
  position:relative;overflow:hidden;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  grid-template-rows:auto auto;
  align-items:center;
  column-gap:var(--sp-3);
  row-gap:var(--sp-2);
}
.c-carousel__viewport{grid-column:2;grid-row:1;min-width:0;overflow:hidden;}
.c-carousel__track{display:flex;transition:transform var(--dur-carousel) var(--ease-out);will-change:transform;}
.c-carousel__slide{flex:0 0 100%;min-width:100%;}
.c-carousel__arrow{
  grid-row:1;align-self:center;justify-self:center;flex:0 0 auto;
  width:44px;height:44px;border-radius:50%;z-index:var(--z-sticky);
  background:var(--white);color:var(--brand-indigo);box-shadow:var(--shadow-card);
  display:flex;align-items:center;justify-content:center;font-size:22px;line-height:1;
  transition:background-color var(--transition-fast);
}
.c-carousel__arrow:hover{background:var(--brand-gold);}
.c-carousel__arrow.is-prev{grid-column:1;}
.c-carousel__arrow.is-next{grid-column:3;}
.c-carousel__dots{grid-column:1 / -1;grid-row:2;display:flex;justify-content:center;align-items:center;gap:var(--sp-1);z-index:var(--z-sticky);}
.c-carousel__dot{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.45);transition:background-color var(--transition-fast);}
.c-carousel__dot.is-active{background:var(--brand-gold);}
.c-carousel--light .c-carousel__dot{background:var(--ink-300);}
.c-carousel--light .c-carousel__dot.is-active{background:var(--brand-gold);}

/* 首屏 Hero —— 满幅渐变改挂在 section 上（三列栅格后 viewport 变窄，若渐变留在 slide 上会露出两侧空白）；
   左右箭头各占一列，与首屏文案列互不相交；圆点仍浮在底部中央（该处无文字） */
.c-carousel--hero{
  min-height:560px;height:100vh;max-height:820px;
  padding:0 var(--sp-2);
  grid-template-rows:minmax(0,1fr);
  background:linear-gradient(135deg,var(--brand-indigo) 0%,var(--indigo-900) 100%);
}
.c-carousel--hero .c-carousel__viewport{align-self:stretch;height:auto;}
.c-carousel--hero .c-carousel__track,.c-carousel--hero .c-carousel__slide{height:100%;}
.c-carousel--hero .c-carousel__slide{position:relative;}
.c-carousel--hero .c-carousel__dots{position:absolute;left:0;right:0;bottom:var(--sp-3);grid-column:auto;grid-row:auto;}
.hero-slide{display:block;height:100%;background:none;}
.hero-slide__inner{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--sp-6);align-items:center;height:100%;}
.hero-slide__text{grid-column:span 7;color:var(--on-indigo);padding:var(--sp-6) 0;}
.hero-slide__tag{display:inline-block;font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:var(--brand-gold);letter-spacing:2px;margin-bottom:var(--sp-3);}
.hero-slide__title{font-size:var(--fs-h1);line-height:var(--lh-tight);letter-spacing:var(--ls-h1);font-weight:var(--fw-bold);color:var(--white);}
.hero-slide__sub{margin-top:var(--sp-3);font-size:22px;line-height:var(--lh-sm);color:var(--on-indigo-dim);}
.hero-slide__cta{margin-top:var(--sp-5);}
.hero-slide__media{grid-column:span 5;}
.hero-slide__media .media-placeholder{aspect-ratio:4/3;}

/* 案例轮播（左文右图） */
.case-slide{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--sp-6);align-items:center;color:var(--on-indigo);padding:var(--sp-5) 0;}
.case-slide__text{grid-column:span 6;}
.case-slide__media{grid-column:span 6;}
.case-slide__label{display:inline-block;padding:4px var(--sp-2);border-radius:var(--radius-pill);background:var(--brand-gold);color:var(--brand-indigo);font-size:var(--fs-xs);font-weight:var(--fw-bold);}
.case-slide__name{margin-top:var(--sp-2);font-size:var(--fs-h3);line-height:var(--lh-module);font-weight:var(--fw-bold);color:var(--white);}
.case-slide__desc{margin-top:var(--sp-2);color:var(--on-indigo-dim);font-size:var(--fs-body);}
.case-slide__more{margin-top:var(--sp-3);color:var(--brand-gold);font-weight:var(--fw-semibold);}
.case-slide__media .media-placeholder{background:var(--indigo-700);border-color:var(--on-indigo-soft);color:var(--on-indigo-dim);aspect-ratio:4/3;}

/* 资讯轮播（图片卡） */
.news-slide{padding:0 var(--sp-1);}
.news-card{display:block;background:var(--white);border:1px solid var(--border-default);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-card);transition:transform var(--transition-fast),box-shadow var(--transition-fast);}
.news-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover);}
.news-card__media{aspect-ratio:16/10;}
.news-card__media .media-placeholder{border-radius:0;border:none;aspect-ratio:16/10;height:100%;}
.news-card__body{padding:var(--sp-3);}
.news-card__title{font-size:var(--fs-h4);line-height:var(--lh-module);font-weight:var(--fw-semibold);color:var(--brand-indigo);}
.news-card__meta{margin-top:var(--sp-2);display:flex;gap:var(--sp-2);font-size:var(--fs-xs);color:var(--text-muted);}
.news-badge{font-size:var(--fs-xs);font-weight:var(--fw-semibold);color:var(--brand-indigo);background:var(--gold-soft);border-radius:var(--radius-sm);padding:2px 6px;}

/* ============ 数据指标（核心优势 / 成果） ============ */
.stat{text-align:center;}
.stat__num{font-family:var(--font-num);font-size:var(--fs-num);line-height:var(--lh-num);font-weight:var(--fw-bold);color:var(--brand-gold);letter-spacing:1px;}
.stat__label{margin-top:var(--sp-2);font-size:var(--fs-h4);font-weight:var(--fw-semibold);color:var(--brand-indigo);}
.section--dark .stat__label{color:var(--on-indigo);}
.stat__text{margin-top:var(--sp-2);font-size:var(--fs-sm);color:var(--text-secondary);}
.reveal{opacity:.4;transition:opacity var(--dur-fast) var(--ease-out),transform var(--dur-enter) var(--ease-out);}
.reveal.is-inview{opacity:1;}

/* ============ 顶部导航 Header ============ */
.site-header{
  position:sticky;top:0;z-index:var(--z-header);
  background:var(--white);border-bottom:1px solid var(--border-default);
  transition:box-shadow var(--transition-base),height var(--transition-base);
}
.site-header .header-inner{display:flex;align-items:center;gap:var(--sp-5);height:var(--header-h);transition:height var(--transition-base);}
.site-header.is-stuck{box-shadow:var(--shadow-card);}
.site-header.is-stuck .header-inner{height:64px;}
.brand{display:flex;align-items:center;gap:var(--sp-1);flex:none;}
/* 品牌 LOGO：页眉用橙色主色版；深靛紫底用米白单色版（logo-cream.png） */
.brand-logo{display:block;height:38px;width:auto;}
.brand-logo--cream{height:44px;}
@media (max-width:768px){
  .brand-logo{height:32px;}
  .brand-logo--cream{height:36px;}
}
.brand-mark{
  width:36px;height:36px;border-radius:var(--radius);
  background:var(--logo-orange);color:var(--white);
  display:flex;align-items:center;justify-content:center;
  font-weight:var(--fw-bold);font-size:var(--fs-sm);letter-spacing:0;
}
.brand-name{font-size:var(--fs-h4);font-weight:var(--fw-bold);color:var(--text-primary);}
/* 品牌字标（2026-10-08 改版）：字标「微略」用客户设计稿的艺术字（已去除气泡图标），
   重上色为品牌色位图；英文标语 Strategy & AI Studio 沿用活字。
   —— 原用思源宋体子集渲染，与客户新 logo 的黑体艺术字不符，故改为位图。
   深底（页脚）用 logo-wordmark-cream.png 白色版，保证深底对比度。 */
.brand-word{display:block;height:28px;width:auto;flex:none;}
.brand-tag{font-size:12px;font-weight:var(--fw-semibold);color:var(--brand-indigo);opacity:.7;letter-spacing:.2px;line-height:1;white-space:nowrap;margin-left:-2px;}
@media (max-width:768px){
  .brand-word{height:23px;}
  .brand-tag{font-size:10px;margin-left:-2px;}
}
/* 页脚（深靛紫底）字标：白色版 */
.brand-tag--cream{color:var(--white);opacity:.8;}
.footer-brand .brand-word{height:32px;}
.footer-brand .brand-tag{font-size:13px;}
.main-nav{flex:1;}
.main-nav ul{display:flex;align-items:center;gap:var(--sp-4);}
.main-nav > ul > li{position:relative;}
.main-nav a.nav-link{
  display:inline-flex;align-items:center;gap:4px;
  padding:var(--sp-1) 2px;font-size:15px;color:var(--text-primary);
  border-bottom:2px solid transparent;transition:color var(--transition-fast),border-color var(--transition-fast);
}
.main-nav a.nav-link:hover{color:var(--brand-indigo);}
.main-nav a.nav-link.is-active{color:var(--brand-indigo);font-weight:var(--fw-bold);border-bottom-color:var(--brand-gold);}
.caret{font-size:10px;}
.dropdown{
  position:absolute;top:calc(100% + var(--sp-1));left:0;min-width:200px;
  background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow-hover);
  padding:var(--sp-1);z-index:var(--z-dropdown);
  opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity var(--transition-fast),transform var(--transition-fast),visibility var(--transition-fast);
}
.has-dropdown:hover .dropdown,.has-dropdown:focus-within .dropdown{opacity:1;visibility:visible;transform:translateY(0);}
.dropdown a{display:block;padding:10px var(--sp-2);border-radius:var(--radius-sm);font-size:var(--fs-sm);color:var(--text-primary);transition:background-color var(--transition-fast),color var(--transition-fast);}
.dropdown a:hover{background:var(--bg-cream);color:var(--brand-indigo);}
.header-actions{display:flex;align-items:center;gap:var(--sp-2);flex:none;}
.hamburger{display:none;width:40px;height:40px;flex-direction:column;justify-content:center;align-items:center;gap:5px;}
.hamburger span{display:block;width:22px;height:2px;background:var(--brand-indigo);border-radius:2px;}

/* 移动端抽屉 */
.mobile-drawer{position:fixed;inset:0;z-index:var(--z-drawer);visibility:hidden;opacity:0;transition:opacity var(--transition-base),visibility var(--transition-base);}
.mobile-drawer.is-open{visibility:visible;opacity:1;}
.mobile-drawer__mask{position:absolute;inset:0;background:var(--overlay);}
.mobile-drawer__panel{
  position:absolute;top:0;right:0;width:82%;max-width:360px;height:100%;
  background:var(--white);padding:var(--sp-3);overflow-y:auto;
  transform:translateX(100%);transition:transform var(--transition-base);
  display:flex;flex-direction:column;gap:var(--sp-2);
}
.mobile-drawer.is-open .mobile-drawer__panel{transform:translateX(0);}
.mobile-drawer__head{display:flex;align-items:center;justify-content:space-between;padding-bottom:var(--sp-2);border-bottom:1px solid var(--border-default);}
.mobile-nav a{display:block;padding:var(--sp-2) 0;font-size:var(--fs-h4);font-weight:var(--fw-semibold);color:var(--text-primary);border-bottom:1px solid var(--border-default);}
.mobile-nav a.is-active{color:var(--brand-indigo);}
.mobile-sub{padding-left:var(--sp-3);}
.mobile-sub a{font-size:var(--fs-body);font-weight:var(--fw-regular);color:var(--text-secondary);}
.mobile-drawer .btn{width:100%;}
.close-x{width:36px;height:36px;border-radius:var(--radius);font-size:18px;color:var(--text-muted);display:flex;align-items:center;justify-content:center;transition:background-color var(--transition-fast);}
.close-x:hover{background:var(--ink-100);color:var(--brand-indigo);}

/* ============ 页脚 Footer ============ */
.site-footer{background:var(--surface-dark);color:var(--on-indigo);margin-top:var(--sp-12);padding:var(--sp-8) 0 var(--sp-4);}
.footer-grid{display:grid;grid-template-columns:3fr 2fr 2fr 2.4fr 2.6fr;gap:var(--sp-5);}
/* 板块标题：图标与文字同一行，图标在左
   ── 用 flex 而非行内元素，保证图标块与标题文字「垂直居中对齐」在任意字号下都成立
      （文字行高 1.7×16px＝27.2px，图标块 22px，两者以中心线对齐）。 */
.footer-title{
  display:flex;align-items:center;gap:var(--sp-1);
  font-size:var(--fs-body);font-weight:var(--fw-semibold);color:var(--white);margin-bottom:var(--sp-3);
}
/* 页脚板块图标
   ── 沿用站内既有的「软底方块 + 符号」图标语言（见 .c-card__icon 与 .c-card--dark 变体）：
      深靛紫底上用 --on-indigo-soft（白 8%）作底、--brand-gold 着色符号，
      既与全站图标同族，又在深底上保持足够对比度。
   ── 符号只用 Unicode 几何字符，不引入 SVG／字体图标：
      全站图标词汇本就是 ◆（内容/能力）与 ✦（AI/智能体），此处新增 ≡（目录）与 ◎（联络点），
      四者同属几何符号族、系统字体全覆盖、无 emoji 化歧义、无额外资源与版权问题。 */
.footer-ico{
  flex:none;width:22px;height:22px;border-radius:6px;
  background:var(--on-indigo-soft);
  display:flex;align-items:center;justify-content:center;
  font-size:12px;line-height:1;color:var(--brand-gold);
}
.footer-brand .brand-name{color:var(--white);}
.footer-brand .brand-logo{height:46px;}
.footer-desc{margin-top:var(--sp-2);font-size:var(--fs-sm);color:var(--on-indigo-dim);line-height:var(--lh-sm);}
.qr-placeholder{
  width:120px;height:120px;margin-top:var(--sp-3);border-radius:var(--radius);
  background:var(--indigo-700);border:1px dashed var(--on-indigo-soft);
  display:flex;align-items:center;justify-content:center;text-align:center;
  color:var(--on-indigo-dim);font-size:var(--fs-xs);padding:var(--sp-1);
}
.footer-links{display:flex;flex-direction:column;gap:14px;}
.footer-links a{display:block;font-size:var(--fs-sm);color:var(--on-indigo-dim);transition:color var(--transition-fast);}
.footer-links a:hover{color:var(--brand-gold);}
/* 服务分组：父项与子项紧贴成组，子项以竖向引导线体现层级 */
.footer-group{display:flex;flex-direction:column;gap:10px;margin-top:2px;}
.footer-links .sub{
  margin-left:2px;padding-left:14px;
  border-left:1px solid var(--on-indigo-line);
  display:flex;flex-direction:column;gap:9px;
}
.footer-links .sub a{font-size:var(--fs-xs);color:var(--on-indigo-dim);opacity:.85;transition:color var(--transition-fast),opacity var(--transition-fast);}
.footer-links .sub a:hover{color:var(--brand-gold);opacity:1;}
.footer-contact-item{font-size:var(--fs-sm);color:var(--on-indigo-dim);line-height:var(--lh-sm);}
.footer-contact-item a{color:var(--on-indigo);}
.footer-contact-item a:hover{color:var(--brand-gold);}
.footer-agents{display:flex;flex-direction:column;gap:var(--sp-2);}
.footer-bottom{margin-top:var(--sp-6);padding-top:var(--sp-3);border-top:1px solid var(--on-indigo-soft);text-align:center;font-size:var(--fs-sm);color:var(--on-indigo-dim);}
.footer-bottom a{color:var(--on-indigo-dim);}
.footer-bottom a:hover{color:var(--brand-gold);}

/* ============ 浮窗 AgentWidget ============ */
.agent-widget{position:fixed;right:var(--sp-3);bottom:var(--sp-3);z-index:var(--z-widget);}
.agent-fab{
  width:56px;height:56px;border-radius:50%;background:var(--brand-indigo);color:var(--white);
  display:flex;align-items:center;justify-content:center;font-size:24px;
  box-shadow:var(--shadow-hover);transition:transform var(--transition-fast),background-color var(--transition-fast);
}
.agent-fab:hover{transform:scale(1.05);background:var(--indigo-700);}
.agent-panel{
  position:absolute;right:0;bottom:calc(56px + var(--sp-2));width:264px;
  background:var(--white);border-radius:var(--radius-lg);box-shadow:var(--shadow-modal);
  padding:var(--sp-2);transform-origin:bottom right;
  animation:pop var(--dur-fast) var(--ease-out);
}
@keyframes pop{from{opacity:0;transform:scale(.9);}to{opacity:1;transform:scale(1);}}
.agent-panel__item{display:flex;align-items:center;gap:var(--sp-2);width:100%;text-align:left;padding:12px;border-radius:var(--radius);transition:background-color var(--transition-fast);}
.agent-panel__item:hover{background:var(--bg-cream);}
.agent-panel__icon{width:36px;height:36px;flex:none;border-radius:50%;background:var(--gold-soft);color:var(--brand-indigo);display:flex;align-items:center;justify-content:center;font-size:18px;}
.agent-panel__item strong{display:block;font-size:var(--fs-sm);color:var(--brand-indigo);}
.agent-panel__item small{display:block;font-size:var(--fs-xs);color:var(--text-muted);}
.agent-panel__foot{margin-top:var(--sp-1);padding:var(--sp-1) 12px;border-top:1px solid var(--border-default);font-size:var(--fs-xs);color:var(--text-muted);line-height:var(--lh-sm);}

/* 对话抽屉
   ── 层级：必须高于移动端导航抽屉 .mobile-drawer(--z-drawer 400)、低于 Modal(--z-modal 500)。
   ── 宽度：一律用 % / min()，**禁止用 100vw**。vw 含竖向滚动条宽度，在「经典滚动条」环境
      （桌面浏览器、平板横屏、DevTools 手机模拟）下会比内容视口宽 15px，
      配合 right:0 会把抽屉左边缘推出屏幕 → 横向溢出 / 元素被裁。
   ── 终态：基准态 transform 必须是「屏幕内的最终位置」。入场位移只由 @keyframes 表达，
      不能把「打开位置」写在基准 transform 上（一旦动画未执行或不填充，抽屉就停在半路，
      实测 320px 屏右越界 26px、390px 屏 31px、768px 屏 32px）。 */
.chat-mask{position:fixed;inset:0;background:var(--overlay-drawer);z-index:calc(var(--z-drawer) + 1);}
.chat-drawer{
  position:fixed;top:0;right:0;height:100%;
  width:min(400px,100%);max-width:100%;
  background:var(--white);box-shadow:var(--shadow-drawer);z-index:calc(var(--z-drawer) + 2);
  display:flex;flex-direction:column;
  transform:none;
  animation:drawerIn var(--dur-base) var(--ease-out) forwards;
}
@keyframes drawerIn{from{transform:translateX(100%);}to{transform:translateX(0);}}
.chat-head{display:flex;align-items:center;gap:var(--sp-2);height:56px;padding:0 var(--sp-2);border-bottom:1px solid var(--border-default);}
.chat-avatar{width:36px;height:36px;flex:none;border-radius:50%;background:var(--white);border:1px solid var(--border-default);display:flex;align-items:center;justify-content:center;overflow:hidden;}
.chat-avatar img{width:78%;height:78%;object-fit:contain;}
.chat-head__meta{flex:1;}
.chat-head__meta strong{display:block;font-size:var(--fs-body);color:var(--brand-indigo);}
.chat-head__meta small{display:block;font-size:var(--fs-xs);color:var(--success);}
.chat-body{flex:1;min-width:0;overflow-y:auto;overflow-x:hidden;padding:var(--sp-3);display:flex;flex-direction:column;gap:var(--sp-3);background:var(--bg-cream);}
.chat-msg{display:flex;gap:var(--sp-1);align-items:flex-start;min-width:0;}
.chat-msg__avatar{width:28px;height:28px;flex:none;border-radius:50%;background:var(--brand-indigo);color:var(--white);font-size:var(--fs-xs);display:flex;align-items:center;justify-content:center;}
.chat-msg__bubble{max-width:min(260px,78%);padding:10px var(--sp-2);background:var(--white);border-radius:12px;border-top-left-radius:2px;font-size:var(--fs-sm);color:var(--text-primary);line-height:var(--lh-sm);box-shadow:var(--shadow-card);overflow-wrap:anywhere;}
.chat-msg.is-user{justify-content:flex-end;}
.chat-msg.is-user .chat-msg__bubble{background:var(--brand-indigo);color:var(--white);border-radius:12px;border-top-right-radius:2px;border-top-left-radius:12px;}
.chat-time{display:block;margin-top:4px;font-size:var(--fs-xs);color:var(--text-muted);}
.chat-msg.is-user .chat-time{color:var(--on-indigo-dim);text-align:right;}
.chat-card-btn{margin-top:var(--sp-1);}
.chat-typing{display:inline-flex;gap:4px;}
.chat-typing i{width:6px;height:6px;border-radius:50%;background:var(--ink-300);animation:blink 1s infinite;}
.chat-typing i:nth-child(2){animation-delay:.2s;}
.chat-typing i:nth-child(3){animation-delay:.4s;}
@keyframes blink{0%,60%,100%{opacity:.3;}30%{opacity:1;}}
.chat-quick{display:flex;flex-wrap:wrap;gap:var(--sp-1);min-width:0;padding:var(--sp-2) var(--sp-3) 0;border-top:1px solid var(--border-default);}
.chat-quick__btn{padding:6px var(--sp-2);border:1px solid var(--border-default);border-radius:var(--radius-pill);font-size:var(--fs-xs);color:var(--brand-indigo);transition:background-color var(--transition-fast);}
.chat-quick__btn:hover{background:var(--gold-soft);}
.chat-input{display:flex;gap:var(--sp-1);min-width:0;padding:var(--sp-2) var(--sp-3);align-items:flex-end;}
.chat-input textarea{
  flex:1;min-width:0;resize:none;min-height:44px;max-height:120px;padding:10px var(--sp-2);
  border:1px solid var(--border-default);border-radius:var(--radius);font-size:var(--fs-sm);
}
.chat-input textarea:focus{outline:none;border-color:var(--border-focus);box-shadow:0 0 0 2px var(--focus-ring);}
.chat-fallback{padding:0 var(--sp-3) var(--sp-2);font-size:var(--fs-xs);color:var(--text-muted);text-align:center;}

/* 抽屉打开时，浮标与返回顶部按钮必须让位
   ── .agent-fab / .scroll-top 的层级是 --z-widget(700)，高于对话抽屉，且都停在右下角，
      正好压住抽屉底部的「发送」按钮并截走点击（实测 Playwright 报 intercepts pointer events，
      真机上表现为「点发送没反应，反而弹出智能助手面板」）。 */
.chat-open .agent-widget,
.chat-open .scroll-top{display:none;}

/* 返回顶部 */
.scroll-top{
  position:fixed;right:var(--sp-3);bottom:96px;width:44px;height:44px;border-radius:50%;
  background:var(--brand-indigo);color:var(--white);font-size:18px;z-index:var(--z-widget);
  display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;
  transition:opacity var(--transition-base),visibility var(--transition-base),background-color var(--transition-fast);
  box-shadow:var(--shadow-card);
}
.scroll-top.is-show{opacity:1;visibility:visible;}
.scroll-top:hover{background:var(--indigo-700);}

/* ============ 面包屑 Breadcrumb ============ */
.c-breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-1);font-size:var(--fs-sm);color:var(--text-muted);padding:var(--sp-3) 0 0;}
.c-breadcrumb a{color:var(--text-muted);}
.c-breadcrumb a:hover{color:var(--brand-indigo);}
.c-breadcrumb .sep{color:var(--ink-300);}
.c-breadcrumb .current{color:var(--text-muted);}
.section--dark .c-breadcrumb,.section--dark .c-breadcrumb a{color:var(--on-indigo-dim);}

/* ============ 二级页头 PageHero ============ */
.page-hero{background:var(--surface-dark);color:var(--on-indigo);padding:var(--sp-10) 0 var(--sp-8);}
.page-hero.anchor-target{scroll-margin-top:var(--header-h);}
.page-hero__title{font-size:var(--fs-h2);line-height:var(--lh-title);font-weight:var(--fw-bold);color:var(--white);letter-spacing:var(--ls-h2);}
.page-hero__sub{margin-top:var(--sp-2);font-size:var(--fs-h4);color:var(--on-indigo-dim);}
.page-intro{font-size:var(--fs-h4);color:var(--brand-indigo);font-weight:var(--fw-semibold);line-height:var(--lh-body);}

/* ============ Tab ============ */
.c-tabs{display:flex;gap:var(--sp-2);border-bottom:1px solid var(--border-default);margin-bottom:var(--sp-6);}
.c-tabs__btn{padding:var(--sp-2) var(--sp-3);font-size:var(--fs-h4);font-weight:var(--fw-semibold);color:var(--text-secondary);border-bottom:3px solid transparent;transition:color var(--transition-fast),border-color var(--transition-fast);}
.c-tabs__btn:hover{color:var(--brand-indigo);}
.c-tabs__btn.is-active{color:var(--brand-indigo);border-bottom-color:var(--brand-gold);}
.c-tabpanel[hidden]{display:none;}

/* ============ 折叠面板 FAQ ============ */
.c-faq{border-top:1px solid var(--border-default);}
.c-faq__item{border-bottom:1px solid var(--border-default);}
.c-faq__q{
  display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp-3);
  width:100%;text-align:left;padding:var(--sp-3) var(--sp-2);font-size:var(--fs-h4);
  font-weight:var(--fw-semibold);color:var(--brand-indigo);transition:background-color var(--transition-fast);
}
.c-faq__q:hover{background:var(--bg-cream);}
.c-faq__icon{flex:none;font-size:20px;line-height:1.2;color:var(--brand-gold);}
.c-faq__a{overflow:hidden;max-height:0;transition:max-height var(--transition-base) var(--ease-out);}
.c-faq__a-inner{padding:0 var(--sp-2) var(--sp-3);font-size:var(--fs-body);color:var(--text-secondary);line-height:var(--lh-body);}
.c-faq__item.is-open .c-faq__a{max-height:640px;}
.c-faq__answer-lead{color:var(--brand-indigo);font-weight:var(--fw-semibold);}

/* ============ 弹窗 Modal ============ */
.c-modal{position:fixed;inset:0;z-index:var(--z-modal);display:flex;align-items:center;justify-content:center;padding:var(--sp-3);}
.c-modal__mask{position:absolute;inset:0;background:var(--overlay);}
.c-modal__dialog{
  position:relative;background:var(--white);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-modal);max-width:480px;width:100%;max-height:88vh;overflow-y:auto;
  padding:var(--sp-4);animation:modalIn var(--dur-fast) var(--ease-out);
}
@keyframes modalIn{from{opacity:0;transform:scale(.96);}to{opacity:1;transform:scale(1);}}
.c-modal--wide .c-modal__dialog{max-width:640px;}
.c-modal__title{font-size:var(--fs-h3);font-weight:var(--fw-bold);color:var(--brand-indigo);padding-right:var(--sp-5);}
.c-modal__text{margin-top:var(--sp-2);font-size:var(--fs-body);color:var(--text-secondary);}
.c-modal__close{position:absolute;top:var(--sp-2);right:var(--sp-2);}
.c-modal__actions{margin-top:var(--sp-4);display:flex;gap:var(--sp-2);justify-content:flex-end;flex-wrap:wrap;}

/* ============ 留资表单 LeadForm ============ */
.c-leadform{display:flex;flex-direction:column;gap:var(--sp-3);}
.field{display:flex;flex-direction:column;gap:var(--sp-1);}
.field__label{font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:var(--text-primary);}
.field__label .req{color:var(--danger);}
.field__input{
  height:48px;padding:0 var(--sp-2);background:var(--white);
  border:1px solid var(--border-default);border-radius:var(--radius);font-size:var(--fs-body);
  transition:border-color var(--transition-fast),box-shadow var(--transition-fast);
}
.field__input::placeholder{color:var(--text-placeholder);}
.field__input:focus{outline:none;border-color:var(--border-focus);box-shadow:0 0 0 2px var(--focus-ring);}
.field.is-invalid .field__input{border-color:var(--danger);}
.field__error{font-size:var(--fs-xs);color:var(--danger);min-height:0;}
.field__error:not(:empty)::before{content:"⚠ ";}
.field__hint{font-size:var(--fs-xs);color:var(--text-muted);}
.check-row{display:flex;align-items:flex-start;gap:var(--sp-1);font-size:var(--fs-sm);color:var(--text-secondary);cursor:pointer;}
.check-row input{margin-top:4px;}
.check-row a{color:var(--brand-indigo);text-decoration:underline;}
.form-note{font-size:var(--fs-sm);color:var(--danger);}

/* ============ 空态 / 加载态 ============ */
.empty-state{
  text-align:center;padding:var(--sp-10) var(--sp-3);border:1px dashed var(--border-default);
  border-radius:var(--radius);background:var(--white);color:var(--text-muted);
}
.empty-state__title{font-size:var(--fs-h4);font-weight:var(--fw-semibold);color:var(--text-secondary);margin-bottom:var(--sp-3);}
.skeleton{border-radius:var(--radius);background:linear-gradient(90deg,var(--ink-100) 25%,var(--ink-200) 37%,var(--ink-100) 63%);background-size:400% 100%;animation:shimmer 1.4s infinite;}
@keyframes shimmer{0%{background-position:100% 0;}100%{background-position:0 0;}}
.skeleton-card{height:220px;}
.skeleton-line{height:14px;margin-bottom:var(--sp-2);}
.loading-state{text-align:center;padding:var(--sp-8) 0;color:var(--text-muted);}

/* ============ 提示条 Toast ============ */
.toast-host{position:fixed;left:50%;bottom:var(--sp-6);transform:translateX(-50%);z-index:var(--z-toast);display:flex;flex-direction:column;gap:var(--sp-1);align-items:center;}
.toast{background:var(--brand-indigo);color:var(--white);padding:12px var(--sp-3);border-radius:var(--radius);font-size:var(--fs-sm);box-shadow:var(--shadow-modal);animation:pop var(--dur-fast) var(--ease-out);}

/* ============================================================
   P01 首页专属
   ============================================================ */
.hero-dots-override{position:absolute;left:0;right:0;bottom:var(--sp-3);}
.home-statement{max-width:var(--container-narrow);margin:0 auto;text-align:center;}
.home-statement__title{font-size:var(--fs-h2);line-height:var(--lh-title);font-weight:var(--fw-bold);color:var(--brand-indigo);}
.home-statement__def{margin-top:var(--sp-4);padding:var(--sp-3) var(--sp-4);background:var(--white);border-left:4px solid var(--brand-gold);border-radius:var(--radius);font-size:var(--fs-h4);line-height:var(--lh-body);color:var(--text-secondary);text-align:left;box-shadow:var(--shadow-card);}
.home-statement__more{margin-top:var(--sp-4);}
.carousel-outer{position:relative;}
/* 轮播：切换按钮已改为「独立占位列」（见 CarouselBase），此处不再需要安全区补偿 */
.news-carousel{padding-bottom:var(--sp-2);}
.news-carousel .c-carousel__slide{flex-basis:25%;min-width:25%;padding:0 var(--sp-1);}
.news-carousel .c-carousel__track{gap:0;}

/* ============================================================
   P05 服务总览
   ============================================================ */
.service-layout{position:relative;}
.anchor-rail{position:absolute;top:0;bottom:0;right:max(var(--sp-3),calc((100% - 1152px)/2));width:200px;}
.anchor-nav{position:sticky;top:calc(var(--header-h) + var(--sp-3));display:flex;flex-direction:column;gap:2px;}
.service-inner{padding-right:224px;}
.anchor-nav__title{font-size:var(--fs-xs);color:var(--text-muted);letter-spacing:1px;margin-bottom:var(--sp-1);padding-left:var(--sp-2);}
.anchor-nav__item{display:block;padding:12px var(--sp-2);font-size:var(--fs-sm);color:var(--text-secondary);border-left:3px solid var(--border-default);transition:color var(--transition-fast),border-color var(--transition-fast),background-color var(--transition-fast);}
.anchor-nav__item:hover{color:var(--brand-indigo);background:var(--bg-cream);}
.anchor-nav__item.is-active{color:var(--brand-indigo);font-weight:var(--fw-bold);border-left-color:var(--brand-gold);}
.service-section{padding:var(--sp-12) 0;scroll-margin-top:calc(var(--header-h) + var(--sp-2));}
.service-section--dark{background:var(--surface-dark);color:var(--on-indigo);}
.service-claim{font-size:var(--fs-h4);color:var(--brand-indigo);font-weight:var(--fw-semibold);margin-bottom:var(--sp-5);line-height:var(--lh-body);}
.service-section--dark .service-claim{color:var(--brand-gold);}
.anchor-tabs{display:none;gap:var(--sp-1);overflow-x:auto;padding:var(--sp-2) 0;position:sticky;top:var(--header-h);background:var(--bg-cream);z-index:var(--z-sticky);border-bottom:1px solid var(--border-default);}
.anchor-tabs a{white-space:nowrap;padding:8px var(--sp-2);border-radius:var(--radius-pill);font-size:var(--fs-sm);background:var(--white);border:1px solid var(--border-default);}

/* ============================================================
   P07 报告详情（电子书）
   ============================================================ */
.book{position:relative;background:var(--bg-cream);padding:var(--sp-6) 0;}
.book-pages{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-2);}
.book-page{background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow-card);padding:var(--sp-5);font-size:var(--fs-body);line-height:var(--lh-body);color:var(--text-secondary);}
.book-page h2{font-size:var(--fs-h3);color:var(--brand-indigo);margin:var(--sp-3) 0 var(--sp-2);}
.book-page h3{font-size:var(--fs-h4);color:var(--brand-indigo);margin:var(--sp-3) 0 var(--sp-1);}
.book-page p{margin-bottom:var(--sp-2);}
.book-quote{border-left:4px solid var(--brand-gold);padding:var(--sp-2) var(--sp-3);background:var(--bg-cream);border-radius:var(--radius-sm);color:var(--text-secondary);font-style:normal;}
.book-truncate{position:relative;max-height:520px;overflow:hidden;}
.book-truncate::after{content:"";position:absolute;left:0;right:0;bottom:0;height:200px;background:linear-gradient(transparent,var(--bg-cream));}
.book-guide{position:relative;margin-top:calc(-1 * var(--sp-10));z-index:var(--z-base);}
.book-guide__card{max-width:520px;margin:0 auto;background:var(--white);border-radius:var(--radius-lg);box-shadow:var(--shadow-hover);padding:var(--sp-5);text-align:center;}
.book-guide__title{font-size:var(--fs-h3);font-weight:var(--fw-bold);color:var(--brand-indigo);}
.book-guide__text{margin-top:var(--sp-2);font-size:var(--fs-sm);color:var(--text-secondary);}
.book-guide__actions{margin-top:var(--sp-4);display:flex;gap:var(--sp-2);justify-content:center;flex-wrap:wrap;}
.book-progress{font-size:var(--fs-sm);color:var(--text-muted);margin-bottom:var(--sp-2);}
.qr-inline{display:grid;grid-template-columns:160px 1fr;gap:var(--sp-4);align-items:center;background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow-card);padding:var(--sp-4);}
.qr-box{width:160px;height:160px;border-radius:var(--radius);background:var(--ink-100);border:1px dashed var(--border-default);display:flex;align-items:center;justify-content:center;text-align:center;color:var(--text-muted);font-size:var(--fs-sm);}

/* ============================================================
   P10 战略体检
   ============================================================ */
.assess-page{background:var(--bg-cream);height:100vh;overflow:hidden;display:flex;flex-direction:column;}
.assess-top{flex:none;z-index:var(--z-header);background:var(--white);border-bottom:1px solid var(--border-default);}
.assess-top__inner{display:flex;align-items:center;gap:var(--sp-3);height:64px;}
.assess-top__title{font-size:var(--fs-h4);font-weight:var(--fw-bold);color:var(--brand-indigo);flex:none;}
.assess-top__progress{flex:1;display:flex;flex-direction:column;gap:4px;max-width:520px;}
.assess-top__meta{display:flex;justify-content:space-between;font-size:var(--fs-xs);color:var(--text-muted);}
.progress-track{height:6px;border-radius:var(--radius-pill);background:var(--ink-100);overflow:hidden;}
.progress-fill{height:100%;background:var(--brand-gold);width:0;transition:width var(--transition-base);}
.assess-shell{flex:1;min-height:0;display:flex;justify-content:center;padding:var(--sp-3) var(--sp-3) 0;}
.assess-window{width:720px;max-width:100%;height:100%;display:flex;flex-direction:column;min-height:0;background:var(--bg-cream);}
.assess-chat{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:var(--sp-3);padding:0 var(--sp-3) var(--sp-3);}
.assess-msg{display:flex;gap:var(--sp-1);align-items:flex-start;animation:msgIn var(--dur-enter) var(--ease-out);}
@keyframes msgIn{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}}
.assess-msg__avatar{width:32px;height:32px;flex:none;border-radius:50%;background:var(--brand-indigo);color:var(--white);font-size:var(--fs-xs);display:flex;align-items:center;justify-content:center;}
.assess-msg__bubble{max-width:560px;padding:var(--sp-2);background:var(--white);border-radius:14px;border-top-left-radius:2px;box-shadow:var(--shadow-card);font-size:var(--fs-body);line-height:var(--lh-body);color:var(--text-primary);}
.assess-msg__bubble strong{color:var(--brand-indigo);}
.assess-msg__fill{color:var(--brand-indigo);font-weight:var(--fw-semibold);border-bottom:1px dashed var(--brand-gold);}
.assess-msg.is-user{justify-content:flex-end;}
.assess-msg.is-user .assess-msg__bubble{background:var(--brand-indigo);color:var(--white);border-radius:14px;border-top-right-radius:2px;border-top-left-radius:14px;box-shadow:none;}
.assess-msg.is-feedback .assess-msg__bubble{background:var(--white);border-left:4px solid var(--brand-gold);}
.assess-opts{display:flex;flex-direction:column;gap:var(--sp-1);margin:var(--sp-1) 0 0 var(--sp-5);max-width:560px;}
.opt-btn{
  text-align:left;padding:12px var(--sp-2);background:var(--white);border:1.5px solid var(--border-default);
  border-radius:var(--radius);font-size:var(--fs-body);color:var(--text-primary);
  transition:border-color var(--transition-fast),background-color var(--transition-fast),transform var(--transition-fast);
}
.opt-btn:hover{border-color:var(--brand-gold);background:var(--bg-cream);transform:translateX(2px);}
.opt-btn.is-selected{border-color:var(--brand-indigo);background:var(--gold-soft);}
.opt-btn[disabled]{opacity:.45;cursor:not-allowed;}
.opts-hint{font-size:var(--fs-xs);color:var(--text-muted);margin-left:var(--sp-5);}
.opts-confirm{margin-left:var(--sp-5);}
.assess-bottom{flex:none;background:var(--white);border-top:1px solid var(--border-default);padding:var(--sp-2) var(--sp-3);}
.assess-bottom__row{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-2);font-size:var(--fs-sm);color:var(--text-muted);}
.assess-form-card{background:var(--white);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);padding:var(--sp-4);max-width:560px;}
.assess-loading{text-align:center;padding:var(--sp-10) var(--sp-3);}
.spinner{width:44px;height:44px;margin:0 auto var(--sp-3);border-radius:50%;border:4px solid var(--ink-100);border-top-color:var(--brand-gold);animation:spin 1s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
.report-doc{background:var(--white);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);padding:var(--sp-5);max-width:640px;}
.report-doc h2{font-size:var(--fs-h3);color:var(--brand-indigo);margin-bottom:var(--sp-2);}
.report-doc h3{font-size:var(--fs-h4);color:var(--brand-indigo);margin:var(--sp-3) 0 var(--sp-1);}
.report-doc p{color:var(--text-secondary);margin-bottom:var(--sp-2);}
.dim-list{display:flex;flex-direction:column;gap:var(--sp-2);margin:var(--sp-2) 0;}
.dim-item{border-left:3px solid var(--brand-gold);padding-left:var(--sp-2);}
.dim-item__tag{display:inline-block;font-size:var(--fs-xs);color:var(--brand-indigo);background:var(--gold-soft);border-radius:var(--radius-sm);padding:2px 6px;margin-bottom:4px;}
.priority-list{display:flex;flex-direction:column;gap:var(--sp-2);margin:var(--sp-2) 0;}
.priority-item{display:flex;gap:var(--sp-2);align-items:flex-start;padding:var(--sp-2);background:var(--bg-cream);border-radius:var(--radius);}
.priority-rank{flex:none;width:56px;font-size:var(--fs-xs);font-weight:var(--fw-bold);color:var(--brand-indigo);}
.report-cta{display:flex;gap:var(--sp-2);flex-wrap:wrap;margin-top:var(--sp-4);}

/* ============================================================
   P03 案例 logo 网格
   ============================================================ */
.logo-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--sp-3);}
.logo-card{
  display:flex;align-items:center;justify-content:center;text-align:center;
  aspect-ratio:5/3;background:var(--white);border:1px solid var(--border-default);
  border-radius:var(--radius);font-size:var(--fs-body);font-weight:var(--fw-semibold);color:var(--text-secondary);
  filter:grayscale(100%);opacity:.6;
  transition:filter var(--transition-fast),opacity var(--transition-fast),transform var(--transition-fast),box-shadow var(--transition-fast);
}
.logo-card:hover{filter:grayscale(0);opacity:1;transform:translateY(-4px);box-shadow:var(--shadow-hover);}
.case-group{margin-bottom:var(--sp-8);}
.case-group__title{font-size:var(--fs-h3);color:var(--brand-indigo);margin-bottom:var(--sp-1);}
.case-group__desc{font-size:var(--fs-sm);color:var(--text-muted);margin-bottom:var(--sp-3);}

/* ============================================================
   P04 / P02 编号列表
   ============================================================ */
.number-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-3);}
.number-item{background:var(--white);border:1px solid var(--border-default);border-radius:var(--radius);padding:var(--sp-4);transition:background-color var(--transition-fast),transform var(--transition-fast);}
.number-item:hover{background:var(--bg-cream);transform:translateY(-2px);}
.number-item__idx{font-family:var(--font-num);font-size:var(--fs-h3);font-weight:var(--fw-bold);color:var(--brand-gold);}
.number-item__title{margin-top:var(--sp-1);font-size:var(--fs-h4);font-weight:var(--fw-semibold);color:var(--brand-indigo);}
.number-item__text{margin-top:var(--sp-1);font-size:var(--fs-sm);color:var(--text-secondary);}
/* 步骤流程卡（案例详情页的「成果介绍」）：
   卡片之间保留箭头 —— 箭头本身就是「先后顺序」最直观的表达，换成纯网格就丢了这层含义。
   卡片：flex 均分 + 阴影，白底上也能立起来；文字用 __text 类，不再靠行内 style 兜。 */
.step-flow{display:flex;gap:var(--sp-2);align-items:stretch;margin-top:var(--sp-2);flex-wrap:wrap;}
.step-card{flex:1 1 240px;min-width:200px;display:flex;flex-direction:column;gap:var(--sp-2);background:var(--surface-card);border:1px solid var(--border-default);border-radius:var(--radius);padding:var(--sp-4);box-shadow:var(--shadow-card);}
/* 步骤序号徽标：内容是单个「带圈数字」（①②③），所以做成**正圆**。
   用 inline-flex + min-width + 居中，比 inline-block + 左右 padding 好控制正圆
   （padding 会把单字符撑成椭圆）。将来若序号落在兜底分支（"(10)" 之类多字符），
   min-width 之外会被 padding 撑开、自动变回胶囊，不会挤爆。 */
.step-card__no{align-self:flex-start;display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:28px;padding:0;border-radius:var(--radius-pill);background:var(--gold-soft);color:var(--brand-indigo);font-size:var(--fs-sm);font-weight:var(--fw-bold);line-height:1;}
.step-card__text{font-size:var(--fs-body);line-height:var(--lh-body);color:var(--text-primary);}
.step-link{display:flex;align-items:center;color:var(--brand-gold);font-size:20px;}

/* 案例详情页组件 · 移动端（放在本组全部基础规则之后，确保能压过上面带 flex-basis 的规则） */
@media (max-width:860px){
  .c-numlist--2col{grid-template-columns:1fr;}
  .c-cardgrid,.c-cardgrid--c2,.c-cardgrid--c3,.c-cardgrid--c4,.c-cardgrid--c5,.c-cardgrid--c6{grid-template-columns:1fr;}
  .c-pager__item,.c-pager__pad{max-width:100%;}
  .page-hero--case .page-hero__title{font-size:var(--fs-h2);}
  /* 步骤卡改为竖向堆叠后，连接箭头必须跟着转 90° ——
     否则会出现「卡片往下排、箭头却仍指向右」的错位（流程方向读反）。
     .step-card 必须显式收掉 flex-grow 与 flex-basis（240px 在纵向即「高度」），
     否则卡片会被撑成 240px 高、文字只有两行 → 底下大片空白。 */
  .step-flow{flex-direction:column;gap:var(--sp-2);}
  .step-card{flex:0 0 auto;}
  .step-link{align-self:center;transform:rotate(90deg);}
}

/* ============================================================
   P02「独创 咨询+AI 作业模式」两步作业法示意图 FlowMap
   ------------------------------------------------------------
   替代原「配图位 · 两步作业法 示意」占位块：
   把文字区里的「步骤 1 / 步骤 2」两张卡搬进图内，做成纵向流程图 ——
   输入（营销咨询＋私域工具）→ 产出（打造增长引擎）→ 沉淀 → 再放大。
   全部走设计令牌，未硬编码色值。
   ============================================================ */
.flowmap{
  margin:0;padding:var(--sp-4);
  border-radius:18px;
  background:linear-gradient(180deg,#F7F5FB 0%,var(--white) 58%);
  border:1px solid var(--border-default);
  box-shadow:var(--shadow-card);
  display:flex;flex-direction:column;gap:var(--sp-3);
}
.flowmap__head{display:flex;align-items:baseline;gap:var(--sp-2);padding-bottom:var(--sp-2);border-bottom:2px solid var(--ink-100);}
.flowmap__eyebrow{font-size:var(--fs-xs);font-weight:var(--fw-bold);letter-spacing:2px;color:var(--brand-indigo);opacity:.6;}
.flowmap__title{font-size:var(--fs-h4);font-weight:var(--fw-bold);color:var(--brand-indigo);}

.flowmap__step{
  display:flex;gap:var(--sp-3);align-items:flex-start;
  padding:var(--sp-3);background:var(--white);
  border:1px solid var(--border-default);border-radius:14px;
  box-shadow:0 2px 12px rgba(47,31,92,.07);
}
.flowmap__no{
  flex:none;width:38px;height:38px;border-radius:50%;
  background:var(--brand-indigo);color:var(--brand-gold);
  font-family:var(--font-num);font-size:18px;font-weight:var(--fw-bold);line-height:1;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 0 4px var(--indigo-soft);
}
.flowmap__main{flex:1;min-width:0;}
.flowmap__label{margin:0;font-size:var(--fs-xs);font-weight:var(--fw-semibold);color:var(--ink-500);letter-spacing:.5px;}
.flowmap__io{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-1);margin:6px 0 0;}
.flowmap__in{font-size:var(--fs-h4);font-weight:var(--fw-bold);color:var(--brand-indigo);line-height:1.25;}
.flowmap__plus{color:var(--brand-gold);font-weight:var(--fw-bold);font-size:var(--fs-sm);}
.flowmap__arrow{color:var(--brand-gold);font-weight:var(--fw-bold);font-size:var(--fs-h4);margin:0 3px;}
.flowmap__out{
  font-size:var(--fs-sm);font-weight:var(--fw-bold);color:var(--brand-indigo);
  background:var(--gold-soft);border-radius:var(--radius-pill);padding:5px 12px;
}
.flowmap__note{margin:8px 0 0;font-size:var(--fs-xs);line-height:var(--lh-sm);color:var(--text-muted);}

.flowmap__join{position:relative;height:32px;flex:none;}
.flowmap__join::before{
  content:"";position:absolute;left:50%;top:0;bottom:10px;width:0;
  border-left:2px dashed var(--brand-gold);opacity:.7;transform:translateX(-1px);
}
.flowmap__join::after{
  content:"";position:absolute;left:50%;bottom:1px;width:9px;height:9px;
  border-right:2px solid var(--brand-gold);border-bottom:2px solid var(--brand-gold);
  transform:translateX(-50%) rotate(45deg);
}

.flowmap__foot{
  display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-1);
  margin:0;padding-top:var(--sp-3);border-top:1px dashed var(--border-default);
}
.flowmap__foot-label{font-size:var(--fs-xs);font-weight:var(--fw-semibold);color:var(--text-muted);margin-right:var(--sp-1);}
.flowmap__foot > span:not(.flowmap__foot-label){
  font-size:var(--fs-sm);font-weight:var(--fw-bold);color:var(--brand-indigo);
  background:var(--indigo-soft);border-radius:var(--radius-pill);padding:4px 12px;
}

/* ============================================================
   响应式
   ============================================================ */
@media (max-width:1199px){
  .footer-grid{grid-template-columns:1fr 1fr 1fr;gap:var(--sp-4);}
  .footer-brand{grid-column:span 3;}
}
@media (max-width:991px){
  .main-nav,.header-actions{display:none;}
  /* 移动端：导航栏右对齐 —— 把导航入口（汉堡按钮）推到最右侧、贴齐屏幕右边距。
     成因：桌面端靠 .main-nav{flex:1} 撑开中间空档，移动端它被 display:none 后
     没有任何弹性元素占位，汉堡按钮就会紧贴在 LOGO 右侧（320~768px 下右侧空出 60~170px）。
     margin-left:auto 只作用于本断点，桌面端 .hamburger 本就是 display:none，互不冲突。 */
  .hamburger{display:flex;margin-left:auto;}
  .hero-slide__title{font-size:40px;}
  .anchor-rail{display:none;}
  .service-inner{padding-right:0;}
  .anchor-tabs{display:flex;}
  .grid--4{grid-template-columns:repeat(2,1fr);}
  .grid--3{grid-template-columns:repeat(2,1fr);}
  .logo-grid{grid-template-columns:repeat(3,1fr);}
  .number-grid{grid-template-columns:repeat(2,1fr);}
  .news-carousel .c-carousel__slide{flex-basis:33.3333%;min-width:33.3333%;}
  .book-pages{grid-template-columns:1fr;}
}
@media (max-width:767px){
  :root{--fs-h1:30px;--fs-h2:24px;--fs-h3:20px;--fs-h4:16px;--fs-num:34px;--sp-12:64px;--sp-15:72px;}
  .grid--2,.grid--3,.grid--4{grid-template-columns:1fr;}
  .c-imagetext{grid-template-columns:1fr;gap:var(--sp-3);}
  .c-imagetext__text,.c-imagetext__media{grid-column:auto;}
  .c-imagetext.is-media-left .c-imagetext__text{order:2;}
  .c-imagetext.is-media-left .c-imagetext__media{order:1;}
  .hero-slide__inner{grid-template-columns:1fr;}
  .hero-slide__title{font-size:30px;}
  .hero-slide__sub{font-size:var(--fs-body);}
  .hero-slide__text,.hero-slide__media{grid-column:auto;}
  .hero-slide__media{display:none;}
  .c-carousel--hero{height:480px;min-height:480px;}
  .case-slide{grid-template-columns:1fr;}
  .case-slide__text,.case-slide__media{grid-column:auto;}
  .news-carousel .c-carousel__slide{flex-basis:83%;min-width:83%;}
  /* 移动端：切换按钮下移到「控制行」与圆点同排（左箭头 — 圆点 — 右箭头），
     既完整保留左右切换功能，又绝不占用正文列、绝不遮挡文字 */
  .c-carousel:not(.c-carousel--hero){row-gap:var(--sp-3);}
  .c-carousel:not(.c-carousel--hero) .c-carousel__arrow{grid-row:2;align-self:center;}
  .c-carousel:not(.c-carousel--hero) .c-carousel__arrow.is-prev{grid-column:1;}
  .c-carousel:not(.c-carousel--hero) .c-carousel__arrow.is-next{grid-column:3;}
  .c-carousel:not(.c-carousel--hero) .c-carousel__dots{grid-column:2;grid-row:2;}
  /* 首屏 hero 满屏且触摸可直接滑动切换，移动端只保留圆点、隐藏左右箭头 */
  .c-carousel--hero .c-carousel__arrow{display:none;}
  /* 两步作业法示意图：窄屏收紧尺寸，保证「运营体系 ＋ AI 智能体」不折行 */
  .flowmap{padding:var(--sp-3);border-radius:16px;}
  .flowmap__step{padding:var(--sp-2) var(--sp-3);gap:var(--sp-2);}
  .flowmap__no{width:32px;height:32px;font-size:16px;box-shadow:0 0 0 3px var(--indigo-soft);}
  .flowmap__in{font-size:15px;}
  .flowmap__io{gap:6px;}
  .flowmap__out{font-size:var(--fs-xs);padding:4px 10px;}
  .logo-grid{grid-template-columns:repeat(2,1fr);}
  .number-grid{grid-template-columns:1fr;}
  .chat-drawer{width:100%;max-width:100%;height:100%;height:100dvh;}
  .agent-widget{right:var(--sp-2);bottom:var(--sp-2);}
  .scroll-top{right:var(--sp-2);bottom:84px;}
  .booking-pages{padding:var(--sp-3);}
  .qr-inline{grid-template-columns:1fr;justify-items:center;text-align:center;}
  .assess-opts{margin-left:0;max-width:100%;}
  .opts-hint,.opts-confirm{margin-left:0;}
  .assess-msg__bubble{max-width:100%;}
  .opt-btn{font-size:15px;width:100%;}
  /* ============================================================
     移动端页脚：由「单列长条」改为「两列网格」
     ------------------------------------------------------------
     背景：单列时页脚总高 1464px（375px 屏 ≈ 1.9 个屏高），滚动负担很重。
     改造：页面导航 / 研究院 / 联系我们 三个链接板块 + 智能体入口 → 2 列网格。
       · 栅格：2 列等宽 1fr 1fr，列间距 16px、行间距 24px；
       · 页脚品牌区跨两列居顶（品牌名 + 简介 + 二维码需要整行宽度，不参与两列）；
       · 排布结果：[品牌 全宽] / [页面导航] [研究院] / [联系我们] [智能体入口]
         —— 三个板块每行两列；智能体入口补上第 4 槽，避免右下角空出半行（若不做补位，
         第 2 行右列会是空洞，视觉上是「没排完」）；
       · 对齐：justify-items 保持默认 stretch（每张卡片撑满所在列宽，两列文字左边缘严格对齐），
         align-items:start（卡片按自身内容高度顶部对齐，不被行高拉伸、不产生底部空白）；
         卡片内部一律左对齐，图标块与标题文字垂直居中对齐。
       · 320px 下两列各 128px：`企业战略体检` 按钮在 --fs-sm(14px) + 16px 内边距下约 116px，
         可完整放下不折行、不横向溢出。
     ⚠️ 与 768–1199px 的 3 列档、≥1200px 的 5 列档互不影响（各自断点独立）。
     ============================================================ */
  .footer-grid{grid-template-columns:1fr 1fr;column-gap:var(--sp-2);row-gap:var(--sp-3);align-items:start;}
  .footer-brand{grid-column:1 / -1;}
  /* 半列宽下把按钮收一档字号与内边距，保证 320px 不折行、不溢出 */
  .footer-agents .btn{font-size:var(--fs-sm);padding:0 var(--sp-2);}
  /* 触摸安全：一级链接热区由 20.4px 提到 31.8px、子链接 26.4px（文字行高 + 上下 4px 热区），
     同时收紧 list 间距，使「行与行」的整体节奏与桌面端保持一致，不额外拉高页脚。 */
  .footer-links{gap:6px;}
  .footer-links > a{padding:4px 0;}
  .footer-group{gap:4px;margin-top:0;}
  .footer-links .sub{padding-left:10px;gap:5px;}
  .footer-links .sub a{padding:3px 0;}
  .footer-contact-item{padding:4px 0;}
  /* 联系我们：手机号原本继承 .footer-links a{display:block}，会被强制独占一行，
     把「业务咨询：郭老师 / 18801155510 /（微信同号）」拆成 3 行；半列宽下更明显。
     移动端改回行内，让整句按自然断行规则折行：414px 起由 3 行降为 2 行；
     375px 及以下因「18801155510」与「（微信同号）」均不可中断、且窄列放不下同一行，
     仍为 3 行，但断点落在语义边界上（详见下一条 nowrap 规则）。
     仅作用于 ≤767px，桌面端版式不受影响。 */
  .footer-contact-item a{display:inline;}
  /* 「（微信同号）」整体不可断行 —— 半列宽下若允许在字间折行，会折成「（微信同 / 号）」这种断词，
     把括号注记拆开非常难读；锁定为一个不折行单元后，浏览器只在它前面换行，读起来是一整块。 */
  .footer-contact-note{white-space:nowrap;}
  /* 页脚版权行同理：让「隐私政策」「用户授权条款」各自成为一个不折行单元，
     否则窄屏会折成「隐私 / 政策」，看起来像排版事故。 */
  .footer-bottom a{white-space:nowrap;}
  .footer-bottom{margin-top:var(--sp-4);}
}

/* ============================================================
   对话抽屉 · 分档响应式（手机 / 平板 / 桌面）
   ------------------------------------------------------------
   设计意图：
   · ≤767px 手机：抽屉铺满「内容视口」——不横向滚动、元素完整可见；
                  内部边距与气泡宽度按屏宽自适应，小屏不挤、大屏不空。
   · 768–991px 平板：改为「悬浮面板」——四边留 24px 留白 + 圆角 + 随屏宽自适应的宽度
                     （上限 420px），既合理利用可用宽度，又保持留白、不贴死屏幕边缘。
   · ≥992px 桌面：沿用原有「右侧 400px 贴边」形态（已验收，不动它）。
   ⚠️ 任何一档都不允许再出现 100vw —— vw 含竖向滚动条宽度，会比内容视口宽 15px。
   ============================================================ */
@media (max-width:479px){
  /* 小屏手机（320~479px）：铺满 + 收紧内边距，保证不横向滚动 */
  .chat-drawer{width:100%;max-width:100%;}
  .chat-body{padding:var(--sp-2);gap:var(--sp-2);}
  .chat-quick{gap:6px;padding:var(--sp-2) var(--sp-2) 0;}
  .chat-quick__btn{font-size:11px;padding:6px 10px;}
  .chat-input{padding:var(--sp-2);}
  .chat-fallback{padding:0 var(--sp-2) var(--sp-2);}
  .chat-msg__bubble{max-width:84%;}
}
@media (min-width:480px) and (max-width:767px){
  /* 大屏手机 / 小平板竖屏（480~767px）：同样铺满，内边距回到常规值 */
  .chat-drawer{width:100%;max-width:100%;}
}
@media (min-width:768px) and (max-width:991px){
  /* 平板（iPad 竖屏 768/810/820、横屏 1024 之下的中间档）：悬浮面板 + 四周留白 */
  .chat-drawer{
    top:var(--sp-3);bottom:var(--sp-3);right:var(--sp-3);height:auto;
    width:min(420px,calc(100% - var(--sp-3) * 2));max-width:100%;
    border-radius:var(--radius-lg);overflow:hidden;
  }
}

/* ============================================================
   防止移动端「聚焦自动放大」——这是抽屉看上去「被放大 + 顶栏消失 + 左侧被裁」的元凶
   ------------------------------------------------------------
   Android Chrome / iOS Safari 在聚焦「字号 < 16px」的输入控件时，会自动把整个页面放大
   （约 1.15 倍）并平移视口，把输入框带到键盘上方。抽屉是 position:fixed，一放大就整体超出版面：
     · 顶栏（头像 + 「微略 AI 助理」+ ✕ 关闭按钮）被顶到屏幕外 → 用户找不到关闭入口
     · 左侧内容被裁掉（快捷问题、输入框占位文字的第一个字消失）
   本页输入框原本是 --fs-sm(14px)，正好踩在这条 16px 阈值上；改成 16px 即可根治。
   （留资表单的 .field__input 本来就是 --fs-body(16px)，不受影响。）
   ============================================================ */
@media (max-width:991px){
  .chat-input textarea{font-size:16px;}
}

/* ============================================================
   动效增强层 Motion Layer
   依据《需求规格整理文档》4.8 动效规范：
   · 入场淡入上移 24px / 480ms / cubic-bezier(0.22,1,0.36,1)
   · hover 200~300ms、位移 ≤4px；仅动 transform 与 opacity
   · 全部动效可被 prefers-reduced-motion 整体关闭
   所有隐藏态都挂在 .motion-ready 之下 —— 脚本不可用时内容完整可见
   ============================================================ */

/* ---------- 1 · 内容入场（滚动触发，JS 自动挂载 .reveal） ---------- */
.motion-ready .reveal:not(.is-inview),
.motion-ready [data-inview]:not(.is-inview){
  opacity:0;transform:translateY(24px);
}
.motion-ready .reveal.is-inview,
.motion-ready [data-inview].is-inview{
  animation:mlRise var(--dur-enter) var(--ease-out) backwards;
}
@keyframes mlRise{
  from{opacity:0;transform:translateY(24px);}
  to  {opacity:1;transform:translateY(0);}
}

/* ---------- 2 · 首屏逐行入场（随轮播切换重播） ---------- */
.motion-ready .hero-slide__text > *,
.motion-ready .hero-slide__media{opacity:0;}
.motion-ready .c-carousel__slide.is-active .hero-slide__text > *,
.motion-ready .c-carousel__slide.is-active .hero-slide__media{
  opacity:1;                       /* 动画结束后回落的目标态；延迟期内由 backwards 保持隐藏 */
  animation:mlRise var(--dur-enter) var(--ease-out) backwards;
}
.motion-ready .c-carousel__slide.is-active .hero-slide__text > *:nth-child(1){animation-delay:60ms;}
.motion-ready .c-carousel__slide.is-active .hero-slide__text > *:nth-child(2){animation-delay:150ms;}
.motion-ready .c-carousel__slide.is-active .hero-slide__text > *:nth-child(3){animation-delay:240ms;}
.motion-ready .c-carousel__slide.is-active .hero-slide__text > *:nth-child(4){animation-delay:330ms;}
.motion-ready .c-carousel__slide.is-active .hero-slide__media{animation-delay:220ms;}

/* ---------- 3 · 卡片：金色顶线扫出 + 图标微动 ---------- */
.c-card::before{
  content:"";position:absolute;left:0;right:0;top:0;height:2px;
  border-radius:var(--radius) var(--radius) 0 0;
  background:var(--brand-gold);
  transform:scaleX(0);transform-origin:0 50%;
  transition:transform var(--dur-base) var(--ease-out);
  pointer-events:none;
}
.c-card:hover::before{transform:scaleX(1);}
.c-card__icon{
  transition:transform var(--dur-base) var(--ease-out),
             background-color var(--dur-base) var(--ease-out);
}
.c-card:hover .c-card__icon{transform:translateY(-3px) rotate(-6deg);background:var(--gold-soft);}

/* ---------- 4 · 按钮高光扫过 ---------- */
.btn--primary,.btn--gold,.btn--ghost-light{position:relative;overflow:hidden;}
.btn--primary::after,.btn--gold::after,.btn--ghost-light::after{
  content:"";position:absolute;top:-10%;bottom:-10%;left:0;width:70%;
  background:linear-gradient(100deg,transparent 0 28%,rgba(255,255,255,.38) 50%,transparent 72% 100%);
  transform:translateX(-150%);
  transition:transform 700ms var(--ease-out);
  pointer-events:none;
}
.btn--primary:hover::after,.btn--gold:hover::after,.btn--ghost-light:hover::after{
  transform:translateX(190%);
}

/* ---------- 5 · 顶部滚动进度条 ---------- */
.scroll-progress{
  position:fixed;top:0;left:0;right:0;height:3px;
  z-index:201; /* = --z-header(200) + 1，压在吸顶头部之上 */
  pointer-events:none;
}
.scroll-progress i{
  display:block;height:100%;width:100%;
  background:linear-gradient(90deg,var(--brand-gold) 0%,var(--gold-hover) 100%);
  transform:scaleX(0);transform-origin:0 50%;
  will-change:transform;
}

/* ---------- 6 · 客服浮标呼吸光环 ---------- */
.agent-fab{position:relative;}
.agent-fab::after{
  content:"";position:absolute;inset:0;border-radius:50%;
  border:2px solid var(--brand-gold);
  pointer-events:none;
  animation:mlPulse 2600ms var(--ease-out) infinite;
}
@keyframes mlPulse{
  0%  {transform:scale(1);opacity:.55;}
  65% {transform:scale(1.6);opacity:0;}
  100%{transform:scale(1.6);opacity:0;}
}

/* ---------- 7 · 减少动态偏好：一律取终态，不做位移与循环 ---------- */
@media (prefers-reduced-motion: reduce){
  .motion-ready .reveal:not(.is-inview),
  .motion-ready [data-inview]:not(.is-inview),
  .motion-ready .hero-slide__text > *,
  .motion-ready .hero-slide__media{opacity:1;transform:none;}
  .motion-ready .reveal.is-inview,
  .motion-ready [data-inview].is-inview,
  .motion-ready .c-carousel__slide.is-active .hero-slide__text > *,
  .motion-ready .c-carousel__slide.is-active .hero-slide__media{animation-delay:0ms !important;}
  .btn--primary::after,.btn--gold::after,.btn--ghost-light::after{display:none;}
  .agent-fab::after{display:none;}
}

/* ============================================================
   深色上下文归一化（可读性修复 · Token 级）
   ------------------------------------------------------------
   项目里有三个深色容器：
     .section--dark          通用深色区块
     .service-section--dark  P05 服务总览四大板块
     .page-hero              二级页头
   组件级的深色适配规则必须同时覆盖三者，否则会出现
   「深靛紫字压在深靛紫底上」→ 对比度 1.00，文字完全看不见。
   （P05 服务页的板块标题曾因只写了 .section--dark 而整块空白。）

   ⚠️ 新增深色容器类时，务必把类名补进下面每一组选择器。
   ============================================================ */

/* 区块标题 */
.section--dark .c-sectiontitle__label,
.service-section--dark .c-sectiontitle__label,
.page-hero .c-sectiontitle__label{color:var(--brand-gold);}
.section--dark .c-sectiontitle__title,
.service-section--dark .c-sectiontitle__title,
.page-hero .c-sectiontitle__title{color:var(--on-indigo);}
.section--dark .c-sectiontitle__sub,
.service-section--dark .c-sectiontitle__sub,
.page-hero .c-sectiontitle__sub{color:var(--on-indigo-dim);}

/* 面包屑（.c-breadcrumb 自身带 color:--text-muted，会盖掉容器继承色 → 必须显式覆盖） */
.section--dark .c-breadcrumb,
.section--dark .c-breadcrumb a,
.section--dark .c-breadcrumb .current,
.service-section--dark .c-breadcrumb,
.service-section--dark .c-breadcrumb a,
.service-section--dark .c-breadcrumb .current,
.page-hero .c-breadcrumb,
.page-hero .c-breadcrumb a,
.page-hero .c-breadcrumb .current{color:var(--on-indigo-dim);}
.section--dark .c-breadcrumb a:hover,
.service-section--dark .c-breadcrumb a:hover,
.page-hero .c-breadcrumb a:hover{color:var(--brand-gold);}

/* 其它深底组件 */
.section--dark .stat__label,
.service-section--dark .stat__label,
.page-hero .stat__label{color:var(--on-indigo);}

/* ============================================================
   P05 锚点导航：深浅背景自适应
   ------------------------------------------------------------
   锚点栏是 absolute + sticky，浮在内容之上，会跨越「深色板块 / 浅色板块」，
   任何单一颜色都必然有一半读不出来（深底上 #2F1F5C 字对比度 1.00、
   #4A4750 字对比度 1.57）。因此由 JS 按所在区块切换 .is-on-dark。
   ============================================================ */
.anchor-nav.is-on-dark .anchor-nav__title{color:var(--on-indigo-dim);}
.anchor-nav.is-on-dark .anchor-nav__item{color:var(--on-indigo-dim);border-left-color:var(--on-indigo-line);}
.anchor-nav.is-on-dark .anchor-nav__item:hover{color:var(--brand-gold);background:var(--on-indigo-soft);}
.anchor-nav.is-on-dark .anchor-nav__item.is-active{color:var(--brand-gold);border-left-color:var(--brand-gold);}