/* ============================================================
   rrmt.cn 资讯详情页专属样式（show.html）
   注：本页使用 <base href="/">，全部资源与链接为根绝对路径
   ============================================================ */

.detail-main{background:var(--mix-bg)}
.detail-layout{display:grid;grid-template-columns:1fr 320px;gap:40px;align-items:start}

/* ---------- 文章主体 ---------- */
.detail-body{
  background:#fff;border:1px solid var(--line);
  border-radius:var(--r-lg) var(--r-sm) var(--r-lg) var(--r-sm);
  box-shadow:var(--shadow);padding:40px 44px;
}
.article-head{border-bottom:2px solid var(--line);padding-bottom:20px;margin-bottom:26px}
.article-head h1{font-size:clamp(1.5rem,2.6vw,2rem);font-weight:800;line-height:1.45;margin-bottom:14px}
.article-meta{display:flex;flex-wrap:wrap;gap:22px;color:var(--ink-3);font-size:.86rem}
.article-body{line-height:1.95;color:var(--ink)}
.article-body img{
  width:100%;max-width:800px;height:auto;border-radius:var(--r-md);
  margin:0 auto 22px;display:block;box-shadow:var(--shadow);
}
.article-body p{margin-bottom:18px}
.article-body h2,.article-body h3{margin:26px 0 12px;font-weight:700}
.article-body h2{font-size:1.3rem}
.article-body h3{font-size:1.12rem}
.article-body blockquote{
  border-left:4px solid var(--blue);background:var(--blue-bg);
  padding:14px 18px;border-radius:var(--r-sm);margin:18px 0;color:var(--ink-2);
}
.article-body ul,.article-body ol{padding-left:1.4em;margin:14px 0}
.article-body li{margin-bottom:8px}

/* ---------- 相关阅读区（五组模板循环，无小标题） ---------- */
.rel-zone{margin-top:44px;border-top:2px solid var(--line);padding-top:30px}
.rel-related{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:34px}
.rel-card{
  display:flex;flex-direction:column;gap:12px;
  border:1px solid var(--line);border-radius:var(--r-md) var(--r-sm) var(--r-md) var(--r-sm);
  padding:14px;background:#fff;box-shadow:var(--shadow);
  transition:transform .3s,box-shadow .3s;
}
.rel-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-2)}
.rel-card img{width:100%;height:130px;object-fit:cover;border-radius:10px}
.rel-card h4{font-size:.94rem;font-weight:600;line-height:1.5}
.rel-card time{font-size:.78rem;color:var(--ink-3)}

.rel-latest{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:34px}
.rel-mini{
  display:flex;gap:10px;align-items:center;padding:10px;
  border:1px solid var(--line);border-radius:var(--r-sm);background:var(--blue-bg);
  transition:transform .3s,box-shadow .3s;
}
.rel-mini:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.rel-mini img{width:84px;height:60px;object-fit:cover;border-radius:8px;flex-shrink:0}
.rel-mini h4{font-size:.86rem;font-weight:600;line-height:1.45}
.rel-mini time{font-size:.74rem;color:var(--ink-3);display:block;margin-top:4px}

