. 
/* === GLOBAL MOBILE EDGE-TO-EDGE ENFORCEMENT === */
@media (max-width: 767px) {
/* === GLOBAL MOBILE EDGE-TO-EDGE ENFORCEMENT (FINAL OVERRIDE) === */
@media (max-width: 767px) {

html,
body {
  overflow-x: hidden !important;
  width: 100% !important;
  max-width: 100vw !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #000 !important;
}

section,
.section,
.container,
.wrapper,
.content-wrap,
.page-wrap,
.hero-wrap,
.hero-section,
.cinematic-section,
.glass-section,
.feature-section,
.card-section {
  max-width: 100vw !important;
}

/* TRUE EDGE-TO-EDGE MOBILE SYSTEM */
.mobile-edge-to-edge,
.edge-to-edge-mobile,
.full-bleed-mobile,
.full-width-mobile,
.cinematic-full-mobile {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  border-radius: 0 !important;
  overflow: hidden !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
}

.mobile-edge-to-edge img,
.edge-to-edge-mobile img,
.full-bleed-mobile img,
.full-width-mobile img,
.cinematic-full-mobile img,
.mobile-edge-to-edge video,
.edge-to-edge-mobile video,
.full-bleed-mobile video,
.full-width-mobile video,
.cinematic-full-mobile video {
  width: 100vw !important;
  max-width: 100vw !important;
  height: auto !important;
  display: block !important;
  object-fit: cover !important;
  border-radius: 0 !important;
}

/* REMOVE COMMON MOBILE GUTTER CAUSES */
.mx-auto,
.max-w-[1800px],
.max-w-[1600px],
.max-w-[1400px],
.max-w-[1200px],
.max-w-screen-xl,
.max-w-screen-2xl {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
}

html,
body {
  overflow-x: hidden !important;
  width: 100% !important;
  max-width: 100vw !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #000 !important;
}

section,
.section,
.container,
.wrapper,
.content-wrap,
.page-wrap,
.hero-wrap,
.hero-section,
.cinematic-section,
.glass-section,
.feature-section,
.card-section {
  max-width: 100vw !important;
}

/* TRUE EDGE-TO-EDGE MOBILE SYSTEM */
.mobile-edge-to-edge,
.edge-to-edge-mobile,
.full-bleed-mobile,
.full-width-mobile,
.cinematic-full-mobile {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  border-radius: 0 !important;
  overflow: hidden !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
}

.mobile-edge-to-edge img,
.edge-to-edge-mobile img,
.full-bleed-mobile img,
.full-width-mobile img,
.cinematic-full-mobile img,
.mobile-edge-to-edge video,
.edge-to-edge-mobile video,
.full-bleed-mobile video,
.full-width-mobile video,
.cinematic-full-mobile video {
  width: 100vw !important;
  max-width: 100vw !important;
  height: auto !important;
  display: block !important;
  object-fit: cover !important;
  border-radius: 0 !important;
}

/* REMOVE COMMON MOBILE GUTTER CAUSES */
.mx-auto,
.max-w-[1800px],
.max-w-[1600px],
.max-w-[1400px],
.max-w-[1200px],
.max-w-screen-xl,
.max-w-screen-2xl {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
}
/* === REAL AI LIVE HQ Quick Commands & Chat Panel Tightening === */
.quick-commands,
.real-ai-quick-commands,
.ai-quick-commands {
  width: clamp(210px, 22vw, 280px) !important;
  padding: 12px !important;
  gap: 7px !important;
}

.quick-commands h2,
.real-ai-quick-commands h2,
.ai-quick-commands h2 {
  font-size: clamp(1rem, 1.3vw, 1.35rem) !important;
  line-height: 1 !important;
  margin-bottom: 8px !important;
}

.quick-commands button,
.quick-command-pill,
.real-ai-quick-commands button,
.ai-quick-commands button {
  min-height: 30px !important;
  height: auto !important;
  padding: 7px 12px !important;
  font-size: 11px !important;
  line-height: 1.15 !important;
  letter-spacing: 0.01em !important;
  text-align: left !important;
  justify-content: flex-start !important;
  white-space: normal !important;
  overflow-wrap: break-word !important;
  border-radius: 10px !important;
}

.live-conversation-feed,
.real-ai-feed,
.ai-chat-panel {
  min-height: 320px !important;
  padding: 14px !important;
}

.chat-input-row,
.ai-input-row {
  gap: 8px !important;
  padding: 8px !important;
}

.chat-input-row input,
.ai-input-row input {
  height: 34px !important;
  font-size: 12px !important;
  padding: 8px 12px !important;
}

.chat-input-row button,
.ai-input-row button {
  height: 34px !important;
  min-width: 48px !important;
  padding: 0 14px !important;
  font-size: 11px !important;
}

@media (max-width: 768px) {
  .quick-commands,
  .real-ai-quick-commands,
  .ai-quick-commands {
    width: 100% !important;
    padding: 10px !important;
  }

  .quick-commands button,
  .quick-command-pill,
  .real-ai-quick-commands button,
  .ai-quick-commands button {
    min-height: 32px !important;
    font-size: 11px !important;
    padding: 8px 11px !important;
  }

  .live-conversation-feed,
  .real-ai-feed,
  .ai-chat-panel {
    min-height: 300px !important;
  }
}
/* === Floating REAL AI Button === */
/* === FLOATING AI BUTTON === */
#real-ai-fab {
  position: fixed !important;
  right: 24px !important;
  bottom: 24px !important;
  width: 72px !important;
  height: 72px !important;
  border-radius: 50% !important;
  border: 3px solid #f5c15d !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  z-index: 99999 !important;
  overflow: hidden !important;
  background: none !important;
  box-shadow: 0 0 0 0 #f5c15d, 0 6px 32px rgba(0,0,0,0.38), 0 0 18px rgba(245,193,93,0.22) !important;
  animation: gold-pulse 1.6s infinite cubic-bezier(0.4,0,0.2,1) !important;
  transition: transform 0.18s !important;
  text-decoration: none !important;
}

#real-ai-fab img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  border-radius: 50% !important;
  display: block !important;
  transform: scale(1.28) !important;
}

#real-ai-fab:active { transform: scale(0.95) !important; }

@keyframes gold-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(245,193,93,0.7), 0 6px 32px rgba(0,0,0,0.38); }
  70%  { box-shadow: 0 0 0 12px rgba(245,193,93,0), 0 6px 32px rgba(0,0,0,0.38); }
  100% { box-shadow: 0 0 0 0 rgba(245,193,93,0),   0 6px 32px rgba(0,0,0,0.38); }
}

@media (max-width: 767px) {
  #real-ai-fab {
    width: 62px !important;
    height: 62px !important;
    right: 16px !important;
    bottom: calc(18px + env(safe-area-inset-bottom)) !important;
    z-index: 99999 !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
}

/* Mobile menu opens above FAB — FAB stays visible when menu is closed */
#mobile-menu { z-index: 100000 !important; }
.privacy-modal { z-index: 100001 !important; }
/* === END FLOATING AI BUTTON === */
/* Add extra bottom margin if overlapping elements are present (JS can adjust if needed) */
/* === Custom classes for moved inline styles === */
.mt-18 { margin-top: 18px !important; }
.footer-rankings-title {
  color: var(--gold);
  margin: 0 0 10px 0;
  font-size: 1.18rem;
  letter-spacing: .04em;
}
.custom-mobile-menu {
  top: 78px !important;
  right: 18px !important;
  left: auto !important;
  bottom: auto !important;
  width: min(320px, calc(100vw - 36px)) !important;
  max-height: calc(100vh - 112px) !important;
  border: 1px solid rgba(245,193,93,0.22) !important;
  border-radius: 18px !important;
  box-shadow: 0 28px 80px rgba(0,0,0,0.72) !important;
  overflow-y: auto !important;
  background: linear-gradient(180deg, rgba(10,14,24,0.98) 0%, rgba(4,7,14,0.98) 100%) !important;
}
.custom-mobile-menu-inner {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 20px;
}
.privacy-zero-height { height: 0 !important; }
.d-none { display: none !important; }
.privacy-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(0,0,0,0.85);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.privacy-modal-inner {
  background: #0a0d18;
  border: 1px solid rgba(245,193,93,0.25);
  border-radius: 20px;
  max-width: 420px;
  width: 100%;
  padding: 32px;
  position: relative;
  box-shadow: 0 30px 80px rgba(0,0,0,0.8);
}
.privacy-modal-close {
  position: absolute;
  top: 14px;
  right: 16px;
  background: none;
  border: none;
  color: rgba(255,255,255,0.5);
  font-size: 28px;
  cursor: pointer;
  line-height: 1;
}
.privacy-img {
  width: 90px;
  height: 90px;
  object-fit: cover;
  border-radius: 16px;
  display: block;
  margin-bottom: 20px;
}
.privacy-title {
  font-family: 'Bebas Neue',sans-serif;
  color: #ffffff;
  letter-spacing: 0.05em;
  margin: 0 0 16px 0;
}
.privacy-desc {
  color: rgba(255,255,255,0.75);
  font-size: 0.95rem;
  line-height: 1.75;
  margin: 0 0 24px 0;
}
.privacy-modal-close-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 28px;
  border-radius: 10px;
  border: 1px solid rgba(245,193,93,0.5);
  background: rgba(245,193,93,0.08);
  color: #f5c15d;
  font-family: 'Barlow Condensed',sans-serif;
  font-size: 0.9rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  cursor: pointer;
}
/* === REAL AI FULLSCREEN APP LAYOUT === */
/* .real-ai-fullscreen-app {
  min-height: 100vh;
  height: 100vh;
  max-height: 100vh;
  width: 100vw;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.real-ai-main-app {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  min-height: 0;
  height: 100vh;
  max-height: 100vh;
  overflow: hidden;
} */
.real-ai-hero {
  min-height: unset !important;
  height: 28vh !important;
  max-height: 32vh !important;
  padding: 1vw 0 0.5vw !important;
  grid-template-columns: minmax(0,1.1fr) minmax(220px,.9fr);
  align-items: center;
  gap: clamp(12px,1.5vw,24px);
}
.real-ai-title {
  font-size: clamp(2.2rem,5vw,3.2rem)!important;
  margin: 0 0 6px 0!important;
}
.real-ai-orb-stage {
  min-height: 0 !important;
  height: 14vw !important;
  max-height: 22vh !important;
}
.real-ai-orb {
  width: clamp(100px,12vw,160px)!important;
  min-width: 100px;
  aspect-ratio: 1;
}
.real-ai-shell {
  width: 100%;
  max-width: 1420px;
  margin: 0 auto;
}
.real-ai-chat-grid {
  flex: 1 1 0;
  min-height: 0;
  height: 0;
  display: grid;
  grid-template-columns: minmax(260px,0.85fr) minmax(0,1.45fr);
  gap: 14px;
  padding: 0;
  max-height: none;
}
.real-ai-side {
  display: flex;
  flex-direction: column;
  height: 100%;
  max-height: 100%;
  min-width: 0;
  overflow: hidden;
  padding: 12px 8px 12px 12px;
}
.real-ai-prompt-list {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  margin-bottom: 0;
}
.real-ai-chat {
  display: flex;
  flex-direction: column;
  height: 100%;
  max-height: 100%;
  min-height: 0;
  overflow: hidden;
  background: none;
}
.real-ai-messages {
  flex: 1 1 auto;
  min-height: 0;
  max-height: 100%;
  overflow-y: auto;
  padding: 10px 6px 10px 10px;
  gap: 8px;
}
.real-ai-chat-input {
  flex-shrink: 0;
  padding: 8px 8px 8px 10px;
  background: rgba(0,0,0,0.12);
}
.real-ai-card-grid {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
  gap: 8px !important;
}
.real-ai-card {
  min-height: 90px !important;
  padding: 10px 8px !important;
}
@media (max-width: 980px) {
  .real-ai-hero, .real-ai-chat-grid {
    grid-template-columns: 1fr !important;
  }
}
@media (max-width: 640px) {
  .real-ai-hero {
    padding-top: 8px !important;
    height: 18vh !important;
    max-height: 22vh !important;
  }
  .real-ai-orb-stage {
    height: 12vw !important;
    min-height: 0 !important;
    max-height: 14vh !important;
  }
  .real-ai-title {
    font-size: clamp(1.2rem,7vw,2.2rem)!important;
  }
}
/* === FIRST STRIKE FULL IMAGE FIX === */
.first-strike-image-wrap,
.first-strike-card {
  height: auto !important;
  min-height: unset !important;
  overflow: visible !important;
}

.first-strike-full-image {
  width: 100% !important;
  height: auto !important;
  display: block;
  object-fit: contain !important;
  object-position: center center !important;
  border-radius: 28px !important;
}

@media (max-width: 768px) {
  .first-strike-full-image {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }
  .first-strike-image-wrap,
  .first-strike-card {
    height: auto !important;
    overflow: visible !important;
  }
}
/* ===== KAI LOCKED: SHRINK SITE MAP SECTION 15% ===== */
.real-aligned-container.sitemap-intro-inner {
  transform: scale(0.85);
  transform-origin: top center;
}
#first-strike {
  scroll-margin-top: 110px;
}
/* ===== KAI LOCKED: FOLLOW SOCIAL GLASS CARD INSET ===== */
.site-map-footer .glass.sponsor-shell,
.site-map-footer .glass.social-shell,
.site-map-footer .glass.follow-social-section {
  width: calc(100% - 40px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
@media (max-width: 767px) {
  .site-map-footer .glass.sponsor-shell,
  .site-map-footer .glass.social-shell,
  .site-map-footer .glass.follow-social-section {
    width: calc(100% - 16px) !important;
  }
}
/* ===== KAI LOCKED: PILL GRID INSET ===== */
.site-map-footer .pill-links-grid {
  padding-left: 40px !important;
  padding-right: 40px !important;
  box-sizing: border-box;
}
@media (max-width: 767px) {
  .site-map-footer .pill-links-grid {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}
/* ===== KAI LOCKED: TRUSTED / SITEMAP / SOCIAL ALIGNMENT ===== */
.real-aligned-container {
  max-width: 1800px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
  width: 100%;
  box-sizing: border-box;
}

/* Trusted Partners Section */
#sponsor-section .real-aligned-container {
  padding-top: 0;
  padding-bottom: 0;
}
#sponsor-section .section-head-left {
  margin-bottom: 36px !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
#sponsor-section .rc-eyebrow {
  margin-bottom: 12px !important;
  display: block;
}
#sponsor-section .section-heading {
  margin-bottom: 36px !important;
}
#sponsor-section .sponsor-shell {
  margin-bottom: 34px !important;
}

/* Site Map Header Section */
.sitemap-intro-section {
  padding: 0;
}
.sitemap-intro-inner {
  max-width: 1800px;
  margin: 0 auto;
  padding-left: 20px;
  padding-right: 20px;
  width: 100%;
  box-sizing: border-box;
}
.sitemap-intro-section .final-crown-divider-longer {
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100%;
}
.sitemap-intro-section .rc-eyebrow {
  margin-top: 12px !important;
  margin-bottom: 10px !important;
  display: block;
}
.sitemap-intro-section .section-heading {
  margin-bottom: 54px !important;
  flex-wrap: nowrap !important;
}

/* Follow Us on Social Media Section */
.site-map-footer-inner {
  max-width: 1800px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 20px !important;
  padding-right: 20px !important;
  width: 100%;
  box-sizing: border-box;
}
.site-map-footer .sitemap-header {
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}
.site-map-footer .sitemap-top {
  align-items: flex-start !important;
  margin-left: 0 !important;
  gap: 24px !important;
  margin-bottom: 44px !important;
}
.site-map-footer .sitemap-social {
  justify-content: flex-start !important;
  align-items: center !important;
  margin-left: 0 !important;
  padding-left: 0 !important;
  gap: 28px !important;
}
.site-map-footer .sitemap-header h2.sitemap-social-heading {
  margin: 0 0 12px 0 !important;
  padding: 0 !important;
  line-height: 0.9 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  justify-content: flex-start !important;
}
.site-map-footer .sitemap-header h2.sitemap-social-heading > .section-heading-accent,
.site-map-footer .sitemap-header h2.sitemap-social-heading > .real-opportunity-shimmer {
  font-size: calc(var(--rc-accent-size, clamp(1.98rem, 3.78vw, 3.42rem)) * 0.585) !important;
  line-height: 0.9 !important;
  letter-spacing: -0.01em !important;
}
.site-map-footer .sitemap-header h2.sitemap-social-heading > .section-heading-main {
  font-size: calc(var(--rc-title-size, clamp(2.2rem, 4.2vw, 3.8rem)) * 0.585) !important;
  line-height: 0.9 !important;
  letter-spacing: -0.01em !important;
}
.site-map-footer .sitemap-header .sitemap-desc {
  margin-top: 0.2em !important;
  margin-bottom: 0.7em !important;
  color: rgba(255,255,255,0.75) !important;
  font-size: 1.1rem !important;
  line-height: 1.45 !important;
  max-width: 600px !important;
  text-align: left !important;
}

@media (max-width: 767px) {
  .real-aligned-container,
  .sitemap-intro-inner,
  .site-map-footer-inner {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  .site-map-footer .sitemap-top {
    gap: 18px !important;
    margin-bottom: 36px !important;
  }
  .site-map-footer .sitemap-header h2.sitemap-social-heading > .section-heading-accent,
  .site-map-footer .sitemap-header h2.sitemap-social-heading > .real-opportunity-shimmer {
    font-size: calc(clamp(2.2rem, 4.2vw, 3.8rem) * 0.36855) !important;
  }
  .site-map-footer .sitemap-header h2.sitemap-social-heading > .section-heading-main {
    font-size: calc(clamp(2.2rem, 4.2vw, 3.8rem) * 0.4095) !important;
  }
  .site-map-footer .sitemap-social {
    gap: 14px !important;
    flex-wrap: wrap !important;
  }
}
/* Make the sitemap header and description 10% bigger */
.sitemap-head-bigger {
  font-size: 110%;
}
/* =====================
   SITEMAP SECTION LAYOUT
   ===================== */
.sitemap-top {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  margin-bottom: 50px;
}
.sitemap-header {
  /* Inherit left margin from pills grid, no extra margin needed */
}
.sitemap-social {
  display: flex;
  justify-content: flex-start;
  gap: 20px;
}
@media (max-width: 767px) {
  .sitemap-top {
    gap: 16px;
    margin-bottom: 36px;
  }
  .sitemap-social {
    gap: 16px;
  }
}
@media (min-width: 768px) {
  .strike-img {
    margin-top: -273px !important; /* moved down 45px from -318px */
  }
}
@media (min-width: 768px) {
  .strike-img {
    margin-top: -318px !important; /* was -303px, moved up 15px */
  }
}
@media (max-width: 767px) {
  img.strike-img {
    transform: translateY(190px) !important;
    position: relative !important;
    z-index: 10 !important;
  }
}
/* Force hamburger always visible on all screens */
/* Hamburger always visible, fixed top right */

@import url("https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap");

/* ============================================================
   SECTION PADDING — consistent 32px top/bottom across all content sections
   ============================================================ */
#first-strike, #featured-game, #why-join, #distribution, #prize, #gamer-rules,
#next-game, #top-players, #championship-weekend-section, #pm-lounge,
#sponsor-section, #Live-Events, #agency, #Championship-Venue,
#supercity, #sponsor-form-section {
  padding-top: 16px !important;
  padding-bottom: 16px !important;
}

/* ============================================================
   1. CSS VARIABLES & ROOT
   ============================================================ */
:root {
  --bg: #060912;
  --bg2: #080d1a;
  --surface: #0a0e17;
  --gold: #ffc85b;
  --gold-bright: #ffe082;
  --gold-dark: #b8860b;
  --gold-glow: rgba(255, 200, 91, 0.5);
  --cyan: #00d8ff;
  --amber: #ff9800;
  --text: #e8e0d0;
  --text-primary: #ffffff;
  --text-secondary: #94a3b8;
  --text-muted: #8a8070;
  --red: #e63946;
  --blue-accent: #1a3a6e;
  --shimmer-speed: 4s;
}

/* ============================================================
   2. RESET & BASE
   ============================================================ */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
}

html {
  scroll-behavior: smooth;
  scrollbar-width: thin;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

section[id],
div[id],
footer[id],
span[id] {
  scroll-margin-top: 120px;
}

html::-webkit-scrollbar:horizontal { display: none; }


body { background: red !important; } /* TEST: Remove after confirming CSS loads */

html,
body {
  background: #000000 !important;
  color: var(--text);
  font-family: 'Barlow', "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
  line-height: 1.5;
  overflow-x: clip !important;
  max-width: 100vw;
  width: 100%;
  cursor: default;
  height: 100%;
  min-height: 100vh;
  /* overflow-y: hidden !important;  Removed to restore scrolling */
}

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: rgba(255, 255, 255, 0.05); }
::-webkit-scrollbar-thumb { background: rgba(255, 200, 91, 0.3); border-radius: 999px; }
::-webkit-scrollbar-thumb:hover { background: rgba(255, 200, 91, 0.5); }

img, video, picture { max-width: 100%; }

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

a, button { touch-action: manipulation; }

section { padding: 80px 20px; }

/* ============================================================
   3. TYPOGRAPHY
   ============================================================ */
.font-bebas { font-family: "Bebas Neue", sans-serif; }
.font-inter { font-family: "Inter", sans-serif; }

.section-label {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px;
  letter-spacing: 5px;
  color: var(--gold);
  text-transform: uppercase;
  margin-bottom: 12px;
  display: block;
}

.section-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(36px, 6vw, 72px);
  line-height: 1;
  color: #fff;
  margin-bottom: 8px;
}

.section-desc {
  font-size: 18px;
  color: var(--text-muted);
  line-height: 1.8;
  max-width: 100%;
  text-align: left;
  margin-bottom: 50px;
}

h2.font-bebas {
  font-size: clamp(3.4rem, 6.5vw, 5.8rem);
  line-height: 0.92;
  margin-top: 2px !important;
  margin-bottom: 4px !important;
}
h2.font-bebas .real-opportunity-shimmer {
  font-size: clamp(3.4rem, 6.5vw, 5.8rem);
  line-height: 0.92;
}
h2.font-bebas .h2-after {
  font-size: clamp(1.7rem, 3.25vw, 2.9rem);
  line-height: 0.92;
}

.h2-after { margin-top: 4px; }

/* ============================================================
   SECTION HEADING SYSTEM — standardized across all sections
   ============================================================ */
.section-heading {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  column-gap: 0.08em;
  row-gap: 0;
}

.section-heading-main {
  font-family: 'Bebas Neue', sans-serif !important;
  font-size: var(--rc-title-size) !important;
  line-height: 0.88 !important;
  letter-spacing: -0.01em !important;
  color: #ffffff;
  flex-shrink: 0;
  text-transform: none !important;
}

.section-heading-accent {
  font-family: 'Bebas Neue', sans-serif !important;
  font-size: var(--rc-accent-size) !important;
  line-height: 0.88 !important;
  letter-spacing: -0.01em !important;
  flex-shrink: 0;
  text-transform: none !important;
  margin-left: 0 !important;
}

/* Shimmer spans inside section headings must keep transparent color */
.section-heading .real-opportunity-shimmer {
  color: transparent !important;
}

@media (max-width: 767px) {
  section[id],
  div[id],
  footer[id],
  span[id] {
    scroll-margin-top: 100px;
  }

  .section-heading {
    flex-wrap: wrap;
    column-gap: 0.08em;
    row-gap: 0;
  }

  .section-heading-main {
    font-size: calc(clamp(2.2rem, 4.2vw, 3.8rem) * 0.7) !important;
  }

  .section-heading-accent {
    font-size: calc(clamp(2.2rem, 4.2vw, 3.8rem) * 0.63) !important;
  }
}

.text-xs  { font-size: 0.75rem;  line-height: 1rem; }
.text-sm  { font-size: 0.875rem; line-height: 1.25rem; }
.text-base{ font-size: 1rem;     line-height: 1.5rem; }
.text-lg  { font-size: 1.125rem; line-height: 1.75rem; }
.text-xl  { font-size: 1.25rem;  line-height: 1.75rem; }
.text-2xl { font-size: 1.5rem;   line-height: 2rem; }
.text-3xl { font-size: 1.875rem; line-height: 2.25rem; }
.text-4xl { font-size: 2.25rem;  line-height: 2.5rem; }
.text-5xl { font-size: 3rem;     line-height: 1; }
.text-6xl { font-size: 3.75rem;  line-height: 1; }
.text-7xl { font-size: 4.5rem;   line-height: 1; }
.text-8xl { font-size: 6rem;     line-height: 1; }
.text-9xl { font-size: 8rem;     line-height: 1; }

.font-normal   { font-weight: 400; }
.font-medium   { font-weight: 500; }
.font-semibold { font-weight: 600; }
.font-bold     { font-weight: 700; }

