/* ==========================================================================
   新御环保 · 项目案例页 统一样式表
   --------------------------------------------------------------------------
   【命名与隔离规则】
   1) 所有类选择器均带 ny- 前缀（如 .ny-wrap / .ny-pcard），避免与原网站类名冲突。
   2) 所有 CSS 变量均带 ny- 前缀（如 --ny-brand），避免与原站变量同名被覆盖。
   3) 必须以 body.ny-root 作为根作用域：样式只对 <body class="ny-root"> 内的内容生效，
      因此嵌入原网站时，请把页面主体包一层 <div class="ny-root">，或再加一条 body.ny-root 规则。
      目前仅剩 :root（变量定义）与 html{scroll-behavior:smooth} 两条为全局，可按需删除。

   【如何统一调整配色】
   1) 只改下面 :root 里的变量即可全局生效，不需要逐个页面修改。
   2) --ny-brand / --ny-brand-2 是品牌主色与辅助色，改这两个即可整体换色；
      若换成暖色系，建议同步改 --ny-brand-deep（表头文字）与 --ny-shadow / --ny-shadow-card 的色相。
   3) 想做深色版：把 --ny-bg / --ny-surface / --ny-ink / --ny-muted / --ny-line 一组改成
      深底浅字即可，其余变量会自动跟随。
   ========================================================================== */

:root{
  /* ---------- 品牌主色 ---------- */
  --ny-brand:#0056b3;          /* 主色：品牌青（标题强调、KPI 数字、表头）#0b6a74 */
  --ny-brand-2:#3d8fdd;        /* 辅助色：亮青（章节序号、流程节点顶边）#12a3a8 */
  --ny-brand-deep:#003d80;     /* 深主色：表头文字 #0b4a52*/
  --ny-brand-soft:#eaf2fc;     /* 浅主色：表头底、按钮底、勾号底#eaf5f6 */

  /* ---------- 文字（统一偏冷蓝灰，与主色同调） ---------- */
  --ny-ink:#0f1a28;            /* 正文 */
  --ny-ink-2:#1c2e42;          /* 次级正文 */
  --ny-muted:#5a6b7d;          /* 说明文字 */
  --ny-muted-2:#8494a3;        /* 弱说明（图注、页脚） */
  --ny-muted-3:#97a7b5;        /* 极弱（步骤序号） */
  
  /* ---------- 背景与线条 ---------- */
  --ny-bg:#ffffff;             /* 页面底色 */
  --ny-surface:#f5f8fc;        /* 浅背景块（统计条、页脚、chips） */
  --ny-line:#e2e9f2;           /* 分割线 / 边框 */
  --ny-line-strong:#cfdff1;    /* 表头下边线（比 line 略带蓝） */
  --ny-border-soft:#c6d9ee;    /* 浅边框（按钮、卡片 hover） */
  --ny-divider:#dbe5f0;        /* 统计条内分隔线 */
  --ny-arrow:#b3c7dd;          /* 流程箭头 */

  /* ---------- 其他 ---------- */
  --ny-radius:14px;            /* 圆角 */
  --ny-maxw:1160px;            /* 内容最大宽度 */
  --ny-shadow:0 22px 48px -28px rgba(122,90,30,.42);   /* 图片阴影（暖褐，与 --ny-brand-deep 同色相） */
  --ny-shadow-card:0 22px 40px -26px rgba(122,90,30,.38); /* 卡片 hover 阴影 */
}

/* ============================ 基础 ============================ */
.ny-root *{box-sizing:border-box}
/* 页面平滑滚动：全局行为，如需完全隔离可删除本条 */
html{scroll-behavior:smooth}
.ny-root{margin:0;background:var(--ny-bg);color:var(--ny-ink);overflow-x:hidden;
  font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Source Han Sans SC",system-ui,-apple-system,sans-serif;
  font-size:16px;line-height:1.75;-webkit-font-smoothing:antialiased}
.ny-root img{max-width:100%;display:block}
.ny-root a{color:inherit;text-decoration:none}
.ny-wrap{max-width:var(--ny-maxw);margin:0 auto;padding:0 32px}

