:root{
  --bg:#020303;
  --panel:#111416;
  --panel2:#0b0e10;

  --gold:#d58a00;
  --gold2:#ffd447;

  --white:#f4f4f4;
  --muted:#b9b9b9;

  --cyan:#00b7c7;
  --line:#262b2e;
  --blue:#008fd0;

  --max:1360px;
}

*{
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  background:var(--bg);
  color:var(--white);
  font-family:Inter,Arial,sans-serif;
  overflow-x:hidden;
}

a{
  text-decoration:none;
  color:inherit;
}

img{
  display:block;
  max-width:100%;
}

.container{
  width:min(
    var(--max),
    calc(100% - 32px)
  );
  margin:auto;
}


/* HEADER */

.topbar{
  position:sticky;
  top:0;
  z-index:50;

  background:rgba(2,3,3,.96);

  backdrop-filter:blur(10px);

  border-top:4px solid #303436;
}

.nav{
  height:98px;

  display:flex;
  align-items:center;
  justify-content:space-between;
}

.brand{
  display:flex;
  flex-direction:column;

  line-height:.78;

  font-weight:800;

  letter-spacing:-2px;

  background:
    linear-gradient(
      #fff3a6,
      #e6a514,
      #fff5a8
    );

  -webkit-background-clip:text;

  color:transparent;
}

.brand-top{
  font-size:43px;
}

.brand-bottom{
  font-size:29px;
  text-align:center;
  margin-top:8px;
}

.nav-actions{
  display:flex;
  gap:14px;
}

.btn{
  padding:12px 18px;

  border-radius:7px;

  font-family:Georgia,serif;

  font-weight:700;
}

.btn-gold{
  background:
    linear-gradient(
      #d98c00,
      #b36e00
    );

  color:#fff;
}


/* HERO */

.hero{
  padding-top:14px;
}

.banner-stage{
  height:355px;

  border-radius:4px;

  overflow:hidden;

  background:#0a0a0a;
}

.banner-slide,
.banner-fallback{
  height:100%;
  width:100%;

  background-size:cover;
  background-position:center;

  position:relative;
}

.banner-fallback{

  background:

    radial-gradient(
      circle at 65% 45%,
      rgba(255,128,0,.28),
      transparent 26%
    ),

    radial-gradient(
      circle at 20% 40%,
      rgba(150,0,0,.3),
      transparent 28%
    ),

    linear-gradient(
      120deg,
      #250d00,
      #060606 45%,
      #10222c
    );
}

.banner-fallback:before{

  content:"♠  ♥  ♦  ♣";

  position:absolute;

  right:8%;
  top:22%;

  font-size:90px;

  opacity:.2;

  letter-spacing:18px;
}

.banner-copy{

  position:absolute;

  left:8%;
  top:50%;

  transform:translateY(-50%);

  max-width:560px;
}

.banner-copy .eyebrow{

  color:var(--gold2);

  font-weight:800;

  letter-spacing:4px;
}

.banner-copy h1{

  font-family:
    Playfair Display,
    serif;

  font-size:49px;

  line-height:1.06;

  margin:14px 0;
}

.banner-copy p{

  color:#ddd;

  max-width:500px;
}

.play-btn{

  display:inline-block;

  margin-top:12px;

  padding:13px 25px;

  border-radius:30px;

  background:#e91b14;

  border:3px solid #ffe63c;

  font-weight:800;

  box-shadow:
    0 0 22px rgba(255,40,0,.45);
}


/* DOTS */

.dots{

  height:36px;

  display:flex;

  justify-content:center;

  align-items:center;

  gap:8px;
}

.dot{

  width:11px;
  height:11px;

  background:#5f5f5f;

  border-radius:50%;

  cursor:pointer;
}

.dot.active{
  background:var(--gold);
}


/* CATEGORIES */

.category-wrap{
  position:relative;
}

.category-track{

  display:flex;

  gap:54px;

  overflow-x:auto;

  scrollbar-width:none;

  padding:
    16px
    12px
    20px;
}

.category-track::-webkit-scrollbar{
  display:none;
}

.category-card{

  min-width:310px;

  height:166px;

  transform:skewX(-14deg);

  border:
    3px solid
    #00c5c5;

  background:#020a0c;

  overflow:hidden;

  position:relative;
}

