
/* =========================================================

   KCU GAMING

   Page-specific visual system

   ========================================================= */



.gaming-page{

  --gaming-red:#ff2424;

  --gaming-red-soft:#ff633d;

  --gaming-red-dim:rgba(255,36,36,.14);

  --gaming-bg:#06070a;

  --gaming-panel:#0b0d11;

  --gaming-panel-2:#0f1116;

  --gaming-border:rgba(255,255,255,.12);

  --gaming-muted:#777b83;

  --gaming-text:#f4f4f5;

  background:

    radial-gradient(circle at 50% 15%,rgba(255,36,36,.055),transparent 34%),

    #06070a;

  color:var(--gaming-text);

  overflow-x:hidden;

}



.gaming-page *{

  box-sizing:border-box;

}



.gaming-page a{

  color:inherit;

}



.gaming-bg-grid{

  position:fixed;

  inset:0;

  z-index:0;

  pointer-events:none;

  opacity:.12;

  background-image:

    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),

    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);

  background-size:48px 48px;

  mask-image:linear-gradient(to bottom,#000,transparent 90%);

}



.gaming-noise{

  position:fixed;

  inset:0;

  z-index:0;

  pointer-events:none;

  opacity:.025;

  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");

}



.gaming-glow{

  position:fixed;

  width:420px;

  height:420px;

  border-radius:50%;

  filter:blur(120px);

  pointer-events:none;

  z-index:0;

  opacity:.07;

}



.gaming-glow-a{

  top:2%;

  left:-220px;

  background:var(--gaming-red);

}



.gaming-glow-b{

  top:48%;

  right:-240px;

  background:#ff3030;

}





/* NAV */



.gaming-nav{

  position:relative;

  z-index:10;

  width:min(1200px,calc(100% - 40px));

  margin:0 auto;

  padding:24px 0;

  display:flex;

  align-items:center;

  justify-content:space-between;

  gap:20px;

}



.gaming-brand{

  display:flex;

  align-items:center;

  gap:9px;

  font:700 11px/1 Space Grotesk,sans-serif;

  letter-spacing:.14em;

}



.gaming-brand-mark{

  color:#fff;

}



.gaming-brand-divider{

  width:1px;

  height:13px;

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

}



.gaming-brand-page{

  color:var(--gaming-red);

}



.gaming-nav-links{

  display:flex;

  gap:26px;

  align-items:center;

}



.gaming-nav-links a{

  color:#777b83;

  font:600 10px/1 Space Grotesk,sans-serif;

  letter-spacing:.13em;

  text-transform:uppercase;

  transition:color .2s ease;

}



.gaming-nav-links a:hover{

  color:#fff;

}



.gaming-back{

  display:flex;

  align-items:center;

  gap:8px;

  color:#9a9da5;

  font:700 9px/1 Space Grotesk,sans-serif;

  letter-spacing:.14em;

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

  padding:10px 13px;

  border-radius:999px;

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

  transition:.25s ease;

}



.gaming-back:hover{

  color:#fff;

  border-color:rgba(255,36,36,.45);

  background:rgba(255,36,36,.06);

}





/* HERO */



.gaming-hero{

  position:relative;

  z-index:1;

  width:min(1200px,calc(100% - 40px));

  min-height:690px;

  margin:18px auto 0;

  display:grid;

  place-items:center;

}



