/* Tridevom Infotech video hero V2: the film is the entire hero BACKGROUND, never a separate section. */
.hero.hero-phase2.hero-video-mode {
  position:relative;
  isolation:isolate;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  width:100%;
  height:calc(100vh - 87px);
  height:calc(100svh - 87px);
  min-height:0;
  max-height:none;
  padding:0;
  overflow:hidden;
  color:#fff;
  background:#061426;
}
.hero.hero-phase2.hero-video-mode::before,
.hero.hero-phase2.hero-video-mode::after{content:none!important;display:none!important}
.hero-video-mode .hero-video-stage{
  position:absolute!important;
  inset:0!important;
  z-index:0;
  display:block;
  width:100%;height:100%;
  pointer-events:none;
  overflow:hidden;
  background:#061426 url('../video/tridevom-hero-poster.webp') center center / cover no-repeat;
}
.hero-video-mode .hero-background-video{
  position:absolute;
  inset:0;
  display:block;
  width:100%;height:100%;
  min-width:100%;min-height:100%;
  max-width:none;max-height:none;
  object-fit:cover;
  object-position:61% center;
  background:transparent;
  pointer-events:none;
}
/* Consistent dark gradient is placed ABOVE the video and BELOW the text. */
.hero-video-mode .hero-video-shade{
  position:absolute;
  inset:0;
  z-index:1;
  display:block;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(2,12,31,.90) 0%,rgba(2,14,35,.77) 29%,rgba(2,13,31,.43) 55%,rgba(2,13,31,.06) 100%),linear-gradient(0deg,rgba(2,12,31,.16),transparent 45%);
}
.hero-video-mode .hero-video-content{
  position:relative;
  z-index:2;
  width:min(1180px,calc(100% - 42px));
  height:100%;
  min-height:0;
  max-width:1180px;
  margin-inline:auto;
  padding-block:clamp(16px,3vh,40px);
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
}
.hero-video-mode .hero-copy{
  max-width:690px;
  width:min(100%,690px);
  position:relative;
  margin:0;
}
.hero-video-mode .hero-copy .eyebrow{
  color:#a6ccff;
  font-size:clamp(11px,.90vw,13px);
  line-height:1.45;
  letter-spacing:.11em;
  text-shadow:0 2px 12px rgba(0,0,0,.65);
}
.hero-video-mode .hero-copy h1{
  max-width:690px;
  margin:14px 0 16px;
  font-size:clamp(40px, min(5.1vw, 9vh), 76px);
  line-height:1.04;
  letter-spacing:-.012em;
  overflow-wrap:normal;
  text-shadow:0 3px 15px rgba(0,0,0,.45);
}
.hero-video-mode .hero-copy>p{
  font-size:clamp(14px,1.25vw,18px);
  max-width:590px;
  line-height:1.56;
  color:#ecf2ff;
  margin:0;
  text-shadow:0 2px 11px rgba(0,0,0,.65);
}
.hero-video-mode .hero-actions{margin-top:22px;display:flex;flex-direction:row;gap:12px;align-items:stretch;flex-wrap:wrap}
.hero-video-mode .hero-actions .btn{min-height:47px;font-size:14px;box-shadow:0 6px 20px rgba(0,0,0,.19)}
.hero-video-mode .hero-actions .btn-ghost{background:rgba(6,22,50,.32);border:1px solid rgba(255,255,255,.65);backdrop-filter:blur(4px);box-shadow:none}
.hero-video-mode .trust-row{display:flex;gap:9px;flex-wrap:wrap;margin-top:22px}
.hero-video-mode .trust-row span{font-size:11px;white-space:nowrap;padding:9px 12px;background:rgba(6,25,56,.47);border:1px solid rgba(200,220,255,.24);backdrop-filter:blur(5px)}
/* Laptop/tablet heights: the first visible viewport shows header + complete hero. */
@media(max-width:950px){
 .hero.hero-phase2.hero-video-mode{height:calc(100svh - 87px);min-height:0;padding:0}
 .hero-video-mode .hero-copy h1{font-size:clamp(34px,6.4vw,58px)}
 .hero-video-mode .hero-video-shade{background:linear-gradient(90deg,rgba(2,12,31,.90),rgba(2,14,35,.68) 42%,rgba(2,13,31,.20))}
}
/* Phone: same video behind SAME content, not pushed below it. */
@media(max-width:680px){
 .hero.hero-phase2.hero-video-mode{
   display:flex;
   flex-direction:row;
   align-items:center;
   justify-content:flex-start;
   height:calc(100vh - 71px);
   height:calc(100svh - 71px);
   min-height:0!important;
   max-height:none;
   padding:0!important;
 }
 .hero-video-mode .hero-video-stage{
   position:absolute!important;
   inset:0!important;
   order:initial!important;
   aspect-ratio:auto!important;
   width:100%!important;
   height:100%!important;
   max-height:none!important;
 }
 .hero-video-mode .hero-background-video{
   position:absolute;
   inset:0;
   object-fit:cover;
   object-position:66% center;
   width:100%;height:100%;
 }
 .hero-video-mode .hero-video-shade{
   display:block!important;
   background:linear-gradient(180deg,rgba(1,10,27,.86) 0%,rgba(2,12,30,.83) 31%,rgba(2,13,31,.70) 57%,rgba(2,12,29,.24) 82%,rgba(2,11,28,.16) 100%);
 }
 .hero-video-mode .hero-video-content{
   order:initial!important;
   flex:0 0 auto;
   position:relative;
   z-index:2;
   width:calc(100% - 34px);
   max-width:none;
   height:auto;
   min-height:0;
   margin-inline:auto;
   padding:0!important;
   align-items:stretch;
   justify-content:flex-start;
 }
 .hero-video-mode .hero-copy{max-width:none;width:100%}
 .hero-video-mode .hero-copy .eyebrow{font-size:clamp(9px,2.5vw,11px);letter-spacing:.055em;line-height:1.35}
 .hero-video-mode .hero-copy h1{
   margin:12px 0 12px;
   font-size:clamp(33px,9.05vw,45px);
   line-height:1.07;
   letter-spacing:-.025em;
   text-wrap:balance;
 }
 .hero-video-mode .hero-copy>p{max-width:550px;font-size:clamp(12px,3.05vw,14px);line-height:1.48}
 .hero-video-mode .hero-actions{flex-direction:row;flex-wrap:nowrap;align-items:stretch;gap:8px;margin-top:17px}
 .hero-video-mode .hero-actions .btn{flex:1 1 0;min-width:0;min-height:43px;padding:10px 7px;font-size:clamp(10px,2.85vw,13px);white-space:nowrap;border-radius:11px}
 .hero-video-mode .trust-row{margin-top:14px;gap:6px;flex-wrap:nowrap}
 .hero-video-mode .trust-row span{font-size:clamp(8px,2.13vw,10px);padding:7px 7px;white-space:nowrap;line-height:1.3}
}
/* Compact phones retain the heading, description and both actions. */
@media(max-width:380px){
 .hero-video-mode .hero-copy h1{font-size:clamp(29px,9vw,36px);margin:10px 0}
 .hero-video-mode .hero-copy>p{font-size:11.5px;line-height:1.42}
 .hero-video-mode .hero-actions{margin-top:13px}
 .hero-video-mode .trust-row{margin-top:10px}
}
@media(max-width:680px) and (max-height:690px){
 .hero-video-mode .hero-copy h1{font-size:clamp(27px,8.5vw,35px);margin:8px 0}
 .hero-video-mode .hero-copy>p{font-size:11px;line-height:1.38}
 .hero-video-mode .hero-actions{margin-top:11px}
 .hero-video-mode .trust-row{margin-top:9px}
}
@media(max-width:680px) and (max-height:540px){
 .hero-video-mode .hero-copy h1{font-size:clamp(25px,7.8vw,31px)}
 .hero-video-mode .hero-copy>p{font-size:10px}
 .hero-video-mode .hero-actions .btn{min-height:38px}
 .hero-video-mode .trust-row{margin-top:6px}
 .hero-video-mode .trust-row span{padding:4px;font-size:8px}
}
/* On reduced-motion devices, display the real poster behind the overlay. */
@media(prefers-reduced-motion:reduce){
 .hero-video-mode .hero-background-video{display:none!important}
}
/* While hero is on screen, keep call / WhatsApp badges from hiding its CTAs. */
.quick-actions.is-over-video-hero{opacity:0!important;pointer-events:none!important;transform:translateY(10px);transition:opacity .18s ease,transform .18s ease}