/* ============================================================
   Team TararBari - Seamless Hero Motion V11.5

   FIXES:
   - removes visible rectangular Hero box
   - keeps Admin-controlled text/buttons
   - moves the big planet + small moon via background parallax
   - adds clearly moving large + small shooting stars
   - softly blends Hero with the next Home section

   DOES NOT CHANGE CMS DATA.
   ============================================================ */

.block-hero{
  position:relative!important;
  overflow:hidden!important;
  isolation:isolate!important;
  background:none!important;
}

/* Completely remove old mask/box layers from previous patches. */
.block-hero::before{
  content:none!important;
  display:none!important;
  background:none!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}

/* Animated full Hero picture.
   Because planet/moon are part of this full image, they now gently move. */
.block-hero .tb-v115-hero-bg{
  position:absolute;
  inset:-3%;
  z-index:1;
  pointer-events:none;

  background-image:url('/uploads/home/team-tararbari-exact-demo-hero-v4.jpg?v=115')!important;
  background-repeat:no-repeat!important;
  background-size:cover!important;
  background-position:center center!important;

  transform:translate3d(0,0,0) scale(1.035);
  transform-origin:center center;
  will-change:transform,background-position;

  animation:tbV115PlanetMotion 14s ease-in-out infinite alternate;
}

/* Gentle extra glow movement over the big planet */
.block-hero .tb-v115-planet-glow{
  position:absolute;
  right:-6%;
  top:-8%;
  width:64%;
  height:88%;
  z-index:3;
  pointer-events:none;
  background:
    radial-gradient(
      ellipse at 52% 48%,
      rgba(255,153,54,.18) 0%,
      rgba(255,116,21,.09) 27%,
      rgba(255,92,10,0) 68%
    );
  filter:blur(24px);
  animation:tbV115GlowMove 7s ease-in-out infinite alternate;
}

/* ============================================================
   KEEP LIVE ADMIN TEXT - NO DARK BOX
   ============================================================ */
.block-hero .hero-grid{
  position:absolute!important;
  inset:0!important;
  z-index:30!important;

  display:block!important;
  visibility:visible!important;
  pointer-events:auto!important;

  width:100%!important;
  height:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;

  background:transparent!important;
  box-shadow:none!important;
  border:0!important;
}

.block-hero .hero-grid > div:first-child{
  position:absolute!important;
  left:6.8%!important;
  top:23%!important;
  width:53%!important;
  z-index:31!important;

  margin:0!important;
  padding:0!important;

  background:transparent!important;
  background-color:transparent!important;
  box-shadow:none!important;
  border:0!important;
  outline:0!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}

.block-hero .hero-art{
  display:none!important;
  visibility:hidden!important;
}

/* subtle text readability only — no rectangular block */
.block-hero .hero-grid > div:first-child::before{
  content:""!important;
  position:absolute!important;
  left:-4%!important;
  top:-9%!important;
  width:112%!important;
  height:118%!important;
  z-index:-1!important;
  pointer-events:none!important;

  border-radius:48%!important;
  background:
    radial-gradient(
      ellipse at 35% 48%,
      rgba(1,7,19,.50) 0%,
      rgba(1,7,19,.33) 37%,
      rgba(1,7,19,.12) 65%,
      rgba(1,7,19,0) 82%
    )!important;
  filter:blur(22px)!important;
}

/* Hero text remains Admin-controlled */
.block-hero .hero-grid .eyebrow{
  display:inline-flex!important;
  visibility:visible!important;
  margin:0 0 3.1% 0!important;
  padding:.58em 1.2em!important;
  border:1px solid rgba(32,227,122,.72)!important;
  border-radius:999px!important;
  background:rgba(3,20,28,.40)!important;
  color:#26e58a!important;
  font-size:clamp(9px,.78vw,14px)!important;
  font-weight:800!important;
  line-height:1!important;
  letter-spacing:.14em!important;
  text-transform:uppercase!important;
}