.category-inner{

  height:100%;

  transform:skewX(14deg);

  margin-left:-20px;

  width:calc(100% + 40px);

  display:flex;

  align-items:center;

  justify-content:center;

  background:
    radial-gradient(
      circle at 50% 50%,
      rgba(0,159,184,.3),
      transparent 50%
    );
}

.category-inner img{

  width:100%;
  height:100%;

  object-fit:cover;
}

.category-name{

  font-size:27px;

  font-weight:800;

  color:#ffd335;

  text-shadow:
    0 2px 7px #000;
}


/* CATEGORY ARROWS */

.slider-arrow{

  position:absolute;

  top:50%;

  transform:translateY(-50%);

  z-index:4;

  width:44px;
  height:44px;

  border-radius:50%;

  border:1px solid #333;

  background:#050505;

  color:#fff;

  font-size:40px;

  line-height:30px;

  cursor:pointer;
}

.slider-arrow.left{
  left:0;
}

.slider-arrow.right{
  right:0;
}


/* SECTIONS */

.section{
  padding:24px 0;
}


/* GAMES */

.games-grid{

  display:grid;

  grid-template-columns:
    repeat(3,1fr);

  gap:32px 35px;
}

.game-card{

  background:#111416;

  padding:11px;

  border-radius:7px;

  transition:.2s;
}

.game-card:hover{

  transform:translateY(-3px);

  box-shadow:
    0 8px 24px
    rgba(213,138,0,.12);
}

.game-card img{

  width:100%;

  aspect-ratio:16/8.3;

  object-fit:cover;
}

.game-placeholder{

  aspect-ratio:16/8.3;

  display:flex;

  align-items:center;

  justify-content:center;

  text-align:center;

  font-size:34px;

  font-weight:800;

  background:

    linear-gradient(
      120deg,
      rgba(120,0,0,.65),
      rgba(7,7,7,.5)
    ),

    radial-gradient(
      circle at 70%,
      #502100,
      #051421
    );
}


/* SECTION TITLE */

.section-title{

  text-align:center;

  font-family:Georgia,serif;

  font-size:34px;
}

.section-title span{
  color:#ff201a;
}


/* FEATURES */

.features-grid{

  display:grid;

  grid-template-columns:
    repeat(3,1fr);

  gap:28px;
}

.feature-card{

  min-height:230px;

  padding:32px 22px;

  background:#111416;

  text-align:center;

  border-radius:4px;
}

.feature-icon{

  font-size:58px;

  filter:grayscale(1);

  text-shadow:
    0 0 8px #fff;
}

.feature-card h3{

  font-family:Georgia,serif;

  color:#f5ad1a;

  font-size:20px;
}

.feature-card p{

  font-family:Georgia,serif;

  line-height:1.7;

  color:#eee;
}


/* STEPS */

.steps-grid{

  display:grid;

  grid-template-columns:
    repeat(4,1fr);

  gap:36px;
}

.step{
  text-align:center;
}

.step-num{

  width:145px;
  height:176px;

  margin:auto;

  border:
    1px solid
    #d7191c;

  border-radius:50%;

  display:grid;

  place-items:center;

  font-size:100px;

  font-weight:300;

  color:#ffdede;

  text-shadow:

    0 0 13px #ff2323,

    0 0 25px #ff2323;
}

.step p{

  font-family:Georgia,serif;

  line-height:1.5;
}


/* ARTICLES */

.article-section{

  border:
    1px solid
    #706b5b;

  border-radius:14px;

  background:#101315;

  padding:22px 34px;

  margin-bottom:120px;
}

.article-main-title{

  font-family:Georgia,serif;

  color:#fff12e;

  font-size:32px;

  margin:
    0 0 24px;
}

.article-scroller{

  max-height:500px;

  overflow:auto;

  padding-right:18px;

  background:
    linear-gradient(
      90deg,
      rgba(0,144,210,.1),
      transparent
    );
}

.article-card{

  position:relative;

  border:
    1px solid
    #008fd0;

  border-radius:15px;

  padding:28px;

  margin-bottom:32px;

  background:#101315;
}

.article-card:after{

  content:"";

  width:27px;
  height:27px;

  border-radius:50%;

  position:absolute;

  right:22px;
  top:18px;

  background:
    linear-gradient(
      135deg,
      #ff9800,
      #9c2500
    );
}

