/* ════════════════════════════════════════════════════════════
   VIDEO BANNER — video-banner.css
   Save to:  your-theme/css/video-banner.css
   Loaded once, cached by browser on every page
   ════════════════════════════════════════════════════════════ */

/* ── Kill Elementor white space ──────────────────────────── */
.elementor-section,
.elementor-container,
.elementor-column,
.elementor-widget-wrap,
.elementor-widget-html {
  padding:0!important;
  margin:0!important;
}
.elementor-section .elementor-container {
  max-width:100%!important;
  padding:0!important;
}

/* ── Wrapper ─────────────────────────────────────────────── */
.vb-wrap {
  position:relative;
  width:100vw;
  height:100dvh;
  min-height:100dvh;
  overflow:hidden;
  background:#000;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-left:-50vw;
  margin-right:-50vw;
  left:50%;
  right:50%;
  padding:0;
}

/* ── Video ───────────────────────────────────────────────── */
.vb-video {
  position:absolute;
  top:0;left:0;
  width:100%;height:100%;
  object-fit:cover;
  object-position:center center;
  z-index:0;
  display:block;
}

/* ── Content ─────────────────────────────────────────────── */
.vb-content {
  position:relative;
  z-index:2;
  text-align:center;
  color:#fff;
  padding:0 24px;
  max-width:860px;
  width:100%;
}

.vb-tag {
  display:inline-block;
  font-size:11px;font-weight:700;letter-spacing:3px;text-transform:uppercase;
  color:#c9a454;
  border:1px solid rgba(201,164,84,.5);
  padding:6px 18px;margin-bottom:24px;
  background:rgba(0,0,0,.3);
}

.vb-title {
  font-size:clamp(2rem,5vw,4rem);
  font-weight:300;line-height:1.15;color:#fff;
  margin:0 0 16px;font-family:Georgia,serif;letter-spacing:1px;
}
.vb-title em { color:#c9a454;font-style:italic; }

.vb-subtitle {
  font-size:clamp(.95rem,2vw,1.15rem);
  color:rgba(255,255,255,.80);
  font-weight:300;margin:0 0 32px;line-height:1.7;
}

/* ── Badges ──────────────────────────────────────────────── */
.vb-badges {
  display:flex;flex-wrap:wrap;justify-content:center;
  gap:8px;margin-bottom:32px;
}
.vb-badge {
  display:flex;flex-direction:column;align-items:center;
  background:rgba(0,0,0,.45);
  border:1px solid rgba(201,164,84,.30);
  padding:10px 20px;min-width:110px;
}
.vb-badge-label {
  font-size:10px;letter-spacing:2px;text-transform:uppercase;
  color:rgba(255,255,255,.55);margin-bottom:4px;
}
.vb-badge-value { font-size:14px;font-weight:600;color:#c9a454; }

/* ── Buttons ─────────────────────────────────────────────── */
.vb-actions { display:flex;flex-wrap:wrap;justify-content:center;gap:14px; }

.vb-btn-primary {
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 30px;background:#c9a454;color:#000!important;
  font-size:12px;font-weight:700;letter-spacing:2px;text-transform:uppercase;
  text-decoration:none!important;border:2px solid #c9a454;
  transition:all .3s ease;cursor:pointer;
}
.vb-btn-primary:hover { background:transparent;color:#c9a454!important; }

.vb-btn-outline {
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 30px;background:transparent;color:#fff!important;
  font-size:12px;font-weight:700;letter-spacing:2px;text-transform:uppercase;
  text-decoration:none!important;border:2px solid rgba(255,255,255,.6);
  transition:all .3s ease;cursor:pointer;
}
.vb-btn-outline:hover { background:#fff;color:#000!important;border-color:#fff; }

/* ── Scroll indicator ────────────────────────────────────── */
.vb-scroll {
  position:absolute;bottom:28px;left:50%;transform:translateX(-50%);
  z-index:2;display:flex;flex-direction:column;align-items:center;
  gap:6px;text-decoration:none;cursor:pointer;
}
.vb-scroll-text {
  font-size:10px;letter-spacing:3px;text-transform:uppercase;
  color:rgba(255,255,255,.5);
}
.vb-scroll-line {
  width:1px;height:40px;
  background:linear-gradient(to bottom,rgba(255,255,255,.5),transparent);
  animation:vbScroll 1.8s ease-in-out infinite;
}
@keyframes vbScroll {
  0%   { transform:scaleY(0);transform-origin:top;opacity:1; }
  50%  { transform:scaleY(1);transform-origin:top;opacity:1; }
  100% { transform:scaleY(1);transform-origin:bottom;opacity:0; }
}

/* ── Desktop ─────────────────────────────────────────────── */
@media(min-width:769px){
  .vb-wrap  { height:100dvh; }
  .vb-title { font-size:clamp(2.5rem,4.5vw,4rem); }
  .vb-badge { min-width:130px; }
}

/* ── Mobile ──────────────────────────────────────────────── */
@media(max-width:768px){
  .vb-wrap {
    width:100vw!important;
    height:100dvh!important;
    min-height:100dvh!important;
    margin-left:-50vw!important;
    margin-right:-50vw!important;
    left:50%!important;
    padding:0!important;
  }
  .vb-video { object-position:center center; }
  .vb-content   { padding:0 20px;max-width:100%; }
  .vb-tag       { font-size:10px;padding:5px 14px;margin-bottom:16px; }
  .vb-title     { font-size:clamp(1.7rem,7.5vw,2.4rem);margin-bottom:12px; }
  .vb-subtitle  { font-size:.88rem;margin-bottom:20px; }
  .vb-badges    { display:grid!important;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:22px;padding:0 10px; }
  .vb-badge     { min-width:unset;width:100%;padding:10px 8px; }
  .vb-badge-label { font-size:9px;letter-spacing:1px; }
  .vb-badge-value { font-size:13px;font-weight:700; }
  .vb-actions   { flex-direction:column;align-items:center;gap:10px;padding:0 20px;width:100%; }
  .vb-btn-primary,
  .vb-btn-outline { width:100%;max-width:340px;justify-content:center;padding:14px 20px; }
  .vb-scroll    { display:none; }
}

@media(max-width:390px){
  .vb-title   { font-size:1.55rem; }
  .vb-btn-primary,
  .vb-btn-outline { max-width:100%;font-size:11px;padding:13px 16px; }
}