.rel-week,.rel-day,.rel-month{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.rel-line{
  display:flex;gap:10px;align-items:center;padding:10px;
  border:1px solid var(--line);border-radius:var(--r-sm);background:#fff;
  transition:transform .3s,box-shadow .3s;
}
.rel-line:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.rel-line img{width:84px;height:60px;object-fit:cover;border-radius:8px;flex-shrink:0}
.rel-line h4{font-size:.86rem;font-weight:600;line-height:1.45}
.rel-line time{font-size:.74rem;color:var(--ink-3);display:block;margin-top:4px}
.rel-week{border-top:3px solid var(--blue);padding-top:18px}
.rel-day{border-top:3px dashed var(--blue-2);padding-top:18px}
.rel-month{border-top:3px dotted var(--purple);padding-top:18px}

/* ---------- 侧栏 ---------- */
.detail-side{display:flex;flex-direction:column;gap:22px;position:sticky;top:96px}
.side-card{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-md) var(--r-sm) var(--r-md) var(--r-sm);
  box-shadow:var(--shadow);padding:24px;
}
.side-card h3{font-size:1.05rem;font-weight:700;margin-bottom:14px;padding-left:12px;border-left:4px solid var(--blue)}
.side-card p{color:var(--ink-2);font-size:.9rem;margin-bottom:12px}
.side-cta{background:var(--mix-bg);display:flex;flex-direction:column;gap:10px}
.side-cta h3{border-left-color:var(--purple)}
.side-cta .btn{width:100%}
.side-links li{margin-bottom:10px;border-bottom:1px dashed var(--line);padding-bottom:10px}
.side-links a{color:var(--ink-2);font-size:.9rem;line-height:1.5}
.side-links a:hover{color:var(--blue)}
.side-contact p a{color:var(--blue);font-weight:600}

/* ---------- 响应式 ---------- */
@media (max-width:1023px){
  .detail-layout{grid-template-columns:1fr}
  .detail-side{position:static;display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}
  .rel-related,.rel-latest,.rel-week,.rel-day,.rel-month{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:767px){
  .detail-body{padding:24px 18px}
  .rel-related,.rel-latest,.rel-week,.rel-day,.rel-month{grid-template-columns:1fr}
  .detail-side{grid-template-columns:1fr}
}

/* ---------- 阅读提示条 ---------- */
.sh-note{
  display:flex;gap:12px;align-items:flex-start;
  padding:16px 18px;margin-bottom:22px;
  background:var(--purple-bg);border:1px solid rgba(200,178,242,.6);
  border-radius:var(--r-md) var(--r-sm) var(--r-md) var(--r-sm);
}
.sh-note .ico{width:22px;height:22px;color:var(--purple);flex-shrink:0;margin-top:1px}
.sh-note p{color:var(--ink-2);font-size:.88rem;line-height:1.8}

/* ---------- 资格自测帮助条 ---------- */
.sh-help{
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  margin-top:26px;padding:22px 24px;
  background:linear-gradient(160deg,#f5faff,#eef4fb);border:1px solid rgba(180,205,235,.5);
  border-radius:var(--r-md) var(--r-sm) var(--r-md) var(--r-sm);
}
.sh-help-ico{
  width:46px;height:46px;border-radius:14px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--blue),var(--purple));
}
.sh-help-ico .ico{width:24px;height:24px;color:#fff}
.sh-help-text{flex:1;min-width:260px}
.sh-help-text b{font-size:1rem}
.sh-help-text p{color:var(--ink-2);font-size:.88rem;line-height:1.8;margin-top:6px}
.sh-help .btn{flex-shrink:0}

/* ---------- 文末常见疑问 ---------- */
.sh-faq{margin-top:34px}
.sh-faq h2{font-size:1.3rem;font-weight:800;margin-bottom:18px}
.sh-faq-list{display:flex;flex-direction:column;gap:12px}
.sh-faq-list details{
  border:1px solid var(--line);border-radius:var(--r-md) var(--r-sm) var(--r-md) var(--r-sm);
  background:#fff;box-shadow:var(--shadow);overflow:hidden;
}
.sh-faq-list summary{
  cursor:pointer;padding:16px 20px;font-weight:700;font-size:.96rem;list-style:none;
  display:flex;justify-content:space-between;align-items:center;
}
.sh-faq-list summary::after{content:"＋";color:var(--blue);font-weight:800}
.sh-faq-list details[open] summary::after{content:"－";color:var(--purple)}
.sh-faq-list details p{padding:0 20px 16px;color:var(--ink-2);font-size:.9rem;line-height:1.85}
.sh-faq-list details a{color:var(--blue);font-weight:600}

/* ---------- 文末延伸阅读 ---------- */
.sh-more{padding:88px 0;background:#fff}
.sh-more-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.sh-more-card{
  display:flex;flex-direction:column;gap:10px;padding:28px 24px;
  border:1px solid var(--line);border-radius:var(--r-lg) var(--r-sm) var(--r-lg) var(--r-sm);
  background:#fff;box-shadow:var(--shadow);transition:transform .3s,box-shadow .3s;
}
.sh-more-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-2)}
.sh-more-ico{
  width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--blue-bg),var(--purple-bg));margin-bottom:4px;
}
.sh-more-ico .ico{width:24px;height:24px;color:var(--blue)}
.sh-more-card b{font-size:1.04rem;font-weight:700}
.sh-more-card p{color:var(--ink-2);font-size:.88rem;line-height:1.75;flex:1}
.sh-more-card span{color:var(--blue);font-weight:600;font-size:.86rem}
.sh-more-card:hover span{color:var(--purple)}