.article-card h3{

  font-family:Georgia,serif;

  color:#ffa63e;

  font-size:28px;

  margin:
    0 50px
    16px
    0;
}

.article-card p{

  font-family:Georgia,serif;

  color:#eee;

  font-size:20px;

  line-height:1.55;
}

.read-more{

  float:right;

  background:#008fc7;

  padding:8px 13px;

  border-radius:18px;

  font-family:Georgia,serif;

  font-weight:700;
}


/* FLOATING BUTTONS */

.floating-left,
.floating-right{

  position:fixed;

  bottom:30px;

  display:flex;

  gap:12px;

  z-index:60;
}

.floating-left{

  left:
    max(
      18px,
      calc((100vw - var(--max))/2)
    );
}

.floating-right{

  right:
    max(
      18px,
      calc((100vw - var(--max))/2)
    );
}

.social-btn{

  width:56px;
  height:56px;

  border-radius:50%;

  display:grid;

  place-items:center;

  color:#fff;

  font-size:30px;

  font-weight:800;

  box-shadow:
    0 8px 22px
    rgba(0,0,0,.3);
}

.whatsapp{
  background:#00b956;
}

.instagram{
  background:#e90018;
}

.telegram{
  background:#06a7ca;
}

.youtube{
  background:#e00000;
}


/* DOWNLOAD */

.download-pill{

  position:fixed;

  left:50%;
  bottom:26px;

  transform:translateX(-50%);

  z-index:59;

  min-width:245px;

  padding:12px 22px;

  border-radius:35px;

  background:#0c0f10;

  display:flex;

  gap:14px;

  align-items:center;

  justify-content:center;

  font-family:Georgia,serif;
}

.download-pill small{

  display:block;

  margin-top:6px;
}

.android{
  font-size:29px;
}


/* FOOTER */

.footer{

  padding:
    30px
    0
    100px;

  border-top:
    1px solid
    #222;

  text-align:center;

  color:#aaa;
}

.disclaimer{
  font-size:12px;
}


/* TABLET */

@media(max-width:980px){

  .games-grid,
  .features-grid{

    grid-template-columns:
      repeat(2,1fr);
  }

  .steps-grid{

    grid-template-columns:
      repeat(2,1fr);
  }

  .banner-stage{
    height:300px;
  }

  .banner-copy h1{
    font-size:40px;
  }
}


/* MOBILE */

@media(max-width:640px){

  .container{

    width:
      min(
        100% - 20px,
        var(--max)
      );
  }

  .nav{
    height:78px;
  }

  .brand-top{
    font-size:30px;
  }

  .brand-bottom{
    font-size:21px;
  }

  .btn{

    padding:
      9px
      11px;

    font-size:13px;
  }

  .banner-stage{
    height:235px;
  }

  .banner-copy{

    left:6%;
    right:6%;
  }

  .banner-copy h1{
    font-size:29px;
  }

  .banner-copy p{
    font-size:13px;
  }

  .category-card{

    min-width:245px;

    height:128px;
  }

  .games-grid,
  .features-grid,
  .steps-grid{

    grid-template-columns:1fr;
  }

  .game-placeholder{
    font-size:26px;
  }

  .article-section{

    padding:
      18px
      12px;
  }

  .article-main-title{
    font-size:25px;
  }

  .article-card{
    padding:20px;
  }

  .article-card h3{
    font-size:23px;
  }

  .article-card p{
    font-size:17px;
  }

  .floating-left,
  .floating-right{
    bottom:16px;
  }

  .social-btn{

    width:46px;
    height:46px;

    font-size:23px;
  }

  .download-pill{

    bottom:14px;

    min-width:190px;

    padding:
      10px
      14px;

    font-size:12px;
  }

  .download-pill small{
    font-size:10px;
  }
}
/* =========================================================
   KUBER POINT - NEW FEATURES CSS
   ========================================================= */


/* GAME UPDATES */

.game-updates-grid{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap:24px;
}


.game-update-card{
  background:#111416;
  border:1px solid #363b3d;
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.25);
}


.game-update-card img{
  width:100%;
  height:210px;
  object-fit:cover;
}


.game-update-content{
  padding:22px;
}


.update-status{
  display:inline-block;
  padding:6px 12px;
  border-radius:20px;
  background:#d58a00;
  color:#fff;
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
}