.hero-reactor{

  position:absolute;

  inset:0;

  overflow:hidden;

  border-radius:34px;

  background:

    radial-gradient(circle at 50% 45%,rgba(255,36,36,.045),transparent 42%),

    linear-gradient(145deg,#0b0d11,#06070a);

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

  box-shadow:

    inset 0 0 80px rgba(255,36,36,.025),

    0 30px 90px rgba(0,0,0,.35);

}



.reactor-inner{

  position:absolute;

  inset:12%;

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

  border-radius:26px;

  background:

    radial-gradient(circle at 50% 50%,rgba(255,36,36,.035),transparent 48%);

}



.hero-reactor-frame{

  position:absolute;

  inset:0;

  width:100%;

  height:100%;

  pointer-events:none;

}



.hero-reactor-line{

  fill:none;

  stroke:var(--gaming-red);

  stroke-width:2.5;

  stroke-dasharray:72 928;

  filter:

    drop-shadow(0 0 4px rgba(255,36,36,.9))

    drop-shadow(0 0 14px rgba(255,36,36,.38));

  animation:gaming-reactor 3.4s linear infinite;

}



.hero-line-b{

  stroke:var(--gaming-red-soft);

  stroke-width:1.15;

  stroke-dasharray:190 810;

  animation-duration:4.8s;

  animation-direction:reverse;

  opacity:.8;

}



@keyframes gaming-reactor{

  to{

    stroke-dashoffset:-1000;

  }

}



.reactor-corner{

  position:absolute;

  width:34px;

  height:34px;

  border-color:rgba(255,36,36,.7);

  border-style:solid;

  opacity:.65;

}



.reactor-corner-tl{

  top:30px;

  left:30px;

  border-width:1px 0 0 1px;

}



.reactor-corner-tr{

  top:30px;

  right:30px;

  border-width:1px 1px 0 0;

}



.reactor-corner-bl{

  bottom:30px;

  left:30px;

  border-width:0 0 1px 1px;

}



.reactor-corner-br{

  right:30px;

  bottom:30px;

  border-width:0 1px 1px 0;

}



.hero-content{

  position:relative;

  z-index:3;

  width:min(720px,80%);

  text-align:center;

  display:flex;

  flex-direction:column;

  align-items:center;

}



.hero-status{

  display:flex;

  align-items:center;

  gap:8px;

  margin-bottom:24px;

  color:#777b83;

  font:700 9px/1 Space Grotesk,sans-serif;

  letter-spacing:.2em;

}



.status-dot{

  width:6px;

  height:6px;

  border-radius:50%;

  background:var(--gaming-red);

  box-shadow:0 0 9px rgba(255,36,36,.8);

}



.hero-logo{

  width:170px;

  height:170px;

  display:grid;

  place-items:center;

  margin-bottom:16px;

  filter:drop-shadow(0 0 20px rgba(255,36,36,.09));

}



.hero-logo img{

  width:100%;

  height:100%;

  object-fit:contain;

  border-radius:22px;

}



.hero-kicker{

  color:var(--gaming-red);

  font:700 10px/1 Space Grotesk,sans-serif;

  letter-spacing:.27em;

  margin-bottom:12px;

}



.hero-content h1{

  margin:0;

  font:800 clamp(48px,8vw,92px)/.9 Space Grotesk,sans-serif;

  letter-spacing:-.055em;

  text-shadow:0 8px 35px rgba(0,0,0,.45);

}



.hero-content h1 span{

  color:#fff;

}



.hero-subtitle{

  margin:14px 0 0;

  color:#d0d1d4;

  font:600 clamp(14px,2vw,18px)/1.2 Space Grotesk,sans-serif;

  letter-spacing:.04em;

}



.hero-subtitle b{

  color:var(--gaming-red);

  padding:0 5px;

}



.hero-description{

  max-width:510px;

  margin:18px 0 0;

  color:#777b83;

  font-size:13px;

  line-height:1.65;

}



.hero-actions{

  display:flex;

  align-items:center;

  justify-content:center;

  gap:10px;

  margin-top:28px;

}



.gaming-btn{

  min-height:43px;

  padding:0 17px;

  border-radius:10px;

  display:flex;

  align-items:center;

  justify-content:center;

  gap:14px;

  font:700 10px/1 Space Grotesk,sans-serif;

  letter-spacing:.12em;

  transition:

    transform .25s ease,

    border-color .25s ease,

    background .25s ease,

    box-shadow .25s ease;

}



.gaming-btn:hover{

  transform:translateY(-2px);

}



.gaming-btn-primary{

  color:#fff;

  background:var(--gaming-red);

  border:1px solid var(--gaming-red);

  box-shadow:0 8px 28px rgba(255,36,36,.18);

}



.gaming-btn-primary:hover{

  background:#ff3030;

  box-shadow:0 12px 34px rgba(255,36,36,.28);

}



.gaming-btn-primary b{

  font-size:15px;

  font-weight:500;

}



.gaming-btn-secondary{

  color:#bfc1c6;

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

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

}



.gaming-btn-secondary:hover{

  color:#fff;

  border-color:rgba(255,36,36,.4);

}



.hero-meta{

  display:flex;

  align-items:center;

  gap:9px;

  margin-top:25px;

  color:#45484f;

  font:700 8px/1 Space Grotesk,sans-serif;

  letter-spacing:.16em;

}



.hero-meta i{

  width:3px;

  height:3px;

  border-radius:50%;

  background:#a23a3a;

}





/* SECTIONS */



.gaming-section{

  position:relative;

  z-index:1;

  width:min(1200px,calc(100% - 40px));

  margin:72px auto 0;

}



.gaming-section-head{

  display:flex;

  align-items:flex-end;

  justify-content:space-between;

  gap:20px;

  margin-bottom:17px;

}



.gaming-section-head>div{

  display:flex;

  align-items:baseline;

  gap:12px;

}



.section-index{

  color:var(--gaming-red);

  font:700 9px/1 Space Grotesk,sans-serif;

  letter-spacing:.12em;

}



.gaming-section-head h2{

  margin:0;

  color:#f4f4f5;

  font:800 25px/1 Space Grotesk,sans-serif;

  letter-spacing:-.035em;

}



.section-note{

  color:#555960;

  font:700 8px/1 Space Grotesk,sans-serif;

  letter-spacing:.16em;

}





/* CONTENT CARDS */



.content-grid{

  display:grid;

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

  gap:13px;

}



.content-card{

  position:relative;

  min-height:260px;

  padding:22px;

  overflow:hidden;

  border:1px solid var(--gaming-border);

  border-radius:18px;

  background:

    linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.008)),

    var(--gaming-panel);

  transition:

    border-color .3s ease,

    box-shadow .3s ease,

    background .3s ease;

}