/* ---------- 正文阅读导览 ---------- */
.sh-guide{padding:76px 0;background:var(--mix-bg)}
.sh-guide-inner{display:grid;grid-template-columns:.85fr 1.15fr;gap:44px;align-items:center}
.sh-guide-intro h2{font-size:clamp(1.5rem,2.6vw,2rem);font-weight:800;line-height:1.5}
.sh-guide-intro p{color:var(--ink-2);margin-top:12px;line-height:1.85}
.sh-guide-list{display:flex;flex-direction:column;gap:12px}
.sh-guide-item{
  display:flex;gap:16px;align-items:flex-start;padding:16px 18px;background:#fff;
  border:1px solid rgba(190,205,235,.55);border-radius:var(--r-md) var(--r-sm) var(--r-md) var(--r-sm);
}
.sh-guide-item b{
  flex-shrink:0;min-width:64px;text-align:center;padding:6px 10px;border-radius:999px;
  background:linear-gradient(120deg,var(--blue-bg),var(--purple-bg));color:var(--blue);
  font-size:.84rem;font-weight:700;
}
.sh-guide-item p{color:var(--ink-2);font-size:.9rem;line-height:1.75}

/* ---------- 延伸问答 ---------- */
.sh-qa{padding:88px 0;background:#fff}
.sh-qa-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.sh-qa-item{
  border:1px solid var(--line);border-radius:var(--r-md) var(--r-sm) var(--r-md) var(--r-sm);
  background:#fff;box-shadow:var(--shadow);overflow:hidden;align-self:start;
}
.sh-qa-item summary{
  cursor:pointer;padding:16px 20px;font-weight:700;font-size:.96rem;list-style:none;
  display:flex;justify-content:space-between;align-items:center;gap:12px;
}
.sh-qa-item summary::after{content:"＋";color:var(--blue);font-weight:800;flex-shrink:0}
.sh-qa-item[open] summary::after{content:"－";color:var(--purple)}
.sh-qa-item p{padding:0 20px 16px;color:var(--ink-2);font-size:.9rem;line-height:1.85}
.sh-qa-item a{color:var(--blue);font-weight:600}

/* ---------- 报考贴士 ---------- */
.sh-tip{padding:76px 0;background:var(--mix-bg)}
.sh-tip-inner>h2{font-size:clamp(1.5rem,2.6vw,2rem);font-weight:800;line-height:1.5;text-align:center;margin-bottom:34px}
.sh-tip-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.sh-tip-item{
  padding:26px 22px;background:#fff;border:1px solid var(--line);
  border-radius:var(--r-md) var(--r-lg) var(--r-md) var(--r-lg);box-shadow:var(--shadow);
  position:relative;overflow:hidden;
}
.sh-tip-item b{
  display:block;font-size:2rem;font-weight:800;color:transparent;
  -webkit-text-stroke:1.5px rgba(59,143,212,.25);margin-bottom:8px;
}
.sh-tip-item h4{font-size:1rem;font-weight:700;margin-bottom:8px}
.sh-tip-item p{color:var(--ink-2);font-size:.88rem;line-height:1.75}

/* ---------- 平台故事散文 ---------- */
.sh-story{padding:84px 0;background:#fff}
.sh-story-inner{max-width:860px;margin:0 auto;text-align:center}
.sh-story-label span{
  display:inline-block;padding:6px 18px;border-radius:999px;
  background:var(--purple-bg);color:var(--purple);font-size:.82rem;font-weight:700;letter-spacing:3px;
}
.sh-story-inner h2{font-size:clamp(1.5rem,2.6vw,2rem);font-weight:800;line-height:1.5;margin:20px 0 24px}
.sh-story-inner p{color:var(--ink-2);font-size:.96rem;line-height:2;text-align:left;margin-bottom:18px}

/* ---------- 延伸阅读与资料导航 ---------- */
.sh-res{padding:88px 0;background:linear-gradient(160deg,#f7f4ff,#eef6ff)}
.sh-res-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.sh-res-card{
  display:flex;align-items:center;gap:16px;padding:22px 22px;background:#fff;
  border:1px solid rgba(190,205,235,.55);border-radius:var(--r-md) var(--r-sm) var(--r-md) var(--r-sm);
  box-shadow:var(--shadow);transition:transform .3s,box-shadow .3s;
}
.sh-res-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-2)}
.sh-res-card .ico{width:30px;height:30px;color:var(--purple);flex-shrink:0}
.sh-res-card b{display:block;font-size:1rem}
.sh-res-card span{color:var(--ink-3);font-size:.8rem}

/* ---------- 拿证节点速览 ---------- */
.sh-map{padding:80px 0;background:#fff}
.sh-map-inner{display:grid;grid-template-columns:.85fr 1.15fr;gap:44px;align-items:center}
.sh-map-intro h2{font-size:clamp(1.5rem,2.6vw,2rem);font-weight:800;line-height:1.5}
.sh-map-intro p{color:var(--ink-2);margin-top:12px;line-height:1.85}
.sh-map-steps{display:flex;flex-direction:column;gap:12px}
.sh-map-step{
  display:flex;gap:16px;align-items:flex-start;padding:14px 18px;background:var(--mix-bg);
  border:1px solid rgba(190,205,235,.5);border-radius:var(--r-md) var(--r-sm) var(--r-md) var(--r-sm);
}
.sh-map-step b{
  width:30px;height:30px;flex-shrink:0;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--blue),var(--purple));color:#fff;font-size:.92rem;
}
.sh-map-step h4{font-size:.95rem;font-weight:700}
.sh-map-step p{color:var(--ink-2);font-size:.85rem;line-height:1.7;margin-top:3px}

@media (max-width:1023px){
  .sh-map-inner{grid-template-columns:1fr;gap:28px}
}

/* ---------- 底部咨询 CTA ---------- */
.sh-cta{padding:64px 0;background:linear-gradient(160deg,#f7f4ff,#eef6ff)}
.sh-cta-inner{
  display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap;
  padding:40px 44px;border-radius:var(--r-xl) var(--r-md) var(--r-xl) var(--r-md);
  background:#fff;box-shadow:var(--shadow-2);border:1px solid rgba(190,205,235,.55);
}
.sh-cta-text h2{font-size:clamp(1.4rem,2.4vw,1.9rem);font-weight:800}
.sh-cta-text p{color:var(--ink-2);margin-top:8px}
.sh-cta-actions{display:flex;gap:14px;flex-wrap:wrap}

@media (max-width:1023px){
  .sh-more-grid{grid-template-columns:repeat(2,1fr)}
  .sh-guide-inner{grid-template-columns:1fr;gap:28px}
  .sh-qa-grid{grid-template-columns:1fr}
  .sh-tip-grid{grid-template-columns:1fr 1fr}
  .sh-res-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:767px){
  .sh-more-grid{grid-template-columns:1fr}
  .sh-cta-inner{padding:28px 22px}
  .sh-tip-grid{grid-template-columns:1fr}
  .sh-res-grid{grid-template-columns:1fr}
}