/* ═══ 落地工具模块（dt4/jd5/jd6）——提取自《article282-落地工具融合效果.html》多轮迭代最终态，供新闻/案例详情页 no-reason 前插入 ═══ */
/* ═══ 落地工具模块外壳·文章风格融合（2026-11-05：去营销壳融进文档页；卡片不动） ═══ */
.dt4--bleed{width:auto;margin-left:0}
.dt4{background:none;border-radius:0;padding:0;margin:36px 0 6px}
.dt4::before,.dt4::after{display:none}
.dt4-in{padding:0}
.dt4-head{text-align:left;margin-bottom:4px}
.dt4-title{font-size:20px;font-weight:700;color:#1d2129;letter-spacing:0;border-left:4px solid #1f6ef7;padding-left:12px;line-height:1.35;display:inline-block}
.dt4-bar{display:none}
.dt4-sub{font-size:13.5px;color:#6b7480;margin-top:8px;padding-left:16px}
.dt4-gname{text-align:left;font-size:15px;font-weight:600;color:#1d2129;letter-spacing:0;margin:24px 0 14px}
.dt4-gname::before,.dt4-gname::after{content:none}
.dt4-ctawrap{text-align:left;margin:30px 0 2px}
.dt4-cta{padding:9px 22px;border-radius:8px;background:#fff;border:1px solid rgba(31,110,247,.5);color:#1f6ef7;font-size:14px;font-weight:600;box-shadow:none}
.dt4-cta:hover{background:#1f6ef7;border-color:#1f6ef7;color:#fff;transform:none}
.dt4-gname{padding-left:16px}
.dt4-ctawrap{padding-left:16px}
@media (max-width:760px){
  .dt4{margin:22px 0 4px;padding:0;border-radius:0;background:none}
  .dt4-title{font-size:17px}
  .dt4-sub{font-size:12px;margin-top:6px;padding-left:14px}
  .dt4-gname{margin:18px 0 12px;font-size:14px;padding-left:14px}
  .dt4-cta{font-size:13.5px;padding:8px 18px}
}

/* ═══ 落地工具模块·简道云风格面板（2026-11-05：白面板+无边框图标行卡+组色制+更多链接；外壳文章式标题保留） ═══ */
.jd5-wrap{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:20px}
.jd5-panel{background:#fff;border-radius:16px;padding:18px 20px 12px;box-shadow:0 2px 12px rgba(29,33,41,.05)}
.jd5-ph{display:flex;align-items:center;justify-content:space-between;padding:0 8px 10px}
.jd5-ph h3{font-size:16px;font-weight:600;color:#1d2129}
.jd5-ph a{display:inline-flex;align-items:center;gap:3px;font-size:13px;font-weight:500}
.jd5-ph a i{font-style:normal;font-size:12px;transition:transform .15s}
.jd5-ph a:hover i{transform:translateX(2px)}
.jd5-panel--gen .jd5-ph a{color:#0c8b80}
.jd5-panel--mfg .jd5-ph a{color:#2563d9}
.jd5-panel ul{list-style:none;display:grid;grid-template-columns:1fr 1fr;column-gap:16px}
.jd5-panel li a{display:flex;align-items:center;gap:12px;padding:10px 8px;border-radius:10px;transition:background .15s}
.jd5-panel li a:hover{background:#f5f8fd}
.jd5-panel--gen li a:hover{background:#eefaf7}
.jd5-panel--mfg li a:hover{background:#eef4ff}
.jd5-ico{flex:none;width:42px;height:42px;border-radius:11px;color:#fff;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;text-align:center;line-height:1.25;padding:3px;letter-spacing:.5px}
.jd5-panel--gen .jd5-ico{background:linear-gradient(140deg,#1cb8a8,#0c8b80)}
.jd5-panel--mfg .jd5-ico{background:linear-gradient(140deg,#3f8ef7,#2563d9)}
.jd5-tx{flex:1;min-width:0}
.jd5-tx b{display:block;font-size:14.5px;font-weight:600;color:#1d2129;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.jd5-panel li a:hover .jd5-tx b{font-weight:700}
.jd5-panel--gen li a:hover .jd5-tx b{color:#0c8b80}
.jd5-panel--mfg li a:hover .jd5-tx b{color:#2563d9}
.jd5-tx i{display:block;font-style:normal;font-size:12px;color:#98a2b3;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:900px){.jd5-wrap{grid-template-columns:1fr}}
@media (max-width:760px){
  .jd5-wrap{margin-top:14px;gap:14px}
  .jd5-panel{padding:14px 12px 8px;border-radius:13px}
  .jd5-panel ul{grid-template-columns:1fr}
  .jd5-ico{width:38px;height:38px;border-radius:10px;font-size:10.5px}
  .jd5-tx b{font-size:14px}
}

/* ═══ 落地工具·简道云文章页版（2026-11-05b：白色小卡+浅投影+hover放大；磨砂玻璃图标；底部实色更多模板按钮） ═══ */
.jd5-panel{padding:16px 16px 8px;box-shadow:none;background:transparent}
.jd5-ph{padding:0 4px 10px}
.jd5-ph h3{font-size:15px;font-weight:600;color:#141e31}
.jd5-panel ul{grid-template-columns:1fr 1fr;gap:12px 12px}
.jd5-panel li a{background:#fff;border-radius:10px;box-shadow:0 4px 16px 0 rgba(20,30,49,.1);padding:12px 12px;gap:11px;transition:transform .15s ease,box-shadow .15s ease}
.jd5-panel li a:hover{transform:scale(1.04);box-shadow:0 8px 22px 0 rgba(20,30,49,.14);background:#fff}
.jd5-panel--gen li a:hover{background:#fff}
.jd5-panel--mfg li a:hover{background:#fff}
/* 磨砂玻璃图标：白色半透明磨砂层叠组色渐变 */
.jd5-ico{width:44px;height:44px;border-radius:12px;position:relative;font-size:10.5px;font-weight:700;letter-spacing:.5px;border:1px solid rgba(255,255,255,.65);box-shadow:inset 0 1px 3px rgba(255,255,255,.85),0 3px 8px rgba(20,30,49,.08);backdrop-filter:blur(4px)}
.jd5-panel--gen .jd5-ico{background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(255,255,255,.42)),linear-gradient(135deg,#1cb8a8,#0c8b80);color:#075f56}
.jd5-panel--mfg .jd5-ico{background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(255,255,255,.42)),linear-gradient(135deg,#3f8ef7,#2563d9);color:#123f8f}
.jd5-tx b{font-size:15.5px;font-weight:500;color:#141e31}
.jd5-panel--gen li a:hover .jd5-tx b{color:#0c8b80}
.jd5-panel--mfg li a:hover .jd5-tx b{color:#2563d9}
.jd5-tx i{font-size:12.5px;color:#525967;margin-top:4px}
/* 底部实色按钮（简道云 168×48 式） */
.jd6-more{display:flex;justify-content:center;margin:26px 0 8px}
.jd6-more a{display:inline-flex;align-items:center;justify-content:center;gap:9px;width:168px;height:48px;border-radius:8px;background:#1f6ef7;color:#fff;font-size:16px;font-weight:600;transition:background .15s}
.jd6-more a svg{width:16px;height:16px;transition:transform .25s}
.jd6-more a:hover{background:#185cd6}
.jd6-more a:hover svg{transform:translateX(4px)}
@media (max-width:760px){
  .jd5-panel ul{gap:10px}
  .jd5-panel li a{padding:10px}
  .jd5-ico{width:40px;height:40px;border-radius:11px}
  .jd5-tx b{font-size:14.5px}
  .jd6-more{margin:20px 0 4px}
  .jd6-more a{width:150px;height:44px;font-size:15px}
}

/* ═══ 落地工具·底色容器+列表点修复（2026-11-05c：模块恢复浅雅渐变底圆角容器（简道云式浅底+白卡），卡片前置列表点清除） ═══ */
.dt4{background:linear-gradient(150deg,#eef4ff 0%,#f0edfd 55%,#ebf6f0 100%);border-radius:18px;padding:22px 24px 14px;margin:34px 0 20px}
.jd5-panel ul,.jd5-panel li{list-style:none!important;margin:0!important;padding:0!important}
.jd5-wrap{margin-top:16px}
@media (max-width:760px){
  .dt4{border-radius:14px;padding:16px 12px 10px;margin:22px 0 14px}
}

/* ═══ 落地工具·简道云区域规格对齐（2026-11-05d：区域=白色半透明玻璃卡；字号色值照简道云实值） ═══ */
.jd5-panel{background:rgba(255,255,255,.45);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.65);border-radius:14px;padding:20px 18px 10px;box-shadow:0 4px 16px 0 rgba(20,30,49,.06)}
.jd5-ph{padding:0 4px 12px}
.jd5-ph h3{font-size:18px;font-weight:600;color:#141e31}
.jd5-tx b{font-size:16px;font-weight:500;color:#141e31}
.jd5-tx i{font-size:14px;color:#525967;margin-top:4px}
.jd5-panel li a{box-shadow:0 4px 16px 0 rgba(20,30,49,.1)}
.jd5-panel li a:hover{transform:scale(1.05);box-shadow:0 8px 22px 0 rgba(20,30,49,.14)}
.jd5-panel--gen li a:hover .jd5-tx b,.jd5-panel--mfg li a:hover .jd5-tx b{color:#ffa93a}
.dt4-title{color:#141e31;font-size:21px}
@media (max-width:760px){
  .jd5-panel{padding:16px 12px 8px;border-radius:12px}
  .jd5-ph h3{font-size:16px}
  .jd5-tx b{font-size:15px}
  .jd5-tx i{font-size:13px}
  .dt4-title{font-size:18px}
}

/* ═══ 落地工具·模块头照官网首页板块头样式（2026-11-05e：真值取自官网「客户口碑」板块：kicker 13/#317af7+渐变侧线、title 35/700/#1d2129、desc 15.5/#636e80，居中） ═══ */
.dt4{padding:30px 24px 16px}
.dt4-head{text-align:center;margin:4px 0 2px}
.dt4-kicker{display:flex;align-items:center;justify-content:center;gap:14px;font-size:13px;font-weight:700;color:#317af7;letter-spacing:1.82px;margin-bottom:22px}
.dt4-kicker::before,.dt4-kicker::after{content:"";display:block;width:30px;height:2px}
.dt4-kicker::before{background:linear-gradient(90deg,rgba(154,107,255,0),rgba(106,79,240,.55))}
.dt4-kicker::after{background:linear-gradient(90deg,rgba(63,169,255,.55),rgba(63,169,255,0))}
.dt4-title{font-size:35px;font-weight:700;color:#1d2129;letter-spacing:0;border-left:none;padding-left:0;display:block;margin:0 0 10px}
.dt4-sub{font-size:15.5px;font-weight:400;color:#636e80;margin:22px 0 0;padding-left:0}
.dt4-bar{display:none}
.jd5-wrap{margin-top:30px}
@media (max-width:760px){
  .dt4{padding:22px 12px 10px}
  .dt4-kicker{margin-bottom:14px;gap:10px}
  .dt4-kicker::before,.dt4-kicker::after{width:22px}
  .dt4-title{font-size:26px;margin-bottom:8px}
  .dt4-sub{margin-top:14px;font-size:13.5px}
  .jd5-wrap{margin-top:20px}
}

/* ═══ 落地工具·更多模板按钮照官网首页真值（2026-11-05f：胶囊999+蓝紫渐变115deg+14.5px/600白字+pad12/34+无阴影） ═══ */
.jd6-more a{width:auto;height:auto;border-radius:999px;background:linear-gradient(115deg,#1e5cff,#6a4ff0 55%,#9a6bff);color:#fff;font-size:14.5px;font-weight:600;padding:12px 34px;box-shadow:none;transition:filter .15s}
.jd6-more a:hover{background:linear-gradient(115deg,#1e5cff,#6a4ff0 55%,#9a6bff);filter:brightness(1.08)}
.jd6-more a svg{width:15px;height:15px}
@media (max-width:760px){
  .jd6-more a{font-size:14px;padding:10px 28px}
  .jd6-more a svg{width:14px;height:14px}
}

/* ═══ 透明度用户定值：区域卡白底 72%→45%（2026-11-05g） ═══ */
.jd5-panel{background:rgba(255,255,255,.45)}

/* ═══ 面板底距平衡+按钮地址（2026-11-05h） ═══ */
.jd5-panel{padding:20px 18px 18px}

/* ═══ 图标换磨砂图片（2026-11-05i：语义匹配 9 项先换，其余保留 CSS 磨砂字块；图片同目录相对路径） ═══ */
.jd5-img{width:44px;height:44px;border-radius:12px;object-fit:cover;flex:none;box-shadow:0 3px 8px rgba(20,30,49,.1)}
@media (max-width:760px){.jd5-img{width:40px;height:40px;border-radius:11px}}

/* ═══ 图标全量上+去底色（2026-11-05j：16槽全图片占位，槽位零底色零阴影，纯图直贴；正式logo后续替换） ═══ */
.jd5-img{width:46px;height:46px;object-fit:contain;background:none;box-shadow:none;border-radius:0;flex:none}
@media (max-width:760px){.jd5-img{width:42px;height:42px}}

/* ═══ 上下间距照官网首页板块节奏（2026-11-05k：实测首页各板块统一 pt90/pb90，模块容器同值） ═══ */
.dt4{padding:90px 24px 90px}
.jd6-more{margin:30px 0 0}
@media (max-width:760px){
  .dt4{padding:56px 12px 56px}
  .jd6-more{margin:22px 0 0}
}

/* ═══ 内部小卡片加宽 10px（2026-11-05l：面板左右内边距 18→8，每列卡片各 +10px；移动端 12→7） ═══ */
.jd5-panel{padding:20px 8px 18px}
@media (max-width:760px){
  .jd5-panel{padding:16px 7px 8px}
}

/* ═══ 面板左右留白回调（2026-11-05n：8px 太挤 → 14px；移动端 10px） ═══ */
.jd5-panel{padding:20px 14px 18px}
@media (max-width:760px){
  .jd5-panel{padding:16px 10px 8px}
}

/* ═══ 呼吸感整体放大（2026-11-05q：小卡内边距/卡间距加大，面板与模块容器加宽加高） ═══ */
.dt4{padding:90px 12px 90px}
.jd5-wrap{gap:24px;margin-top:30px}
.jd5-panel{padding:22px 16px 20px}
.jd5-panel ul{gap:16px 14px}
.jd5-panel li a{padding:15px 14px;gap:12px}
.jd5-ph{padding:0 2px 14px}
.jd6-more{margin:34px 0 0}
@media (max-width:760px){
  .dt4{padding:56px 8px 56px}
  .jd5-wrap{gap:16px;margin-top:22px}
  .jd5-panel{padding:18px 12px 14px}
  .jd5-panel ul{gap:12px}
  .jd5-panel li a{padding:12px}
  .jd6-more{margin:26px 0 0}
}

/* ═══ 用户 DevTools 定值（2026-11-05r：面板 padding 全 22px；卡间距 gap 16px；面板宽 596px=内容区 550px，窄屏自动缩放居中） ═══ */
.jd5-wrap{display:flex;justify-content:center;gap:24px}
.jd5-panel{flex:0 1 596px;max-width:100%;padding:22px}
.jd5-panel ul{gap:16px}
@media (max-width:900px){
  .jd5-wrap{flex-direction:column;align-items:stretch}
  .jd5-panel{flex:none;width:auto}
}

/* ═══ 面板不缩容（2026-11-05s：模块容器按视口加宽居中最宽1240，面板固定596=内容区恒550，视口不足才让位） ═══ */
.dt4{width:calc(100vw - 24px);max-width:1240px;margin-left:50%;transform:translateX(-50%)}
.jd5-panel{flex:0 1 596px;width:596px}
@media (max-width:760px){
  .dt4{width:auto;max-width:none;margin-left:0;transform:none}
  .jd5-panel{width:auto}
}

/* ═══ 内层容器放开（2026-11-05s2：.dt4-in max-width 1000→1216，配合外层加宽，面板真正吃到 596/内容550） ═══ */
.dt4-in{max-width:1216px}

/* ═══ 底色带放宽（2026-11-05t：容器 max-width 1240→1320、侧留白 12→52px，面板与底色边缘恢复呼吸） ═══ */
.dt4{max-width:1320px;padding:90px 52px 90px}
@media (max-width:760px){
  .dt4{padding:56px 8px 56px}
}

/* ═══ 底色通栏（2026-11-05u：渐变带通到视口左右两边，全宽色带非卡片；内容仍居中 1216） ═══ */
.dt4{width:100vw;max-width:none;margin-left:calc(50% - 50vw);transform:none;border-radius:0;padding:90px 24px 90px}
@media (max-width:760px){
  .dt4{padding:56px 12px 56px}
}

/* ═══ 通栏精确居中（2026-11-05u2：left50%+translateX 精确对称满宽，html 横向溢出兜底） ═══ */
html{overflow-x:hidden}
.dt4{width:100vw;max-width:none;margin-left:0;left:50%;transform:translateX(-50%);border-radius:0;padding:90px 24px 90px}
@media (max-width:760px){
  .dt4{width:100vw;margin-left:0;left:50%;transform:translateX(-50%);padding:56px 12px 56px}
}

/* ═══ 通栏兜底（2026-11-05u3：超宽48px对称溢出+裁切，容忍父容器偏移，任何屏都盖满两边） ═══ */
.dt4{position:relative}
/* 内容容器水平居中（设计稿营销壳原始样式携带 margin:0 auto，组件化提取时补齐） */
.dt4-in{margin:0 auto}
.dt4{width:calc(100vw + 48px);max-width:none;margin-left:0;left:50%;transform:translateX(-50%);border-radius:0;padding:90px 24px 90px}
@media (max-width:760px){
  .dt4{width:calc(100vw + 48px);margin-left:0;left:50%;transform:translateX(-50%);padding:56px 12px 56px}
}


/* ═══ 移动端修复（2026-11-05x：① dt4-in 收进视口——原宽 100vw+24 被 html 裁 12px/侧，右列卡片贴边被切，收窄为 100vw-24 居中，两侧各留 12px 实边距；② 卡片改竖排（图标上/文字下）两列保留，长名称两行内完整显示不再截断；③ 面板与卡间距收紧；2026-11-05y：卡片内容改居中——图标/名称/标签水平居中，两列窄卡更工整） ═══ */
@media (max-width:760px){
  .dt4-in{width:calc(100vw - 24px);max-width:none;margin:0 auto}
  .jd5-wrap{gap:14px;margin-top:20px}
  .jd5-panel{padding:16px 10px 12px}
  .jd5-ph{display:flex;justify-content:center;padding:0 2px 10px}
  .jd5-ph h3{text-align:center}
  .jd5-panel ul{gap:10px}
  .jd5-panel li{display:flex}
  .jd5-panel li a{flex:1;flex-direction:column;align-items:center;gap:8px;padding:12px 11px 11px;text-align:center}
  .jd5-img{width:42px;height:42px}
  .jd5-tx{width:100%}
  .jd5-tx b{font-size:13.5px;line-height:1.4;text-align:center;white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
  .jd5-tx i{font-size:11.5px;margin-top:3px;text-align:center}
}

/* ═══ 收紧 dt4 底部留白（2026-11-06：色带内按钮下 90px 过大，案例/新闻详情页反馈） ═══ */
.dt4{padding-bottom:36px;margin-bottom:0}
/* ═══ 模块字体：跟随设计稿用雅黑族（2026-11-06：官网默认阿里普惠与示例观感不一致） ═══ */
.dt4, .dt4 *{font-family:'Microsoft YaHei','PingFang SC','Helvetica Neue',Arial,sans-serif}
/* ═══ 消除 dt4 与轮播区之间的白缝（2026-11-06：idiom 60px 上边距露出页面白底） ═══ */
.dt4 + .idiom{margin-top:0}