@charset "utf-8";
/* ===========================================================
   鹰诺达 内页统一皮肤  ynd-inner.css   v2
   配色严格对齐站点：导航 #011d5c / logo 宝蓝 #243090 / logo 红 #e60012
   一套文件服务：文章列表・详情、产品列表・详情、专题页
   仅使用 .ynd- 前缀，不与全站 header/footer 冲突
   =========================================================== */
:root{
  --nav:#011d5c;          /* 主导航底色 */
  --brand:#243090;        /* logo 宝蓝 */
  --red:#e60012;          /* logo 红 */
  --red-d:#c1000f;
  --orange:#ff5919;       /* 导航悬停色 */
  --ink:#333333;
  --gray:#666666;
  --light:#999999;
  --line:#e8eaec;
  --bg:#f4f4f4;
  --soft:#f8f8f8;
}
.ynd-wrap{width:1200px;margin:0 auto}
.ynd-crumb{background:var(--soft);border-bottom:1px solid var(--line);font-size:13px;color:var(--light);line-height:44px}
.ynd-crumb a{color:var(--gray);transition:.2s}
.ynd-crumb a:hover{color:var(--red)}
.ynd-crumb em{font-style:normal;margin:0 6px;color:#c9c9c9}

/* ---------- 栏目头图 ---------- */
.ynd-band{position:relative;height:186px;overflow:hidden;background:var(--nav) center/cover no-repeat}
.ynd-band::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(1,29,92,.94) 0%,rgba(36,48,144,.80) 55%,rgba(1,29,92,.55) 100%)}
.ynd-band::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;
  background:linear-gradient(90deg,var(--red) 0%,var(--orange) 45%,rgba(255,89,25,0) 100%)}
.ynd-band .ynd-band-in{position:relative;z-index:2;width:1200px;margin:0 auto;height:100%;
  display:flex;flex-direction:column;justify-content:center;color:#fff}
.ynd-band h1{font-size:30px;font-weight:700;letter-spacing:1px;margin:0 0 12px;line-height:1.3;
  text-shadow:0 2px 10px rgba(0,0,0,.25)}
.ynd-band h1 s{text-decoration:none;position:relative}
.ynd-band h1 s::after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:3px;
  background:linear-gradient(90deg,var(--red),var(--orange));width:64px}
.ynd-band p{font-size:14px;color:rgba(255,255,255,.85);max-width:820px;line-height:1.9;margin:6px 0 0}

/* ---------- 主体两栏 ---------- */
.ynd-main{display:flex;align-items:flex-start;gap:28px;padding:26px 0 54px}
.ynd-side{width:262px;flex:0 0 262px}
.ynd-body{flex:1;min-width:0}