/* ============================ 顶部导航 ============================ */
.ny-nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:saturate(1.6) blur(12px);border-bottom:1px solid var(--ny-line)}
.ny-nav .ny-wrap{display:flex;align-items:center;justify-content:space-between;height:66px}
.ny-brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.02em}
.ny-brand .ny-mark{width:30px;height:30px;flex:0 0 auto;color:var(--ny-brand)}
.ny-brand small{display:block;font-weight:400;font-size:11px;color:var(--ny-muted);letter-spacing:.14em;line-height:1.2}
.ny-nav-sec{display:flex;gap:26px;font-size:14px;color:var(--ny-muted)}
.ny-nav-sec a:hover{color:var(--ny-brand)}
.ny-nav-back{flex:0 0 auto;white-space:nowrap;font-size:13px;color:var(--ny-brand);border:1px solid var(--ny-border-soft);background:var(--ny-brand-soft);padding:7px 14px;border-radius:999px}

/* ============================ Hero ============================ */
.ny-hero{padding:64px 0 44px;border-bottom:1px solid var(--ny-line);background:
  radial-gradient(900px 320px at 88% -10%, var(--ny-brand-soft) 0%, rgba(255,255,255,0) 70%),var(--ny-bg)}
.ny-hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:52px;align-items:center}
.ny-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;letter-spacing:.16em;color:var(--ny-brand);text-transform:uppercase}
.ny-eyebrow:before{content:"";width:22px;height:1px;background:var(--ny-brand-2)}
.ny-root h1{font-size:34px;line-height:1.35;margin:16px 0 14px;letter-spacing:-.01em;font-weight:700}
.ny-lede{color:var(--ny-muted);font-size:16px;margin:0 0 22px;max-width:52ch}
.ny-meta{display:flex;flex-wrap:wrap;gap:8px 10px;list-style:none;padding:0;margin:0 0 20px}
.ny-meta li{font-size:13px;color:var(--ny-ink-2);background:var(--ny-surface);border:1px solid var(--ny-line);padding:6px 12px;border-radius:999px}
.ny-meta li b{font-weight:600;color:var(--ny-brand)}
.ny-chips{display:flex;flex-wrap:wrap;gap:8px}
.ny-chip{font-size:12.5px;color:var(--ny-brand);background:var(--ny-bg);border:1px solid var(--ny-border-soft);padding:5px 11px;border-radius:6px}
figure.ny-shot{margin:0}
figure.ny-shot .ny-frame{border-radius:18px;overflow:hidden;border:1px solid var(--ny-line);box-shadow:var(--ny-shadow)}
figure.ny-shot img{width:100%;height:100%;object-fit:cover;aspect-ratio:16/10}
figure.ny-shot figcaption{font-size:12px;color:var(--ny-muted-2);margin-top:10px;line-height:1.6}

/* ============================ KPI 统计条 ============================ */
.ny-stats{border-bottom:1px solid var(--ny-line);background:var(--ny-surface)}
.ny-stats .ny-wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:0;padding-top:26px;padding-bottom:26px}
.ny-stat{padding:2px 26px;border-left:1px solid var(--ny-divider)}
.ny-stat:first-child{border-left:0;padding-left:0}
.ny-stat b{display:block;font-size:25px;color:var(--ny-brand);letter-spacing:-.01em;line-height:1.3}
.ny-stat span{font-size:12.5px;color:var(--ny-muted)}

/* ============================ 章节 ============================ */
section.ny-block{padding:56px 0;border-bottom:1px solid var(--ny-line)}
.ny-sec-head{display:flex;align-items:baseline;gap:14px;margin-bottom:28px}
.ny-sec-num{font-size:12px;letter-spacing:.14em;color:var(--ny-brand-2);font-weight:600}
.ny-sec-head h2{font-size:23px;margin:0;letter-spacing:-.01em}
.ny-sec-head p{margin:0;color:var(--ny-muted);font-size:14px}