.text-white    { color: #ffffff; }
.text-white\/40{ color: rgba(255,255,255,0.4); }
.text-white\/50{ color: rgba(255,255,255,0.5); }
.text-white\/60{ color: rgba(255,255,255,0.6); }
.text-white\/70{ color: rgba(255,255,255,0.7); }
.text-white\/80{ color: rgba(255,255,255,0.8); }
.text-white\/90{ color: rgba(255,255,255,0.9); }
.text-gold     { color: var(--gold); }
.text-gold\/90 { color: rgba(255,200,91,0.9); }
.text-cyan     { color: var(--cyan); }
.text-bg       { color: var(--bg); }
.text-center   { text-align: center; }
.text-left     { text-align: left; }
.uppercase     { text-transform: uppercase; }
.tracking-wide      { letter-spacing: 0.025em; }
.tracking-wider     { letter-spacing: 0.05em; }
.tracking-\[0\.2em\]  { letter-spacing: 0.2em; }
.tracking-\[0\.3em\]  { letter-spacing: 0.3em; }
.tracking-\[0\.02em\] { letter-spacing: 0.02em; }
.tracking-\[0\.25em\] { letter-spacing: 0.25em; }
.tracking-tight     { letter-spacing: -0.025em; }
.leading-relaxed    { line-height: 1.625; }
.leading-\[0\.9\]   { line-height: 0.9; }
.leading-\[0\.95\]  { line-height: 0.95; }
.whitespace-nowrap  { white-space: nowrap; }
.no-underline       { text-decoration: none; }

.text-glow-gold { text-shadow: 0 0 20px rgba(255,200,91,0.4); }
.text-glow-cyan { text-shadow: 0 0 20px rgba(0,216,255,0.4); }

.tagline {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 28px;
  letter-spacing: 3px;
  background: linear-gradient(90deg, var(--gold-bright), var(--gold));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  display: block;
  margin-bottom: 8px;
}

.gold-text {
  background: linear-gradient(135deg, #f6e27a 0%, #d4af37 40%, #ffd700 70%, #b8962e 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  font-weight: 700;
  text-shadow: 0 0 6px rgba(212,175,55,0.35), 0 0 14px rgba(212,175,55,0.25);
}

.kicker {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(0.72rem, 0.92vw, 0.92rem);
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: #f5c15d;
  margin-bottom: 8px;
  line-height: 0.96;
  display: block;
}

.shared-section-head {
  text-align: left;
  max-width: 42rem;
  margin-left: 0;
  margin-right: 0;
}
.shared-section-head h2,
.shared-section-head p,
.shared-section-head span { text-align: left; }
.shared-section-head > span,
.section-broadcast-eyebrow {
  display: block;
  color: var(--gold);
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(0.72rem, 0.92vw, 0.92rem);
  font-weight: 400;
  letter-spacing: 0.26em;
  line-height: 0.96;
  text-transform: uppercase;
  margin-bottom: 0.75rem;
}
.shared-section-head > h2,
.section-broadcast-title {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(3rem, 6vw, 5.8rem);
  line-height: 0.92;
  color: #ffffff;
  letter-spacing: 0.01em;
  margin-top: 0;
  margin-bottom: 0;
  text-align: left;
}
.section-broadcast-title .section-broadcast-accent,
.section-broadcast-title .real-opportunity-shimmer,
.shared-section-head h2 .real-opportunity-shimmer {
  display: inline-block;
}

/* ============================================================
   GLOBAL 3-TIER HEADLINE SYSTEM — Bebas Neue only
   ============================================================ */
/* Tier 1 — Eyebrow Label */
.rc-eyebrow {
  display: block;
  font-family: 'Bebas Neue', sans-serif;
  color: #f5c15d;
  text-transform: uppercase;
  font-size: clamp(0.72rem, 0.9vw, 0.92rem);
  line-height: 0.96;
  letter-spacing: 0.26em;
  margin-bottom: 10px;
}

/* Tier 2 — Hero Title */
.rc-title {
  font-family: 'Bebas Neue', sans-serif;
  color: #ffffff;
  text-transform: none;
  font-size: var(--rc-title-size);
  line-height: 0.88;
  letter-spacing: -0.01em;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  column-gap: 0.08em;
  row-gap: 0;
}
.rc-title .gold {
  position: relative;
  display: inline-block;
  font-size: var(--rc-accent-size);
  line-height: 0.88;
  letter-spacing: -0.01em;
  margin-left: 0;
  background: linear-gradient(90deg, #c9962f 0%, #f5c15d 20%, #fff2b3 35%, #f5c15d 50%, #d4a94f 70%, #f5c15d 100%);
  background-size: 220% auto;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: realOpportunityShimmer 3.2s linear infinite;
}

/* Tier 3 — Power Line / Callout */
.rc-powerline {
  font-family: 'Bebas Neue', sans-serif;
  color: #f5c15d;
  text-transform: uppercase;
  font-size: clamp(1.02rem, 1.55vw, 1.42rem);
  line-height: 1.08;
  letter-spacing: 0.08em;
  margin-top: 12px;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  column-gap: 0.18em;
  row-gap: 0.05em;
}
.rc-powerline.white { color: #ffffff; }

@media (max-width: 767px) {
  .rc-title     { font-size: clamp(2.4rem, 9vw, 3.6rem); line-height: 0.9; }
  .rc-powerline { font-size: clamp(0.96rem, 3.8vw, 1.16rem); }
  .rc-eyebrow   { font-size: 0.72rem; }
}

/* ============================================================
   4. ANIMATIONS & KEYFRAMES
   ============================================================ */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes scaleIn {
  from { opacity: 0; transform: scale(0.92); }
  to   { opacity: 1; transform: scale(1); }
}
@keyframes bounce {
  0%, 100% { transform: rotate(45deg) translateY(0); }
  50%       { transform: rotate(45deg) translateY(5px); }
}
@keyframes shimmer {
  0%   { background-position: -200% center; }
  100% { background-position:  200% center; }
}
@keyframes shimmerMove {
  0%   { left: -150%; }
  100% { left:  150%; }
}
@keyframes shimmerSlideGlobal {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
@keyframes shimmerSweep {
  0%   { transform: translateX(-150%) skewX(-20deg); }
  100% { transform: translateX(200%) skewX(-20deg); }
}
@keyframes borderGlow {
  0%, 100% { opacity: 0.5; }
  50%       { opacity: 1; }
}
@keyframes scrollSponsors {
  0%   { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(-50%, 0, 0); }
}
@keyframes sponsorMarquee {
  from { transform: translate3d(0,0,0); }
  to   { transform: translate3d(calc(-50% - (var(--sponsor-gap) / 2)),0,0); }
}
@keyframes dist-marquee {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(-50%, 0, 0); }
}
@keyframes pulseGlow {
  0%   { box-shadow: 0 0 10px rgba(255,215,0,0.7), 0 0 20px rgba(0,174,239,0.6); }
  100% { box-shadow: 0 0 20px rgba(255,215,0,1),   0 0 40px rgba(0,174,239,1); }
}
@keyframes pulseChampion {
  0%   { box-shadow: 0 0 0 rgba(0,174,239,0), 0 10px 24px rgba(0,0,0,0.28), inset 0 1px 0 rgba(255,255,255,0.04); border-color: rgba(0,174,239,0.25); }
  100% { box-shadow: 0 0 18px rgba(0,174,239,0.18), 0 14px 32px rgba(0,0,0,0.32), inset 0 1px 0 rgba(255,255,255,0.05); border-color: rgba(0,174,239,0.38); }
}
@keyframes heroReveal {
  0%   { opacity: 0; transform: scale(1.08); }
  100% { opacity: 1; transform: scale(1.02); }
}
@keyframes overlayReveal {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@keyframes heroDrift {
  0%   { transform: scale(1.02) translateX(0px) translateY(0px); }
  100% { transform: scale(1.06) translateX(-18px) translateY(-4px); }
}
@keyframes textReveal {
  0%   { opacity: 0; transform: translateY(20px); filter: blur(4px); }
  100% { opacity: 1; transform: translateY(0); filter: blur(0); }
}
@keyframes lightSweep {
  0%   { left: -120%; opacity: 0; }
  15%  { opacity: 1; }
  50%  { left: 120%; opacity: 1; }
  100% { left: 120%; opacity: 0; }
}
@keyframes agencyReveal {
  0%   { opacity: 0; transform: translateY(20px); filter: blur(4px); }
  100% { opacity: 1; transform: translateY(0); filter: blur(0); }
}
@keyframes agencyLightSweep {
  0%   { left: -120%; opacity: 0; }
  12%  { opacity: 1; }
  50%  { left: 130%; opacity: 1; }
  100% { left: 130%; opacity: 0; }
}
@keyframes realOpportunityShimmer {
  0%   { background-position: 200% center; }
  100% { background-position: -200% center; }
}
@keyframes prizeShimmer {
  0%   { left: -75%; }
  100% { left: 125%; }
}
@keyframes shineSweep {
  0%   { left: -75%; }
  100% { left: 125%; }
}
@keyframes badgePulse {
  0%   { box-shadow: 0 0 0 1px rgba(255,215,0,0.6), 0 6px 20px rgba(245,193,93,0.4), inset 0 1px 0 rgba(255,255,255,0.5); }
  100% { box-shadow: 0 0 10px rgba(255,215,0,0.8), 0 0 30px rgba(245,193,93,0.6), inset 0 1px 0 rgba(255,255,255,0.6); }
}
@keyframes badgePulseBlue {
  0%   { box-shadow: 0 0 0 1px rgba(0,174,239,0.6), 0 6px 20px rgba(0,174,239,0.4), 0 0 30px rgba(30,144,255,0.4); }
  100% { box-shadow: 0 0 16px rgba(0,174,239,0.9), 0 8px 28px rgba(0,174,239,0.6), 0 0 44px rgba(30,144,255,0.6); }
}
@keyframes liveStatusGlow {
  0%   { box-shadow: 0 0 0 rgba(245,193,93,0), inset 0 1px 0 rgba(255,255,255,0.03); }
  100% { box-shadow: 0 0 18px rgba(245,193,93,0.10), inset 0 1px 0 rgba(255,255,255,0.05); }
}
@keyframes finalCrownSweep {
  0%   { left: -120%; opacity: 0; }
  15%  { opacity: 1; }
  50%  { left: 130%; opacity: 1; }
  100% { left: 130%; opacity: 0; }
}
@keyframes finalCrownSlowZoom {
  0%   { transform: scale(0.86); }
  100% { transform: scale(0.91); }
}
@keyframes finalCrownLightBreath {
  0%   { filter: brightness(1.02) contrast(1.05) saturate(1.03); }
  100% { filter: brightness(1.08) contrast(1.08) saturate(1.06); }
}
@keyframes prizeExpansionReveal {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes stageCtaSweep {
  100% { left: 135%; }
}
@keyframes championPulse {
  0%   { transform: scale(1);    box-shadow: 0 0 0 0  rgba(255,200,91,0.55); }
  45%  { transform: scale(1.06); box-shadow: 0 0 0 12px rgba(255,200,91,0.12); }
  100% { transform: scale(1);    box-shadow: 0 0 0 0  rgba(255,200,91,0); }
}
@keyframes championModalRise {
  from { opacity: 0; transform: translateY(14px) scale(0.98); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}


/* ============================================================
   5. LAYOUT & UTILITIES
   ============================================================ */
.max-w-7xl { max-width: 112rem; margin-left: auto; margin-right: auto; }
.max-w-[1800px] { max-width: 1800px; margin-left: auto; margin-right: auto; }
.max-w-4xl { max-width: 56rem; margin-left: auto; margin-right: auto; }
.max-w-3xl { max-width: 48rem; margin-left: auto; margin-right: auto; }
.max-w-2xl { max-width: 42rem; margin-left: auto; margin-right: auto; }
.min-h-screen { min-height: 100vh; }
.relative { position: relative; }
.absolute { position: absolute; }
.fixed { position: fixed; }
.inset-0 { top: 0; right: 0; bottom: 0; left: 0; }
.z-10 { z-index: 10; }
.z-20 { z-index: 20; }
.z-50 { z-index: 50; }
.overflow-hidden { overflow: hidden; }
.pointer-events-none { pointer-events: none; }
.w-fit { width: fit-content; }
.flex { display: flex; }
.inline-flex { display: inline-flex; }
.flex-wrap { flex-wrap: wrap; }
.flex-col { flex-direction: column; }
.items-center { align-items: center; }
.items-end { align-items: flex-end; }
.justify-center { justify-content: center; }
.justify-between { justify-content: space-between; }
.justify-end { justify-content: flex-end; }
.gap-2 { gap: 0.5rem; }
.gap-3 { gap: 0.75rem; }
.gap-4 { gap: 1rem; }
.gap-6 { gap: 1.5rem; }
.gap-8 { gap: 2rem; }
.gap-12 { gap: 3rem; }
.flex-shrink-0 { flex-shrink: 0; }
.grid { display: grid; }
.grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.col-span-2 { grid-column: span 2 / span 2; }
.px-3 { padding-left: 0.75rem; padding-right: 0.75rem; }
.px-4 { padding-left: 1rem; padding-right: 1rem; }
.px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
.px-8 { padding-left: 2rem; padding-right: 2rem; }
.py-1 { padding-top: 0.25rem; padding-bottom: 0.25rem; }
.py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
.py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; }
.py-4 { padding-top: 1rem; padding-bottom: 1rem; }
.py-5 { padding-top: 1.25rem; padding-bottom: 1.25rem; }
.py-6 { padding-top: 1.5rem; padding-bottom: 1.5rem; }
.py-12 { padding-top: 3rem; padding-bottom: 3rem; }
.py-16 { padding-top: 4rem; padding-bottom: 4rem; }
.py-24 { padding-top: 6rem; padding-bottom: 6rem; }
.p-2 { padding: 0.5rem; }
.p-4 { padding: 1rem; }
.p-5 { padding: 1.25rem; }
.p-6 { padding: 1.5rem; }
.p-8 { padding: 2rem; }
.pb-5 { padding-bottom: 1.25rem; }
.pb-16 { padding-bottom: 4rem; }
.pt-8 { padding-top: 2rem; }
.pt-32 { padding-top: 8rem; }
.pl-4 { padding-left: 1rem; }
.mt-1 { margin-top: 0.25rem; }
.mt-2 { margin-top: 0.5rem; }
.mt-3 { margin-top: 0.75rem; }
.mt-4 { margin-top: 1rem; }
.mt-6 { margin-top: 1.5rem; }
.mt-8 { margin-top: 2rem; }
.mt-12 { margin-top: 3rem; }
.mb-2 { margin-bottom: 0.5rem; }
.mb-4 { margin-bottom: 1rem; }
/* Tight leading for kicker→heading stacks */
.tracking-\[0\.3em\].uppercase { margin-bottom: 2px !important; }
h2.font-bebas.mt-2 { margin-top: 2px !important; }
h2.font-bebas + p, h2.font-bebas + .rules-subtext { margin-top: 4px !important; }
.mb-6 { margin-bottom: 1.5rem; }
.mb-8 { margin-bottom: 2rem; }
.mb-12 { margin-bottom: 3rem; }
.mb-16 { margin-bottom: 4rem; }
.-mt-20 { margin-top: -5rem; }
.mx-auto { margin-left: auto; margin-right: auto; }
.space-y-2 > * + * { margin-top: 0.5rem; }
.space-y-4 > * + * { margin-top: 1rem; }
.w-full { width: 100%; }
.w-auto { width: auto; }
.w-5 { width: 1.25rem; }
.w-6 { width: 1.5rem; }
.w-8 { width: 2rem; }
.w-10 { width: 2.5rem; }
.w-14 { width: 3.5rem; }
.w-16 { width: 4rem; }
.h-14 { height: 3.5rem; }
.h-16 { height: 4rem; }
.h-20 { height: 5rem; }
.h-auto { height: auto; }
.min-h-[250px] { min-height: 250px; }
.min-h-[280px] { min-height: 280px; }
.min-h-[300px] { min-height: 300px; }
.min-h-[400px] { min-height: 400px; }
.min-h-[450px] { min-height: 450px; }
.max-h-[500px] { max-height: 500px; }
.h-[280px] { height: 280px; }
.h-[300px] { height: 300px; }
.h-[320px] { height: 320px; }
.aspect-[3/4] { aspect-ratio: 3 / 4; }
.w-[3px] { width: 3px; }
.w-[70%] { width: 70%; }

/* bg colors */
.bg-bg       { background-color: var(--bg); }
.bg-surface  { background-color: var(--surface); }
.bg-gold     { background-color: var(--gold); }
.bg-gold\/10 { background-color: rgba(255,200,91,0.1); }
.bg-gold\/20 { background-color: rgba(255,200,91,0.2); }
.bg-gold\/90 { background-color: rgba(255,200,91,0.9); }
.bg-white\/5  { background-color: rgba(255,255,255,0.05); }
.bg-white\/10 { background-color: rgba(255,255,255,0.1); }
.bg-bg\/70   { background-color: rgba(6,9,18,0.7); }
.bg-bg\/80   { background-color: rgba(6,9,18,0.8); }
.bg-white\/\[0\.03\] { background-color: rgba(255,255,255,0.03); }
.min-h-screen, .bg-bg, .bg-gradient-main { background: #000000 !important; }
.bg-gradient-main {
  background:
    radial-gradient(circle at top left, rgba(255,152,0,0.08), transparent 30%),
    radial-gradient(circle at top right, rgba(255,200,91,0.06), transparent 30%),
    linear-gradient(180deg, #03050b 0%, #060912 50%, #050913 100%);
}
.bg-gradient-to-b { background: linear-gradient(to bottom, transparent, rgba(10,14,23,0.5)); }
.bg-gradient-to-t { background: linear-gradient(to top, var(--bg), transparent); }
.bg-gradient-to-r { background: linear-gradient(to right, var(--bg), transparent); }

/* borders */
.border   { border-width: 1px; }
.border-t { border-top-width: 1px; }
.border-b { border-bottom-width: 1px; }
.border-white\/5  { border-color: rgba(255,255,255,0.05); }
.border-white\/10 { border-color: rgba(255,255,255,0.1); }
.border-white\/20 { border-color: rgba(255,255,255,0.2); }
.border-gold\/30  { border-color: rgba(255,200,91,0.3); }
.border-gold\/40  { border-color: rgba(255,200,91,0.4); }
.rounded-full    { border-radius: 9999px; }
.rounded-xl      { border-radius: 0.75rem; }
.rounded-2xl     { border-radius: 1rem; }
.rounded-3xl     { border-radius: 1.5rem; }
.rounded-\[32px\] { border-radius: 32px; }

/* object fit, display */
.object-cover   { object-fit: cover; }
.object-contain { object-fit: contain; }
.object-top     { object-position: top; }
.hidden       { display: none; }
.block        { display: block; }
.inline-block { display: inline-block; }

/* transitions, transforms, filters */
.transition-colors    { transition-property: color, background-color, border-color; transition-duration: 150ms; }
.transition-transform { transition-property: transform; transition-duration: 150ms; }
.transition-all       { transition-property: all; transition-duration: 150ms; }
.transition-opacity   { transition-property: opacity; transition-duration: 150ms; }
.duration-500         { transition-duration: 500ms; }
.scale-105  { transform: scale(1.05); }
.rotate-180 { transform: rotate(180deg); }
.grayscale        { filter: grayscale(100%); }
.grayscale-0      { filter: grayscale(0); }
.backdrop-blur-sm { backdrop-filter: blur(4px); }
.backdrop-blur-xl { backdrop-filter: blur(24px); }
.opacity-80       { opacity: 0.8; }

/* glass */
.glass {
  background: rgba(255,255,255,0.03);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,0.08);
}

/* glow border */
.glow-border { position: relative; }
.glow-border::before {
  content: "";
  position: absolute; inset: -2px;
  background: linear-gradient(90deg, #ff9800, #ffc85b, #00d8ff, #ffc85b, #ff9800);
  background-size: 400% 100%;
  border-radius: inherit; z-index: -1;
  animation: borderGlow 3s ease infinite;
  filter: blur(4px); opacity: 0.5;
}

/* noise overlay */
.noise-overlay::before {
  content: "";
  position: absolute; inset: 0; opacity: 0.03;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
  pointer-events: none; z-index: 0;
}

/* hover states */
.hover\:bg-white\/5:hover       { background-color: rgba(255,255,255,0.05); }
.hover\:bg-white\/10:hover      { background-color: rgba(255,255,255,0.1); }
.hover\:bg-gold\/20:hover       { background-color: rgba(255,200,91,0.2); }
.hover\:border-gold\/30:hover   { border-color: rgba(255,200,91,0.3); }
.hover\:border-gold\/40:hover   { border-color: rgba(255,200,91,0.4); }
.hover\:text-white:hover        { color: #ffffff; }
.hover\:text-gold:hover         { color: var(--gold); }
.hover\:opacity-100:hover       { opacity: 1; }
.hover\:scale-110:hover         { transform: scale(1.1); }

/* shadows */
.shadow-glow-gold { box-shadow: 0 0 30px rgba(255,200,91,0.4); }
.shadow-lg { box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05); }
.shadow-gold\/30 { box-shadow: 0 10px 15px -3px rgba(255,200,91,0.3); }
.stage-orange { box-shadow: 0 20px 46px rgba(255,122,24,0.18); }
.stage-red    { box-shadow: 0 20px 46px rgba(255,79,109,0.18); }
.stage-steel  { box-shadow: 0 20px 46px rgba(90,120,170,0.18); }
.stage-gold   { box-shadow: 0 20px 46px rgba(255,200,91,0.2); }
.image-frame-gold { border-radius: 20px; box-shadow: 0 0 0 1px rgba(245,193,93,0.65), 0 0 18px rgba(245,193,93,0.22), 0 0 40px rgba(245,193,93,0.12); }

/* shimmer effects */
.shimmer { position: relative; overflow: hidden; }
.shimmer::after {
  content: ""; position: absolute; top: 0; left: -150%; width: 150%; height: 100%; z-index: 2; pointer-events: none;
  background: linear-gradient(120deg, rgba(255,255,255,0) 30%, rgba(255,255,255,0.6) 50%, rgba(255,255,255,0) 70%);
  animation: shimmerMove 3s ease-in-out infinite;
}
.card-shimmer-overlay {
  position: absolute; inset: 0; z-index: 2; pointer-events: none;
  background: linear-gradient(120deg, transparent 30%, rgba(255,255,255,0.07) 50%, transparent 70%);
  background-size: 200% 100%;
  animation: shimmerSlideGlobal 2.5s ease-in-out infinite;
  opacity: 0.55;
}
.shimmer-card::after {
  content: ""; position: absolute; top: 0; left: -150%; width: 60%; height: 100%;
  background: linear-gradient(120deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.25) 50%, rgba(255,255,255,0) 100%);
  transform: skewX(-20deg); animation: shimmer 3s infinite;
}
.real-opportunity-shimmer {
  position: relative; display: inline-block;
  background: linear-gradient(90deg, #c9962f 0%, #f5c15d 20%, #fff2b3 35%, #f5c15d 50%, #d4a94f 70%, #f5c15d 100%);
  background-size: 220% auto; -webkit-background-clip: text; background-clip: text; color: transparent;
  animation: realOpportunityShimmer 3.2s linear infinite;
}

/* ── PAGE TOP BAR ───────────────────────────────────────────────────── */
.page-top-bar {
  position: fixed;
  top: 0; left: 0;
  width: 100%;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 15px 30px;
  background: #000000;
  pointer-events: none;
}

.page-top-bar .back-home-btn,
.page-top-bar #topbar-menu-btn,
.page-top-bar #mobile-menu-btn {
  align-self: center;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  transform: none !important;
}

.page-top-bar .back-home-btn {
  display: flex;
  align-items: center;
}

.page-top-bar #topbar-menu-btn,
.page-top-bar #mobile-menu-btn {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  bottom: auto !important;
}

.page-top-bar .back-home-btn,
.page-top-bar #topbar-menu-btn,
.page-top-bar #mobile-menu-btn {
  align-self: center;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  transform: none !important;
}

.page-top-bar .back-home-btn {
  display: flex;
  align-items: center;
}

.page-top-bar #topbar-menu-btn,
.page-top-bar #mobile-menu-btn {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  bottom: auto !important;
  translate: none !important;
}

.back-home-btn {
  pointer-events: auto;
  height: 48px;
  width: auto;
  display: block;
  flex-shrink: 0;
}
.back-home-btn img { height: 100%; width: auto; display: block; }

/* ── PAGE HEADER BASE ───────────────────────────────────────────────── */
.why-header,
.live-header,
.destination-header,
.previous-header,
.agency-header,
.host-header,
.pm-header {
  pointer-events: none;
  position: relative;
  overflow: hidden;
}
.why-header img,
.live-header img,
.destination-header img,
.previous-header img,
.agency-header img,
.host-header img,
.pm-header img {
  width: 100%;
  display: block;
}
.why-header         { max-width: 140px; }

/* ── WHY SECTION TITLE IMAGE ────────────────────────────────────────── */
.why-title-img {
  position: relative;
  display: block;
  width: 70%;
  margin-top: 23px;
  border-radius: 14px;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
  mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
}
.why-title-img img {
  width: 100%;
  height: auto;
  display: block;
}
img[src*="icon.webp"] {
  -webkit-mask-image: radial-gradient(circle, rgba(0,0,0,1) 72%, rgba(0,0,0,0) 100%);
  mask-image: radial-gradient(circle, rgba(0,0,0,1) 72%, rgba(0,0,0,0) 100%);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: cover;
  mask-size: cover;
  filter: contrast(1.05) brightness(1.02);
}
.why-title-img::after {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 60%; height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255,215,0,0.35), transparent);
  will-change: transform;
  animation: shimmerSweep var(--shimmer-speed) linear infinite;
  pointer-events: none;
  z-index: 2;
}

.why-hero-section {
  padding-top: 0 !important;
}

.why-hero-divider-top {
  margin-bottom: 0 !important;
}

.why-hero-title {
  margin-top: 0 !important;
  width: 100vw !important;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 0 !important;
  overflow: hidden;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

.why-hero-divider-bottom {
  margin-top: 0 !important;
  margin-bottom: 6px !important;
}

.agency-talent-divider {
  margin-top: 0 !important;
}

.live-header        { max-width: 360px; }
.destination-header { max-width: 320px; }
.previous-header    { max-width: 320px; }
.agency-header      { max-width: 340px; }
.host-header        { max-width: 360px; }
.pm-header          { max-width: 380px; }

/* ── UNIFIED HEADER SHIMMER (gold, synced, no stagger) ─────────────── */
.why-header::after,
.live-header::after,
.destination-header::after,
.previous-header::after,
.agency-header::after,
.host-header::after,
.pm-header::after {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 60%; height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255,215,0,0.35), transparent);
  will-change: transform;
  animation: shimmerSweep var(--shimmer-speed) linear infinite;
  animation-delay: 0s;
  pointer-events: none;
  z-index: 2;
}

/* cinematic card, group hover */
.cinematic-card { transition: transform 0.4s ease, box-shadow 0.4s ease; }
@media (hover: hover) {
  .cinematic-card:hover { transform: translateY(-6px) scale(1.01); box-shadow: 0 34px 90px rgba(0,0,0,0.5), 0 0 36px rgba(255,170,0,0.12); }
  .group:hover .group-hover\:grayscale-0  { filter: grayscale(0); }
  .group:hover .group-hover\:scale-105    { transform: scale(1.05); }
  .group:hover .group-hover\:bg-gold\/20 { background-color: rgba(255,200,91,0.2); }
}

/* icons */
.icon    { width: 1.25rem; height: 1.25rem; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; fill: none; }
.icon-sm { width: 1rem; height: 1rem; }
.icon-lg { width: 1.5rem; height: 1.5rem; }
.icon-xl { width: 2rem; height: 2rem; }

/* player borders */
.player-top-1 { border-color: rgba(255,200,91,0.4); box-shadow: 0 24px 56px rgba(0,0,0,0.32), 0 0 30px rgba(255,200,91,0.15); }
.player-top-2 { border-color: rgba(0,216,255,0.4);  box-shadow: 0 24px 56px rgba(0,0,0,0.32), 0 0 30px rgba(0,216,255,0.15); }
.player-top-3 { border-color: rgba(255,80,160,0.4); box-shadow: 0 24px 56px rgba(0,0,0,0.32), 0 0 30px rgba(255,80,160,0.15); }

/* nfl films */
.nfl-films-img        { filter: brightness(1.10) contrast(1.18) saturate(1.12); image-rendering: -webkit-optimize-contrast; }
.nfl-films-grain      { background-image: radial-gradient(rgba(255,255,255,0.045) 0.6px, transparent 0.8px), radial-gradient(rgba(0,0,0,0.06) 0.6px, transparent 0.8px); background-position: 0 0, 1px 1px; background-size: 4px 4px, 5px 5px; mix-blend-mode: soft-light; opacity: 0.35; }
.nfl-films-vignette   { background: radial-gradient(circle at center, transparent 48%, rgba(0,0,0,0.18) 100%); }
.nfl-films-toplight   { background: linear-gradient(to bottom, rgba(255,255,255,0.14), rgba(255,255,255,0.04) 24%, transparent 45%); }
.nfl-films-bottomlift { background: linear-gradient(to top, rgba(255,255,255,0.08), transparent 28%); }

/* autofill */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 1000px #1a1a2e inset !important;
  -webkit-text-fill-color: #ffffff !important;
  caret-color: #ffffff !important;
  transition: background-color 9999s ease-in-out 0s !important;
}

/* ============================================================
   6. BUTTONS & CTAs
   ============================================================ */
.btn-gold {
  background: linear-gradient(90deg, #ff9800, #ffc85b);
  color: #080a0f;
  box-shadow: 0 14px 30px rgba(255,166,0,0.28);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
@media (hover: hover) {
  .btn-gold:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 40px rgba(255,166,0,0.4);
  }
}

.kai-gold-btn {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 7px 28px; width: 100%; max-width: 376px;
  position: relative; overflow: hidden; text-decoration: none;
  font-family: 'Bebas Neue', Arial, sans-serif; font-size: 20px;
  letter-spacing: 2px; text-transform: uppercase; color: #0b0b0b;
  border-radius: 8px;
  background: linear-gradient(135deg, #ffe27a 0%, #f5b72a 25%, #d99000 60%, #b87800 100%);
  box-shadow: 0 0 0 1px rgba(255,215,120,0.9) inset, 0 2px 4px rgba(255,240,180,0.7) inset, 0 -4px 8px rgba(0,0,0,0.4) inset, 0 12px 24px rgba(0,0,0,0.5);
  transition: all 0.25s ease;
}
.kai-gold-btn::after {
  content: ""; position: absolute; inset: 0; border-radius: 10px;
  border: 1px solid rgba(255,230,150,0.6); box-shadow: 0 0 6px rgba(255,200,50,0.6); pointer-events: none;
}
.kai-gold-btn::before {
  content: ""; position: absolute; top: 0; left: -40%; width: 60%; height: 100%;
  background: linear-gradient(120deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.25) 40%, rgba(255,255,255,0.7) 50%, rgba(255,255,255,0.2) 60%, rgba(255,255,255,0) 100%);
  transform: skewX(-25deg);
}
.kai-gold-btn:hover {
  transform: translateY(-3px) scale(1.02);
  background: linear-gradient(135deg, #fff1a6 0%, #ffc94d 25%, #f2a100 60%, #c98500 100%);
  box-shadow: 0 0 0 1px rgba(255,215,120,1) inset, 0 2px 4px rgba(255,240,180,0.8) inset, 0 -4px 8px rgba(0,0,0,0.5) inset, 0 16px 30px rgba(0,0,0,0.6);
}
.kai-gold-btn:active {
  transform: translateY(1px) scale(0.98);
  box-shadow: 0 0 0 1px rgba(255,215,120,0.8) inset, 0 2px 3px rgba(255,240,180,0.5) inset, 0 -2px 4px rgba(0,0,0,0.3) inset, 0 6px 12px rgba(0,0,0,0.4);
}

.elite-cta {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 52px; padding: 0 28px; border-radius: 999px;
  font-weight: 800; font-size: 15px; text-decoration: none;
  transition: all 0.3s ease; white-space: nowrap;
}
.elite-cta:hover { transform: translateY(-1px) scale(1.02); }
.elite-cta-dark {
  color: #fff; background: rgba(0,0,0,0.78);
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 10px 30px rgba(0,0,0,0.28);
}
.elite-cta-gold {
  color: #000;
  background: linear-gradient(135deg, #ffb300, #ffd86b);
  box-shadow: 0 8px 26px rgba(255,183,0,0.35), 0 0 18px rgba(255,183,0,0.18);
}

.round-btn {
  position: relative; display: inline-block;
  padding: 12px 26px; border-radius: 999px; overflow: hidden;
  text-decoration: none; font-weight: 700; letter-spacing: 0.5px;
  background: linear-gradient(90deg, #FFD700, #00AEEF); color: #000;
  box-shadow: 0 0 12px rgba(255,215,0,0.9), 0 0 25px rgba(0,174,239,0.8);
  transition: all 0.3s ease; animation: pulseGlow 2.5s infinite alternate;
}
.round-btn span { position: relative; z-index: 2; }
.round-btn::before {
  content: ""; position: absolute; top: 0; left: -120%; width: 120%; height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,0.6), transparent);
  transform: skewX(-20deg);
}
.round-btn:hover::before { animation: shimmer 0.8s ease forwards; }
.round-btn:hover { transform: scale(1.08); }
.crown-btn {
  background: linear-gradient(90deg, #FFD700, #8A2BE2);
  box-shadow: 0 0 15px rgba(255,215,0,1), 0 0 35px rgba(138,43,226,0.9);
}

.cta-enhanced { display: inline-flex; align-items: center; gap: 6px; flex-wrap: nowrap; }
.cta-icon-inline {
  width: 22px; height: 22px; object-fit: contain; flex: 0 0 22px;
  filter: drop-shadow(0 0 4px rgba(245,193,93,0.35));
}
.cta-text-inline { display: inline-flex; flex-direction: column; gap: 1px; line-height: 1; }
.cta-text-inline > span {
  font-family: 'Barlow Condensed', sans-serif; font-size: 12px;
  letter-spacing: 3px; color: var(--gold); text-transform: uppercase;
}
.cta-text-inline small { font-size: 9px; letter-spacing: 1.6px; text-transform: uppercase; color: rgba(255,255,255,0.55); }
.prize-card:hover .cta-enhanced .cta-icon-inline:last-child { transform: translateX(4px); transition: transform 0.18s ease; }

.cta-img-wrap { display: block; text-align: center; }
.cta-img { display: block; width: 100%; height: auto; margin: 0 auto; filter: brightness(1.15) contrast(1.05); }
.full-row .cta-img { width: auto; max-height: 130px; margin: 0; }
.full-row .cta-img-wrap { text-align: left; }

.hero-cta-row { position: relative; z-index: 40; margin-bottom: 36px; }
.hero-cta-row a, .hero-cta-row .btn-gold { position: relative; z-index: 41; }

/* stage card CTA */
.stage-card-shell { display: block; }
.stage-card-cta-wrap {
  padding: 0.9rem 1rem 1.05rem;
  background: linear-gradient(180deg, rgba(7,10,18,0.96), rgba(13,18,34,0.98));
  border-top: 1px solid rgba(255,255,255,0.06);
}
.stage-card-cta {
  position: relative; display: flex; align-items: center; justify-content: center;
  width: 100%; min-height: 56px; padding: 0.9rem 1.2rem; border-radius: 16px;
  overflow: hidden; text-decoration: none; text-transform: uppercase;
  letter-spacing: 0.12em; font-weight: 800; font-size: clamp(0.9rem, 1.35vw, 1rem);
  color: #ffffff;
  background: linear-gradient(90deg, rgba(0,174,239,0.96) 0%, rgba(27,103,255,0.98) 55%, rgba(0,174,239,0.96) 100%);
  border: 1px solid rgba(255,255,255,0.18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.18), 0 0 18px rgba(0,174,239,0.42), 0 0 36px rgba(0,174,239,0.18);
  transition: transform 0.28s ease, box-shadow 0.28s ease, filter 0.28s ease;
}
.stage-card-cta::before {
  content: ""; position: absolute; top: 0; left: -135%; width: 85%; height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,0.65), transparent);
  transform: skewX(-20deg);
}
.stage-card-cta::after {
  content: ""; position: absolute; inset: 1px; border-radius: 15px;
  pointer-events: none; box-shadow: inset 0 0 0 1px rgba(255,255,255,0.08);
}
.group:hover .stage-card-cta::before, .stage-card-cta:hover::before { animation: stageCtaSweep 0.8s ease forwards; }
.group:hover .stage-card-cta, .stage-card-cta:hover {
  transform: translateY(-2px) scale(1.01);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.24), 0 0 22px rgba(0,174,239,0.58), 0 0 44px rgba(0,174,239,0.24);
  filter: brightness(1.05);
}
.stage-card-cta-label { position: relative; z-index: 1; }

/* coming soon */
.coming-soon-card { position: relative; }
.coming-soon-img { filter: grayscale(100%) brightness(0.72); transition: filter 0.45s ease; }
@media (hover: hover) { .coming-soon-card:hover .coming-soon-img { filter: grayscale(0%) brightness(1); } }
.cs-overlay {
  position: absolute; inset: 0; pointer-events: none;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 16px 16px 7px;
}
.cs-prize-badge {
  display: inline-flex; flex-direction: column; align-items: center;
  background: linear-gradient(135deg, #c9541a, #e8820a);
  border: 2px solid #f5a623; border-radius: 10px; padding: 4px 10px 6px;
  width: fit-content; box-shadow: 0 2px 12px rgba(232,130,10,0.55);
}
.cs-prize-label { font-family: 'Barlow Condensed', sans-serif; font-size: 10px; font-weight: 700; letter-spacing: 3px; color: #fff; text-transform: uppercase; line-height: 1; }
.cs-prize-amount { font-family: 'Bebas Neue', sans-serif; font-size: 26px; color: #fff; line-height: 1; letter-spacing: 1px; }
.cs-bottom { display: flex; flex-direction: column; align-items: center; gap: 2px; padding-bottom: 6px; }
.cs-coming-soon { font-family: 'Barlow Condensed', sans-serif; font-size: 11px; letter-spacing: 4px; color: #f5c15d; text-transform: uppercase; font-weight: 600; }
.cs-title { font-family: 'Bebas Neue', sans-serif; font-size: 34px; color: #fff; letter-spacing: 2px; line-height: 1; text-align: center; text-shadow: 0 0 18px rgba(232,130,10,0.7), 0 2px 8px rgba(0,0,0,0.8); }

/* ============================================================
   7. NAVIGATION & HEADER
   ============================================================ */
#site-header, .navbar, header {
  background: transparent !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
  border: none !important;
}

#site-header > div,
.page-top-bar,
.mobile-page-topbar,
header.page-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

#site-header > div > a[href="index.html"],
#site-header > div > #mobile-menu-btn,
#site-header > div > #topbar-menu-btn {
  align-self: center;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  transform: none !important;
}

#site-header > div > a[href="index.html"] {
  display: flex;
  align-items: center;
}

#site-header > div > #mobile-menu-btn,
#site-header > div > #topbar-menu-btn {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  bottom: auto !important;
  translate: none !important;
}

header {
  background: transparent;
  backdrop-filter: none;
}
.navbar {
  width: 100%;
  padding-top: 12px;
  transition: transform 0.35s ease, opacity 0.35s ease, padding-top 0.45s ease;
}
.navbar::before { content: none; }
.navbar.hidden { transform: translateY(-110%); opacity: 0; }
.nav-inner {
  position: relative; z-index: 2; width: 100%; min-height: 88px;
  transition: min-height 0.35s ease, gap 0.35s ease;
}
.nav-logo-wrap { min-width: 200px; }
.nav-logo-img {
  height: 108px !important; width: auto; display: block;
  filter: drop-shadow(0 10px 24px rgba(0,0,0,0.55));
  transition: height 0.35s ease, transform 0.35s ease;
}
.nav-pill-wrap {
  padding: 10px 18px;
  background: linear-gradient(to right, rgba(255,255,255,0.03), rgba(255,255,255,0.08), rgba(255,255,255,0.03));
  border: 1px solid rgba(255,255,255,0.07);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 10px 35px rgba(0,0,0,0.3);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
}
.nav-pill-btn {
  display: inline-flex; align-items: center; gap: 8px; padding: 14px 22px;
  border-radius: 999px; background: rgba(0,0,0,0.82) !important;
  color: rgba(255,255,255,0.95); font-weight: 700; font-size: 15px;
  border: 1px solid rgba(255,255,255,0.04) !important; outline: none !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04), 0 0 0 rgba(255,215,0,0);
  transition: all 0.3s ease; white-space: nowrap;
  appearance: none !important; -webkit-appearance: none !important;
}
.nav-pill-btn:hover {
  transform: translateY(-1px); background: rgba(10,10,10,0.95) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 0 20px rgba(255,190,0,0.1);
}
.nav-dropdown {
  position: absolute; top: 100%; left: 0; margin-top: 0.5rem;
  min-width: 200px;
  background: linear-gradient(to right, rgba(255,215,0,0.06), transparent 24%, transparent 76%, rgba(255,174,0,0.06)), rgba(7,11,20,0.94);
  backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  border: 1px solid rgba(255,255,255,0.08); border-radius: 1rem; padding: 0.5rem;
  box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);
  opacity: 0; visibility: hidden; transform: translateY(10px); transition: all 0.2s ease;
}
.nav-item:hover .nav-dropdown { opacity: 1; visibility: visible; transform: translateY(0); }
.nav-item { position: relative; }

.navbar.compact { padding-top: 6px; }
.navbar.compact .nav-inner { min-height: 72px; }
.navbar.compact .nav-logo-img { height: 82px !important; transform: none; }
.navbar.compact .nav-pill-wrap { padding: 8px 14px; }
.navbar.compact .nav-pill-btn { padding: 12px 18px; font-size: 14px; }

/* ============================================================
   8. MOBILE MENU — SLIDE-IN PANEL
   ============================================================ */
