/* ===== ELITE RAXI STYLE CSS ===== */
/* use with your current html structure */
:root{

  --bg:#120000;
  --bg2:#1b0000;

  --card:#230505;
  --card2:#2d0909;

  --border:#5a1313;

  --gold:#ffbf2f;
  --gold2:#ff9f1a;

  --red:#ff3b30;
  --red2:#7a0b0b;

  --text:#ffffff;
  --text2:#d8cfcf;

  --shadow:0 0 0 1px rgba(255,180,0,.08),
  0 12px 35px rgba(0,0,0,.45);

}

*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{

  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;

  background:
  radial-gradient(
    circle at top,
    #330000 0%,
    #120000 45%,
    #090000 100%
  );

  color:var(--text);

  min-height:100vh;

  line-height:1.65;

  overflow-x:hidden;

}

/* ===== SCROLLBAR ===== */

::-webkit-scrollbar{
  width:8px;
}

::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,var(--gold),#ff7b00);
  border-radius:20px;
}

/* ===== CONTAINER ===== */

main{
  width:100%;
}

.content-wrap,
.hero,
.trust-bar,
.site-header .nav{

  width:min(100%,620px);
  margin-inline:auto;

}

/* ===== HEADER ===== */

.site-header{
  padding:24px 16px 10px;
}