.content-card:hover{

  border-color:rgba(255,36,36,.42);

  box-shadow:

    0 20px 50px rgba(0,0,0,.3),

    0 0 35px rgba(255,36,36,.055);

}



.content-number{

  position:absolute;

  top:17px;

  right:19px;

  color:#34373d;

  font:700 9px/1 Space Grotesk,sans-serif;

  letter-spacing:.1em;

}



.content-icon{

  width:43px;

  height:43px;

  display:grid;

  place-items:center;

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

  border-radius:12px;

  color:var(--gaming-red);

  background:rgba(255,36,36,.05);

  font-size:17px;

  transition:.3s ease;

}



.content-card:hover .content-icon{

  background:rgba(255,36,36,.1);

  box-shadow:0 0 25px rgba(255,36,36,.1);

}



.content-card-body{

  margin-top:66px;

}



.content-card-body>span{

  color:#5e626a;

  font:700 8px/1 Space Grotesk,sans-serif;

  letter-spacing:.17em;

}



.content-card h3{

  margin:8px 0 8px;

  font:800 22px/1 Space Grotesk,sans-serif;

  letter-spacing:-.025em;

}



.content-card p{

  margin:0;

  color:#696d75;

  font-size:11px;

  line-height:1.6;

}



.content-line{

  position:absolute;

  left:22px;

  bottom:20px;

  width:35px;

  height:1px;

  background:linear-gradient(90deg,var(--gaming-red),transparent);

  transition:width .3s ease;

}



.content-card:hover .content-line{

  width:65px;

}





/* HIGHLIGHTS */



.highlights-panel{

  border:1px solid var(--gaming-border);

  border-radius:20px;

  overflow:hidden;

  background:#090b0f;

}



.highlights-panel-top{

  min-height:47px;

  display:flex;

  align-items:center;

  justify-content:space-between;

  padding:0 18px;

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

  color:#555960;

  font:700 8px/1 Space Grotesk,sans-serif;

  letter-spacing:.14em;

}