#mobile-menu {
  position: fixed !important;
  top: 88px !important;
  right: 18px !important;
  left: auto !important;
  bottom: auto !important;
  inset: auto !important;
  width: min(360px, calc(100vw - 36px)) !important;
  max-height: calc(100vh - 112px) !important;
  z-index: 10001 !important;
  display: block !important;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  overflow-y: auto !important;
  background: linear-gradient(180deg, rgba(10,14,24,0.98) 0%, rgba(4,7,14,0.98) 100%) !important;
  border: 1px solid rgba(245,193,93,0.22) !important;
  border-radius: 18px !important;
  box-shadow: 0 28px 80px rgba(0,0,0,0.72) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  backdrop-filter: blur(24px) !important;
  transform: translate3d(24px, 0, 0);
  transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s ease;
}
.mobile-menu.is-open,
#mobile-menu.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate3d(0, 0, 0);
}
.mobile-menu-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: rgba(0,0,0,0.68);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}
.mobile-menu-overlay.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
#mobile-menu-btn,
#topbar-menu-btn {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: rgba(0,0,0,0.45);
  border: 1px solid rgba(245,193,93,0.35);
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease;
  flex-shrink: 0;
  position: fixed;
  top: 18px;
  right: 18px;
  left: auto;
  bottom: auto;
  z-index: 10003 !important;
  pointer-events: auto !important;
}
.mobile-menu-inner {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100%;
  min-height: 0;
  position: relative;
}
#mobile-menu .mobile-menu-inner {
  padding: 74px 20px 20px !important;
  gap: 12px !important;
}
.mobile-menu-close {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 2;
  width: 46px;
  height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(245,193,93,0.22);
  border-radius: 999px;
  background: rgba(11,16,28,0.88);
  color: #f5c15d;
  font-size: 1.65rem;
  line-height: 1;
  cursor: pointer;
  transition: background 0.2s ease, transform 0.2s ease, border-color 0.2s ease;
}
.mobile-menu-close:hover,
.mobile-menu-close:focus-visible {
  background: rgba(255,255,255,0.08);
  border-color: rgba(245,193,93,0.45);
  transform: scale(1.04);
}
.mm-action-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  align-items: stretch;
}
.mm-link {
  display: block;
  padding: 0.72rem 0.1rem;
  color: rgba(255,255,255,0.78);
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: 0.01em;
  text-decoration: none;
  border-radius: 10px;
  transition: color 0.2s ease, background 0.2s ease, transform 0.2s ease;
}
.mm-link:hover,
.mm-link:active,
.mm-link:focus-visible {
  color: #f5c15d;
  background: rgba(255,255,255,0.03);
  transform: translateX(2px);
}
.mm-divider {
  height: 1px;
  background: linear-gradient(to right, rgba(245,193,93,0.5), transparent);
  flex-shrink: 0;
  margin: 4px 0;
}
.mm-cta-primary {
  display: block; width: 100%; text-align: center; padding: 16px 24px;
  background: linear-gradient(to bottom,#FFD700 0%,#F5A800 30%,#E8850A 70%,#FF6B00 100%);
  color: #030303; font-weight: 800; font-size: 15px; letter-spacing: 0.14em;
  text-transform: uppercase; text-decoration: none; border-radius: 12px;
  margin-bottom: 0; box-sizing: border-box;
}
.mm-cta-secondary {
  display: block; width: 100%; text-align: center; padding: 14px 24px;
  background: transparent; border: 1.5px solid rgba(245,193,93,0.5);
  color: #f5c15d; font-weight: 700; font-size: 15px; letter-spacing: 0.1em;
  text-transform: uppercase; text-decoration: none; border-radius: 12px;
  box-sizing: border-box;
}
.mm-label {
  display: block;
  color: #f5c15d;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  pointer-events: none;
  cursor: default;
  user-select: none;
  margin-top: 2px;
  padding-top: 4px;
}
.mobile-nav-sections {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.mobile-nav-section {
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 14px;
  background: rgba(255,255,255,0.02);
  overflow: hidden;
}
#mobile-menu .mobile-nav-toggle {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 0;
  cursor: pointer;
  text-align: left;
  font-family: 'Barlow', sans-serif;
  font-weight: 700;
  letter-spacing: 0.04em;
}
#mobile-menu .mobile-nav-toggle .chevron-icon {
  width: 16px;
  height: 16px;
  display: block;
  flex-shrink: 0;
  transition: transform 0.2s ease;
}
#mobile-menu .mobile-nav-panel {
  display: none;
  padding: 0 14px 12px 14px;
}
#mobile-menu .mobile-nav-panel a {
  display: block;
  padding: 10px 14px;
  border-radius: 10px;
}
#mobile-menu a[href="index.html#sponsor-section"],
#mobile-menu a[href="#sponsor-section"] {
  display: block;
  margin-bottom: 5px;
}
@media (max-width: 720px) {
  #mobile-menu {
    top: 82px !important;
    right: 12px !important;
    width: min(360px, calc(100vw - 24px)) !important;
    max-height: calc(100vh - 96px) !important;
  }
  #mobile-menu .mobile-menu-inner {
    padding: 66px 16px 16px !important;
  }
  .mobile-menu-close {
    top: 12px;
    right: 12px;
    width: 44px;
    height: 44px;
  }
}
#site-map {
  background: #000;
  padding: 60px 20px;
  scroll-margin-top: 110px;
}

#site-map .site-map-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 30px;
}

#site-map .site-map-title {
  display: block;
  color: var(--gold);
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  margin-bottom: 1.5rem;
}

#site-map h3 {
  color: #ffffff;
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.5rem;
  line-height: 1;
  margin-bottom: 0.75rem;
}

#site-map .site-map-link {
  display: block;
  color: rgba(255, 255, 255, 0.7);
  margin-bottom: 0.5rem;
  transition: color 0.2s ease;
}

#site-map .site-map-link:hover,
#site-map .site-map-link:focus-visible {
  color: var(--gold);
}

#site-map .site-map-cta {
  margin-top: 40px;
  text-align: center;
}

@media (min-width: 768px) {
  #site-map .site-map-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

#mobile-menu {
  /* Full-screen overlay already defined above */
}
#mobile-menu .px-4.py-4 { padding: 12px !important; }
#mobile-menu .mobile-nav-toggle {
  color: #ffffff !important; background: transparent !important;
  font-size: 14px !important; padding: 10px 14px !important; border-radius: 10px !important;
}
#mobile-menu .mobile-nav-toggle:hover { background: rgba(245,193,93,0.08) !important; }
#mobile-menu .mobile-nav-toggle.nav-gold { color: #f5c15d !important; }
#mobile-menu a { color: rgba(255,255,255,0.78); font-size: 13px; }
#mobile-menu a:hover { color: #f5c15d !important; }
#mobile-menu .elite-cta-dark {
  background: rgba(255,255,255,0.05) !important; border: 1px solid rgba(255,255,255,0.12) !important;
  color: #ffffff !important; text-align: center !important; font-size: 13px !important; padding: 10px 14px !important;
}
#mobile-menu .elite-cta-gold {
  background: #f5c15d !important; color: #000000 !important; text-align: center !important;
  font-size: 13px !important; font-weight: 700 !important; padding: 10px 14px !important; border-radius: 999px !important;
}

#mobile-menu-btn:hover { background: rgba(245,193,93,0.15); border-color: rgba(245,193,93,0.6); }

#site-header,
#mobile-menu-btn,
#topbar-menu-btn {
  z-index: 10003 !important;
}

#mobile-menu {
  z-index: 10004 !important;
}

.mobile-menu-overlay {
  z-index: 10002 !important;
}

@media (max-width: 480px) {
  .mm-action-row {
    grid-template-columns: 1fr;
  }
}

/* ============================================================
   9. HERO & VIDEO
   ============================================================ */
.hero {
  min-height: 100vh; display: flex; flex-direction: column;
  align-items: center; justify-content: center; text-align: center;
  padding: 60px 20px; position: relative;
  background: radial-gradient(ellipse at 50% 0%, rgba(180,130,30,0.18) 0%, transparent 70%),
              radial-gradient(ellipse at 80% 80%, rgba(20,50,120,0.12) 0%, transparent 60%),
              var(--bg);
  overflow: hidden;
}
.hero::before {
  content: '';
  position: absolute; inset: 0;
  background: repeating-linear-gradient(0deg, transparent, transparent 80px, rgba(245,193,93,0.03) 80px, rgba(245,193,93,0.03) 81px),
    repeating-linear-gradient(90deg, transparent, transparent 80px, rgba(245,193,93,0.03) 80px, rgba(245,193,93,0.03) 81px);
}
.hero-eyebrow {
  font-family: 'Barlow Condensed', sans-serif; font-weight: 600; font-size: 13px;
  letter-spacing: 6px; color: var(--gold); text-transform: uppercase;
  margin-bottom: 20px; opacity: 0; animation: fadeUp 0.8s 0.2s forwards;
}
.hero-title {
  font-family: 'Bebas Neue', sans-serif; font-size: clamp(64px, 12vw, 140px);
  line-height: 0.9; color: #fff; letter-spacing: 2px; margin-bottom: 10px;
  opacity: 0; animation: fadeUp 0.8s 0.4s forwards;
}
.hero-title span {
  display: block;
  background: linear-gradient(135deg, var(--gold-bright) 0%, var(--gold) 50%, var(--gold-dark) 100%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  filter: drop-shadow(0 0 40px rgba(245,193,93,0.4));
}
.hero-sub {
  font-family: 'Barlow Condensed', sans-serif; font-size: clamp(16px, 3vw, 24px);
  font-weight: 400; color: var(--text-muted); letter-spacing: 2px;
  margin-top: 20px; opacity: 0; animation: fadeUp 0.8s 0.6s forwards;
}
.hero-divider {
  width: 80px; height: 2px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  margin: 30px auto; opacity: 0; animation: fadeUp 0.8s 0.8s forwards;
}
.scroll-hint {
  position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  opacity: 0; animation: fadeUp 1s 1.2s forwards;
}
.scroll-hint span { font-size: 10px; letter-spacing: 4px; color: var(--text-muted); text-transform: uppercase; }
.scroll-arrow {
  width: 20px; height: 20px;
  border-right: 2px solid var(--gold); border-bottom: 2px solid var(--gold);
  transform: rotate(45deg); animation: bounce 1.5s infinite;
}

/* hero section/gradient */
.hero-gradient {
  background:
    linear-gradient(90deg, rgba(3,6,11,0.85) 0%, rgba(3,6,11,0.5) 40%, rgba(3,6,11,0.2) 70%, rgba(3,6,11,0.4) 100%),
    linear-gradient(180deg, rgba(3,6,11,0.1) 0%, rgba(3,6,11,0.6) 100%);
}
.hero-section.short-hero { position: relative; overflow: hidden; min-height: 340px; }
.hero-media { position: absolute; inset: 0; overflow: hidden; background: #060912; display: flex; align-items: center; justify-content: center; }
.festival-hero-img {
  width: 100%; height: 100%; object-fit: contain !important; object-position: center center !important;
  position: relative; z-index: 2; transform: scale(1) !important;
  filter: brightness(1.05) contrast(1.08) saturate(1.04);
}
.hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to right, rgba(6,9,18,0.85), rgba(6,9,18,0.42), transparent), linear-gradient(to top, rgba(6,9,18,0.35), transparent);
  opacity: 0; animation: overlayReveal 1.2s ease-out forwards;
}
.hero-media::before {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background:
    radial-gradient(circle at center, rgba(245,193,93,0.16), transparent 42%),
    linear-gradient(to right, rgba(6,9,18,0.82), rgba(6,9,18,0.12) 24%, rgba(6,9,18,0.12) 76%, rgba(6,9,18,0.82)),
    linear-gradient(to top, rgba(6,9,18,0.44), transparent 38%),
    linear-gradient(to bottom, rgba(6,9,18,0.30), transparent 32%);
}
.hero-media::after {
  content: ""; position: absolute; top: 0; left: -120%; width: 55%; height: 100%; z-index: 3;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,0.08), transparent);
  transform: skewX(-18deg); animation: lightSweep 8s ease-in-out 2s infinite; pointer-events: none;
}
.hero-content { position: relative; z-index: 2; }
.hero-content .eyebrow, .hero-content h1, .hero-content .hero-actions { opacity: 0; transform: translateY(20px); }
.hero-content .eyebrow  { animation: textReveal 0.8s ease-out 0.25s forwards; }
.hero-content h1        { animation: textReveal 0.95s ease-out 0.45s forwards; }
.hero-content .hero-actions { animation: textReveal 0.9s ease-out 0.75s forwards; }

.hero-main-section { min-height: 140vh; padding-top: 7rem; padding-bottom: 2.75rem; max-width: 100%; margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0; }
.countdown-section-fix { margin-top: 1.25rem; }

/* video hero */
#hero-video {
  position: relative; display: flex; align-items: flex-start;
  isolation: isolate;
  min-height: 100vh;
  min-height: 100svh;
  height: 100vh;
  height: 100svh;
  padding-top: 500px; padding-left: 20px; overflow: hidden;
}
#hero-video video {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%;
  max-width: none; object-fit: cover; object-position: center center; z-index: 0 !important;
  pointer-events: none !important;
}
.hv-vid-mobile  { display: none; }
/* ── MOBILE VIDEO SWAP ─────────────────────────────────────────────── */
@media (max-width: 767px) {
  #hero-video {
    height: 100vh;
    height: 100svh;
    min-height: 100vh;
    min-height: 100svh;
  }
  .hv-vid-mobile   { display: block !important; }
  .hv-vid-desktop  { display: none !important; }
}
#hero-video .hv-content { position: relative; z-index: 2; max-width: 560px; width: 100%; }
#hero-video .hv-meta { display: flex; gap: 10px; width: calc(100% - 105px); margin-top: 0; margin-left: 55px; }
#hero-video .hv-pill {
  flex: 1; height: 48px; padding: 4px 8px; border-radius: 10px;
  background: rgba(7,11,19,0.42); border: 1px solid rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.92) !important; text-transform: uppercase; text-decoration: none !important;
  display: flex; flex-direction: column; justify-content: center; align-items: center;
  transition: 0.2s ease; font-size: 10px; letter-spacing: 0.8px; font-family: "Barlow Condensed", sans-serif;
}
#hero-video .hv-pill:hover { transform: translateY(-2px); border-color: rgba(245,193,93,0.5); }
#hero-video .hv-pill strong { font-family: "Bebas Neue", sans-serif; font-size: 18px; line-height: 1; margin-bottom: 2px; color: #f5c15d; }
#hero-video .hv-pill-2 { background: linear-gradient(to bottom, #1AD4FF 0%, #0099CC 100%) !important; color: #000000 !important; font-weight: 700; border: 1px solid #0077AA !important; font-size: 14px; }
#hero-video .hv-pill-2 strong { position: relative; top: 2px; color: #000000 !important; font-weight: 900; font-size: 22px; }
#hero-video .hv-pill-stroke { border: 1px solid #000 !important; outline: 1px solid #000; }
#hero-video .hv-buttons { margin-top: 10px; }
#hero-video .hv-btn {
  display: block; width: calc(100% - 105px); margin-left: 70px; text-align: center;
  padding: 12px 0; border-radius: 12px; text-decoration: none; text-transform: uppercase;
  font-weight: 700; font-size: 22px; letter-spacing: 2px; color: #030303;
  border: 1px solid #E8850A;
  background: linear-gradient(to bottom, #FFD700 0%, #F5A800 30%, #E8850A 70%, #FF6B00 100%);
}

/* ============================================================
   10. COUNTDOWN
   ============================================================ */
.countdown-section { display: flex; flex-direction: column; align-items: flex-start; text-align: left; }
.countdown-panel {
  position: relative; overflow: hidden; display: flex; justify-content: flex-start;
  align-items: center; gap: 18px; flex-wrap: nowrap;
  background: linear-gradient(135deg, rgba(10,10,18,0.92), rgba(18,14,28,0.88)), rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 20px 60px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.06), 0 0 40px rgba(245,193,93,0.06);
  backdrop-filter: blur(16px);
}
.countdown-panel::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(circle at top center, rgba(245,193,93,0.12), transparent 38%),
    radial-gradient(circle at bottom right, rgba(59,130,246,0.10), transparent 30%);
}
.countdown-box {
  position: relative; text-align: center; padding: 1.25rem 0.75rem; border-radius: 24px;
  background: linear-gradient(180deg, rgba(255,255,255,0.035), rgba(255,255,255,0.015));
  border: 1px solid rgba(255,255,255,0.06);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 10px 30px rgba(0,0,0,0.24);
  transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}
.countdown-box:hover {
  transform: translateY(-4px); border-color: rgba(245,193,93,0.2);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 18px 38px rgba(0,0,0,0.3), 0 0 24px rgba(245,193,93,0.08);
}
.countdown-box .number { font-family: "Bebas Neue", sans-serif; font-size: 3.5rem; color: var(--gold); }
.countdown-box .label { font-size: 0.75rem; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,0.7); margin-top: 0.5rem; }
.number {
  font-family: "Bebas Neue", sans-serif; font-size: clamp(3.4rem, 8vw, 6.8rem);
  line-height: 0.95; letter-spacing: 0.03em; color: #f5c15d;
  text-shadow: 0 0 10px rgba(245,193,93,0.18), 0 0 30px rgba(245,193,93,0.08);
  transform: translateZ(0);
}
.label {
  margin-top: 0.85rem; font-size: clamp(0.68rem, 1.1vw, 0.95rem); font-weight: 700;
  letter-spacing: 0.35em; text-transform: uppercase; color: rgba(255,255,255,0.62);
}
.countdown-panel-fix { display: grid; grid-template-columns: repeat(4, 107px); gap: 5px; max-width: 540px; }
.countdown-box-fix {
  position: relative; width: 107px; min-height: 118px; padding: 0.65rem 0.54rem 0.65rem;
  border-radius: 20px; overflow: hidden; text-align: center; background: #000000;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  border: 2px solid rgba(245,193,93,0.9);
  box-shadow: 0 22px 60px rgba(0,0,0,0.30), inset 0 1px 0 rgba(255,255,255,0.04);
}
.countdown-box-fix::before { display: none; }
.number-fix {
  position: relative; z-index: 1; display: block; margin: 0 0 0.3rem 0; text-align: center;
  font-family: 'Bebas Neue', sans-serif; font-size: clamp(3.21rem, 5.36vw, 5.36rem);
  line-height: 1; letter-spacing: -0.02em; color: #ffffff; text-shadow: none;
}
.label-fix {
  position: relative; z-index: 1; margin-top: 0; font-size: 0.80rem; font-weight: 800;
  color: #f5c15d !important; letter-spacing: 0.16em; text-transform: uppercase; opacity: 0.95; text-align: center;
}
.stat-number { text-shadow: 0 0 10px rgba(245,193,93,0.18); }

/* ============================================================
   11. HOST SECTION
   ============================================================ */