.block-hero .hero-grid .block-title{
  display:block!important;
  visibility:visible!important;

  margin:0 0 2.1% 0!important;
  padding:0!important;
  max-width:100%!important;

  color:#f8fafc!important;
  background:none!important;
  -webkit-text-fill-color:initial!important;
  -webkit-background-clip:initial!important;
  background-clip:initial!important;

  font-size:clamp(27px,3.55vw,63px)!important;
  font-weight:850!important;
  line-height:1.04!important;
  letter-spacing:-.04em!important;

  text-shadow:
    0 2px 14px rgba(0,0,0,.65),
    0 0 30px rgba(0,0,0,.28)!important;
}

.block-hero .hero-grid .block-body.lead{
  display:block!important;
  visibility:visible!important;

  margin:0!important;
  max-width:94%!important;

  color:#e0e7f1!important;
  font-size:clamp(12px,1.42vw,25px)!important;
  font-weight:450!important;
  line-height:1.40!important;

  text-shadow:0 2px 12px rgba(0,0,0,.72)!important;
}

.block-hero .hero-grid .actions{
  display:flex!important;
  visibility:visible!important;
  justify-content:flex-start!important;
  align-items:center!important;
  flex-wrap:wrap!important;

  gap:18px!important;
  margin:4.1% 0 0 0!important;
  padding:0!important;
}

.block-hero .hero-grid .btn{
  display:inline-flex!important;
  visibility:visible!important;
  align-items:center!important;
  justify-content:center!important;

  min-height:52px!important;
  padding:0 27px!important;

  border-radius:11px!important;
  font-size:clamp(12px,1.03vw,18px)!important;
  font-weight:800!important;
  line-height:1!important;
}

.block-hero .hero-grid .btn-primary{
  color:#031313!important;
  background:linear-gradient(105deg,#15e28a,#17d8ed)!important;
  border:0!important;
  box-shadow:0 0 22px rgba(19,226,214,.22)!important;
}

.block-hero .hero-grid .btn-ghost{
  color:#f8fafc!important;
  background:rgba(7,14,27,.48)!important;
  border:1px solid rgba(148,163,184,.35)!important;
}

.block-hero .tb-demo-hotspot{
  display:none!important;
}

/* ============================================================
   STARS + LARGE MOVING SHOOTING STAR
   ============================================================ */
.tb-v115-space{
  position:absolute;
  inset:0;
  z-index:18;
  overflow:hidden;
  pointer-events:none;
}

.tb-v115-twinkle{
  position:absolute;
  width:2px;
  height:2px;
  border-radius:50%;
  background:#fff;
  box-shadow:
    0 0 5px rgba(255,255,255,.95),
    0 0 12px rgba(93,196,255,.58);
  animation:tbV115Twinkle linear infinite;
}

.tb-v115-shoot{
  position:absolute;
  height:3px;
  border-radius:999px;
  opacity:0;
  transform-origin:right center;

  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,0) 0%,
      rgba(104,191,255,.06) 17%,
      rgba(255,182,83,.36) 52%,
      rgba(255,217,152,.92) 82%,
      #fff 100%
    );

  filter:
    drop-shadow(0 0 8px rgba(255,177,72,.92))
    drop-shadow(0 0 22px rgba(255,221,158,.56));

  will-change:transform,opacity;
}

.tb-v115-shoot.big{
  width:360px;
  height:4px;
  animation:tbV115BigShoot 7.5s linear infinite;
}

.tb-v115-shoot.small{
  width:150px;
  animation:tbV115SmallShoot 5.2s linear infinite;
}

/* ============================================================
   HERO / NEXT SECTION BLEND
   ============================================================ */
.block-hero .tb-v115-bottom-blend{
  position:absolute;
  left:0;
  right:0;
  bottom:-2px;
  height:175px;
  z-index:24;
  pointer-events:none;

  background:
    linear-gradient(
      to bottom,
      rgba(2,8,20,0) 0%,
      rgba(2,8,20,.10) 22%,
      rgba(2,8,20,.36) 54%,
      rgba(2,8,20,.72) 80%,
      rgba(2,8,20,.96) 100%
    );

  filter:blur(11px);
}

.block-hero + section,
main > .block-hero + section{
  position:relative!important;
  z-index:5!important;

  margin-top:-72px!important;
  padding-top:105px!important;
}

