/* ═══════════════════════════════════════════
   media.css — 视频 / 附件 / PDF预览 / 案例 / 详情进阶
═══════════════════════════════════════════ */

/* ── 阅读进度条（详情页顶部）── */
.read-progress{
  position:fixed;top:0;left:0;height:2px;width:0;z-index:60;
  background:linear-gradient(90deg,var(--red),#ff5a5a);
  box-shadow:0 0 12px rgba(204,0,0,.6);transition:width .1s linear;
}

/* ── 视频 ── */
.media-video{ max-width:820px;margin:0 auto 8px;padding:0 var(--gutter,24px); }
.media-video video{
  width:100%;display:block;background:#000;
  border:0.5px solid var(--border);border-radius:2px;
}

/* ── 附件区 ── */
.media-attachments{ max-width:820px;margin:8px auto 48px;padding:0 var(--gutter,24px); }
.media-attach-title{
  display:flex;align-items:center;gap:10px;
  font-family:var(--serif);font-size:20px;font-weight:400;color:var(--white);
  margin:0 0 20px;padding-bottom:12px;border-bottom:0.5px solid var(--border);
}
.media-attach-title svg{color:var(--red)}
.media-attach-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.media-attach-card{
  display:flex;align-items:center;gap:14px;
  background:var(--surface);border:0.5px solid var(--border);
  padding:16px 18px;transition:border-color .3s,transform .3s,background .3s;
}
.media-attach-card:hover{border-color:rgba(204,0,0,.4);background:var(--card);transform:translateY(-2px)}
.media-attach-badge{
  flex:none;width:52px;height:52px;border-radius:3px;
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:13px;font-weight:700;letter-spacing:.02em;
}
.media-attach-info{flex:1;min-width:0}
.media-attach-name{
  font-size:14px;color:var(--t1);line-height:1.4;margin:0 0 4px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.media-attach-size{font-size:12px;color:var(--t3);margin:0}
.media-attach-actions{display:flex;gap:8px;flex:none}
.media-attach-btn{
  font-size:12px;padding:7px 14px;border:0.5px solid var(--border-md);
  color:var(--t2);background:transparent;cursor:pointer;transition:all .25s;text-decoration:none;
}
.media-attach-btn:hover{border-color:var(--red);color:var(--red)}
.media-attach-btn-primary{background:var(--red);border-color:var(--red);color:#fff}
.media-attach-btn-primary:hover{background:#a30000;border-color:#a30000;color:#fff}

/* ── PDF 预览弹层 ── */
.pdf-modal{
  position:fixed;inset:0;z-index:200;display:none;
  background:rgba(0,0,0,.82);backdrop-filter:blur(6px);
  flex-direction:column;
}
.pdf-modal.show{display:flex}
.pdf-modal-bar{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:14px 22px;background:var(--deep);border-bottom:0.5px solid var(--border);
}
.pdf-modal-name{font-size:14px;color:var(--t1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pdf-modal-tools{display:flex;align-items:center;gap:18px;flex:none}
.pdf-modal-link{font-size:13px;color:var(--red);text-decoration:none}
.pdf-modal-close{background:none;border:none;color:var(--t2);font-size:30px;line-height:1;cursor:pointer;transition:color .2s}
.pdf-modal-close:hover{color:#fff}
.pdf-modal-body{flex:1;min-height:0;padding:18px}
.pdf-modal-body iframe{width:100%;height:100%;border:0.5px solid var(--border);background:#fff;border-radius:2px}

.news-detail-body video,.case-detail-body video{
  width:100%;border:0.5px solid var(--border);margin:24px 0;background:#000;
}

/* ═══════════════════════════════════════════
   案例列表 / 详情（复用 news 主题）
═══════════════════════════════════════════ */
.case-hero{
  position:relative;z-index:1;overflow:hidden;display:flex;align-items:center;
  min-height:300px;
  padding:calc(var(--nav-h) + 40px) 0 48px;
  background:#080808;border-bottom:0.5px solid var(--border);
}
/* 背景图层（红色城市/电路 banner）*/
.case-hero::before{
  content:'';position:absolute;inset:0;z-index:-2;
  background:url('../img/case-hero.png') center center/cover no-repeat;
  filter:brightness(.72) saturate(1.05);transform:scale(1.03);
}
/* 渐变遮罩：左侧压暗放标题，上下与导航/卡片区自然衔接 */
.case-hero::after{
  content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(90deg, rgba(8,8,8,.94) 0%, rgba(8,8,8,.74) 36%, rgba(8,8,8,.28) 68%, rgba(8,8,8,.5) 100%),
    linear-gradient(180deg, rgba(8,8,8,.8) 0%, transparent 24%, transparent 58%, rgba(8,8,8,.98) 100%);
}
.case-hero .container{position:relative;z-index:2;width:100%}
.case-hero .label{margin-bottom:18px}
.case-hero .display{text-shadow:0 2px 36px rgba(0,0,0,.7)}
@media(max-width:767px){
  .case-hero{min-height:300px}
  .case-hero::after{background:
    linear-gradient(90deg, rgba(8,8,8,.86), rgba(8,8,8,.55)),
    linear-gradient(180deg, rgba(8,8,8,.7) 0%, transparent 30%, rgba(8,8,8,.98) 100%);}
}
.cases-page-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:var(--border);border:0.5px solid var(--border);margin-bottom:40px;
}
.cases-page-card{background:var(--deep);position:relative;overflow:hidden;transition:background var(--transition)}
.cases-page-card:hover{background:var(--surface)}
.cases-page-thumb{display:block;position:relative;padding-top:64%;overflow:hidden}
.cases-page-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.78) saturate(.7);transition:transform .55s ease,filter .4s}
.cases-page-card:hover .cases-page-thumb img{transform:scale(1.05);filter:brightness(.92) saturate(.85)}
.cases-page-badge{
  position:absolute;top:12px;left:12px;z-index:1;font-size:10px;letter-spacing:.12em;color:var(--gold);
  background:rgba(8,8,8,.78);border:0.5px solid rgba(201,168,76,.35);padding:3px 10px;backdrop-filter:blur(4px);
}
.cases-page-vidflag{position:absolute;top:12px;right:12px;z-index:1;width:34px;height:34px;border-radius:50%;background:rgba(8,8,8,.7);border:0.5px solid var(--border);display:flex;align-items:center;justify-content:center}
.cases-page-vidflag svg{color:#fff}
.cases-page-body{padding:22px 24px 28px}
.cases-page-meta{font-size:11px;color:var(--t3);letter-spacing:.04em;margin-bottom:10px}
.cases-page-title{font-size:16px;font-weight:400;color:var(--white);line-height:1.5;margin-bottom:12px}
.cases-page-card:hover .cases-page-title{color:var(--gold)}
.cases-page-chips{display:flex;flex-wrap:wrap;gap:6px}
.cases-page-chip{font-size:11px;color:var(--t2);background:var(--surface);border:0.5px solid var(--border);padding:3px 9px}

.case-detail-cover{width:100%;max-height:520px;overflow:hidden;border-top:0.5px solid var(--border);border-bottom:0.5px solid var(--border)}
.case-detail-cover img{width:100%;height:100%;object-fit:cover;filter:brightness(.9) saturate(.88)}
.case-spec{
  max-width:820px;margin:40px auto 0;padding:0 var(--gutter,24px);
  display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1px;background:var(--border);border:0.5px solid var(--border);
}
.case-spec-item{background:var(--deep);padding:20px 22px}
.case-spec-label{font-size:11px;color:var(--t3);letter-spacing:.1em;text-transform:uppercase;margin-bottom:8px}
.case-spec-value{font-size:15px;color:var(--white);font-weight:400}
.case-detail-body{padding-top:48px;padding-bottom:48px;max-width:820px;margin:0 auto}
.case-detail-body h2{font-family:var(--serif);