:root{
  /* ===== 配色（由变体注入）===== */
    --bg:#FAF7F2; --surface:#FFFFFF; --surface-2:#F4EFE6;
  --ink:#2A2320; --ink-2:#6B5F55; --ink-3:#A2968A;
  --brand:#A8552F; --brand-d:#8A4324; --brand-l:#F2E2D6;
  --brand-glow:rgba(168,85,47,.24);
  --accent:#B8933A; --accent-d:#8E711F; --accent-l:#F4EAD3;
  --line:#EAE2D6; --line2:#D9CDBB;
  --hero:radial-gradient(125% 115% at 12% 0%, #FFFDF9 0%, #F6EFE3 48%, #EDE2D0 100%);
  --glow:rgba(168,85,47,.14);
  --banner-a:linear-gradient(100deg,#F8EDE3,#F1DED0);
  --banner-b:linear-gradient(100deg,#F6F0DF,#EEE4C9);
  --cta-bg:linear-gradient(120deg,#F8F2E8,#F1E6D6);
  --warn-bg:#FBF2E1; --warn-ink:#85591D; --warn-line:#EDDCB8;
  --footer-bg:#2B2521; --footer-ink:#C3B9AE; --footer-strong:#F4EEE5;
  --footer-line:#443B34; --footer-dim:#94887B;
  /* ===== 尺寸 / 阴影 ===== */
  --r-sm:12px; --r:18px; --r-lg:28px; --r-pill:999px;
  --sh:0 1px 2px rgba(96,74,52,.05), 0 10px 30px rgba(96,74,52,.07);
  --sh-h:0 2px 6px rgba(96,74,52,.07), 0 18px 44px rgba(96,74,52,.12);
  --maxw:1120px;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:'PingFang SC','Microsoft YaHei',-apple-system,'Segoe UI',Roboto,sans-serif;
  color:var(--ink); background:var(--bg); line-height:1.8;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none;transition:color .18s ease,opacity .18s ease;}
img{max-width:100%;height:auto;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px;}

/* ---------- 顶部导航 ---------- */
header{
  position:sticky;top:0;z-index:20;
  background:color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--line);
}
.nav{display:flex;align-items:center;justify-content:space-between;min-height:76px;gap:16px;flex-wrap:wrap;}
.nav img{height:42px;width:auto;}
.nav ul{display:flex;list-style:none;gap:6px;font-size:15px;flex-wrap:wrap;}
.nav ul a{padding:7px 13px;border-radius:var(--r-pill);color:var(--ink-2);font-weight:500;}
.nav ul a:hover{color:var(--brand-d);background:var(--brand-l);}
.nav ul a[aria-current="page"]{color:var(--brand-d);background:var(--brand-l);font-weight:600;}
.nav .tel{
  color:var(--brand-d);font-weight:600;font-size:15px;
  background:var(--brand-l);padding:8px 16px;border-radius:var(--r-pill);
}
.crumb{font-size:12.5px;color:var(--ink-3);padding:2px 0 10px;letter-spacing:.02em;}

/* ---------- 首屏 ---------- */
.hero{
  background:var(--hero);
  padding:76px 0 82px;
  border-bottom:1px solid var(--line);
  position:relative;overflow:hidden;
}
.hero::after{
  content:'';position:absolute;right:-160px;top:-140px;width:520px;height:520px;
  background:radial-gradient(circle, var(--glow) 0%, transparent 68%);
  pointer-events:none;
}
.hero h1{
  font-size:clamp(27px,4.1vw,42px);line-height:1.32;font-weight:800;
  letter-spacing:-.01em;color:var(--ink);max-width:900px;
}
.hero h1 em{font-style:normal;color:var(--brand);position:relative;white-space:nowrap;}
.hero h1 em::after{
  content:'';position:absolute;left:0;right:0;bottom:.06em;height:.30em;
  background:var(--brand-l);border-radius:var(--r-pill);z-index:-1;
}
.hero p.lead{margin-top:22px;font-size:16.5px;max-width:800px;color:var(--ink-2);line-height:1.85;}
.btns{margin-top:30px;display:flex;gap:14px;flex-wrap:wrap;}
.btn{display:inline-block;padding:13px 30px;border-radius:var(--r-pill);font-size:15px;font-weight:600;transition:all .2s ease;}
.btn-red{background:var(--brand);color:#fff;box-shadow:0 6px 18px var(--brand-glow);}
.btn-red:hover{background:var(--brand-d);transform:translateY(-2px);box-shadow:0 10px 26px var(--brand-glow);}
.btn-ghost{border:1.5px solid var(--line2);color:var(--ink-2);background:var(--surface);}
.btn-ghost:hover{border-color:var(--brand);color:var(--brand-d);background:var(--brand-l);}
.facts{display:flex;flex-wrap:wrap;gap:12px;margin-top:36px;}
.facts div{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  padding:14px 22px;font-size:13.5px;color:var(--ink-2);
  box-shadow:var(--sh);min-width:150px;
}
.facts b{display:block;font-size:21px;color:var(--brand);letter-spacing:-.01em;margin-bottom:2px;}

/* ---------- 通用区块 ---------- */
section{padding:68px 0;}
section.gray{background:var(--surface-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.h2{font-size:clamp(22px,2.6vw,28px);color:var(--ink);font-weight:800;text-align:center;letter-spacing:-.01em;}
.h2::after{
  content:'';display:block;width:54px;height:4px;border-radius:var(--r-pill);
  background:var(--brand);margin:14px auto 0;opacity:.85;
}
.sub{text-align:center;color:var(--ink-2);font-size:14.5px;margin-top:14px;max-width:680px;margin-left:auto;margin-right:auto;}

/* ---------- 业务板块 ---------- */
.div-banner{
  border-radius:var(--r-lg);padding:20px 28px;margin-top:42px;
  display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;
  border:1px solid var(--line);box-shadow:var(--sh);
}
.div-banner.red{background:var(--banner-a);}
.div-banner.navy{background:var(--banner-b);}
.div-banner .big{font-size:19px;font-weight:800;letter-spacing:-.01em;}
.div-banner.red .big{color:var(--brand-d);}
.div-banner.navy .big{color:var(--accent-d);}
.div-banner .en{font-size:11.5px;color:var(--ink-3);letter-spacing:.10em;font-weight:600;}
.div-banner .d{font-size:13.5px;color:var(--ink-2);}

.cards{display:flex;flex-wrap:wrap;gap:20px;margin-top:22px;}
.card{
  flex:1 1 250px;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r);padding:26px 24px;box-shadow:var(--sh);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.card:hover{transform:translateY(-4px);box-shadow:var(--sh-h);border-color:var(--line2);}
.card.red{border-top:3px solid var(--brand);}
.card.navy{border-top:3px solid var(--accent);}
.card .no{font-size:11.5px;font-weight:700;letter-spacing:.16em;}
.card.red .no{color:var(--brand);}
.card.navy .no{color:var(--accent);}
.card h3{font-size:16.5px;color:var(--ink);margin:10px 0 10px;font-weight:700;letter-spacing:-.01em;}
.card p{font-size:13.5px;color:var(--ink-2);line-height:1.8;}
.card .todo{
  font-size:11.5px;color:var(--warn-ink);background:var(--warn-bg);
  border-radius:var(--r-pill);padding:4px 12px;display:inline-block;margin-top:14px;font-weight:500;
}

/* ---------- 案例 ---------- */
.warnbar{
  background:var(--warn-bg);border:1px solid var(--warn-line);border-radius:var(--r);
  padding:16px 22px;font-size:13px;color:var(--warn-ink);margin-top:30px;line-height:1.8;
}
.case-cards{display:flex;flex-wrap:wrap;gap:20px;margin-top:22px;}
.case{
  flex:1 1 360px;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r);padding:26px 26px;box-shadow:var(--sh);
  transition:transform .22s ease, box-shadow .22s ease;
}
.case:hover{transform:translateY(-4px);box-shadow:var(--sh-h);}
.case .ind{font-size:11.5px;color:var(--brand);font-weight:700;letter-spacing:.08em;}
.case h3{font-size:16.5px;color:var(--ink);margin:9px 0 10px;font-weight:700;letter-spacing:-.01em;}
.case p{font-size:13.5px;color:var(--ink-2);line-height:1.8;}

/* ---------- 信任层 ---------- */
.trust{display:flex;flex-wrap:wrap;gap:18px;margin-top:38px;}
.trust div{
  flex:1 1 220px;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r);padding:26px 20px;text-align:center;box-shadow:var(--sh);
}
.trust b{display:block;font-size:22px;color:var(--brand);letter-spacing:-.01em;}
.trust span{font-size:13px;color:var(--ink-2);display:block;margin-top:6px;}

/* ---------- FAQ ---------- */
.faq{max-width:840px;margin:36px auto 0;}
.faq details{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  margin-bottom:12px;padding:0 24px;transition:border-color .2s ease, box-shadow .2s ease;
}
.faq details[open]{box-shadow:var(--sh);border-color:var(--line2);}
.faq summary{
  cursor:pointer;padding:18px 0;font-size:15.5px;font-weight:700;color:var(--ink);
  list-style:none;display:flex;align-items:flex-start;gap:12px;
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::before{
  content:'Q';flex:0 0 24px;height:24px;line-height:24px;text-align:center;
  background:var(--brand);color:#fff;border-radius:var(--r-pill);font-size:12.5px;font-weight:700;
}
.faq .a{padding:0 0 20px 36px;font-size:14px;color:var(--ink-2);line-height:1.85;}

/* ---------- 联系 ---------- */
.contact-box{
  background:var(--cta-bg);border-radius:var(--r-lg);padding:42px 46px;
  display:flex;flex-wrap:wrap;gap:34px;margin-top:36px;border:1px solid var(--line);box-shadow:var(--sh);
}
.contact-box > div{flex:1 1 300px;}
.contact-box h3{font-size:18px;margin-bottom:12px;color:var(--ink);font-weight:800;letter-spacing:-.01em;}
.contact-box p{font-size:14.5px;color:var(--ink-2);line-height:1.85;}
.contact-box .todo{color:var(--warn-ink);background:var(--warn-bg);border-radius:var(--r-pill);padding:2px 10px;}

/* ---------- 页脚 ---------- */
footer{background:var(--footer-bg);color:var(--footer-ink);padding:52px 0 30px;font-size:13.5px;margin-top:0;}
.foot{display:flex;flex-wrap:wrap;gap:34px;}
.foot > div{flex:1 1 300px;}
.foot h4{color:var(--footer-strong);font-size:15px;margin-bottom:14px;font-weight:700;}
.foot p{margin-bottom:8px;line-height:1.8;}
.foot a:hover{color:var(--brand);}
.copy{
  border-top:1px solid var(--footer-line);margin-top:34px;padding-top:20px;
  font-size:12px;color:var(--footer-dim);line-height:2;
}

/* ================= 动效层 ================= */
@keyframes riseIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes floatGlow{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-18px,16px) scale(1.07)}}
@keyframes popIn{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:scale(1)}}
@keyframes shine{from{background-position:-160% 0}to{background-position:260% 0}}

/* ① 首屏入场序列（有节奏地依次出现，不是一起蹦出来） */
.hero h1      {animation:riseIn .78s cubic-bezier(.22,1,.36,1) .06s backwards;}
.hero p.lead  {animation:riseIn .78s cubic-bezier(.22,1,.36,1) .18s backwards;}
.hero .btns   {animation:riseIn .78s cubic-bezier(.22,1,.36,1) .30s backwards;}
.hero .facts  {animation:riseIn .78s cubic-bezier(.22,1,.36,1) .42s backwards;}
.hero .facts div:nth-child(1) b{animation:popIn .5s cubic-bezier(.34,1.56,.64,1) .60s backwards;}
.hero .facts div:nth-child(2) b{animation:popIn .5s cubic-bezier(.34,1.56,.64,1) .72s backwards;}
.hero .facts div:nth-child(3) b{animation:popIn .5s cubic-bezier(.34,1.56,.64,1) .84s backwards;}

/* ② 背景光晕缓缓浮动（几乎察觉不到，但页面"活"了） */
.hero::after{animation:floatGlow 16s ease-in-out infinite;}

/* ③ 滚动揭示：进入视口才出现 */
.reveal{
  opacity:0;transform:translateY(24px);
  transition:opacity .72s cubic-bezier(.22,1,.36,1), transform .72s cubic-bezier(.22,1,.36,1);
  will-change:opacity,transform;
}
.reveal.in{opacity:1;transform:translateY(0);}

/* ④ 导航滚动后浮出阴影 */
header{transition:box-shadow .3s ease, background .3s ease;}
header.scrolled{box-shadow:0 4px 22px rgba(96,74,52,.09);}

/* ⑤ 卡片：悬停抬升 + 柔和描边（原有基础上更顺滑） */
.card,.case{transition:transform .28s cubic-bezier(.22,1,.36,1), box-shadow .28s ease, border-color .28s ease;}

/* ⑥ 主按钮：一道微光扫过（只在悬停时，不循环刷存在感） */
.btn-red{position:relative;overflow:hidden;}
.btn-red::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.35) 50%,transparent 65%);
  background-size:260% 100%;background-position:-160% 0;opacity:0;
}
.btn-red:hover::before{opacity:1;animation:shine .9s ease;}