#host {
  margin-top: -65px;
}
#championship-weekend-section {
  margin-top: 10px;
}
#sponsor-section {
  margin-top: 10px;
}
#why-join {
  margin-top: -25px;
}
#distribution {
  margin-top: -40px;
}
#first-strike,
#featured-game {
  margin-top: -95px;
  background:
    radial-gradient(circle at 18% 30%, rgba(245,193,93,0.10), transparent 28%),
    radial-gradient(circle at 75% 25%, rgba(245,193,93,0.05), transparent 30%);
}
.host-wrap { max-width: 1400px; margin: 0 auto; display: grid; gap: 30px; }
.host-image img { width: 100%; height: auto; display: block; border-radius: 20px; }
.host-title {
  font-family: 'Bebas Neue', sans-serif; line-height: 1; margin: 0; padding: 0;
  letter-spacing: -0.01em; text-shadow: 0 0 10px rgba(245,193,93,0.18), 0 0 28px rgba(245,193,93,0.10);
  white-space: nowrap;
}
.host-title span { color: #f5c15d; }
.host-sub { display: none; }
.host-mobile-liveat { display: none; }
.host-mobile-pmlounge {
  display: block;
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(3rem, 6vw, 6rem);
  line-height: 0.9;
  margin-top: 0;
  margin-bottom: 0;
  letter-spacing: -0.01em;
}
.host-exp-mobile-sub {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(2rem, 4vw, 4rem);
  line-height: 0.9;
  margin-top: 0;
  color: #fff;
}
.pm-lounge-brand-line {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  font-size: clamp(1.6rem, 8vw, 6rem);
  vertical-align: middle;
}
.pm-lounge-brand-line img {
  width: 32px !important;
  height: 32px !important;
  flex-shrink: 0;
}
.host-liveat-mobile {
  display: inline;
  color: #ffffff !important;
  font-size: clamp(2rem, 4vw, 4rem);
  vertical-align: middle;
  position: relative;
  top: 8px;
}
.host-exp-text { display: none !important; }
.host-divider {
  width: 96px; height: 2px; margin: 10px 0 18px 0;
  background: linear-gradient(90deg, rgba(245,193,93,1) 0%, rgba(245,193,93,0) 100%);
  box-shadow: 0 0 12px rgba(245,193,93,0.35);
}
.host-text { font-size: 15px; line-height: 1.6; margin-bottom: 15px; color: rgba(255,255,255,0.82); }
.host-btn {
  display: inline-block; padding: 14px 26px;
  background: linear-gradient(180deg, #f5c15d, #c7922f); color: #000;
  font-weight: 600; text-transform: uppercase; letter-spacing: 0.15em; border-radius: 8px; text-decoration: none;
}
.host-btn-mobile-wrap { display: none; }
.host-bg-glow { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, rgba(245,193,93,0.06) 0%, rgba(245,193,93,0) 35%); opacity: 1; }
.host-image-wrap {
  position: relative; border-radius: 24px; overflow: hidden;
  box-shadow: 0 0 0 1px rgba(245,193,93,0.55), 0 0 30px rgba(245,193,93,0.18), 0 0 60px rgba(245,193,93,0.10);
}
.host-image-wrap::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  box-shadow: inset 0 0 40px rgba(245,193,93,0.18); border-radius: 28px;
}
.host-main-image { transform: scale(1.01); }
.host-copy-wrap { max-width: 620px; }
.host-copy { margin-top: 45px; display: flex; flex-direction: column; gap: 0; }
.host-layout .host-promo {
  grid-column: 1 / -1;
  justify-self: start;
  width: min(100%, 1740px);
}
.host-layout .host-main-row {
  grid-column: 1 / -1;
}
.host-layout .host-promo .final-crown-divider-longer,
.host-layout .host-promo .shimmer {
  width: 100% !important;
  max-width: none !important;
}
.host-layout .host-promo .shimmer img {
  width: 100%;
  height: auto;
  -webkit-mask-image: radial-gradient(circle at center, #000 72%, rgba(0,0,0,0.82) 82%, rgba(0,0,0,0.45) 90%, transparent 100%);
  mask-image: radial-gradient(circle at center, #000 72%, rgba(0,0,0,0.82) 82%, rgba(0,0,0,0.45) 90%, transparent 100%);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}
.host-cohosts-inline {
  width: min(100%, 92%);
  margin-left: auto;
  margin-right: auto;
}
.host-cohosts-inline-grid {
  width: 100%;
}
.host-cta {
  box-shadow: 0 0 0 1px rgba(245,193,93,0.7), 0 10px 24px rgba(245,193,93,0.20);
  transition: transform 0.25s ease, box-shadow 0.25s ease, opacity 0.25s ease;
}
.host-cta:hover { transform: translateY(-2px); box-shadow: 0 0 0 1px rgba(245,193,93,1), 0 14px 32px rgba(245,193,93,0.34); }
.host-card { box-shadow: 0 0 0 1px rgba(245,193,93,0.28), 0 0 18px rgba(245,193,93,0.08); transition: transform 0.25s ease, box-shadow 0.25s ease; }
.host-card:hover { transform: translateY(-4px); box-shadow: 0 0 0 1px rgba(245,193,93,0.5), 0 0 28px rgba(245,193,93,0.14); }
#host-layout { display: grid; grid-template-columns: 1fr; gap: 2rem; align-items: center; }
.host-section { padding-top: 4.25rem !important; }
.host-pill-row { row-gap: 0.9rem; }
.host-card-grid { margin-top: 0.5rem; }

/* ============================================================
   12. FEATURED GAME / WHY JOIN
   ============================================================ */
main section.py-24 { padding-top: 4.75rem !important; padding-bottom: 4.75rem !important; }
main .mb-16 { margin-bottom: 2.75rem !important; }
main .glass.rounded-3xl.p-6 { padding: 1.25rem !important; }
main .glass.rounded-2xl.p-4 { padding: 0.875rem !important; }

/* reward cards */
.reward-grid { align-items: stretch; }
.reward-card {
  position: relative; display: block; overflow: hidden; border-radius: 28px;
  border: 1px solid rgba(245,193,93,0.38); background: transparent !important;
  box-shadow: none !important; min-height: 100%; transform: none !important;
}
.reward-card::before, .reward-card::after { content: none !important; display: none !important; }
.reward-card-img {
  display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: center;
  border-radius: 28px; box-shadow: none !important; filter: brightness(1.08) contrast(1.08) saturate(1.05);
}
.reward-card:hover { transform: none !important; box-shadow: none !important; }
#official-game .reward-card { height: 100%; }

/* festival card overflow fix */
#festival .space-y-4 > .glass { overflow: visible; height: auto; }
#festival .pl-4 { position: relative; z-index: 1; }
#festival .btn-gold { white-space: normal; }

/* ============================================================
   13. DISTRIBUTION / STATS
   ============================================================ */
.distribution-scroll-wrapper {
  overflow: hidden; margin-bottom: 1.5rem;
  mask-image: linear-gradient(to right, transparent 0%, black 6%, black 94%, transparent 100%);
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 6%, black 94%, transparent 100%);
}
.distribution-row {
  display: flex; flex-wrap: nowrap; gap: 1rem; width: max-content;
  animation: dist-marquee 22s linear infinite;
  will-change: transform;
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
@media (hover: hover) {
  .distribution-row:hover { animation-play-state: paused; }
}
.distribution-pill { flex: 0 0 220px; min-width: 220px; }
.distribution-pill .text-white.font-semibold.text-sm.mt-1 { font-size: 1.1rem; line-height: 1.15; }
.distribution-pill .text-white\/50.text-xs { font-size: 0.95rem; }
.sponsor-scroll-wrap,
.distribution-scroll-wrapper,
#sponsor-section { overflow: hidden !important; max-width: 100vw !important; }

/* ============================================================
   14. PRIZE & CARDS
   ============================================================ */
.cards-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; width: 100%; align-items: start; }
.cards-grid-heading { grid-column: 1 / -1; padding: 8px 12px 0 12px; }
.cards-grid .full-row { grid-column: 1 / -1 !important; }

.prize-card {
  position: relative; border-radius: 16px; overflow: hidden; cursor: pointer;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  border: 1px solid rgba(245,193,93,0.12); background: var(--bg2);
  display: flex;
  flex-direction: column;
  justify-content: stretch;
  height: 100%;
}
.prize-card:hover { transform: translateY(-6px); box-shadow: 0 20px 60px rgba(245,193,93,0.2); border-color: rgba(245,193,93,0.4); }
.card-img-wrap { overflow: hidden; width: 100%; }
.full-row .card-img-wrap { height: auto; }
.full-row .card-img { height: auto; object-fit: unset; }
.card-img { width: 100%; height: auto; display: block; transition: transform 0.5s ease; }
.card-body { padding: 24px; background: transparent; display: flex; flex-direction: column; justify-content: space-between; flex: 1 1 auto; }
.card-tag { font-family: 'Barlow Condensed', sans-serif; font-size: 10px; letter-spacing: 4px; color: var(--gold); text-transform: uppercase; margin-bottom: 8px; display: block; }
.card-title { font-family: 'Bebas Neue', sans-serif; font-size: 30px; color: #fff; line-height: 1; margin-bottom: 8px; }
.card-sub { font-size: 14px; color: var(--text-muted); line-height: 1.5; margin-bottom: 18px; }
.card-cta { display: inline-flex; align-items: center; gap: 6px; font-family: 'Barlow Condensed', sans-serif; font-size: 12px; letter-spacing: 3px; color: var(--gold); text-transform: uppercase; }
.card-cta::after { content: '→'; display: inline-block; width: 14px; transition: transform 0.18s ease, opacity 0.18s ease; transform: translateX(0); opacity: 1; }
.prize-card:hover .card-cta::after { transform: translateX(6px); }

/* crown section */
.crown-section { width: 100%; max-width: 100%; padding: 0; position: relative; overflow: hidden; }
.crown-inner { position: relative; min-height: 600px; display: flex; align-items: center; }
.crown-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.crown-overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(5,8,16,0.95) 40%, rgba(5,8,16,0.3) 100%); }
.crown-content { position: relative; z-index: 2; padding: 80px 60px; max-width: 600px; }
.crown-prize {
  font-family: 'Bebas Neue', sans-serif; font-size: clamp(60px, 8vw, 100px); line-height: 1;
  background: linear-gradient(135deg, var(--gold-bright), var(--gold));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  filter: drop-shadow(0 0 30px rgba(245,193,93,0.5));
}
.crown-title { font-family: 'Bebas Neue', sans-serif; font-size: clamp(40px, 6vw, 72px); color: #fff; line-height: 1; margin-bottom: 20px; }
.crown-perks { list-style: none; display: flex; flex-direction: column; gap: 14px; margin-top: 30px; }
.crown-perks li { display: flex; align-items: flex-start; gap: 14px; font-size: 15px; color: var(--text); line-height: 1.4; }
.perk-icon { width: 28px; height: 28px; background: rgba(245,193,93,0.15); border: 1px solid rgba(245,193,93,0.3); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 13px; flex-shrink: 0; margin-top: 1px; }
.agency-badge { margin-top: 40px; display: inline-block; padding: 14px 28px; border: 1px solid rgba(245,193,93,0.4); border-radius: 8px; background: rgba(245,193,93,0.06); font-family: 'Barlow Condensed', sans-serif; font-size: 11px; letter-spacing: 3px; color: var(--gold); text-transform: uppercase; }

/* stages */
.stages-row { display: flex; gap: 0; margin-bottom: 60px; overflow-x: hidden; padding-bottom: 10px; }
.stage-pill { display: flex; flex-direction: column; align-items: center; gap: 8px; min-width: 0; flex: 1; position: relative; }
.stage-pill:not(:last-child)::after { content: ''; position: absolute; right: 0; top: 18px; width: 50%; height: 2px; background: linear-gradient(90deg, var(--gold-dark), rgba(245,193,93,0.2)); }
.stage-pill:not(:first-child)::before { content: ''; position: absolute; left: 0; top: 18px; width: 50%; height: 2px; background: linear-gradient(90deg, rgba(245,193,93,0.2), var(--gold-dark)); }
.stage-dot { width: 36px; height: 36px; border-radius: 50%; background: var(--bg2); border: 2px solid var(--gold-dark); display: flex; align-items: center; justify-content: center; font-family: 'Bebas Neue', sans-serif; font-size: 14px; color: var(--gold); position: relative; z-index: 1; transition: all 0.3s; }
.stage-pill:last-child .stage-dot { border-color: var(--gold); background: rgba(245,193,93,0.15); box-shadow: 0 0 20px rgba(245,193,93,0.4); }
.stage-pill .text-gold { letter-spacing: 0.02em !important; font-size: 10px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; display: block; }
.stage-name { font-family: 'Bebas Neue', sans-serif; font-size: 14px; color: #fff; text-align: center; letter-spacing: 1px; }
.stage-sub { font-size: 10px; color: var(--text-muted); text-align: center; letter-spacing: 1px; text-transform: uppercase; }

/* final crown dividers/status */
.final-crown-status-row { display: flex; align-items: center; gap: 0.85rem; flex-wrap: wrap; margin-bottom: 0.7rem; }
.final-crown-status { display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.45rem 0.8rem; border-radius: 999px; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; border: 1px solid rgba(255,255,255,0.12); background: rgba(255,255,255,0.06); color: rgba(255,255,255,0.82); backdrop-filter: blur(10px); }
.final-crown-status.live { color: #f5c15d; background: rgba(245,193,93,0.14); border-color: rgba(245,193,93,0.22); position: relative; overflow: hidden; animation: liveStatusGlow 2.8s ease-in-out infinite alternate; }
.final-crown-status.live::before { content: ""; width: 8px; height: 8px; border-radius: 999px; background: #f5c15d; box-shadow: 0 0 12px rgba(245,193,93,0.55); display: inline-block; }
.final-crown-status.location { color: #7ddcff; background: rgba(0,174,239,0.12); border-color: rgba(0,174,239,0.18); }
.final-crown-divider { width: 72px; height: 3px; border-radius: 999px; margin: 22px 0; background: linear-gradient(90deg, #d59a1d, #ffd36b); box-shadow: 0 0 14px rgba(255,196,80,0.45); }
.final-crown-divider-longer { height: 4px; width: 70%; background: linear-gradient(to right, #f5c15d, transparent); clip-path: polygon(0 0, 100% 40%, 100% 60%, 0 100%); margin-top: 10px; margin-bottom: 5px; }
.final-crown-rail { margin-top: 1.4rem; padding-top: 1.05rem; border-top: 1px solid rgba(255,255,255,0.08); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.85rem; }
.final-crown-rail-item { padding: 0.8rem 0.9rem; border-radius: 18px; background: linear-gradient(180deg, rgba(255,255,255,0.045), rgba(255,255,255,0.025)); border: 1px solid rgba(255,255,255,0.07); box-shadow: inset 0 1px 0 rgba(255,255,255,0.04); }
.final-crown-rail-label { font-size: 0.68rem; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(255,255,255,0.52); font-weight: 800; }
.final-crown-rail-value { margin-top: 0.35rem; color: #fff; font-weight: 800; font-size: 0.98rem; }
.final-crown-subcta { display: inline-flex; align-items: center; gap: 0.55rem; padding: 0.95rem 1.1rem; border-radius: 999px; color: rgba(255,255,255,0.86); background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12); font-weight: 700; transition: all 0.25s ease; min-height: 44px !important; justify-content: center; }
.final-crown-subcta:hover { background: rgba(255,255,255,0.08); border-color: rgba(255,255,255,0.18); transform: translateY(-2px); }
.final-crown-visual-badge { position: absolute; top: 18px; right: 18px; z-index: 4; display: inline-flex; align-items: center; gap: 0.55rem; padding: 0.72rem 1rem; border-radius: 999px; font-size: 0.76rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; color: #f5c15d; background: rgba(10,14,23,0.58); border: 1px solid rgba(245,193,93,0.18); backdrop-filter: blur(12px); box-shadow: 0 12px 30px rgba(0,0,0,0.26); }
.final-crown-visual-badge::before { content: ""; width: 8px; height: 8px; border-radius: 999px; background: #f5c15d; box-shadow: 0 0 12px rgba(245,193,93,0.55); }
.final-crown-date-row { display: inline-flex; align-items: center; gap: 0.9rem; margin-top: 0.75rem; padding: 0.75rem 1rem; border-radius: 999px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); box-shadow: inset 0 1px 0 rgba(255,255,255,0.04); }
.final-crown-date-row .icon { width: 22px; height: 22px; }
.final-crown-prize-badge {
  display: inline-block; padding: 10px 22px; border-radius: 999px;
  font-family: 'Bebas Neue', sans-serif; font-size: 18px; letter-spacing: 1.5px; color: #ffffff;
  background: linear-gradient(180deg, #1b67ff 0%, #1147c7 100%) !important;
  border: 1px solid rgba(255,225,120,0.75) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.12), 0 0 14px rgba(29,110,255,0.35) !important;
  animation: none !important; position: relative; overflow: hidden;
}
.final-crown-prize-badge::after {
  content: ""; position: absolute; top: 0; left: -75%; width: 50%; height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,0.6), transparent);
  transform: skewX(-20deg); animation: shineSweep 3s infinite;
}

/* prize expansion */
.prize-expansion {
  margin-top: 1.4rem; display: inline-flex; flex-direction: column; align-items: flex-start;
  gap: 0.2rem; opacity: 1; transform: none; padding-bottom: 0.7rem; position: relative;
}
.prize-expansion::after {
  content: ""; position: absolute; left: 0; right: -120px; bottom: 0; height: 2px;
  background: linear-gradient(90deg, rgba(255,165,0,0.18), #ffb300, #ffd978, transparent);
  box-shadow: 0 0 14px rgba(255,183,0,0.55);
}
.prize-expansion-label { font-size: clamp(1.35rem, 2vw, 1.9rem); font-weight: 500; letter-spacing: 0; text-transform: none; color: #f6c45a; }
.prize-expansion-value {
  font-family: 'Bebas Neue', sans-serif; font-size: clamp(3.5rem, 8vw, 6rem); line-height: 0.95; letter-spacing: 0.02em;
  background: linear-gradient(90deg, #f5c15d 0%, #fff2b3 22%, #7ddcff 58%, #f5c15d 100%);
  background-size: 220% auto; -webkit-background-clip: text; background-clip: text; color: transparent;
  text-shadow: 0 0 24px rgba(245,193,93,0.25); font-style: normal; font-weight: normal;
}
.prize-expansion-note { display: none; }
.final-chip-size {
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  width: 100% !important; min-width: 0 !important; max-width: none !important;
  height: 44px !important; min-height: 44px !important; max-height: 44px !important;
  padding: 0 18px !important; font-size: 0.98rem !important; font-weight: 700 !important;
  line-height: 1 !important; border-radius: 999px !important; white-space: nowrap !important;
  box-sizing: border-box !important; text-align: center !important; vertical-align: middle !important;
}
.final-chip-size svg.icon { width: 16px !important; height: 16px !important; flex: 0 0 16px !important; }

/* championship venue */
.championship-venue-img { width: 100%; height: auto; object-fit: contain; object-position: center center; display: block; }
#championship-weekend-section, #Championship-Venue { overflow-x: hidden; }
#championship-weekend-section *, #Championship-Venue * { min-width: 0; box-sizing: border-box; }
#Championship-Venue .relative.rounded-3xl.overflow-hidden.glass { width: 100%; max-width: 100%; }
#Championship-Venue img { width: 100%; max-width: 100%; display: block; }

/* prize mobile */
.prize-mobile-hero { display: none !important; }

/* ============================================================
   15. MODALS
   ============================================================ */
.modal-overlay {
  display: none; position: fixed; inset: 0; background: rgba(5,8,16,0.92);
  backdrop-filter: blur(8px); z-index: 9999; justify-content: center;
  align-items: flex-start; padding: 20px; overflow-y: auto;
}
.modal-overlay.active { display: flex; animation: fadeIn 0.25s ease; }
.modal-box { background: var(--bg2); border: 1px solid rgba(245,193,93,0.2); border-radius: 20px; max-width: 540px; width: 100%; overflow: visible; animation: scaleIn 0.3s cubic-bezier(0.34,1.56,0.64,1); margin: auto; }
.modal-img { width: 100%; height: 220px; object-fit: cover; object-position: center top; }
.modal-body { padding: 32px; }
.modal-tag { font-family: 'Barlow Condensed', sans-serif; font-size: 10px; letter-spacing: 4px; color: var(--gold); text-transform: uppercase; display: block; margin-bottom: 8px; }
.modal-title { font-family: 'Bebas Neue', sans-serif; font-size: 40px; color: #fff; margin-bottom: 16px; line-height: 1; }
.modal-desc { font-size: 14px; color: var(--text-muted); line-height: 1.7; margin-bottom: 24px; }
.modal-list { list-style: none; display: flex; flex-direction: column; gap: 10px; margin-bottom: 28px; }
.modal-list li { display: flex; align-items: flex-start; gap: 12px; font-size: 14px; color: var(--text); line-height: 1.4; }
.modal-list li::before { content: 'u25b8'; color: var(--gold); font-size: 12px; margin-top: 2px; flex-shrink: 0; }
.modal-highlight { background: rgba(245,193,93,0.08); border-left: 3px solid var(--gold); border-radius: 0 8px 8px 0; padding: 14px 18px; font-family: 'Barlow Condensed', sans-serif; font-size: 15px; font-weight: 600; color: var(--gold); letter-spacing: 1px; }
.modal-close { display: block; width: 100%; margin-top: 20px; padding: 14px; background: transparent; border: 1px solid rgba(245,193,93,0.25); border-radius: 8px; color: var(--text-muted); font-family: 'Barlow Condensed', sans-serif; font-size: 12px; letter-spacing: 3px; text-transform: uppercase; cursor: pointer; transition: all 0.2s; }
.modal-close:hover { background: rgba(245,193,93,0.08); color: var(--gold); border-color: rgba(245,193,93,0.5); }

/* modal chip trigger */
body.modal-open { overflow: hidden; }
.modal-chip-trigger {
  appearance: none; border: 0;
  background: linear-gradient(135deg, rgba(255,255,255,0.12), rgba(255,255,255,0.05));
  color: #ffffff; cursor: pointer;
  transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease, color 0.28s ease;
}
.modal-chip-trigger:hover { transform: translateY(-2px); color: var(--gold); }
.modal-chip-trigger:focus-visible, .champion-close:focus-visible, .champion-join-btn:focus-visible { outline: 2px solid rgba(255,200,91,0.9); outline-offset: 3px; }
.modal-chip-trigger.is-pulsing, .champion-join-btn.is-pulsing { animation: championPulse 0.65s ease-out; }

/* ============================================================
   16. RULES / GAMER SECTION
   ============================================================ */
#gamer-rules { position: relative; padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; }
.rules-shell {
  position: relative; overflow: hidden; border-radius: 0 !important; padding: 0 !important; background: none !important; border: none !important; box-shadow: none !important;
  background: radial-gradient(circle at top left, rgba(245,193,93,0.10), transparent 24%),
    radial-gradient(circle at bottom right, rgba(255,200,91,0.05), transparent 22%),
    linear-gradient(135deg, rgba(8,12,22,0.96), rgba(18,14,28,0.90));
  border: 1px solid rgba(245,193,93,0.18);
  box-shadow: 0 24px 70px rgba(0,0,0,0.42), inset 0 1px 0 rgba(255,255,255,0.04), 0 0 30px rgba(245,193,93,0.04);
}
.rules-shell::before {
  display: none;
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(to bottom, rgba(255,255,255,0.03), transparent 20%),
    linear-gradient(to right, rgba(6,9,18,0.08), transparent 18%, transparent 82%, rgba(6,9,18,0.08));
}
.rules-hero {
  position: relative; min-height: auto !important; border-radius: 22px !important; overflow: hidden; margin-bottom: 1rem !important;
  background: linear-gradient(to right, rgba(6,9,18,0.82), rgba(6,9,18,0.34), rgba(6,9,18,0.78)),
    radial-gradient(circle at center, rgba(245,193,93,0.12), transparent 36%), #060912;
}
.rules-hero::before {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(to bottom, rgba(255,255,255,0.06), transparent 24%, transparent 78%, rgba(255,255,255,0.03)),
    radial-gradient(circle at top center, rgba(245,193,93,0.16), transparent 24%),
    radial-gradient(circle at bottom left, rgba(245,193,93,0.08), transparent 20%);
  pointer-events: none;
}
.rules-hero::after {
  content: ""; position: absolute; inset: 0;
  background-image: radial-gradient(rgba(255,255,255,0.035) 0.7px, transparent 0.9px), radial-gradient(rgba(0,0,0,0.05) 0.7px, transparent 0.9px);
  background-position: 0 0, 1px 1px; background-size: 4px 4px, 5px 5px; mix-blend-mode: soft-light; opacity: 0.32; pointer-events: none;
}
.rules-hero-content { position: relative; z-index: 2; padding: 1.25rem !important; }
.rules-kicker { color: #f5c15d; text-transform: uppercase; letter-spacing: 0.32em; font-weight: 700; font-size: 0.8rem; }
.rules-heading { font-family: 'Bebas Neue', sans-serif; font-size: clamp(3rem, 7vw, 5.8rem); line-height: 0.92; color: #fff; letter-spacing: -0.02em; }
.rules-subtext { max-width: 46rem !important; color: rgba(255,255,255,0.82); font-size: 0.98rem !important; line-height: 1.6 !important; margin-top: 4px !important; }
.rules-chip-row { display: flex; flex-wrap: wrap; gap: 0.6rem !important; margin-top: 1rem !important; }
.rules-chip { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.62rem 0.9rem !important; border-radius: 999px; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.10); color: rgba(255,255,255,0.88); font-size: 0.76rem !important; font-weight: 700; }
.rules-grid { position: relative; z-index: 2; display: grid !important; grid-template-columns: repeat(1, minmax(0, 1fr)) !important; gap: 0.9rem !important; }
@media (min-width: 1024px) { .rules-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; } }
.rule-card { position: relative; height: 100%; border-radius: 22px !important; overflow: hidden; min-height: 100% !important; background: linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02));
  border: 1px solid rgba(245,193,93,0.18); box-shadow: 0 14px 34px rgba(0,0,0,0.26), inset 0 1px 0 rgba(255,255,255,0.04);
}
.rule-card::before { content: ""; position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(255,255,255,0.04), transparent 26%), radial-gradient(circle at top right, rgba(245,193,93,0.08), transparent 24%); pointer-events: none; }
.rule-card-inner { position: relative; z-index: 1; padding: 1rem !important; }
.rule-top { display: flex; flex-direction: row; align-items: flex-start; flex-wrap: wrap; gap: 0.8rem; }
.rule-top .rule-title { flex: 1 1 auto; min-width: 0; margin: 0; }
.rule-top .rule-copy { flex: 0 0 100%; margin-top: 0.4rem; }
@media (min-width: 1024px) {
  .rule-top { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto auto; gap: 0.4rem 0.8rem; }
  .rule-top .rule-icon-wrap { grid-row: 1; grid-column: 1; }
  .rule-top .rule-title { grid-row: 1; grid-column: 2; position: relative; top: 15px !important; }
  .rule-top .rule-copy { grid-row: 2; grid-column: 1 / span 2; flex: initial; margin-top: 0; }
  .rule-top button { grid-row: 3; grid-column: 1 / span 2; margin-top: 0.75rem; }
}
.rule-icon-wrap { width: 72px; height: 72px; min-width: 72px; border-radius: 18px; overflow: hidden; display: flex; align-items: center; justify-content: center; background: linear-gradient(180deg, rgba(245,193,93,0.16), rgba(245,193,93,0.07)); border: 1px solid rgba(245,193,93,0.2); box-shadow: inset 0 1px 0 rgba(255,255,255,0.04); }
.rule-icon-img { width: 100%; height: 100%; object-fit: cover; display: block; filter: brightness(1.04) contrast(1.04) saturate(1.03); }
.rule-icon { width: 52px; height: 52px; border-radius: 18px; display: inline-flex; align-items: center; justify-content: center; background: linear-gradient(180deg, rgba(245,193,93,0.18), rgba(245,193,93,0.08)); border: 1px solid rgba(245,193,93,0.24); color: #f5c15d; box-shadow: inset 0 1px 0 rgba(255,255,255,0.05); }
.rule-title { font-family: 'Bebas Neue', sans-serif; font-size: 1.7rem !important; line-height: 0.95 !important; letter-spacing: 0.02em; color: #fff; margin-top: 0 !important; }
.rule-copy { margin-top: 0.1rem !important; color: rgba(255,255,255,0.72) !important; line-height: 1.55 !important; font-size: 0.92rem !important; }
.rule-points { margin-top: 0.85rem !important; display: grid; gap: 0.5rem !important; }
.rule-point { display: flex; align-items: flex-start; gap: 0.6rem !important; color: rgba(255,255,255,0.92); font-size: 0.92rem !important; line-height: 1.45 !important; }
.rule-point-dot { width: 8px; height: 8px; min-width: 8px; border-radius: 999px; background: #f5c15d; box-shadow: 0 0 10px rgba(245,193,93,0.35); margin-top: 0.38rem !important; }
.rule-callout { margin-top: 1.05rem; padding-top: 0.95rem; border-top: 1px solid rgba(255,255,255,0.08); color: #f5c15d; font-weight: 700; letter-spacing: 0.04em; }
.rules-bottom-note { position: relative; z-index: 2; margin-top: 1.5rem; padding: 1rem 1.2rem; border-radius: 20px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); color: rgba(255,255,255,0.82); }
.rules-bottom-note strong { color: #fff; }

/* faq accordion */
.faq-item .faq-answer { max-height: 0; overflow: hidden; transition: max-height 0.3s ease; }
.faq-item.active .faq-answer { max-height: 200px; }
.faq-item.active .faq-icon { transform: rotate(180deg); }

/* ============================================================
   17. TOURNAMENT SCHEDULE / NEXT GAME
   ============================================================ */
/* (schedule items use utility classes, no dedicated selectors found) */

/* ============================================================
   18. TOP PLAYERS / LEADERBOARD
   ============================================================ */
#leaderboard .glass { background: rgba(10,14,23,0.38) !important; box-shadow: 0 10px 30px rgba(0,0,0,0.18), inset 0 1px 0 rgba(255,255,255,0.04) !important; }
#leaderboard .group { background: rgba(255,255,255,0.02) !important; box-shadow: none !important; }
#leaderboard .group .absolute.inset-0.bg-gradient-to-t { background: linear-gradient(to top, rgba(6,9,18,0.55), rgba(6,9,18,0.14) 42%, transparent 72%) !important; }
#leaderboard img { filter: brightness(1.12) contrast(1.08) saturate(1.05); }
#leaderboard .leaderboard-shell, #top-players .leaderboard-shell {
  background: linear-gradient(135deg, rgba(8,12,22,0.96), rgba(18,14,28,0.84)), rgba(255,255,255,0.02);
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 24px 70px rgba(0,0,0,0.42), inset 0 1px 0 rgba(255,255,255,0.04), 0 0 30px rgba(245,193,93,0.04);
  position: relative; overflow: hidden;
}
#leaderboard .leaderboard-shell::before, #top-players .leaderboard-shell::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at top left, rgba(245,193,93,0.06), transparent 26%), radial-gradient(circle at top right, rgba(0,174,239,0.06), transparent 24%); }
#leaderboard .player-frame, #top-players .player-frame { border-radius: 24px; padding: 10px; background: linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.018)); border: 1px solid rgba(255,255,255,0.09); box-shadow: 0 10px 28px rgba(0,0,0,0.28), inset 0 1px 0 rgba(255,255,255,0.04); transition: transform 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease; position: relative; }
#leaderboard .player-frame:hover, #top-players .player-frame:hover { transform: translateY(-6px); border-color: rgba(245,193,93,0.24); box-shadow: 0 16px 36px rgba(0,0,0,0.34), 0 0 24px rgba(245,193,93,0.06), inset 0 1px 0 rgba(255,255,255,0.05); }
#leaderboard .player-card, #top-players .player-card { border-radius: 20px; overflow: hidden; background: rgba(255,255,255,0.02); border: 1px solid rgba(255,255,255,0.07); }
#leaderboard .player-media, #top-players .player-media { aspect-ratio: 1 / 1; height: auto; max-width: 100%; display: block; position: relative; overflow: hidden; }
img.clean-img { width: 100%; height: 100%; object-fit: cover; max-width: 100%; }
#leaderboard .player-media.small, #top-players .player-media.small { height: 220px; }
#leaderboard .player-media img, #top-players .player-media img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.7s ease, filter 0.35s ease; filter: brightness(1.04) contrast(1.04) saturate(1.02); }
#leaderboard .player-frame:hover .player-media img, #top-players .player-frame:hover .player-media img { transform: scale(1.05); }
#leaderboard .player-copy, #top-players .player-copy { padding: 16px 16px 18px; }
#leaderboard .player-copy h3, #top-players .player-copy h3 { line-height: 1; }
#leaderboard .card-tag, #top-players .card-tag { position: absolute; top: 12px; left: 12px; z-index: 3; display: inline-flex; align-items: center; gap: 6px; padding: 7px 10px; border-radius: 999px; font-size: 11px; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,0.16); }
#leaderboard .card-tag.event-tag, #top-players .card-tag.event-tag { background: rgba(245,193,93,0.18); color: #f5c15d; }
#leaderboard .card-tag.leader-tag, #top-players .card-tag.leader-tag { background: rgba(0,174,239,0.18); color: #7ddcff; }
#leaderboard .card-tag.qualifier-tag, #top-players .card-tag.qualifier-tag { background: rgba(0,0,0,0.82); color: rgba(255,255,255,0.82); border-color: rgba(255,255,255,0.12); }
#leaderboard .featured-event { border-color: rgba(245,193,93,0.34); }
#leaderboard .featured-player { border-color: rgba(0,174,239,0.32); animation: pulseChampion 3.8s ease-in-out infinite alternate; }
#leaderboard .featured-player::after { content: ""; position: absolute; inset: 10px; border-radius: 20px; pointer-events: none; box-shadow: inset 0 0 0 1px rgba(0,174,239,0.08); }
#leaderboard .broadcast-cta { background: linear-gradient(90deg, rgba(255,255,255,0.06), rgba(255,255,255,0.04)); }

/* ============================================================
   19. CHAMPIONSHIP WEEKEND
   ============================================================ */
.championship-weekend-section {
  position: relative; padding: 16px 20px 16px;
  background: radial-gradient(circle at 18% 20%, rgba(255,185,55,.12), transparent 28%),
    radial-gradient(circle at 82% 30%, rgba(0,102,255,.10), transparent 30%),
    linear-gradient(180deg, #020611 0%, #040814 45%, #02050d 100%);
  overflow: hidden; scroll-margin-top: 140px;
}
.championship-weekend-wrap { max-width: 1800px; margin: 0 auto; }
.championship-weekend-shell {
  display: grid; grid-template-columns: 1.02fr .98fr; gap: 32px; align-items: stretch;
  min-height: unset; padding: 24px; border-radius: 32px; border: 1px solid rgba(255,196,72,.18);
  background: linear-gradient(135deg, rgba(255,255,255,.03), rgba(255,255,255,.01)), linear-gradient(180deg, rgba(7,11,25,.96), rgba(3,6,16,.96));
  box-shadow: 0 20px 70px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.05); position: relative;
}
.championship-weekend-shell::before {
  content: ""; position: absolute; inset: 0; border-radius: 32px; padding: 1px;
  background: linear-gradient(135deg, rgba(255,192,65,.55), rgba(26,102,255,.25), rgba(255,192,65,.18));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none;
}
.cw-copy { display: flex; flex-direction: column; justify-content: center; padding: 10px 6px 10px 2px; min-width: 0; }
.cw-eyebrow { color: #d5a63a; font-size: .9rem; font-weight: 800; letter-spacing: .28em; margin-bottom: 18px; }
.cw-title { margin: 0; font-size: clamp(2rem, 4vw, 3.5rem); line-height: .9; font-weight: 1000; letter-spacing: -.04em; color: #f5f7fb; text-transform: uppercase; }
.cw-title span { color: #ffc94d; text-shadow: 0 0 14px rgba(255,191,62,.38), 0 0 34px rgba(255,191,62,.18); }
.cw-rule { width: 86px; height: 4px; border-radius: 999px; margin: 24px 0 26px; background: linear-gradient(90deg, #ffcc58, rgba(255,204,88,.18));
  box-shadow: 0 0 14px rgba(255,196,72,.3); }
.cw-description { max-width: 760px; margin: 0 0 18px; font-size: clamp(.85rem, 1vw, 1rem); line-height: 1.5; font-weight: 500; color: rgba(240,244,255,.92); }
.cw-prize-block { margin: 0 0 26px; }
.cw-prize-label { color: #e0b14b; font-size: clamp(.75rem, 1vw, .9rem); font-weight: 700; letter-spacing: .03em; margin-bottom: 6px; text-transform: uppercase; }
.cw-prize { font-size: clamp(2.5rem, 5vw, 4rem); line-height: .92; font-weight: 1000; letter-spacing: -.05em; background: linear-gradient(90deg, #f3be45 0%, #fff0b8 38%, #bde7ff 72%, #87c2ff 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent; text-shadow: 0 8px 34px rgba(0,0,0,.22); }
.cw-meta-row { display: flex; flex-wrap: wrap; gap: 12px; margin: 0 0 30px; }
.cw-chip { padding: 12px 18px; border-radius: 999px; border: 1px solid rgba(255,196,72,.18); background: linear-gradient(180deg, rgba(13,22,48,.92), rgba(10,17,38,.8));
  color: #dfe8ff; font-size: .92rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 8px 24px rgba(0,0,0,.22); }
.cw-actions { display: flex; flex-wrap: wrap; gap: 14px; }
.cw-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 220px; min-height: 62px; padding: 0 28px; border-radius: 999px; text-decoration: none; font-size: 1.05rem; font-weight: 900; letter-spacing: .01em; transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease, background .22s ease; }
.cw-btn:hover { transform: translateY(-2px); }
.cw-btn-primary { background: linear-gradient(180deg, #ffc94b 0%, #efad24 100%); color: #09111f; box-shadow: 0 16px 36px rgba(239,173,36,.28), inset 0 1px 0 rgba(255,255,255,.38); }
.cw-btn-primary:hover { box-shadow: 0 20px 42px rgba(239,173,36,.34), inset 0 1px 0 rgba(255,255,255,.44); }
.mobile-experience { color: #ffffff; font-size: 0.7em; letter-spacing: 1px; }
.cw-btn-secondary { color: #eef4ff; border: 1px solid rgba(91,132,255,.32); background: linear-gradient(180deg, rgba(18,28,60,.9), rgba(10,17,36,.78));
  box-shadow: 0 14px 34px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.05); }
.cw-btn-secondary:hover { border-color: rgba(255,196,72,.28); }
.cw-media { display: flex; align-items: center; justify-content: center; min-width: 0; }
.cw-media-frame { position: relative; width: 100%; height: auto; min-height: unset; border-radius: 28px; overflow: hidden; border: 1px solid rgba(255,176,33,.32); background: #050811; box-shadow: 0 24px 64px rgba(0,0,0,.42), 0 0 0 1px rgba(255,186,52,.08), 0 0 42px rgba(255,153,0,.08); padding: 0; }
.cw-media-img { position: relative; inset: unset; width: 100%; height: auto; object-fit: contain; object-position: center; filter: contrast(1.06) saturate(1.08); display: block; }
.cw-media-overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(4,8,20,.05) 0%, rgba(4,8,20,.16) 38%, rgba(4,8,20,.5) 100%), linear-gradient(90deg, rgba(4,8,20,.08) 0%, rgba(4,8,20,0) 35%, rgba(4,8,20,.18) 100%); pointer-events: none; }
.cw-media-glow { position: absolute; inset: auto -12% -18% auto; width: 42%; height: 46%; background: radial-gradient(circle, rgba(255,179,32,.24) 0%, rgba(255,179,32,0) 70%); pointer-events: none; filter: blur(18px); }
.cw-media-badge { position: absolute; left: 24px; bottom: 24px; padding: 14px 18px; border-radius: 18px; border: 1px solid rgba(255,189,58,.22); background: linear-gradient(180deg, rgba(5,10,24,.82), rgba(5,10,24,.62)); box-shadow: 0 12px 30px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.06); backdrop-filter: blur(8px); }
.cw-media-badge span { display: block; color: #ffc64c; font-size: .8rem; font-weight: 900; letter-spacing: .18em; margin-bottom: 4px; }
.cw-media-badge strong { display: block; color: #f4f8ff; font-size: 1.1rem; font-weight: 900; letter-spacing: .02em; }
.cw-media-frame::after { content: ""; position: absolute; inset: 0; border-radius: 28px; pointer-events: none; box-shadow: inset 0 0 80px rgba(0,0,0,.35), inset 0 0 120px rgba(255,140,0,.08); }
.showdown-img { object-fit: cover; object-position: center; filter: contrast(1.12) saturate(1.15) brightness(1.02); }
.championship-weekend-panels { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0; background: linear-gradient(135deg, rgba(7,11,21,0.96), rgba(10,7,14,0.94)); border: 1px solid rgba(255,184,77,0.16); }
.championship-weekend-panel { position: relative; min-width: 0; overflow: hidden; }
.championship-weekend-panel-left { border-right: 1px solid rgba(255,184,77,0.12); }
.championship-weekend-panel-img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ============================================================
   20. PM LOUNGE
   ============================================================ */
.pm-lounge-shell { display: grid; grid-template-columns: minmax(320px, 420px) minmax(0, 1fr); gap: 24px; align-items: stretch; }
.pm-lounge-rail { display: flex; flex-direction: column; gap: 18px; }
.pm-day-card { position: relative; min-height: 212px; border-radius: 24px; overflow: hidden; border: 1px solid rgba(255,255,255,0.10); box-shadow: 0 22px 60px rgba(0,0,0,0.34), inset 0 1px 0 rgba(255,255,255,0.04); background: #060912; isolation: isolate; }
.pm-day-card::before { content: ""; position: absolute; inset: 0; background-image: var(--pm-bg); background-size: cover; background-position: center center; transform: scale(1.03); filter: brightness(0.74) contrast(1.04) saturate(1.03); transition: transform 7s ease, filter 0.4s ease; z-index: 0; }
.pm-day-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(6,9,18,0.94) 0%, rgba(6,9,18,0.80) 34%, rgba(6,9,18,0.38) 74%, rgba(6,9,18,0.18) 100%), linear-gradient(180deg, rgba(255,255,255,0.06), transparent 26%, transparent 82%, rgba(255,255,255,0.03)); z-index: 1; }
.pm-day-card:hover::before { transform: scale(1.08); filter: brightness(0.80) contrast(1.07) saturate(1.05); }
.pm-day-card-inner { position: relative; z-index: 2; height: 100%; padding: 22px 22px 22px 26px; display: flex; flex-direction: column; justify-content: center; }
.pm-day-accent { position: absolute; left: 0; top: 16px; bottom: 16px; width: 3px; border-radius: 999px; background: #f5c15d; box-shadow: 0 0 18px rgba(245,193,93,0.35); z-index: 2; }
.pm-day-kicker { color: #f5c15d; font-size: 0.92rem; font-weight: 800; letter-spacing: 0.24em; text-transform: uppercase; }
.pm-day-title { margin: 0.45rem 0 0; color: #ffffff; font-weight: 800; font-size: 1.55rem; line-height: 1; }
.pm-day-copy { margin: 0.65rem 0 0; color: rgba(255,255,255,0.78); font-size: 0.92rem; line-height: 1.65; max-width: 270px; }
.pm-day-chip { display: inline-flex; align-items: center; width: fit-content; margin-top: 0.95rem; padding: 0.72rem 1rem; border-radius: 999px; background: rgba(245,193,93,0.14); border: 1px solid rgba(245,193,93,0.24); color: #f5c15d; font-size: 0.74rem; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; backdrop-filter: blur(10px); }
.pm-hero-card { position: relative; min-height: 700px; border-radius: 30px; overflow: hidden; border: 1px solid rgba(255,255,255,0.10); box-shadow: 0 28px 80px rgba(0,0,0,0.40), 0 0 28px rgba(245,193,93,0.06), inset 0 1px 0 rgba(255,255,255,0.04); background: #060912; isolation: isolate; }
.pm-hero-card::before { content: ""; position: absolute; inset: 0; background-image: url('assets/images/ChampPM.webp'); background-size: cover; background-position: center center; transform: scale(1.03); filter: none; z-index: 0; }
.pm-hero-card::after { content: ""; position: absolute; inset: 0; background: none; z-index: 1; }
.pm-hero-inner { position: relative; z-index: 2; height: 100%; padding: 34px; display: flex; flex-direction: column; justify-content: space-between; }
.pm-hero-kicker { color: #f5c15d; font-weight: 800; letter-spacing: 0.30em; text-transform: uppercase; font-size: 0.84rem; }
.pm-hero-title { margin-top: 0.9rem; font-family: 'Bebas Neue', sans-serif; font-size: clamp(1.8rem, 2.8vw, 3rem); line-height: 0.92; color: #ffffff; }
.pm-hero-title span { color: #f5c15d; }
.pm-hero-copy { margin-top: 1.1rem; max-width: 600px; color: rgba(255,255,255,0.84); font-size: 1rem; line-height: 1.85; }
.pm-hero-cta-row { display: flex; flex-wrap: wrap; gap: 0.9rem; margin-top: 1.4rem; }
.pm-hero-btn { display: inline-flex; align-items: center; justify-content: center; padding: 0.95rem 1.2rem; border-radius: 999px; font-weight: 800; letter-spacing: 0.08em; text-decoration: none; transition: transform 0.25s ease, background 0.25s ease, border-color 0.25s ease, background 0.25s ease; }
.pm-hero-btn:hover { transform: translateY(-2px); }
.pm-hero-btn-primary { background: #f5c15d; border: 1px solid #f5c15d; color: #05070d; }
.pm-hero-btn-secondary { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.14); color: #ffffff; backdrop-filter: blur(10px); }
.pm-hero-footer { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.pm-hero-stat { padding: 1rem 1rem 0.95rem; border-radius: 20px; background: linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.03)); border: 1px solid rgba(255,255,255,0.10); backdrop-filter: blur(10px); }
.pm-hero-stat-label { color: rgba(255,255,255,0.56); font-size: 0.68rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; }
.pm-hero-stat-value { margin-top: 0.35rem; color: #ffffff; font-weight: 800; font-size: 1rem; line-height: 1.35; }
.pm-hero-overlay-tag { position: absolute; top: 22px; right: 22px; z-index: 3; display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.78rem 1rem; border-radius: 999px; background: rgba(10,14,23,0.58); border: 1px solid rgba(245,193,93,0.20); color: #f5c15d; font-size: 0.74rem; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; backdrop-filter: blur(14px); }
.pm-hero-overlay-tag::before { content: ""; width: 8px; height: 8px; border-radius: 999px; background: #f5c15d; box-shadow: 0 0 14px rgba(245,193,93,0.60); }

/* ============================================================
   21. SPONSOR SECTION
   ============================================================ */
#sponsor-section .section-head-left { text-align: left; }
#sponsor-section .sponsor-scroll-wrap {
  --sponsor-gap: clamp(2.5rem, 4vw, 4.5rem);
  position: relative; width: 100%; overflow: hidden; padding-block: 0.75rem;
  mask-image: linear-gradient(to right, transparent 0, black 8%, black 92%, transparent 100%);
  -webkit-mask-image: linear-gradient(to right, transparent 0, black 8%, black 92%, transparent 100%);
}
#sponsor-section .sponsor-scroll { display: flex !important; align-items: center; width: max-content; min-width: max-content; flex-wrap: nowrap; animation: sponsorMarquee 32s linear infinite; will-change: transform; transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; }
#sponsor-section .sponsor-group { display: flex; align-items: center; flex-wrap: nowrap; gap: 2px; padding-right: 2px; }
#sponsor-section .sponsor-item { flex: 0 0 auto; min-width: max-content; height: 7rem; display: flex; align-items: center; justify-content: center; padding-inline: 0; position: relative; }
#sponsor-section .sponsor-item img { height: 90px; width: auto; max-width: 260px; object-fit: contain; opacity: 0.88; transition: transform 0.35s ease, opacity 0.35s ease, filter 0.35s ease; filter: drop-shadow(0 8px 18px rgba(0,0,0,0.28)); }
#sponsor-section .sponsor-item:hover img { transform: translateY(-2px) scale(1.03); opacity: 1; }
/* Generic sponsor-scroll — animation handled by #sponsor-section specific rule above */
@media (hover: hover) {
  #sponsor-section .sponsor-scroll-wrap:hover .sponsor-scroll { animation-play-state: paused; }
  .sponsor-scroll:hover { animation-play-state: paused; }
}
.sponsor-shell {
  position: relative; border-radius: 40px; padding: 1.25rem 1.5rem;
  background: linear-gradient(135deg, rgba(10,14,23,0.92), rgba(18,14,28,0.82)), rgba(255,255,255,0.02);
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 20px 60px rgba(0,0,0,0.42), inset 0 1px 0 rgba(255,255,255,0.04), 0 0 30px rgba(245,193,93,0.05);
  backdrop-filter: blur(14px); overflow: hidden;
}
.sponsor-shell::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(circle at left center, rgba(245,193,93,0.08), transparent 22%), radial-gradient(circle at right center, rgba(59,130,246,0.08), transparent 22%);
}

/* ============================================================
   22. LIVE EVENTS / AGENCY / VENUE
   ============================================================ */
#agency { position: relative; }
.agency-frame {
  position: relative; width: 100%; max-width: 900px; margin: 0 auto 12px auto !important;
  min-height: 500px !important; border-radius: 0 !important; box-shadow: none !important;
  border: 0 !important; background: #060912 !important; overflow: hidden;
}
.agency-frame::before, .agency-frame::after { display: none !important; }
.agency-frame .border { display: none !important; z-index: 3 !important; }
.agency-frame picture { display: block !important; width: 100% !important; height: 100% !important; }
.agency-img, .agency-frame img { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: center center !important; display: block !important; filter: brightness(1.1) contrast(1.08) saturate(1.06) !important; box-shadow: none !important; }
.agency-copy {
  position: relative; overflow: hidden; border-radius: 28px; padding: 1.25rem; max-width: 800px; margin: 0 auto;
  background: radial-gradient(circle at top left, rgba(245,193,93,0.10), transparent 24%), linear-gradient(135deg, rgba(8,12,22,0.96), rgba(18,14,28,0.88));
  border: 1px solid rgba(245,193,93,0.14); box-shadow: 0 20px 50px rgba(0,0,0,0.34), inset 0 1px 0 rgba(255,255,255,0.04);
}
.agency-copy > * { position: relative; z-index: 2; }
.agency-copy::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(to bottom, rgba(255,255,255,0.03), transparent 24%), linear-gradient(to right, rgba(245,193,93,0.08), transparent 18%); }
.agency-title, .agency-subtitle, .agency-list p, .agency-tagline { opacity: 0; transform: translateY(20px); }
.agency-title     { animation: agencyReveal 0.7s ease-out 0.10s forwards; }
.agency-subtitle  { animation: agencyReveal 0.8s ease-out 0.22s forwards; }
.agency-list p:nth-child(1) { animation: agencyReveal 0.75s ease-out 0.34s forwards; }
.agency-list p:nth-child(2) { animation: agencyReveal 0.75s ease-out 0.46s forwards; }
.agency-list p:nth-child(3) { animation: agencyReveal 0.75s ease-out 0.58s forwards; }
.agency-list p:nth-child(4) { animation: agencyReveal 0.75s ease-out 0.70s forwards; }
.agency-tagline   { animation: agencyReveal 0.85s ease-out 0.82s forwards; }
#agency .max-w-7xl { max-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; }
#agency .mb-16, #agency .agency-copy { padding-left: 2rem; padding-right: 2rem; }
#agency .grid { display: flex !important; flex-direction: column !important; align-items: center !important; text-align: center !important; gap: 0 !important; align-items: stretch !important; }
#agency .glass img { display: block !important; width: 100% !important; height: auto !important; object-fit: contain !important; position: static !important; }
.agency-join-btn { position: absolute; top: 20px; right: 20px; z-index: 20; }
.agency-mobile-title { position: absolute; top: 18px; left: 18px; right: 18px; z-index: 14; text-align: center; pointer-events: none; padding: 0.9rem 1rem 0; }
.agency-mobile-kicker { display: inline-block; margin-bottom: 0.35rem; color: #f5c15d; font-size: 0.68rem; font-weight: 700; letter-spacing: 0.28em; text-transform: uppercase; text-shadow: 0 4px 18px rgba(0,0,0,0.6); }
.agency-mobile-title h3 { margin: 0; font-family: 'Bebas Neue', sans-serif; font-size: clamp(2rem, 8vw, 3rem); line-height: 0.96; color: #f6d27b; text-shadow: 0 0 10px rgba(245,193,93,0.14), 0 10px 24px rgba(0,0,0,0.62); }
.agency-mobile-title p { margin: 0.35rem 0 0; color: rgba(255,245,220,0.95); font-size: clamp(0.95rem, 3vw, 1.15rem); font-style: italic; text-shadow: 0 8px 20px rgba(0,0,0,0.62); }

/* ============================================================
   23. SUPERCITY / PROMO VIDEO
   ============================================================ */
/* (supercity/promoVideo use utility classes only) */

/* ============================================================
   24. SPONSOR FORM
   ============================================================ */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"] {
  background-color: #1a1a2e !important;
  color: #ffffff !important;
  border: 1px solid rgba(245,193,93,0.5) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
input[type="text"]::placeholder,
input[type="email"]::placeholder,
input[type="tel"]::placeholder,
input[type="number"]::placeholder { color: rgba(255,255,255,0.4) !important; }
input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="number"]:focus { border-color: rgba(245,193,93,0.8) !important; box-shadow: 0 0 0 2px rgba(245,193,93,0.2) !important; outline: none !important; }
select {
  background-color: #1a1a2e !important; color: #ffffff !important;
  border: 1px solid rgba(245,193,93,0.5) !important; border-radius: 12px !important;
  appearance: none !important; -webkit-appearance: none !important;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23f5c15d' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'></polyline></svg>") !important;
  background-repeat: no-repeat !important; background-position: right 16px center !important; padding-right: 44px !important;
}
select option { background: #1a1a2e !important; color: #ffffff !important; }
select:focus { border-color: rgba(245,193,93,0.8) !important; box-shadow: 0 0 0 2px rgba(245,193,93,0.2) !important; outline: none !important; }
textarea { background-color: #1a1a2e !important; color: #ffffff !important; border: 1px solid rgba(245,193,93,0.5) !important; border-radius: 12px !important; }
textarea::placeholder { color: rgba(255,255,255,0.4) !important; }
textarea:focus { border-color: rgba(245,193,93,0.8) !important; box-shadow: 0 0 0 2px rgba(245,193,93,0.2) !important; outline: none !important; }

/* ============================================================
   25. FINAL CTA
   ============================================================ */
/* (final-cta uses utility classes) */

/* ============================================================
   26. FOOTER
   ============================================================ */
.footer-strip { border-top: 1px solid rgba(245,193,93,0.1); padding: 40px 20px; text-align: center; background: var(--bg); }
.footer-strip p { font-size: 13px; color: var(--text-muted); letter-spacing: 1px; }

/* ============================================================
   27. BACK TO TOP
   ============================================================ */
.back-to-top {
  position: fixed; bottom: 152px; right: 53px; width: 3.5rem; height: 3.5rem;
  border-radius: 9999px; background: var(--gold); color: var(--bg);
  font-weight: bold; font-size: 1.25rem; display: flex; align-items: center; justify-content: center;
  box-shadow: 0 0 30px rgba(255,200,91,0.4); z-index: 50;
  opacity: 0; visibility: hidden; transition: all 0.3s ease; cursor: pointer; border: none;
}
.back-to-top.visible { opacity: 1; visibility: visible; }
.back-to-top:hover { transform: scale(1.1); }

/* ============================================================
   28. FORM SUCCESS MODAL
   ============================================================ */
.form-status-message { min-height: 1.25rem; margin-top: 0.85rem; text-align: center; font-size: 0.85rem; font-weight: 600; color: rgba(255,255,255,0.72); }
.form-status-message.is-error   { color: #ff9b9b; }
.form-status-message.is-success { color: #9be7b4; }
.form-success-modal { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; padding: 1.25rem; background: rgba(4,8,16,0.82); backdrop-filter: blur(10px); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 0.25s ease, visibility 0.25s ease; z-index: 1200; }
.form-success-modal.is-open { opacity: 1; visibility: visible; pointer-events: auto; }
.form-success-card { position: relative; width: min(640px, 100%); padding: 2.25rem 1.5rem 1.75rem; border-radius: 30px; text-align: center; background: linear-gradient(180deg, rgba(13,19,35,0.96) 0%, rgba(10,16,30,0.92) 100%); border: 1px solid rgba(255,255,255,0.08); box-shadow: 0 24px 60px rgba(0,0,0,0.4), 0 0 0 1px rgba(255,255,255,0.03) inset; }
.form-success-close { position: absolute; top: 0.85rem; right: 0.95rem; width: 42px; height: 42px; border: 0; border-radius: 999px; background: rgba(255,255,255,0.06); color: #fff; font-size: 1.8rem; line-height: 1; cursor: pointer; }
.form-success-eyebrow { display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px; border: 1px solid rgba(212,175,55,0.35); border-radius: 999px; background: rgba(8,14,28,0.55); color: #f1c964; font-size: 12px; letter-spacing: 2px; text-transform: uppercase; font-weight: 700; }
.form-success-dot { width: 8px; height: 8px; border-radius: 50%; background: #f1c964; box-shadow: 0 0 16px rgba(241,201,100,0.75); }
.form-success-title { margin: 1.25rem 0 0.75rem; font-family: 'Bebas Neue', sans-serif; font-size: clamp(2.75rem, 9vw, 4.75rem); line-height: 0.95; text-transform: uppercase; }
.form-success-title span { background: linear-gradient(90deg, #17cbff 0%, #c44dff 54%, #ffd36b 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.form-success-copy { max-width: 34rem; margin: 0 auto; color: #dbe5f5; font-size: 1rem; line-height: 1.7; }
.form-success-actions { margin-top: 1.25rem; }
.form-success-btn { min-width: 260px; }

/* ============================================================
   29. CHAMPION MODAL
   ============================================================ */
.champion-modal {
  position: fixed; inset: 0; z-index: 9999; display: none;
  align-items: center; justify-content: center; padding: 20px;
  background: rgba(3,7,15,0.78); backdrop-filter: blur(12px);
}
.champion-modal.is-open { display: flex; }
.champion-modal-content {
  position: relative; width: min(100%, 640px); padding: 2rem; border-radius: 28px;
  border: 1px solid rgba(255,255,255,0.12);
  background: radial-gradient(circle at top left, rgba(255,200,91,0.16), transparent 28%), radial-gradient(circle at bottom right, rgba(0,174,239,0.12), transparent 24%), linear-gradient(145deg, rgba(9,14,24,0.98), rgba(16,12,26,0.96));
  box-shadow: 0 24px 70px rgba(0,0,0,0.45), 0 0 50px rgba(255,200,91,0.12), inset 0 1px 0 rgba(255,255,255,0.06);
  overflow: hidden; transform: translateY(24px) scale(0.98); transition: transform 0.35s ease;
}
.champion-modal.is-open .champion-modal-content { transform: translateY(0) scale(1); }
.champion-modal-glow { position: absolute; inset: 0; pointer-events: none; border-radius: 28px; background: radial-gradient(circle at top left, rgba(255,200,91,0.12), transparent 22%), radial-gradient(circle at bottom right, rgba(0,174,239,0.1), transparent 24%); opacity: 0.95; }
.champion-modal-eyebrow { position: relative; z-index: 1; margin-bottom: 10px; font-size: 12px; font-weight: 700; letter-spacing: 0.26em; text-transform: uppercase; color: rgba(255,255,255,0.78); }
.champion-title { font-family: "Bebas Neue", sans-serif; font-size: clamp(2.3rem, 4vw, 3rem); line-height: 0.95; color: #ffc85b; margin-bottom: 14px; text-shadow: 0 6px 20px rgba(0,0,0,0.28); position: relative; z-index: 1; }
.champion-text { color: rgba(255,255,255,0.88); font-size: 15px; line-height: 1.6; margin-bottom: 14px; position: relative; z-index: 1; }
.champion-modal-actions { position: relative; z-index: 1; display: flex; align-items: center; justify-content: flex-start; margin-top: 6px; }
.champion-join-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 220px; padding: 14px 24px; border-radius: 999px; text-decoration: none; color: #081018; font-weight: 800; letter-spacing: 0.04em; background: linear-gradient(90deg, #ffd86c, #35d1ff); box-shadow: 0 12px 30px rgba(0,0,0,0.3), 0 0 18px rgba(255,200,91,0.18); }
.champion-join-btn:hover { transform: translateY(-2px) scale(1.02); filter: brightness(1.04); }
.champion-close { position: absolute; top: 16px; right: 16px; z-index: 3; width: 56px; height: 56px; border: 0; border-radius: 999px; color: #fff; font-size: 24px; font-weight: 700; background: rgba(17,22,35,0.72); box-shadow: 0 10px 24px rgba(0,0,0,0.26), inset 0 1px 0 rgba(255,255,255,0.06); backdrop-filter: blur(12px); cursor: pointer; transition: transform 0.25s ease, background 0.25s ease, border-color 0.25s ease; }
.champion-close:hover { transform: rotate(90deg); background: rgba(255,255,255,0.1); border-color: rgba(255,200,91,0.35); }

.champion-modal-content.champion-modal-final { position: relative; width: min(92vw, 560px); max-height: 90vh; overflow-y: auto; border-radius: 28px; padding: 18px 18px 22px; background: radial-gradient(circle at top left, rgba(255,200,91,0.16), transparent 28%), linear-gradient(145deg, rgba(7,10,18,0.98), rgba(12,16,28,0.96)); border: 1px solid rgba(255,200,91,0.22); box-shadow: 0 30px 80px rgba(0,0,0,0.58), inset 0 1px 0 rgba(255,255,255,0.05), 0 0 28px rgba(255,200,91,0.08); animation: championModalRise 0.32s ease; }
.champion-modal-media-final { position: relative; z-index: 1; border-radius: 24px; overflow: hidden; margin-bottom: 18px; border: 1px solid rgba(255,200,91,0.32); box-shadow: 0 20px 50px rgba(0,0,0,0.45), 0 0 0 1px rgba(255,255,255,0.03) inset, 0 0 26px rgba(255,200,91,0.1); }
.champion-modal-media-final::before { content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 2; background: linear-gradient(to bottom, rgba(255,255,255,0.08), transparent 18%), linear-gradient(to top, rgba(0,0,0,0.18), transparent 30%), linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.12) 42%, transparent 60%); mix-blend-mode: screen; }
.champion-modal-img-final { display: block; width: 100%; height: auto; max-height: 46vh; object-fit: cover; filter: brightness(1.05) contrast(1.08) saturate(1.04); }
.champion-modal-copy-final { position: relative; z-index: 1; padding: 2px 4px 0; }

/* ============================================================
   30. PRIZE RULES MODAL
   ============================================================ */
/* (uses .modal-overlay / .modal-box base styles above) */

/* ============================================================
   31. MEDIA QUERIES — organized largest to smallest breakpoint
   ============================================================ */

/* --- min-width: 1280px --- */
@media (min-width: 1280px) {
  .rules-grid { grid-template-columns: repeat(4, 1fr); }
  .rules-hero-grid-item { grid-column: 1 / -1; }
  .xl\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0,1fr)); }
  .xl\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0,1fr)); }
}

/* --- min-width: 1024px --- */
@media (min-width: 1024px) {
  .rules-hero-grid-item { grid-column: 1 / -1; }
  .lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0,1fr)); }
  .lg\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0,1fr)); }
  .lg\:flex-row    { flex-direction: row; }
  .lg\:text-left   { text-align: left; }
  .lg\:text-4xl    { font-size: 2.25rem; line-height: 2.5rem; }
  .lg\:text-5xl    { font-size: 3rem;    line-height: 1; }
  .lg\:text-6xl    { font-size: 3.75rem; line-height: 1; }
  .lg\:text-7xl    { font-size: 4.5rem;  line-height: 1; }
  .lg\:text-8xl    { font-size: 6rem;    line-height: 1; }
  .lg\:text-9xl    { font-size: 8rem;    line-height: 1; }
  .host-wrap { grid-template-columns: 1fr 1fr; }
  .host-image-wrap { max-height: 520px; }
}

/* --- min-width: 768px --- */
@media (min-width: 768px) {
  .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .md\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0,1fr)); }
  .md\:flex-row    { flex-direction: row; }
  .md\:text-left   { text-align: left; }
  .md\:text-4xl    { font-size: 2.25rem; line-height: 2.5rem; }
  .md\:text-5xl    { font-size: 3rem;    line-height: 1; }
  .md\:text-6xl    { font-size: 3.75rem; line-height: 1; }
  .md\:text-7xl    { font-size: 4.5rem;  line-height: 1; }
  .host-layout { flex-direction: row; align-items: flex-start; }
  .agency-mobile-title { display: none !important; }
  .host-exp-mobile-sub { display: block !important; font-size: clamp(2rem, 7vw, 3rem) !important; margin-top: 0 !important; line-height: 0.9 !important; }
  #first-strike h2.font-bebas,
  #featured-game h2.font-bebas {
    white-space: nowrap !important;
    font-size: 13vw !important;
  }
  #first-strike h2.font-bebas span,
  #featured-game h2.font-bebas span {
    font-size: inherit !important;
    display: inline !important;
  }
  #first-strike h2.font-bebas .real-opportunity-shimmer,
  #featured-game h2.font-bebas .real-opportunity-shimmer {
    font-size: 35px !important;
  }
  .strike-img {
    margin-top: -8px !important;
  }
  .countdown-section-wrap {
    margin-top: -10px !important;
  }
  #host, .host-section-wrap {
    margin-top: -60px !important;
  }
  /* Stages row — horizontal scroll on mobile */
  .stages-row {
    overflow-x: auto !important;
    overflow-y: visible !important;
    scroll-snap-type: x mandatory;
    padding-bottom: 16px !important;
    gap: 0 !important;
    flex-wrap: nowrap !important;
  }
  .stage-pill {
    min-width: 80px !important;
    flex: 0 0 80px !important;
  }
  .stage-pill .stage-sub,
  .stage-pill a.stage-sub {
    display: none !important;
  }
  .stage-name {
    font-size: 11px !important;
    white-space: normal !important;
    word-break: break-word !important;
  }
  #host .final-crown-divider-longer {
    width: 70% !important;
  }
  #host .host-promo .final-crown-divider-longer {
    width: 100% !important;
  }
  .host-exp-text { display: none !important; }
  .host-exp-mobile-sub { display: block !important; font-size: clamp(2rem, 7vw, 3rem) !important; margin-top: 0 !important; line-height: 0.9 !important; }
  .host-liveat-mobile {
    display: inline !important;
    color: #ffffff !important;
  }
  .host-sub-desktop { display: none !important; }
  .host-title { margin: 0 !important; padding: 0 !important; }
  .host-mobile-liveat {
    display: none !important;
  }
  .host-mobile-pmlounge {
    display: block !important;
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(3rem, 9vw, 5rem);
    line-height: 0.9;
    margin-top: 0;
    margin-bottom: 0;
    letter-spacing: -0.01em;
  }
  #why-join { margin-top: -30px !important; }
  #distribution { margin-top: 0 !important; }
  .social-icons-wrap { margin-top: -19px !important; }
  #prize { margin-top: 0 !important; }
  .rules-grid .rule-card:last-child { display: none !important; }
  #privacy-card { width: 100% !important; max-width: 100% !important; margin-left: auto !important; margin-right: auto !important; }
  #privacy-card .rule-card-inner > div { flex-direction: column !important; align-items: flex-start !important; }
  #privacy-card .rule-icon-wrap { margin-bottom: -6px; }
  /* #top-players { display: none !important; } */
  #next-game { margin-top: 0 !important; }
  #championship-weekend-section { margin-top: -90px !important; }
  #pm-lounge { margin-top: 16px !important; }
  #sponsor-section { margin-top: 0 !important; }
  #Live-Events { margin-top: -35px !important; }
  #sponsor-form-section { margin-top: -35px !important; }
  #supercity { margin-top: -25px !important; }
  #Championship-Venue { margin-top: -40px !important; }
  #agency { margin-top: -40px !important; }
  .rules-shell { background: none !important; border: none !important; border-radius: 0 !important; padding: 0 !important; box-shadow: none !important; }
  .rules-shell::before { display: none !important; }
  .img1-card { margin-top: 0 !important; }
  .featured-img-wrap { aspect-ratio: auto !important; overflow: visible !important; }
  .green-img, .blue-img { width: 100% !important; height: auto !important; object-fit: contain !important; }
  .green-img { transform: translateY(10px) !important; }
  .host-sub-mobile { margin-top: -15px !important; display: none !important; }
  .host-btn-desktop { display: none !important; }
  .host-btn-mobile-wrap { display: flex; justify-content: center; margin-top: calc(1.5rem - 4px); }
  .cohost-break { display: block; }
  .cohost-heading { flex-direction: column !important; }
  .beyond-heading { flex-direction: column !important; }
  .activations-heading { flex-direction: column !important; }
  .annual-heading { flex-direction: column !important; }
  .bonus-kicker { letter-spacing: 0.12em !important; font-size: 11px !important; white-space: nowrap !important; }
  .host-btn-mobile-wrap .host-btn { padding: 8px 20px !important; font-size: 13px !important; }
  #first-strike, #featured-game { margin-top: 0 !important; }

  .host-section-wrap .host-wrap {
    grid-template-columns: 1fr 1fr !important;
    display: grid !important;
    gap: 30px !important;
    align-items: start !important;
  }
  .host-section-wrap .host-image {
    width: 100% !important;
    margin-top: 0 !important;
    order: unset !important;
    overflow: visible !important;
    align-self: start !important;
  }
  .host-section-wrap .host-image img {
    max-height: none !important;
    height: auto !important;
    object-fit: unset !important;
    width: 100% !important;
    display: block !important;
  }
  .host-section-wrap .host-copy {
    margin-top: 0 !important;
    width: 100% !important;
    order: unset !important;
    overflow: visible !important;
  }
  .clock-overlay {
    z-index: 99999 !important;
    position: absolute !important;
    top: 50% !important;
    right: 10px !important;
    left: auto !important;
    bottom: auto !important;
    transform: translateY(-50%) !important;
    transform-origin: top right !important;
    width: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 4px !important;
  }
  .clock-overlay .countdown-panel-fix {
    display: grid !important;
    grid-template-columns: repeat(4, 70px) !important; /* 20% smaller than 88px */
    gap: 7px !important;
  }
  .clock-overlay .countdown-box-fix {
    width: 70px !important;
    height: 74px !important;
    padding: 8px 5px !important;
    border-radius: 11px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
  }
  .clock-overlay .number-fix {
    font-size: 2rem !important;
    text-align: center !important;
    margin: 0 !important;
    line-height: 1 !important;
  }
  .clock-overlay .label-fix {
    font-size: 0.65rem !important;
    text-align: center !important;
    margin-top: 2px !important;
  }
  .clock-overlay span {
    font-size: 0.7rem !important;
    letter-spacing: 0.1em !important;
  }
  .clock-overlay p {
    font-size: 0.65rem !important;
    letter-spacing: 0.08em !important;
  }
  .countdown-panel { border-radius: 16px; }
  /* Mobile nav transparency fix */
  .navbar { background: rgba(3,6,11,0.95); }
  .hero-cta-row { flex-direction: column; align-items: stretch; }
  .hero-cta-row .btn { width: 100%; text-align: center; }
  .sponsor-shell { flex-direction: column; align-items: center; }
  .sponsor-item { width: 100%; max-width: 280px; }
  .hero-main-section { min-height: unset; padding-top: 4rem; }
  section { padding-top: 3rem; padding-bottom: 3rem; }
  .host-divider { display: none; }
  .coming-soon-card { padding: 24px 16px; }
  .pm-lounge-shell { flex-direction: column; }
  .pm-hero-card { min-height: 220px; }
  /* Mobile performance — disable expensive effects */
  .glass, .glass-card, .glass-dark,
  .festival-glass, .pm-day-card,
  .sponsor-shell, .countdown-panel { -webkit-backdrop-filter: none; backdrop-filter: none; }
  .prize-mobile-hero { display: block; }
  .championship-weekend-panels { grid-template-columns: 1fr; }
  .leaderboard-player-media { height: 48px; }
  .final-crown-rail { grid-template-columns: repeat(2, 1fr); }
  .agency-copy { padding: 24px 16px; }
  .final-chip-size { width: 100%; }
  .prize-expansion { text-align: center; }
}

/* --- mobile spacing fixes (max-width: 767px) --- */
@media (max-width: 767px) {
  /* Crown section — 60px side padding crushes content on phones */
  .crown-content { padding: 32px 16px !important; }

  /* Card body — reduce inner padding for narrow cards */
  .card-body { padding: 14px !important; }

  /* Cards grid — tighten gap in single-column layout */
  .host-layout .host-promo {
    width: 100% !important;
  }
  .host-layout .host-main-row {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
  .cards-grid { gap: 12px !important; }
  .cards-grid-heading { padding-left: 0 !important; padding-right: 0 !important; }

  /* Section utility padding — reduce from 16px to 8px on phones */
  .px-4 { padding-left: 8px !important; padding-right: 8px !important; }
  .sm\:px-6 { padding-left: 8px !important; padding-right: 8px !important; }

  /* Remove max-width restrictions that narrow content unnecessarily */
  .max-w-sm, .max-w-md { max-width: 100% !important; }

  /* Host wrap gap — tighten stacked layout */
  .host-wrap { gap: 16px !important; }

  /* Shared section heading — remove side padding */
  .shared-section-head { padding-left: 0 !important; padding-right: 0 !important; }

  /* Prevent any section from causing horizontal scroll */
  section { overflow-x: clip; }
  .glass, .cinematic-card, .prize-card { margin-left: 0 !important; margin-right: 0 !important; }
}

/* --- max-width: 640px --- */
@media (max-width: 640px) {
  .championship-weekend-section { padding: 2rem 1rem; }
  .countdown-panel-fix { gap: 4px; }
  .number-fix  { font-size: 2.6rem; }
  .label-fix   { font-size: 0.68rem; }
  .host-divider { width: 40px; }
  .reward-card-img { aspect-ratio: 16/9; }
  .prize-card.full-row { overflow: visible !important; }
  .prize-card.full-row .card-img-wrap { overflow: visible !important; }
  .cta-enhanced { padding: 48px 20px; }
  .cta-enhanced h2 { font-size: clamp(32px, 8vw, 52px); }
  .festival-glass { padding: 24px 16px; }
}

/* --- max-width: 480px --- */
@media (max-width: 480px) {
  .cards-grid { grid-template-columns: 1fr; }
}

/* --- max-width: 430px --- */
@media (max-width: 430px) {
  #hero-video { padding-left: 12px; }
  #hero-video .hv-btn { margin-left: 0; width: 100%; border-radius: 10px; font-size: 18px; }
  #hero-video .hv-meta { width: 100%; margin-left: 0; }
}

/* --- max-width: 400px --- */
@media (max-width: 400px) {
  .countdown-panel-fix { grid-template-columns: repeat(4, 80px); }
  .number-fix { font-size: 2.2rem; }
}

/* --- max-width: 375px --- */
@media (max-width: 375px) {
  .hero-title { font-size: 52px; }
  .hero-sub   { font-size: 14px; }
}

/* --- hover capability --- */
@media (hover: hover) {
  .btn-gold:hover {
    background: linear-gradient(135deg, var(--gold-bright) 0%, var(--gold) 100%);
    box-shadow: 0 8px 32px rgba(245,193,93,0.35), 0 2px 8px rgba(0,0,0,0.3);
    transform: translateY(-2px);
  }
  .cinematic-card:hover {
    transform: translateY(-6px) scale(1.01);
    border-color: rgba(245,193,93,0.25);
    box-shadow: 0 32px 64px rgba(0,0,0,0.5), 0 0 40px rgba(245,193,93,0.08);
  }
  .group:hover .group-hover\:opacity-100 { opacity: 1; }
  .group:hover .group-hover\:scale-105   { transform: scale(1.05); }
  .group:hover .group-hover\:translate-y-0 { transform: translateY(0); }
}

/* ============================================================
   MOBILE GLOBAL SPACING OVERRIDES — max-width: 767px only
   Desktop and tablet layouts are untouched.
   ============================================================ */
@media (max-width: 767px) {

  /* ── 1. OVERFLOW & SCROLL ROOT ─────────────────────────────── */
  html, body, main { overflow-x: clip !important; max-width: 100vw; }
  section          { overflow-x: hidden; box-sizing: border-box; }

  /* ── 2. HERO VIDEO — width:100vw + margin-left:calc(-50vw+50%)
         can push past viewport on narrow devices.
         Re-anchor it to the left edge instead.                  */
  #hero-video {
    width: 100% !important;
    margin-left: 0 !important;
    left: 0 !important;
    transform: none !important;
  }

  /* Countdown section — force true edge-to-edge on mobile */
  .countdown-section-wrap {
    width: 100vw !important;
    max-width: 100vw !important;
    left: 0 !important;
    transform: none !important;
    position: relative !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    overflow: visible !important;
  }
  .countdown-section-wrap img,
  .countdown-section-wrap picture,
  .countdown-section-wrap .w-full,
  .countdown-section-wrap .relative {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* ── 3. SECTION HORIZONTAL PADDING ─────────────────────────── */
  /* All utility padding classes that add > 8px horizontal space  */
  .px-4    { padding-left: 8px !important; padding-right: 8px !important; }
  .px-6    { padding-left: 8px !important; padding-right: 8px !important; }
  .px-8    { padding-left: 8px !important; padding-right: 8px !important; }
  .sm\:px-6 { padding-left: 8px !important; padding-right: 8px !important; }
  .lg\:px-8 { padding-left: 8px !important; padding-right: 8px !important; }

  /* Base <section> rule adds 20px sides — tighten to 8px         */
  section  { padding-left: 8px !important; padding-right: 8px !important; }

  /* ── 4. INNER CONTAINER WRAPPERS ───────────────────────────── */
  /* max-w-* + mx-auto is fine but must fill full phone width      */
  .max-w-7xl,
  .max-w-\[1800px\],
  .max-w-\[1500px\],
  .max-w-4xl,
  .max-w-3xl,
  .max-w-2xl { width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; }

  /* championship-img-wrap has an explicit padding:0 20px inline   */
  .championship-img-wrap { padding: 0 !important; }

  /* ── 5. TEXT / CONTENT WIDTH CAPS ──────────────────────────── */
  /* These cap text columns narrower than the viewport              */
  .max-w-sm, .max-w-md, .max-w-lg,
  .max-w-xl, .max-w-2xl { max-width: 100% !important; }

  /* ── 6. CARDS, GRIDS & WRAPPERS ────────────────────────────── */
  .cards-grid         { gap: 12px !important; }
  .cards-grid-heading { padding-left: 0 !important; padding-right: 0 !important; }
  .card-body          { padding: 14px !important; }

  /* Ensure cards don't carry stray margins                         */
  .prize-card,
  .glass,
  .cinematic-card,
  .leaderboard-shell,
  .rules-shell,
  .sponsor-shell { margin-left: 0 !important; margin-right: 0 !important; }

  /* Player grid: ensure 2-col doesn't overflow                    */
  .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }

  /* ── 7. SPONSOR SCROLLER ───────────────────────────────────── */
  /* The scroller is already overflow:hidden; just make sure the
     outer wrapper doesn't add side padding that breaks the mask   */
  .sponsor-scroll-wrap,
  .distribution-scroll-wrapper { padding-left: 0 !important; padding-right: 0 !important; }

  /* Sponsor shell: remove side padding that eats into scroller    */
  .sponsor-shell { padding-left: 8px !important; padding-right: 8px !important; }

  /* ── 8. PM LOUNGE ──────────────────────────────────────────── */
  /* pm-lounge-shell uses grid with a min 320px column             */
  .pm-lounge-shell {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
  }
  .pm-hero-card { min-height: 280px !important; }
  .pm-hero-kicker, .pm-hero-cta-row { display: none !important; }
  .pm-hero-title { display: grid !important; grid-template-columns: 1fr !important; font-size: clamp(1.4rem, 5.5vw, 2.2rem) !important; gap: 0.22rem !important; line-height: 0.88 !important; }
  .pm-hero-title > span { display: block !important; }
  .pm-hero-title > span:first-child,
  .pm-hero-title > span:last-child {
    color: #ffffff !important;
    font-size: 60% !important;
    line-height: 1 !important;
    transform: translateY(0.03em) !important;
  }
  .pm-hero-title > span:last-child {
    margin-top: 0.05rem !important;
  }
  /* Remove large inner padding on pm-hero-inner                   */
  .pm-hero-inner { padding: 20px !important; }
  /* Day cards: remove transform+filter on ::before — mobile Safari
     drops the pseudo-element when both are set inside overflow:hidden */
  .pm-day-card { min-height: 180px !important; }
  .pm-day-title {
    font-size: 0.93rem !important;
    transform: translateY(-7px) !important;
  }
  .pm-day-card::before {
    transform: none !important;
    filter: none !important;
  }
  /* Replace directional gradient with a uniform dark scrim so the
     image is visible across the full card width                    */
  .pm-day-card::after {
    background: rgba(6,9,18,0.52) !important;
  }

  /* ── 9. CHAMPIONSHIP WEEKEND SHELL ─────────────────────────── */
  /* Shell has padding:24px which adds horizontal space            */
  .championship-weekend-shell {
    padding: 12px !important;
    grid-template-columns: 1fr !important;
  }

  /* ── 10. AGENCY SECTION ────────────────────────────────────── */
  /* agency section rules add padding-left/right: 2rem             */
  #agency .mb-16,
  #agency .agency-copy { padding-left: 8px !important; padding-right: 8px !important; }

  /* ── 11. CROWN / FINAL CROWN ───────────────────────────────── */
  .crown-content { padding: 24px 8px !important; }
  /* prize-expansion::after uses right:-120px which can overflow   */
  .prize-expansion::after { right: 0 !important; }

  /* ── 12. HOST SECTION ──────────────────────────────────────── */
  .host-wrap          { gap: 16px !important; }
  .shared-section-head { padding-left: 0 !important; padding-right: 0 !important; }
  /* host-section has inline padding-top / explicit px-4 — already
     caught by rule 3; also cap any host-copy-wrap widths           */
  .host-copy-wrap { max-width: 100% !important; }

  /* ── 13. STAGE PILLS ───────────────────────────────────────── */
  /* stages-row already has overflow-x:auto — make sure it doesn't
     add left/right padding that creates blank space               */
  .stages-row { padding-left: 0 !important; padding-right: 0 !important; }

  /* ── 14. IMAGES — no accidental overflow ───────────────────── */
  img, video, picture { max-width: 100% !important; }

  /* ── 15. KICKER / SECTION-HEAD ALIGNMENT ───────────────────── */
  .section-head-left  { padding-left: 0 !important; }
  .section-head-right { padding-right: 0 !important; }

  /* ── 16. MODAL OVERLAY PADDING ─────────────────────────────── */
  /* modal-overlay has padding:20px which is fine; keep it         */

  /* ── 17. FORM / SPONSOR FORM SECTION ───────────────────────── */
  /* Right form panel has p-5 sm:p-7 lg:p-10 — on mobile p-5 = 20px.
     The container itself has px-4 which we already zero'd.
     Reduce inner panel padding so form doesn't feel cramped        */
  #sponsor-form-section .relative.p-5 { padding: 8px !important; }
  /* The inner form panel with rounded-[28px] border … p-5         */
  #sponsor-form-section .h-full.rounded-\[28px\] { padding: 16px !important; }

  /* ── 18. LEADERBOARD SHELL & FINAL CTA CARD INNER PADDING ───── */
  /* .leaderboard-shell has p-4 sm:p-6 → the sm:p-6 class adds 24px */
  .sm\:p-6 { padding: 12px !important; }
  .sm\:p-8 { padding: 12px !important; }

  /* Final CTA card inner: p-6 sm:p-8 — reduce horizontal sides    */
  .glass.rounded-3xl.p-6   { padding-left: 12px !important; padding-right: 12px !important; }
  .glass.rounded-3xl.glow-border { padding: 16px 12px !important; }

  /* ── 19. SPONSOR FORM SECTION — form panel padding ─────────── */
  /* The info panel has "p-6 sm:p-8 lg:p-10" — on phones use less  */
  .sm\:p-7 { padding: 8px !important; }
  /* Inner form box: h-full rounded-[28px] p-5 sm:p-6 lg:p-8       */
  .sm\:p-5 { padding: 8px !important; }
  /* General p-5 / p-6 / p-8 on mobile: reduce horizontal only     */
  .p-5 { padding-left: 12px !important; padding-right: 12px !important; }
  .p-6 { padding-left: 12px !important; padding-right: 12px !important; }
  .p-8 { padding-left: 12px !important; padding-right: 12px !important; }

  /* ── 20. BACK TO TOP BUTTON — keep inside viewport ─────────── */
  .back-to-top { right: 53px !important; bottom: 152px !important; }
}

@media (min-width: 768px) {
  .strike-img { margin-top: -13px !important; }
  .clock-overlay { transform: translateY(calc(-50% + 18px)) scale(1.05) !important; }
}

/* ── LEADERSHIP POPUP MENU ─────────────────────────────────── */
.team-menu-btn {
  background: linear-gradient(90deg, #f7b500, #0b6cff);
  color: #fff; border: none; padding: 14px 26px; border-radius: 999px;
  font-weight: 700; font-size: 15px; cursor: pointer;
  box-shadow: 0 0 18px rgba(247,181,0,.35);
}
.team-menu-modal { position: fixed; inset: 0; z-index: 9999; display: none; }
.team-menu-modal.active { display: block; }
.team-menu-overlay { position: absolute; inset: 0; background: rgba(0,0,0,.78); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.team-menu-panel {
  position: relative; width: min(1100px,92vw); max-height: 88vh;
  margin: 4vh auto;
  background: linear-gradient(180deg,rgba(9,13,24,.97),rgba(5,8,16,.98));
  border: 1px solid rgba(255,184,0,.28); border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 0 35px rgba(255,184,0,.15), 0 0 45px rgba(0,102,255,.12);
}
.team-menu-close {
  position: absolute; top: 18px; right: 18px; width: 42px; height: 42px;
  border-radius: 50%; border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.06); color: #fff; font-size: 28px; cursor: pointer; z-index: 2;
}
.team-menu-header {
  text-align: center; padding: 0;
  border-bottom: 1px solid rgba(255,255,255,.08);
  overflow: hidden;
}
.team-menu-logo { display: block; width: 100%; max-width: 100%; height: auto; margin: 0; }
.team-menu-header h2 {
  color: #fff; font-size: clamp(28px,4vw,42px); margin: 0; letter-spacing: .04em;
  padding: 20px 30px 24px;
  background: radial-gradient(circle at top left,rgba(247,181,0,.18),transparent 35%),
              radial-gradient(circle at top right,rgba(11,108,255,.16),transparent 35%);
}
.team-menu-content { padding: 28px; overflow-y: auto; max-height: calc(88vh - 180px); }
.team-department { margin-bottom: 22px; padding: 20px; border-radius: 18px; background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.08); }
.team-department h3 { margin: 0 0 16px; color: #f7b500; font-size: 22px; text-transform: uppercase; letter-spacing: .08em; }
.team-division { margin-bottom: 14px; padding: 14px 16px; border-left: 3px solid #0b6cff; background: rgba(255,255,255,.02); border-radius: 12px; }
.team-division h4 { margin: 0 0 8px; color: #fff; font-size: 16px; text-transform: uppercase; letter-spacing: .06em; }
.team-division p, .team-department p { margin: 6px 0; color: rgba(255,255,255,.88); line-height: 1.5; font-size: 15px; }
@media (max-width: 768px) {
  .team-menu-panel { width: 94vw; margin: 3vh auto; max-height: 92vh; border-radius: 20px; }
  .team-menu-content { padding: 18px; max-height: calc(92vh - 160px); }
  .team-menu-header { padding: 0; }
  .team-menu-logo { max-width: 100%; }
  .team-menu-header h2 { padding: 16px 20px 20px; }
  .team-department h3 { font-size: 18px; }
  .team-division h4 { font-size: 14px; }
  .team-division p, .team-department p { font-size: 14px; }
}
.sitemap-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 32px 24px; margin-bottom: 40px; }
@media (max-width: 600px) {
  .sitemap-grid { grid-template-columns: repeat(2, 1fr); gap: 24px 16px; }
}


/* ============================================================
   PAGE TOP BAR SYSTEM
   ============================================================ */
.page-with-topbar .min-h-screen {
  padding-top: 110px;
}

.page-top-bar {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 15px 30px;
  background: #000000;
  pointer-events: none;
}

.back-home-btn {
  pointer-events: auto;
  height: 48px;
  width: auto;
  display: block;
  flex-shrink: 0;
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.back-home-btn img {
  height: 100%;
  width: auto;
  display: block;
}

.back-home-btn:hover {
  transform: scale(1.05);
  opacity: 0.9;
}

.why-header,
.live-header,
.destination-header,
.previous-header,
.agency-header,
.host-header,
.pm-header {
  pointer-events: none;
  position: relative;
  overflow: hidden;
}

.why-header img,
.live-header img,
.destination-header img,
.previous-header img,
.agency-header img,
.host-header img,
.pm-header img {
  width: 100%;
  height: auto;
  display: block;
}

.why-header { max-width: 140px; }
.live-header { max-width: 360px; }
.destination-header { max-width: 320px; }
.previous-header { max-width: 320px; }
.agency-header { max-width: 340px; }
.host-header { max-width: 360px; }
.pm-header { max-width: 380px; }

.why-header::after,
.live-header::after,
.destination-header::after,
.previous-header::after,
.agency-header::after,
.host-header::after,
.pm-header::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 60%;
  height: 100%;
  background: linear-gradient(
    120deg,
    transparent,
    rgba(255, 215, 0, 0.35),
    transparent
  );
  animation: shimmerSweep var(--shimmer-speed) linear infinite;
  pointer-events: none;
  will-change: transform;
}

@media (max-width: 768px) {
  .page-with-topbar .min-h-screen {
    padding-top: 84px;
  }
  .page-top-bar {
    gap: 12px;
    padding: 10px 14px;
  }
  .back-home-btn {
    height: 40px;
  }
  .why-header {
    max-width: 92px !important;
  }
  .live-header,
  .destination-header,
  .previous-header,
  .agency-header,
  .host-header,
  .pm-header {
    max-width: min(56vw, 240px) !important;
  }
}

@media (max-width: 767px) {
  .page-top-bar,
  .mobile-page-topbar,
  header.page-header {
    min-height: 78px !important;
    padding: max(12px, calc(env(safe-area-inset-top) + 12px)) 16px 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    z-index: 10005 !important;
    pointer-events: none;
  }

  .page-top-bar {
    background: rgba(0, 0, 0, 0.94) !important;
  }

  .back-home-btn,
  .back-button {
    display: flex !important;
    align-items: center !important;
    min-height: 48px !important;
    max-width: 135px !important;
    width: auto !important;
    pointer-events: auto !important;
    flex: 0 1 auto !important;
    transform: none !important;
    opacity: 1 !important;
  }

  .back-home-btn img,
  .back-btn-img,
  img[src*="back"] {
    max-width: 135px !important;
    width: auto !important;
    height: auto !important;
    max-height: 42px !important;
    object-fit: contain !important;
    display: block !important;
    filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.22)) !important;
  }

  #mobile-menu-btn,
  #topbar-menu-btn,
  .mobile-menu-btn,
  .hamburger-btn {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    border-radius: 14px !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
    z-index: 10006 !important;
    position: relative !important;
    flex: 0 0 48px !important;
  }

  #mobile-menu-btn svg,
  #topbar-menu-btn svg,
  .mobile-menu-btn svg,
  .hamburger-btn svg {
    width: 26px !important;
    height: 26px !important;
  }

  body.page-with-topbar > main {
    padding-top: 82px !important;
    margin-top: 0 !important;
  }

  .page-with-topbar > .min-h-screen {
    padding-top: 82px !important;
  }

  body.page-with-topbar > main > section:first-child,
  body.page-with-topbar > .min-h-screen > section:first-child,
  body.page-with-topbar > .min-h-screen > main:first-child,
  body.page-with-topbar > main > .who-dashboard:first-child,
  body.page-with-topbar > main.who-wrap {
    scroll-margin-top: 92px !important;
  }

  body.page-with-topbar #mobile-menu {
    top: 78px !important;
    right: 16px !important;
    width: min(320px, calc(100vw - 32px)) !important;
    max-height: calc(100svh - 94px) !important;
    z-index: 10007 !important;
  }

  .topbar-center-label,
  .topbar-divider {
    display: none !important;
  }
}

/* ============================================================
   DESKTOP TOP BAR — OPTION A (3-PART BROADCAST LAYOUT)
   ============================================================ */
@media (min-width: 768px) {
  .page-top-bar {
    min-height: 110px !important;
    padding: max(24px, calc(env(safe-area-inset-top) + 24px)) 32px 24px !important;
    display: grid !important;
    grid-template-columns: 220px 1fr 80px !important;
    align-items: center !important;
    position: fixed !important;
    z-index: 9999 !important;
    overflow: visible !important;
  }

  .back-home-btn {
    height: auto !important;
    max-width: 220px !important;
    width: 220px !important;
    display: flex !important;
    align-items: center !important;
    justify-self: start !important;
    align-self: center !important;
    margin-top: 0 !important;
    transform: none !important;
  }

  .back-home-btn img {
    max-width: 220px !important;
    width: 220px !important;
    height: auto !important;
    object-fit: contain !important;
  }

  .topbar-center-label {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    pointer-events: none !important;
    justify-self: center !important;
    align-self: center !important;
    gap: 2px !important;
  }

  .topbar-center-label .eyebrow {
    font-family: 'Barlow Condensed', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: 0.32em !important;
    color: #f5c15d !important;
    text-transform: uppercase !important;
    line-height: 1.2 !important;
    display: block !important;
  }

  .topbar-center-label .title {
    font-family: 'Bebas Neue', sans-serif !important;
    font-size: 26px !important;
    letter-spacing: 0.18em !important;
    color: #ffffff !important;
    text-transform: uppercase !important;
    line-height: 1 !important;
    display: block !important;
    text-shadow: 0 0 18px rgba(245,193,93,0.22) !important;
  }

  .topbar-center-label .title span {
    color: #f5c15d !important;
  }

  .topbar-divider {
    display: block !important;
    position: absolute !important;
    left: 32px !important;
    right: 32px !important;
    bottom: 0 !important;
    height: 1px !important;
    background: linear-gradient(90deg, transparent, rgba(245,193,93,0.75), transparent) !important;
    box-shadow: 0 0 14px rgba(245,193,93,0.35) !important;
    pointer-events: none !important;
  }

  .page-top-bar #topbar-menu-btn,
  .page-top-bar #mobile-menu-btn {
    justify-self: end !important;
    align-self: center !important;
    pointer-events: auto !important;
    z-index: 10000 !important;
    position: relative !important;
    top: auto !important;
    right: auto !important;
    width: 62px !important;
    height: 62px !important;
    min-width: 62px !important;
    min-height: 62px !important;
    border-radius: 16px !important;
    margin-top: 0 !important;
    transform: none !important;
    translate: none !important;
  }

  .page-top-bar #topbar-menu-btn svg,
  .page-top-bar #mobile-menu-btn svg {
    width: 32px !important;
    height: 32px !important;
  }

  .page-with-topbar > main,
  .page-with-topbar > .min-h-screen {
    padding-top: 118px !important;
  }

  body.page-with-topbar #mobile-menu {
    top: 110px !important;
  }
}

/* ============================================================
   PILL NAVIGATION FOOTER
   ============================================================ */
.pill-links-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 16px;
  margin-top: 32px;
  margin-bottom: 32px;
}

.pill-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(245,193,93,0.28);
  border-radius: 20px;
  padding: 20px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: border-color 0.2s ease, background 0.2s ease;
}

.pill-card:hover {
  background: rgba(255,255,255,0.05);
  border-color: rgba(245,193,93,0.5);
}

.pill-card h3 {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1rem;
  letter-spacing: 0.18em;
  color: #f5c15d;
  margin: 0 0 10px 0;
}

.pill-card a {
  display: block;
  color: rgba(255,255,255,0.6);
  font-size: 0.85rem;
  text-decoration: none;
  padding: 4px 0;
  transition: color 0.2s ease;
}

.pill-card a:hover {
  color: #ffffff;
}

@media (max-width: 600px) {
  .pill-links-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
  .pill-card {
    padding: 14px;
    border-radius: 14px;
  }
}

/* ============================================================
   GLOBAL TYPOGRAPHY LOCK
   ============================================================ */
:root {
  --type-eyebrow-size: clamp(0.72rem, 0.92vw, 0.92rem);
  --type-eyebrow-line: 0.96;
  --type-eyebrow-tracking: 0.08em;
  --rc-title-size: calc(clamp(2.2rem, 4.2vw, 3.8rem) * 0.7);
  --rc-accent-size: calc(var(--rc-title-size) * 0.9);
  --type-hero-size: calc(clamp(2.2rem, 4.2vw, 3.8rem) * 0.7);
  --type-hero-line: 0.88;
  --type-hero-tracking: -0.01em;
  --type-power-size: clamp(1.05rem, 2vw, 1.7rem);
  --type-power-line: 1.05;
  --type-power-tracking: 0.08em;
}

body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
span,
a,
button,
li,
label,
small,
strong,
input,
textarea,
select {
  font-family: 'Bebas Neue', sans-serif !important;
}

.eyebrow,
.section-label,
.section-broadcast-eyebrow,
.shared-section-head > span,
.kicker,
.hero-eyebrow,
.tp-eyebrow,
.tp-note-kicker,
.why-kicker,
.cw-eyebrow,
.pm-day-kicker,
.pm-hero-kicker,
.form-success-eyebrow,
.champion-modal-eyebrow,
.agency-badge,
.agency-mobile-kicker,
.modal-tag,
.rules-kicker,
.card-tag,
.pill-card h3,
.topbar-center-label .eyebrow,
[class$="-eyebrow"],
[class$="-kicker"] {
  font-family: 'Bebas Neue', sans-serif !important;
  font-size: var(--type-eyebrow-size) !important;
  line-height: var(--type-eyebrow-line) !important;
  letter-spacing: var(--type-eyebrow-tracking) !important;
  text-transform: uppercase !important;
  color: #f5c15d !important;
}

.section-heading,
.hero-title,
.tp-title,
.why-headline,
.pm-hero-title,
.topbar-center-label .title,
.section-broadcast-title,
.shared-section-head > h2,
.host-title,
.modal-title,
.form-success-title,
.champion-title,
.title {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  column-gap: 0.08em;
  row-gap: 0;
}

h1,
h2,
.hero-title,
.section-title,
.section-broadcast-title,
.shared-section-head > h2,
.host-card-title,
.host-title,
.card-title,
.cs-title,
.modal-title,
.rules-heading,
.crown-title,
.cw-title,
.pm-day-title,
.pm-hero-title,
.form-success-title,
.champion-title,
.team-menu-header h2,
.team-department h3,
.team-division h4,
.stage-name,
.final-crown-rail-value,
.pm-hero-stat-value,
.cw-media-badge strong,
.cta-enhanced h2,
.agency-mobile-title h3,
.tp-title,
.why-headline,
.topbar-center-label .title,
[class$="-title"],
[class$="-headline"] {
  font-family: 'Bebas Neue', sans-serif !important;
  font-size: var(--type-hero-size) !important;
  line-height: var(--type-hero-line) !important;
  letter-spacing: var(--type-hero-tracking) !important;
  text-transform: none !important;
  color: #ffffff;
  word-break: normal;
  overflow-wrap: anywhere;
}

.section-heading > span,
.hero-title > span,
.tp-title > span,
.why-headline > span,
.pm-hero-title > span,
.topbar-center-label .title > span,
.title > span {
  flex: 0 0 auto;
}

.hero-sub,
.power-line,
.callout-line,
.callout-copy,
.form-success-copy,
.champion-text,
.topbar-center-label .power-line,
[class$="-callout"],
[class$="-power"] {
  font-family: 'Bebas Neue', sans-serif !important;
  font-size: var(--type-power-size) !important;
  line-height: var(--type-power-line) !important;
  letter-spacing: var(--type-power-tracking) !important;
  text-transform: uppercase !important;
}

.topbar-center-label .title {
  font-size: clamp(1.15rem, 1.75vw, 1.6rem) !important;
  line-height: 0.94 !important;
  letter-spacing: 0.14em !important;
}

.hero-title span,
.tp-title span,
.why-headline span,
.topbar-center-label .title span,
.title span {
  color: #f5c15d;
}

@media (max-width: 767px) {
  .section-heading,
  .hero-title,
  .tp-title,
  .why-headline,
  .pm-hero-title,
  .topbar-center-label .title,
  .title {
    column-gap: 0.08em;
    row-gap: 0;
  }

  .topbar-center-label .title {
    font-size: clamp(1rem, 4vw, 1.2rem) !important;
  }
}

/* ============================================================
   TYPOGRAPHY MASTER OVERRIDE
   ============================================================ */

/* Heading containers — tight gap */
.section-heading,
.rc-title {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: baseline !important;
  column-gap: 0.08em !important;
  row-gap: 0 !important;
  line-height: 0.88 !important;
  margin: 0 !important;
}

/* White title text */
.section-heading-main {
  font-size: var(--rc-title-size) !important;
  line-height: 0.88 !important;
  letter-spacing: -0.01em !important;
  text-transform: none !important;
}

/* Gold / shimmer title text */
.section-heading-accent,
.section-heading .real-opportunity-shimmer,
.rc-title .gold,
.rc-title .real-opportunity-shimmer {
  font-size: var(--rc-accent-size) !important;
  line-height: 0.88 !important;
  letter-spacing: -0.01em !important;
  text-transform: none !important;
  margin-left: 0 !important;
}

/* Eyebrow / kicker text */
.rc-eyebrow,
.kicker,
.eyebrow,
.pm-hero-kicker,
.pm-day-kicker {
  font-size: clamp(0.72rem, 0.92vw, 0.92rem) !important;
  letter-spacing: 0.08em !important;
  text-transform: none !important;
}

/* Body paragraph text */
p,
.rules-subtext,
.desc,
.card-sub,
.modal-desc,
.sub,
.muted,
.mini-text,
.sig-sub,
.champion-text {
  font-size: 17px !important;
  line-height: 1.45 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* Protect topbar center label from global p override */
.topbar-center-label .eyebrow,
.topbar-center-label .title {
  font-size: revert !important;
}
.topbar-center-label .eyebrow {
  font-size: 11px !important;
  letter-spacing: 0.32em !important;
}

/* Protect countdown labels */
.countdown-box .label {
  font-size: 0.75rem !important;
  letter-spacing: 0.2em !important;
}

/* Protect pill-card navigation links */
.pill-card a,
.pill-card h3 {
  font-size: revert !important;
  letter-spacing: revert !important;
}


/* ============================================================
   REAL NAV + GOLD SHIMMER SYSTEM PATCH
   Applied by Kai, refined inside-page back/hamburger system
   ============================================================ */
:root {
  --rc-nav-gold: #f5c15d;
  --rc-nav-gold-border: rgba(245,193,93,0.35);
}

.page-top-bar {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 120 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  padding: 14px 24px !important;
  background: linear-gradient(180deg, rgba(0,0,0,.62), rgba(0,0,0,.08)) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  pointer-events: auto !important;
}

.back-home-btn,
#topbar-menu-btn,
#mobile-menu-btn {
  width: 54px !important;
  height: 54px !important;
  min-width: 54px !important;
  min-height: 54px !important;
  border-radius: 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  position: relative !important;
  overflow: hidden !important;
  background: rgba(0,0,0,0.45) !important;
  border: 1px solid var(--rc-nav-gold-border) !important;
  box-shadow:
    0 0 0 1px rgba(245,193,93,0.15),
    0 0 12px rgba(245,193,93,0.18),
    0 0 24px rgba(245,193,93,0.08) !important;
  cursor: pointer !important;
}

.back-home-btn img,
#topbar-menu-btn svg,
#mobile-menu-btn svg {
  width: 30px !important;
  height: 30px !important;
  object-fit: contain !important;
  position: relative !important;
  z-index: 2 !important;
}

.nav-gold-shimmer { position: relative !important; overflow: hidden !important; }
.nav-gold-shimmer::after {
  content: "";
  position: absolute;
  top: 0;
  left: -160%;
  width: 65%;
  height: 100%;
  background: linear-gradient(120deg, transparent 0%, rgba(245,193,93,0.08) 35%, rgba(255,255,255,0.28) 50%, rgba(245,193,93,0.08) 65%, transparent 100%);
  transform: skewX(-22deg);
  animation: rcGoldSweep 3.5s infinite;
  pointer-events: none;
  z-index: 1;
}

@keyframes rcGoldSweep {
  0% { left: -160%; }
  100% { left: 160%; }
}

.gold-line-shimmer,
.final-crown-divider-longer,
.tp-divider,
.tp-heading-rule,
.tp-note-rule,
.tp-sponsor-rule,
.why-hero-divider-top,
.why-hero-divider-bottom,
.host-divider,
.gold-line,
.destination-gold-line,
[class*="divider"],
[class*="gold-line"],
[class*="heading-rule"] {
  position: relative !important;
  overflow: hidden !important;
}

.gold-line-shimmer::after,
.final-crown-divider-longer::after,
.tp-divider::after,
.tp-heading-rule::after,
.tp-note-rule::after,
.tp-sponsor-rule::after,
.why-hero-divider-top::after,
.why-hero-divider-bottom::after,
.host-divider::after,
.gold-line::after,
.destination-gold-line::after,
[class*="divider"]::after,
[class*="gold-line"]::after,
[class*="heading-rule"]::after {
  content: "";
  position: absolute;
  top: 0;
  left: -160%;
  width: 45%;
  height: 100%;
  background: linear-gradient(120deg, transparent 0%, rgba(245,193,93,0.12) 35%, rgba(255,255,255,0.45) 50%, rgba(245,193,93,0.12) 65%, transparent 100%);
  transform: skewX(-22deg);
  animation: rcGoldSweep 3.5s infinite;
  pointer-events: none;
}

@media (hover:hover) {
  .nav-gold-shimmer:hover,
  .back-home-btn:hover,
  #topbar-menu-btn:hover,
  #mobile-menu-btn:hover {
    box-shadow:
      0 0 0 1px rgba(245,193,93,0.25),
      0 0 16px rgba(245,193,93,0.28),
      0 0 30px rgba(245,193,93,0.12) !important;
  }
}

@media (max-width: 768px) {
  .page-top-bar {
    padding: 12px 14px !important;
    gap: 10px !important;
  }
  .back-home-btn,
  #topbar-menu-btn,
  #mobile-menu-btn {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    border-radius: 12px !important;
  }
  .back-home-btn img,
  #topbar-menu-btn svg,
  #mobile-menu-btn svg {
    width: 26px !important;
    height: 26px !important;
  }
}

/* ============================================================
   INSIDE PAGE MASTER SYSTEM
   ============================================================ */
body.page-with-topbar {
  --rc-inside-topbar-min-height: 118px;
  --rc-inside-topbar-padding: 14px 26px;
  --rc-inside-back-width: 154px;
  --rc-inside-back-height: 78px;
  --rc-inside-back-radius: 20px;
  --rc-inside-back-padding: 6px;
  --rc-inside-menu-size: 62px;
  --rc-inside-menu-radius: 16px;
  --rc-inside-icon-size: 32px;
  --rc-inside-main-offset: 75px;
  --rc-inside-first-section-offset: 40px;
  --rc-inside-glass-bg: rgba(0, 0, 0, 0.45);
  --rc-inside-border: rgba(245, 193, 93, 0.35);
  --rc-inside-ring: rgba(245, 193, 93, 0.15);
  --rc-inside-glow: rgba(245, 193, 93, 0.22);
  --rc-inside-glow-soft: rgba(245, 193, 93, 0.1);
}

body.page-with-topbar .page-top-bar {
  min-height: var(--rc-inside-topbar-min-height) !important;
  padding: var(--rc-inside-topbar-padding) !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 20px !important;
  background: rgba(5, 7, 13, 0.44) !important;
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  backdrop-filter: blur(18px) saturate(140%);
  pointer-events: none;
}

body.page-with-topbar .page-top-bar::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0) 65%);
  pointer-events: none;
}

body.page-with-topbar .page-top-bar .back-home-btn,
body.page-with-topbar .page-top-bar #topbar-menu-btn {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  flex-shrink: 0 !important;
  pointer-events: auto !important;
  background: var(--rc-inside-glass-bg) !important;
  border: 1px solid var(--rc-inside-border) !important;
  box-shadow:
    0 0 0 1px var(--rc-inside-ring),
    0 0 18px var(--rc-inside-glow),
    0 0 34px var(--rc-inside-glow-soft) !important;
}

body.page-with-topbar .page-top-bar .back-home-btn {
  width: var(--rc-inside-back-width) !important;
  height: var(--rc-inside-back-height) !important;
  min-width: var(--rc-inside-back-width) !important;
  min-height: var(--rc-inside-back-height) !important;
  border-radius: var(--rc-inside-back-radius) !important;
  padding: var(--rc-inside-back-padding) !important;
}

body.page-with-topbar .page-top-bar .back-home-btn img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  display: block !important;
}

body.page-with-topbar .page-top-bar #topbar-menu-btn {
  width: var(--rc-inside-menu-size) !important;
  height: var(--rc-inside-menu-size) !important;
  min-width: var(--rc-inside-menu-size) !important;
  min-height: var(--rc-inside-menu-size) !important;
  border-radius: var(--rc-inside-menu-radius) !important;
}

body.page-with-topbar .page-top-bar #topbar-menu-btn svg {
  width: var(--rc-inside-icon-size) !important;
  height: var(--rc-inside-icon-size) !important;
}

body.page-with-topbar .page-top-bar .back-home-btn::before,
body.page-with-topbar .page-top-bar #topbar-menu-btn::before {
  content: "";
  position: absolute;
  top: -35%;
  left: -170%;
  width: 70%;
  height: 170%;
  background: linear-gradient(120deg, transparent 0%, rgba(255, 255, 255, 0.06) 28%, rgba(245, 193, 93, 0.42) 50%, rgba(255, 255, 255, 0.06) 72%, transparent 100%);
  transform: skewX(-22deg);
  animation: rcGoldSweep 3.5s linear infinite;
  pointer-events: none;
}

