/* 详情页（新闻 news-*.html / 案例 case-*.html）页面专属样式
原站新闻详情实测（newsinfo_8986351）：
面包屑 模块 850×35 @ canvas(75,10) 12px/34px，#666，末项 #999
标题 模块 800×34 @ canvas(200,62) 24px/400 #404040，居中（实测墨迹 625..815 居中于 720）
信息行 日期 @ canvas(363,123) 12px #999；浏览 @ (618,116)；收藏 @ (752,117)
正文 模块 850 @ canvas(175,165) 16px/24px #404040，两段之间空两行
上一篇/下一篇 @ canvas(171,889)/(622,889) 12px/24px #666
主区高度 1000（页面 458..1458），页脚 368 → 整页 1826，与原站一致。 */
.sd-crumbs { position: absolute; left: 85px; top: 10px; font-size: 0; }
.sd-crumbs a, .sd-crumbs span { font: 400 12px/34px var(--font); color: var(--gray-2); }
.sd-crumbs .sep {
display: inline-block; width: 8px; height: 8px; margin: 0 10px 2px;
border-top: 1px solid var(--gray-2); border-right: 1px solid var(--gray-2);
transform: rotate(45deg);
}
.sd-crumbs .cur { color: #999; }
.sd-crumbs a:hover { color: var(--blue); }
.sd-title { position: absolute; left: 200px; top: 62px; width: 800px; text-align: center; font: 400 24px/34px var(--font); color: var(--ink-3); }
.sd-meta { position: absolute; left: 0; top: 116px; width: 1200px; height: 26px; font: 400 12px/24px var(--font); color: #999; }
.sd-meta .date { position: absolute; left: 363px; top: 1px; }
.sd-meta .time { position: absolute; left: 452px; top: 1px; }
.sd-meta .hits { position: absolute; left: 618px; display: flex; align-items: center; }
.sd-meta .fav { position: absolute; left: 752px; display: flex; align-items: center; color: var(--gray-2); }
.sd-meta svg { width: 12px; height: 12px; margin-right: 1px; fill: #999; }
.sd-meta .fav svg { fill: #e43939; }
/* 原站正文是 16px 宋体（CMS 里 span 为 font-size:12pt + font-family:宋体），
行距实测 26px；用宋体渲染才能与原站墨迹一致。 */
.sd-body { position: absolute; left: 175px; top: 165px; width: 850px; font: 400 16px/26px "SimSun", "宋体", var(--font); color: var(--ink-3); }
.sd-body p { margin: 0; }
.sd-body p.blank { height: 24px; margin: 0; }
.sd-nav { position: absolute; top: 889px; width: 400px; font: 400 12px/24px var(--font); color: var(--gray-2); }
.sd-nav.prev { left: 171px; }
.sd-nav.next { left: 622px; }
.sd-nav svg { width: 12px; height: 12px; margin-right: 4px; fill: var(--gray-2); vertical-align: -1px; }
.sd-nav a:hover { color: var(--blue); }
/* ---------- 案例详情（productinfo）----------
实测模块坐标（canvas，主区从页面 y=458 起）：
面包屑 (32,31) 936×35 12px/34px #666，末项 #999
图片轮播 (309,91) 600×400 原站 4 张幻灯片（尺寸 600×400/600×399/600×337 → cover 填满）
标题 (150,526) 900×34 22px/700 #404040 居中
正文 (37,595) 1125 宽 首行 20px/700，其余 16px/32px #404040
上一个/下一个 (0,697)/(720,697) 480×26 12px/24px #666 */
.pd-crumbs { position: absolute; left: 32px; top: 31px; font-size: 0; }
.pd-crumbs a, .pd-crumbs span { font: 400 12px/34px var(--font); color: var(--gray-2); }
.pd-crumbs .sep {
display: inline-block; width: 8px; height: 8px; margin: 0 10px 2px;
border-top: 1px solid var(--gray-2); border-right: 1px solid var(--gray-2); transform: rotate(45deg);
}
.pd-crumbs .cur { color: #999; }
.pd-crumbs a:hover { color: var(--blue); }
.gallery { position: absolute; left: 309px; top: 91px; width: 600px; height: 400px; background: #fff; }
/* 非当前帧按原站停靠在 ±600px，用 600×400 遮罩裁掉，避免画到页面上 */
.gallery .g-mask { position: absolute; left: 0; top: 0; width: 600px; height: 400px; overflow: hidden; }
.gallery .g-slide { position: absolute; left: 0; top: 0; width: 600px; height: 400px; display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity .5s; }
.gallery .g-slide.on { opacity: 1; }
/* 原站 jssor fillType=Auto：图片按原尺寸居中，超出 600×400 才等比缩小（不放大、不裁切） */
.gallery .g-slide img { display: block; width: auto; height: auto; max-width: 600px; max-height: 400px; }
/* 原站轮播箭头 class=f-hide（display:none），截图里没有箭头，这里同样不显示 */
.gallery .g-arrow { display: none; }
/* 原站指示条：轮播下方 11px 处的 42×10 透明块，仅当前项显示为 42×4 灰条 */
.gallery .g-dots { position: absolute; left: 0; top: 411px; width: 600px; height: 10px; text-align: center; font-size: 0; }
.gallery .g-dots i { display: inline-block; width: 42px; height: 10px; margin: 0 5px; background: transparent; cursor: pointer; }
.gallery .g-dots i.on { background: linear-gradient(#5a5a5a 0 4px, transparent 4px); }
.pd-title { position: absolute; left: 150px; top: 526px; width: 900px; text-align: center; font: 700 22px/50px var(--font); color: var(--ink-3); }
.pd-content { position: absolute; left: 37px; top: 595px; width: 1125px; font: 400 16px/32px var(--font); color: var(--ink-3); }
.pd-content .lead { font: 700 20px/24px var(--font); margin-bottom: 9px; }
.pd-content p { margin: 0; }
.pd-nav { position: absolute; top: 697px; width: 480px; font: 400 12px/24px var(--font); color: var(--gray-2); }
.pd-nav.prev { left: 0; }
.pd-nav.next { left: 720px; text-align: right; }
.pd-nav svg { width: 12px; height: 12px; margin-right: 4px; fill: var(--gray-2); vertical-align: -1px; }
.pd-nav a:hover { color: var(--blue); }