/* ============================================================
   周升网络 zhousheng88.com · E 组页面专属样式（关于/资讯分类/联系转化 11 页）
   依赖 style.css 设计令牌，禁止修改全局样式
   ------------------------------------------------------------
   分节：
   00 通用（页头 Hero 底图 / 表单轻提示 Toast / 正文 CTA 小条）
   01 about.html   叙事长页：发展历程时间轴 + 团队错位卡 + 价值观印章
   02 contact.html 联系信息大卡 + 留言表单 + 双城到访指引
   03 consult.html 需求表单引导 + 三步流程 + FAQ 折叠
   04 join.html    合作模式卡 + 权益对比表 + 申请表
   05 honor.html   荣誉墙网格 + 证书列表 + 客户证言大引言
   06 sitemap.html 分类目录树
   07 news-company  图文横排列表
   08 news-industry 纯文纵列（杂志日期大字）
   09 news-guide    杂志不对称网格（主卡+侧栏）
   10 news-seo      紧凑小卡网格（瀑布观感）
   11 news-design   大引言左栏 + 设计纵列
   12 响应式收尾
   ============================================================ */

/* ---------- 00 通用 ---------- */
/* 各页 Hero 底图（2.4:1 横幅图做背景，文字压暗叠层已由 .page-hero::before 处理） */
.ph-about{background-image:url('../images/banner-main.jpg')}
.ph-contact{background-image:url('../images/banner-contact.jpg')}
.ph-consult{background-image:url('../images/tea-meeting.jpg')}
.ph-join{background-image:url('../images/handshake.jpg')}
.ph-honor{background-image:url('../images/award-cert.jpg')}
.ph-sitemap{background-image:url('../images/banner-news.jpg')}
.ph-newscompany{background-image:url('../images/banner-news.jpg')}
.ph-newsindustry{background-image:url('../images/banner-industry.jpg')}
.ph-newsguide{background-image:url('../images/sketch-note.jpg')}
.ph-newsseo{background-image:url('../images/data-analytics.jpg')}
.ph-newsdesign{background-image:url('../images/team-design.jpg')}

/* 页头内小装饰：竖排印章句 */
.ph-vert{
  position:absolute;right:40px;top:118px;writing-mode:vertical-rl;
  font-family:var(--font-h);letter-spacing:10px;font-size:14px;color:rgba(244,233,211,.5);
  border-right:1px solid rgba(176,141,87,.5);padding-right:12px;z-index:2;
}

/* 正文内嵌 CTA 条（区别于通用 .cta-band，做卷轴式横幅） */
.inline-cta{
  position:relative;margin:20px 0 0;padding:30px 34px;
  background:linear-gradient(100deg,var(--cream),#EFE2C6);
  border-left:5px solid var(--rosewood);
  box-shadow:var(--shadow-1);
  display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap;
}
.inline-cta h3{font-size:20px;letter-spacing:2px;margin-bottom:6px}
.inline-cta p{font-size:13px;color:var(--ink-soft)}
.inline-cta .ict-tel{font-family:var(--font-h);font-size:26px;color:var(--rosewood);letter-spacing:1px}
.inline-cta::after{
  content:"印";position:absolute;right:18px;bottom:-14px;width:44px;height:44px;
  background:var(--rosewood);color:var(--cream-light);font-family:var(--font-h);
  display:flex;align-items:center;justify-content:center;font-size:16px;transform:rotate(-6deg);
  box-shadow:var(--shadow-1);
}

/* 表单轻提示 Toast */
.form-toast{
  position:fixed;left:50%;bottom:46px;transform:translate(-50%,20px);
  background:var(--ink);color:var(--cream-light);border:1px solid var(--gold);
  padding:13px 26px;font-size:14px;letter-spacing:2px;z-index:120;
  opacity:0;visibility:hidden;transition:var(--t-mid);box-shadow:var(--shadow-2);
}
.form-toast.show{opacity:1;visibility:visible;transform:translate(-50%,0)}

/* 资讯分类页共用的分类标签条 */
.cat-bar{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:34px}
.cat-bar a{
  padding:7px 18px;font-size:13px;letter-spacing:2px;border:1px solid var(--cream-deep);
  background:var(--cream-light);color:var(--ink-soft);transition:var(--t-fast);
}
.cat-bar a:hover{border-color:var(--rosewood);color:var(--rosewood)}
.cat-bar a.is-on{background:var(--rosewood);border-color:var(--rosewood);color:var(--cream-light)}

/* 文章卡片里共用的日期与摘要 */
.art-date{font-family:var(--font-h);color:var(--rosewood);font-size:13px;letter-spacing:2px}
.art-more{
  display:inline-flex;align-items:center;gap:6px;color:var(--rosewood);
  font-size:13px;letter-spacing:1px;margin-top:10px;
}
.art-more svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2}