.ny-two-col{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:start}
.ny-prose p{margin:0 0 16px;color:var(--ny-ink-2)}
.ny-prose p:last-child{margin-bottom:0}
.ny-prose strong{color:var(--ny-brand);font-weight:600}
.ny-facts{border:1px solid var(--ny-line);border-radius:var(--ny-radius);overflow:hidden}
.ny-facts .ny-row{display:grid;grid-template-columns:104px 1fr;gap:14px;padding:12px 18px;border-bottom:1px solid var(--ny-line);font-size:14px;align-items:center}
.ny-facts .ny-row:last-child{border-bottom:0}
.ny-facts .ny-row:nth-child(odd){background:var(--ny-surface)}
.ny-facts dt{color:var(--ny-muted);font-size:13px;margin:0}
.ny-facts dd{margin:0;color:var(--ny-ink);line-height:1.6}

/* ============================ 工艺流程 ============================ */
.ny-flow{display:flex;flex-direction:column;gap:9px;margin:4px 0 8px}
.ny-flow-row{display:flex;align-items:stretch;gap:7px}
.ny-flow-row .ny-step{flex:1 1 0;min-width:0}
.ny-step{position:relative;background:var(--ny-bg);border:1px solid var(--ny-line);border-top:2px solid var(--ny-brand-2);
  border-radius:10px;padding:11px 14px 11px}
.ny-step.ny-ghost{visibility:hidden;border-color:transparent}
.ny-step i{font-style:normal;display:block;font-size:10.5px;letter-spacing:.12em;color:var(--ny-muted-3);margin-bottom:2px}
.ny-step span{font-size:14px;font-weight:500;color:var(--ny-ink)}
.ny-arrow{align-self:center;flex:0 0 auto;color:var(--ny-arrow);font-size:14px;padding:0}
.ny-arrow.ny-ghost{visibility:hidden}
.ny-flow-note{font-size:13px;color:var(--ny-muted);margin:14px 0 0}
.ny-sys{border:1px solid var(--ny-line);border-radius:var(--ny-radius);padding:20px 22px;margin-bottom:14px;background:var(--ny-bg)}
.ny-sys h3{margin:0 0 4px;font-size:15.5px;color:var(--ny-brand)}
.ny-sys .ny-sub{font-size:12.5px;color:var(--ny-muted);margin:0 0 14px}
.ny-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:26px}
.ny-card{border:1px solid var(--ny-line);border-radius:12px;padding:18px 18px 16px;background:var(--ny-bg)}
.ny-card h4{margin:0 0 8px;font-size:14.5px;color:var(--ny-brand)}
.ny-card p{margin:0;font-size:13.5px;color:var(--ny-muted);line-height:1.7}

/* ============================ 表格 ============================ */
.ny-tbl-wrap{overflow-x:auto;border:1px solid var(--ny-line);border-radius:var(--ny-radius)}
.ny-root table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:560px}
.ny-root thead th{background:var(--ny-brand-soft);color:var(--ny-brand-deep);font-weight:600;text-align:left;padding:12px 14px;border-bottom:1px solid var(--ny-line-strong);white-space:nowrap}
.ny-root tbody td{padding:11px 14px;border-bottom:1px solid var(--ny-line);color:var(--ny-ink-2)}
.ny-root tbody tr:last-child td{border-bottom:0}
.ny-root tbody tr:nth-child(even){background:var(--ny-surface)}
.ny-root tbody td:first-child{color:var(--ny-ink);font-weight:500}
.ny-root caption{caption-side:top;text-align:left;font-size:13px;color:var(--ny-muted);padding:0 0 10px}
.ny-tbl-note{font-size:12.5px;color:var(--ny-muted-2);margin-top:10px;line-height:1.7}