.highlights-panel-top span:last-child{

  color:#873838;

}



.highlight-placeholder{

  min-height:310px;

  display:flex;

  align-items:center;

  justify-content:center;

  flex-direction:column;

  text-align:center;

  padding:45px 25px;

  background:

    radial-gradient(circle at 50% 48%,rgba(255,36,36,.045),transparent 32%),

    repeating-linear-gradient(

      135deg,

      rgba(255,255,255,.012) 0,

      rgba(255,255,255,.012) 1px,

      transparent 1px,

      transparent 10px

    );

}



.placeholder-icon{

  width:50px;

  height:50px;

  display:grid;

  place-items:center;

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

  border-radius:50%;

  color:var(--gaming-red);

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

  box-shadow:0 0 30px rgba(255,36,36,.06);

}



.placeholder-label{

  margin-top:19px;

  color:#555960;

  font:700 8px/1 Space Grotesk,sans-serif;

  letter-spacing:.18em;

}



.highlight-placeholder h3{

  margin:9px 0 0;

  font:800 25px/1 Space Grotesk,sans-serif;

}



.highlight-placeholder p{

  max-width:420px;

  margin:12px 0 0;

  color:#656971;

  font-size:11px;

  line-height:1.6;

}



.placeholder-code{

  display:flex;

  align-items:center;

  gap:9px;

  margin-top:18px;

  padding:7px 10px;

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

  border-radius:7px;

  color:#484b51;

  font:700 8px/1 Space Grotesk,sans-serif;

  letter-spacing:.1em;

}



.placeholder-code b{

  color:#b14343;

}



.highlight-slots{

  display:grid;

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

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

}



.highlight-slots>div{

  min-height:82px;

  padding:16px 18px;

  display:grid;

  grid-template-columns:auto 1fr;

  grid-template-rows:auto auto;

  column-gap:11px;

  border-right:1px solid rgba(255,255,255,.07);

}



.highlight-slots>div:last-child{

  border-right:0;

}



.highlight-slots span{

  grid-row:1/3;

  color:#3c3f45;

  font:700 10px/1 Space Grotesk,sans-serif;

}



.highlight-slots b{

  color:#7d8087;

  font:700 9px/1 Space Grotesk,sans-serif;

  letter-spacing:.1em;

}



.highlight-slots small{

  margin-top:5px;

  color:#44474d;

  font:600 7px/1 Space Grotesk,sans-serif;

  letter-spacing:.1em;

}





/* SOCIAL */



.social-grid{

  display:grid;

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

  gap:11px;

}



.social-card{

  position:relative;

  min-height:145px;

  padding:18px;

  border:1px solid var(--gaming-border);

  border-radius:15px;

  background:var(--gaming-panel);

  display:flex;

  flex-direction:column;

  transition:.25s ease;

}



.social-card:not(.social-disabled):hover{

  border-color:rgba(255,36,36,.4);

  transform:translateY(-3px);

}



.social-disabled{

  opacity:.72;

}



.social-index{

  position:absolute;

  top:15px;

  right:16px;

  color:#34373d;

  font:700 8px/1 Space Grotesk,sans-serif;

}



.social-icon{

  width:37px;

  height:37px;

  display:grid;

  place-items:center;

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

  border-radius:10px;

  color:#a3a5aa;

  font-size:15px;

}



.social-card>div:nth-of-type(2){

  margin-top:auto;

  display:flex;

  flex-direction:column;

}



.social-card small{

  color:#555960;

  font:700 7px/1 Space Grotesk,sans-serif;

  letter-spacing:.12em;

  margin-bottom:5px;

}



.social-card strong{

  font:700 14px/1 Space Grotesk,sans-serif;

}



.social-card em{

  position:absolute;

  left:18px;

  bottom:17px;

  color:#693434;

  font:700 7px/1 Space Grotesk,sans-serif;

  letter-spacing:.1em;

  font-style:normal;

}