/* ⑦ 板块横幅：悬停时轻微右移，暗示可点 */
.div-banner{transition:transform .3s cubic-bezier(.22,1,.36,1), box-shadow .3s ease;}
.div-banner:hover{transform:translateX(5px);box-shadow:var(--sh-h);}

/* ⑧ FAQ 展开平滑 */
.faq details .a{animation:riseIn .42s cubic-bezier(.22,1,.36,1);}
.faq summary{transition:color .2s ease;}
.faq details[open] summary{color:var(--brand-d);}

/* ⑨ 信任层数字：进入视口时弹一下 */
.trust div b{display:block;}
.trust.in div:nth-child(1) b{animation:popIn .5s cubic-bezier(.34,1.56,.64,1) .05s backwards;}
.trust.in div:nth-child(2) b{animation:popIn .5s cubic-bezier(.34,1.56,.64,1) .15s backwards;}
.trust.in div:nth-child(3) b{animation:popIn .5s cubic-bezier(.34,1.56,.64,1) .25s backwards;}
.trust.in div:nth-child(4) b{animation:popIn .5s cubic-bezier(.34,1.56,.64,1) .35s backwards;}

/* ⑩ 尊重系统的"减少动态效果"设置 */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important;}
  .reveal{opacity:1!important;transform:none!important;}
}

