/* ==========================================================================
   about-zizhi.html · 资质荣誉 — F9 印章矩阵
   设计：宣纸证书卡片矩阵 + 朱砂圆印 + 场景图文 + 承诺清单 + 锦旗故事 + CTA
   命名空间：zz-
   ========================================================================== */

/* ===== ① Banner ===== */
.zz-hero{position:relative;height:min(54vh,460px);min-height:340px;display:flex;align-items:flex-end;overflow:hidden}
.zz-hero .hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.zz-hero .mask-ink{background:linear-gradient(180deg,rgba(29,52,38,.22),rgba(29,52,38,.6) 80%)}
.zz-hero-inner{position:relative;z-index:2;color:#F7F5EE;padding-block:44px 54px}
.zz-hero-inner h1{color:#FCFBF7;font-size:clamp(26px,3.8vw,44px);letter-spacing:.06em;margin-top:14px}
.zz-hero-inner .sub{max-width:620px;margin-top:14px;color:rgba(247,245,238,.88);line-height:1.9}

/* ===== ② 资质总述 ===== */
.zz-intro-box{max-width:760px}
.zz-intro-desc{margin-inline:auto}
/* 共享环形文字路径定义：零尺寸隐藏层 */
.zz-defs{position:absolute}
.zz-intro{background:var(--moon-50);text-align:center}

/* ===== ③ 印章证书矩阵 ===== */
.zz-matrix{background:
  radial-gradient(700px 300px at 100% 0%,rgba(192,47,43,.05),transparent 60%),
  var(--moon-100);}
.zz-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.zz-paper{
  background:#FFFCF4;border:1px solid var(--line-soft);border-radius:14px;
  padding:34px 24px 26px;text-align:center;position:relative;height:100%;
  box-shadow:var(--shadow-soft);transition:transform .3s ease,box-shadow .3s ease;
}
.zz-paper::before,.zz-paper::after{
  content:"";position:absolute;left:12px;right:12px;height:1px;background:var(--line);
}
.zz-paper::before{top:10px}
.zz-paper::after{bottom:10px}
.zz-cert:hover .zz-paper{transform:translateY(-6px) rotate(-.6deg);box-shadow:var(--shadow-lift)}
.zz-seal{width:92px;height:92px;margin:0 auto}
.zz-seal circle{stroke-width:2.5}
.zz-paper h3{font-size:17.5px;margin-top:16px;line-height:1.55;letter-spacing:.02em}
.zz-from{margin-top:10px;font-size:13px;color:var(--ink-500)}
.zz-year{
  display:inline-block;margin-top:14px;font-size:12.5px;color:var(--cinnabar-600);
  border-top:1px solid rgba(192,47,43,.3);padding-top:10px;letter-spacing:.08em;
}

/* ===== ④ 场景图文 ===== */
.zz-scene{background:var(--moon-50)}
.zz-scene-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(30px,5vw,64px);align-items:center}
.zz-scene-fig img{border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);aspect-ratio:4/3;object-fit:cover}
.zz-scene-fig figcaption{margin-top:12px;font-size:13.5px;color:var(--ink-500);padding-left:12px;border-left:3px solid var(--bamboo-500)}
.zz-p{margin-top:14px;color:var(--ink-700);font-size:15px;line-height:2.05}
.zz-p strong{color:var(--bamboo-700)}

/* ===== ⑤ 承诺清单 ===== */
.zz-promise{background:var(--moon-100)}
.zz-promise-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:44px}
.zz-promise-grid div{
  background:#fff;border-radius:var(--radius);padding:28px 22px;
  border-top:3px solid var(--cinnabar-500);box-shadow:var(--shadow-soft);
}
.zz-promise-grid b{font-family:var(--serif);font-size:18px;color:var(--ink-900);letter-spacing:.05em}
.zz-promise-grid p{margin-top:10px;font-size:13.5px;color:var(--ink-500);line-height:1.9}

/* ===== ⑥ 锦旗故事 ===== */
.zz-story{background:linear-gradient(120deg,var(--bamboo-900),var(--bamboo-700))}
.zz-story-inner{display:flex;gap:36px;align-items:flex-start;color:var(--moon-100)}
.zz-story-seal{color:var(--cinnabar-400);font-size:17px;flex-shrink:0;padding-block:6px}
.zz-story-inner h2{color:#FCFBF7;font-size:clamp(22px,2.8vw,30px);letter-spacing:.04em}
.zz-story-inner .zz-p{color:rgba(247,245,238,.82)}
.zz-story-inner strong{color:#F3D9A4}

/* ===== ⑦ CTA ===== */
.zz-cta{text-align:center;background:var(--moon-50)}
.zz-cta-inner{padding-block:clamp(52px,7vw,84px)}
.zz-cta-inner h2{font-size:clamp(24px,3.2vw,38px)}
.zz-cta-inner p{max-width:560px;margin:16px auto 28px;color:var(--ink-500);line-height:2}
.zz-cta-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:14px}

/* ===== 响应式 ===== */
@media (max-width:1080px){
  .zz-grid{grid-template-columns:repeat(2,1fr)}
  .zz-promise-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:920px){
  .zz-scene-grid{grid-template-columns:1fr}
  .zz-story-inner{flex-direction:row}
}
@media (max-width:640px){
  .zz-grid{grid-template-columns:1fr}
  .zz-promise-grid{grid-template-columns:1fr}
  .zz-story-inner{flex-direction:column;gap:18px}
  .zz-story-seal{writing-mode:horizontal-tb;letter-spacing:.2em}
}