/* ---------- 侧栏 ---------- */
.ynd-sbox{background:#fff;border:1px solid var(--line);margin-bottom:18px;border-radius:3px;overflow:hidden}
.ynd-sbox .hd{height:48px;line-height:48px;padding:0 16px;font-size:16px;font-weight:700;color:#fff;
  background:var(--nav);position:relative}
.ynd-sbox .hd::after{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--red)}
.ynd-sbox .bd{padding:8px 0}
.ynd-snav li{border-bottom:1px dashed #eee}
.ynd-snav li:last-child{border-bottom:0}
.ynd-snav a{display:block;padding:11px 16px 11px 18px;font-size:14px;color:var(--ink);transition:.2s;position:relative}
.ynd-snav a:hover,.ynd-snav a.on{background:#fdf2f2;color:var(--red);padding-left:24px}
.ynd-snav a.on::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;background:var(--red)}
.ynd-slist li{padding:0 16px}
.ynd-slist a{display:block;padding:10px 0;font-size:13px;color:var(--gray);border-bottom:1px dashed #f0f0f0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:.2s}
.ynd-slist a:hover{color:var(--red)}
.ynd-slist li:last-child a{border-bottom:0}
.ynd-scontact{padding:16px;font-size:13px;color:var(--gray);line-height:2}
.ynd-scontact b{color:var(--nav);font-size:22px;display:block;margin:2px 0 6px;font-family:Arial,sans-serif}
.ynd-scontact b em{font-style:normal;color:var(--red)}
.ynd-tagsbd{padding:12px 14px;display:flex;flex-wrap:wrap;gap:8px}
.ynd-tagsbd a{display:inline-block;padding:0 14px;line-height:30px;height:30px;border-radius:30px;
  background:var(--soft);color:var(--gray);font-size:13px;transition:.25s}
.ynd-tagsbd a:hover{background:var(--red);color:#fff}

/* ---------- 产品网格 ---------- */
.ynd-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.ynd-card{background:#fff;border:1px solid var(--line);transition:.25s;overflow:hidden;border-radius:3px}
.ynd-card:hover{box-shadow:0 12px 28px rgba(1,29,92,.13);transform:translateY(-4px);border-color:#f3c4c0}
.ynd-card .pic{height:210px;overflow:hidden;background:var(--soft);display:block}
.ynd-card .pic img{width:100%;height:100%;object-fit:cover;transition:.55s}
.ynd-card:hover .pic img{transform:scale(1.07)}
.ynd-card .info{padding:12px 14px 16px}
.ynd-card .info h3{font-size:15px;font-weight:400;line-height:1.6;color:var(--ink);margin:0;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;height:48px}
.ynd-card:hover .info h3{color:var(--red)}
.ynd-card .info span{display:block;margin-top:8px;font-size:12px;color:var(--light)}
.ynd-card .info span i{font-style:normal;color:var(--orange)}
.ynd-card .info .desc{font-size:13px;color:#8a8a8a;line-height:1.85;margin:8px 0 0;height:48px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ynd-card .pic{display:block;position:relative}
.ynd-card .pic::after{content:"";position:absolute;inset:0;background:rgba(1,29,92,0);transition:.3s}
.ynd-card:hover .pic::after{background:rgba(1,29,92,.06)}
.ynd-grid.cols3{grid-template-columns:repeat(3,1fr);gap:20px}
.ynd-grid.cols3 .ynd-card .pic{height:200px}
.ynd-grid.cols3 .ynd-card .info h3{height:auto;max-height:52px}

/* ---------- 文章列表 ---------- */
.ynd-alist li{background:#fff;border:1px solid var(--line);margin-bottom:14px;padding:18px 20px;
  transition:.22s;display:flex;gap:20px;border-radius:3px}
.ynd-alist li:hover{box-shadow:0 8px 22px rgba(1,29,92,.09);border-color:#f3c4c0}
.ynd-alist .apic{width:180px;height:120px;flex:0 0 180px;overflow:hidden;background:var(--soft)}
.ynd-alist .apic img{width:100%;height:100%;object-fit:cover;transition:.45s}
.ynd-alist li:hover .apic img{transform:scale(1.06)}
.ynd-alist .atxt{flex:1;min-width:0}
.ynd-alist h3{font-size:17px;font-weight:500;margin:0 0 10px;line-height:1.5}
.ynd-alist h3 a{color:#222;transition:.2s}
.ynd-alist h3 a:hover{color:var(--red)}
.ynd-alist p{font-size:13px;color:#888;line-height:1.9;margin:0 0 10px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ynd-alist .meta{font-size:12px;color:#b0b0b0}
.ynd-alist .meta em{font-style:normal;margin-right:16px}
.ynd-alist .meta a{color:var(--orange)}

/* ---------- 分页 ---------- */
.ynd-page{text-align:center;margin:32px 0 0}
.ynd-page ul{display:inline-flex;gap:8px;flex-wrap:wrap;justify-content:center}
.ynd-page li a,.ynd-page li span{display:block;min-width:38px;height:38px;line-height:38px;padding:0 12px;
  border:1px solid #e0e0e0;color:var(--gray);font-size:13px;background:#fff;transition:.2s;border-radius:2px}
.ynd-page li a:hover,.ynd-page li.active span{background:var(--red);border-color:var(--red);color:#fff}

/* ---------- 详情页 ---------- */
.ynd-detail{background:#fff;border:1px solid var(--line);padding:30px 36px 40px;border-radius:3px}
.ynd-detail h1{font-size:26px;line-height:1.55;color:#1a1a1a;margin:0 0 16px;font-weight:700}
.ynd-dmeta{font-size:12px;color:#aaa;padding-bottom:16px;border-bottom:1px solid #eee;margin-bottom:22px}
.ynd-dmeta em{font-style:normal;margin-right:20px}
.ynd-dmeta a{color:var(--orange)}
.ynd-summary{background:#fdf4f3;border-left:3px solid var(--red);padding:14px 18px;font-size:14px;
  color:#555;line-height:1.95;margin-bottom:24px;border-radius:0 3px 3px 0}
.ynd-summary b{color:var(--nav)}
.ynd-content{font-size:15px;color:var(--ink);line-height:2}
.ynd-content p{margin:0 0 16px}
.ynd-content img{max-width:100%;height:auto;display:block;margin:18px auto;border-radius:2px}
.ynd-content h2{font-size:20px;margin:32px 0 14px;padding-left:12px;border-left:4px solid var(--red);
  line-height:1.45;color:var(--nav)}
.ynd-content h3{font-size:17px;margin:24px 0 12px;color:#222;padding-left:10px;border-left:3px solid #dfe3ec}
.ynd-content table{width:100%;border-collapse:collapse;margin:18px 0;font-size:14px}
.ynd-content td,.ynd-content th{border:1px solid #e5e5e5;padding:10px 12px;line-height:1.8}
.ynd-content th{background:#f3f5fa;color:var(--nav);font-weight:600;text-align:left}
.ynd-content tr:nth-child(even) td{background:#fbfbfc}
.ynd-content ul,.ynd-content ol{padding-left:22px;margin:0 0 16px}
.ynd-content li{margin-bottom:8px}
.ynd-content a{color:var(--brand);border-bottom:1px dashed #c9cfe3}
.ynd-content a:hover{color:var(--red);border-bottom-color:var(--red)}
.ynd-content blockquote{margin:18px 0;padding:12px 18px;background:var(--soft);border-left:3px solid #d9dde7;color:#666;font-size:14px}
.ynd-content strong{color:#1a1a1a}

/* 规格参数卡片 */
.ynd-facts{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);
  border:1px solid var(--line);margin:20px 0;border-radius:3px;overflow:hidden}
.ynd-facts div{background:#fff;padding:12px 16px;font-size:14px;color:var(--gray);line-height:1.8}
.ynd-facts div b{color:var(--nav);display:inline-block;min-width:76px}

/* 定制流程步骤 */
.ynd-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:22px 0}
.ynd-steps div{background:var(--soft);border-radius:3px;padding:16px 12px;text-align:center;position:relative}
.ynd-steps div::after{content:"";position:absolute;right:-10px;top:50%;width:8px;height:8px;
  border-top:2px solid #d5d9e3;border-right:2px solid #d5d9e3;transform:translateY(-50%) rotate(45deg)}
.ynd-steps div:last-child::after{display:none}
.ynd-steps i{display:block;font-style:normal;font-size:20px;font-weight:700;color:var(--red);
  font-family:Arial,sans-serif;margin-bottom:6px}
.ynd-steps span{font-size:13px;color:var(--gray)}

/* 问答 */
.ynd-faq{margin:20px 0}
.ynd-faq dt{font-size:15px;color:var(--nav);font-weight:600;padding-left:26px;position:relative;margin:16px 0 8px}
.ynd-faq dt::before{content:"Q";position:absolute;left:0;top:1px;width:18px;height:18px;line-height:18px;
  text-align:center;background:var(--red);color:#fff;font-size:12px;border-radius:2px}
.ynd-faq dd{margin:0 0 4px;padding-left:26px;font-size:14px;color:var(--gray);line-height:1.95;position:relative}
.ynd-faq dd::before{content:"A";position:absolute;left:0;top:3px;width:18px;height:18px;line-height:18px;
  text-align:center;background:var(--nav);color:#fff;font-size:12px;border-radius:2px}

/* 底部咨询条 */
.ynd-cta{margin:26px 0 0;padding:22px 26px;border-radius:3px;color:#fff;
  background:linear-gradient(100deg,var(--nav) 0%,var(--brand) 70%,#2f3fa8 100%);
  display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.ynd-cta p{margin:0;font-size:15px;line-height:1.8}
.ynd-cta p b{font-size:20px;color:#ffd9d4;display:block;margin-bottom:4px}
.ynd-cta .ynd-btn{background:var(--red);flex:0 0 auto}

/* ---------- 产品图集 ---------- */
.ynd-gallery{display:flex;gap:24px;margin-bottom:26px}
.ynd-gal-main{width:430px;flex:0 0 430px;border:1px solid var(--line);background:#fafafa;border-radius:3px;overflow:hidden}
.ynd-gal-main img{width:100%;height:430px;object-fit:contain;display:block}
.ynd-gal-thumbs{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.ynd-gal-thumbs img{width:76px;height:76px;object-fit:cover;border:2px solid transparent;cursor:pointer;border-radius:2px}
.ynd-gal-thumbs img.on{border-color:var(--red)}
.ynd-gal-info{flex:1;min-width:0}
.ynd-gal-info h1{font-size:24px;line-height:1.5;color:#1a1a1a;margin:0 0 14px;font-weight:700}
.ynd-gal-info .tags{font-size:13px;color:var(--gray);line-height:2.2;margin-bottom:18px;
  border-top:1px dashed #eaeaea;padding-top:14px}
.ynd-gal-info .tags b{color:var(--nav);font-weight:600;display:inline-block;min-width:64px}
.ynd-btn{display:inline-block;padding:0 32px;height:46px;line-height:46px;background:var(--red);
  color:#fff;font-size:15px;border-radius:2px;transition:.25s;border:0;cursor:pointer}
.ynd-btn:hover{background:var(--red-d);color:#fff;transform:translateY(-1px)}
.ynd-btn.ghost{background:#fff;color:var(--nav);border:1px solid var(--nav);margin-left:10px}
.ynd-btn.ghost:hover{background:var(--nav);color:#fff}

/* ---------- 上下篇 / 相关 ---------- */
.ynd-pn{display:flex;gap:16px;margin-top:26px;font-size:14px}
.ynd-pn a{flex:1;padding:14px 18px;background:#fff;border:1px solid var(--line);color:var(--gray);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:.2s;border-radius:3px}
.ynd-pn a:hover{color:var(--red);border-color:#f3c4c0}
.ynd-pn a span{color:#bbb;margin-right:8px}
.ynd-rel{margin-top:30px}
.ynd-rel .hd{font-size:18px;font-weight:700;color:var(--nav);margin-bottom:16px;padding-left:12px;
  border-left:4px solid var(--red);line-height:1.3}
.ynd-rel ul{display:grid;grid-template-columns:repeat(2,1fr);gap:10px 24px}
.ynd-rel li{font-size:14px;line-height:1.9;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  position:relative;padding-left:14px}
.ynd-rel li::before{content:"";position:absolute;left:0;top:12px;width:5px;height:5px;background:var(--orange);border-radius:50%}
.ynd-rel li a{color:var(--gray)}
.ynd-rel li a:hover{color:var(--red)}

/* ---------- 空状态 / 返回顶部 ---------- */
.ynd-empty{padding:60px 0;text-align:center;color:#aaa;font-size:14px}
.ynd-top{position:fixed;right:24px;bottom:90px;width:44px;height:44px;line-height:44px;text-align:center;
  background:var(--nav);color:#fff;font-size:18px;cursor:pointer;opacity:0;visibility:hidden;
  transition:.3s;z-index:99;border-radius:2px}
.ynd-top.show{opacity:1;visibility:visible}
.ynd-top:hover{background:var(--red)}

/* 图片占位（加载失败兜底） */
img.ynd-imgfallback{background:url(data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='300'%3E%3Crect width='400' height='300' fill='%23f4f4f4'/%3E%3Ctext x='200' y='155' font-size='16' fill='%23bbbbbb' text-anchor='middle'%3E%E5%9B%BE%E7%89%87%E5%8A%A0%E8%BD%BD%E4%B8%AD%3C/text%3E%3C/svg%3E) center/cover no-repeat}

/* ---------- 响应式 ---------- */
@media (max-width:1240px){.ynd-wrap,.ynd-band .ynd-band-in{width:100%;padding:0 16px;box-sizing:border-box}}
@media (max-width:980px){
  .ynd-main{flex-direction:column}
  .ynd-side{width:100%;flex:none}
  .ynd-grid,.ynd-grid.cols3{grid-template-columns:repeat(2,1fr)}
  .ynd-gallery{flex-direction:column}
  .ynd-gal-main{width:100%;flex:none}
  .ynd-gal-main img{height:auto}
  .ynd-alist li{flex-direction:column;gap:12px}
  .ynd-alist .apic{width:100%;flex:none;height:180px}
  .ynd-detail{padding:20px 18px 30px}
  .ynd-detail h1{font-size:20px}
  .ynd-band h1{font-size:22px}
  .ynd-steps{grid-template-columns:repeat(3,1fr)}
  .ynd-steps div::after{display:none}
  .ynd-facts{grid-template-columns:1fr}
  .ynd-rel ul{grid-template-columns:1fr}
  .ynd-cta{flex-direction:column;align-items:flex-start}
}
@media (max-width:560px){
  .ynd-grid,.ynd-grid.cols3{grid-template-columns:1fr}
  .ynd-card .pic{height:240px}
  .ynd-steps{grid-template-columns:repeat(2,1fr)}
}