/* ===================== 子页面组件 ===================== */

/* 面包屑条（子页面顶部） */
.crumb-bar{background:var(--surface);border-bottom:1px solid var(--line);}
.crumb-bar .wrap{padding-top:13px;padding-bottom:13px;}
.crumb-bar .crumb{padding:0;font-size:13px;}
.crumb-bar a:hover{color:var(--brand-d);}
.crumb-bar .sep{margin:0 9px;color:var(--ink-3);}

/* 子页面首屏（比首页矮） */
.hero.page{padding:56px 0 58px;}
.hero.page h1{font-size:clamp(24px,3.3vw,35px);}
.hero.page p.lead{margin-top:16px;font-size:15.5px;}

/* 长文排版 */
.prose{max-width:880px;margin:0 auto;}
.prose p{margin-bottom:18px;color:var(--ink-2);font-size:15px;line-height:1.92;}
.prose h3{font-size:17px;color:var(--ink);margin:30px 0 12px;font-weight:700;letter-spacing:-.01em;}
.prose ul{margin:0 0 18px 22px;color:var(--ink-2);font-size:15px;line-height:1.92;}
.prose li{margin-bottom:7px;}

/* 实体信息表 */
.info-table{width:100%;border-collapse:separate;border-spacing:0;margin-top:28px;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--sh);}
.info-table th,.info-table td{padding:15px 22px;font-size:14px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top;}
.info-table tr:last-child th,.info-table tr:last-child td{border-bottom:none;}
.info-table th{background:var(--surface-2);color:var(--ink);font-weight:600;width:180px;white-space:nowrap;}
.info-table td{color:var(--ink-2);}

