@charset "UTF-8";
/* 东力 单页/单频道补充样式 · 源块 c50c9724 · 1 页引用 */
.dl-scene{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.dl-scene .s{background:#fff;border:1px solid var(--line);border-radius:6px;padding:16px 16px 15px;position:relative;transition:border-color .2s,box-shadow .2s}
.dl-scene .s b{display:block;font-size:15px;margin:0 0 5px;color:var(--primary-dark)}
.dl-scene .s p{font-size:13px;color:var(--text-light)}
.dl-fast{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:1000px;margin:0 auto}
/* 首屏四步：文字左对齐，与上方标题同轴 */
.hero .steps .step{text-align:left;padding:15px 18px}
.dl-fast .q{background:#fff;border-left:4px solid var(--accent);border-radius:4px;padding:13px 16px;box-shadow:0 1px 4px rgba(0,0,0,.06)}
.dl-fast .q b{display:block;font-size:14.5px;margin-bottom:4px}
.dl-fast .q p{font-size:13px;color:var(--text-light)}
.dl-duo{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:stretch}
.dl-duo .panel{display:flex;flex-direction:column}
.dl-duo .panel>h3{padding-left:10px;border-left:4px solid var(--accent);margin:0 0 14px}
/* 首页两处内容块做成同规格白卡：外框等高，两栏底边齐平 */
.panel{background:#fff;border:1px solid var(--line);border-radius:8px;padding:20px 22px}
.dl-pts{flex:1;height:auto;max-height:330px;overflow-y:auto;padding-right:10px}
.dl-pts li{list-style:none;padding:9px 0 9px 24px;position:relative;font-size:14px;border-bottom:1px dotted var(--line)}
.dl-pts li::before{content:"\2714";position:absolute;left:0;color:var(--accent);font-weight:700}
.dl-kb{height:336px;overflow-y:scroll;padding-right:10px}
.dl-kb a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:11px 6px;border-bottom:1px dotted var(--line);font-size:14px;color:var(--text)}
.dl-kb a:hover{color:var(--primary-dark)}
.dl-kb .cat{flex:0 0 auto;color:#fff;background:var(--primary);font-size:12px;border-radius:3px;padding:1px 8px;white-space:nowrap}
.scroll-y{flex:1;height:auto;max-height:330px;overflow-y:auto;padding-right:10px}
.scroll-y a.kb{display:block;padding:10px 4px;border-bottom:1px dashed var(--line);font-size:14px;color:var(--text)}
.scroll-y a.kb small{display:block;color:var(--text-light);font-size:12px;margin-top:2px}

/* --- 实拍图（勿删） --- */
.thumb{position:relative;overflow:hidden}
.thumb img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;display:block}
figure.shot{margin:0 0 20px}
figure.shot img{width:100%;height:auto;display:block;border-radius:6px;border:1px solid var(--line)}
figure.shot figcaption{font-size:12px;color:var(--text-light);margin-top:6px;line-height:1.6}
.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:16px 0}

.gallery figure{margin:0}
.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:6px;display:block}
.gallery figcaption{font-size:12px;color:var(--text-light);margin-top:5px;line-height:1.6}

/* ---- 细滚动条（2026-11-11）：右侧竖向条做细，横向条同理 ---- */
html{scrollbar-width:thin;scrollbar-color:#c9bfae #f4f1e9}
::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-track{background:#f4f1e9}
::-webkit-scrollbar-thumb{background:#c9bfae;border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:#b0a493}

/* ---- 页内滚动区（2026-11-12）：条子略宽、颜色加深，滚动条一眼可见 ---- */
.dl-kb,.dl-pts,.scroll-y{scrollbar-width:thin;scrollbar-color:#a39887 #f0ede5}
.dl-kb::-webkit-scrollbar,.dl-pts::-webkit-scrollbar,.scroll-y::-webkit-scrollbar{width:8px}
.dl-kb::-webkit-scrollbar-track,.dl-pts::-webkit-scrollbar-track,.scroll-y::-webkit-scrollbar-track{background:#f0ede5;border-radius:4px}
.dl-kb::-webkit-scrollbar-thumb,.dl-pts::-webkit-scrollbar-thumb,.scroll-y::-webkit-scrollbar-thumb{background:#a39887;border-radius:4px}
.dl-kb::-webkit-scrollbar-thumb:hover,.dl-pts::-webkit-scrollbar-thumb:hover,.scroll-y::-webkit-scrollbar-thumb:hover{background:#8b806f}

/* ---- 施工场景卡可点（2026-11-11） ---- */
.dl-scene a.s{display:block;color:inherit;text-decoration:none;transition:border-color .2s,box-shadow .2s}
.dl-scene a.s:hover{border-color:var(--accent);box-shadow:0 4px 14px rgba(0,0,0,.08)}

/* ---- 应用行业：缩略图左、说明右（2026-11-11） ---- */
.ind-card{display:flex;align-items:stretch}
.ind-card .thumb{flex:0 0 36%;aspect-ratio:auto;min-height:168px}
.ind-card .body{flex:1;min-width:0;padding:15px 16px}

/* ---- 首页区块窄屏（2026-11-12）：场景卡两列、双栏改单列、滚动区放开 ---- */
@media(max-width:760px){
  .dl-scene{grid-template-columns:repeat(2,1fr);gap:10px}
  .dl-scene .s{padding:13px 13px 12px}
  .dl-fast{grid-template-columns:1fr}
  .dl-duo{grid-template-columns:1fr;gap:18px}
  .dl-pts,.scroll-y{height:auto;max-height:330px}
  .dl-kb{height:auto;max-height:336px;overflow-y:auto;padding-right:6px}
  .hero .steps{grid-template-columns:1fr 1fr;gap:10px}
}
@media(max-width:560px){
  .dl-scene{grid-template-columns:1fr}
}

/* ---- 首页视觉补图（2026-11-13）：实景带 / 课堂图 / 场景卡 ---- */
/* 首屏保持东力原有的全宽深底 + 四步流程，不做左文右图，避免与科胜首屏撞脸 */
.dl-gallery-tit{text-align:center;font-size:16px;font-weight:400;color:var(--text);margin:32px 0 14px}
figure.shot.dl-tech-shot img{height:220px;object-fit:cover}
.dl-scene .s .thumb{aspect-ratio:16/9;margin:0 0 12px;border-radius:4px;background:#f0ede5}
.dl-scene .s .thumb img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:760px){
  figure.shot.dl-tech-shot img{height:180px}
}
@media(max-width:560px){
  figure.shot.dl-tech-shot img{height:150px}
}

/* ---- 首屏自有宽幅背景（2026-11-13）----
   抽象深灰 + 墨绿微粒质感，呼应绿碳化硅微粉与站点配色；纯装饰背景，
   不冒充实拍、不写图注；标题/说明/按钮/四步流程全部保持东力原样。 */
.hero{
  background-color:#2f2f2f;
  background-image:linear-gradient(90deg,rgba(47,47,47,.94) 0%,rgba(47,47,47,.86) 45%,rgba(47,47,47,.5) 100%),url('../img/hero-banner.jpg');
  background-size:cover,cover;
  background-position:center,center right;
  background-repeat:no-repeat,no-repeat;
}
@media(max-width:760px){
  .hero{background-image:linear-gradient(90deg,rgba(47,47,47,.95),rgba(47,47,47,.85)),url('../img/hero-banner.jpg')}
}
