/* ============ 吉祥探盘 视频模块样式 ============ */

/* 视频卡片（竖屏封面） */
.video-card{cursor:pointer}
.video-cover{aspect-ratio:3/4;background:#0d1b4f;overflow:hidden;display:flex;align-items:center;justify-content:center;position:relative}
.video-cover video{width:100%;height:100%;object-fit:cover;display:block}
.video-cover:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 60%,rgba(0,0,0,.25));pointer-events:none}
.video-card:hover .video-cover{filter:brightness(1.05)}
.video-cover-ph{background:linear-gradient(135deg,#1a3a8f,#0e5fa8)}
.video-cover-ph:after{content:'▶';color:#fff;font-size:36px;opacity:.9}

/* 列表页介绍文字 */
.video-intro{font-size:13.5px;line-height:1.85;color:var(--text2);margin:2px 0 18px;max-width:100%}

/* 列表页区域筛选 */
.video-filter{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.video-filter .vf-opt{font-size:13px;padding:6px 16px;border-radius:20px;border:1px solid var(--border);background:#fff;cursor:pointer;color:var(--text2);transition:all .2s;user-select:none}
.video-filter .vf-opt:hover{border-color:var(--primary);color:var(--primary)}
.video-filter .vf-opt.active{background:var(--primary);color:#fff;border-color:var(--primary)}

/* 列表页搜索栏（复用全站 .search-box 样式） */
.video-search-row{margin-bottom:18px;max-width:560px}

/* 弹窗：左竖屏视频 + 右信息（整站主色调·左右分栏） */
.video-modal{position:fixed;inset:0;z-index:9999;display:none}
.video-modal.show{display:block}
.video-modal-mask{position:absolute;inset:0;background:rgba(0,0,0,.6);animation:fadeIn .2s}
.video-modal-box{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:row;background:#fff;border:5px solid rgba(24,95,165,.45);border-radius:16px;overflow:hidden;width:94%;max-width:760px;max-height:90vh;box-shadow:0 16px 48px rgba(0,0,0,.3);animation:slideUp .25s}
.video-modal-media{flex:0 0 300px;width:300px;align-self:stretch;background:#000;aspect-ratio:9/16;max-height:90vh;display:flex;align-items:center;justify-content:center}
.video-modal-media video{width:100%;height:100%;object-fit:contain;display:block;background:#000}
.video-modal-info{flex:1;min-width:0;background:linear-gradient(180deg,#f5f8fc 0%,#eaf1f9 100%);padding:28px 26px;color:#1a2332;overflow:auto;display:flex;flex-direction:column;justify-content:space-between}
.video-modal-info .v-top{display:flex;flex-direction:column}
.video-modal-info .v-area{font-size:13px;color:#7a8699;margin-bottom:14px;letter-spacing:.5px}
.video-modal-info h3{font-size:20px;font-weight:700;margin:0 0 16px;line-height:1.4;color:#172033}
.video-modal-info .v-desc{margin:0;display:flex;flex-direction:column;gap:10px}
.video-modal-info .v-li{font-size:14px;line-height:1.7;color:#4a5568;display:flex;gap:8px;align-items:flex-start}
.video-modal-info .v-li .dash{color:#185FA5;font-weight:700;flex:0 0 auto;line-height:1.7}
.video-modal-info .v-date{font-size:12px;color:#9aa3b2;margin-top:14px}
.video-modal-info .v-cta{margin-top:0}
.v-cta:before{content:'';display:block;height:1px;background:linear-gradient(90deg,transparent,#cfe0f2,transparent);margin-bottom:16px}
.cta-row{display:flex;flex-direction:column;gap:6px;background:#fff;border:1px solid #d8e6f5;border-radius:14px;padding:16px 18px;box-shadow:0 2px 12px rgba(24,95,165,.06)}
.cta-tip{font-size:12.5px;color:#7a8699;line-height:1.5}
.cta-tel{font-size:17px;font-weight:700;color:#185FA5;white-space:nowrap}
.cta-tel a{color:#185FA5;text-decoration:none;white-space:nowrap}
.cta-wx{font-size:12.5px;color:#7a8699}
.video-modal-close{position:absolute;top:12px;right:12px;width:34px;height:34px;border-radius:50%;border:none;background:rgba(0,0,0,.4);color:#fff;font-size:20px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:2}
.video-modal-close:hover{background:rgba(0,0,0,.6)}

/* 视频网格独立响应式：平板/手机保持 2 列，封面缩小，避免竖屏被压扁或单卡过高 */
@media(max-width:1024px){
  #video-grid,#home-video-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  .video-modal-box{flex-direction:column;max-height:92vh}
  .video-modal-media{flex:0 0 auto;width:100%;aspect-ratio:9/16;max-height:52vh}
  .video-modal-media video{max-height:52vh}
  #video-grid,#home-video-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:480px){
  /* 搜索栏在超窄屏更紧凑：输入框占满、按钮不挤 */
  .video-search-row{margin-bottom:14px}
  .video-search-row .search-box button{padding:12px 18px;font-size:14px}
  .video-search-row .search-box input{padding:13px 16px;font-size:15px;min-height:46px}
  /* 介绍、筛选、卡片文字在手机上收一档，整体更协调 */
  .video-intro{font-size:13px;line-height:1.8;margin-bottom:14px}
  .video-filter{margin-bottom:14px;gap:6px}
  .video-filter .vf-opt{padding:6px 14px;font-size:12.5px}
  .card-name{font-size:14.5px}
  .card-meta{font-size:12px}
}