.game-update-content h3{
  margin:14px 0;
  font-size:25px;
}


.teams-line{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:15px;
  padding:15px;
  background:#080a0b;
  border-radius:10px;
  font-size:18px;
}


.teams-line span,
.upcoming-teams span{
  color:#ffbd26;
  font-weight:900;
}


.match-meta,
.upcoming-info{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:16px;
  color:#c6c6c6;
  font-size:14px;
}


.game-update-content p{
  color:#ddd;
  line-height:1.6;
}


.kp-whatsapp-small{
  display:inline-block;
  margin-top:16px;
  padding:10px 15px;
  border-radius:25px;
  background:#00b956;
  color:#fff;
  font-weight:800;
  font-size:13px;
}


/* UPCOMING */

.upcoming-matches-grid{
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));
  gap:22px;
}


.upcoming-card{
  background:#111416;
  border:1px solid #363b3d;
  border-radius:14px;
  overflow:hidden;
}


.upcoming-card img{
  width:100%;
  height:180px;
  object-fit:cover;
}


.upcoming-content{
  padding:20px;
}


.match-type{
  color:#ffbd26;
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
}


.upcoming-content h3{
  margin:8px 0 16px;
}


.upcoming-teams{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:15px;
  background:#080a0b;
  border-radius:10px;
}


/* PHOTOS */

.photos-grid{
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));
  gap:25px;
}


.photo-post{
  background:#111416;
  border:1px solid #34393c;
  border-radius:14px;
  overflow:hidden;
}


.photo-image-wrap{
  background:#080909;
}


.photo-image-wrap img{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
}


.photo-post-body{
  padding:18px;
}


.photo-post-body h3{
  margin:0 0 8px;
  color:#ffbd26;
}


.photo-post-body p{
  color:#ccc;
  line-height:1.5;
}


/* LIKE + COMMENT */

.photo-actions{
  display:flex;
  gap:10px;
  margin-top:15px;
}


.like-btn,
.comment-toggle-btn{
  border:1px solid #34393c;
  background:#080a0b;
  color:#fff;
  border-radius:25px;
  padding:10px 15px;
  cursor:pointer;
  font-weight:700;
}


.like-btn:hover,
.comment-toggle-btn:hover,
.like-btn.liked{
  border-color:#d58a00;
  color:#ffd447;
}


.like-btn small{
  margin-left:4px;
}


.comments-area{
  margin-top:15px;
  border-top:1px solid #2c3133;
  padding-top:15px;
}


.comment-form{
  display:flex;
  flex-direction:column;
  gap:9px;
}


.comment-form input,
.comment-form textarea,
.review-form-box input,
.review-form-box textarea,
.review-form-box select{
  width:100%;
  border:1px solid #3a4043;
  background:#080a0b;
  color:#fff;
  padding:11px;
  border-radius:8px;
  outline:none;
}


.comment-form textarea{
  min-height:90px;
  resize:vertical;
}


.comment-form button,
.review-submit-btn{
  border:0;
  border-radius:8px;
  padding:11px;
  background:#d58a00;
  color:#fff;
  font-weight:900;
  cursor:pointer;
}


.comment-message{
  color:#ffbd26;
  font-size:13px;
}


.comments-list{
  margin-top:15px;
}


.comment-item{
  display:flex;
  gap:10px;
  padding:12px 0;
  border-bottom:1px solid #272c2e;
}


.comment-avatar,
.review-avatar{
  flex:none;
  width:40px;
  height:40px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#d58a00;
  color:#fff;
  font-weight:900;
}


.comment-content{
  min-width:0;
}


.comment-content strong{
  display:block;
}


.comment-content small{
  color:#888;
}


.comment-content p{
  margin:5px 0 0;
  color:#ddd;
  word-break:break-word;
}


.no-comments,
.comment-error{
  color:#888;
  font-size:13px;
}


/* REVIEWS */

.reviews-section{
  margin-top:30px;
}


.review-subtitle{
  text-align:center;
  color:#aaa;
  margin-top:-10px;
  margin-bottom:28px;
}


.reviews-grid{
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));
  gap:22px;
}


.review-card{
  position:relative;
  text-align:center;
  background:#111416;
  border:1px solid #383d3f;
  border-radius:15px;
  padding:28px 22px;
}


