/* ============================================================
   Homepage – rotating taglines (inside the hero video card)
   One tagline at a time, auto-rotating in a fixed order.
   ============================================================ */
.hero-video-card .hero-taglines{
  position:absolute;left:0;right:0;
  bottom:clamp(125px,26%,170px);
  z-index:2;
  padding:0 clamp(16px,4vw,48px);
  pointer-events:none;
  display:grid;
  justify-items:center;
  text-align:center;
}
/* soft scrim so the text stays readable over any video frame */
.hero-video-card::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:62%;
  background:linear-gradient(180deg,rgba(6,34,66,0) 0%,rgba(6,34,66,.55) 45%,rgba(6,34,66,.88) 100%);
  z-index:1;pointer-events:none;border-radius:0 0 16px 16px;
}
.hero-video-card .hero-card-text-block.video-card{z-index:3}
.hero-taglines .hero-tagline{
  grid-area:1/1;               /* all seven share one cell -> no layout jump */
  margin:0;max-width:880px;
  font-size:clamp(18px,2.4vw,32px);
  line-height:1.3;font-weight:700;letter-spacing:-.005em;
  color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.55);
  opacity:0;transform:translateY(14px);
  transition:opacity .8s ease,transform .8s ease;
  visibility:hidden;
}
.hero-taglines .hero-tagline.is-active{opacity:1;transform:none;visibility:visible}
.hero-taglines .hero-tagline.is-leaving{opacity:0;transform:translateY(-14px);visibility:visible}
.hero-taglines::after{ /* small gold accent under the line */
  content:"";grid-area:2/1;width:56px;height:4px;border-radius:4px;margin-top:14px;
  background:linear-gradient(90deg,#4fb3ff,#fbbf24);
}
@media (max-width:767px){
  .hero-video-card .hero-taglines{bottom:clamp(88px,20%,130px);padding:0 16px}
  .hero-taglines .hero-tagline{font-size:clamp(16px,4.6vw,20px)}
}
@media (prefers-reduced-motion:reduce){
  .hero-taglines .hero-tagline{transition:opacity .4s ease;transform:none!important}
}