body.page-with-topbar > main:first-of-type,
body.page-with-topbar > .min-h-screen:first-of-type,
body.page-with-topbar > .why-page-main:first-of-type,
body.page-with-topbar > .who-wrap:first-of-type {
  padding-top: var(--rc-inside-main-offset) !important;
  margin-top: 0 !important;
}

body.page-with-topbar > main:first-of-type > section:first-child,
body.page-with-topbar > .min-h-screen:first-of-type > main:first-of-type > section:first-child,
body.page-with-topbar > .why-page-main:first-of-type > section:first-child,
body.page-with-topbar > .who-wrap:first-of-type > section:first-child {
  padding-top: var(--rc-inside-first-section-offset) !important;
  margin-top: 0 !important;
}

body.page-with-topbar > main:first-of-type > section:first-child .final-crown-divider-longer:first-child,
body.page-with-topbar > main:first-of-type > section:first-child .tp-divider:first-child,
body.page-with-topbar > main:first-of-type > section:first-child .tp-heading-rule:first-child,
body.page-with-topbar > main:first-of-type > section:first-child .who-hero-rule:first-child,
body.page-with-topbar > main:first-of-type > section:first-child .destination-gold-line:first-child,
body.page-with-topbar > main:first-of-type > section:first-child .why-hero-divider-top:first-child,
body.page-with-topbar > .why-page-main:first-of-type > section:first-child .final-crown-divider-longer:first-child,
body.page-with-topbar > .why-page-main:first-of-type > section:first-child .why-hero-divider-top:first-child,
body.page-with-topbar > .who-wrap:first-of-type > section:first-child .who-hero-rule:first-child {
  margin-top: 0 !important;
}