.review-avatar,
.review-avatar-image{
  width:72px;
  height:72px;
  border-radius:50%;
  margin:0 auto 14px;
}


.review-avatar-image{
  object-fit:cover;
}


.review-stars{
  color:#ffd447;
  font-size:20px;
  letter-spacing:2px;
}


.review-text{
  color:#ddd;
  line-height:1.65;
  min-height:80px;
}


.review-card h3{
  margin-bottom:4px;
  color:#ffbd26;
}


.review-card small{
  color:#888;
}


.review-form-box{
  width:min(650px,100%);
  margin:35px auto 0;
  background:#111416;
  border:1px solid #383d3f;
  border-radius:15px;
  padding:25px;
}


.review-form-box h3{
  margin-top:0;
  color:#ffbd26;
}


.review-form-box form{
  display:flex;
  flex-direction:column;
  gap:12px;
}


.review-form-box textarea{
  min-height:130px;
  resize:vertical;
}


.review-message{
  text-align:center;
  color:#ffbd26;
  font-size:13px;
}


/* FOOTER WHATSAPP */

.footer-whatsapp-btn{
  display:inline-block;
  margin:10px auto 20px;
  padding:13px 22px;
  border-radius:30px;
  background:#00b956;
  color:#fff;
  font-weight:900;
}


/* EMPTY */

.empty-content{
  grid-column:1/-1;
  padding:30px;
  text-align:center;
  background:#111416;
  border:1px solid #2d3234;
  border-radius:12px;
  color:#aaa;
}


/* MOBILE */

@media(max-width:980px){

  .game-updates-grid{
    grid-template-columns:1fr;
  }

  .upcoming-matches-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .photos-grid,
  .reviews-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

}


@media(max-width:640px){

  .upcoming-matches-grid,
  .photos-grid,
  .reviews-grid{
    grid-template-columns:1fr;
  }


  .teams-line{
    font-size:15px;
  }


  .photo-actions{
    flex-direction:column;
  }


  .like-btn,
  .comment-toggle-btn{
    width:100%;
  }


  .review-form-box{
    padding:18px;
  }

}
/* ================================
   KUBER POINT PREMIUM SERVICES
================================ */

.services-section {
  position: relative;
  padding-top: 45px;
  padding-bottom: 45px;
}

.services-section .section-subtitle {
  color: #aaa;
  text-align: center;
  margin: -8px auto 25px;
  font-size: 14px;
}


/* SLIDER */

.services-slider {
  display: flex;
  align-items: center;
  gap: 12px;
}

.services-track-wrapper {
  overflow: hidden;
  flex: 1;
}

.services-track {
  display: flex;
  gap: 18px;
  transition: transform .5s ease;
}


/* PREMIUM CARD */

.premium-service {
  position: relative;
  overflow: hidden;

  flex: 0 0 calc(50% - 9px);

  min-height: 245px;
  padding: 25px 20px;

  text-align: center;

  background:
    linear-gradient(
      145deg,
      rgba(255, 255, 255, .07),
      rgba(255, 255, 255, .015)
    );

  border: 1px solid rgba(212, 175, 55, .35);

  border-radius: 18px;

  box-shadow:
    0 10px 35px rgba(0,0,0,.45),
    inset 0 1px 0 rgba(255,255,255,.08);

  backdrop-filter: blur(12px);

  transition:
    transform .3s ease,
    border-color .3s ease,
    box-shadow .3s ease;
}


/* GOLD GLOW */

.service-glow {
  position: absolute;

  width: 130px;
  height: 130px;

  top: -65px;
  left: 50%;
  transform: translateX(-50%);

  background: rgba(212,175,55,.18);

  filter: blur(35px);

  pointer-events: none;
}


/* HOVER */

.premium-service:hover {
  transform: translateY(-6px);

  border-color: rgba(212,175,55,.8);

  box-shadow:
    0 15px 45px rgba(0,0,0,.55),
    0 0 25px rgba(212,175,55,.12);
}


/* ICON */

.premium-service .service-icon {
  position: relative;
  z-index: 2;

  width: 58px;
  height: 58px;

  margin: 0 auto 12px;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 27px;

  border-radius: 16px;

  background:
    linear-gradient(
      145deg,
      rgba(212,175,55,.25),
      rgba(212,175,55,.06)
    );

  border: 1px solid rgba(212,175,55,.45);

  box-shadow:
    0 0 20px rgba(212,175,55,.12),
    inset 0 0 15px rgba(212,175,55,.06);
}