/* ============================ 项目成效 ============================ */
.ny-result{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.ny-rcard{display:flex;gap:14px;border:1px solid var(--ny-line);border-radius:12px;padding:18px 20px;background:var(--ny-bg)}
.ny-rcard .ny-tick{flex:0 0 22px;height:22px;border-radius:50%;background:var(--ny-brand-soft);color:var(--ny-brand);display:flex;align-items:center;justify-content:center;font-size:12px;margin-top:3px}
.ny-rcard h4{margin:0 0 4px;font-size:14px}
.ny-rcard p{margin:0;font-size:13.5px;color:var(--ny-muted);line-height:1.7}

/* ============================ 页脚 ============================ */
.ny-root footer{background:var(--ny-surface);padding:34px 0 40px}
.ny-root footer .ny-wrap{display:flex;justify-content:space-between;gap:32px;align-items:flex-start}
.ny-root footer .ny-src{font-size:12.5px;color:var(--ny-muted);max-width:64ch;line-height:1.8}
.ny-root footer .ny-src b{color:var(--ny-ink-2);font-weight:600}
.ny-root footer .ny-sig{font-size:12.5px;color:var(--ny-muted-2);text-align:right;line-height:1.9;white-space:nowrap}

/* ============================ 案例库索引 ============================ */
.ny-ih{max-width:760px;margin:0 auto;text-align:center;padding:70px 0 30px}
.ny-ih .ny-eyebrow{justify-content:center}
.ny-ih h1{font-size:38px}
.ny-ih .ny-lede{margin-left:auto;margin-right:auto}
.ny-igrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;padding:26px 0 20px}
.ny-pcard{border:1px solid var(--ny-line);border-radius:16px;overflow:hidden;background:var(--ny-bg);transition:transform .35s ease,box-shadow .35s ease,border-color .35s}
.ny-pcard:hover{transform:translateY(-4px);box-shadow:var(--ny-shadow-card);border-color:var(--ny-border-soft)}
.ny-pcard .ny-thumb{aspect-ratio:16/10;overflow:hidden}
.ny-pcard .ny-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.ny-pcard:hover .ny-thumb img{transform:scale(1.04)}
.ny-pcard .ny-body{padding:18px 20px 20px}
.ny-pcard .ny-tag{font-size:11.5px;letter-spacing:.1em;color:var(--ny-brand);text-transform:uppercase}
.ny-pcard h3{margin:8px 0 8px;font-size:16px;line-height:1.5;font-weight:600;min-height:48px}
.ny-pcard p{margin:0;font-size:13px;color:var(--ny-muted);line-height:1.65;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ny-pcard .ny-kv{display:flex;gap:16px;margin-top:14px;padding-top:14px;border-top:1px solid var(--ny-line)}
.ny-pcard .ny-kv div{font-size:12px;color:var(--ny-muted)}
.ny-pcard .ny-kv b{display:block;font-size:15px;color:var(--ny-ink);font-weight:600}
.ny-ifoot{margin-top:26px;padding:26px 0 60px;font-size:12.5px;color:var(--ny-muted-2);text-align:center;border-top:1px solid var(--ny-line)}

/* ============================ 响应式 ============================ */
@media (max-width:980px){
  .ny-hero-grid,.ny-two-col{grid-template-columns:1fr;gap:32px}
  .ny-stats .ny-wrap{grid-template-columns:repeat(2,1fr);gap:20px 0}
  .ny-stat:nth-child(3){border-left:0;padding-left:0}
  .ny-cards,.ny-result{grid-template-columns:1fr}
  .ny-igrid{grid-template-columns:repeat(2,1fr)}
  .ny-nav-sec{display:none}
  .ny-root h1{font-size:27px}
  footer .ny-wrap{flex-direction:column}
  footer .ny-sig{text-align:left}
}
@media (max-width:640px){
  .ny-wrap{padding:0 20px}
  .ny-igrid{grid-template-columns:1fr}
  .ny-facts .ny-row{grid-template-columns:88px 1fr}
  .ny-root h1{font-size:23px}
  .ny-ih h1{font-size:28px}
  .ny-root table{min-width:480px}
}

/* ============================ 打印 ============================ */
@media print{
  .ny-nav{position:static;backdrop-filter:none}
  .ny-pcard:hover{transform:none;box-shadow:none}
  section.ny-block{padding:28px 0}
  body.ny-root{font-size:12px}
  .ny-nav-back{display:none}
}