/* ============================================================
   本站 · 海港视界 (zhoushan_design_horizon)
   视觉语言：海港靛蓝 / 船木橙 / 碧海青绿 / 浪花白
   图形母题：海浪视差（horizon wave）—— 多层 SVG 波浪按不同速率漂移
   密度：宽松 112px ｜ 边角：直角 ｜ 分隔：波浪 SVG
   ============================================================ */

:root{
  /* ===== 主色 ===== */
  --brand:       #142E5F;    /* 海港靛蓝（主色，H=219° 偏紫，区别于前作）*/
  --brand-deep:  #07173A;    /* 深海（深底） */
  --brand-soft:  #4A5E85;
  --brand-tint:  #E0E7F1;

  /* ===== 辅色 ===== */
  --accent:      #236B6B;    /* 碧海青绿（辅色，深版白字 5.35:1）*/
  --accent-deep: #154A4A;
  --accent-tint: #DCEEEE;

  /* ===== 强调色 ===== */
  --wood:        #A85520;    /* 船木橙（强调，白底文字 5.27:1 达标）*/
  --wood-deep:   #82410E;
  --wood-tint:   #F5E1CE;

  --foam:        #F0F4F8;    /* 浪花白 */
  --mist:        #D9E2EA;    /* 海雾灰 */

  /* ===== 文字 ===== */
  --ink:         #0A1A2A;    /* 深蓝黑（正文） */
  --text:        #0A1A2A;
  --text-soft:   #34475A;    /* 次要（白底 10.07:1）*/
  --text-light:  #4A5C6A;    /* 提示（白底 7.10:1 / 浪花底 6.43:1 ≥5.5 达标）*/
  --gray:        #8B98A3;    /* 中灰 */
  --gray-light:  #C8D1D8;    /* 浅灰 */

  /* ===== 圆角（直角风） ===== */
  --r-sm:        2px;
  --r-md:        4px;
  --r-lg:        6px;
  --r-pill:      999px;

  /* ===== 间距（宽松 112） ===== */
  --space-1:     4px;
  --space-2:     8px;
  --space-3:     12px;
  --space-4:     16px;
  --space-6:     24px;
  --space-8:     32px;
  --space-12:    48px;
  --space-16:    64px;
  --space-20:    80px;
  --space-28:    112px;

  /* ===== 阴影 ===== */
  --sh-sm:       0 2px 4px rgba(15,61,107,.06);
  --sh-md:       0 4px 12px rgba(15,61,107,.08);
  --sh-lg:       0 12px 32px rgba(15,61,107,.12);
  --sh-glow:     0 8px 24px rgba(216,122,58,.22);

  /* ===== 动画 ===== */
  --ease:        cubic-bezier(.22,.61,.36,1);
  --ease-out:    cubic-bezier(.16,1,.3,1);
  --t:           .32s var(--ease);
  --t-fast:      .18s var(--ease);
  --t-slow:      .6s var(--ease-out);

  /* ===== 容器 ===== */
  --container:   1240px;

  /* ===== 母题：海浪 SVG（多层不同速率） ===== */
  --wave-1: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 80' preserveAspectRatio='none'%3E%3Cpath d='M0,40 C200,10 400,70 600,40 C800,10 1000,70 1200,40 L1200,80 L0,80 Z' fill='%230F3D6B' fill-opacity='.12'/%3E%3C/svg%3E");
  --wave-1-deep: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 80' preserveAspectRatio='none'%3E%3Cpath d='M0,40 C200,10 400,70 600,40 C800,10 1000,70 1200,40 L1200,80 L0,80 Z' fill='%230F3D6B'/%3E%3C/svg%3E");
  --wave-2: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 60' preserveAspectRatio='none'%3E%3Cpath d='M0,30 C150,5 300,55 600,30 C900,5 1050,55 1200,30 L1200,60 L0,60 Z' fill='%232E8B8B' fill-opacity='.15'/%3E%3C/svg%3E");
  --wave-3: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 50' preserveAspectRatio='none'%3E%3Cpath d='M0,25 C100,5 200,45 400,25 C600,5 700,45 900,25 C1050,10 1100,40 1200,25 L1200,50 L0,50 Z' fill='%23D87A3A' fill-opacity='.10'/%3E%3C/svg%3E");
  --wave-foam: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 40' preserveAspectRatio='none'%3E%3Cpath d='M0,20 C150,5 300,35 600,20 C900,5 1050,35 1200,20 L1200,40 L0,40 Z' fill='%23F0F4F8'/%3E%3C/svg%3E");
}