/* BADGE */

.service-badge {
  display: inline-block;

  padding: 4px 10px;

  margin-bottom: 8px;

  font-size: 8px;
  font-weight: 700;

  letter-spacing: 1.5px;

  color: #d4af37;

  background: rgba(212,175,55,.08);

  border: 1px solid rgba(212,175,55,.25);

  border-radius: 20px;
}


/* TITLE */

.premium-service h3 {
  position: relative;
  z-index: 2;

  margin: 4px 0 8px;

  font-size: 19px;

  font-weight: 700;

  color: #fff;

  letter-spacing: .3px;
}


/* DESCRIPTION */

.premium-service p {
  position: relative;
  z-index: 2;

  max-width: 300px;

  margin: 0 auto 18px;

  color: #aaa;

  font-size: 12px;

  line-height: 1.5;
}


/* WHATSAPP BUTTON */

.premium-service .service-btn {
  position: relative;
  z-index: 3;

  display: inline-flex;

  align-items: center;
  justify-content: center;

  gap: 7px;

  min-width: 135px;

  padding: 10px 18px;

  color: #111;

  text-decoration: none;

  font-size: 12px;
  font-weight: 700;

  background:
    linear-gradient(
      135deg,
      #f5d76e,
      #d4af37,
      #b8860b
    );

  border-radius: 8px;

  box-shadow:
    0 5px 18px rgba(212,175,55,.2);

  transition: .3s ease;
}


.premium-service .service-btn:hover {
  transform: translateY(-2px);

  box-shadow:
    0 8px 25px rgba(212,175,55,.35);
}


/* ARROWS */

.slider-btn {
  position: relative;
  z-index: 5;

  width: 38px;
  height: 38px;

  min-width: 38px;

  display: flex;
  align-items: center;
  justify-content: center;

  color: #d4af37;

  background:
    rgba(212,175,55,.08);

  border: 1px solid rgba(212,175,55,.35);

  border-radius: 50%;

  cursor: pointer;

  font-size: 14px;

  transition: .3s ease;
}


.slider-btn:hover {
  color: #111;

  background: #d4af37;

  box-shadow:
    0 0 18px rgba(212,175,55,.3);
}


/* ================================
   MOBILE
================================ */

@media (max-width: 550px) {

  .services-section {
    padding: 30px 8px;
  }

  .services-section .section-subtitle {
    font-size: 11px;
    margin-bottom: 18px;
  }

  .services-slider {
    gap: 5px;
  }

  .services-track {
    gap: 8px;
  }

  .premium-service {
    flex: 0 0 calc(50% - 4px);

    min-height: 185px;

    padding: 14px 7px;

    border-radius: 12px;
  }

  .premium-service .service-icon {
    width: 38px;
    height: 38px;

    margin-bottom: 7px;

    font-size: 18px;

    border-radius: 10px;
  }

  .service-badge {
    font-size: 6px;

    padding: 3px 7px;

    margin-bottom: 4px;

    letter-spacing: 1px;
  }

  .premium-service h3 {
    font-size: 11px;

    margin: 3px 0 6px;
  }

  .premium-service p {
    font-size: 8px;

    line-height: 1.35;

    margin-bottom: 10px;
  }

  .premium-service .service-btn {
    min-width: auto;

    width: 90%;

    padding: 7px 3px;

    font-size: 8px;

    gap: 3px;

    border-radius: 5px;
  }

  .slider-btn {
    width: 25px;
    height: 25px;

    min-width: 25px;

    font-size: 9px;
  }

}
.casino-text {
  text-align: center;
  margin: 18px 0;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 0.7px;
  color: #ffffff;
  text-transform: uppercase;
  text-shadow: 0 0 10px rgba(212,175,55,0.35);
}

.casino-icon {
  font-size: 20px;
  margin-right: 5px;
}

.casino-dot {
  color: #d4af37;
  margin-right: 5px;
}

.casino-number {
  color: #d4af37;
  font-size: 21px;
  font-weight: 1000;
  text-shadow:
    0 0 5px rgba(212,175,55,0.8),
    0 0 15px rgba(212,175,55,0.4);
}