body.page-with-topbar > main:first-of-type > section:first-child .destination-title-img,
body.page-with-topbar > main:first-of-type > section:first-child .pm-lounge-head,
body.page-with-topbar > .who-wrap:first-of-type > section:first-child .who-hero-shell {
  margin-top: 0 !important;
}
body.page-with-topbar > main:first-of-type > section:first-child .why-title-img,
body.page-with-topbar > .why-page-main:first-of-type > section:first-child .why-title-img {
  margin-top: 30px !important;
}

@media (max-width: 767px) {
  body.page-with-topbar {
    --rc-inside-topbar-min-height: 96px;
    --rc-inside-topbar-padding: 12px 14px;
    --rc-inside-back-width: 126px;
    --rc-inside-back-height: 64px;
    --rc-inside-back-radius: 17px;
    --rc-inside-back-padding: 5px;
    --rc-inside-main-offset: 68px;
    --rc-inside-first-section-offset: 34px;
  }
}

/* KAI FINAL PATCH back button trusted scroll */


.page-top-bar .back-home-btn,.page-top-bar #topbar-menu-btn,.page-top-bar #mobile-menu-btn,.back-home-btn,#topbar-menu-btn,#mobile-menu-btn{width:54px!important;height:54px!important;min-width:54px!important;min-height:54px!important;max-width:54px!important;max-height:54px!important;border-radius:14px!important;padding:0!important;display:flex!important;align-items:center!important;justify-content:center!important;flex-shrink:0!important;aspect-ratio:1/1!important}
.page-top-bar .back-home-btn img,.back-home-btn img{width:32px!important;height:32px!important;max-width:32px!important;max-height:32px!important;object-fit:contain!important;display:block!important}
.page-top-bar #topbar-menu-btn svg,.page-top-bar #mobile-menu-btn svg,#topbar-menu-btn svg,#mobile-menu-btn svg{width:28px!important;height:28px!important;max-width:28px!important;max-height:28px!important}
.rc-trusted-scroll-wrap{position:relative!important;width:100%!important;overflow-x:auto!important;overflow-y:hidden!important;padding:18px 0 6px!important;margin:18px auto 34px!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:thin!important;scrollbar-color:#f5c15d rgba(255,255,255,.06)!important;mask-image:linear-gradient(to right,transparent 0,black 5%,black 95%,transparent 100%);-webkit-mask-image:linear-gradient(to right,transparent 0,black 5%,black 95%,transparent 100%)}
.rc-trusted-scroll-wrap::-webkit-scrollbar{height:8px!important}.rc-trusted-scroll-wrap::-webkit-scrollbar-track{background:rgba(255,255,255,.06)!important;border-radius:999px!important}.rc-trusted-scroll-wrap::-webkit-scrollbar-thumb{background:linear-gradient(90deg,#f5c15d,#8d691f)!important;border-radius:999px!important}
.rc-trusted-scroll{display:flex!important;align-items:center!important;gap:18px!important;width:max-content!important;min-width:max-content!important;flex-wrap:nowrap!important;animation:rcTrustedMarquee 34s linear infinite!important;will-change:transform!important}.rc-trusted-scroll-wrap:hover .rc-trusted-scroll{animation-play-state:paused!important}
.rc-trusted-group{display:flex!important;align-items:stretch!important;flex-wrap:nowrap!important;gap:18px!important;padding-right:18px!important}.rc-trusted-pill{flex:0 0 auto!important;min-width:210px!important;min-height:82px!important;border-radius:22px!important;border:1px solid rgba(245,193,93,.24)!important;background:linear-gradient(135deg,rgba(255,255,255,.055),rgba(255,255,255,.018))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 18px 45px rgba(0,0,0,.32)!important;display:flex!important;flex-direction:column!important;justify-content:center!important;padding:16px 18px!important}
.rc-trusted-pill strong{color:#fff!important;font-family:'Bebas Neue',sans-serif!important;font-size:1.22rem!important;line-height:.95!important;letter-spacing:.08em!important}.rc-trusted-pill span{margin-top:8px!important;color:rgba(245,193,93,.82)!important;font-family:'Barlow Condensed',sans-serif!important;font-size:.82rem!important;line-height:1!important;letter-spacing:.14em!important}
@keyframes rcTrustedMarquee{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@media(max-width:768px){.page-top-bar .back-home-btn,.page-top-bar #topbar-menu-btn,.page-top-bar #mobile-menu-btn,.back-home-btn,#topbar-menu-btn,#mobile-menu-btn{width:48px!important;height:48px!important;min-width:48px!important;min-height:48px!important;max-width:48px!important;max-height:48px!important;border-radius:12px!important}.page-top-bar .back-home-btn img,.back-home-btn img,.page-top-bar #topbar-menu-btn svg,.page-top-bar #mobile-menu-btn svg,#topbar-menu-btn svg,#mobile-menu-btn svg{width:28px!important;height:28px!important;max-width:28px!important;max-height:28px!important}.rc-trusted-pill{min-width:176px!important;min-height:74px!important;border-radius:18px!important;padding:14px 16px!important}}



/* ============================================================
   KAI SAFE NAV PATCH — APPEND ONLY
   Do not use this as a standalone stylesheet.
   This keeps the full site styling and only fixes navbar/menu.
   ============================================================ */

/* Remove center title only */
.topbar-center,
.topbar-title,
.page-top-bar .topbar-center,
.page-top-bar .topbar-title {
  display: none !important;
}

/* Remove bottom border/line under nav only */
.page-top-bar,
#site-header {
  border-bottom: none !important;
}

/* Keep hamburger visible in top-right */
#topbar-menu-btn,
#mobile-menu-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: fixed !important;
  top: 18px !important;
  right: 18px !important;
  left: auto !important;
  bottom: auto !important;
  z-index: 100001 !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

/* Keep the dropdown anchored to the hamburger/top-right */
#mobile-menu,
.mobile-menu {
  position: fixed !important;
  top: 88px !important;
  right: 18px !important;
  left: auto !important;
  bottom: auto !important;
  inset: auto 18px auto auto !important;

  width: min(320px, calc(100vw - 36px)) !important;
  max-width: min(320px, calc(100vw - 36px)) !important;
  max-height: calc(100vh - 112px) !important;

  margin: 0 !important;
  transform: translate3d(0, -8px, 0) !important;
  transform-origin: top right !important;

  z-index: 100000 !important;

  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;

  overflow-y: auto !important;
  border-radius: 18px !important;

  transition:
    opacity 0.22s ease,
    transform 0.22s ease,
    visibility 0.22s ease !important;
}

#mobile-menu.is-open,
.mobile-menu.is-open {
  right: 18px !important;
  left: auto !important;
  inset: auto 18px auto auto !important;

  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translate3d(0, 0, 0) !important;
}

/* If JS adds hidden class, open state still wins */
#mobile-menu.is-open.hidden,
.mobile-menu.is-open.hidden {
  display: block !important;
}

/* Mobile */
@media (max-width: 767px) {
  #topbar-menu-btn,
  #mobile-menu-btn {
    top: 14px !important;
    right: 14px !important;
  }

  #mobile-menu,
  .mobile-menu {
    top: 78px !important;
    right: 14px !important;
    left: auto !important;
    inset: auto 14px auto auto !important;

    width: min(320px, calc(100vw - 28px)) !important;
    max-width: min(320px, calc(100vw - 28px)) !important;
    max-height: calc(100vh - 96px) !important;
  }

  #mobile-menu.is-open,
  .mobile-menu.is-open {
    right: 14px !important;
    left: auto !important;
    inset: auto 14px auto auto !important;
  }
}


/* ============================================================
   KAI MOBILE-ONLY NAV SIZE FIX — DESKTOP UNTOUCHED
   Purpose: why.html uses the global .page-top-bar / #topbar-menu-btn structure.
   This patch only runs under 767px so desktop stays exactly as-is.
   ============================================================ */
@media (max-width: 767px) {
  .page-top-bar {
    padding: 12px 14px !important;
    min-height: 84px !important;
  }

  .page-top-bar .back-home-btn,
  .page-top-bar #topbar-menu-btn,
  .page-top-bar #mobile-menu-btn,
  .back-home-btn,
  #topbar-menu-btn,
  #mobile-menu-btn {
    width: 60px !important;
    height: 60px !important;
    min-width: 60px !important;
    min-height: 60px !important;
    max-width: 60px !important;
    max-height: 60px !important;
    border-radius: 16px !important;
  }

  .page-top-bar .back-home-btn img,
  .back-home-btn img {
    width: 60px !important;
    height: 60px !important;
    min-width: 60px !important;
    min-height: 60px !important;
    max-width: 60px !important;
    max-height: 60px !important;
    object-fit: contain !important;
    border-radius: 16px !important;
  }

  #topbar-menu-btn .hamburger-line,
  #mobile-menu-btn .hamburger-line {
    width: 28px !important;
    height: 3px !important;
    border-radius: 999px !important;
  }

  #topbar-menu-btn,
  #mobile-menu-btn {
    top: 12px !important;
    right: 14px !important;
  }

  #mobile-menu,
  .mobile-menu {
    top: 84px !important;
    right: 14px !important;
    left: auto !important;
    inset: auto 14px auto auto !important;
    width: min(340px, calc(100vw - 28px)) !important;
    max-width: min(340px, calc(100vw - 28px)) !important;
    max-height: calc(100vh - 100px) !important;
  }

  #mobile-menu.is-open,
  .mobile-menu.is-open {
    right: 14px !important;
    left: auto !important;
    inset: auto 14px auto auto !important;
  }

  .why-page-main {
    padding-top: 96px !important;
  }
}

/* ============================================================
   KAI MOBILE-ONLY HAMBURGER LINE FIX — DESKTOP UNTOUCHED
   Fixes why.html button that uses <span class="hamburger-line"></span>
   instead of an SVG icon.
   ============================================================ */
@media (max-width: 767px) {
  .page-top-bar #topbar-menu-btn,
  .page-top-bar #mobile-menu-btn,
  #topbar-menu-btn,
  #mobile-menu-btn {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  .page-top-bar #topbar-menu-btn .hamburger-line,
  .page-top-bar #mobile-menu-btn .hamburger-line,
  #topbar-menu-btn .hamburger-line,
  #mobile-menu-btn .hamburger-line {
    display: block !important;
    width: 30px !important;
    height: 3px !important;
    min-height: 3px !important;
    max-height: 3px !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, #f5c15d, #fff2a8, #f5c15d) !important;
    box-shadow: 0 0 8px rgba(245,193,93,.65) !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    position: relative !important;
  }
}