/* ---------- 01 about.html 叙事长页 ---------- */
/* 公司介绍：左图右文 + 竖排 */
.ab-intro{display:grid;grid-template-columns:1.05fr 1fr;gap:46px;align-items:center}
.ab-intro .ab-img{position:relative}
.ab-intro .ab-img img{width:100%;height:auto}
.ab-intro .ab-img::after{
  content:"";position:absolute;right:-14px;bottom:-14px;width:70%;height:70%;
  border:1px solid var(--gold);z-index:-1;
}
.ab-intro h2{font-size:30px;letter-spacing:3px;margin-bottom:18px}
.ab-intro p{color:var(--ink-soft);margin-bottom:14px}
.ab-mark{
  writing-mode:vertical-rl;font-family:var(--font-h);color:var(--gold);
  letter-spacing:8px;font-size:13px;border-right:1px solid var(--cream-deep);padding-right:10px;
}

/* 发展历程时间轴（纵向中线，左右交错节点） */
.timeline{position:relative;margin:20px 0 0;padding-left:0}
.timeline::before{
  content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;
  background:linear-gradient(var(--rosewood),var(--gold));transform:translateX(-50%);
}
.tl-item{position:relative;width:50%;padding:0 38px 44px 0}
.tl-item:nth-child(even){margin-left:50%;padding:0 0 44px 38px}
.tl-node{
  position:absolute;top:4px;right:-9px;width:18px;height:18px;border-radius:50%;
  background:var(--cream-light);border:3px solid var(--rosewood);
}
.tl-item:nth-child(even) .tl-node{right:auto;left:-9px}
.tl-year{font-family:var(--font-h);font-size:24px;color:var(--rosewood);letter-spacing:2px}
.tl-item h3{font-size:17px;margin:6px 0 8px;letter-spacing:1px}
.tl-item p{font-size:13.5px;color:var(--ink-soft);line-height:1.8}

