/* =========================================================
   KD MARKETING HUB — LANDING extras (bright + video hero)
   ========================================================= */

/* ---- full-bleed video hero ---- */
.hero.hero-video{min-height:100vh;position:relative;overflow:hidden;padding-top:150px}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.hero-scrim{display:none}
/* no shade on the heading */
.hero-video .hero-copy h1{filter:none}
.hero-video .hero-copy .hero-sub,
.hero-video .hero-copy .hero-desc,
.hero-video .hero-trust b,
.hero-video .hero-trust span{text-shadow:0 2px 14px rgba(0,6,22,.9),0 1px 3px rgba(0,6,22,.95)}
.hero-video .hero-right{position:relative;height:min(520px,64vh)}
.hero-video .float-card{position:absolute;white-space:nowrap}
.hero-video .fc1{top:10%;right:8%;left:auto;animation:bob 6s var(--ease) infinite}
.hero-video .fc2{top:50%;right:2%;left:auto;animation:bob 7s var(--ease) infinite 1s}
.hero-video .fc3{bottom:12%;right:24%;left:auto;animation:bob 5.5s var(--ease) infinite .5s}

/* ---- parallax orbs (light) ---- */
.orb{position:absolute;border-radius:50%;filter:blur(70px);pointer-events:none;z-index:-1;will-change:transform;opacity:.22}

/* ---- CTA typewriter (bright, on blue band) ---- */
.cta-type{display:inline-block;min-width:2ch;background:linear-gradient(120deg,#ffffff,#cdd3dc,#ffffff);
  -webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 12px rgba(205,211,220,.45))}
body[data-page="home"] .cta-band h2{font-size:clamp(2.1rem,5vw,3.4rem);line-height:1.1}
body[data-page="home"] .cta-band .cursor{height:1em;vertical-align:-2px;background:#fff}

/* ---- multicolor service cards (video-matched palette) ---- */
.svc-card{--cg:var(--grad);--cc:var(--blue)}
.svc-card .curtain{background:var(--cg)}
.svc-card .ic-box{background:var(--cg)}
.svc-card:hover .ic-box{background:#fff;color:var(--cc)}

/* ---- 4-service row ---- */
.svc-grid.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
@media(max-width:1024px){ .svc-grid.grid4{grid-template-columns:repeat(2,1fr)} }
@media(max-width:600px){ .svc-grid.grid4{grid-template-columns:1fr} }

@media(max-width:720px){
  .hero-scrim{background:linear-gradient(0deg, rgba(8,14,30,.82), rgba(8,14,30,.5))}
  .hero-video .hero-right{display:none}
}

/* =========================================================
   HERO TEXT stays light over the dark video (bright theme)
   ========================================================= */
.hero-video .hero-copy{color:#fff}

/* reference-style title block — brand → BEST → AGENCY → INDIA */
.hero-title{
  font-family:var(--font);font-weight:700;
  font-size:clamp(2.3rem,5.8vw,4.9rem);line-height:1.02;letter-spacing:.01em;
  background:linear-gradient(180deg,#ffffff 0%,#cfe0ff 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  margin:4px 0 16px;filter:drop-shadow(0 3px 18px rgba(0,8,26,.55));
}
.hero-agency,.hero-tagline .tl-lead{text-shadow:0 2px 12px rgba(0,8,26,.7)}
.hero-tagline{display:flex;align-items:center;gap:16px;margin:10px 0;max-width:560px}
.hero-tagline .tl-rule{flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(174,198,255,.6),transparent)}
.hero-tagline .tl-lead{font-family:var(--font);font-weight:600;font-size:.8rem;letter-spacing:.42em;color:#aec6ff;text-transform:uppercase}
.hero-agency{
  font-family:var(--font);font-weight:600;color:#eaf1ff;
  font-size:clamp(1.05rem,2.6vw,1.95rem);letter-spacing:.2em;text-transform:uppercase;
  text-align:center;margin:2px 0;max-width:560px;line-height:1.2;
}
.hero-video .eyebrow{color:#cfe0ff!important;background:rgba(255,255,255,.1)!important;border:1px solid rgba(174,198,255,.4)!important;box-shadow:none!important}
.hero-video .eyebrow::before{background:var(--grad)}
.hero-video .type-wrap{background:rgba(16,20,32,.66)!important;border:1px solid rgba(255,255,255,.48)!important;-webkit-backdrop-filter:blur(14px)!important;backdrop-filter:blur(14px)!important;box-shadow:0 14px 46px -12px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.26)!important;border-radius:16px}
.hero-video .type-line{color:#fff!important}
.hero-video #typeService{background:none!important;-webkit-text-fill-color:#ffffff!important;color:#ffffff!important}
.hero-video .ticker-track span{color:#fff!important}
.hero-video .cursor{background:#ffffff!important}
.hero-video .type-label{color:#ffffff!important;background:rgba(255,255,255,.16)!important;border:1px solid rgba(255,255,255,.32)!important}
.hero-video .type-label{color:#d6e2fb!important;background:rgba(255,255,255,.12)!important;border:1px solid rgba(255,255,255,.22)!important}
.hero-video .ticker-track span{color:#fff}
.hero-video .btn-ghost{color:#fff;background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.32)}
.hero-video .scroll-hint{color:#c3d0ea}
.hero-video .mouse{border-color:#c3d0ea}
