.ksh{
  position:relative;
  width:100%;
  overflow:hidden;
  padding-top:var(--ksh-desktop-top,0px);
  height:calc(var(--ksh-desktop-height,700px) + var(--ksh-desktop-top,0px));
  background:#000;
}

.ksh-media{
  position:absolute;
  inset:0;
  top:var(--ksh-desktop-top,0px);
  height:var(--ksh-desktop-height,700px);
}

.ksh-video{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.ksh-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0.15) 55%, rgba(0,0,0,0) 100%);
  pointer-events:none;
}

.ksh-content{
  position:absolute;
  left:var(--ksh-pad-left,48px);
  bottom:var(--ksh-pad-bottom,48px);
  max-width:var(--ksh-maxw,720px);
  z-index:2;
}

.ksh-small{ color:var(--ksh-small-color,#fff); opacity:.9; font-size:14px; margin-bottom:10px; }
.ksh-title{ color:var(--ksh-title-color,#fff); font-size:44px; line-height:1.12; margin:0 0 12px; }
.ksh-desc{ color:var(--ksh-desc-color,#fff); opacity:.92; font-size:16px; line-height:1.5; margin-bottom:18px; }

.ksh-cta{
  display:inline-block;
  padding:12px 18px;
  border:1px solid var(--ksh-cta-border, rgba(255,255,255,0.65));
  color:var(--ksh-cta-color,#fff);
  text-decoration:none;
  border-radius:8px;
  transition:background .2s ease, transform .2s ease;
  background:transparent;
}
.ksh-cta:hover{
  background:var(--ksh-cta-hover-bg, rgba(220,220,220,0.25));
  transform:translateY(-1px);
}

/* Mobile */
@media (max-width: 768px){
  .ksh{
    padding-top:var(--ksh-mobile-top,0px);
    height:auto; /* JS sets media height */
  }
  .ksh-media{
    position:relative;
    top:auto;
    height:auto; /* JS sets */
  }
  .ksh-video{
    object-fit:cover;
    object-position:var(--ksh-mob-objpos, 50% 50%);
  }
  .ksh-title{ font-size:30px; }
  .ksh-content{
    left:20px;
    right:20px;
    max-width:none;
    bottom:22px;
  }
  .ksh-overlay{
    background:linear-gradient(180deg, rgba(0,0,0,0.10) 0%, rgba(0,0,0,0.40) 55%, rgba(0,0,0,0.70) 100%);
  }
}