@media (max-width: 550px) {
  .casino-text {
    font-size: 13px;
    margin: 12px 0;
  }

  .casino-number {
    font-size: 15px;
  }

  .casino-icon {
    font-size: 15px;
  }
}
/* Hero ke baad extra space kam */
.hero-section {
  margin-bottom: 5px !important;
  padding-bottom: 0 !important;
}

/* Slider dots ke baad ka gap */
.slider-dots {
  margin: 5px 0 !important;
  padding: 0 !important;
}

/* Services section ko upar laaye */
.services-section {
  margin-top: -20px !important;
  padding-top: 0 !important;
}

/* Services heading */
.services-section .section-title {
  margin-top: 0 !important;
  margin-bottom: 10px !important;
}
.services-section {
  margin-top: -40px !important;
  padding-top: 0 !important;
}
.site-links-section {
  padding: 20px 16px;
  background: #050505;
}

.site-links-title {
  text-align: center;
  margin-bottom: 18px;
}

.site-links-title span {
  color: #d4af37;
  font-size: 25px;
}

.site-links-title h2 {
  margin: 3px 0;
  color: #fff;
  font-size: 21px;
  font-weight: 900;
  letter-spacing: 1.5px;
  text-shadow: 0 0 12px rgba(212,175,55,.35);
}

.site-links-title p {
  margin: 0;
  color: #a9a9a9;
  font-size: 11px;
  letter-spacing: 1px;
}

/* 4 SITE CARDS */
.site-links-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  max-width: 1100px;
  margin: auto;
}

.site-card {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 72px;
  padding: 12px;
  text-decoration: none;

  background:
    linear-gradient(145deg, #171717, #050505);

  border: 1px solid rgba(212,175,55,.55);
  border-radius: 14px;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 5px 18px rgba(0,0,0,.6),
    0 0 12px rgba(212,175,55,.08);

  transition: .25s ease;
  overflow: hidden;
}

.site-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 15%;
  width: 70%;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    #d4af37,
    transparent
  );
}

.site-card:hover {
  transform: translateY(-4px);
  border-color: #f5d76e;
  box-shadow:
    0 8px 25px rgba(0,0,0,.7),
    0 0 20px rgba(212,175,55,.25);
}

.site-icon {
  width: 42px;
  height: 42px;
  flex-shrink: 0;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 11px;

  background: linear-gradient(
    145deg,
    #d4af37,
    #8f6500
  );

  color: #080808;
  font-size: 20px;

  box-shadow:
    inset 0 1px 2px rgba(255,255,255,.5),
    0 0 12px rgba(212,175,55,.2);
}

.site-info {
  flex: 1;
  min-width: 0;
}

.site-info h3 {
  margin: 0;
  color: #fff;
  font-size: 14px;
  font-weight: 900;
  white-space: nowrap;
}

.site-info span {
  display: block;
  margin-top: 4px;
  color: #d4af37;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 1px;
}

.site-arrow {
  color: #d4af37;
  font-size: 27px;
  font-weight: 300;
}

/* MOBILE */
@media (max-width: 600px) {

  .site-links-section {
    padding: 12px 10px;
  }

  .site-links-title {
    margin-bottom: 12px;
  }

  .site-links-title h2 {
    font-size: 17px;
  }

  .site-links-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
  }

  .site-card {
    min-height: 62px;
    padding: 9px;
    gap: 7px;
    border-radius: 11px;
  }

  .site-icon {
    width: 34px;
    height: 34px;
    font-size: 16px;
    border-radius: 9px;
  }

  .site-info h3 {
    font-size: 11px;
  }

  .site-info span {
    font-size: 7px;
    margin-top: 3px;
  }

  .site-arrow {
    font-size: 20px;
  }
}
/* GAME UPDATES - MOBILE RESPONSIVE */

@media (max-width: 768px) {
  .game-updates-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .game-update-card img {
    height: 190px;
  }

  .game-update-content {
    padding: 16px;
  }

  .game-update-content h3 {
    font-size: 21px;
  }

  .teams-line {
    gap: 10px;
    padding: 12px;
    font-size: 16px;
    flex-wrap: wrap;
  }

  .match-meta,
  .upcoming-info {
    gap: 8px;
    font-size: 13px;
  }
}