/* 团队错位卡 */
.team-offset{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.tm-card{background:var(--cream-light);border:1px solid var(--cream-deep);padding:0;overflow:hidden;box-shadow:var(--shadow-1)}
.tm-card:nth-child(2){transform:translateY(26px)}
.tm-card img{width:100%;height:220px;object-fit:cover}
.tm-card .tm-body{padding:20px 22px 24px}
.tm-card .tm-role{font-size:12px;letter-spacing:3px;color:var(--gold)}
.tm-card h3{font-size:18px;margin:6px 0 8px}
.tm-card p{font-size:13px;color:var(--ink-soft)}

/* 价值观印章行 */
.values-row{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.val-cell{
  text-align:center;padding:30px 16px;border:1px solid var(--cream-deep);
  background:var(--cream-light);position:relative;
}
.val-cell .val-seal{
  width:64px;height:64px;margin:0 auto 14px;border:2px solid var(--rosewood);color:var(--rosewood);
  font-family:var(--font-h);font-size:22px;display:flex;align-items:center;justify-content:center;
}
.val-cell h3{font-size:17px;letter-spacing:4px;margin-bottom:8px}
.val-cell p{font-size:13px;color:var(--ink-soft)}

/* ---------- 02 contact.html 联系信息大卡 ---------- */
.cinfo-big{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.cb-card{
  background:var(--cream-light);border:1px solid var(--cream-deep);padding:34px 28px;
  text-align:center;position:relative;box-shadow:var(--shadow-1);
}
.cb-card::before{
  content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--rosewood);
}
.cb-card svg{width:34px;height:34px;stroke:var(--rosewood);fill:none;stroke-width:1.5;margin:0 auto 14px}
.cb-card h3{font-size:16px;letter-spacing:3px;color:var(--ink-soft);margin-bottom:10px}
.cb-card .cb-main{font-family:var(--font-h);font-size:26px;color:var(--rosewood);letter-spacing:1px;word-break:break-all}
.cb-card p{font-size:13px;color:var(--ink-mute);margin-top:10px}

/* 双栏：表单 + 侧栏联系条 */
.ct-wrap{display:grid;grid-template-columns:1.6fr 1fr;gap:34px;align-items:start}
.ct-formbox{background:var(--cream-light);border:1px solid var(--cream-deep);padding:34px 32px;box-shadow:var(--shadow-1)}
.ct-side{display:flex;flex-direction:column;gap:18px}
.ct-side .notice{margin:0}

/* 到访指引（两城，上下交错） */
.visit-row{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.visit-card{position:relative;border:1px solid var(--cream-deep);background:var(--cream-light)}
.visit-card img{width:100%;height:220px;object-fit:cover}
.visit-card .vc-body{padding:22px 24px 26px}
.visit-card .vc-city{font-size:12px;letter-spacing:4px;color:var(--gold)}
.visit-card h3{font-size:20px;margin:6px 0 10px;letter-spacing:2px}
.visit-card ul li{font-size:13.5px;color:var(--ink-soft);padding:5px 0 5px 18px;position:relative}
.visit-card ul li::before{content:"";position:absolute;left:0;top:12px;width:6px;height:6px;background:var(--rosewood);transform:rotate(45deg)}

/* ---------- 03 consult.html 三步流程 + FAQ ---------- */
.flow3{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;counter-reset:step}
.fl-card{position:relative;background:var(--ink);color:var(--cream-light);padding:38px 28px 30px;overflow:hidden}
.fl-card::before{
  content:"";position:absolute;right:-26px;top:-26px;width:110px;height:110px;
  border:1px solid rgba(176,141,87,.4);border-radius:50%;
}
.fl-no{font-family:var(--font-h);font-size:44px;color:var(--gold);line-height:1;margin-bottom:14px}
.fl-card h3{font-size:19px;letter-spacing:3px;margin-bottom:10px}
.fl-card p{font-size:13.5px;color:rgba(244,233,211,.75);line-height:1.9}

/* FAQ 折叠（details 原生） */
.faq-list{border-top:1px solid var(--cream-deep)}
.faq-list details{border-bottom:1px solid var(--cream-deep)}
.faq-list summary{
  cursor:pointer;list-style:none;padding:18px 8px;display:flex;justify-content:space-between;
  align-items:center;font-family:var(--font-h);font-size:16px;letter-spacing:1px;color:var(--ink);
}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:"+";font-size:22px;color:var(--rosewood);transition:transform var(--t-fast)}
.faq-list details[open] summary::after{transform:rotate(45deg)}
.faq-list details p{padding:0 8px 20px;color:var(--ink-soft);font-size:14px;line-height:1.9}

/* ---------- 04 join.html 权益对比 ---------- */
.jm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.jm-card{border:1px solid var(--cream-deep);background:var(--cream-light);padding:32px 26px;position:relative}
.jm-card.is-hot{border-top:4px solid var(--rosewood)}
.jm-card .jm-tag{
  position:absolute;top:14px;right:14px;font-size:11px;letter-spacing:2px;
  background:var(--rosewood);color:var(--cream-light);padding:3px 10px;
}
.jm-card h3{font-size:19px;letter-spacing:2px;margin-bottom:6px}
.jm-card .jm-en{font-size:11px;letter-spacing:3px;color:var(--ink-mute);text-transform:uppercase;margin-bottom:16px}
.jm-card .list-dot{margin-top:8px}

/* ---------- 05 honor.html 荣誉墙 + 证言 ---------- */
.honor-wall{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.hw-cell{
  border:1px solid var(--cream-deep);background:var(--cream-light);padding:30px 24px;
  position:relative;text-align:center;box-shadow:var(--shadow-1);
}
.hw-cell:nth-child(odd){transform:translateY(16px)}
.hw-cell .hw-seal{
  width:52px;height:52px;margin:0 auto 14px;border:2px solid var(--gold);color:var(--gold);
  display:flex;align-items:center;justify-content:center;font-family:var(--font-h);font-size:18px;
}
.hw-cell h3{font-size:16px;letter-spacing:1px;margin-bottom:8px}
.hw-cell p{font-size:12.5px;color:var(--ink-mute)}

/* 证书清单（纵向列表，左侧年份） */
.cert-list{border:1px solid var(--cream-deep);background:var(--cream-light)}
.cert-row{
  display:grid;grid-template-columns:120px 1fr auto;gap:20px;align-items:center;
  padding:18px 24px;border-bottom:1px dashed var(--cream-deep);
}
.cert-row:last-child{border-bottom:0}
.cert-row .cr-year{font-family:var(--font-h);font-size:20px;color:var(--rosewood)}
.cert-row h3{font-size:15.5px;letter-spacing:1px}
.cert-row p{font-size:12.5px;color:var(--ink-mute);margin-top:3px}

/* 客户证言大引言 */
.quote-feature{
  background:linear-gradient(120deg,var(--rosewood-dark),var(--rosewood-deep));
  color:var(--cream-light);padding:56px 54px;position:relative;overflow:hidden;
}
.quote-feature::before{
  content:"“";position:absolute;left:20px;top:-30px;font-family:var(--font-h);
  font-size:160px;color:rgba(244,233,211,.12);
}
.quote-feature blockquote{font-family:var(--font-h);font-size:21px;line-height:2;letter-spacing:1px;position:relative;z-index:2}
.quote-feature .q-from{margin-top:20px;font-size:13px;color:var(--gold);letter-spacing:2px}

/* ---------- 06 sitemap.html 目录树 ---------- */
.sm-group{margin-bottom:36px}
.sm-group h3{
  font-size:19px;letter-spacing:3px;padding:12px 18px;background:var(--ink);color:var(--cream-light);
  display:flex;align-items:center;gap:12px;
}
.sm-group h3 small{font-size:11px;letter-spacing:3px;color:var(--gold);text-transform:uppercase;font-family:var(--font-b)}
.sm-links{
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid var(--cream-deep);border-top:0;
  background:var(--cream-light);
}
.sm-links a{
  padding:12px 18px;font-size:14px;color:var(--ink-soft);border-right:1px solid var(--cream-deep);
  border-bottom:1px solid var(--cream-deep);position:relative;transition:var(--t-fast);
}
.sm-links a:nth-child(3n){border-right:0}
.sm-links a::before{content:"·";color:var(--rosewood);margin-right:8px;font-weight:700}
.sm-links a:hover{color:var(--rosewood);background:var(--cream);padding-left:24px}

/* ---------- 07 news-company 图文横排 ---------- */
.nh-list{display:flex;flex-direction:column;gap:26px}
.nh-row{
  display:grid;grid-template-columns:340px 1fr;gap:28px;background:var(--cream-light);
  border:1px solid var(--cream-deep);box-shadow:var(--shadow-1);transition:var(--t-fast);
}
.nh-row:hover{box-shadow:var(--shadow-2)}
.nh-row img{width:100%;height:100%;min-height:200px;object-fit:cover}
.nh-row .nh-body{padding:24px 28px 24px 0;align-self:center}
.nh-row:nth-child(even){grid-template-columns:1fr 340px}
.nh-row:nth-child(even) .nh-body{padding:24px 0 24px 28px;order:1}
.nh-row:nth-child(even) img{order:2}
.nh-row h3{font-size:19px;margin:8px 0 10px;letter-spacing:1px}
.nh-row h3 a:hover{color:var(--rosewood)}
.nh-row p{font-size:13.5px;color:var(--ink-soft);line-height:1.85}

/* ---------- 08 news-industry 纯文纵列 ---------- */
.ni-list{border-top:2px solid var(--ink)}
.ni-row{
  display:grid;grid-template-columns:130px 1fr;gap:26px;padding:26px 6px;
  border-bottom:1px solid var(--cream-deep);align-items:baseline;
}
.ni-row .ni-date{font-family:var(--font-h);font-size:22px;color:var(--rosewood);line-height:1.2}
.ni-row .ni-date small{display:block;font-size:11px;letter-spacing:3px;color:var(--ink-mute);font-family:var(--font-b)}
.ni-row h3{font-size:18px;margin-bottom:8px}
.ni-row h3 a:hover{color:var(--rosewood)}
.ni-row p{font-size:13.5px;color:var(--ink-soft);line-height:1.8}

/* ---------- 09 news-guide 杂志网格 ---------- */
.ng-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:24px}
.ng-feature{
  position:relative;min-height:380px;display:flex;align-items:flex-end;color:var(--cream-light);
  background-size:cover;background-position:center;
}
.ng-feature::before{content:"";position:absolute;inset:0;background:linear-gradient(transparent 30%,rgba(33,26,21,.88))}
.ng-feature .ngf-body{position:relative;z-index:2;padding:28px}
.ng-feature h3{font-size:23px;margin:8px 0;letter-spacing:1px}
.ng-feature h3 a{color:var(--cream-light)}
.ng-feature p{font-size:13px;color:rgba(244,233,211,.8);max-width:90%}
.ng-side{display:flex;flex-direction:column;gap:20px}
.ng-mini{display:grid;grid-template-columns:110px 1fr;gap:16px;align-items:center}
.ng-mini img{width:110px;height:80px;object-fit:cover;border:1px solid var(--cream-deep)}
.ng-mini h3{font-size:15px;line-height:1.5}
.ng-mini h3 a:hover{color:var(--rosewood)}
.ng-mini p{font-size:12px;color:var(--ink-mute);margin-top:4px}
.ng-rest{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:24px}
.ng-cell{background:var(--cream-light);border:1px solid var(--cream-deep);padding:20px}
.ng-cell h3{font-size:15px;margin:6px 0}
.ng-cell p{font-size:12.5px;color:var(--ink-soft)}

/* ---------- 10 news-seo 紧凑小卡 ---------- */
.ns-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.ns-card{background:var(--cream-light);border:1px solid var(--cream-deep);overflow:hidden;box-shadow:var(--shadow-1)}
.ns-card img{width:100%;height:150px;object-fit:cover}
.ns-card .ns-body{padding:18px 20px 20px}
.ns-card .ns-tags{margin-bottom:10px}
.ns-card h3{font-size:15.5px;line-height:1.55;margin-bottom:8px}
.ns-card h3 a:hover{color:var(--rosewood)}
.ns-card p{font-size:12.5px;color:var(--ink-soft);line-height:1.75}

/* ---------- 11 news-design 左引言右纵列 ---------- */
.nd-wrap{display:grid;grid-template-columns:1fr 1.7fr;gap:40px;align-items:start}
.nd-quote{
  position:sticky;top:90px;background:var(--ink);color:var(--cream-light);padding:40px 34px;
}
.nd-quote .ndq-seal{
  width:56px;height:56px;border:2px solid var(--gold);color:var(--gold);
  display:flex;align-items:center;justify-content:center;font-family:var(--font-h);font-size:20px;margin-bottom:20px;
}
.nd-quote blockquote{font-family:var(--font-h);font-size:19px;line-height:2;letter-spacing:1px}
.nd-quote p{font-size:12.5px;color:rgba(244,233,211,.6);margin-top:16px;line-height:1.9}
.nd-list{display:flex;flex-direction:column}
.nd-row{display:grid;grid-template-columns:74px 1fr;gap:20px;padding:24px 0;border-bottom:1px solid var(--cream-deep)}
.nd-row .nd-no{font-family:var(--font-h);font-size:34px;color:var(--cream-deep);line-height:1}
.nd-row h3{font-size:17.5px;margin-bottom:8px}
.nd-row h3 a:hover{color:var(--rosewood)}
.nd-row p{font-size:13.5px;color:var(--ink-soft);line-height:1.85}

/* ---------- 13 通用微调工具类（替代页面内联样式，样式一律外置） ---------- */
.mt-14{margin-top:14px}.mt-18{margin-top:18px}.mt-20{margin-top:20px}.mt-22{margin-top:22px}.mt-26{margin-top:26px}.mt-30{margin-top:30px}.mt-36{margin-top:36px}
.mb-18{margin-bottom:18px}
.flex-wrap{display:flex;gap:12px;flex-wrap:wrap}
.p-soft{color:var(--ink-soft);margin-top:14px}
.p-soft-sm{font-size:13.5px;color:var(--ink-soft)}
.notice--gold{border-left-color:var(--gold);background:var(--cream)}
.notice--cream{background:var(--cream)}
.th-w26{width:26%}
.sec-head--mt{margin-bottom:26px}
.trust-num>span{font-size:22px}
.q-hl{color:var(--gold)}
.q-mini .quote-feature{padding:36px 34px}
.q-mini .quote-feature blockquote{font-size:17px}
.fl-link{color:var(--gold)}
.ngf-bg{background-image:url('../images/sketch-note.jpg')}
.art-more--light{color:var(--cream-light)}

/* ---------- 12 响应式收尾 ---------- */
@media (max-width:1024px){
  .ph-vert{display:none}
  .ab-intro{grid-template-columns:1fr;gap:30px}
  .team-offset{grid-template-columns:repeat(2,1fr)}
  .team-offset .tm-card:nth-child(2){transform:none}
  .values-row{grid-template-columns:repeat(2,1fr)}
  .cinfo-big{grid-template-columns:1fr 1fr}
  .ct-wrap{grid-template-columns:1fr}
  .visit-row{grid-template-columns:1fr}
  .flow3{grid-template-columns:1fr}
  .jm-grid{grid-template-columns:1fr}
  .honor-wall{grid-template-columns:repeat(2,1fr)}
  .honor-wall .hw-cell:nth-child(odd){transform:none}
  .sm-links{grid-template-columns:repeat(2,1fr)}
  .sm-links a:nth-child(3n){border-right:1px solid var(--cream-deep)}
  .sm-links a:nth-child(2n){border-right:0}
  .nh-row,.nh-row:nth-child(even){grid-template-columns:1fr}
  .nh-row .nh-body,.nh-row:nth-child(even) .nh-body{padding:22px}
  .nh-row img{min-height:220px}
  .ng-grid{grid-template-columns:1fr}
  .ng-rest{grid-template-columns:1fr 1fr}
  .ns-grid{grid-template-columns:1fr 1fr}
  .nd-wrap{grid-template-columns:1fr}
  .nd-quote{position:static}
}
@media (max-width:640px){
  .timeline::before{left:9px}
  .tl-item,.tl-item:nth-child(even){width:100%;margin-left:0;padding:0 0 36px 34px}
  .tl-node,.tl-item:nth-child(even) .tl-node{left:0;right:auto}
  .team-offset,.values-row,.cinfo-big,.honor-wall{grid-template-columns:1fr}
  .sm-links,.ng-rest,.ns-grid{grid-template-columns:1fr}
  .sm-links a{border-right:0}
  .ni-row{grid-template-columns:1fr;gap:8px}
  .cert-row{grid-template-columns:1fr;gap:4px}
  .quote-feature{padding:36px 26px}
  .quote-feature blockquote{font-size:17px}
  .inline-cta{padding:24px 20px}
  .inline-cta .ict-tel{font-size:22px}
}