/* ---------- Base / Desktop ---------- */
.hero-video-section{
    position:relative;
    overflow:hidden;
    min-height:420px;
    display:block;
    height: 80vh;
    background-color:#000;
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
}

/* video fills container, oversize slightly to avoid edge lines */
.hero-video { position: absolute; top: 0; left: 0; width: 110%; height: 110%; object-fit: cover; z-index: 1; background: #000; transform: none; }

/* content above video */
.hero-content{ position:relative; z-index:3; max-width:50%; padding:100px; color:#fff; font-size: 16px; font-weight: 500; line-height: 26px; }
.btn-contact:hover { color: #000000; background-color: #ffffff; border: 1px solid #ffffff; }
.hero-title{ color:#fff; font-size:22px; margin:0 0 12px 0; font-weight: 600; }
/* .hero-details{ color:#fff; font-size:16px; line-height:26px; margin-bottom:30px; } */
.btn-contact{ background:transparent; color:#fff; border:1px solid #fff; padding:8px 22px; border-radius:50px; text-decoration:none; display:inline-block; }

/* Play/Pause button default (style01) */
button.hero-play-btn{ position:absolute; right:9%; bottom:10%; z-index:6; width:55px; height:55px; border-radius:50%; border:2px solid rgba(255,255,255,0.9); background:rgba(0,0,0,0.35); display:flex; align-items:center; justify-content:center; cursor:pointer; transition: transform .12s ease, background-color .12s ease; padding:0; }
button.hero-play-btn:active{ transform:scale(.96); }
button.hero-play-btn:focus, button.hero-play-btn:hover{ background-color: rgba(255,218,0,0.06); outline:none; }
button.hero-play-btn .icon{ width:28px; height:28px; display:block; }
button.hero-play-btn .icon path{ stroke:#fff !important; fill:none !important; stroke-width:2; }
button.hero-play-btn .icon-pause path{ stroke:none; fill:#fff; }

/* Tablet adjustments */
@media (max-width:1024px){
    .hero-content{ max-width:65%; padding:60px 40px; font-size:18px; }
    .hero-title{ font-size:22px; }
    button.hero-play-btn{ right:6%; bottom:6%; width:50px; height:50px; }
    button.hero-play-btn .icon{ width:22px; height:22px; }
    .hero-video{ height:140%; }
}

/* ---------- Mobile (banner by default) ---------- */
@media (max-width:767px){
    .hero-video-section{ height:70vh; min-height:320px; padding: 10px; background-repeat:no-repeat; background-position:center; background-size:cover; }
    /* Keep video in DOM but hidden visually until user taps play */
    .hero-video{ opacity:0; visibility:hidden; pointer-events:none; transition: opacity .28s ease, visibility .28s; z-index:0; }
    .hero-content{ position:relative; z-index:3; max-width:100%; padding:22px; font-size:16px; color:#fff; }
    .hero-title{ font-size:18px; line-height:24px; }
    .hero-details{ font-size:14px; line-height:20px; margin-bottom:18px; }
    .hero-play-btn{ right:5%; bottom:5%; width:48px; height:48px; border-width:1.5px; z-index:7; }
    .hero-play-btn .icon{ width:18px; height:18px; }
}

/* When JS sets this class we reveal the mobile video above the banner */
.hero-video-section.mobile-video-visible .hero-video{ opacity:1 !important; visibility:visible !important; z-index:2; pointer-events:auto; }

/* ------------------ STYLE 02 (new) ------------------ */
/* applied when post meta style == style02 - root has class bvc-style-02 */
.bvc-style-02 .hero-video-section{
    /* full screen banner */
    min-height: 100vh;
    height: 100vh;
    background-size: cover;
    background-position: center center;
}

.bvc-style-02 .hero-content{
    /* keep content in same visual place but more compact */
    max-width:50%;
    padding:180px 80px 20px 100px;
    color:#fff;
}

/* user requested: title 16px, subtitle 38px */
.bvc-style-02 .hero-title{ font-size: 18px; margin-bottom: 8px; font-family: 'Poppins', sans-serif;font-weight: 500; margin-bottom:8px; }
.bvc-style-02 .hero-details p{ font-size: 38px;line-height: 44.5px;margin-bottom: 18px;font-weight: 500;text-transform: uppercase;font-family: 'Montserrat', sans-serif;}

/* hide button for style-2 */
.bvc-style-02 .btn-contact {
display: none !important;
}


/* place play button under title/content (not absolute) */
.bvc-style-01 .hero-play-btn{
/*   position:absolute ;
  right:9%;
  bottom:10%;
  z-index:6;
  width:55px;
  height:55px; */
  border-radius:50%;
  border:2px solid rgba(255,255,255,0.9);
  background:rgba(0,0,0,0.35);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition: transform .12s ease, background-color .12s ease;
  padding:0;
}

.bvc-style-01 .hero-play-btn-wrap{
    position: relative;
    display: flex;
    padding: 0px 0px 0px 100px;
    flex-direction: column-reverse;
    align-content: space-between;
    justify-content: flex-end;
}

/* place play button under title/content (not absolute) */
.bvc-style-02 .hero-play-btn{
    position:relative ;
    display:inline-flex;
    margin-top:18px;
    width:55px;
    height:55px;
    right: 0%;
    bottom: auto;
    top: -18%;
    border-radius:50%;
    border:2px solid rgba(255,255,255,0.95);
    background:#ffffff00;
    align-items:center;
    justify-content:center;
    z-index:6;
}

.bvc-style-02 .hero-play-btn-wrap{
    position: relative;
    display: flex;
    padding: 0px 0px 0px 100px;
    flex-direction: column-reverse;
    align-content: space-between;
    justify-content: flex-end;
}
.bvc-style-02 button.hero-play-btn .icon{ width:22px; height:22px; }
/* on mobile keep the full-screen feeling but ensure details readable */
@media (max-width:1024px){
	.bvc-style-02 .hero-play-btn{
    position:relative ;
    display:inline-flex;
    margin-top:18px;
    width:55px;
    height:55px;
    right: 0%;
    bottom: auto;
    top: -18%;
    border-radius:50%;
    border:2px solid rgba(255,255,255,0.95);
    background:#ffffff00;
    align-items:center;
    justify-content:center;
    z-index:6;
}
	
}
/* on mobile keep the full-screen feeling but ensure details readable */
@media (max-width:768px){
    .bvc-style-02 .hero-video-section{ height:70vh; min-height:360px; }
    .bvc-style-02 .hero-content{ padding:180px 0px 50px 80px; max-width:100%; }
    .bvc-style-02 .hero-title{ font-size:16px; }
    .bvc-style-02 .hero-details p{font-size: 22px;line-height: 35px;margin-bottom: 10px;font-weight: 500;text-transform: uppercase;font-family: 'Montserrat', sans-serif;}
   
	.bvc-style-02 .hero-play-btn{
    position:relative ;
    display:inline-flex;
    margin-top:18px;
    width:55px;
    height:55px;
    right: -10%;
    bottom: auto;
    top: -18%;
    border-radius:50%;
    border:2px solid rgba(255,255,255,0.95);
    background:#ffffff00;
    align-items:center;
    justify-content:center;
    z-index:6;
}
}

/* on mobile keep the full-screen feeling but ensure details readable */
@media (max-width:480px){
    .bvc-style-02 .hero-video-section{ height:70vh; min-height:360px; }
    .bvc-style-02 .hero-content{ padding:80px 0px 20px 20px; max-width:100%; }
    .bvc-style-02 .hero-title{ font-size:16px; }
    .bvc-style-02 .hero-details p{font-size: 22px;line-height: 35px;margin-bottom: 10px;font-weight: 500;text-transform: uppercase;font-family: 'Montserrat', sans-serif;}
    /* when mobile video is revealed we still show it above banner */
	
	.bvc-style-02 .hero-play-btn{
    position:relative ;
    display:inline-flex;
    margin-top:18px;
    width:45px;
    height:45px;
    right: -5%;
    bottom: auto;
    top: -18%;
    border-radius:50%;
    border:2px solid rgba(255,255,255,0.95);
    background:#ffffff00;
    align-items:center;
    justify-content:center;
    z-index:6;
}
	.bvc-style-02 button.hero-play-btn .icon {
    width: 18px;
		height: 18px;align-content}
	
}
/* small niceties */
.bvc-style-02 .btn-contact{ margin-top:10px; }