/* ============================================================
   Videos — Customer Stories carousel, videos page & lightbox
   ============================================================ */

.video-section{padding:46px 0;}

/* ===== Section header (Customer Stories) ===== */
.cs-head{position:relative;margin-bottom:24px;padding-right:120px;}
.cs-eyebrow{
  display:inline-block;color:#2E7D32;font-size:13px;font-weight:800;
  letter-spacing:2px;text-transform:uppercase;position:relative;padding-left:42px;
}
.cs-eyebrow:before{content:"";position:absolute;left:0;top:50%;width:30px;height:3px;background:#2E7D32;transform:translateY(-50%);}
.cs-title{font-size:38px;font-weight:800;margin:12px 0 8px;color:#111827;line-height:1.1;}
.cs-title .c-green{color:#2E7D32;}
.cs-title .c-yellow{color:#2E7D32;}
.cs-sub{color:#6b7280;font-size:15.5px;max-width:640px;margin:0;}
.cs-nav{position:absolute;top:50%;right:0;transform:translateY(-50%);display:flex;gap:10px;}
.cs-arrow{
  width:44px;height:44px;border-radius:50%;border:1px solid #d1d5db;background:#fff;
  color:#374151;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:background .2s,border-color .2s,color .2s;
}
.cs-arrow:hover{background:#2E7D32;border-color:#2E7D32;color:#fff;}

/* ===== Horizontal carousel track ===== */
.cs-track{
  display:flex;gap:20px;overflow-x:auto;scroll-behavior:smooth;scroll-snap-type:x mandatory;
  padding:6px 2px 14px;-ms-overflow-style:none;scrollbar-width:none;
}
.cs-track::-webkit-scrollbar{display:none;}
.cs-slide{flex:0 0 auto;width:calc(25% - 15px);scroll-snap-align:start;}

/* ===== Portrait video card ===== */
.video-col{margin-bottom:24px;}
.video-card{
  position:relative;border-radius:18px;overflow:hidden;cursor:pointer;background:#000;
  box-shadow:0 10px 26px -12px rgba(0,0,0,.4);transition:transform .2s ease, box-shadow .2s ease;
}
.video-card:hover{transform:translateY(-4px);box-shadow:0 18px 36px -14px rgba(0,0,0,.5);}
.video-thumb{position:relative;width:100%;padding-top:177.77%;overflow:hidden;background:#111;}
.video-thumb img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;transition:transform .3s ease;}
.video-card:hover .video-thumb img{transform:scale(1.05);}

.vc-grad{position:absolute;left:0;right:0;bottom:0;height:45%;background:linear-gradient(to top, rgba(0,0,0,.6), rgba(0,0,0,0));pointer-events:none;}
.video-play{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:58px;height:58px;border-radius:50%;background:rgba(255,255,255,.88);color:#111;
  display:flex;align-items:center;justify-content:center;font-size:20px;padding-left:4px;
  box-shadow:0 4px 14px rgba(0,0,0,.35);transition:background .2s,transform .2s;
}
.video-card:hover .video-play{background:#fff;transform:translate(-50%,-50%) scale(1.08);}
.vc-label{
  position:absolute;left:14px;bottom:14px;color:#fff;font-size:11px;font-weight:700;
  letter-spacing:.6px;text-transform:uppercase;text-shadow:0 1px 3px rgba(0,0,0,.7);
}
.vc-badge{
  position:absolute;right:12px;bottom:12px;background:rgba(17,17,17,.72);color:#fff;
  font-size:11px;font-weight:600;padding:3px 10px;border-radius:14px;
}

/* ===== Lightbox ===== */
.vnd-video-modal{
  position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.85);z-index:99999;
  display:none;align-items:center;justify-content:center;padding:20px;
}
.vnd-video-modal.open{display:flex;}
.vnd-video-inner{position:relative;width:100%;max-width:900px;}
.vnd-video-frame{position:relative;width:100%;padding-top:56.25%;background:#000;border-radius:10px;overflow:hidden;}
.vnd-video-frame iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0;}
.vnd-video-close{position:absolute;top:-42px;right:0;color:#fff;font-size:34px;line-height:1;cursor:pointer;font-weight:300;}
.vnd-video-close:hover{color:#dc2626;}

/* ===== Videos page ===== */
.videos-hero{text-align:center;padding:34px 0 10px;}
.videos-hero p{color:#6b7280;font-size:15px;margin-top:6px;}
#vnd_loader{display:none;width:100%;text-align:center;padding:26px 0;color:#6b7280;}
.vnd-spinner{display:inline-block;width:34px;height:34px;border:4px solid #d1d5db;border-top-color:#2E7D32;border-radius:50%;animation:vnd-spin .8s linear infinite;}
@keyframes vnd-spin{to{transform:rotate(360deg);}}

/* ===== Responsive ===== */
@media (max-width:991px){
  .cs-title{font-size:30px;}
  .cs-slide{width:calc(33.333% - 14px);}
}
@media (max-width:767px){
  .cs-head{padding-right:0;text-align:left;}
  .cs-nav{position:static;transform:none;margin-top:14px;}
  .cs-title{font-size:26px;}
  .cs-slide{width:62%;}
  .video-play{width:48px;height:48px;font-size:17px;}
  .video-col{margin-bottom:16px;}
}