.block-hero + section::before,
main > .block-hero + section::before{
  content:""!important;
  position:absolute!important;
  left:0!important;
  right:0!important;
  top:0!important;
  height:150px!important;
  z-index:2!important;
  pointer-events:none!important;

  background:
    linear-gradient(
      to bottom,
      rgba(2,8,20,.88) 0%,
      rgba(2,8,20,.58) 32%,
      rgba(2,8,20,.24) 68%,
      rgba(2,8,20,0) 100%
    )!important;

  filter:blur(12px)!important;
}

.block-hero + section > *,
main > .block-hero + section > *{
  position:relative;
  z-index:3;
}

/* ============================================================
   MOTION
   ============================================================ */
@keyframes tbV115PlanetMotion{
  0%{
    transform:translate3d(-1.2%,-.6%,0) scale(1.04);
  }
  45%{
    transform:translate3d(.8%,.4%,0) scale(1.065);
  }
  100%{
    transform:translate3d(1.8%,1.0%,0) scale(1.05);
  }
}

@keyframes tbV115GlowMove{
  from{
    transform:translate3d(-1.5%,-1%,0) scale(.98);
    opacity:.72;
  }
  to{
    transform:translate3d(2%,1.8%,0) scale(1.07);
    opacity:1;
  }
}

@keyframes tbV115Twinkle{
  0%,100%{
    opacity:.20;
    transform:scale(.72);
  }
  38%{
    opacity:1;
    transform:scale(1.25);
  }
  70%{
    opacity:.42;
    transform:scale(.88);
  }
}

/* Large shooting star travels a long, obvious path */
@keyframes tbV115BigShoot{
  0%,14%{
    opacity:0;
    transform:translate3d(-460px,-230px,0) rotate(27deg) scale(.85);
  }
  19%{
    opacity:1;
  }
  63%{
    opacity:1;
  }
  78%,100%{
    opacity:0;
    transform:translate3d(1500px,650px,0) rotate(27deg) scale(1.08);
  }
}

@keyframes tbV115SmallShoot{
  0%,20%{
    opacity:0;
    transform:translate3d(-260px,-160px,0) rotate(29deg);
  }
  26%{
    opacity:.95;
  }
  68%{
    opacity:.92;
  }
  82%,100%{
    opacity:0;
    transform:translate3d(900px,430px,0) rotate(29deg);
  }
}

@media(max-width:1000px){
  .block-hero .hero-grid > div:first-child{
    left:6.3%!important;
    top:21%!important;
    width:59%!important;
  }

  .tb-v115-shoot.big{
    width:280px;
  }

  .block-hero + section,
  main > .block-hero + section{
    margin-top:-48px!important;
    padding-top:78px!important;
  }
}

@media(max-width:700px){
  .block-hero .tb-v115-hero-bg{
    inset:-5%;
    background-position:66% center!important;
    animation-duration:17s;
  }

  .block-hero .hero-grid > div:first-child{
    left:7%!important;
    top:18%!important;
    width:69%!important;
  }

  .block-hero .hero-grid .eyebrow{
    font-size:clamp(5px,1.35vw,9px)!important;
    padding:.45em .85em!important;
  }

  .block-hero .hero-grid .block-title{
    font-size:clamp(15px,5.05vw,29px)!important;
  }

  .block-hero .hero-grid .block-body.lead{
    font-size:clamp(7px,2.15vw,12px)!important;
  }

  .block-hero .hero-grid .actions{
    gap:7px!important;
  }

  .block-hero .hero-grid .btn{
    min-height:27px!important;
    padding:0 10px!important;
    border-radius:6px!important;
    font-size:clamp(6px,1.85vw,10px)!important;
  }

  .tb-v115-shoot.big{
    width:190px;
  }

  .tb-v115-shoot.small{
    width:100px;
  }

  .block-hero + section,
  main > .block-hero + section{
    margin-top:-28px!important;
    padding-top:52px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .block-hero .tb-v115-hero-bg,
  .block-hero .tb-v115-planet-glow,
  .tb-v115-twinkle,
  .tb-v115-shoot{
    animation:none!important;
  }
}