/* ============================================================
   FINAL MOBILE HERO VIDEO FIX, MOBILE ONLY
   Shows full video, edge to edge, no top/side padding
   ============================================================ */
@media (max-width: 767px) {
  html,
  body {
    margin: 0 !important;
    padding: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    overflow-x: hidden !important;
    background: #000 !important;
  }

  #hero-video {
    position: relative !important;
    width: 100vw !important;
    max-width: 100vw !important;
    min-height: 100svh !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    overflow: visible !important;
    background: #000 !important;
  }

  #hero-video,
  #hero-video .relative,
  #hero-video .absolute,
  #hero-video .inset-0,
  #hero-video video,
  #hero-video iframe {
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    max-width: none !important;
  }

  #hero-video video {
    position: relative !important;
    display: block !important;
    width: 100vw !important;
    height: auto !important;
    min-height: auto !important;
    object-fit: contain !important;
    object-position: top center !important;
    background: #000 !important;
  }

  #hero-video .max-w-7xl,
  #hero-video .max-w-\[1800px\],
  #hero-video .mx-auto,
  #hero-video .container,
  #hero-video .grid {
    width: 100vw !important;
    max-width: 100vw !important;
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  main,
  section {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* ============================================================
   DEFINITIVE MOBILE HERO VIDEO — FINAL AUTHORITY
   Selector body #hero-video has specificity (1,0,1) which beats
   every previous #hero-video (1,0,0) rule, including the inline
   <style> blocks injected into the HTML head.
   ============================================================ */
@media (max-width: 767px) {

  /* Root: strip any browser-default margin/padding */
  html,
  body {
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: clip !important;
  }

  /* Hero section: fills viewport exactly */
  body #hero-video {
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100svh !important;
    min-height: 100svh !important;
    overflow: hidden !important;
    background: #000 !important;
    transform: none !important;
  }

  /* Mobile video: cover fill, anchored top so logo + CTA stay visible */
  body #hero-video .hv-vid-mobile {
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: cover !important;
    object-position: center center !important;
    background: #000 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    transform: none !important;
  }

  /* Desktop video hidden on mobile */
  body #hero-video .hv-vid-desktop {
    display: none !important;
  }

  /* Strike image — shift down */
  body img.strike-img {
    transform: translateY(190px) !important;
    position: relative !important;
    z-index: 1 !important;
  }
  .countdown-section-wrap {
    position: relative !important;
    z-index: 100 !important;
  }
  .countdown-section-wrap .w-full,
  .countdown-section-wrap .relative {
    position: relative !important;
    z-index: 100 !important;
    overflow: visible !important;
  }
}

/* ============================================================
   REAL VIDEO PAGE MERGE, HOMEPAGE FINAL AUTHORITY
   Keeps the proven real-video-page behavior inside renewChamp.
   Desktop: Video30.webm. Mobile: Mobile-phone.webm.
   ============================================================ */
html,
body {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: 100vw !important;
  overflow-x: clip !important;
  background: #000 !important;
}

body {
  position: relative !important;
}

#site-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 10000 !important;
  background: transparent !important;
  pointer-events: none !important;
}

#site-header > div,
#mobile-menu-btn,
#mobile-menu {
  pointer-events: auto !important;
}

#site-header nav,
#site-header a[href="index.html"] {
  display: none !important;
}

#site-header > div {
  justify-content: flex-end !important;
  padding: max(12px, env(safe-area-inset-top)) 18px 12px 18px !important;
}

#mobile-menu-btn {
  display: flex !important;
  width: 54px !important;
  height: 54px !important;
  min-width: 54px !important;
  min-height: 54px !important;
  border-radius: 14px !important;
  background: rgba(0, 0, 0, 0.55) !important;
  border: 1px solid rgba(245, 193, 93, 0.45) !important;
  box-shadow: 0 14px 38px rgba(0,0,0,.45), inset 0 0 18px rgba(245,193,93,.10) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}

#hero-video {
  position: relative !important;
  isolation: isolate !important;
  display: block !important;
  width: 100vw !important;
  max-width: none !important;
  height: 100vh !important;
  height: 100svh !important;
  min-height: 100vh !important;
  min-height: 100svh !important;
  margin: 0 !important;
  padding: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  overflow: hidden !important;
  background: #000 !important;
}

#hero-video .hero-video,
#hero-video .hv-vid-dynamic {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100svh !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  object-fit: cover !important;
  object-position: center center !important;
  background: #000 !important;
  z-index: 0 !important;
  pointer-events: none !important;
}


.countdown-section-wrap {
  margin-top: -2px !important;
  position: relative !important;
  z-index: 2 !important;
}

.countdown-section-wrap .strike-img {
  margin-top: 0 !important;
  transform: none !important;
}

@media (max-width: 768px) {
  html,
  body {
    margin: 0 !important;
    padding: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    overflow-x: clip !important;
    background: #000 !important;
  }

  #site-header > div {
    padding: max(10px, env(safe-area-inset-top)) 12px 10px 12px !important;
  }

  #mobile-menu-btn {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    border-radius: 12px !important;
  }

  #hero-video {
    width: 100vw !important;
    height: 100svh !important;
    min-height: 100svh !important;
    margin: 0 !important;
    padding: 0 !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    overflow: hidden !important;
  }

  #hero-video .hero-video,
  #hero-video .hv-vid-dynamic {
    width: 100vw !important;
    height: 100svh !important;
    object-fit: contain !important;
    object-position: center center !important;
  }

  .countdown-section-wrap {
    margin-top: -2px !important;
  }

  .countdown-section-wrap .strike-img {
    margin-top: 0 !important;
    transform: translateY(-2px) !important;
  }
}


/* ============================================================
   KAI FINAL MOBILE VIDEO FIX — EDGE TO EDGE, TOP TO BOTTOM
   This overrides every earlier mobile contain rule.
   ============================================================ */
@media (max-width: 768px) {
  html,
  body {
    width: 100vw !important;
    max-width: 100vw !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    background: #000 !important;
  }

  body #hero-video {
    position: relative !important;
    display: block !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100vh !important;
    height: 100svh !important;
    min-height: 100vh !important;
    min-height: 100svh !important;
    margin: 0 !important;
    margin-left: 0 !important;
    padding: 0 !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    overflow: hidden !important;
    background: #000 !important;
  }

  body #hero-video video,
  body #hero-video .hero-video,
  body #hero-video .hv-vid-dynamic {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100vw !important;
    max-width: none !important;
    height: 100vh !important;
    height: 100svh !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    object-fit: cover !important;
    object-position: center center !important;
    background: #000 !important;
  }

  body .countdown-section-wrap {
    margin-top: -2px !important;
  }

  body .countdown-section-wrap picture,
  body .countdown-section-wrap img.strike-img {
    position: relative !important;
    top: -2px !important;
  }
}

@media (max-width: 767px) {
  #first-strike .rc-eyebrow {
    display: block !important;
    margin-top: 10px !important;
  }
}

@media (max-width: 767px) {
  .featured-img-wrap {
    overflow: hidden !important;
    transform: translateZ(0) !important;
    isolation: isolate !important;
  }
}


@media (max-width: 767px) {
  .hero-button-stack {
    transform: scale(0.79) !important;
    transform-origin: bottom left !important;
  }
  .hero-legends-btn {
    transform: translateY(29px) !important;
  }
  .hero-button-row {
    transform: translateY(18px) !important;
  }
  img[src*="final_crown"] {
    transform: translate(2px, 4px) scale(1.12) !important;
  }
  .hero-button-row a:first-child {
    transform: translateX(-10px) !important;
  }
  .hero-button-row a:last-child {
    transform: translateX(7px) !important;
  }
  .hero-register-btn {
    transform: translateY(9px) !important;
  }
}

@media (min-width: 768px) {
  body img.strike-img {
    margin-top: -188px !important;
    position: static !important;
  }
  .clock-overlay {
    z-index: 9999 !important;
    position: absolute !important;
    transform: translateY(calc(-50% + 18px)) scale(1.05) !important;
  }
}



/* ============================================================
   REAL HERO VIDEO + BUTTON LAYOUT, FINAL HARD FIX
   Fixes black right-side issue by forcing video to fill the full hero.
   ============================================================ */

#hero-video {
  position: relative !important;
  display: block !important;
  width: 100vw !important;
  max-width: none !important;
  height: 100svh !important;
  min-height: 100svh !important;
  padding: 0 !important;
  margin: 0 !important;
  margin-left: calc(50% - 50vw) !important;
  overflow: hidden !important;
  background: #000 !important;
}

#heroVideo {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
  z-index: 1 !important;
  background: #000 !important;
}


/* Real image buttons */
.hero-button-stack {
  position: absolute !important;
  z-index: 95 !important;
  left: clamp(48px, 4.2vw, 82px) !important;
  bottom: clamp(58px, 12vh, 145px) !important;
  width: clamp(350px, 23vw, 460px) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: clamp(7px, 0.75vw, 11px) !important;
  pointer-events: none !important;
}

.hero-button-stack a {
  display: block !important;
  pointer-events: auto !important;
  line-height: 0 !important;
  cursor: pointer !important;
  text-decoration: none !important;
  -webkit-tap-highlight-color: transparent !important;
}

.hero-button-stack img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-width: none !important;
  user-select: none !important;
  -webkit-user-drag: none !important;
}

.hero-legends-btn { width: 94% !important; }

.hero-button-row {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: clamp(6px, 0.62vw, 10px) !important;
  width: 94% !important;
}

.hero-register-btn { width: 96% !important; }

@media (max-width: 768px) {
  #hero-video {
    height: 100svh !important;
    min-height: 100svh !important;
  }

  #heroVideo {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
  }

  .hero-button-stack {
    left: 50% !important;
    transform: translateX(-50%) translateY(35px) scale(0.71) !important;
    transform-origin: bottom center !important;
    bottom: max(40px, 5.4vh) !important;
    width: min(100vw, 684px) !important;
    gap: 7px !important;
    align-items: center !important;
  }

  .hero-legends-btn { width: 88% !important; }
  .hero-button-row { width: 88% !important; gap: 6px !important; }
  .hero-register-btn { width: 90% !important; }
}
@media (min-width: 768px) { .hero-legends-btn { transform: translate(-25px, 35px) !important; } }
@media (min-width: 768px) { .hero-button-row { transform: translate(-23px, 25px) !important; } }
@media (min-width: 768px) { .hero-register-btn { transform: translate(-20px, 11px) !important; } }
.hero-register-btn {
  position: relative !important;
  overflow: hidden !important;
  display: block !important;
}
.hero-register-btn::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: -150% !important;
  width: 150% !important;
  height: 100% !important;
  z-index: 2 !important;
  pointer-events: none !important;
  background: linear-gradient(120deg, rgba(255,255,255,0) 30%, rgba(255,255,255,0.5) 50%, rgba(255,255,255,0) 70%) !important;
  animation: shimmerMove 3s ease-in-out infinite !important;
}
@media (min-width: 768px) {
  .hero-button-row img {
    height: auto !important;
    width: 100% !important;
  }
  img[src*="final_crown"] {
    transform: scale(1.19) !important;
  }
}

/* ============================================================
   KAI ESPN BROADCAST COUNTDOWN HUD, FINAL OVERRIDE
   Desktop countdown is roughly 50% smaller than prior 2.15 scale.
   Mobile countdown stays visible inside the First Strike map area.
   ============================================================ */
.countdown-section-wrap {
  overflow: visible !important;
  isolation: isolate !important;
}

.clock-overlay {
  position: absolute !important;
  z-index: 50 !important;
  width: 28% !important;
  max-width: 520px !important;
  min-width: 320px !important;
  padding: 12px 14px 14px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(245, 193, 93, 0.72) !important;
  background:
    linear-gradient(180deg, rgba(8, 12, 22, 0.78), rgba(0, 0, 0, 0.88)),
    radial-gradient(circle at top center, rgba(0, 174, 239, 0.20), transparent 52%) !important;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.08) inset,
    0 0 18px rgba(245, 193, 93, 0.40),
    0 0 42px rgba(0, 174, 239, 0.22),
    0 24px 70px rgba(0, 0, 0, 0.58) !important;
  backdrop-filter: blur(8px) saturate(1.1) !important;
  -webkit-backdrop-filter: blur(8px) saturate(1.1) !important;
  overflow: hidden !important;
}

.clock-overlay::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.18) 45%, transparent 62%) !important;
  transform: translateX(-130%) skewX(-18deg) !important;
  animation: kaiCountdownHudSweep 4s ease-in-out infinite !important;
}

.clock-overlay::after {
  content: "" !important;
  position: absolute !important;
  left: 12px !important;
  right: 12px !important;
  bottom: 8px !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, rgba(245,193,93,0.95), rgba(0,174,239,0.85), transparent) !important;
  box-shadow: 0 0 12px rgba(245,193,93,0.65) !important;
  pointer-events: none !important;
}

.clock-overlay > span,
.clock-overlay > p,
.clock-overlay .countdown-panel-fix {
  position: relative !important;
  z-index: 1 !important;
}

.clock-overlay > span {
  font-size: 0.78rem !important;
  letter-spacing: 0.22em !important;
  color: #ffd36f !important;
  text-shadow: 0 0 10px rgba(245,193,93,0.65), 0 0 24px rgba(245,193,93,0.32) !important;
  margin-bottom: 2px !important;
}

.clock-overlay > p {
  font-size: 0.84rem !important;
  letter-spacing: 0.16em !important;
  color: rgba(255,255,255,0.78) !important;
  text-shadow: 0 0 10px rgba(0,0,0,0.8) !important;
}

.clock-overlay .countdown-panel-fix {
  display: grid !important;
  grid-template-columns: repeat(4, 107px) !important;
  gap: 5px !important;
  max-width: none !important;
  width: auto !important;
}

.clock-overlay .countdown-box-fix {
  width: 107px !important;
  min-height: 94px !important;
  height: 94px !important;
  padding: 7px 6px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(245,193,93,0.70) !important;
  background:
    linear-gradient(180deg, rgba(16, 20, 33, 0.92), rgba(0,0,0,0.94)),
    radial-gradient(circle at top, rgba(255,216,114,0.16), transparent 62%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.16),
    inset 0 -12px 22px rgba(0,0,0,0.42),
    0 0 14px rgba(245,193,93,0.22) !important;
}

.clock-overlay .number-fix {
  font-size: clamp(2.25rem, 3.15vw, 3.2rem) !important;
  line-height: 0.9 !important;
  color: #ffffff !important;
  text-shadow:
    0 0 8px rgba(255,255,255,0.35),
    0 0 20px rgba(245,193,93,0.40),
    0 0 34px rgba(0,174,239,0.26) !important;
}

.clock-overlay .label-fix {
  font-size: 0.66rem !important;
  letter-spacing: 0.18em !important;
  color: #ffd36f !important;
  text-shadow: 0 0 10px rgba(245,193,93,0.32) !important;
}

@keyframes kaiCountdownHudSweep {
  0%, 45% { transform: translateX(-130%) skewX(-18deg); opacity: 0; }
  55% { opacity: 1; }
  100% { transform: translateX(130%) skewX(-18deg); opacity: 0; }
}

@media (min-width: 768px) {
  body .clock-overlay {
    position: absolute !important;
    top: calc(50% - 465px) !important;
    right: calc(3% - 10px) !important;
    left: auto !important;
    bottom: auto !important;
    transform: translateY(calc(-50% + 18px)) scale(1.05) !important;
    transform-origin: center center !important;
  }
}

@media (max-width: 767px) {
  body .countdown-section-wrap {
    margin-top: -2px !important;
    overflow: visible !important;
  }

    body .clock-overlay {
      position: absolute !important;
      top: 50% !important;
      right: 15px !important;
      left: auto !important;
      bottom: auto !important;
      width: auto !important;
      min-width: 0 !important;
      max-width: none !important;
      padding: 8px 8px 10px !important;
      border-radius: 13px !important;
    transform: translateY(calc(-50% - 230px)) scale(0.71) !important;
      transform-origin: center right !important;
      gap: 5px !important;
      z-index: 99999 !important;
    }

  body .clock-overlay .countdown-panel-fix {
    grid-template-columns: repeat(4, 42px) !important;
    gap: 3px !important;
  }

  body .clock-overlay .countdown-box-fix {
    width: 42px !important;
    min-height: 50px !important;
    height: 50px !important;
    padding: 4px 2px !important;
    border-radius: 9px !important;
  }

  body .clock-overlay .number-fix {
    font-size: 1.34rem !important;
    line-height: 0.92 !important;
    margin: 0 !important;
  }

  body .clock-overlay .label-fix {
    font-size: 0.46rem !important;
    letter-spacing: 0.08em !important;
    margin-top: 2px !important;
  }

  body .clock-overlay > span {
    font-size: 0.56rem !important;
    letter-spacing: 0.09em !important;
    white-space: nowrap !important;
  }

  body .clock-overlay > p {
    font-size: 0.50rem !important;
    letter-spacing: 0.06em !important;
    white-space: nowrap !important;
  }
}


/* ============================================================
   KAI FINAL COUNTDOWN POSITION LOCK, DESKTOP ONLY
   Problem fixed: earlier CSS !important rules were overriding HTML and JS.
   Moves clock LEFT 100px and UP 75px from the prior desktop position.
   ============================================================ */
@media (min-width: 768px) {
  body .countdown-section-wrap .clock-overlay {
    position: absolute !important;
    top: calc(50% - 465px) !important;
    right: calc(3% - 10px) !important;
    left: auto !important;
    bottom: auto !important;
    transform: translateY(calc(-50% + 18px)) scale(1.05) !important;
    transform-origin: center center !important;
    z-index: 99999 !important;
  }
}


/* ============================================================
   KAI HOSTING NAV FINAL FIX — keep pill size, grow inside icon,
   remove duplicate hamburger lines. Append at very end.
   ============================================================ */
body.page-with-topbar .page-top-bar {
  min-height: var(--rc-inside-topbar-min-height) !important;
  padding: var(--rc-inside-topbar-padding) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

body.page-with-topbar .page-top-bar .back-home-btn {
  width: var(--rc-inside-back-width) !important;
  height: var(--rc-inside-back-height) !important;
  min-width: var(--rc-inside-back-width) !important;
  min-height: var(--rc-inside-back-height) !important;
  max-width: var(--rc-inside-back-width) !important;
  max-height: var(--rc-inside-back-height) !important;
  border-radius: var(--rc-inside-back-radius) !important;
  padding: 0 !important;
}

/* The pill does NOT get bigger. Only the back.webp image inside grows. */
body.page-with-topbar .page-top-bar .back-home-btn img {
  width: calc(var(--rc-inside-back-width) - 14px) !important;
  height: calc(var(--rc-inside-back-height) - 14px) !important;
  min-width: calc(var(--rc-inside-back-width) - 14px) !important;
  min-height: calc(var(--rc-inside-back-height) - 14px) !important;
  max-width: calc(var(--rc-inside-back-width) - 14px) !important;
  max-height: calc(var(--rc-inside-back-height) - 14px) !important;
  object-fit: contain !important;
  display: block !important;
}

body.page-with-topbar .page-top-bar #topbar-menu-btn {
  width: var(--rc-inside-menu-size) !important;
  height: var(--rc-inside-menu-size) !important;
  min-width: var(--rc-inside-menu-size) !important;
  min-height: var(--rc-inside-menu-size) !important;
  max-width: var(--rc-inside-menu-size) !important;
  max-height: var(--rc-inside-menu-size) !important;
  border-radius: var(--rc-inside-menu-radius) !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  overflow: hidden !important;
}

/* Force only the 3 span lines to show. Hide any SVG hamburger/close icons. */
body.page-with-topbar .page-top-bar #topbar-menu-btn svg,
body.page-with-topbar .page-top-bar #topbar-menu-btn #menu-icon,
body.page-with-topbar .page-top-bar #topbar-menu-btn #close-icon {
  display: none !important;
}

body.page-with-topbar .page-top-bar #topbar-menu-btn .hamburger-line {
  display: block !important;
  width: 34px !important;
  height: 4px !important;
  min-height: 4px !important;
  max-height: 4px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, #f5c15d, #fff2a8, #f5c15d) !important;
  box-shadow: 0 0 8px rgba(245,193,93,.65) !important;
  opacity: 1 !important;
  visibility: visible !important;
  position: relative !important;
  transform: none !important;
}

@media (max-width: 767px) {
  body.page-with-topbar {
    --rc-inside-topbar-min-height: 96px;
    --rc-inside-topbar-padding: 12px 14px;
    --rc-inside-back-width: 126px;
    --rc-inside-back-height: 64px;
    --rc-inside-back-radius: 17px;
    --rc-inside-menu-size: 62px;
    --rc-inside-menu-radius: 16px;
  }

  body.page-with-topbar .page-top-bar .back-home-btn img {
    width: 118px !important;
    height: 56px !important;
    min-width: 118px !important;
    min-height: 56px !important;
    max-width: 118px !important;
    max-height: 56px !important;
  }

  body.page-with-topbar .page-top-bar #topbar-menu-btn .hamburger-line {
    width: 34px !important;
    height: 4px !important;
  }
}



/* ===== Sponsor Scroll: Luxury + ESPN Hybrid (UPDATED) ===== */
#sponsor-section .sponsor-scroll {
  display:flex !important;
  align-items:center !important;
  width:max-content !important;
  gap:0 !important;
  animation:kaiSponsorMarquee 34s linear infinite !important;
}

#sponsor-section .sponsor-group {
  display:flex !important;
  align-items:center !important;
  flex:0 0 auto !important;
  gap:0px !important;
  padding-right:0px !important;
}

#sponsor-section .sponsor-item {
  flex:0 0 180px !important; /* slightly smaller slots */
  width:180px !important;
  height:80px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:0 6px !important;
}

#sponsor-section .sponsor-item img {
  max-height:44px !important; /* smaller logos */
  width:auto !important;
  object-fit:contain !important;
  opacity:0.85;
  filter:grayscale(100%) brightness(1.1);
  transition:all 0.3s ease;
}

#sponsor-section .sponsor-item img:hover {
  opacity:1;
  filter:grayscale(0%) brightness(1.2);
  transform:scale(1.06);
}

@media (max-width:767px){
  #sponsor-section .sponsor-group {
    gap:24px !important;
    padding-right:24px !important;
  }

  #sponsor-section .sponsor-item {
    width:140px !important;
    height:70px !important;
  }

  #sponsor-section .sponsor-item img {
    max-height:34px !important;
  }
}

/* ===== Sponsor Scroll: Slow Cinematic Motion Lock ===== */
#sponsor-section .sponsor-scroll-wrap {
  position: relative !important;
  overflow: hidden !important;
  -webkit-mask-image: linear-gradient(
    90deg,
    transparent 0%,
    #000 9%,
    #000 91%,
    transparent 100%
  ) !important;
  mask-image: linear-gradient(
    90deg,
    transparent 0%,
    #000 9%,
    #000 91%,
    transparent 100%
  ) !important;
}

#sponsor-section .sponsor-scroll {
  animation: kaiSponsorMarqueeCinematic 58s linear infinite !important;
  will-change: transform !important;
  transform: translate3d(0,0,0);
}

#sponsor-section .sponsor-scroll:hover {
  animation-play-state: paused !important;
}

#sponsor-section .sponsor-item img {
  transform: translateZ(0);
}

@keyframes kaiSponsorMarqueeCinematic {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(-50%, 0, 0); }
}

@media (max-width: 767px) {
  #sponsor-section .sponsor-scroll {
    animation-duration: 44s !important;
  }

  #sponsor-section .sponsor-scroll-wrap {
    -webkit-mask-image: linear-gradient(
      90deg,
      transparent 0%,
      #000 7%,
      #000 93%,
      transparent 100%
    ) !important;
    mask-image: linear-gradient(
      90deg,
      transparent 0%,
      #000 7%,
      #000 93%,
      transparent 100%
    ) !important;
  }
}



/* ===== FINAL TIGHT + LOWER HEIGHT ADJUST ===== */
#sponsor-section .sponsor-item {
  height: 48px !important; /* reduced ~40% */
}

#sponsor-section .sponsor-group {
  gap: 0px !important;
  padding-right: 0px !important;
}

#sponsor-section .sponsor-item img {
  max-height: 30px !important; /* scale logo to match new height */
}

/* ===== LOCKED SPONSOR SCROLL, TIGHT CENTERED TICKER ===== */
#sponsor-section .sponsor-shell {
  width: 100% !important;
  overflow: hidden !important;
  border-radius: 26px !important;
  padding: 12px 0 !important;
  background: linear-gradient(135deg, rgba(16,18,28,0.96), rgba(8,10,20,0.98)) !important;
}

#sponsor-section .sponsor-scroll-wrap {
  width: 100% !important;
  overflow: hidden !important;
  position: relative !important;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%) !important;
  mask-image: linear-gradient(90deg, transparent 0%, #000 8%, #000 92%, transparent 100%) !important;
}

#sponsor-section .sponsor-scroll {
  display: flex !important;
  align-items: center !important;
  width: max-content !important;
  gap: 0 !important;
  animation: kaiSponsorMarqueeLocked 58s linear infinite !important;
  will-change: transform !important;
}

#sponsor-section .sponsor-scroll:hover {
  animation-play-state: paused !important;
}

#sponsor-section .sponsor-group {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  gap: 10px !important;
  padding-right: 10px !important;
}

#sponsor-section .sponsor-item {
  flex: 0 0 130px !important;
  width: 130px !important;
  height: 40px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  overflow: visible !important;
}

#sponsor-section .sponsor-item img {
  display: block !important;
  max-height: 50px !important;
  max-width: 100% !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  margin: auto !important;
  opacity: 0.95 !important;
  filter: none !important;
}