/* ============================================================
   重置与基础
   ============================================================ */
*,*::before,*::after{box-sizing:border-box}
html{overflow-x:clip;scroll-behavior:smooth}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif;font-size:16px;line-height:1.7;color:var(--text);background:var(--foam);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--brand);text-decoration:none;transition:color var(--t-fast)}
a:hover{color:var(--wood)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:var(--r-sm)}

h1,h2,h3,h4{margin:0;line-height:1.25;font-weight:700;color:var(--ink);letter-spacing:-.01em}
p{margin:0 0 1em}

/* ============================================================
   通用工具
   ============================================================ */
.container{max-width:var(--container);margin:0 auto;padding:0 var(--space-6)}
.section{padding:var(--space-28) 0}
.section--tight{padding:var(--space-20) 0}
.section--alt{background:var(--brand-tint)}
.section--dark{background:var(--brand-deep);color:#fff}
.section--dark h2,.section--dark h3,.section--dark h4{color:#fff}

/* ============================================================
   导航
   ============================================================ */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;height:64px;display:flex;align-items:center;transition:background var(--t),box-shadow var(--t)}
.nav--top{background:transparent;color:#fff}
.nav--solid{background:#fff;box-shadow:var(--sh-md);color:var(--ink)}
.nav__inner{max-width:var(--container);margin:0 auto;padding:0 var(--space-6);display:flex;align-items:center;gap:var(--space-8);width:100%}
.nav__brand{font-size:18px;font-weight:700;letter-spacing:.04em;display:flex;align-items:center;gap:var(--space-3)}
.nav__brand svg{width:32px;height:32px}
.nav__list{display:flex;gap:var(--space-2);list-style:none;margin:0;padding:0}
.nav__link{display:inline-block;padding:8px 14px;font-size:14px;font-weight:500;color:inherit;opacity:.85;transition:opacity var(--t-fast)}
.nav__link:hover,.nav__link.is-active{opacity:1;color:var(--wood)}
.nav__item{position:relative}
.nav__panel{position:absolute;top:calc(100% + 4px);left:50%;transform:translateX(-50%) translateY(8px);background:#fff;color:var(--brand);min-width:180px;padding:10px 0;border-radius:var(--r-md);box-shadow:var(--sh-lg);opacity:0;visibility:hidden;transition:all var(--t-fast);z-index:60;list-style:none}
.nav__item:hover .nav__panel,.nav__item:focus-within .nav__panel{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.nav__panel a{display:block;padding:9px 16px;font-size:14px;color:var(--brand-soft);text-decoration:none;white-space:nowrap;transition:background .2s,color .2s}
.nav__panel a:hover{background:var(--brand-tint);color:var(--brand-deep)}
.nav__top{margin-left:auto;display:flex;gap:var(--space-3);align-items:center}
.nav__cta{padding:8px 18px;font-size:13px;font-weight:600;border:1px solid currentColor;border-radius:var(--r-sm)}

/* ============================================================
   板块标题（标题 D：左对齐+右侧说明）
   ============================================================ */
.sec-head{display:flex;align-items:flex-end;gap:var(--space-8);margin-bottom:var(--space-12)}
.sec-head__main{flex:1 1 auto}
.sec-head__t{font-size:clamp(28px,3vw,40px);font-weight:700;color:var(--ink);letter-spacing:-.02em;position:relative;padding-left:var(--space-4)}
.sec-head__t::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;background:var(--wood)}
.sec-head__sub{margin-top:var(--space-3);font-size:15px;color:var(--text-soft);max-width:620px}
.sec-head__side{flex:0 0 280px;font-size:14px;color:var(--text-soft);line-height:1.7;border-left:1px solid var(--mist);padding-left:var(--space-6)}
.sec-head__more{font-size:14px;font-weight:600;color:var(--brand);display:inline-flex;align-items:center;gap:6px;margin-top:var(--space-3)}
.sec-head__more:hover{color:var(--wood)}

/* ============================================================
   按钮
   ============================================================ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 28px;font-family:inherit;font-size:15px;font-weight:600;line-height:1;border:none;cursor:pointer;border-radius:var(--r-sm);transition:all var(--t-fast);user-select:none}
.btn--primary{background:var(--brand);color:#fff;box-shadow:var(--sh-md)}
.btn--primary:hover{background:var(--brand-deep);transform:translateY(-2px);box-shadow:var(--sh-lg)}
.btn--wood{background:var(--wood);color:#fff;box-shadow:var(--sh-glow)}
.btn--wood:hover{background:var(--wood-deep);transform:translateY(-2px)}
.btn--ghost{border:1.5px solid currentColor;color:inherit;background:transparent}
.btn--ghost:hover{background:currentColor;color:var(--brand-deep)}
.btn__ico{display:inline-flex;transition:transform var(--t-fast)}
.btn:hover .btn__ico{transform:translateX(4px)}

/* ============================================================
   Hero B：全屏渐变 + 中央文案 + 海浪视差
   ============================================================ */
.hero{position:relative;min-height:600px;height:80vh;max-height:780px;overflow:hidden;background:linear-gradient(180deg,#082544 0%,#0F3D6B 55%,#1E5C8C 100%);color:#fff}
.hero__slides{position:absolute;top:64px;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center}
.hero__slide{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity 1s var(--ease),visibility 1s var(--ease)}
.hero__slide.is-on{opacity:1;visibility:visible}
.no-js .hero__slide{opacity:1 !important;visibility:visible !important}
.no-js .hero__slide:not(:first-child){display:none}
.hero__slide__bg{position:absolute;inset:0;background-size:cover;background-position:center}
.hero__slide__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,37,68,.45),rgba(8,37,68,.2) 50%,rgba(8,37,68,.7))}
.hero__slide__in{position:relative;z-index:2;max-width:var(--container);margin:0 auto;padding:0 var(--space-6);display:flex;flex-direction:column;align-items:center;text-align:center}

/* 海浪视差背景：3 层 SVG 波浪 */
.hero__waves{position:absolute;left:0;right:0;bottom:0;height:240px;z-index:1;pointer-events:none;overflow:hidden}
.hero__wave{position:absolute;left:-10%;right:-10%;height:80px;background-repeat:repeat-x;background-size:1200px 80px;opacity:.9}
.hero__wave--1{bottom:0;height:100px;background-image:var(--wave-1-deep);animation:waveDrift1 14s linear infinite}
.hero__wave--2{bottom:36px;height:80px;background-image:var(--wave-2);animation:waveDrift2 18s linear infinite}
.hero__wave--3{bottom:80px;height:60px;background-image:var(--wave-3);animation:waveDrift3 22s linear infinite}
@keyframes waveDrift1{from{background-position-x:0}to{background-position-x:1200px}}
@keyframes waveDrift2{from{background-position-x:0}to{background-position-x:-1200px}}
@keyframes waveDrift3{from{background-position-x:0}to{background-position-x:1200px}}

/* Hero 帆船装饰 */
.hero__sailboat{position:absolute;left:8%;bottom:30%;width:80px;height:80px;z-index:1;opacity:.7;animation:sailDrift 8s ease-in-out infinite}
@keyframes sailDrift{0%,100%{transform:translateX(0) translateY(0)}50%{transform:translateX(20px) translateY(-6px)}}

/* Hero 海鸥 SVG */
.hero__seagull{position:absolute;right:12%;top:22%;width:48px;height:24px;z-index:1;opacity:.55;animation:seagullFly 16s linear infinite}
@keyframes seagullFly{0%{transform:translateX(0) translateY(0)}25%{transform:translateX(-30px) translateY(-10px)}50%{transform:translateX(-60px) translateY(0)}75%{transform:translateX(-90px) translateY(-8px)}100%{transform:translateX(-120px) translateY(0)}}

.hero__chip{display:inline-block;padding:6px 16px;border:1px solid rgba(255,255,255,.3);border-radius:var(--r-pill);font-size:12px;letter-spacing:.16em;color:rgba(255,255,255,.85);margin-bottom:var(--space-6)}
.hero__title{font-size:clamp(36px,5.2vw,60px);font-weight:700;color:#fff;line-height:1.18;letter-spacing:-.02em;max-width:880px;margin:0 0 var(--space-6)}
.hero__sub{font-size:17px;color:rgba(255,255,255,.82);max-width:640px;margin:0 0 var(--space-8);line-height:1.7}
.hero__btns{display:flex;gap:var(--space-4);flex-wrap:wrap;justify-content:center}
.hero__btns .btn--ghost{color:#fff;border-color:rgba(255,255,255,.5)}
.hero__btns .btn--ghost:hover{background:#fff;color:var(--brand-deep)}

.hero__ctrl{position:absolute;top:50%;z-index:3;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.4);background:rgba(255,255,255,.1);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--t-fast);backdrop-filter:blur(8px)}
.hero__ctrl:hover{background:rgba(255,255,255,.2);border-color:#fff}
.hero__ctrl--prev{left:var(--space-6)}
.hero__ctrl--next{right:var(--space-6)}
.hero__dots{position:absolute;bottom:var(--space-12);left:50%;transform:translateX(-50%);z-index:3;display:flex;gap:8px}
.hero__dot{width:24px;height:3px;background:rgba(255,255,255,.3);border:none;cursor:pointer;transition:all var(--t-fast);border-radius:2px}
.hero__dot.is-on{background:#fff;width:36px}

/* 波浪 SVG 分隔：跨全宽 */
.wave-divider{position:relative;height:80px;background:var(--foam);overflow:hidden;margin-top:-1px}
.section--dark + .wave-divider{background:var(--brand-deep)}
.wave-divider svg{position:absolute;inset:0;width:100%;height:100%}
.wave-divider--top{transform:rotate(180deg)}

/* ============================================================
   业务卡 D：首卡放大 + 3 小卡
   ============================================================ */
.biz-d{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:var(--space-6);align-items:stretch}
.biz-d__first{grid-column:span 1;grid-row:span 1;background:var(--brand);color:#fff;padding:var(--space-12);position:relative;overflow:hidden;min-height:240px;display:flex;flex-direction:column;justify-content:space-between}
.biz-d__first::before{content:"";position:absolute;right:-40px;bottom:-40px;width:240px;height:240px;background:var(--wave-3);background-size:cover;opacity:.5;pointer-events:none}
.biz-d__first-no{font-size:13px;letter-spacing:.16em;color:var(--wood);font-weight:700;margin-bottom:var(--space-4)}
.biz-d__first h3{font-size:21px;color:#fff;margin-bottom:var(--space-3);line-height:1.3}
.biz-d__first p{font-size:13.5px;color:rgba(255,255,255,.78);margin-bottom:var(--space-5);max-width:none}
.biz-d__first-lnk{display:inline-flex;align-items:center;gap:6px;color:var(--wood);font-weight:600;font-size:14px;align-self:flex-start}
.biz-d__first-lnk:hover{color:#fff}
.biz-d__card{background:#fff;padding:var(--space-8);border:1px solid var(--mist);display:flex;flex-direction:column;gap:var(--space-4);min-height:300px;position:relative;transition:all var(--t)}
.biz-d__card:hover{border-color:var(--brand);box-shadow:var(--sh-md);transform:translateY(-4px)}
.biz-d__no{font-size:11px;letter-spacing:.16em;color:var(--text-light);font-weight:700}
.biz-d__ico{width:48px;height:48px;color:var(--brand);margin-bottom:var(--space-2)}
.biz-d__ico svg{width:100%;height:100%}
.biz-d__card h4{font-size:18px;font-weight:700;color:var(--ink)}
.biz-d__card p{font-size:14px;color:var(--text-soft);line-height:1.6;margin:0;flex:1}
.biz-d__lnk{font-size:13px;color:var(--brand);font-weight:600;display:inline-flex;align-items:center;gap:4px;align-self:flex-start;margin-top:auto}
.biz-d__lnk:hover{color:var(--wood)}

/* ============================================================
   信任条 C：品牌 logo 墙
   ============================================================ */
.logo-wall{padding:var(--space-16) 0;background:#fff;border-top:1px solid var(--mist);border-bottom:1px solid var(--mist)}
.logo-wall__t{text-align:center;font-size:14px;color:var(--text-light);letter-spacing:.16em;margin-bottom:var(--space-8)}
.logo-wall__grid{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--space-4)}
.logo-wall__cell{aspect-ratio:2/1;display:flex;align-items:center;justify-content:center;background:var(--foam);border:1px solid var(--mist);padding:var(--space-4);color:var(--text-light);font-size:14px;font-weight:600;transition:all var(--t-fast)}
.logo-wall__cell:hover{background:#fff;border-color:var(--brand);color:var(--brand)}

/* ============================================================
   流程 C：环形进度
   ============================================================ */
.ring-process{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-6)}
.ring-process__item{text-align:center;padding:var(--space-6)}
.ring-process__ring{width:160px;height:160px;margin:0 auto var(--space-4);position:relative}
.ring-process__ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.ring-process__track{fill:none;stroke:var(--mist);stroke-width:8}
.ring-process__arc{fill:none;stroke-width:8;stroke-linecap:round;transition:stroke-dasharray 1.4s var(--ease-out)}
.ring-process__arc--1{stroke:var(--brand)}
.ring-process__arc--2{stroke:var(--wood)}
.ring-process__arc--3{stroke:var(--accent)}
.ring-process__arc--4{stroke:var(--accent-deep)}
.ring-process__num{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:36px;font-weight:700;color:var(--ink)}
.ring-process__num sup{font-size:14px;color:var(--text-light);margin-left:2px}
.ring-process__name{font-size:16px;font-weight:700;color:var(--ink);margin-bottom:var(--space-2)}
.ring-process__desc{font-size:13px;color:var(--text-soft);line-height:1.6}

/* ============================================================
   资讯 B：左大图 + 右 2 列
   ============================================================ */
.news{display:grid;grid-template-columns:1.1fr 1fr;gap:var(--space-8)}
.news__feature{background:#fff;border:1px solid var(--mist);overflow:hidden;transition:all var(--t)}
.news__feature:hover{box-shadow:var(--sh-lg);transform:translateY(-2px)}
.news__feat__img{aspect-ratio:16/10;background:linear-gradient(135deg,var(--brand) 0%,var(--accent) 100%);position:relative;overflow:hidden}
.news__feat__img::after{content:"";position:absolute;left:0;right:0;bottom:0;height:60px;background:var(--wave-foam);background-size:cover}
.news__feat__cat{display:inline-block;margin:var(--space-4) var(--space-4) var(--space-2);padding:4px 10px;background:var(--brand-tint);color:var(--brand-deep);font-size:11px;font-weight:600;letter-spacing:.08em;border-radius:var(--r-sm)}
.news__feat__body{padding:var(--space-4) var(--space-4) var(--space-6)}
.news__feature h3{font-size:22px;font-weight:700;color:var(--ink);line-height:1.35;margin-bottom:var(--space-3)}
.news__feature h3:hover{color:var(--brand)}
.news__feature p{font-size:14px;color:var(--text-soft);line-height:1.7;margin-bottom:var(--space-4)}
.news__feature time{font-size:12px;color:var(--text-light)}
.news__sub{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4) var(--space-6)}
.news__sub__item{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-4);background:#fff;border:1px solid var(--mist);transition:all var(--t-fast)}
.news__sub__item:hover{border-color:var(--brand);transform:translateY(-2px)}
.news__sub__t{font-size:14px;font-weight:600;color:var(--ink);line-height:1.5}
.news__sub__item:hover .news__sub__t{color:var(--brand)}
.news__sub__item time{font-size:11px;color:var(--text-light)}

/* ============================================================
   案例 6 卡网格（涟漪 hover）
   ============================================================ */
.case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-6)}
.case-card{position:relative;background:#fff;border:1px solid var(--mist);overflow:hidden;display:block;color:inherit;transition:all var(--t)}
.case-card:hover{box-shadow:var(--sh-lg);transform:translateY(-4px);border-color:var(--brand)}
.case-card__cover{aspect-ratio:4/3;background:linear-gradient(135deg,var(--brand-tint) 0%,var(--brand-tint) 50%,var(--accent-tint) 100%);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}
.case-card__cover::before{content:"";position:absolute;inset:0;background:var(--wave-1);background-size:cover;background-position:bottom;opacity:.5;transform:translateY(20%)}
.case-card__cover::after{content:"";position:absolute;right:20px;bottom:20px;width:36px;height:36px;background:var(--brand);border-radius:50%;opacity:.7}
.case-card__cover svg{width:48px;height:48px;color:var(--brand);opacity:.8;position:relative;z-index:1}
.case-card__body{padding:var(--space-6)}
.case-card__ind{display:inline-block;padding:3px 10px;background:var(--accent-tint);color:var(--accent-deep);font-size:11px;font-weight:600;letter-spacing:.08em;margin-bottom:var(--space-3)}
.case-card h4{font-size:17px;font-weight:700;color:var(--ink);line-height:1.4}
.case-card:hover h4{color:var(--brand)}

/* 涟漪 */
.ripple{position:absolute;border-radius:50%;background:rgba(15,61,107,.18);transform:scale(0);animation:rippleAnim .65s ease-out;pointer-events:none}
@keyframes rippleAnim{to{transform:scale(2.6);opacity:0}}

/* ============================================================
   罗盘导航卡（业务方向）
   ============================================================ */
.compass{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-6)}
.compass__card{background:#fff;border:1px solid var(--mist);padding:var(--space-8);position:relative;transition:all var(--t);overflow:hidden}
.compass__card:hover{border-color:var(--brand);box-shadow:var(--sh-md)}
.compass__dir{position:absolute;top:var(--space-4);right:var(--space-4);font-size:14px;color:var(--wood);font-weight:700;letter-spacing:.08em}
.compass__needle{width:60px;height:60px;margin-bottom:var(--space-4);position:relative}
.compass__needle svg{width:100%;height:100%;animation:compassSpin 8s linear infinite}
@keyframes compassSpin{from{transform:rotate(0)}to{transform:rotate(360deg)}}
.compass__card h3{font-size:18px;font-weight:700;color:var(--ink);margin-bottom:var(--space-3)}
.compass__card p{font-size:13px;color:var(--text-soft);line-height:1.6;margin-bottom:var(--space-4)}
.compass__lnk{font-size:13px;color:var(--brand);font-weight:600}

/* ============================================================
   数字背书（4 大数字）
   ============================================================ */
.endorse{background:linear-gradient(135deg,var(--brand-deep) 0%,var(--brand) 100%);color:#fff;padding:var(--space-20) 0;position:relative;overflow:hidden}
.endorse::before{content:"";position:absolute;left:0;right:0;bottom:0;height:120px;background:var(--wave-1);background-size:cover;opacity:.18}
.endorse__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-8);text-align:center;position:relative;z-index:1}
.endorse__num{font-size:64px;font-weight:700;color:#fff;line-height:1;font-family:'Times New Roman',serif}
.stat-num{color:#fff !important;font-size:64px;font-weight:700;line-height:1;font-family:'Times New Roman',serif}
.endorse__num sup{font-size:24px;color:var(--wood);margin-left:4px;font-family:-apple-system,sans-serif}
.endorse__lbl{margin-top:var(--space-3);font-size:14px;color:rgba(255,255,255,.75);letter-spacing:.08em}

/* ============================================================
   CTA B：左右分栏
   ============================================================ */
.cta-band{padding:var(--space-16) var(--space-12);background:var(--foam);border:1px solid var(--mist);display:flex;align-items:center;justify-content:space-between;gap:var(--space-8);position:relative;overflow:hidden}
.cta-band::before{content:"";position:absolute;left:0;right:0;bottom:0;height:60px;background:var(--wave-2);background-size:cover;opacity:.25}
.cta-band__t{font-size:28px;font-weight:700;color:var(--ink);letter-spacing:-.02em;margin-bottom:var(--space-3);position:relative;z-index:1}
.cta-band__d{font-size:15px;color:var(--text-soft);line-height:1.7;max-width:520px;position:relative;z-index:1}
.cta-band .btn{position:relative;z-index:1;animation:ctaBreathe 4s var(--ease) infinite}
@keyframes ctaBreathe{0%,100%{box-shadow:var(--sh-md)}50%{box-shadow:var(--sh-glow),var(--sh-lg)}}

/* ============================================================
   页脚（浅底四列）
   ============================================================ */
.footer{background:var(--brand-tint);color:var(--text-soft);padding:var(--space-20) 0 var(--space-8)}
.footer__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:var(--space-12);margin-bottom:var(--space-12)}
.footer__brand{font-size:24px;font-weight:700;color:var(--brand-deep);margin-bottom:var(--space-4);display:flex;align-items:center;gap:var(--space-3)}
.footer__about{font-size:14px;line-height:1.7;color:var(--text-soft);max-width:340px}
.footer__col h4{font-size:15px;font-weight:700;color:var(--ink);margin-bottom:var(--space-4)}
.footer__col ul{list-style:none;margin:0;padding:0}
.footer__col li{margin-bottom:var(--space-3);font-size:14px}
.footer__col a{color:var(--text-soft)}
.footer__col a:hover{color:var(--wood)}
.footer-bottom{padding-top:var(--space-6);border-top:1px solid var(--mist);font-size:13px;color:var(--text-light);display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2)}
.footer-bottom a{display:inline;margin:0;color:var(--text-soft);text-decoration:none;transition:color var(--t-fast)}
.footer-bottom a:hover{color:var(--wood)}
.fb-sep{color:var(--mist);margin:0 4px}

/* ============================================================
   悬浮客服 zfkf
   ============================================================ */
.zfkf-float{position:fixed;right:var(--space-6);bottom:var(--space-12);z-index:40;display:flex;flex-direction:column;gap:8px}
.zfkf-btn{width:48px;height:48px;border-radius:50%;background:var(--brand);color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:var(--sh-md);transition:all var(--t-fast)}
.zfkf-btn:hover{background:var(--brand-deep);transform:translateY(-2px);box-shadow:var(--sh-lg)}
.zfkf-btn svg{width:22px;height:22px}
.zfkf-phone{background:var(--wood)}
.zfkf-phone:hover{background:var(--wood-deep)}
.zfkf-wechat-mask{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:60;display:none;align-items:center;justify-content:center}
.zfkf-wechat-mask.is-on{display:flex}
.zfkf-wechat-card{background:#fff;padding:var(--space-8);border-radius:var(--r-md);text-align:center;max-width:280px}
.zfkf-wechat-card h4{margin-bottom:var(--space-4);color:var(--ink)}
.zfkf-wechat-card svg{width:160px;height:160px;margin:0 auto var(--space-4);display:block}
.zfkf-wechat-close{margin-top:var(--space-4);padding:6px 16px;border:1px solid var(--mist);background:transparent;cursor:pointer;border-radius:var(--r-sm)}

/* ============================================================
   滚动入场
   ============================================================ */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease-out),transform .9s var(--ease-out)}
.reveal.is-on{opacity:1;transform:none}
.reveal[data-delay="1"]{transition-delay:.08s}
.reveal[data-delay="2"]{transition-delay:.16s}
.reveal[data-delay="3"]{transition-delay:.24s}
.reveal[data-delay="4"]{transition-delay:.32s}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  *{animation:none !important;transition:none !important}
}
html.no-js .reveal{opacity:1;transform:none}

/* ============================================================
   面包屑
   ============================================================ */
.crumb{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:13px;color:rgba(255,255,255,.7);margin-bottom:var(--space-6)}
.crumb a{color:rgba(255,255,255,.85)}
.crumb a:hover{color:#fff}
.crumb__sep{color:rgba(255,255,255,.4);margin:0 2px}
.crumb__cur{color:#fff;font-weight:600}

/* ============================================================
   内页通栏页头
   ============================================================ */
.page-header{background:linear-gradient(135deg,var(--brand-deep) 0%,var(--brand) 100%);color:#fff;padding:120px 0 var(--space-20);position:relative;overflow:hidden}
.page-header::after{content:"";position:absolute;left:0;right:0;bottom:0;height:80px;background:var(--wave-1);background-size:cover;opacity:.25}
.page-header__t{font-size:clamp(32px,4vw,48px);font-weight:700;color:#fff;margin:0 0 var(--space-3);position:relative;z-index:1}
.page-header__sub{font-size:16px;color:rgba(255,255,255,.78);max-width:680px;position:relative;z-index:1}

/* ============================================================
   表格/图片/pre 溢出防护
   ============================================================ */
.page-content table{display:block;max-width:100%;overflow-x:auto}
.page-content img{max-width:100%;height:auto}
.page-content pre{overflow-x:auto;background:var(--foam);padding:var(--space-4);border-radius:var(--r-md)}

/* ============================================================
   响应式
   ============================================================ */
@media (max-width:980px){
  .nav__list{display:none}
  .news{grid-template-columns:1fr}
  .news__sub{grid-template-columns:1fr 1fr}
  .ring-process,.compass,.endorse__grid,.case-grid{grid-template-columns:repeat(2,1fr)}
  .biz-d{grid-template-columns:repeat(2,1fr)}
  .logo-wall__grid{grid-template-columns:repeat(3,1fr)}
  .footer__grid{grid-template-columns:1fr 1fr}
  .cta-band{flex-direction:column;align-items:flex-start;text-align:left}
  .sec-head{flex-direction:column;align-items:flex-start}
  .sec-head__side{flex:none;width:100%;border-left:none;border-top:1px solid var(--mist);padding-left:0;padding-top:var(--space-4)}
  .section{padding:var(--space-20) 0}
}
@media (max-width:560px){
  .biz-d,.ring-process,.compass,.endorse__grid,.case-grid,.news__sub{grid-template-columns:1fr}
  .logo-wall__grid{grid-template-columns:repeat(2,1fr)}
  .footer__grid{grid-template-columns:1fr}
  .hero{min-height:480px;height:auto;padding:120px 0 var(--space-20)}
  .hero__title{font-size:32px}
  .hero__ctrl{display:none}
}

/* ===== tz-rich-text typography (auto-appended) ===== */
:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article)>:first-child{margin-top:0}
:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article)>:last-child{margin-bottom:0}
:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) p{margin:0 0 1.05em;line-height:1.9}
:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) h1,:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) h2{margin:1.6em 0 .7em;line-height:1.4;font-weight:700}
:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) h1{font-size:1.6em}
:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) h2{font-size:1.4em}
:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) h3{margin:1.4em 0 .6em;font-size:1.2em;line-height:1.45;font-weight:700}
:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) h4{margin:1.2em 0 .5em;font-size:1.08em;font-weight:700}
:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) h5,:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) h6{margin:1.1em 0 .5em;font-size:1em;font-weight:700}
:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) ul,:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) ol{margin:0 0 1.05em;padding-left:1.7em}
:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) li{margin:.35em 0;line-height:1.8}
:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) img{max-width:100%;height:auto;border-radius:8px}
:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) figure{margin:1.2em 0}
:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) figcaption{margin-top:.5em;font-size:.85em;opacity:.7;text-align:center}
:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) blockquote{margin:1.2em 0;padding:.2em 0 .2em 1em;border-left:3px solid currentColor;opacity:.85}
:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) table{width:100%;border-collapse:collapse;margin:1.2em 0;font-size:.96em}
:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) th,:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) td{border:1px solid rgba(127,127,127,.3);padding:.5em .75em;text-align:left}
:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) th{font-weight:700;background:rgba(127,127,127,.06)}
:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) hr{margin:1.6em 0;border:0;border-top:1px solid rgba(127,127,127,.28)}
:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) pre{overflow:auto;padding:.8em 1em;border-radius:8px;background:rgba(127,127,127,.1);font-size:.92em}
:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) code{font-size:.94em}
:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) strong,:where(.rich-text,.detail__content,.detail-content,.article-body,.article-content,.article__body,.article--body,.rich-content,.prose,.detail-body,.detail-body__content,.page-content,.content-card,.hd-article-body,.lf-article-body,.cq-article-body,.sq-article-body,.lh-article) b{font-weight:700}
:where(.rich-text) ul{list-style:disc}
:where(.rich-text) ol{list-style:decimal}
:where(.rich-text) a{text-decoration:underline;text-underline-offset:3px}

/* ===== tz-footer-legal (auto-appended) ===== */
.zf-legal-line a{color:inherit;text-decoration:none;opacity:.92}
.zf-legal-line a:hover{opacity:1;text-decoration:underline;text-underline-offset:3px}
.zf-legal-line .zf-legal-all{font-weight:600}
.zf-legal-line .zf-legal-copy{opacity:.95}
.zf-legal-line .zf-legal-addr{opacity:.82}
.zf-legal-line .zf-legal-police{text-decoration:none}
@media (max-width:640px){.zf-legal-line{column-gap:.55em;line-height:1.7}}
