/* ==========================================================================
   正文富文本样式（栏目单页 / 详情页正文）
   --------------------------------------------------------------------------
   作用域：只在 `.wyt-rich` 容器内生效，不触碰任何既有前台规则。
   背景：后台写入的 <table>/<img>/<h3> 在没有编辑器配套样式时是裸元素，
        7 个服务单页的对比表格此前完全没有边框与表头底色。
   挂载：app/view/lists/c_page.html 的 `<div class="body wyt-rich">`
   ========================================================================== */

.wyt-rich {
  line-height: 1.9;
  color: #3A4A54;
  word-break: break-word;
}

.wyt-rich h2 {
  font-size: 24px;
  line-height: 1.4;
  margin: 0 0 16px;
  color: #14303E;
  letter-spacing: .01em;
}

.wyt-rich h3 {
  font-size: 18px;
  line-height: 1.5;
  margin: 28px 0 12px;
  color: #14303E;
}

.wyt-rich p { margin: 0 0 14px; }

.wyt-rich ul,
.wyt-rich ol { margin: 0 0 18px; padding-left: 22px; }

.wyt-rich li { margin: 6px 0; }

.wyt-rich strong { color: #14303E; }

.wyt-rich blockquote {
  margin: 18px 0;
  padding: 12px 18px;
  border-left: 3px solid #2EA7DC;
  background: #F2F8FB;
  color: #5C7683;
}

/* 图片：自适应容器，圆角与站内其它图片一致 */
.wyt-rich img {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
  margin: 16px 0;
}

/* 表格：边框 + 表头底色 + 斑马纹 */
.wyt-rich table {
  width: 100%;
  border-collapse: collapse;
  margin: 18px 0;
  font-size: 14px;
  background: #fff;
}

.wyt-rich th,
.wyt-rich td {
  border: 1px solid #E2EEF3;
  padding: 10px 12px;
  text-align: left;
  vertical-align: top;
}

.wyt-rich thead th {
  background: #F2F8FB;
  color: #14303E;
  font-weight: 600;
}

.wyt-rich tbody tr:nth-child(even) { background: #FAFDFE; }

/* 视频/iframe 自适应（后台可能粘视频） */
.wyt-rich iframe {
  max-width: 100%;
  border: 0;
  border-radius: 12px;
  display: block;
  margin: 16px 0;
}

@media (max-width: 880px) {
  .wyt-rich { font-size: 14px; }
  .wyt-rich h2 { font-size: 20px; }
  .wyt-rich h3 { font-size: 16px; }

  /* 手机上表格改为横向滚动容器，避免撑破布局 */
  .wyt-rich table {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .wyt-rich th,
  .wyt-rich td { white-space: nowrap; }
}

/* ==========================================================================
   排版模板（2026-10-28）：左图右文 / 右图左文 / 上图下文 / 二栏等宽 / 三栏卡片 / 图文环绕
   --------------------------------------------------------------------------
   单一事实来源：前台（.wyt-rich 作用域）、编辑器（body_class=wyt-rich 且 content_css 指向本文件）、
                 后台预览样式三者用**同一套 class 与数值**，避免"编辑看到的和前台不一样"。
   文字随图片自动排版：列宽用 minmax(0,…) 自适应，图片 height:auto，行高固定，不写死像素。
   ========================================================================== */
.wyt-rich .wyt-lay{display:grid;gap:24px;align-items:start;margin:26px 0}
.wyt-rich .wyt-lay-media{min-width:0}
.wyt-rich .wyt-lay-body{min-width:0;line-height:1.9}
.wyt-rich .wyt-lay-body p{margin:0 0 12px}
.wyt-rich .wyt-lay-body p:first-child{margin-top:0}
.wyt-rich .wyt-lay-body p:last-child{margin-bottom:0}
.wyt-rich .wyt-lay-body h3:first-child,
.wyt-rich .wyt-lay-body h4:first-child{margin-top:0}

/* 左图右文：图 1 份，文 1.2 份 */
.wyt-rich .wyt-lay-lr{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}
/* 右图左文：DOM 顺序不变，靠 order 把图挪到右边 */
.wyt-rich .wyt-lay-rl{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}
.wyt-rich .wyt-lay-rl .wyt-lay-media{order:2}

/* 上图下文：单列时图片限制高度，避免 4:3 图占满一屏 */
.wyt-rich .wyt-lay-tb{grid-template-columns:1fr}
.wyt-rich .wyt-lay-tb .wyt-lay-media img{max-height:460px;object-fit:cover}

/* 二栏等宽 / 三栏卡片 */
.wyt-rich .wyt-lay-2col{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.wyt-rich .wyt-lay-3col{grid-template-columns:repeat(3,minmax(0,1fr))}
.wyt-rich .wyt-lay-3col .wyt-lay-body{background:#F7FAFC;border:1px solid #E6EEF3;border-radius:12px;padding:18px 20px}
.wyt-rich .wyt-lay-3col .wyt-lay-body h4{margin:0 0 8px;font-size:16px;color:#14303E}

/* 图文环绕：img 左浮动，文字自然绕排；长英文不断词 */
.wyt-rich .wyt-lay-wrap{display:block}
.wyt-rich .wyt-lay-wrap::after{content:"";display:block;clear:both}
.wyt-rich .wyt-lay-wrap .wyt-lay-media{float:left;max-width:45%;margin:4px 18px 10px 0}
.wyt-rich .wyt-lay-wrap .wyt-lay-body{overflow-wrap:anywhere;line-height:1.9}

/* 图片统一自适应（不会撑破容器） */
.wyt-rich .wyt-lay-media img{width:100%;height:auto;display:block;border-radius:10px}

/* ≤880px：全部堆叠成单列，取消浮动 */
@media (max-width:880px){
  .wyt-rich .wyt-lay-lr,
  .wyt-rich .wyt-lay-rl,
  .wyt-rich .wyt-lay-2col,
  .wyt-rich .wyt-lay-3col{grid-template-columns:1fr}
  .wyt-rich .wyt-lay-rl .wyt-lay-media{order:0}
  .wyt-rich .wyt-lay-wrap .wyt-lay-media{float:none;max-width:100%;margin:0 0 12px}
  .wyt-rich .wyt-lay{gap:16px;margin:20px 0}
}

/* ==========================================================================
   正文可插入模块的样式（2026-10-28 第二批：services / video / faq / cases）
   同样只在 .wyt-rich 作用域，编辑器加载同一份文件 → 所见即所得
   ========================================================================== */
.wyt-rich .wyt-blk{margin:28px 0}
.wyt-rich .wyt-blk-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.wyt-rich .wyt-blk-card{background:#fff;border:1px solid #E6EEF3;border-radius:14px;padding:20px 22px}
.wyt-rich .wyt-blk-card h3{margin:0 0 10px;font-size:16px;color:#14303E;line-height:1.5}
.wyt-rich .wyt-blk-card p{margin:0 0 12px;font-size:13.5px;line-height:1.85;color:#5C7683}
.wyt-rich .wyt-blk-more{font-size:13px;color:#1877A3;text-decoration:none}
.wyt-rich .wyt-blk-more:hover{text-decoration:underline}

.wyt-rich .wyt-blk-video-head{margin:0 0 14px}
.wyt-rich .wyt-blk-video-head h3{margin:0 0 8px;font-size:18px;color:#14303E}
.wyt-rich .wyt-blk-video-head p{margin:0;font-size:13.5px;color:#5C7683}
.wyt-rich .wyt-blk-video-box{border-radius:14px;overflow:hidden;background:#000;aspect-ratio:16/9}
.wyt-rich .wyt-blk-video-box video{width:100%;height:100%;display:block;object-fit:cover}

.wyt-rich .wyt-blk-faq{border-top:1px solid #E6EEF3}
.wyt-rich .wyt-blk-faq-item{border-bottom:1px solid #E6EEF3;padding:14px 0}
.wyt-rich .wyt-blk-faq-item summary{cursor:pointer;font-size:15px;color:#14303E;font-weight:600;list-style:none}
.wyt-rich .wyt-blk-faq-item summary::-webkit-details-marker{display:none}
.wyt-rich .wyt-blk-faq-item summary::before{content:"＋ ";color:#1877A3;font-weight:700}
.wyt-rich .wyt-blk-faq-item[open] summary::before{content:"－ "}
.wyt-rich .wyt-blk-faq-a{margin:10px 0 0;font-size:13.5px;line-height:1.9;color:#5C7683}

.wyt-rich .wyt-blk-cases-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.wyt-rich .wyt-blk-case{display:block;text-decoration:none;border-radius:12px;overflow:hidden;background:#fff;border:1px solid #E6EEF3}
.wyt-rich .wyt-blk-case-img{display:block;aspect-ratio:4/3;overflow:hidden;background:#F2F6F9}
.wyt-rich .wyt-blk-case-img img{width:100%;height:100%;object-fit:cover;display:block}
.wyt-rich .wyt-blk-case-t{display:block;padding:12px 14px;font-size:13.5px;color:#14303E;line-height:1.6}

@media (max-width:880px){
  .wyt-rich .wyt-blk-grid{grid-template-columns:1fr}
  .wyt-rich .wyt-blk-cases-grid{grid-template-columns:1fr 1fr}
}