/* 空状态 */
.empty-state{text-align:center;padding:64px 26px;background:var(--surface);border:1px dashed var(--line2);
  border-radius:var(--r-lg);margin-top:32px;}
.empty-state b{display:block;font-size:17px;color:var(--ink);margin-bottom:10px;font-weight:700;}
.empty-state p{color:var(--ink-2);font-size:14px;line-height:1.85;max-width:520px;margin:0 auto;}

/* 双列 / 三列布局 */
.two-col{display:flex;flex-wrap:wrap;gap:26px;margin-top:30px;}
.two-col > *{flex:1 1 320px;}
.three-col{display:flex;flex-wrap:wrap;gap:20px;margin-top:30px;}
.three-col > *{flex:1 1 260px;}

/* 服务详情页的服务清单 */
.feature-list{list-style:none;margin:24px 0 0;}
.feature-list li{position:relative;padding:11px 0 11px 34px;font-size:14.5px;color:var(--ink-2);
  border-bottom:1px solid var(--line);line-height:1.8;}
.feature-list li:last-child{border-bottom:none;}
.feature-list li::before{content:'';position:absolute;left:8px;top:19px;width:11px;height:11px;
  border-radius:var(--r-pill);background:var(--brand);opacity:.85;}

/* 服务入口卡片（服务中心总览） */
.svc-card{display:flex;flex-direction:column;gap:10px;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r);padding:26px 24px;box-shadow:var(--sh);transition:transform .28s cubic-bezier(.22,1,.36,1),box-shadow .28s ease,border-color .28s ease;}
.svc-card:hover{transform:translateY(-4px);box-shadow:var(--sh-h);border-color:var(--line2);}
.svc-card .k{font-size:11.5px;font-weight:700;letter-spacing:.14em;color:var(--brand);}
.svc-card h3{font-size:16.5px;color:var(--ink);font-weight:700;letter-spacing:-.01em;}
.svc-card p{font-size:13.5px;color:var(--ink-2);line-height:1.8;flex:1;}
.svc-card .go{font-size:13px;color:var(--brand-d);font-weight:600;}
.svc-card:hover .go{text-decoration:underline;}

/* CTA 区（子页面底部统一） */
.cta-band{background:var(--cta-bg);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:40px 44px;display:flex;flex-wrap:wrap;gap:28px;align-items:center;box-shadow:var(--sh);}
.cta-band > div:first-child{flex:1 1 380px;}
.cta-band h3{font-size:19px;color:var(--ink);font-weight:800;margin-bottom:10px;letter-spacing:-.01em;}
.cta-band p{font-size:14.5px;color:var(--ink-2);line-height:1.85;}
.cta-band .acts{flex:0 0 auto;display:flex;gap:12px;flex-wrap:wrap;}
