/* ========================================================== */
/* Brand variables (edit once; used everywhere)               */
/* ========================================================== */
:root{
  --card-grad-start:#12D0E4;   /* cyan */
  --card-grad-mid:#6F7BEF;     /* periwinkle */
  --card-grad-end:#A629FF;     /* violet */

  --btn-grad-start:#ff2bd6;    /* magenta */
  --btn-grad-end:#a629ff;      /* violet */

  --btn-shadow:0 10px 28px rgba(166,41,255,.45);
  --btn-shadow-hover:0 12px 32px rgba(166,41,255,.55);
}

/* ========================================================== */
/* Universal Styles (Linked on ALL pages)                     */
/* ========================================================== */
*{ margin:0; padding:0; box-sizing:border-box; }

html, body { height:100%; overflow-x:hidden; }

body{
  font-family:'Oxanium',sans-serif;
  color:#FCFCFD;
  padding-top:0;
  position:relative;
  background-color:#0A0A1A;
}

h1,h2,h3,h4{ font-family:'Syne',sans-serif; color:#FCFCFD; line-height:1.2; }

a{ text-decoration:none; color:#FCFCFD; transition:color .3s ease; }

/* ========================================================== */
/* Navigation and Dropdown Styles (Common to all pages)       */
/* ========================================================== */
.header nav{
  width:100%;
  padding:3px 75px;
  display:flex;
  justify-content:flex-start;
  align-items:center;
  position:absolute;
  z-index:1000;
  background:linear-gradient(to bottom, rgba(26,26,48,1) 0%, rgba(26,26,48,0) 100%);
  box-shadow:0 2px 10px rgba(0,0,0,.1);
}
.header nav .logo img{ width:90px; height:90px; display:block; object-fit:contain; }

.nav-links{
  margin-left:200px;
  flex:1;
  text-align:right;
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:25px;
}
.nav-links > ul{
  list-style:none;
  display:flex;
  align-items:center;
  gap:53px;
  margin:0;
  padding:0;
  flex:1;
  text-align:right;
  padding-right:25px;
}
.nav-links ul li{ position:relative; list-style:none; }
.nav-links ul li > a{
  color:#FCFCFD;
  font-size:16px;
  transition:color .3s ease;
  display:block;
  padding:10px 0;
}
.nav-links ul li > a:hover{ color:#00E5FF; }

.dropdown-menu{
  display:none;
  position:absolute;
  top:100%;
  left:50%;
  transform:translateX(-50%);
  min-width:200px;
  background-color:#1a1a36;
  border-radius:5px;
  box-shadow:0 5px 15px rgba(0,0,0,.3);
  padding:5px 20px;
  z-index:1001;
}
.nav-links ul li.has-dropdown:hover > .dropdown-menu{ display:block; }
.dropdown-menu li{ list-style:none; }
.dropdown-menu li a{
  font-weight:400;
  padding:20px 20px;
  display:block;
  font-size:16px;
  color:#19D2EA;
  transition:background-color .3s ease, color .3s ease;
}
.dropdown-menu li a:hover{ background-color:#0d0d21; color:#FCFCFD; }
.nav-links ul li.has-dropdown a{ position:relative; padding-right:15px; }
.nav-links ul li.has-dropdown > a::after{
  content:'\25BE';
  font-size:.7em;
  margin-left:5px;
  position:absolute;
  right:0;
  top:50%;
  transform:translateY(-50%);
  color:#FCFCFD;
}

/* ========================================================== */
/* Shop Now Button Styles                                     */
/* ========================================================== */
.shop-button{
  font-family:'Oxanium',sans-serif;
  font-size:16px;
  font-weight:700;
  color:#FCFCFD;
  background-color:#B425EC;
  padding:10px 25px;
  border-radius:5px;
  transition:background-color .3s ease;
}
.shop-button:hover{ background-color:#19D2EA; }

/* Desktop -> Mobile collapse */
@media (max-width:1024px){
  .header nav{ display:flex; align-items:center; gap:10px; }
  .mobile-nav-toggle{ display:inline-flex !important; align-items:center; justify-content:center; }
  .header nav .logo{ margin-left:auto; }
  .header nav .logo img{ width:72px; height:72px; }
  .nav-links{ display:none !important; }
}

/* ========================================================== */
/* News Section (Home)                                        */
/* Scoped so it does NOT affect /news/ page styles            */
/* ========================================================== */
.news-section{
  padding:80px 0;
  background-color:#0A0A1A;
  text-align:center;
}

.news-section .container{
  max-width:1200px;
  margin:0 auto;
  padding:0 75px;
}

.news-section .news-heading{ font-size:48px; margin-bottom:50px; }

.news-section .news-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
  gap:30px;
  justify-content:center;
}

.news-section .news-card-link{
  display:block;
  height:100%;
}

.news-section .news-card{
  background:transparent;
  padding:30px;
  border-radius:12px;
  text-align:left;
  transition:transform .3s ease, box-shadow .3s ease;
  display:flex;
  flex-direction:column;
  height:100%;
}

.news-section .news-card:hover{
  transform:translateY(-5px);
  box-shadow:0 8px 25px rgba(0,0,0,.3);
}

.news-section .news-image,
.news-section .news-image-placeholder{
  width:100%;
  aspect-ratio:1200 / 630;
  height:auto;
  object-fit:cover;
  border-radius:8px;
  display:block;
  margin-bottom:10px;
}

.news-section .news-image-placeholder{
  background:#333;
}

.news-section .news-card-title{ font-size:24px; margin-bottom:5px; }
.news-section .news-card-text{
  font-size:16px;
  line-height:1.6;
  color:rgba(252,252,253,.7);
  margin-bottom:10px;
}
.news-section .news-card-date{ font-size:14px; color:#00E5FF; }

.news-section .news-card-footer{
  margin-top:auto;
  padding-top:14px;
  display:flex;
  justify-content:flex-start;
}

.news-section .news-readmore{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  border-radius:10px;
  font-weight:700;
  border:1px solid rgba(255,255,255,0.18);
  background:rgba(0,0,0,0.25);
  color:#fff;
}

.news-section .news-card-link:hover .news-readmore{
  transform:translateY(-1px);
}

@media (max-width:992px){
  .news-section{ padding:60px 0; }
  .news-section .container{ padding:0 30px; }
  .news-section .news-heading{ font-size:38px; }
}
@media (max-width:768px){
  .news-section{ padding:40px 0; }
  .news-section .container{ padding:0 15px; }
  .news-section .news-heading{ font-size:32px; }
}

/* ========================================================== */
/* Footer (Common)                                            */
/* ========================================================== */
footer{ background-color:#0A0A1A; padding:0; color:#FCFCFD; position:relative; }
.footer-content{
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:40px;
  padding:80px 75px 40px;
  border-bottom:1px solid rgba(252,252,253,.1);
}
.footer-column{ flex-basis:200px; flex-grow:1; text-align:left; }
.footer-column h4{ font-size:24px; margin-bottom:25px; }
.footer-column ul{ list-style:none; padding:0; }
.footer-column ul li{ margin-bottom:10px; }
.footer-column ul li a{ color:rgba(252,252,253,.7); font-size:16px; transition:color .3s ease; }
.footer-column ul li a:hover{ color:#00E5FF; }
.footer-logo-column{ flex-basis:280px; text-align:right; flex-grow:1; }
.footer-logo-column img{ width:100px; height:auto; display:block; margin-left:auto; margin-bottom:15px; }
.footer-logo-column p{ font-size:16px; line-height:1.5; color:rgba(252,252,253,.7); margin-bottom:5px; }
.footer-bottom{ text-align:left; margin-top:0; padding:30px 75px; width:100%; box-sizing:border-box; }
.copyright-text{ font-size:14px; color:rgba(252,252,253,.6); }

/* ========================================================== */
/* Newsletter (Shared)                                        */
/* ========================================================== */
.newsletter-outer{
  background:#0A0A1A;
  padding:80px 75px;
  text-align:center;
}

.newsletter-pre-heading{
  font-size:18px;
  color:rgba(252,252,253,.8);
  margin-bottom:10px;
}

.newsletter-main-heading{
  font-size:48px;
  margin-bottom:50px;
}

.newsletter-card{
  background:
    radial-gradient(1200px 600px at 20% 20%, rgba(25,210,234,.18) 0%, rgba(10,10,26,0) 55%),
    radial-gradient(900px 500px at 90% 30%, rgba(166,41,255,.16) 0%, rgba(10,10,26,0) 60%),
    linear-gradient(135deg, #0D0D21 0%, #141436 55%, #1A123A 100%);
  padding:40px;
  border-radius:16px;
  border:1px solid rgba(252,252,253,.10);
  box-shadow:0 16px 40px rgba(0,0,0,.55);
  max-width:800px;
  margin:0 auto;
  color:#FCFCFD;
}

.newsletter-card h3{
  font-size:24px;
  font-weight:700;
  margin-bottom:30px;
}

.newsletter-form-container{
  display:flex;
  justify-content:center;
  gap:15px;
  margin-bottom:25px;
  flex-wrap:wrap;
}

.email-input{
  padding:15px 20px;
  width:60%;
  max-width:400px;
  border-radius:10px;
  border:1px solid rgba(252,252,253,.14);
  background:rgba(7,7,16,.55);
  color:#FCFCFD;
  font-size:16px;
  outline:none;
  backdrop-filter:blur(6px);
}

.email-input::placeholder{ color:rgba(252,252,253,.55); }

.email-input:focus{
  border-color:rgba(25,210,234,.55);
  box-shadow:0 0 0 3px rgba(25,210,234,.14);
}

.subscribe-button{
  padding:15px 30px;
  border:none;
  border-radius:10px;
  font-size:16px;
  font-weight:700;
  cursor:pointer;
  color:#fff;
  background:linear-gradient(90deg, rgba(255,43,214,.85) 0%, rgba(166,41,255,.85) 100%);
  box-shadow:0 10px 26px rgba(166,41,255,.35);
  transition:transform .15s ease, box-shadow .15s ease, filter .15s ease;
}

.subscribe-button:hover{
  transform:translateY(-1px);
  box-shadow:0 12px 30px rgba(166,41,255,.45);
  filter:brightness(1.03);
}

.newsletter-card-disclaimer{
  font-size:14px;
  color:rgba(252,252,253,.70);
  line-height:1.5;
  max-width:600px;
  margin:20px auto 0;
}

@media (max-width:768px){
  .newsletter-outer{ padding:40px 20px; }
  .newsletter-main-heading{ font-size:32px; margin-bottom:24px; }
  .newsletter-card{ padding:24px; }
  .newsletter-form-container{ flex-direction:column; align-items:stretch; gap:10px; }
  .email-input{ width:100%; max-width:none; }
  .subscribe-button{ width:100%; }
  .newsletter-card-disclaimer{ font-size:13px; margin-top:14px; }
}

@media (max-width:480px){
  .newsletter-main-heading{ font-size:28px; }
  .newsletter-card h3{ font-size:20px; }
}

/* ========================================================== */
/* Partners (Shared)                                          */
/* ========================================================== */
.partners-section{ background:#0A0A1A; padding:80px 0 0; text-align:center; }
.partners-section h2{ font-size:56px; margin-bottom:30px; padding:0 75px; }
.partners-rail{ overflow:hidden; position:relative; }
.partners-inner{ display:flex; width:max-content; will-change:transform; }
.partners-track{ display:flex; align-items:center; gap:clamp(14px,2vw,24px); padding-inline:0; }
.partner-logo{
  flex:0 0 auto;
  width:200px; height:120px;
  object-fit:contain;
  background:#0d0d21;
  border:1px solid #000;
  border-radius:6px;
  padding:8px;
}
@media (max-width:992px){ .partners-section h2{ font-size:44px; } .partner-logo{ width:180px; height:108px; } }
@media (max-width:768px){ .partners-section h2{ font-size:38px; } .partner-logo{ width:160px; height:96px; padding:6px; } }
@media (max-width:480px){ .partners-section h2{ font-size:32px; } .partner-logo{ width:140px; height:88px; } }

/* ========================================================== */
/* Home Page Hero                                             */
/* ========================================================== */
.home-hero-section{
  min-height:962px;
  width:100%;
  background-image:linear-gradient(rgba(4,9,30,.7), rgba(4,9,30,.7)), url(../images/TunzaEsportsBackground.png);
  background-size:cover;
  background-position:center;
  position:relative;
}
.home-hero-section .hero-content{ position:absolute; left:438px; top:426px; max-width:700px; }
.home-hero-section .hero-content h1{ font-weight:bold; font-size:64px; line-height:1.2; }

/* ========================================================== */
/* About Us Page                                              */
/* ========================================================== */
.about-hero-section{
  min-height:450px;
  width:100%;
  background-image:linear-gradient(rgba(4,9,30,.7), rgba(4,9,30,.7)), url(../images/About%20Us.jpg);
  background-size:cover;
  background-position:center;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  padding:0 75px;
  position:relative;
}
.about-hero-section .breadcrumb{ font-size:16px; color:rgba(252,252,253,.7); margin-bottom:20px; position:absolute; top:150px; }
.about-hero-section .breadcrumb a{ color:rgba(252,252,253,.7); }
.about-hero-section .breadcrumb a:hover{ color:#00E5FF; }
.about-hero-section .about-main-heading{ font-weight:bold; font-size:64px; margin-bottom:25px; z-index:1; }
.about-hero-section .about-tagline{ font-size:20px; color:rgba(252,252,253,.8); max-width:800px; margin:0 auto; line-height:1.5; z-index:1; }

.about-intro-section{ padding:80px 75px 40px; text-align:center; }
.about-intro-section .intro-heading{ font-size:40px; margin-bottom:20px; }
.about-intro-section .intro-text{ font-size:16px; color:rgba(252,252,253,.7); max-width:700px; margin:0 auto 50px; line-height:1.5; }
.about-intro-section .intro-boxes-container{ display:flex; justify-content:center; gap:40px; flex-wrap:wrap; }
.about-intro-section .intro-box{ background:transparent; width:390px; min-height:540px; display:flex; flex-direction:column; align-items:center; }
.about-intro-section .box-image-placeholder{ width:350px; height:480px; background:#333; border-radius:8px; }

/* List section */
.list-section{ padding:40px 75px 80px; }
.list-section .list-container{ display:flex; justify-content:flex-start; flex-wrap:wrap; gap:40px; padding-left:120px; }
.list-section .list-column{ list-style:none; flex-basis:45%; max-width:500px; padding-left:0; }
.list-section .list-column:last-child{ margin-left:170px; }
.list-section .list-column li{
  position:relative;
  padding-left:30px;
  margin-bottom:5px;
  font-size:20px;
  line-height:1.4;
  color:rgba(252,252,253,.7);
}
.list-section .list-column li::before{
  content:'\25B8';
  position:absolute;
  left:0;
  top:5px;
  font-size:16px;
  color:#00E5FF;
}
@media (max-width:768px){
  .list-section .list-column{ flex-basis:100%; max-width:none; }
  .list-section .list-container{ padding-left:20px; }
  .list-section .list-column:last-child{ margin-left:0; }
}

/* Directors */
.directors-section{ padding:50px 65px; text-align:center; }
.directors-section .directors-heading{ font-size:48px; margin-bottom:20px; }
.directors-section .directors-subheading{ font-size:16px; color:rgba(252,252,253,.7); line-height:1.5; margin-bottom:40px; }
.directors-section .director-cards-container{ display:flex; justify-content:center; gap:5px; flex-wrap:wrap; }
.directors-section .director-card{ background:transparent; padding:20px; border-radius:12px; text-align:center; width:224px; display:flex; flex-direction:column; align-items:center; }
.directors-section .director-image-wrapper{ position:relative; width:224px; height:458px; border-radius:8px; overflow:hidden; margin-bottom:15px; }
.directors-section .director-image-wrapper::after{ content:""; position:absolute; inset:0; background:linear-gradient(to bottom, rgba(51,51,51,.1), #333); pointer-events:none; }
.directors-section .director-image{ width:100%; height:100%; object-fit:cover; object-position:top; }
.directors-section .director-name{ font-size:20px; font-weight:bold; color:#9B8AFB; margin-bottom:5px; }
.directors-section .director-title{ font-size:14px; color:rgba(252,252,253,.6); }
@media (max-width:768px){
  .directors-section{ padding:60px 30px; }
  .directors-section .director-cards-container{ justify-content:space-around; gap:15px; }
  .directors-section .director-card{ width:180px; }
}

/* ========================================================== */
/* Mobile overlay menu                                        */
/* ========================================================== */
.mobile-nav-toggle{
  display:none;
  background:transparent;
  border:0;
  color:#FCFCFD;
  font-size:28px;
  line-height:1;
  padding:8px;
  cursor:pointer;
}

.mobile-menu-overlay{
  position:fixed;
  inset:0;
  background:rgba(7,7,16,.96);
  color:#FCFCFD;
  z-index:3000;
  display:flex;
  flex-direction:column;
  transform:translateX(100%);
  transition:transform .3s ease;
  touch-action:manipulation;
}
.mobile-menu-overlay.open{ transform:translateX(0); }

.mobile-menu-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:18px 20px;
  border-bottom:1px solid rgba(252,252,253,.08);
  font-family:'Syne',sans-serif;
}
.mobile-close{ background:transparent; border:0; color:#FCFCFD; font-size:30px; cursor:pointer; padding:8px; }
.mobile-menu-body{ padding:24px 20px 40px; overflow-y:auto; -webkit-overflow-scrolling:touch; flex:1; }
.mobile-menu-screen[hidden]{ display:none !important; }
.mobile-menu-title{ font-family:'Syne',sans-serif; font-size:36px; margin:8px 0 18px; }

.mobile-menu-list{ list-style:none; padding:0; margin:0; }
.mobile-menu-list li{ border-bottom:1px solid rgba(252,252,253,.08); }
.mobile-link{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 4px;
  color:#FCFCFD;
  font-size:22px;
  line-height:1.3;
}
.mobile-link .fa-chevron-right{ opacity:.85; }
.mobile-back{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  margin:0 0 16px;
  background:#111224;
  border:1px solid #000;
  border-radius:10px;
  color:#FCFCFD;
  cursor:pointer;
  font-family:'Oxanium',sans-serif;
}
.mobile-menu-footer{ padding:12px 20px 20px; border-top:1px solid rgba(252,252,253,.08); }
.mobile-kicker{ font-size:12px; opacity:.7; }

/* ========================================================== */
/* Our Tournaments Page Hero                                  */
/* ========================================================== */
.tournaments-hero-section{
  min-height:450px;
  width:100%;
  background-image:
    linear-gradient(rgba(4,9,30,.55), rgba(4,9,30,.92)),
    url(../images/our-tournament.jpg);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;

  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;

  padding:0 75px;
  position:relative;
}

.tournaments-hero-section .breadcrumb{
  font-size:16px;
  color:rgba(252,252,253,.7);
  margin-bottom:20px;
  position:absolute;
  top:150px;
}

.tournaments-hero-section .breadcrumb a{ color:rgba(252,252,253,.7); }
.tournaments-hero-section .breadcrumb a:hover{ color:#00E5FF; }

.tournaments-hero-section .tournaments-main-heading{
  font-weight:bold;
  font-size:64px;
  margin-bottom:25px;
  z-index:1;
  text-shadow:0 6px 24px rgba(0,0,0,.55);
}

.tournaments-hero-section .tournaments-tagline{
  font-size:20px;
  color:rgba(252,252,253,.8);
  max-width:800px;
  margin:0 auto;
  line-height:1.5;
  z-index:1;
  text-shadow:0 6px 24px rgba(0,0,0,.55);
}

@media (max-width:768px){
  .tournaments-hero-section{ min-height:350px; padding:0 15px; }
  .tournaments-hero-section .breadcrumb{ top:120px; }
  .tournaments-hero-section .tournaments-main-heading{ font-size:36px; }
  .tournaments-hero-section .tournaments-tagline{ font-size:16px; }
}

/* ✅ FIXED: properly closed 480px media query (your file was breaking here) */
@media (max-width:480px){
  .tournaments-hero-section{ min-height:300px; }
  .tournaments-hero-section .breadcrumb{ font-size:14px; top:100px; }
  .tournaments-hero-section .tournaments-main-heading{ font-size:28px; }
}

/* ✅ FIXED: this rule must be OUTSIDE the media query */
.tournaments-v1 .tcard-media{
  max-width:520px;
  margin:14px auto 0;
}

/* ========================================================== */
/* Our Services - Tournament Organization                     */
/* ========================================================== */
.service-hero-section{
  min-height:450px; width:100%;
  background-image:linear-gradient(rgba(4,9,30,.7), rgba(4,9,30,.7)), url(../images/Esports\ Tournament\ Main.jpg);
  background-size:cover; background-position:center;
  display:flex; flex-direction:column; justify-content:center; align-items:center;
  text-align:center; padding:0 75px; position:relative;
}
.service-hero-section .breadcrumb{ font-size:16px; color:rgba(252,252,253,.7); margin-bottom:20px; position:absolute; top:150px; }
.service-hero-section .breadcrumb a{ color:rgba(252,252,253,.7); }
.service-hero-section .breadcrumb a:hover{ color:#00E5FF; }
.service-hero-section .service-main-heading{ font-weight:bold; font-size:64px; margin-bottom:25px; z-index:1; }
@media (max-width:768px){
  .service-hero-section{ min-height:350px; padding:0 15px; }
  .service-hero-section .breadcrumb{ top:120px; }
  .service-hero-section .service-main-heading{ font-size:36px; }
}
@media (max-width:480px){
  .service-hero-section{ min-height:300px; }
  .service-hero-section .breadcrumb{ font-size:14px; top:100px; }
  .service-hero-section .service-main-heading{ font-size:28px; }
}

/* Tournament body */
.tournament-intro-section{ padding:80px 75px 40px; text-align:center; }
.tournament-intro-heading{ font-size:48px; margin-bottom:20px; }
.tournament-intro-text{ font-size:16px; color:rgba(252,252,253,.7); max-width:800px; margin:0 auto; line-height:1.5; }
.tournament-content-section{ padding:40px 75px 80px; }
.tournament-content-container{ display:flex; justify-content:space-between; gap:40px; }
.tournament-list-column{ flex-basis:50%; display:flex; flex-direction:column; align-items:center; }
.list-group{ margin-bottom:40px; width:80%; text-align:left; }
.list-group .list-heading{ font-size:24px; margin-bottom:15px; }
.list-group ul{ list-style:none; padding:0; }
.list-group li{ position:relative; padding-left:25px; margin-bottom:15px; font-size:17px; line-height:1.5; color:rgba(252,252,253,.7); }
.list-group li::before{ content:'\25B8'; position:absolute; left:0; top:5px; font-size:12px; color:#00E5FF; }
.tournament-image-column{ flex-basis:50%; display:flex; flex-direction:column; gap:20px; }
.image-placeholder{ background:#1a1a36; border-radius:12px; }
.main-tournament-image{ width:100%; height:380px; object-fit:cover; border-radius:12px; }
.image-placeholder.small{ flex-grow:1; height:250px; }
.small-image-container{ display:flex; gap:20px; }
.small-tournament-image{ flex-grow:1; height:250px; object-fit:cover; border-radius:12px; }
@media (max-width:992px){
  .tournament-intro-section, .tournament-content-section{ padding:60px 30px; }
  .tournament-intro-heading{ font-size:38px; }
  .tournament-content-container{ flex-direction:column; gap:30px; }
  .tournament-list-column, .tournament-image-column{ flex-basis:100%; }
}
@media (max-width:768px){
  .tournament-intro-section, .tournament-content-section{ padding:40px 15px; }
  .tournament-intro-heading{ font-size:32px; }
  .small-image-container{ flex-direction:column; gap:15px; }
  .image-placeholder.large{ height:250px; }
}

/* ========================================================== */
/* Esports Broadcasting Hero                                  */
/* ========================================================== */
.esports-broadcasting-hero-section{
  min-height:450px; width:100%;
  background-image:linear-gradient(rgba(4,9,30,.7), rgba(4,9,30,.7)), url(../images/Production\ Setup.jpg);
  background-size:cover; background-position:center;
  display:flex; flex-direction:column; justify-content:center; align-items:center;
  text-align:center; padding:0 75px; position:relative;
}
.esports-broadcasting-hero-section .breadcrumb{ font-size:16px; color:rgba(252,252,253,.7); margin-bottom:20px; position:absolute; top:150px; }
.esports-broadcasting-hero-section .breadcrumb a{ color:rgba(252,252,253,.7); }
.esports-broadcasting-hero-section .breadcrumb a:hover{ color:#00E5FF; }
.esports-broadcasting-hero-section .service-main-heading{ font-weight:bold; font-size:64px; margin-bottom:25px; z-index:1; }
@media (max-width:768px){
  .esports-broadcasting-hero-section{ min-height:350px; padding:0 15px; }
  .esports-broadcasting-hero-section .breadcrumb{ top:120px; }
  .esports-broadcasting-hero-section .service-main-heading{ font-size:36px; }
}
@media (max-width:480px){
  .esports-broadcasting-hero-section{ min-height:300px; }
  .esports-broadcasting-hero-section .breadcrumb{ font-size:14px; top:100px; }
  .esports-broadcasting-hero-section .service-main-heading{ font-size:28px; }
}

/* Additional Spacing for Main Body Content */
.service-body{ margin-top:30px; }

/* ========================================================== */
/* Events & Bootcamps Hero                                    */
/* ========================================================== */
.events-bootcamps-hero-section{
  min-height:450px; width:100%;
  background-image:linear-gradient(rgba(4,9,30,.7), rgba(4,9,30,.7)), url(../images/events-bootcamps-hero.jpg);
  background-size:cover; background-position:center;
  display:flex; flex-direction:column; justify-content:center; align-items:center;
  text-align:center; padding:0 75px; position:relative;
}
.events-bootcamps-hero-section .breadcrumb{ font-size:16px; color:rgba(252,252,253,.7); margin-bottom:20px; position:absolute; top:150px; }
.events-bootcamps-hero-section .breadcrumb a{ color:rgba(252,252,253,.7); }
.events-bootcamps-hero-section .breadcrumb a:hover{ color:#00E5FF; }
.events-bootcamps-hero-section .service-main-heading{ font-weight:bold; font-size:64px; margin-bottom:25px; z-index:1; }
@media (max-width:768px){
  .events-bootcamps-hero-section{ min-height:350px; padding:0 15px; }
  .events-bootcamps-hero-section .breadcrumb{ top:120px; }
  .events-bootcamps-hero-section .service-main-heading{ font-size:36px; }
}
@media (max-width:480px){
  .events-bootcamps-hero-section{ min-height:300px; }
  .events-bootcamps-hero-section .breadcrumb{ font-size:14px; top:100px; }
  .events-bootcamps-hero-section .service-main-heading{ font-size:28px; }
}

/* ========================================================== */
/* Video Gaming Events Hero                                   */
/* ========================================================== */
.video-gaming-events-hero-section{
  min-height:450px; width:100%;
  background-image:linear-gradient(rgba(4,9,30,.7), rgba(4,9,30,.7)), url(../images/Gaming\ Events.jpg);
  background-size:cover; background-position:center;
  display:flex; flex-direction:column; justify-content:center; align-items:center;
  text-align:center; padding:0 75px; position:relative;
}
.video-gaming-events-hero-section .breadcrumb{ font-size:16px; color:rgba(252,252,253,.7); margin-bottom:20px; position:absolute; top:150px; }
.video-gaming-events-hero-section .breadcrumb a{ color:rgba(252,252,253,.7); }
.video-gaming-events-hero-section .breadcrumb a:hover{ color:#00E5FF; }
.video-gaming-events-hero-section .service-main-heading{ font-weight:bold; font-size:64px; margin-bottom:25px; z-index:1; }
@media (max-width:768px){
  .video-gaming-events-hero-section{ min-height:350px; padding:0 15px; }
  .video-gaming-events-hero-section .breadcrumb{ top:120px; }
  .video-gaming-events-hero-section .service-main-heading{ font-size:36px; }
}
@media (max-width:480px){
  .video-gaming-events-hero-section{ min-height:300px; }
  .video-gaming-events-hero-section .breadcrumb{ font-size:14px; top:100px; }
  .video-gaming-events-hero-section .service-main-heading{ font-size:28px; }
}

/* ========================================================== */
/* Upcoming Events Grid                                       */
/* ========================================================== */
.upcoming-events-grid-section{ padding:50px 75px; text-align:center; }
.upcoming-events-grid-section .section-heading{ font-size:3rem; margin-bottom:30px; }
.upcoming-events-grid-section .events-grid-container{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
  gap:30px;
  align-items:stretch;
  padding:20px 0;
}
.upcoming-events-grid-section .event-card{
  background:#1a1a36;
  border-radius:12px;
  box-shadow:0 4px 8px rgba(0,0,0,.2);
  border:1px solid #3f3f6c;
  text-align:left;
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
.upcoming-events-grid-section .event-image-wrapper{ width:100%; height:150px; overflow:hidden; }
.upcoming-events-grid-section .event-image{ width:100%; height:100%; object-fit:cover; }
.upcoming-events-grid-section .event-card-content{ padding:20px; flex-grow:1; display:flex; flex-direction:column; }
.upcoming-events-grid-section .event-card-content h3{ font-size:1.25rem; font-weight:bold; color:#00E5FF; margin-bottom:5px; }
.upcoming-events-grid-section .event-card-content .event-date,
.upcoming-events-grid-section .event-card-content .event-location{ font-size:.875rem; color:#FCFCFD; opacity:.7; margin-bottom:15px; }
.upcoming-events-grid-section .event-card-content .event-price{ font-size:1.1rem; font-weight:bold; color:#FCFCFD; margin-top:auto; }
@media (max-width:768px){ .upcoming-events-grid-section{ padding:50px 15px; } }

/* ========================================================== */
/* Consultation Page (incl. CTA)                              */
/* ========================================================== */
.consultation-hero-section{
  min-height:450px; width:100%;
  background-image:linear-gradient(rgba(4,9,30,.7), rgba(4,9,30,.7)), url(../images/Consultation.jpg);
  background-size:cover; background-position:center;
  display:flex; flex-direction:column; justify-content:center; align-items:center;
  text-align:center; padding:0 75px; position:relative;
}
.consultation-hero-section .breadcrumb{ font-size:16px; color:rgba(252,252,253,.7); margin-bottom:20px; position:absolute; top:150px; }
.consultation-hero-section .breadcrumb a{ color:rgba(252,252,253,.7); }
.consultation-hero-section .breadcrumb a:hover{ color:#00E5FF; }
.consultation-hero-section .service-main-heading{ font-weight:bold; font-size:64px; margin-bottom:25px; z-index:1; }
@media (max-width:768px){
  .consultation-hero-section{ min-height:350px; padding:0 15px; }
  .consultation-hero-section .breadcrumb{ top:120px; }
  .consultation-hero-section .service-main-heading{ font-size:36px; }
}
@media (max-width:480px){
  .consultation-hero-section{ min-height:300px; }
  .consultation-hero-section .breadcrumb{ font-size:14px; top:100px; }
  .consultation-hero-section .service-main-heading{ font-size:28px; }
}

.consultation-intro-section{ padding:50px 75px; text-align:center; }
.consultation-intro-section .consultation-intro-heading{ font-size:2.5rem; margin-bottom:15px; }
.consultation-intro-section .consultation-intro-text{ font-size:1.1rem; color:rgba(252,252,253,.8); max-width:800px; margin:0 auto; }

.consultation-cta-section{ padding:50px 75px; text-align:center; }
.consultation-cta-section .cta-card{ border:0; max-width:860px; margin:0 auto; padding:28px 24px; border-radius:14px; }
.consultation-cta-section .cta-card h2{ font-size:2rem; margin-bottom:12px; }
.consultation-cta-section .cta-card p{ font-size:1.05rem; color:#f3f3f7; margin-bottom:16px; }

.cta-button{
  display:inline-block;
  padding:12px 20px;
  border-radius:10px;
  background:linear-gradient(90deg, var(--btn-grad-start) 0%, var(--btn-grad-end) 100%);
  color:#fff;
  font-weight:700;
  font-size:16px;
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
  box-shadow:var(--btn-shadow);
}
.cta-button:hover{ transform:translateY(-1px); box-shadow:var(--btn-shadow-hover); filter:brightness(1.04); }
.cta-button:focus-visible{ outline:2px solid #FCFCFD; outline-offset:2px; }

/* ========================================================== */
/* Coming Soon Hero                                           */
/* ========================================================== */
.coming-soon-hero-section{
  min-height:calc(100vh - 120px);
  width:100%;
  background:#0a0a1a;
  display:flex;
  justify-content:center;
  align-items:center;
  text-align:center;
}
.coming-soon-hero-section h1{
  font-family:'Syne',sans-serif;
  font-size:5rem;
  font-weight:bold;
  text-transform:uppercase;
}
@media (max-width:768px){ .coming-soon-hero-section h1{ font-size:3rem; } }
@media (max-width:480px){ .coming-soon-hero-section h1{ font-size:2rem; } }

/* ========================================================== */
/* KUER Page                                                  */
/* ========================================================== */
.kuer-hero-section{
  min-height:550px; width:100%;
  background-image:linear-gradient(rgba(4,9,30,.7), rgba(4,9,30,.7)), url(../images/KUER.jpg);
  background-size:cover; background-position:center;
  display:flex; flex-direction:column; justify-content:center; align-items:center;
  text-align:center; padding:0 75px; position:relative;
}
.kuer-hero-section .breadcrumb{ font-size:16px; color:rgba(252,252,253,.7); margin-bottom:20px; position:absolute; top:150px; }
.kuer-hero-section .breadcrumb a{ color:rgba(252,252,253,.7); }
.kuer-hero-section .breadcrumb a:hover{ color:#00E5FF; }
.kuer-hero-section .service-main-heading{ font-weight:bold; font-size:64px; margin-bottom:25px; z-index:1; }
@media (max-width:768px){
  .kuer-hero-section{ min-height:450px; padding:0 15px; }
  .kuer-hero-section .breadcrumb{ top:120px; }
  .kuer-hero-section .service-main-heading{ font-size:36px; }
}
@media (max-width:480px){
  .kuer-hero-section{ min-height:400px; }
  .kuer-hero-section .breadcrumb{ font-size:14px; top:100px; }
  .kuer-hero-section .service-main-heading{ font-size:28px; }
}

.service-main-text-container{ padding:50px 75px; text-align:center; }
.service-main-text-container .service-body-heading{ font-weight:bold; font-size:48px; margin-bottom:15px; }
.service-main-text-container .service-body-text{ font-size:18px; color:rgba(252,252,253,.7); max-width:800px; margin:0 auto; }

.kuer-content-columns{ display:flex; justify-content:space-between; gap:75px; padding:0 75px 50px; }
.kuer-column-left{ flex:1; display:flex; flex-direction:column; gap:30px; }
.kuer-column-right{ flex:1; display:flex; flex-wrap:wrap; gap:20px; }
.kuer-faq-section h3{ font-size:24px; margin-bottom:15px; }
.placeholder-card{ width:calc(50% - 10px); height:150px; background:#3f3f6c; border-radius:8px; }
@media (max-width:1024px){
  .kuer-content-columns{ flex-direction:column; gap:40px; }
  .kuer-column-right{ justify-content:center; }
}
@media (max-width:768px){
  .service-main-text-container{ padding:50px 25px; }
  .service-main-text-container .service-body-heading{ font-size:36px; }
  .kuer-content-columns{ padding:0 25px 50px; }
}
@media (max-width:480px){
  .service-main-text-container .service-body-heading{ font-size:28px; }
  .kuer-column-right .placeholder-card{ width:100%; }
}

.cta-card-container{ padding:50px 75px; display:flex; justify-content:center; align-items:center; text-align:center; }
.cta-card{ background:#1a1a36; border:1px solid #3f3f6c; border-radius:12px; padding:40px; max-width:700px; }
.cta-card h3{ font-size:36px; font-weight:bold; margin-bottom:15px; }
.cta-card p{ font-size:18px; color:rgba(252,252,253,.8); margin-bottom:25px; }
@media (max-width:768px){ .cta-card h3{ font-size:28px; } .cta-card p{ font-size:16px; } }
@media (max-width:480px){ .cta-card-container{ padding:50px 25px; } .cta-card{ padding:30px 20px; } }

/* ========================================================== */
/* Products Coming Soon                                       */
/* ========================================================== */
.products-coming-soon-hero-section{ min-height:calc(100vh - 120px); width:100%; background:#111129; display:flex; justify-content:center; align-items:center; text-align:center; }
.products-coming-soon-hero-section .coming-soon-main-heading{ font-size:5rem; font-weight:bold; text-transform:uppercase; }
@media (max-width:768px){ .products-coming-soon-hero-section .coming-soon-main-heading{ font-size:3rem; } }
@media (max-width:480px){ .products-coming-soon-hero-section .coming-soon-main-heading{ font-size:2rem; } }

/* ========================================================== */
/* News Page                                                  */
/* ========================================================== */
.news-hero-section{
  min-height:550px;
  width:100%;
  background-image:linear-gradient(rgba(4,9,30,.7), rgba(4,9,30,.7)), url(../images/News.jpg);
  background-size:cover;
  background-position:center;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  padding:0 75px;
  position:relative;
}
.news-hero-section .breadcrumb{
  font-size:16px;
  color:rgba(252,252,253,.7);
  margin-bottom:20px;
  position:absolute;
  top:150px;
}
.news-hero-section .breadcrumb a{ color:rgba(252,252,253,.7); }
.news-hero-section .breadcrumb a:hover{ color:#00E5FF; }
.news-hero-section .service-main-heading{
  font-size:64px;
  text-shadow:0 6px 24px rgba(0,0,0,.55);
}

/* ✅ FIXED: 2-column layout so the page does not look stacked */
.news-body{ padding:0; }
.news-content-wrapper{
  max-width:1200px;
  margin:50px auto;
  padding:0 75px;
  display:grid;
  grid-template-columns:320px 1fr;
  gap:40px;
  align-items:start;
}
.articles-container{ min-width:0; }

.news-sidebar{ padding-top:20px; color:#fcfcfd; }
.search-section{ margin-bottom:30px; text-align:center; }
.keyword-search{
  width:100%;
  padding:10px;
  border:1px solid #333;
  background:#1a1a2e;
  color:#fcfcfd;
  border-radius:8px;
  margin-top:10px;
}
.search-button{
  width:100%;
  padding:10px;
  background:#B425EC;
  color:#FCFCFD;
  border:none;
  border-radius:8px;
  margin-top:10px;
  cursor:pointer;
  font-weight:bold;
  transition:background-color .3s ease;
}
.search-button:hover{ background:#19D2EA; }

.filter-section{ margin-top:30px; margin-bottom:40px; text-align:center; }
.tag-list{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:10px; }
.tag{ background:#B425EC; padding:8px 15px; border-radius:20px; cursor:pointer; transition:background-color .3s ease; }
.tag:hover, .tag.active{ background:#19D2EA; }

/* ✅ FIXED: cleaner grid, prevents cards from stretching weird */
.news-content-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:30px;
}
.news-card{
  background:#1a1a2e;
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 4px 8px rgba(0,0,0,.2);
  transition:transform .3s ease;
}
.news-card:hover{ transform:translateY(-10px); }
.news-image{
  width:100%;
  height:220px;
  object-fit:cover;
  display:block;
}
.news-content{ padding:20px; color:#fcfcfd; }
.news-title{ font-size:24px; font-weight:bold; margin-bottom:10px; }
.news-date{ font-size:14px; color:rgba(252,252,253,.6); margin-bottom:15px; }
.read-more-button{
  display:inline-block;
  padding:8px 15px;
  background:#B425EC;
  color:#FCFCFD;
  border-radius:8px;
  margin-top:15px;
  transition:background-color .3s ease;
}
.read-more-button:hover{ background:#19D2EA; }
.load-more-container{ text-align:center; margin-top:40px; }
.load-more-button{
  padding:12px 30px;
  background:#B425EC;
  color:#FCFCFD;
  border:none;
  border-radius:8px;
  cursor:pointer;
  font-weight:bold;
  transition:background-color .3s ease;
}
.load-more-button:hover{ background:#19D2EA; }

/* responsive */
@media (max-width:992px){
  .news-content-wrapper{ grid-template-columns:1fr; padding:0 30px; }
  .news-content-grid{ grid-template-columns:1fr; }
}
@media (max-width:768px){
  .news-hero-section{ min-height:420px; padding:0 15px; }
  .news-hero-section .breadcrumb{ top:120px; }
  .news-hero-section .service-main-heading{ font-size:48px; }
  .news-content-wrapper{ padding:0 15px; }
}
@media (max-width:480px){
  .news-hero-section{ min-height:360px; }
  .news-hero-section .breadcrumb{ font-size:14px; top:100px; }
  .news-hero-section .service-main-heading{ font-size:34px; }
}

/* ========================================================== */
/* Contact Page                                               */
/* ========================================================== */
.contact-section-wrapper{
  max-width:900px;
  margin:50px auto;
  padding:100px;
  background:transparent;
  color:#fcfcfd;
  text-align:center;
  border-radius:12px;
}
.contact-header{ margin-bottom:40px; }
.contact-header h1{ font-size:48px; margin-bottom:10px; }
.contact-header p{ font-size:18px; color:rgba(252,252,253,.8); }
.contact-form{ display:flex; flex-direction:column; gap:20px; }
.form-row{ display:flex; justify-content:space-between; gap:20px; }
.form-group{ flex:1; display:flex; flex-direction:column; text-align:left; }
.form-group.full-width{ flex:100%; }
.form-group label{ font-size:16px; margin-bottom:8px; }
.form-group input, .form-group textarea{
  width:100%;
  padding:12px;
  background:#0c0c1b;
  border:1px solid #333;
  border-radius:8px;
  color:#fcfcfd;
  font-size:16px;
}
.form-group input::placeholder, .form-group textarea::placeholder{ color:rgba(252,252,253,.5); }
.form-group small{ margin-top:5px; color:#E71111; font-size:12px; text-align:right; }
.form-submit button{
  width:100%;
  padding:15px;
  border:none;
  border-radius:10px;
  font-size:18px;
  font-weight:bold;
  cursor:pointer;
  color:#fff;
  background:linear-gradient(90deg, var(--btn-grad-start) 0%, var(--btn-grad-end) 100%);
  box-shadow:var(--btn-shadow);
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.form-submit button:hover{ transform:translateY(-1px); box-shadow:var(--btn-shadow-hover); filter:brightness(1.04); }
@media (max-width:768px){ .contact-section-wrapper{ padding:30px; } .form-row{ flex-direction:column; gap:15px; } }

/* ========================================================== */
/* Privacy Policy                                             */
/* ========================================================== */
.privacy-policy-container{ max-width:960px; margin:0 auto; padding:2rem 1rem; line-height:1.6; color:#ccc; }
.privacy-policy-container h1, .privacy-policy-container h2{ font-family:'Syne',sans-serif; color:#fff; margin-top:6rem; margin-bottom:1rem; }
.privacy-policy-container h1{ font-size:2.5rem; text-align:center; }
.privacy-policy-container h2{ font-size:1.75rem; }
.privacy-policy-container ul{ list-style:disc; margin-left:2rem; }

/* ========================================================== */
/* Responsive tweaks for hero text on mobile                  */
/* ========================================================== */
@media (max-width:768px){
  .home-hero-section .hero-content{
    left:50%;
    transform:translateX(-50%);
    top:250px;
    text-align:center;
  }
  .home-hero-section .hero-content h1{ font-size:40px; }

  .about-hero-section{ padding:0 15px; min-height:350px; }
  .about-hero-section .breadcrumb{ top:120px; }
  .about-hero-section .about-main-heading{ font-size:36px; }
  .about-hero-section .about-tagline{ font-size:16px; }

  .about-intro-section, .list-section{ padding:40px 15px; }
  .about-intro-section .intro-heading{ font-size:32px; }
  .about-intro-section .intro-boxes-container{ flex-direction:column; align-items:center; gap:20px; }
  .about-intro-section .intro-box{ width:90%; }
  .about-intro-section .box-image-placeholder{ width:100%; height:350px; }
  .list-section .list-container{ flex-direction:column; align-items:center; }
  .list-section .list-column{ flex-basis:100%; }
}
@media (max-width:480px){
  .header nav .logo img{ width:70px; height:70px; }
  .about-hero-section{ min-height:300px; }
  .about-hero-section .breadcrumb{ font-size:14px; top:100px; }
  .about-hero-section .about-main-heading{ font-size:28px; }
  .about-intro-section .intro-heading{ font-size:28px; }
  .about-intro-section .intro-box{ padding:30px; }
}

/* ========================================================== */
/* CTA Banners (Home) - swipe strip with clean arrows         */
/* ========================================================== */
.cta-banners-section{ background:#0A0A1A; padding:26px 0 16px; }

.cta-banners-shell{
  position:relative;
  max-width:1200px;
  margin:0 auto;
  padding:0 75px;
}

.cta-banners-shell::before,
.cta-banners-shell::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  width:75px;
  pointer-events:none;
  z-index:2;
}
.cta-banners-shell::before{
  left:0;
  background:linear-gradient(to right, rgba(10,10,26,1), rgba(10,10,26,0));
}
.cta-banners-shell::after{
  right:0;
  background:linear-gradient(to left, rgba(10,10,26,1), rgba(10,10,26,0));
}

.cta-banners-clip{ overflow:hidden; }

.cta-banners-rail{
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  overscroll-behavior-x:contain;

  padding-bottom:24px;
  margin-bottom:-24px;

  scrollbar-width:none;
  -ms-overflow-style:none;
}
.cta-banners-rail::-webkit-scrollbar{ height:0; }
.cta-banners-rail::-webkit-scrollbar-thumb{ background:transparent; }

.cta-banners-inner{
  display:flex;
  flex-wrap:nowrap;
  gap:18px;
  width:max-content;
  padding:0;
  margin:0;
}

.cta-banner{
  flex:0 0 auto;
  width:560px;
  max-width:560px;
  border-radius:16px;
  border:1px solid rgba(252,252,253,.10);
  background:linear-gradient(135deg, #0D0D21 0%, #141436 55%, #1A123A 100%);
  box-shadow:0 14px 34px rgba(0,0,0,.45);
  text-decoration:none;
  color:#FCFCFD;

  display:grid;
  grid-template-columns:240px 1fr;
  gap:16px;
  padding:14px;

  scroll-snap-align:start;
  transition:transform .15s ease, border-color .15s ease;
}
.cta-banner:hover{
  transform:translateY(-1px);
  border-color:rgba(25,210,234,.28);
}

.cta-banner-image{
  width:240px;
  height:140px;
  border-radius:14px;
  background:#000;
  border:1px solid rgba(252,252,253,.10);
}

.cta-banner-content{
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
}

.cta-banner-kicker{
  font-size:13px;
  letter-spacing:.02em;
  color:rgba(252,252,253,.75);
  margin-bottom:6px;
  font-family:'Oxanium',sans-serif;
}

.cta-banner-title{
  font-size:22px;
  line-height:1.25;
  margin-bottom:10px;
  font-family:'Syne',sans-serif;
  color:#FCFCFD;
}

.cta-banner-cta{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-weight:700;
  color:#19D2EA;
  font-family:'Oxanium',sans-serif;
}

.cta-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:44px;
  height:44px;
  border-radius:999px;

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

  background:rgba(10,10,26,.75);
  border:1px solid rgba(252,252,253,.16);
  color:#FCFCFD;
  cursor:pointer;
  z-index:3;
  backdrop-filter:blur(8px);
}
.cta-arrow-left{ left:16px; }
.cta-arrow-right{ right:16px; }
.cta-arrow:disabled{ opacity:.35; cursor:default; }

@media (max-width:992px){
  .cta-banners-shell{ padding:0 30px; }
  .cta-banners-shell::before,
  .cta-banners-shell::after{ width:30px; }

  .cta-banner{ width:520px; max-width:520px; grid-template-columns:220px 1fr; }
  .cta-banner-image{ width:220px; height:132px; }
}

@media (max-width:768px){
  .cta-banners-shell{ padding:0 15px; }
  .cta-banners-shell::before,
  .cta-banners-shell::after{ width:15px; }

  .cta-arrow{ display:none; }

  .cta-banner{
    width:88vw;
    max-width:88vw;
    grid-template-columns:1fr;
  }
  .cta-banner-image{
    width:100%;
    height:170px;
  }
}

/* ==========================================================
   Our Tournaments: KVE card image sizing (DROP-IN)
   ========================================================== */
.tcard-media{
  margin-top:14px;
  border-radius:12px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.18);
  max-width:900px;
  margin-left:auto;
  margin-right:auto;
}

.tcard-media-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:10px;
  padding:10px;
}

.tcard-media-grid img{
  width:100%;
  height:170px;
  object-fit:cover;
  border-radius:10px;
  display:block;
}

@media (max-width:768px){
  .tcard-media-grid{ grid-template-columns:1fr; }
  .tcard-media-grid img{ height:220px; }
}
/* ==========================================================
   NEWS PAGE POLISH (DROP-IN OVERRIDES)
   Paste at the VERY BOTTOM of style.css
   ========================================================== */

/* Layout balance */
.news-body{ padding:0; }

.news-content-wrapper{
  max-width:1200px;
  margin:60px auto;
  padding:0 clamp(16px, 4vw, 75px);
  display:grid;
  grid-template-columns: minmax(260px, 340px) 1fr;
  gap:32px;
  align-items:start;
}

/* Sidebar panel (so it doesn’t look like floating text) */
.news-sidebar{
  padding:22px;
  border-radius:16px;
  background:
    radial-gradient(900px 500px at 20% 10%, rgba(25,210,234,.12) 0%, rgba(10,10,26,0) 55%),
    radial-gradient(700px 400px at 90% 20%, rgba(166,41,255,.10) 0%, rgba(10,10,26,0) 60%),
    linear-gradient(135deg, #0D0D21 0%, #141436 55%, #1A123A 100%);
  border:1px solid rgba(252,252,253,.10);
  box-shadow:0 18px 44px rgba(0,0,0,.45);
}

.search-section,
.filter-section{
  text-align:left;
}

.search-section h3,
.filter-section h3{
  font-family:'Syne',sans-serif;
  font-size:22px;
  margin-bottom:10px;
}

/* Defensive styling: works even if classes differ */
.search-section input[type="text"],
.search-section input.keyword-search{
  width:100%;
  padding:12px 14px;
  border-radius:12px;
  border:1px solid rgba(252,252,253,.14);
  background:rgba(7,7,16,.55);
  color:#FCFCFD;
  outline:none;
  margin-top:8px;
  backdrop-filter:blur(6px);
}

.search-section input[type="text"]::placeholder,
.search-section input.keyword-search::placeholder{
  color:rgba(252,252,253,.55);
}

.search-section button,
.search-button{
  width:100%;
  margin-top:10px;
  padding:12px 14px;
  border:none;
  border-radius:12px;
  cursor:pointer;
  font-weight:800;
  color:#fff;
  background:linear-gradient(90deg, rgba(255,43,214,.85) 0%, rgba(166,41,255,.85) 100%);
  box-shadow:0 10px 26px rgba(166,41,255,.28);
  transition:transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.search-section button:hover,
.search-button:hover{
  transform:translateY(-1px);
  box-shadow:0 12px 30px rgba(166,41,255,.40);
  filter:brightness(1.03);
}

/* Tags as pills (defensive: styles spans, links, buttons, list items) */
.tag-list{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-start;
  gap:10px;
  margin-top:12px;
}

.tag-list .tag,
.tag-list a,
.tag-list button,
.tag-list li{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 14px;
  border-radius:999px;
  font-weight:800;
  font-size:13px;
  letter-spacing:.01em;
  border:1px solid rgba(252,252,253,.16);
  background:rgba(0,0,0,.22);
  color:#FCFCFD;
  cursor:pointer;
  transition:transform .12s ease, border-color .12s ease, background-color .12s ease;
  user-select:none;
}

.tag-list .tag:hover,
.tag-list a:hover,
.tag-list button:hover,
.tag-list li:hover{
  transform:translateY(-1px);
  border-color:rgba(25,210,234,.35);
}

/* Active pill */
.tag.active,
.tag-list .active,
.tag-list a.active,
.tag-list button.active,
.tag-list li.active{
  background:rgba(25,210,234,.18);
  border-color:rgba(25,210,234,.55);
  color:#FCFCFD;
}

/* Articles grid */
.articles-container{ min-width:0; }

.news-content-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:26px;
}

/* Make cards look like actual cards */
.news-card{
  background:
    radial-gradient(800px 400px at 20% 10%, rgba(25,210,234,.10) 0%, rgba(10,10,26,0) 55%),
    radial-gradient(700px 400px at 90% 20%, rgba(166,41,255,.10) 0%, rgba(10,10,26,0) 60%),
    linear-gradient(135deg, #0D0D21 0%, #141436 55%, #1A123A 100%);
  border:1px solid rgba(252,252,253,.10);
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 16px 40px rgba(0,0,0,.45);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.news-card:hover{
  transform:translateY(-6px);
  border-color:rgba(25,210,234,.20);
  box-shadow:0 20px 52px rgba(0,0,0,.55);
}

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

.news-content{
  padding:18px 18px 20px;
}

.news-title{
  font-size:20px;
  font-weight:800;
  margin-bottom:8px;
}

.news-date{
  font-size:13px;
  color:rgba(252,252,253,.65);
  margin-bottom:10px;
}

.news-snippet{
  font-size:14px;
  line-height:1.6;
  color:rgba(252,252,253,.78);
  margin-bottom:12px;
}

/* Read more button */
.read-more-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  border-radius:12px;
  font-weight:900;
  border:1px solid rgba(252,252,253,.16);
  background:rgba(0,0,0,.22);
  color:#FCFCFD;
  transition:transform .12s ease, border-color .12s ease, background-color .12s ease;
}

.read-more-button:hover{
  transform:translateY(-1px);
  border-color:rgba(25,210,234,.35);
  background:rgba(25,210,234,.12);
}

/* Load more */
.load-more-container{ text-align:center; margin-top:34px; }
.load-more-button{
  padding:12px 26px;
  border-radius:12px;
  font-weight:900;
}

/* Responsive */
@media (max-width:992px){
  .news-content-wrapper{
    grid-template-columns:1fr;
  }
  .news-content-grid{
    grid-template-columns:1fr;
  }
  .news-sidebar{
    order:-1;
  }
}
/* ==========================================================
   FORCE Our Tournaments images to show FULL view (NO CROP)
   ========================================================== */

.tcard-media{
  background:transparent !important;
  border:0 !important;
  padding:0 !important;
  box-shadow:none !important;
  overflow:visible !important;
}

.tcard-media-grid{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:14px !important;
  align-items:stretch !important;
}

/* Force full image view */
.tcard-media-grid img,
.tcard-media-grid .tcard-photo{
  width:100% !important;
  height:320px !important;       /* tweak as you like */
  object-fit:contain !important; /* ✅ FULL VIEW, no crop */
  object-position:center !important;

  background:transparent !important;
  border:0 !important;
  padding:0 !important;
  box-shadow:none !important;
  display:block !important;
  border-radius:14px !important; /* optional */
}

@media (max-width: 900px){
  .tcard-media-grid{
    grid-template-columns:1fr !important;
  }
  .tcard-media-grid img,
  .tcard-media-grid .tcard-photo{
    height:280px !important;
  }
}
/* ==========================================================
   Our Tournaments: make the media strip fill the card width
   ========================================================== */

/* Override the old max-width:520px cap */
.tournaments-v1 .tcard .tcard-media{
  max-width: none !important;
  width: 100% !important;
  margin: 16px 0 0 !important;   /* not centered, uses full width */
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Keep the 3-up grid and let it stretch */
.tournaments-v1 .tcard .tcard-media-grid{
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

/* Make images feel “hero sized” while staying FULL (no crop) */
.tournaments-v1 .tcard .tcard-media-grid img{
  height: 260px !important;      /* bump this to 300/320 if you want */
  object-fit: contain !important;/* full image, no crop */
  object-position: center !important;
  border-radius: 14px !important;
  background: transparent !important;
}

/* Stack on smaller screens */
@media (max-width: 900px){
  .tournaments-v1 .tcard .tcard-media-grid{
    grid-template-columns: 1fr !important;
  }
  .tournaments-v1 .tcard .tcard-media-grid img{
    height: 300px !important;
  }
}
/* ==========================================================
   GALLERY (DROP-IN OVERRIDES)
   Paste at the VERY BOTTOM of style.css
   ========================================================== */

/* container spacing (works with your absolute nav) */
.gallery-container{
  padding-top: 0;
}

/* section spacing */
.gallery-section{
  padding:40px 20px;
}
.gallery-section-inner{
  max-width:1100px;
  margin:0 auto;
}

/* heading row */
.gallery-section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  margin:0 0 14px;
}

.gallery-section-heading{
  font-family:'Syne',sans-serif;
  font-size:clamp(1.6rem, 2.4vw, 2.25rem);
  margin:0;
  color:#fff;
}

.gallery-subheading{
  font-family:'Oxanium',sans-serif;
  font-weight:800;
  letter-spacing:.06em;
  font-size:clamp(1.05rem, 1.4vw, 1.25rem);
  margin:0;
  color:#fff;
}

/* album button */
.gallery-album-link{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(0,0,0,.18);
  color:#fff;
  text-decoration:none;
  font-family:'Oxanium',sans-serif;
  font-weight:800;
  white-space:nowrap;
  transition:transform .15s ease, border-color .15s ease, background-color .15s ease;
}
.gallery-album-link:hover{
  transform:translateY(-1px);
  border-color:rgba(25,210,234,.35);
  background:rgba(25,210,234,.10);
}

/* ✅ FIX: deterministic grid so NO row looks “wider” */
.gallery-grid{
  display:grid;
  gap:18px;

  /* desktop: always 3 equal columns */
  grid-template-columns:repeat(3, minmax(0, 1fr));
}
@media (max-width:980px){
  .gallery-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width:620px){
  .gallery-grid{ grid-template-columns:1fr; }
}

/* tile button */
.gallery-card{
  appearance:none;
  border:0;
  padding:0;
  text-align:left;
  cursor:pointer;

  display:block;
  width:100%;

  /* ✅ prevents any inner content from forcing the column wider */
  min-width:0;

  background:#0f1126;
  border:1px solid rgba(0,0,0,.9);
  border-radius:14px;
  overflow:hidden;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  box-shadow:0 6px 18px rgba(0,0,0,.28);
}
.gallery-card:hover{
  transform:translateY(-6px);
  box-shadow:0 10px 22px rgba(0,0,0,.42);
  border-color:rgba(25,210,234,.18);
}
.gallery-card:focus-visible{
  outline:2px solid rgba(0,229,255,.7);
  outline-offset:3px;
}

/* media area */
.gallery-media{
  position:relative;
  width:100%;
  aspect-ratio:16/9;
  background:#0d0d21;
  overflow:hidden;
}
.gallery-cover{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  background:#0d0d21;
}

/* caption */
.gallery-card-content{
  padding:14px 14px 16px;
  text-align:center;
  color:#FCFCFD;
}
.gallery-card-title{
  display:block;
  font-family:'Oxanium',sans-serif;
  font-weight:900;
  letter-spacing:.08em;
  font-size:14px;
}

/* coming soon panel */
.coming-soon{
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  border-radius:14px;
  padding:24px 18px;
  max-width:1100px;
  margin:0 auto;
  text-align:center;
  color:rgba(255,255,255,.85);
  font-family:'Oxanium',sans-serif;
  line-height:1.8;
}
.coming-soon strong{ color:#fff; }

/* lightbox */
.lightbox{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.78);
  z-index:99999;
  padding:22px;
}
.lightbox.open{ display:flex; }

.lightbox-dialog{
  width:min(1100px, 100%);
  background:rgba(12,12,26,.82);
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 24px 80px rgba(0,0,0,.55);
}

.lightbox-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 14px;
  border-bottom:1px solid rgba(255,255,255,.10);
}

.lightbox-title{
  font-family:'Oxanium',sans-serif;
  font-weight:800;
  color:rgba(255,255,255,.9);
  font-size:14px;
  margin:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.lightbox-close{
  appearance:none;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(0,0,0,.22);
  color:#fff;
  border-radius:10px;
  padding:8px 10px;
  cursor:pointer;
  font-family:'Oxanium',sans-serif;
  font-weight:900;
}

.lightbox-body{
  background:#0b0b1a;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:12px;
}

.lightbox-img{
  max-width:100%;
  max-height:78vh;
  width:auto;
  height:auto;
  display:block;
  border-radius:10px;
  background:#0d0d21;
}

/* small screens */
@media (max-width:768px){
  .gallery-section{ padding:28px 15px; }
  .gallery-section-head{ align-items:flex-start; flex-direction:column; }
  .gallery-album-link{ width:100%; justify-content:center; }
}
/* ==========================================================
   GALLERY (DROP-IN OVERRIDES)
   Paste at the VERY BOTTOM of style.css
   ========================================================== */

/* container spacing (works with your absolute nav) */
.gallery-container{
  padding-top: 0;
}

/* section spacing */
.gallery-section{
  padding:40px 20px;
}
.gallery-section-inner{
  max-width:1100px;
  margin:0 auto;
}

/* heading row */
.gallery-section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  margin:0 0 14px;
}

.gallery-section-heading{
  font-family:'Syne',sans-serif;
  font-size:clamp(1.6rem, 2.4vw, 2.25rem);
  margin:0;
  color:#fff;
}

.gallery-subheading{
  font-family:'Oxanium',sans-serif;
  font-weight:800;
  letter-spacing:.06em;
  font-size:clamp(1.05rem, 1.4vw, 1.25rem);
  margin:0;
  color:#fff;
}

/* album button */
.gallery-album-link{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(0,0,0,.18);
  color:#fff;
  text-decoration:none;
  font-family:'Oxanium',sans-serif;
  font-weight:800;
  white-space:nowrap;
  transition:transform .15s ease, border-color .15s ease, background-color .15s ease;
}
.gallery-album-link:hover{
  transform:translateY(-1px);
  border-color:rgba(25,210,234,.35);
  background:rgba(25,210,234,.10);
}

/* ✅ FIX: deterministic grid so NO row looks “wider” */
.gallery-grid{
  display:grid;
  gap:18px;

  /* desktop: always 3 equal columns */
  grid-template-columns:repeat(3, minmax(0, 1fr));
}
@media (max-width:980px){
  .gallery-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width:620px){
  .gallery-grid{ grid-template-columns:1fr; }
}

/* tile button */
.gallery-card{
  appearance:none;
  border:0;
  padding:0;
  text-align:left;
  cursor:pointer;

  display:block;
  width:100%;

  /* ✅ prevents any inner content from forcing the column wider */
  min-width:0;

  background:#0f1126;
  border:1px solid rgba(0,0,0,.9);
  border-radius:14px;
  overflow:hidden;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  box-shadow:0 6px 18px rgba(0,0,0,.28);
}
.gallery-card:hover{
  transform:translateY(-6px);
  box-shadow:0 10px 22px rgba(0,0,0,.42);
  border-color:rgba(25,210,234,.18);
}
.gallery-card:focus-visible{
  outline:2px solid rgba(0,229,255,.7);
  outline-offset:3px;
}

/* media area */
.gallery-media{
  position:relative;
  width:100%;
  aspect-ratio:16/9;
  background:#0d0d21;
  overflow:hidden;
}
.gallery-cover{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  background:#0d0d21;
}

/* caption */
.gallery-card-content{
  padding:14px 14px 16px;
  text-align:center;
  color:#FCFCFD;
}
.gallery-card-title{
  display:block;
  font-family:'Oxanium',sans-serif;
  font-weight:900;
  letter-spacing:.08em;
  font-size:14px;
}

/* coming soon panel */
.coming-soon{
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  border-radius:14px;
  padding:24px 18px;
  max-width:1100px;
  margin:0 auto;
  text-align:center;
  color:rgba(255,255,255,.85);
  font-family:'Oxanium',sans-serif;
  line-height:1.8;
}
.coming-soon strong{ color:#fff; }

/* lightbox */
.lightbox{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.78);
  z-index:99999;
  padding:22px;
}
.lightbox.open{ display:flex; }

.lightbox-dialog{
  width:min(1100px, 100%);
  background:rgba(12,12,26,.82);
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 24px 80px rgba(0,0,0,.55);
}

.lightbox-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 14px;
  border-bottom:1px solid rgba(255,255,255,.10);
}

.lightbox-title{
  font-family:'Oxanium',sans-serif;
  font-weight:800;
  color:rgba(255,255,255,.9);
  font-size:14px;
  margin:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.lightbox-close{
  appearance:none;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(0,0,0,.22);
  color:#fff;
  border-radius:10px;
  padding:8px 10px;
  cursor:pointer;
  font-family:'Oxanium',sans-serif;
  font-weight:900;
}

.lightbox-body{
  background:#0b0b1a;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:12px;
}

.lightbox-img{
  max-width:100%;
  max-height:78vh;
  width:auto;
  height:auto;
  display:block;
  border-radius:10px;
  background:#0d0d21;
}

/* small screens */
@media (max-width:768px){
  .gallery-section{ padding:28px 15px; }
  .gallery-section-head{ align-items:flex-start; flex-direction:column; }
  .gallery-album-link{ width:100%; justify-content:center; }
}
/* ==========================================================
   GALLERY FIXES (paste at bottom)
   ========================================================== */

/* Ensure inline <span> respects width + aspect-ratio */
.gallery-media{
  display:block;            /* ✅ critical fix */
}

/* Make sure the image always fills the media box */
.gallery-cover{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* If you want a slightly “taller” tile everywhere, use 4/3 instead of 16/9 */
/*
.gallery-media{
  aspect-ratio:4/3;
}
*/