@keyframes kaiSponsorMarqueeLocked {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(-50%, 0, 0); }
}

.previous-events-edge {
  position: relative;
  width: 100vw;
  left: 50%;
  transform: translateX(-50%);
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden;
  max-width: none !important;
}

.previous-events-img {
  display: block;
  width: 100vw !important;
  max-width: none !important;
  height: auto;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  object-fit: cover;
}

@media (max-width: 767px) {
  #sponsor-section .sponsor-shell {
    padding: 8px 0 !important;
    border-radius: 22px !important;
  }

  #sponsor-section .sponsor-scroll {
    animation-duration: 44s !important;
  }

  #sponsor-section .sponsor-group {
    gap: 8px !important;
    padding-right: 8px !important;
  }

  #sponsor-section .sponsor-item {
    flex-basis: 110px !important;
    width: 110px !important;
    height: 34px !important;
  }

  #sponsor-section .sponsor-item img {
    max-height: 42px !important;
  }
}

/* ===== GLOBAL MOBILE LEFT CROP FIX v2 ===== */
@media (max-width: 767px) {
  /* Fix clipped text by creating safe mobile content gutters */
  section:not(#hero-video):not(.countdown-section-wrap):not(#sponsor-section),
  section:not(#hero-video):not(.countdown-section-wrap):not(#sponsor-section) > .max-w-7xl,
  section:not(#hero-video):not(.countdown-section-wrap):not(#sponsor-section) > .max-w-\[1800px\],
  .shared-section-head,
  .section-head-left,
  .cards-grid-heading,
  #prize,
  #bonus {
    padding-left: 16px !important;
    padding-right: 16px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: auto !important;
    max-width: 100% !important;
    left: auto !important;
    transform: none !important;
  }

  /* Keep text itself from hugging/cropping */
  .rc-eyebrow,
  .section-heading,
  .rules-subtext,
  .card-title,
  .card-sub,
  p,
  h1, h2, h3 {
    margin-left: 0 !important;
    padding-left: 0 !important;
    max-width: 100% !important;
  }

  /* Do not affect full-bleed media */
  #hero-video,
  .countdown-section-wrap,
  #sponsor-section,
  picture,
  video {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Restore full-width images inside fixed sections */
  .why-title-img,
  .shimmer[style*="100vw"] {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100vw !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
  }
}

/* ============================================================
   STANDARD SITE FOOTER SYSTEM — unified across all pages
   ============================================================ */
.rc-site-footer {
  background: #05070d;
  border-top: 1px solid rgba(245,193,93,0.15);
  padding: 48px 24px max(32px, calc(32px + env(safe-area-inset-bottom)));
}

.rc-footer-inner {
  max-width: 1200px;
  margin: 0 auto;
}

.rc-footer-social-block {
  margin-bottom: 28px;
}

.rc-footer-social-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
}

.rc-footer-social-desc {
  color: rgba(255,255,255,0.82);
  font-size: 0.82rem;
  margin: 6px 0 0;
}

.rc-footer-icons {
  justify-content: flex-end;
  padding: 0;
}

.rc-footer-sitemap-head {
  margin-top: 28px;
}

.rc-footer-sitemap-desc {
  color: rgba(255,255,255,0.82);
  font-size: 0.82rem;
  margin: 6px 0 0;
}

.rc-footer-copyright {
  border-top: 1px solid rgba(255,255,255,0.08);
  padding-top: 20px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 28px;
}

.rc-footer-copyright p {
  color: rgba(255,255,255,0.35);
  font-size: 0.78rem;
  margin: 0;
}

.rc-footer-privacy {
  color: #f5c15d;
  font-size: 0.78rem;
  text-decoration: none;
  transition: color 0.2s;
}
.rc-footer-privacy:hover {
  color: #ffffff;
}

@media (max-width: 767px) {
  .rc-site-footer {
    padding: 36px 16px max(24px, calc(24px + env(safe-area-inset-bottom)));
  }
  .rc-footer-social-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  .rc-footer-icons {
    justify-content: flex-start;
  }
}

/* ============================================================
   REAL CHAMPIONSHIP LIVE SOCIAL ICONS — premium gold shimmer footer
   ============================================================ */
.rc-social-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
  padding: 10px 0;
}

.rc-social-btn {
  width: 64px;
  height: 64px;
  border-radius: 9999px;
  background: radial-gradient(circle at 35% 25%, rgba(255,255,255,0.08), rgba(255,255,255,0.025) 62%);
  border: 1px solid rgba(245,193,93,0.28);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  transition: transform 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease, background 0.35s ease;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 0 0 rgba(245,193,93,0);
  animation: socialPulse 4s ease-in-out infinite;
}

.rc-social-btn svg {
  width: 28px;
  height: 28px;
  fill: rgba(255,255,255,0.72);
  position: relative;
  z-index: 2;
  transition: fill 0.35s ease, filter 0.35s ease, transform 0.35s ease;
}

.rc-social-btn::before {
  content: "";
  position: absolute;
  top: -55%;
  left: -70%;
  width: 42%;
  height: 210%;
  background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.08) 24%, rgba(255,255,255,0.85) 50%, rgba(255,255,255,0.08) 76%, transparent 100%);
  transform: rotate(24deg);
  opacity: 0;
  transition: left 0.6s ease, opacity 0.35s ease;
  pointer-events: none;
}

.rc-social-btn::after {
  content: "";
  position: absolute;
  inset: 1px;
  border-radius: inherit;
  border: 1px solid rgba(255,224,130,0.08);
  pointer-events: none;
}

.rc-social-btn:hover {
  border-color: rgba(245,193,93,0.82);
  background: radial-gradient(circle at 35% 25%, rgba(245,193,93,0.20), rgba(255,255,255,0.035) 64%);
  box-shadow: 0 0 18px rgba(245,193,93,0.38), 0 0 38px rgba(245,193,93,0.14), inset 0 1px 0 rgba(255,255,255,0.10);
  transform: translateY(-4px) scale(1.05);
}

.rc-social-btn:hover svg {
  fill: #f5c15d;
  filter: drop-shadow(0 0 10px rgba(245,193,93,0.55));
  transform: scale(1.08);
}

.rc-social-btn:hover::before {
  left: 125%;
  opacity: 1;
}

@keyframes socialPulse {
  0%, 100% { box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 0 0 rgba(245,193,93,0); }
  50% { box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 0 14px rgba(245,193,93,0.18); }
}

@media (max-width: 767px) {
  .rc-social-wrap {
    gap: 12px;
  }

  .rc-social-btn {
    width: 54px;
    height: 54px;
  }

  .rc-social-btn svg {
    width: 24px;
    height: 24px;
  }
}


/* =========================
   FOLLOW US ON SOCIAL FIX, EXACT 50% WORD SIZE ONLY
   Added at the end so it overrides the global heading locks.
   ========================= */
html body footer .sitemap-top .sitemap-header .sitemap-social-heading,
html body footer .sitemap-top .sitemap-header h2.sitemap-social-heading {
  line-height: 0.9 !important;
  margin: 0 !important;
}

html body footer .sitemap-top .sitemap-header .sitemap-social-heading > .section-heading-accent,
html body footer .sitemap-top .sitemap-header .sitemap-social-heading > .real-opportunity-shimmer {
  font-size: calc(var(--rc-accent-size, clamp(1.98rem, 3.78vw, 3.42rem)) * 0.5) !important;
  line-height: 0.9 !important;
}

html body footer .sitemap-top .sitemap-header .sitemap-social-heading > .section-heading-main {
  font-size: calc(var(--rc-title-size, clamp(2.2rem, 4.2vw, 3.8rem)) * 0.5) !important;
  line-height: 0.9 !important;
}

@media (max-width: 767px) {
  html body footer .sitemap-top .sitemap-header .sitemap-social-heading > .section-heading-accent,
  html body footer .sitemap-top .sitemap-header .sitemap-social-heading > .real-opportunity-shimmer {
    font-size: calc(clamp(2.2rem, 4.2vw, 3.8rem) * 0.315) !important;
  }

  html body footer .sitemap-top .sitemap-header .sitemap-social-heading > .section-heading-main {
    font-size: calc(clamp(2.2rem, 4.2vw, 3.8rem) * 0.35) !important;
  }
}


/* ============================================================
   KAI LOCKED FIX: SITE MAP INTRO + FOLLOW SOCIAL ALIGNMENT
   - Keeps pills and icons unchanged
   - Moves/locks intro + social title to same left grid as Trusted Partners
   - Makes FOLLOW US ON SOCIAL MEDIA exactly 17% bigger than the previous 50% lock
   ============================================================ */
.sitemap-intro-section {
  width: 100%;
  max-width: 1800px;
  margin: 0 auto;
  padding: 0 16px;
  box-sizing: border-box;
  text-align: left;
  overflow: visible;
}

.sitemap-intro-inner {
  width: 100%;
  max-width: 1800px;
  margin: 0;
  padding: 0;
  text-align: left;
}

.sitemap-intro-section .final-crown-divider-longer {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.sitemap-intro-section .sitemap-desc {
  color: rgba(255,255,255,0.75) !important;
  font-size: 1.1rem !important;
  line-height: 1.45 !important;
  margin: 18px 0 0 0 !important;
  max-width: 600px !important;
  text-align: left !important;
}

.site-map-footer {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

.site-map-footer-inner {
  max-width: 1800px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.site-map-footer .sitemap-top {
  align-items: flex-start !important;
  margin-left: 0 !important;
  transform: none !important;
  gap: 24px !important;
  margin-bottom: 44px !important;
}

.site-map-footer .sitemap-header {
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  text-align: left !important;
}

html body .site-map-footer .sitemap-top .sitemap-header h2.sitemap-social-heading {
  margin: 0 0 12px 0 !important;
  padding: 0 !important;
  line-height: 0.9 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  justify-content: flex-start !important;
  transform: none !important;
}

/* 0.5 previous size x 1.17 = 0.585 */
html body .site-map-footer .sitemap-top .sitemap-header h2.sitemap-social-heading > .section-heading-accent,
html body .site-map-footer .sitemap-top .sitemap-header h2.sitemap-social-heading > .real-opportunity-shimmer {
  font-size: calc(var(--rc-accent-size, clamp(1.98rem, 3.78vw, 3.42rem)) * 0.585) !important;
  line-height: 0.9 !important;
  letter-spacing: -0.01em !important;
}

html body .site-map-footer .sitemap-top .sitemap-header h2.sitemap-social-heading > .section-heading-main {
  font-size: calc(var(--rc-title-size, clamp(2.2rem, 4.2vw, 3.8rem)) * 0.585) !important;
  line-height: 0.9 !important;
  letter-spacing: -0.01em !important;
}

.site-map-footer .sitemap-social {
  justify-content: flex-start !important;
  align-items: center !important;
  margin-left: 0 !important;
  padding-left: 0 !important;
  transform: none !important;
  gap: 28px !important;
}

.site-map-footer .pill-links-grid {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

@media (max-width: 767px) {
  .sitemap-intro-section,
  .site-map-footer {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .site-map-footer .sitemap-top {
    gap: 18px !important;
    margin-bottom: 36px !important;
  }

  html body .site-map-footer .sitemap-top .sitemap-header h2.sitemap-social-heading > .section-heading-accent,
  html body .site-map-footer .sitemap-top .sitemap-header h2.sitemap-social-heading > .real-opportunity-shimmer {
    font-size: calc(clamp(2.2rem, 4.2vw, 3.8rem) * 0.36855) !important;
  }

  html body .site-map-footer .sitemap-top .sitemap-header h2.sitemap-social-heading > .section-heading-main {
    font-size: calc(clamp(2.2rem, 4.2vw, 3.8rem) * 0.4095) !important;
  }

  .site-map-footer .sitemap-social {
    gap: 14px !important;
    flex-wrap: wrap !important;
  }
}


/* ===== KAI FINAL LOOK: ROAD TO / MADDEN 2026 OVERRIDE ===== */
#first-strike .section-heading .cinematic-road-lockup{
  display:inline-flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 auto !important;
  margin-left:0.28em !important;
  margin-top:0 !important;
  transform:translateY(-0.02em) !important;
  line-height:0.76 !important;
  vertical-align:middle !important;
}
#first-strike .cinematic-road-title{
  font-family:'Bebas Neue',sans-serif !important;
  font-size:clamp(3.05rem,5.25vw,5.6rem) !important;
  font-weight:900 !important;
  letter-spacing:0.06em !important;
  line-height:0.86 !important;
  text-transform:uppercase !important;
  white-space:nowrap !important;
  color:#ffd36a !important;
  -webkit-text-fill-color:#ffd36a !important;
  -webkit-text-stroke:1px rgba(255,244,184,0.88) !important;
  text-shadow:0 2px 0 #1b1204,0 4px 0 rgba(0,0,0,0.9),0 0 14px rgba(255,207,91,0.72),0 0 28px rgba(255,207,91,0.35) !important;
  margin:0 0 0.05em 0 !important;
}
#first-strike .cinematic-madden-title{
  font-family:'Bebas Neue',sans-serif !important;
  font-size:clamp(5.2rem,9.9vw,10.6rem) !important;
  font-weight:900 !important;
  letter-spacing:-0.045em !important;
  line-height:0.76 !important;
  white-space:nowrap !important;
  background:none !important;
  -webkit-background-clip:initial !important;
  background-clip:initial !important;
  color:#050505 !important;
  -webkit-text-fill-color:#050505 !important;
  -webkit-text-stroke:2.6px #ffd36a !important;
  text-shadow:0 0 2px #fff1a8,0 0 10px rgba(255,211,106,0.72),0 3px 0 #000,0 8px 14px rgba(0,0,0,0.95) !important;
}
@media (max-width: 767px){
  #first-strike .section-heading .cinematic-road-lockup{width:100% !important;margin-left:0 !important;margin-top:0.2em !important;align-items:flex-start !important;transform:none !important;}
  #first-strike .cinematic-road-title{font-size:clamp(2.45rem,12.5vw,4rem) !important;}
  #first-strike .cinematic-madden-title{font-size:clamp(4.4rem,22vw,7rem) !important;-webkit-text-stroke:2px #ffd36a !important;}
}

/* ===== KAI LOCKED: ROAD TO MADDEN 2026 MATCH PREVIEW CODE ===== */
.cinematic-road-lockup{
  display:inline-flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  position:relative !important;
  isolation:isolate !important;
  flex:0 0 auto !important;
  margin-left:0.34em !important;
  margin-top:0 !important;
  transform:translateY(-0.04em) !important;
  line-height:.78 !important;
  vertical-align:middle !important;
}
.cinematic-road-title{
  font-family:'Bebas Neue', Impact, sans-serif !important;
  font-size:clamp(3.9rem,6.2vw,7.8rem) !important;
  letter-spacing:.03em !important;
  line-height:.78 !important;
  margin:0 0 4px 0 !important;
  text-transform:uppercase !important;
  color:#f5c15d !important;
  -webkit-text-stroke:1.2px #fff1a6 !important;
  text-shadow:
    0 2px 0 #1b0d00,
    0 5px 0 rgba(74,43,0,.85),
    0 0 8px rgba(245,193,93,.45),
    0 0 18px rgba(245,193,93,.25) !important;
}
.cinematic-madden-title{
  font-family:'Bebas Neue', Impact, sans-serif !important;
  font-size:clamp(6.4rem,12vw,14.2rem) !important;
  letter-spacing:-.055em !important;
  line-height:.78 !important;
  white-space:nowrap !important;
  background:linear-gradient(180deg,
    #ffffff 0%,
    #fff8e8 16%,
    #a98b3a 38%,
    #ffffff 51%,
    #f2bd38 66%,
    #754700 83%,
    #fff1a5 100%) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  color:transparent !important;
  -webkit-text-stroke:2px #f5c15d !important;
  text-shadow:
    0 2px 0 #000,
    0 0 4px rgba(255,232,140,.55),
    0 10px 14px rgba(0,0,0,.95) !important;
}
.cinematic-road-lockup::after{
  content:"";
  display:block;
  width:104%;
  height:2px;
  margin-top:14px;
  background:linear-gradient(90deg, transparent, rgba(245,193,93,.9), #fff2a7, rgba(245,193,93,.9), transparent);
  box-shadow:0 0 14px rgba(245,193,93,.55);
}
@media(max-width:767px){
  .section-heading .cinematic-road-lockup{
    width:100% !important;
    margin-left:0 !important;
    margin-top:0.15em !important;
    align-items:flex-start !important;
    transform:none !important;
  }
  .cinematic-road-title{
    font-size:3rem !important;
  }
  .cinematic-madden-title{
    font-size:5.9rem !important;
  }
  .cinematic-road-lockup::after{
    width:100% !important;
  }
}

/* ===== KAI FINAL LOCK: ROAD TO MADDEN 2026, NO BLINK BACK ===== */
#first-strike .cinematic-road-lockup{
  display:inline-flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  position:relative !important;
  isolation:isolate !important;
  flex:0 0 auto !important;
  margin-left:0.34em !important;
  margin-top:0 !important;
  transform:translateY(-0.04em) !important;
  line-height:.78 !important;
  vertical-align:middle !important;
  animation:none !important;
}
#first-strike .cinematic-road-title{
  font-family:'Bebas Neue', Impact, sans-serif !important;
  font-size:clamp(3.9rem,6.2vw,7.8rem) !important;
  letter-spacing:.03em !important;
  line-height:.78 !important;
  margin:0 0 4px 0 !important;
  text-transform:uppercase !important;
  color:#f5c15d !important;
  -webkit-text-fill-color:#f5c15d !important;
  background:none !important;
  -webkit-background-clip:border-box !important;
  background-clip:border-box !important;
  -webkit-text-stroke:1.2px #fff1a6 !important;
  text-shadow:
    0 2px 0 #1b0d00,
    0 5px 0 rgba(74,43,0,.85),
    0 0 8px rgba(245,193,93,.45),
    0 0 18px rgba(245,193,93,.25) !important;
  animation:none !important;
}
#first-strike .cinematic-madden-title{
  font-family:'Bebas Neue', Impact, sans-serif !important;
  font-size:clamp(6.4rem,12vw,14.2rem) !important;
  letter-spacing:-.055em !important;
  line-height:.78 !important;
  white-space:nowrap !important;
  background:linear-gradient(180deg,
    #ffffff 0%,
    #fff8e8 16%,
    #a98b3a 38%,
    #ffffff 51%,
    #f2bd38 66%,
    #754700 83%,
    #fff1a5 100%) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  color:transparent !important;
  -webkit-text-fill-color:transparent !important;
  -webkit-text-stroke:2px #f5c15d !important;
  text-shadow:
    0 2px 0 #000,
    0 0 4px rgba(255,232,140,.55),
    0 10px 14px rgba(0,0,0,.95) !important;
  animation:none !important;
}
#first-strike .cinematic-road-lockup::after{
  content:"" !important;
  display:block !important;
  width:104% !important;
  height:2px !important;
  margin-top:14px !important;
  background:linear-gradient(90deg, transparent, rgba(245,193,93,.9), #fff2a7, rgba(245,193,93,.9), transparent) !important;
  box-shadow:0 0 14px rgba(245,193,93,.55) !important;
}
@media(max-width:767px){
  #first-strike .section-heading .cinematic-road-lockup{
    width:100% !important;
    margin-left:0 !important;
    margin-top:0.15em !important;
    align-items:flex-start !important;
    transform:none !important;
  }
  #first-strike .cinematic-road-title{
    font-size:3rem !important;
  }
  #first-strike .cinematic-madden-title{
    font-size:5.9rem !important;
  }
  #first-strike .cinematic-road-lockup::after{
    width:100% !important;
  }
}

/*
 * RC PULSE CARD — ARCHITECTURE
 * ─────────────────────────────────────────────────────────────────────────
 * Rule: animated layer MUST live in the padding frame zone only.
 * Technique:
 *   • container  → padding creates the visible frame
 *   • ::before   → fills the frame with animated color, z-index:-1 (BEHIND image)
 *   • ::after    → content:none  (no overlay on artwork)
 *   • isolation:isolate → z-index:-1 stays contained, never bleeds out
 * ─────────────────────────────────────────────────────────────────────────
 */

/* ── BLUE — first-strike.webp ─────────────────────────────────────────── */
.rc-pulse-card-blue {
  position: relative !important;
  border-radius: 28px !important;
  overflow: hidden !important;
  padding: 3px !important;
  isolation: isolate;
  display: block;
}

/* Spinning conic — lives in the 3 px frame zone, behind the image */
.rc-pulse-card-blue::before {
  content: "";
  position: absolute;
  inset: -40%;
  z-index: -1;
  background: conic-gradient(
    from 0deg,
    transparent                0deg,
    rgba(0,  46, 140, 0.04)   35deg,
    rgba(0, 115, 255, 0.88)   72deg,
    rgba(120, 235, 255, 1)    82deg,
    rgba(255, 255, 255, 1)    87deg,
    rgba(0, 195, 255, 1)      92deg,
    transparent              128deg,
    transparent              215deg,
    rgba(0, 115, 255, 0.72)  238deg,
    rgba(120, 235, 255, 1)   255deg,
    rgba(0, 195, 255, 0.80)  265deg,
    transparent              298deg,
    transparent              360deg
  );
  animation: borderSpinBlue 4s linear infinite;
  will-change: transform;
}

/* No overlay on the image */
.rc-pulse-card-blue::after { content: none; }

/* Inner image corners aligned to the 3 px inset */
.rc-pulse-card-blue .first-strike-full-image {
  border-radius: 25px !important;
}

@keyframes borderSpinBlue {
  to { transform: rotate(360deg); }
}

/* ── GOLD — img1.webp / img1Mobile.webp / full-assault.webp / lorenzo_41 */
.rc-pulse-card-gold {
  position: relative !important;
  overflow: hidden !important;
  padding: 2px !important;
  isolation: isolate;
}

/* Pulsing gold fill — lives in the 2 px frame zone, behind the image */
.rc-pulse-card-gold::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: rgba(255, 171, 44, 1);
  animation: glowPulseGold 1.9s ease-in-out infinite;
  will-change: opacity;
}

/* No overlay on the image */
.rc-pulse-card-gold::after { content: none; }

@keyframes glowPulseGold {
  0%, 100% { opacity: .38; }
  50%       { opacity: 1.00; }
}


/* =====================================================
   MOBILE EDGE-TO-EDGE FIX — Full-bleed image sections
   ===================================================== */
@media (max-width: 767px) {

  /* --- Utility classes (apply to any full-bleed wrapper) --- */
  .mobile-edge-to-edge,
  .full-bleed-mobile,
  .edge-to-edge-mobile {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    border-radius: 0 !important;
    overflow: hidden !important;
  }
  .mobile-edge-to-edge img,
  .full-bleed-mobile img,
  .edge-to-edge-mobile img {
    width: 100vw !important;
    max-width: 100vw !important;
    height: auto !important;
    display: block !important;
    object-fit: cover !important;
    border-radius: 0 !important;
  }

  /* --- hosting.html: Lorenzo Neal parent section --- */
  section.why-hero-section {
    padding-left: 0 !important;
    padding-right: 0 !important;
    overflow-x: visible !important;
  }
  section.why-hero-section > .max-w-7xl {
    padding-left: 0 !important;
    padding-right: 0 !important;
    overflow-x: visible !important;
  }
  /* Future-proof Lorenzo class names */
  .lorenzo-section,
  .lorenzo-hero,
  .journey-lorenzo-section {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    border-radius: 0 !important;
    overflow: hidden !important;
  }
  .lorenzo-section > *,
  .lorenzo-hero > *,
  .journey-lorenzo-section > * {
    max-width: 100vw !important;
  }

  /* --- championship-weekend.html: PM Lounge hero --- */
  #pm-lounge {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .pm-hero-card {
    border-radius: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* --- index.html: Prize mobile hero --- */
  #prize {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .prize-mobile-hero {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* --- final-destination.html: Fresno image --- */
  .fresno-img-full-mobile {
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    width: 100vw !important;
    max-width: 100vw !important;
    border-radius: 0 !important;
  }
  .fresno-img-full-mobile img {
    width: 100vw !important;
    max-width: 100vw !important;
    border-radius: 0 !important;
  }
}
/* === END MOBILE EDGE-TO-EDGE FIX === */


/* =========================================================
   REAL AI COUNTDOWN FINAL FIX
   ========================================================= */

.ai-register-countdown-row{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:18px !important;
  width:100% !important;
  overflow:visible !important;
  flex-wrap:nowrap !important;
}

.ai-championship-countdown.clock-overlay{
  position:relative !important;
  margin-left:400px !important;
  width:auto !important;
  min-width:470px !important;
  overflow:visible !important;
  padding:14px !important;
  border-radius:18px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  box-sizing:border-box !important;
}

.countdown-panel-fix.ai-countdown-panel{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(90px,1fr)) !important;
  gap:10px !important;
  width:100% !important;
  overflow:visible !important;
  justify-content:center !important;
  align-items:stretch !important;
}

.countdown-box-fix.ai-countdown-box{
  width:90px !important;
  min-width:90px !important;
  min-height:96px !important;
  border-radius:16px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:visible !important;
  padding:8px 6px !important;
  box-sizing:border-box !important;
}

.number-fix.ai-countdown-number{
  font-size:3rem !important;
  line-height:1 !important;
}

.label-fix.ai-countdown-label{
  font-size:.78rem !important;
  margin-top:6px !important;
  text-align:center !important;
  line-height:1.1 !important;
}

@media (max-width:860px){

  .ai-register-countdown-row{
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
  }

  .ai-championship-countdown.clock-overlay{
    margin-left:0 !important;
    width:100% !important;
    min-width:100% !important;
    max-width:520px !important;
  }

  .countdown-panel-fix.ai-countdown-panel{
    grid-template-columns:repeat(4, minmax(65px,1fr)) !important;
    gap:6px !important;
  }

  .countdown-box-fix.ai-countdown-box{
    width:100% !important;
    min-width:65px !important;
    min-height:78px !important;
  }

  .number-fix.ai-countdown-number{
    font-size:2rem !important;
  }

.label-fix.ai-countdown-label{
    font-size:.65rem !important;
  }
}

/* === GLOBAL FOOTER INDEX SYNC === */
.rc-site-footer {
  background: #05070d !important;
  border-top: 1px solid rgba(245,193,93,0.15) !important;
  padding: 48px 24px 32px !important;
}

.rc-footer-inner {
  max-width: 1200px !important;
  margin: 0 auto !important;
}

.rc-footer-social-block { margin-bottom: 28px !important; }
.rc-footer-social-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
}

.rc-footer-social-desc,
.rc-footer-sitemap-desc {
  color: rgba(255,255,255,0.45) !important;
  font-size: 0.82rem !important;
  margin: 6px 0 0 !important;
  line-height: 1.5 !important;
}

.rc-footer-icons {
  justify-content: flex-end !important;
  padding: 0 !important;
}

.rc-social-wrap {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

.rc-social-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 64px !important;
  height: 64px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  background: rgba(255,255,255,0.04) !important;
  color: #fff !important;
  transition: border-color .2s, background .2s, transform .2s !important;
  position: relative !important;
  overflow: hidden !important;
}

.rc-social-btn:hover {
  border-color: rgba(245,193,93,0.82) !important;
  background: radial-gradient(circle at 35% 25%, rgba(245,193,93,0.20), rgba(255,255,255,0.035) 64%) !important;
}

.rc-social-btn svg {
  width: 28px !important;
  height: 28px !important;
  fill: currentColor !important;
}

.pill-links-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
  gap: 16px !important;
  margin-bottom: 32px !important;
}

.pill-card {
  background: rgba(255,255,255,0.03) !important;
  border: 1px solid rgba(245,193,93,0.28) !important;
  border-radius: 18px !important;
  padding: 18px !important;
}

.pill-card h3 {
  font-family: 'Bebas Neue', sans-serif !important;
  font-size: 1rem !important;
  color: #f5c15d !important;
  letter-spacing: .16em !important;
  margin: 0 0 12px !important;
}

.pill-card a {
  display: block !important;
  color: rgba(255,255,255,0.6) !important;
  font-family: 'Bebas Neue', sans-serif !important;
  font-size: 1rem !important;
  letter-spacing: .05em !important;
  text-decoration: none !important;
  margin: 8px 0 !important;
  transition: color .2s !important;
}

.pill-card a:hover { color: #fff !important; }
.rc-footer-sitemap-head { margin-top: 28px !important; }
.rc-footer-copyright {
  border-top: 1px solid rgba(255,255,255,0.08) !important;
  padding-top: 20px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-top: 28px !important;
}

.rc-footer-copyright p,
.rc-footer-privacy {
  color: rgba(255,255,255,0.35) !important;
  font-size: 0.78rem !important;
  margin: 0 !important;
}

.rc-footer-privacy {
  text-decoration: none !important;
}

.rc-footer-privacy:hover { color: #fff !important; }

@media (max-width: 767px) {
  .rc-site-footer {
    padding: 36px 16px max(24px, calc(24px + env(safe-area-inset-bottom))) !important;
  }

  .rc-footer-social-row {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }

  .rc-footer-icons {
    justify-content: flex-start !important;
  }

  .rc-social-btn {
    width: 54px !important;
    height: 54px !important;
  }

  .rc-social-btn svg {
    width: 24px !important;
    height: 24px !important;
  }

  .pill-links-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }

  .pill-card {
    padding: 14px !important;
    border-radius: 14px !important;
  }
}
/* === END GLOBAL FOOTER INDEX SYNC === */

/* === GLOBAL TRUSTED PARTNERS FOOTER SPACING SYNC === */
#sponsor-section {
  padding: 48px 24px !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  scroll-margin-top: 140px !important;
}

#sponsor-section > div[style*="height:1px"],
#sponsor-section > .final-crown-divider-longer {
  margin-bottom: 32px !important;
}

#sponsor-section > div[style*="max-width:1800px"],
#sponsor-section > .max-w-\[1800px\],
#sponsor-section > .real-aligned-container {
  max-width: 1800px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

#sponsor-section .sponsor-shell,
#sponsor-section div[style*="background:rgba(255,255,255,0.03)"] {
  width: 100% !important;
  overflow: hidden !important;
  border-radius: 26px !important;
  padding: 8px 0 !important;
  margin-bottom: 0 !important;
}

#sponsor-section .sponsor-scroll-wrap,
#sponsor-section div[style*="overflow:hidden"] {
  width: 100% !important;
  overflow: hidden !important;
  position: relative !important;
}

#sponsor-section .sponsor-scroll,
#sponsor-section div[style*="animation:sponsorMarquee"] {
  display: flex !important;
  align-items: center !important;
  width: max-content !important;
  min-width: max-content !important;
  flex-wrap: nowrap !important;
  gap: 0 !important;
  padding: 0 !important;
  animation: kaiSponsorMarqueeCinematic 58s linear infinite !important;
  will-change: transform !important;
}

#sponsor-section .sponsor-scroll:hover,
#sponsor-section div[style*="animation:sponsorMarquee"]:hover {
  animation-play-state: paused !important;
}

#sponsor-section .sponsor-group {
  display: flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  gap: 0 !important;
  padding-right: 0 !important;
}

#sponsor-section .sponsor-item,
#sponsor-section div[style*="flex:0 0 auto"] {
  flex: 0 0 130px !important;
  width: 130px !important;
  height: 40px !important;
  min-width: 130px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
}

#sponsor-section .sponsor-item img,
#sponsor-section div[style*="flex:0 0 auto"] img {
  display: block !important;
  height: auto !important;
  max-height: 50px !important;
  max-width: 100% !important;
  width: auto !important;
  object-fit: contain !important;
  opacity: 0.88 !important;
}

#sponsor-section + .back-to-top,
#sponsor-section + button.back-to-top {
  margin-top: 0 !important;
}

#sponsor-section ~ .sitemap-intro-section {
  margin-top: 0 !important;
}

@media (max-width: 767px) {
  #sponsor-section {
    padding: 36px 0 32px !important;
    scroll-margin-top: 120px !important;
  }

  #sponsor-section .sponsor-shell,
  #sponsor-section div[style*="background:rgba(255,255,255,0.03)"] {
    border-radius: 22px !important;
    padding: 8px 0 !important;
  }

  #sponsor-section .sponsor-scroll,
  #sponsor-section div[style*="animation:sponsorMarquee"] {
    animation-duration: 44s !important;
  }

  #sponsor-section .sponsor-group {
    gap: 8px !important;
    padding-right: 8px !important;
  }

  #sponsor-section .sponsor-item,
  #sponsor-section div[style*="flex:0 0 auto"] {
    flex-basis: 110px !important;
    width: 110px !important;
    min-width: 110px !important;
    height: 34px !important;
  }

  #sponsor-section .sponsor-item img,
  #sponsor-section div[style*="flex:0 0 auto"] img {
    max-height: 42px !important;
  }
}

/* === FLOATING ACTION BUTTON ALIGNMENT === */
#real-ai-fab,
.back-to-top {
  right: 20px !important;
}

#real-ai-fab {
  bottom: calc(24px + env(safe-area-inset-bottom)) !important;
}

.back-to-top {
  right: 30px !important;
  bottom: calc(108px + env(safe-area-inset-bottom)) !important;
  z-index: 1001 !important;
}

@media (max-width: 767px) {
  #real-ai-fab,
  .back-to-top {
    right: 16px !important;
  }

  #real-ai-fab {
    bottom: calc(18px + env(safe-area-inset-bottom)) !important;
  }

  .back-to-top {
    right: 26px !important;
    bottom: calc(96px + env(safe-area-inset-bottom)) !important;
  }
}
/* === END FLOATING ACTION BUTTON ALIGNMENT === */