.nav{

  background:linear-gradient(135deg,#2a0606,#190303);

  border:1px solid rgba(255,180,0,.12);

  border-radius:24px;

  padding:18px 20px;

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

  box-shadow:var(--shadow);

  position:relative;

  overflow:hidden;

}





.brand{
  display:flex;
  align-items:center;
  gap:12px;

  text-decoration:none;

  color:#fff;

  font-weight:800;
  font-size:1.2rem;

  position:relative;
  z-index:2;
}

.brand-logo{
  width:46px;
  height:46px;
  object-fit:contain;
}

/* ===== NAV MENU ===== */

.nav-menu{
  display:flex;
  align-items:center;
  gap:18px;
}

.nav-menu a{

  text-decoration:none;

  color:#ffdca0;

  font-size:.92rem;
  font-weight:600;

  transition:.25s ease;

}

.nav-menu a:hover{
  color:#fff;
}

/* ===== HERO ===== */

.hero{

  margin-top:20px;

  background:
  linear-gradient(135deg,
  rgba(60,0,0,.95),
  rgba(28,0,0,.96));

  border:1px solid rgba(255,180,0,.12);

  border-radius:28px;

  padding:34px 28px;

  position:relative;
  overflow:hidden;

  box-shadow:var(--shadow);

}

.hero::before{

  content:"";

  position:absolute;
  inset:0;

  background:
  radial-gradient(circle at top right,
  rgba(255,180,0,.12),
  transparent 35%);

  pointer-events:none;

}

.eyebrow{

  display:inline-flex;
  align-items:center;
  gap:8px;

  background:rgba(255,191,47,.08);

  border:1px solid rgba(255,191,47,.18);

  color:var(--gold);

  padding:8px 16px;

  border-radius:999px;

  font-size:.78rem;
  font-weight:800;
  letter-spacing:1.2px;

  text-transform:uppercase;

  margin-bottom:18px;

}

.trusted-badge{

  width:fit-content;

  background:linear-gradient(135deg,#ffbf2f,#ff8c00);

  color:#1c0900;

  padding:10px 18px;

  border-radius:999px;

  font-weight:800;
  font-size:.92rem;

  margin-bottom:22px;

  box-shadow:
  0 8px 24px rgba(255,180,0,.18);

}

.hero h1{

  font-size:2.7rem;
  line-height:1.1;

  font-weight:900;

  margin-bottom:18px;

  background:
  linear-gradient(180deg,#fff,#ffc76a);

  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;

}

.hero p{

  color:#d8cfcf;

  font-size:1rem;

  margin-bottom:18px;

}

/* ===== BUTTONS ===== */

.hero-actions,
.links{

  display:flex;
  flex-wrap:wrap;
  gap:14px;

  margin-top:26px;

}

.button{

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

  text-decoration:none;

  border:none;
  outline:none;

  min-height:56px;

  padding:0 28px;

  border-radius:16px;

  font-weight:800;

  transition:.28s ease;

  cursor:pointer;

}

.button.primary{

  background:
  linear-gradient(135deg,
  #ffcf4d,
  #ff9800);

  color:#220800;

  box-shadow:
  0 10px 25px rgba(255,170,0,.28);

}

.button.primary:hover{

  transform:translateY(-2px);

  box-shadow:
  0 14px 35px rgba(255,170,0,.34);

}

.button.secondary{

  background:rgba(255,255,255,.04);

  border:1px solid rgba(255,255,255,.08);

  color:#fff;

}

.button.secondary:hover{

  background:rgba(255,255,255,.08);

}

/* ===== TRUST BAR ===== */

.trust-bar{

  margin-top:18px;

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

  gap:14px;

}

.trust-bar span{

  background:
  linear-gradient(135deg,#250505,#1a0202);

  border:1px solid rgba(255,180,0,.08);

  border-radius:18px;

  padding:16px;

  text-align:center;

  color:#ffcf91;

  font-weight:700;
  font-size:.9rem;

  box-shadow:var(--shadow);

}

/* ===== CONTENT ===== */

.content-wrap{
  margin-top:22px;
  padding-bottom:80px;
}

.article{
  display:flex;
  flex-direction:column;
  gap:22px;
}

.section{

  background:
  linear-gradient(135deg,#240505,#180202);

  border:1px solid rgba(255,180,0,.1);

  border-radius:26px;

  padding:28px;

  position:relative;
  overflow:hidden;

  box-shadow:var(--shadow);

}

.section::before{

  content:"";

  position:absolute;
  top:0;
  left:0;

  width:100%;
  height:2px;

  background:
  linear-gradient(90deg,
  transparent,
  #ffbf2f,
  transparent);

}

.section h2{

  font-size:1.8rem;

  margin-bottom:18px;

  color:#fff1c5;

  line-height:1.2;

}

.section h3{

  font-size:1.15rem;

  margin-bottom:10px;

  color:#fff;

}

.section p{

  color:#d7caca;

  margin-bottom:16px;

}

/* ===== FEATURE GRID ELITE FIX ===== */

.feature-grid,
.game-grid,
.stat-grid{

  display:grid;

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

  gap:18px;

  margin-top:24px;

  align-items:stretch;

}

/* ===== CARD ===== */

.feature,
.game-card,
.stat-grid div{

  position:relative;

  display:flex;
  flex-direction:column;
  justify-content:flex-start;

  min-height:220px;

  overflow:hidden;

  background:
  linear-gradient(
    135deg,
    rgba(255,255,255,.03),
    rgba(255,255,255,.015)
  );

  border:1px solid rgba(255,180,0,.08);

  border-radius:24px;

  padding:24px;

  transition:.32s ease;

  backdrop-filter:blur(10px);

}

/* ===== HOVER ===== */

.feature:hover,
.game-card:hover{

  transform:translateY(-5px);

  border-color:rgba(255,191,47,.30);

  box-shadow:
  0 18px 40px rgba(0,0,0,.28),
  0 0 0 1px rgba(255,191,47,.05);

}

/* ===== ICON ===== */

.icon{

  width:56px;
  height:56px;

  border-radius:16px;

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

  background:
  linear-gradient(
    135deg,
    #ffcf4d,
    #ff8c00
  );

  color:#220700;

  font-weight:900;

  font-size:1rem;

  margin-bottom:18px;

  box-shadow:
  0 10px 24px rgba(255,140,0,.25);

}

/* ===== FIX REGISTER BUTTON CARD ===== */

.feature-grid > .button{

  width:100%;

  min-height:220px;

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

  text-align:center;

  border-radius:24px;

  font-size:1.15rem;
  font-weight:900;

  padding:24px;

}

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

@media(max-width:768px){

  .feature-grid,
  .game-grid,
  .stat-grid{

    grid-template-columns:1fr;

    gap:16px;

  }

  .feature,
  .game-card,
  .stat-grid div,
  .feature-grid > .button{

    min-height:auto;

  }

}

/* ===== GAME CARDS ===== */

.game-card{
  overflow:hidden;
}

.game-img{

  width:100%;
  border-radius:18px;

  margin-bottom:16px;

}

.game-badge{

  display:inline-flex;

  padding:8px 14px;

  border-radius:999px;

  font-size:.72rem;
  font-weight:800;

  margin-bottom:14px;

}

.red{
  background:#ff303020;
  color:#ff7f7f;
}

.green{
  background:#14d46a20;
  color:#6dffad;
}

.blue{
  background:#4f7dff20;
  color:#8cb4ff;
}

.gold{
  background:#ffbf2f20;
  color:#ffd16b;
}

/* ===== TABLE ===== */

.info-table{

  margin-top:20px;

  border:1px solid rgba(255,180,0,.1);

  border-radius:22px;

  overflow:hidden;

}

.info-table div{

  display:flex;
  justify-content:space-between;
  gap:18px;

  padding:18px 20px;

  border-bottom:1px solid rgba(255,255,255,.04);

  background:
  linear-gradient(90deg,
  rgba(255,255,255,.02),
  transparent);

}

.info-table div:last-child{
  border-bottom:none;
}

/* ===== FAQ ===== */

details{

  background:
  linear-gradient(135deg,#260606,#170303);

  border:1px solid rgba(255,180,0,.08);

  border-radius:18px;

  padding:18px 20px;

  margin-bottom:14px;

}

summary{

  cursor:pointer;

  font-weight:800;

  color:#fff;

}

/* ===== FOOTER ELITE ===== */

.footer{

  width:min(100%,620px);

  margin:0 auto 40px;

  padding:34px 24px 120px;

  border-radius:28px;

  position:relative;

  overflow:hidden;

  background:
  linear-gradient(
    180deg,
    rgba(42,4,4,.98),
    rgba(16,1,1,.98)
  );

  border:1px solid rgba(255,191,47,.12);

  text-align:center;

  box-shadow:
  0 20px 50px rgba(0,0,0,.35),
  inset 0 1px 0 rgba(255,255,255,.03);

}

/* ===== TOP GLOW ===== */

.footer::before{

  content:"";

  position:absolute;

  top:-120px;
  left:50%;

  transform:translateX(-50%);

  width:280px;
  height:280px;

  background:
  radial-gradient(
    circle,
    rgba(255,170,0,.16),
    transparent 70%
  );

  pointer-events:none;

}

/* ===== FOOTER TEXT ===== */

.footer p{

  color:#ffe5c7;

  line-height:1.8;

  font-size:.96rem;

}

/* ===== FOOTER LINKS ===== */

.footer-links{

  display:flex;

  flex-wrap:wrap;

  justify-content:center;

  gap:10px;

  margin:22px 0 26px;

}

/* ===== LINK STYLE ===== */

.footer-links a{

  display:inline-flex;

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

  min-height:40px;

  padding:10px 16px;

  border-radius:14px;

  text-decoration:none;

  color:#ffd898;

  font-size:.92rem;

  font-weight:700;

  background:
  linear-gradient(
    135deg,
    rgba(255,255,255,.03),
    rgba(255,255,255,.015)
  );

  border:1px solid rgba(255,191,47,.10);

  transition:.28s ease;

}

/* ===== HOVER ===== */

.footer-links a:hover{

  transform:translateY(-2px);

  color:#fff4da;

  border-color:rgba(255,191,47,.28);

  background:
  linear-gradient(
    135deg,
    rgba(255,191,47,.10),
    rgba(255,120,0,.05)
  );

  box-shadow:
  0 10px 24px rgba(255,140,0,.14);

}

/* ===== NOTE ===== */

.footer-note{

  margin-top:18px;

  color:#ffcf84;

  font-size:.88rem;

  opacity:.82;

}

/* ===== DISCLAIMER ===== */

.footer-disclaimer{

  margin-top:22px;

  padding-top:18px;

  border-top:1px solid rgba(255,255,255,.05);

  color:#d9b38b;

  font-size:.84rem;

  line-height:1.9;

  opacity:.76;

}

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

@media(max-width:768px){

  .footer{

    padding:
    28px
    18px
    120px;

    border-radius:24px;

  }

  .footer-links{

    gap:8px;

  }

  .footer-links a{

    width:calc(50% - 4px);

    padding:10px 12px;

    font-size:.84rem;

    border-radius:12px;

  }

  .footer p{

    font-size:.9rem;

    line-height:1.7;

  }

  .footer-disclaimer{

    font-size:.8rem;

    line-height:1.8;

  }

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

@media(max-width:768px){

  .nav{
    padding:16px;
  }



  .hero{
    padding:24px 20px;
  }

  .hero h1{
    font-size:2rem;
  }

  .feature-grid,
  .game-grid,
  .stat-grid,
  .trust-bar{
    grid-template-columns:1fr;
  }

  .section{
    padding:22px;
  }

  .button{
    width:100%;
  }

}


/* ===== FINAL MOBILE STICKY FIX ===== */

.sticky-cta{

  position:fixed !important;

  bottom:10px !important;

  left:12px !important;

  right:12px !important;

  width:auto !important;

  max-width:none !important;

  transform:none !important;

  margin:0 !important;

  padding:0 !important;

  z-index:999999 !important;

}

.sticky-cta a{

  display:flex !important;

  align-items:center !important;

  justify-content:center !important;

  width:100% !important;

  min-height:56px !important;

  padding:12px 20px !important;

  border-radius:999px !important;

  text-decoration:none !important;

  font-size:.95rem !important;

  font-weight:900 !important;

  color:#220800 !important;

  background:
  linear-gradient(
    135deg,
    #ffcf4d,
    #ff9800
  ) !important;

  box-shadow:
  0 12px 35px rgba(255,170,0,.28) !important;

  border:none !important;

  transform:none !important;

  animation:none !important;

  transition:none !important;

}

/* DESKTOP */

@media(min-width:769px){

  .sticky-cta{

    left:50% !important;

    right:auto !important;

    width:620px !important;

    transform:translateX(-50%) !important;

  }

}




/* ===== TOC ===== */

.toc{

  background:
  linear-gradient(135deg,#240505,#180202);

  border:1px solid rgba(255,180,0,.08);

  border-radius:24px;

  padding:24px;

  margin-bottom:24px;

  box-shadow:var(--shadow);

}

.toc h2{

  margin-bottom:18px;

  color:#fff1c5;

  font-size:1.8rem;

}

.toc a{

  display:inline-flex;

  margin:0 10px 12px 0;

  padding:10px 16px;

  border-radius:999px;

  text-decoration:none;

  background:rgba(255,255,255,.03);

  border:1px solid rgba(255,180,0,.08);

  color:#ffdca0;

  font-size:.9rem;
  font-weight:700;

  transition:.25s ease;

}

.toc a:hover{

  background:rgba(255,191,47,.08);

  border-color:rgba(255,191,47,.24);

  color:#fff;

}



/* ===== LINK FIX ===== */

a{

  color:inherit;

  text-decoration:none;

}

.section a,
.toc a,
.footer a,
.nav-menu a{

  color:#ffdca0;

  text-decoration:none;

}

.section a:hover,
.toc a:hover,
.footer a:hover,
.nav-menu a:hover{

  color:#ffffff;

}

/* inline article links */

.section p a,
.section li a{

  color:#ffbf2f;

  font-weight:700;

}

.section p a:hover,
.section li a:hover{

  color:#ffd978;

}


a{
  color:inherit;
}



/* ===== ELITE RATING SECTION ===== */

.rating{

  text-align:left;

}

.rating h2{

  margin-bottom:18px;

}

.stars{

  display:flex;
  align-items:center;
  gap:10px;

  margin-bottom:14px;

}

.stars button{

  width:52px;
  height:52px;

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

  border:none;
  outline:none;

  border-radius:16px;

  cursor:pointer;

  font-size:1.8rem;
  font-weight:900;

  color:#ffbf2f;

  background:
  linear-gradient(
    135deg,
    rgba(255,255,255,.04),
    rgba(255,255,255,.02)
  );

  border:1px solid rgba(255,180,0,.08);

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

  transition:.28s ease;

}

.stars button:hover{

  transform:
  translateY(-3px)
  scale(1.06);

  color:#fff3cf;

  border-color:
  rgba(255,191,47,.35);

  background:
  linear-gradient(
    135deg,
    rgba(255,191,47,.16),
    rgba(255,140,0,.08)
  );

  box-shadow:
  0 14px 30px rgba(255,170,0,.22);

}

.rating-text{

  color:#d7caca;

  font-size:.96rem;

}

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

@media(max-width:768px){

  .stars{
    gap:8px;
  }

  .stars button{

    width:46px;
    height:46px;

    font-size:1.5rem;

    border-radius:14px;

  }

}


/* ===== MOBILE NAV TOGGLE ===== */

.nav-toggle{

  display:none;

  width:48px;
  height:48px;

  border:none;
  outline:none;

  background:
  linear-gradient(
    135deg,
    rgba(255,255,255,.05),
    rgba(255,255,255,.02)
  );

  border:1px solid rgba(255,180,0,.08);

  border-radius:14px;

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

  cursor:pointer;

  position:relative;
  z-index:5;

}

.nav-toggle span{

  position:absolute;

  width:22px;
  height:2px;

  background:#fff;

  border-radius:999px;

  transition:.28s ease;

}

.nav-toggle span:nth-child(1){
  transform:translateY(-7px);
}

.nav-toggle span:nth-child(2){
  transform:translateY(0);
}

.nav-toggle span:nth-child(3){
  transform:translateY(7px);
}

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

@media(max-width:768px){

  .nav-toggle{
    display:flex;
  }

}




/* ===== ELITE MOBILE FIX ===== */

@media(max-width:768px){

  body{
    overflow-x:hidden;
  }

  .site-header{
    padding:14px;
  }

  .nav{

    padding:14px 16px;

    border-radius:18px;

    gap:12px;

  }

  .brand{
    font-size:1rem;
  }

  .brand-logo{
    width:40px;
    height:40px;
  }

  .hero{

    margin-top:14px;

    padding:22px 18px;

    border-radius:22px;

  }

  .hero h1{

    font-size:1.7rem;

    line-height:1.2;

  }

  .hero p{
    font-size:.95rem;
  }

  .section{

    padding:20px 16px;

    border-radius:22px;

  }

  .section h2{
    font-size:1.45rem;
  }

  .feature,
  .game-card,
  .stat-grid div{

    padding:18px;

    border-radius:18px;

  }

  .info-table div{

    flex-direction:column;

    align-items:flex-start;

    gap:8px;

  }

  .footer{

    margin-inline:14px;

    width:auto;

    padding:22px 16px;

  }

  .button{

    width:100%;

    min-height:54px;

    font-size:.95rem;

  }

  img{
    max-width:100%;
    height:auto;
  }

}



/* ===== MOBILE MENU WORKING FIX ===== */

@media(max-width:768px){

  .nav-menu{

    position:absolute;

    top:calc(100% + 12px);

    left:0;
    right:0;

    display:none;
    flex-direction:column;
    align-items:flex-start;

    gap:0;

    padding:14px;

    background:
    linear-gradient(
      135deg,
      #260606,
      #140202
    );

    border:1px solid rgba(255,180,0,.10);

    border-radius:20px;

    box-shadow:
    0 18px 40px rgba(0,0,0,.45);

    z-index:1000000;

  }

  .nav-menu.active{
    display:flex;
  }

  .nav-menu a{

    width:100%;

    padding:14px 16px;

    border-radius:14px;

    font-size:.95rem;

  }

  .nav-menu a:hover{

    background:
    rgba(255,255,255,.04);

  }

}



/* ===== TRUST STRIP ELITE ===== */

.trust-strip{

  display:flex;

  flex-wrap:wrap;

  align-items:center;

  gap:10px;

  margin-top:16px;

}

/* ===== TRUST BADGE ===== */

.trust-strip span{

  display:flex;

  align-items:center;

  justify-content:center;

  gap:6px;

  padding:10px 14px;

  border-radius:999px;

  background:
  linear-gradient(
    135deg,
    rgba(255,255,255,.04),
    rgba(255,255,255,.02)
  );

  border:1px solid rgba(255,191,47,.12);

  color:#fff3d0;

  font-size:.92rem;

  font-weight:700;

  line-height:1;

  white-space:nowrap;

  backdrop-filter:blur(10px);

  transition:.28s ease;

}

/* ===== HOVER EFFECT ===== */

.trust-strip span:hover{

  transform:translateY(-2px);

  border-color:rgba(255,191,47,.26);

  box-shadow:
  0 10px 24px rgba(0,0,0,.22);

}

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

@media(max-width:768px){

  .trust-strip{

    gap:8px;

  }

  .trust-strip span{

    width:100%;

    justify-content:flex-start;

    font-size:.88rem;

    padding:11px 14px;

  }

}




/* ===== GIFT CODE BOX ELITE ===== */

.giftcode-box{

  position:relative;

  margin-top:28px;

  padding:24px;

  border-radius:26px;

  overflow:hidden;

  background:
  linear-gradient(
    135deg,
    rgba(255,255,255,.035),
    rgba(255,255,255,.015)
  );

  border:1px solid rgba(255,191,47,.10);

  box-shadow:
  0 18px 45px rgba(0,0,0,.28);

  backdrop-filter:blur(12px);

}

/* ===== TOP HEADER ===== */

.giftcode-head{

  display:flex;

  align-items:center;

  justify-content:space-between;

  gap:12px;

  margin-bottom:18px;

}

/* ===== TITLE ===== */

.giftcode-title{

  font-size:1.15rem;

  font-weight:900;

  color:#ffe4b3;

}

/* ===== BADGE ===== */

.giftcode-badge{

  padding:8px 14px;

  border-radius:999px;

  background:
  linear-gradient(
    135deg,
    #ffcf4d,
    #ff9800
  );

  color:#220700;

  font-size:.82rem;

  font-weight:900;

  white-space:nowrap;

  box-shadow:
  0 10px 24px rgba(255,170,0,.24);

}

/* ===== INPUT + BUTTON ===== */

.giftcode-row{

  display:flex;

  align-items:center;

  gap:12px;

}

/* ===== INPUT ===== */

.giftcode-input{

  flex:1;

  height:56px;

  border:none;

  outline:none;

  border-radius:16px;

  padding:0 18px;

  background:
  rgba(255,255,255,.045);

  border:1px solid rgba(255,191,47,.08);

  color:#fff;

  font-size:.92rem;

  font-weight:700;

  letter-spacing:.5px;

}

/* ===== COPY BUTTON ===== */

.giftcode-btn{

  height:56px;

  padding:0 22px;

  border:none;

  border-radius:16px;

  cursor:pointer;

  font-weight:900;

  font-size:.95rem;

  color:#220700;

  background:
  linear-gradient(
    135deg,
    #ffcf4d,
    #ff9800
  );

  transition:.28s ease;

  box-shadow:
  0 12px 28px rgba(255,170,0,.22);

}

.giftcode-btn:hover{

  transform:translateY(-2px);

  box-shadow:
  0 16px 34px rgba(255,170,0,.30);

}

/* ===== NOTE ===== */

.giftcode-note{

  margin-top:14px;

  color:#ffe8c0;

  font-size:.9rem;

  opacity:.9;

}

/* ===== SUCCESS STATE ===== */

.giftcode-note.success{

  color:#5dff9b;

}

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

@media(max-width:768px){

  .giftcode-box{

    padding:20px;

    border-radius:22px;

  }

  .giftcode-head{

    flex-direction:column;

    align-items:flex-start;

  }

  .giftcode-row{

    flex-direction:column;

    align-items:stretch;

  }

  .giftcode-input,
  .giftcode-btn{

    width:100%;

  }

  .giftcode-input{

    font-size:.84rem;

  }

}




/* ===== STATS PANEL ELITE ===== */

.stats-panel{

  position:relative;

}

/* ===== GRID ===== */

.stat-grid{

  display:grid;

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

  gap:18px;

  margin-top:24px;

}

/* ===== CARD ===== */

.stat-card{

  position:relative;

  min-height:220px;

  padding:26px;

  border-radius:24px;

  overflow:hidden;

  background:
  linear-gradient(
    135deg,
    rgba(255,255,255,.03),
    rgba(255,255,255,.015)
  );

  border:1px solid rgba(255,191,47,.10);

  transition:.32s ease;

  backdrop-filter:blur(10px);

}

.stat-card:hover{

  transform:translateY(-4px);

  border-color:rgba(255,191,47,.24);

  box-shadow:
  0 16px 40px rgba(0,0,0,.25);

}

/* ===== NUMBER ===== */

.stat-card strong{

  width:54px;
  height:54px;

  display:flex;

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

  border-radius:16px;

  margin-bottom:20px;

  font-size:1.1rem;

  font-weight:900;

  color:#220700;

  background:
  linear-gradient(
    135deg,
    #ffcf4d,
    #ff9800
  );

  box-shadow:
  0 12px 28px rgba(255,170,0,.22);

}

/* ===== TITLE ===== */

.stat-card h3{

  font-size:1.25rem;

  font-weight:800;

  line-height:1.35;

  color:#fff1d2;

  margin-bottom:14px;

}

/* ===== TEXT ===== */

.stat-card p{

  color:#ffe4c2;

  opacity:.88;

  line-height:1.8;

  font-size:.98rem;

}

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

@media(max-width:768px){

  .stat-grid{

    grid-template-columns:1fr;

  }

  .stat-card{

    min-height:auto;

    padding:22px;

  }

  .stat-card h3{

    font-size:1.12rem;

  }

  .stat-card p{

    font-size:.92rem;

    line-height:1.7;

  }

}



/* ===== BODY MENU OPEN FIX ===== */

body.menu-open{

  overflow:hidden;

}

/* ===== MOBILE MENU ELITE ===== */

@media(max-width:768px){

  .nav{

    overflow:hidden;

  }

  .nav-menu{

    position:absolute;

    top:calc(100% + 12px);

    left:0;
    right:0;

    display:flex;

    flex-direction:column;

    align-items:flex-start;

    gap:4px;

    padding:14px;

    background:
    linear-gradient(
      135deg,
      #260606,
      #140202
    );

    border:1px solid rgba(255,180,0,.10);

    border-radius:22px;

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

    opacity:0;

    visibility:hidden;

    pointer-events:none;

    transform:
    translateY(-10px);

    transition:
    opacity .28s ease,
    transform .28s ease,
    visibility .28s ease;

    z-index:1000000;

  }

  .nav-menu.active{

    opacity:1;

    visibility:visible;

    pointer-events:auto;

    transform:
    translateY(0)
    

  }

  .nav-menu a{

    width:100%;

    padding:14px 16px;

    border-radius:14px;

    font-size:.95rem;

    color:#ffe0a8;

    transition:.25s ease;

  }

  .nav-menu a:hover{

    background:
    rgba(255,255,255,.04);

    color:#fff;

  }

}

.nav::before{

  content:"";

  position:absolute;

  top:0;
  left:-40%;

  width:40%;
  height:100%;

  background:
  linear-gradient(
    90deg,
    transparent,
    rgba(255,191,47,.08),
    transparent
  );

  animation:shine 4.5s linear infinite;

  pointer-events:none;
  
  overflow:hidden;

}

@keyframes shine{

  from{
    left:-40%;
  }

  to{
    left:100%;
  }

}