*{margin: 0px; padding: 0px;}

.text-slider{
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
}

.text-slider p{
  display: inline-block;
  font-size: 18px;
  font-weight: bold;
  animation: slide 8s linear infinite;
  margin-bottom: 0px;
}

@keyframes slide{
  from{
    transform: translateX(100%);
  }
  to{
    transform: translateX(-100%);
  }
}


.txt-clr ul li a{color: white; font-weight: bold;}

.slide-img img{width: 150px!important; height: 55px!important;}

/* keeps content above overlay */
.hero-section *{
  position:relative;
  z-index:2;
}

/* top moving strip */
.top-strip{
  background:#000;
  color:#fff;
  text-align:center;
  font-size:14px;
  padding:6px 0;
  white-space:nowrap;
  overflow:hidden;
}

/* hero heading gradient */
.hero-heading{
  font-size:80px;
  font-weight:800;
  line-height:1.1;
}

.grad-red{
  background: linear-gradient(90deg,#ff1f2a,#ff7a7a);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}

.grad-blue{
  background: linear-gradient(90deg,#6fa8ff,#b5c7ff);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
}

/* nav contact button */
.contact-btn{
  border:1px solid #ff004e;
  border-radius:50px;
  padding:8px 20px;
  color:#fff;
}

/* CTA main button */
.cta-btn{
  background:#e7004c;
  border-radius:50px;
  padding:12px 28px;
  color:#fff;
  font-weight:600;
}

/* Hero images positioning */
.hero-images{
  position:relative;
}





/* responsive */
@media(max-width:768px){
  .hero-heading{font-size:36px;}
  .main-wheel{width:200px;}
  .player-left,
  .player-right{position:relative;left:0;right:0;bottom:0;}
}


/* Mobile background replacement */
@media(max-width: 768px){

  .hero-section{
  color: #fff;
  height: 80vh;
  background: url("../img/banner-resp.png") no-repeat center center ;
  background-size: cover;
 
}
.mobile-view{
    text-align: center;
}
}

@media(min-width: 768px){

  /* .hero-banner{
    background: url('../img/') center/cover no-repeat;
    height: 40vh;  
  } */

  .hero-section{
  color: #fff;
  height: 130vh;
  background: url("../img/sports_banner1.png") no-repeat center center ;
  background-size: cover;
 
}
}




/* ---------------------------- */

/* heading label */
.section-label {
  color: #5a6df0;
  font-weight: 600;
  letter-spacing: .5px;
}

/* main title */
.section-title2 {
  font-weight: 800;
  font-size: 36px;
  
}

/* CTA CARD */
.cta-box {
  background: linear-gradient(90deg, #020031, #001a8c, #0034ff);
  border-radius: 40px;
  padding: 40px 50px;
  color: white;
}

/* CTA button */
.cta-btn {
  background: linear-gradient(90deg, #e73827, #ff004c);
  color: white;
  border-radius: 50px;
  padding: 12px 30px;
  border: none;
  font-weight: 600;
  box-shadow: 0 0 18px rgba(255, 0, 76, .6);
}

.cta-btn:hover {
  opacity: .9;
}

/* rounded image */
.section-image {
  border-radius: 25px;
  width: 100%;
  height: auto;
  object-fit: cover;
}

/* responsive spacing */
@media(max-width: 992px) {
  .section-title {
    font-size: 28px;
  }

  .cta-box {
    padding: 25px;
    text-align: center;
  }
}


.section-bg {
  background: radial-gradient(circle at top, #001143, #000a22);
  padding: 80px 0;
  color: white;
  background: url(../img/sports11.png) no-repeat;
}

.game-card {
  border-radius: 25px;
  overflow: hidden;
  background: white;
  text-align: center;
  border: none;
  box-shadow: 0 0 25px rgba(0,0,0,.4);
}

.game-img {
  /* padding: 30px; */
  border-radius: 25px 25px 0 0;
  height: 200px;
  object-fit: cover;
}

.game-title {
  font-weight: 700;
  padding: 18px 10px 22px;
  color: #111;
  font-size: 20px;
}

.carousel-indicators button {
  width: 10px;
  height: 10px;
  border-radius: 50%;
}

.carousel-inner {
  padding: 20px 0;
}



.platform-section {
  background: radial-gradient(circle at center, #0b0015 20%, #000000 70%);
  border-radius: 60px;
  padding: 60px 50px;
  color: #fff;
  box-shadow: 0 0 40px rgba(0, 0, 0, .6);
  background: url(../img/sports10.jpg) no-repeat;
}

.platform-section h2 span {
  color: #6aa3ff;
}

.platform-box {
  background: #0f0f0f;
  border-radius: 20px;
  padding: 18px 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 85px;
  box-shadow: 0 0 25px rgba(0,0,0,.5);
  transition: .3s;
}

.platform-box:hover {
  transform: translateY(-4px);
  box-shadow: 0 0 30px rgba(255,255,255,.12);
}

.platform-box img {
  max-height: 50px;
  width: auto;
}

.instant-btn {
  background: linear-gradient(90deg, #e00063, #ff1f6b);
  color: #fff;
  padding: 14px 36px;
  border-radius: 40px;
  font-weight: 600;
  border: none;
}
.instant-btn:hover {
  opacity: .9;
  color: #fff;
}

@media(max-width: 992px){
  .platform-section{
    border-radius: 40px;
    padding: 40px 25px;
  }
}



/* -------------------- */

.section-wrapper{
      padding:70px 0;
      background:#f5f7fc;
    }

    .small-title{
      color:#6b6bff;
      font-size:14px;
      font-weight:600;
      letter-spacing:1px;
    }

    .main-heading{
      font-size:42px;
      font-weight:800;
      line-height:1.2;
      color:#000;
    }

    .content-text{
      font-size:16px;
      color:#555;
      line-height:1.8;
    }

    .about-img{
      border-radius:15px;
      width:100%;
      height:auto;
      object-fit:cover;
    }

    /* --------------------- */

   .section-wrapper02{
  padding:70px 0 50px 0;
  text-align:center;
  background: #212121;
  color:white;
  font-family: "Poppins", sans-serif;
}

.section-wrapper02 h2{
  font-size:42px;
  font-weight:800;
}

.section-wrapper02 .subtitle{
  max-width:950px;
  margin:auto;
  color:#d1d1d1;
}

.icon-wrap{
  width:90px;
  height:90px;
  border-radius:50%;
  display:flex;
  justify-content:center;
  align-items:center;
  margin:auto;
  background: radial-gradient(circle, rgba(255,255,255,0.3), rgba(0,0,0,0.1));
  box-shadow:0 0 25px rgba(255,255,255,0.2);
}

.icon-wrap i{
  font-size:32px;
}

.feature-title{
  font-size:18px;
  font-weight:700;
  margin-top:12px;
}

.feature-text{
  max-width:290px;
  margin:auto;
  color:#cfcfcf;
  font-size:14px;
  margin-top:8px;
  line-height:1.6;
}

/* Colored glow effect */
.blue{ box-shadow:0 0 25px rgba(0,123,255,.6); }
.purple{ box-shadow:0 0 25px rgba(155, 89, 182,.7); }
.pink{ box-shadow:0 0 25px rgba(255,0,98,.7); }
.green{ box-shadow:0 0 25px rgba(0,255,153,.7); }
.red{ box-shadow:0 0 25px rgba(255,0,0,.6); }


/* -------------------------- */
.step-section{
background:#000;
    color:white;
    font-family: 'Poppins', sans-serif;
}

.section-title{
    font-size: 38px;
    font-weight: 700;
    text-align:center;
    margin-bottom: 40px;
     
}

.step-card{
    background:#0c0c0e;
    border-radius:20px;
    padding:30px 25px;
    height:100%;
}

.step-btn{
    background:#2663ff;
    border-radius:30px;
    padding:6px 18px;
    border:none;
    color:white;
    font-size:14px;
    margin-bottom:10px;
}

.step-card img{
    width:100%;
    max-width:260px;
    display:block;
    margin:auto;
}

.main-btn{
    background:#e40046;
    border:none;
    padding:12px 35px;
    border-radius:30px;
    color:white;
    font-size:18px;
}

/* ------------------------ */

.blog-section{
background:#ffffff;
    font-family: 'Poppins', sans-serif;
}


.section-subtitle{
    color:#6d7cff;
    font-weight:600;
    letter-spacing:.5px;
    text-align:center;
}

.section-title{
    font-size:38px;
    font-weight:800;
    text-align:center;
    margin-bottom:35px;
}

.blog-card{
    border-radius:18px;
    overflow:hidden;
    border:1px solid #eee;
    transition:.3s;
    background:#fff;
}

.blog-card:hover{
    box-shadow:0 25px 40px rgba(0,0,0,.08);
    transform:translateY(-4px);
}

.blog-image{
    width:100%;
    height:240px;
    object-fit:cover;
}

.category-pill{
    display:inline-block;
    background:#ffe8ef;
    color:#ff2c6d;
    padding:6px 14px;
    border-radius:20px;
    font-size:13px;
    font-weight:600;
}

.read-link{
    font-weight:700;
    text-decoration:none;
    color:#000;
}


/* -------------------------- */

.footer-section{
  background: transparent linear-gradient(180deg, #323232 0%, #020010 100%) 0% 0% no-repeat padding-box;
    color:#fff;
    padding:70px 0 30px 0;
    font-family:'Poppins',sans-serif;
}

.footer-heading{
    font-size:26px;
    font-weight:800;
    margin-bottom:15px;
}

.footer-small-heading{
    font-weight:700;
    margin-top:25px;
}

.footer-links a{
    color:#fff;
    margin-right:15px;
    text-decoration:none;
}

.footer-links a:hover{
    text-decoration:underline;
}

.social-icons img{
    width:28px;
    margin-right:15px;
    filter:invert(1);
    opacity:.9;
}

.copy-text{
    font-size:14px;
    margin-top:10px;
}

.whatsapp-btn{
    position:fixed;
    bottom:25px;
    right:25px;
    background:#27d466;
    padding:12px 28px;
    color:#fff;
    border-radius:40px;
    display:flex;
    align-items:center;
    gap:8px;
    font-weight:700;
}

.whatsapp-btn img{
    width:22px;
    filter:invert(1);
}

.sticky-whatsapp-btn{
  position:fixed;
  right:18px;
  bottom:18px;

  background:#25d366;
  color:#fff;
  padding:14px 30px;
  border-radius:50px;
  font-size:17px;
  font-weight:700;
  text-decoration:none;

  box-shadow:0 10px 20px rgba(0,0,0,.25);

  animation:blink 1s infinite, floatMove 2.2s infinite ease-in-out;
}

/* blinking */
/* @keyframes blink{
  0%{opacity:1;}
  50%{opacity:.45;}
  100%{opacity:1;}
} */

/* smooth movement */
@keyframes floatMove{
  0%{transform:translateY(0);}
  50%{transform:translateY(-8px);}
  100%{transform:translateY(0);}
}

.platform-box {
    background: #242121;
    box-shadow: 0 0 33px rgb(0 0 0);
    transition: .3s;
}




/* responsive */
@media(max-width:768px){
  .hero-heading{font-size:36px;}
  .main-wheel{width:200px;}
  .player-left,
  .player-right{position:relative;left:0;right:0;bottom:0;}
}


/* Mobile background replacement */
@media(max-width: 768px){

  .hero-section{
  color: #fff;
  height: 80vh;
  background: url("../img/banner-resp.png") no-repeat center center ;
  background-size: cover;
 
}
.mobile-view{
    text-align: center;
}

.platform-section {
    background: radial-gradient(circle at center, #0b0015 20%, #000000 70%);
    text-align: center;
}

.platform-box img {
    
    width: 80px;
}
}

@media(min-width: 768px){

  /* .hero-banner{
    background: url('../img/') center/cover no-repeat;
    height: 40vh;  
  } */

  .hero-section{
  color: #fff;
  height: 130vh;
  background: url("../img/sports_banner1.png") no-repeat center center ;
  background-size: cover;
 
}
}