/* FINAL CTA */



.gaming-final{

  position:relative;

  z-index:1;

  width:min(1200px,calc(100% - 40px));

  min-height:260px;

  margin:90px auto 0;

  padding:45px;

  display:flex;

  align-items:center;

  justify-content:space-between;

  gap:30px;

  overflow:hidden;

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

  border-radius:22px;

  background:

    radial-gradient(circle at 80% 50%,rgba(255,36,36,.06),transparent 35%),

    #090b0f;

}



.final-reactor{

  position:absolute;

  inset:12px;

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

  border-radius:17px;

  pointer-events:none;

}



.gaming-final>div:last-of-type{

  position:relative;

  z-index:2;

}



.gaming-final>div span{

  color:var(--gaming-red);

  font:700 8px/1 Space Grotesk,sans-serif;

  letter-spacing:.2em;

}



.gaming-final h2{

  margin:10px 0 5px;

  font:800 clamp(32px,5vw,53px)/.9 Space Grotesk,sans-serif;

  letter-spacing:-.045em;

}



.gaming-final h2 b{

  color:#fff;

}



.gaming-final p{

  margin:10px 0 0;

  color:#686c74;

  font-size:11px;

}



.gaming-final>.gaming-btn{

  position:relative;

  z-index:2;

}





/* FOOTER */



.gaming-footer{

  position:relative;

  z-index:1;

  width:min(1200px,calc(100% - 40px));

  margin:30px auto 0;

  padding:25px 0 32px;

  display:flex;

  justify-content:center;

  align-items:center;

  gap:11px;

  color:#44474d;

  font:700 8px/1 Space Grotesk,sans-serif;

  letter-spacing:.13em;

}



.gaming-footer strong{

  color:#70737a;

}



.gaming-footer strong span{

  color:#9a3737;

}



.gaming-footer i{

  width:3px;

  height:3px;

  border-radius:50%;

  background:#5e3030;

}



.gaming-footer a:hover{

  color:#fff;

}





/* RESPONSIVE */



@media(max-width:980px){



  .content-grid{

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

  }



  .social-grid{

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

  }



  .gaming-hero{

    min-height:640px;

  }



}



@media(max-width:720px){



  .gaming-nav{

    width:min(100% - 24px,560px);

  }



  .gaming-nav-links{

    display:none;

  }



  .gaming-back{

    padding:9px 11px;

  }



  .gaming-hero,

  .gaming-section,

  .gaming-final,

  .gaming-footer{

    width:calc(100% - 24px);

  }



  .gaming-hero{

    min-height:590px;

    margin-top:8px;

  }



  .hero-reactor{

    border-radius:24px;

  }



  .reactor-inner{

    inset:9%;

  }



  .hero-logo{

    width:125px;

    height:125px;

  }



  .hero-content{

    width:84%;

  }



  .hero-content h1{

    font-size:clamp(43px,12vw,68px);

  }



  .hero-description{

    font-size:12px;

  }



  .gaming-section{

    margin-top:55px;

  }



  .gaming-section-head{

    align-items:flex-start;

    flex-direction:column;

    gap:7px;

  }



  .section-note{

    padding-left:21px;

  }



  .content-grid{

    grid-template-columns:1fr 1fr;

  }



  .social-grid{

    grid-template-columns:1fr 1fr;

  }



  .gaming-final{

    margin-top:65px;

    padding:34px 25px;

    flex-direction:column;

    align-items:flex-start;

  }



}



@media(max-width:480px){



  .gaming-nav{

    padding:17px 0;

  }



  .gaming-brand{

    font-size:9px;

  }



  .gaming-back{

    font-size:8px;

  }



  .gaming-hero{

    min-height:570px;

  }



  .hero-reactor{

    border-radius:20px;

  }



  .reactor-corner{

    width:24px;

    height:24px;

  }



  .reactor-corner-tl,

  .reactor-corner-tr{

    top:20px;

  }



  .reactor-corner-bl,

  .reactor-corner-br{

    bottom:20px;

  }



  .reactor-corner-tl,

  .reactor-corner-bl{

    left:20px;

  }



  .reactor-corner-tr,

  .reactor-corner-br{

    right:20px;

  }



  .hero-logo{

    width:105px;

    height:105px;

  }



  .hero-kicker{

    font-size:8px;

  }



  .hero-subtitle{

    font-size:13px;

  }



  .hero-description{

    max-width:300px;

    font-size:11px;

  }



  .hero-actions{

    width:100%;

    flex-direction:column;

  }



  .gaming-btn{

    width:100%;

  }



  .hero-meta{

    gap:6px;

    font-size:6px;

  }



  .content-grid{

    grid-template-columns:1fr;

  }



  .content-card{

    min-height:215px;

  }



  .content-card-body{

    margin-top:46px;

  }



  .highlight-placeholder{

    min-height:280px;

  }



  .highlight-slots{

    grid-template-columns:1fr;

  }



  .highlight-slots>div{

    border-right:0;

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

  }



  .highlight-slots>div:last-child{

    border-bottom:0;

  }



  .social-grid{

    grid-template-columns:1fr 1fr;

  }



  .social-card{

    min-height:135px;

  }



  .gaming-final h2{

    font-size:38px;

  }



  .gaming-footer{

    flex-wrap:wrap;

    line-height:1.5;

  }



}



@media(prefers-reduced-motion:reduce){



  .hero-reactor-line{

    animation:none;

  }



  .gaming-btn,

  .content-card,

  .gaming-back{

    transition:none;

  }

}




/* KCU GAMING — HEADER MENU */

.gaming-nav-actions{

  display:flex;

  align-items:center;

  gap:18px;

}



.gaming-menu-toggle{

  appearance:none;

  border:0;

  background:transparent;

  color:inherit;

  padding:0;

  margin:0;

  display:flex;

  align-items:center;

  gap:9px;

  cursor:pointer;

  font:inherit;

}



.gaming-menu-icon{

  width:18px;

  height:16px;

  display:flex;

  flex-direction:column;

  justify-content:space-between;

}



.gaming-menu-icon i{

  display:block;

  width:18px;

  height:2px;

  background:currentColor;

  border-radius:2px;

}



.gaming-menu-toggle strong{

  font-size:11px;

  letter-spacing:.16em;

  font-weight:700;

}



.gaming-menu-toggle:hover{

  color:var(--gaming-red);

}



@media (max-width:700px){

  .gaming-nav-actions{

    gap:12px;

  }



  .gaming-menu-toggle strong{

    font-size:9px;

  }

}






/* KCU GAMING — HEADER HAMBURGER */

.gaming-menu-toggle{

  width:34px;

  height:34px;

  display:flex;

  flex-direction:column;

  align-items:center;

  justify-content:center;

  gap:4px;

  color:#fff;

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

  border-radius:50%;

  background:rgba(10,10,12,.72);

  cursor:pointer;

  transition:border-color .2s ease, color .2s ease, background .2s ease;

}



.gaming-menu-toggle span{

  display:block;

  width:14px;

  height:1.5px;

  background:currentColor;

  border-radius:2px;

}



.gaming-menu-toggle:hover{

  color:var(--gaming-red);

  border-color:rgba(255,36,36,.55);

  background:rgba(255,36,36,.06);

}






/* =========================================================

   KCU GAMING — NAVIGATION MENU

   ========================================================= */



.gaming-menu-overlay{

  position:fixed;

  inset:0;

  z-index:9999;

  display:none;

  align-items:flex-start;

  justify-content:flex-end;

  padding:24px;

  background:rgba(0,0,0,.72);

  backdrop-filter:blur(14px);

  -webkit-backdrop-filter:blur(14px);

}



.gaming-menu-overlay.is-open{

  display:flex !important;

  visibility:visible !important;

  opacity:1 !important;

  pointer-events:auto !important;

}



.gaming-menu-panel{

  width:min(460px,100%);

  max-height:calc(100vh - 48px);

  overflow-y:auto;

  padding:28px;

  background:

    linear-gradient(180deg,rgba(18,18,22,.98),rgba(8,8,10,.98));

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

  border-radius:20px;

  box-shadow:

    0 24px 80px rgba(0,0,0,.65),

    0 0 40px rgba(255,36,36,.06);

}



.gaming-menu-head{

  display:flex;

  align-items:flex-start;

  justify-content:space-between;

  gap:20px;

  padding-bottom:22px;

  margin-bottom:8px;

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

}



.gaming-menu-kicker{

  display:block;

  margin-bottom:7px;

  color:var(--gaming-red);

  font-size:9px;

  font-weight:700;

  letter-spacing:.18em;

}



.gaming-menu-head h2{

  margin:0;

  color:#fff;

  font-size:24px;

  line-height:1;

  letter-spacing:.08em;

}



.gaming-menu-close{

  width:36px;

  height:36px;

  flex:0 0 36px;

  display:flex;

  align-items:center;

  justify-content:center;

  padding:0;

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

  border-radius:50%;

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

  color:#fff;

  font-size:22px;

  line-height:1;

  cursor:pointer;

  transition:.2s ease;

}



.gaming-menu-close:hover{

  color:var(--gaming-red);

  border-color:rgba(255,36,36,.55);

  background:rgba(255,36,36,.06);

}



.gaming-menu-section{

  padding:20px 0;

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

}



.gaming-menu-section:last-child{

  border-bottom:0;

}



.gaming-menu-section-title{

  display:flex;

  align-items:center;

  gap:10px;

  margin-bottom:12px;

}



.gaming-menu-section-title span{

  color:var(--gaming-red);

  font-size:9px;

  font-weight:700;

  letter-spacing:.12em;

}



.gaming-menu-section-title strong{

  color:#fff;

  font-size:11px;

  font-weight:700;

  letter-spacing:.14em;

}



.gaming-menu-links{

  display:flex;

  flex-direction:column;

  gap:6px;

}



.gaming-menu-links a{

  display:grid;

  grid-template-columns:28px 1fr 20px;

  align-items:center;

  gap:10px;

  min-height:44px;

  padding:0 12px;

  color:#fff;

  text-decoration:none;

  border:1px solid transparent;

  border-radius:10px;

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

  transition:.2s ease;

}



.gaming-menu-links a:hover{

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

  background:rgba(255,36,36,.07);

  transform:translateX(3px);

}



.gaming-menu-links a span{

  color:rgba(255,255,255,.35);

  font-size:9px;

  font-weight:700;

  letter-spacing:.08em;

}



.gaming-menu-links a strong{

  color:#fff;

  font-size:11px;

  font-weight:600;

  letter-spacing:.05em;

}



.gaming-menu-links a b{

  color:var(--gaming-red);

  font-size:14px;

  text-align:right;

}



@media(max-width:720px){



  .gaming-menu-overlay{

    padding:12px;

    align-items:flex-end;

  }



  .gaming-menu-panel{

    width:100%;

    max-height:calc(100vh - 24px);

    padding:22px;

    border-radius:18px;

  }



}



@media(max-width:480px){



  .gaming-menu-head h2{

    font-size:20px;

  }



  .gaming-menu-panel{

    padding:18px;

  }



  .gaming-menu-section{

    padding:16px 0;

  }



}






/* =========================================================

   KCU GAMING — MOBILE MENU FIX

   ========================================================= */



@media(max-width:720px){

  .gaming-menu-overlay{

    align-items:flex-start;

    justify-content:center;

    padding:

      calc(12px + env(safe-area-inset-top))

      12px

      calc(12px + env(safe-area-inset-bottom));

  }



  .gaming-menu-panel{

    width:100%;

    max-height:

      calc(

        100dvh

        - 24px

        - env(safe-area-inset-top)

        - env(safe-area-inset-bottom)

      );

    overflow-y:auto;

    -webkit-overflow-scrolling:touch;

  }

}



