/* Updated 2026-01-12 - LIVE badge red dot styling */
/* ============================================
   Bet Max Tourney - Product-Focused Landing Page
   Powered by Bet Max Action Brand System
   ============================================ */

/* ===== BMA Brand Color Variables ===== */
:root {
    /* Core BMA Brand Colors - BRIGHTENED */
    --bma-green: #2E8B57;
    --bma-green-bright: #00E676;
    --bma-yellow: #FFD700;
    --bma-yellow-bright: #FFED4E;
    --bma-red: #DC143C;
    --bma-black: #000000;
    --bma-white: #FFFFFF;

    /* Dark Theme Backgrounds */
    --bma-dark-100: #0a0a0a;
    --bma-dark-200: #141414;
    --bma-dark-300: #1a1a1a;
    --bma-dark-400: #1e1e1e;

    /* Gradients - ENHANCED */
    --gradient-primary: linear-gradient(135deg, var(--bma-green) 0%, var(--bma-green-bright) 100%);
    --gradient-accent: linear-gradient(135deg, var(--bma-yellow) 0%, #FFA500 100%);
    --gradient-hero: linear-gradient(135deg, #FFD700 0%, #FFA500 50%, #FF6B00 100%);

    /* Typography */
    --font-display: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    /* Hero top offset - marquee (48px) + nav floats over hero */
    --hero-marquee-height: 48px;
    --hero-header-height: 110px;
}

/* ===== Reset & Base ===== */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: var(--font-primary);
    background: transparent; /* Let html background show through */
    color: var(--bma-white);
    line-height: 1.7;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    min-height: 100vh;
}

html {
    background: #060606;
    min-height: 100vh;
}

/* ===== Shared Badge System ===== */
.badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.2rem 0.65rem;
    border-radius: 6px;
    font-size: 0.65rem;
    font-weight: 900;
    letter-spacing: 2px;
    text-transform: uppercase;
    border: 1px solid transparent;
    box-shadow:
        inset 0 0 0 1px rgba(0, 0, 0, 0.35),
        0 6px 16px rgba(0, 0, 0, 0.35);
}

.badge--gold {
    background: rgba(0, 0, 0, 0.35);
    color: var(--bma-yellow-bright);
    border-color: rgba(255, 237, 78, 0.55);
}

.badge--green {
    background: rgba(0, 0, 0, 0.25);
    color: var(--bma-green-bright);
    border-color: rgba(0, 230, 118, 0.55);
}

/* Global scrollbar branding */
html {
    scrollbar-color: var(--bma-yellow) var(--bma-dark-200);
    scrollbar-width: thin;
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: var(--bma-dark-200);
}

::-webkit-scrollbar-thumb {
    background: var(--bma-yellow);
    border-radius: 999px;
    border: 2px solid var(--bma-dark-200);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--bma-yellow-bright);
}

.container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 2rem;
}

/* Larger screens get wider containers */
@media (min-width: 1600px) {
    .container {
        max-width: 1600px;
        padding: 0 3rem;
    }

    /* Better table sizing on larger screens */
    #starting-soon-table.tabulator .tabulator-col[tabulator-field="title"],
    #tournaments-table.tabulator .tabulator-col[tabulator-field="title"] {
        min-width: 350px !important;
    }

    #starting-soon-table.tabulator .tabulator-col[tabulator-field="sports"],
    #tournaments-table.tabulator .tabulator-col[tabulator-field="sports"] {
        min-width: 160px !important;
    }

    #starting-soon-table.tabulator .tabulator-cell,
    #tournaments-table.tabulator .tabulator-cell {
        padding: 1.2rem 1.5rem;
        font-size: 0.95rem;
    }
}

@media (min-width: 1920px) {
    .container {
        max-width: 1800px;
        padding: 0 4rem;
    }

    /* Even more spacious on very large screens */
    #starting-soon-table.tabulator .tabulator-col[tabulator-field="title"],
    #tournaments-table.tabulator .tabulator-col[tabulator-field="title"] {
        min-width: 450px !important;
    }

    #starting-soon-table.tabulator .tabulator-col[tabulator-field="startTs"],
    #tournaments-table.tabulator .tabulator-col[tabulator-field="startTs"] {
        min-width: 200px !important;
    }

    #starting-soon-table.tabulator .tabulator-col[tabulator-field="sports"],
    #tournaments-table.tabulator .tabulator-col[tabulator-field="sports"] {
        min-width: 200px !important;
    }

    #starting-soon-table.tabulator .tabulator-cell,
    #tournaments-table.tabulator .tabulator-cell {
        padding: 1.4rem 2rem;
        font-size: 1rem;
    }

    #starting-soon-table.tabulator .tabulator-col-title,
    #tournaments-table.tabulator .tabulator-col-title {
        font-size: 0.75rem;
    }
}

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

/* Typography - Use Display Font for Headings */
h1, h2, h3, h4, h5, h6,
.section-header h2 {
    font-family: var(--font-display);
    font-weight: 900;
    letter-spacing: -0.02em;
}

p {
    font-size: 1rem;
    line-height: 1.7;
}

/* ===== Content Pages Styling ===== */
article.container {
    max-width: 900px;
    margin: 6rem auto;
    padding: 3rem;
    background: rgba(26, 26, 26, 0.6);
    backdrop-filter: blur(10px);
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

article.container h1 {
    font-size: 2.5rem;
    margin-bottom: 1rem;
    background: var(--gradient-hero);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

article.container .content h2 {
    font-size: 1.8rem;
    margin-top: 3rem;
    margin-bottom: 1rem;
    color: var(--bma-green-bright);
    padding-bottom: 0.5rem;
    border-bottom: 2px solid rgba(0, 230, 118, 0.2);
}

article.container .content h3 {
    font-size: 1.4rem;
    margin-top: 2rem;
    margin-bottom: 1rem;
    color: var(--bma-yellow);
}

article.container .content {
    overflow-wrap: break-word;
    word-break: break-word;
}

article.container .content p {
    margin-bottom: 1.5rem;
    color: rgba(255, 255, 255, 0.85);
}

article.container .content ul,
article.container .content ol {
    margin-left: 2rem;
    margin-bottom: 1.5rem;
    color: rgba(255, 255, 255, 0.85);
}

article.container .content li {
    margin-bottom: 0.5rem;
    line-height: 1.7;
}

article.container .content strong {
    color: var(--bma-white);
    font-weight: 700;
}

article.container .content a {
    color: var(--bma-green-bright);
    text-decoration: underline;
    transition: color 0.3s ease;
}

article.container .content a:hover {
    color: var(--bma-yellow);
}

/* Content Pages - Mobile Responsive */
@media (max-width: 768px) {
    article.container {
        margin: 4rem auto 2rem;
        padding: 2rem 1.5rem;
        border-radius: 12px;
    }

    article.container h1 {
        font-size: 2rem;
        line-height: 1.2;
    }

    article.container .content h2 {
        font-size: 1.5rem;
        margin-top: 2rem;
    }

    article.container .content h3 {
        font-size: 1.2rem;
        margin-top: 1.5rem;
    }

    article.container .content p {
        font-size: 1rem;
    }

    article.container .content ul,
    article.container .content ol {
        margin-left: 1.5rem;
    }
}

@media (max-width: 480px) {
    article.container {
        margin: 3rem auto 1.5rem;
        padding: 1.5rem 1rem;
    }

    article.container h1 {
        font-size: 1.75rem;
    }

    article.container .content h2 {
        font-size: 1.3rem;
    }

    article.container .content h3 {
        font-size: 1.1rem;
    }

    article.container .content p {
        font-size: 0.95rem;
    }

    article.container .content ul,
    article.container .content ol {
        margin-left: 1.25rem;
    }
}

/* ===== Section Headers - True Edge-to-Edge Typography ===== */
.section-header {
    text-align: center;
    margin-bottom: 2rem;
    position: relative;
    width: 100%;
    margin-left: 0;
    overflow: visible;
}

.section-logo {
    height: clamp(140px, 25vw, 240px);
    width: clamp(140px, 25vw, 240px);
    margin: 0 auto 2rem;
    display: block;
    object-fit: contain;
}

.section-header h2 {
    font-size: clamp(3rem, 7vw, 5rem);
    font-weight: 900;
    margin: 0;
    margin-bottom: 1.5rem;
    padding: 0 1rem;
    color: var(--bma-white);
    line-height: 1.1;
    letter-spacing: -0.03em;
    text-transform: none;
    position: relative;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
    white-space: normal;
    overflow-wrap: break-word;
}

/* Subtle underline - optional, disabled by default */
.section-header h2::after {
    display: none;
    /* Uncomment below to enable a subtle underline
    content: '';
    position: absolute;
    bottom: -0.5rem;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 2px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 1px;
    */
}

/* Highlight key words with clean brand accent - single color */
.section-header h2 .accent {
    color: var(--bma-green-bright);
    font-weight: 900;
    display: inline-block;
    transform: skewX(-2deg);
    margin: 0 0.15em;
    position: relative;
    text-shadow: 0 0 20px rgba(0, 230, 118, 0.4);
}

/* Yellow accent for tournament section on green background */
.section-header h2 .accent-yellow {
    color: var(--bma-yellow);
    font-weight: 900;
    display: inline-block;
    transform: skewX(-2deg);
    margin: 0 0.15em;
    position: relative;
    text-shadow: 0 0 20px rgba(255, 215, 0, 0.5);
}

/* Alternative: Large display headlines for maximum impact */
.section-header.display-large h2 {
    font-size: clamp(4rem, 9vw, 7rem);
    line-height: 0.95;
    margin-bottom: 2.5rem;
    font-weight: 900;
    padding: 0 0.5rem;
    white-space: normal;
    word-spacing: normal;
}

.section-header.display-large h2::after {
    display: none;
}

/* Animated entrance - triggered by JS intersection observer */
.section-header h2 {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.section-header h2.animate-in {
    opacity: 1;
    transform: translateY(0);
}

/* Stagger animation for accent words */
.section-header h2 .accent {
    transition: all 0.8s ease-out 0.2s;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.section-header p {
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.8);
    max-width: 700px;
    margin: 0 auto;
    line-height: 1.7;
    font-weight: 500;
}


/* ===== Live Tournament Marquee ===== */
.tournament-marquee {
    position: sticky;
    top: 0;
    z-index: 1001;
    background:
        linear-gradient(135deg, rgba(6, 6, 6, 0.92) 0%, rgba(12, 12, 12, 0.96) 100%);
    backdrop-filter: blur(14px) saturate(140%);
    -webkit-backdrop-filter: blur(14px) saturate(140%);
    border-bottom: 2px solid transparent;
    border-image: linear-gradient(90deg, transparent 0%, var(--bma-green-bright) 30%, var(--bma-yellow) 50%, var(--bma-green-bright) 70%, transparent 100%);
    border-image-slice: 1;
    overflow: hidden;
    height: 48px;
    box-shadow:
        0 3px 10px rgba(0, 0, 0, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

/* Animated background pattern - very subtle */
.tournament-marquee::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background:
        repeating-linear-gradient(
            90deg,
            transparent,
            transparent 80px,
            rgba(0, 230, 118, 0.006) 80px,
            rgba(0, 230, 118, 0.006) 160px
        );
    animation: none;
    pointer-events: none;
}

@keyframes patternSlide {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(160px);
    }
}

.marquee-content {
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    align-items: center;
    gap: 0;
}

/* Promo segment */
.marquee-promo {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0 1.75rem;
    min-width: clamp(220px, 26vw, 300px);
    height: 100%;
    border-right: 1px solid rgba(255, 255, 255, 0.08);
    background: linear-gradient(135deg, rgba(6, 6, 6, 0.92) 0%, rgba(12, 12, 12, 0.96) 100%);
    z-index: 2;
}

.marquee-promo-icon {
    color: var(--bma-green-bright);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    filter: drop-shadow(0 0 8px rgba(0, 230, 118, 0.35));
}

.marquee-promo-text {
    font-size: 0.78rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.85);
    white-space: nowrap;
}

.marquee-promo-title {
    font-weight: 700;
}

.marquee-promo-subtext {
    font-weight: 600;
    color: rgba(255, 255, 255, 0.7);
}

/* Gradient fade edges */
.marquee-content::before,
.marquee-content::after {
    content: none;
}

.marquee-content::before {
    left: 0;
    background: none;
}

.marquee-content::after {
    right: 0;
    background: none;
}

.marquee-track {
    display: flex;
    align-items: center;
    gap: 2.25rem;
    animation: marqueeScroll 115s linear infinite;
    white-space: nowrap;
    height: 100%;
    padding: 0 1.5rem 0 1.25rem;
    flex: 1;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 80px, #000 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 80px, #000 100%);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}

/* Pause animation on hover - only on devices with hover (avoids sticky pause on touch) */
@media (hover: hover) {
    .marquee-track:hover {
        animation-play-state: paused;
    }
}

@keyframes marqueeScroll {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}

/* #4: Tournament Item Cards with glassmorphic treatment */
.marquee-item {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.85rem;
    background: rgba(16, 16, 16, 0.7);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 999px;
    transition: all 0.3s ease;
}

/* #7: Hover state with lift effect */
.marquee-item:hover {
    cursor: pointer;
    transform: translateY(-1px);
    background: rgba(20, 20, 20, 0.8);
    border-color: rgba(0, 230, 118, 0.2);
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.35);
}

/* Loading state centered */
.marquee-item.loading {
    width: 100%;
    justify-content: center;
    padding-left: 0;
}

/* #3: Enhanced Status Indicators - matching Tabulator table styles */
.marquee-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.35rem 0.8rem;
    border-radius: 999px;
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    border: 1px solid transparent;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    transition: all 0.3s ease;
    white-space: nowrap;
    position: relative;
}

/* Enhanced LIVE status - matching table style */
.marquee-status-live {
    background: linear-gradient(135deg,
        rgba(220, 20, 60, 0.85) 0%,
        rgba(255, 23, 68, 0.85) 100%);
    border-color: rgba(220, 20, 60, 0.8);
    color: white;
    font-weight: 900;
    padding-left: 1.4rem;
    box-shadow: 0 2px 8px rgba(220, 20, 60, 0.3);
}

/* Static dot for LIVE - smaller for marquee */
.marquee-status-live::before {
    content: '';
    position: absolute;
    left: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    width: 6px;
    height: 6px;
    background: white;
    border-radius: 50%;
}

/* Enhanced UPCOMING status - matching table style */
.marquee-status-upcoming {
    background: linear-gradient(135deg,
        rgba(255, 215, 0, 0.25) 0%,
        rgba(255, 237, 78, 0.2) 100%);
    border-color: rgba(255, 215, 0, 0.7);
    color: var(--bma-yellow-bright);
    font-weight: 800;
}

/* ENDING status with yellow theme */
.marquee-status-ending {
    background: linear-gradient(135deg,
        rgba(255, 237, 78, 0.3) 0%,
        rgba(255, 165, 0, 0.25) 100%);
    border-color: rgba(255, 237, 78, 0.8);
    color: var(--bma-yellow-bright);
    font-weight: 800;
}

/* COMPLETED status - subtle */
.marquee-status-completed {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.25);
    color: rgba(255, 255, 255, 0.7);
}

/* #3: Breathing pulse animation for active statuses */
@keyframes breathingPulse {
    0%, 100% {
        transform: scale(1);
        opacity: 1;
    }
    50% {
        transform: scale(1.05);
        opacity: 0.85;
    }
}

@keyframes gentlePulse {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.7;
    }
}

@keyframes statusShimmer {
    0% {
        left: -100%;
    }
    100% {
        left: 100%;
    }
}

/* #6: Enhanced typography with brand fonts */
.marquee-tournament,
.marquee-item-title {
    font-family: var(--font-primary);
    color: rgba(255, 255, 255, 0.92);
    font-weight: 600;
    font-size: 0.88rem;
    letter-spacing: 0.2px;
    text-transform: none;
    text-shadow: none;
}

.marquee-item-meta {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: rgba(255, 255, 255, 0.75);
    font-size: 0.75rem;
}

.marquee-meta-divider {
    color: rgba(255, 255, 255, 0.35);
    font-size: 0.7rem;
}

.marquee-sport {
    font-family: var(--font-display);
    color: rgba(0, 230, 118, 0.9);
    font-weight: 700;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.9px;
    text-shadow: none;
}

.marquee-separator {
    color: rgba(255, 255, 255, 0.25);
    font-size: 0.6rem;
    margin: 0 0.35rem;
}

.marquee-countdown {
    color: rgba(255, 237, 78, 0.9);
    font-weight: 700;
    font-size: 0.72rem;
    letter-spacing: 0.4px;
}

.marquee-sport-icon {
    display: inline-flex;
    align-items: center;
    color: var(--bma-green-bright);
    margin-right: 0.25rem;
}

.marquee-sport-icon svg {
    width: 16px;
    height: 16px;
}

/* Sport icon in marquee - uses background image classes with green glow */
.marquee-item .sport-icon-small {
    display: inline-block;
    margin-right: 0.1rem;
    margin-left: 0;
    vertical-align: middle;
    /* Ensure icon shows with proper sizing */
    width: 28px !important;
    height: 28px !important;
    /* Override any conflicting styles to ensure visibility */
    opacity: 1;
    /* Add green glow filter for visibility on dark background */
    filter: brightness(0) saturate(100%) invert(79%) sepia(79%) saturate(1800%) hue-rotate(86deg) brightness(98%) contrast(115%);
}

/* ===== Pill-Shaped Header - Clean & Professional ===== */
header {
    padding: 1.5rem 2rem;
    position: sticky;
    top: 48px;
    z-index: 1000;
    background: transparent;
}

nav {
    max-width: 1280px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: clamp(1rem, 3vw, 3rem);
    background: #101010;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow:
        0 4px 32px rgba(0, 0, 0, 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 80px;
    padding: 0.75rem clamp(1rem, 4vw, 2.5rem);
    min-height: 70px;
}

.logo {
    margin: -15px 0;
}

.logo a {
    display: flex;
    align-items: center;
    text-decoration: none;
    transition: opacity 0.2s ease;
}

.logo-image {
    height: clamp(80px, 10vw, 140px);
    width: auto;
    max-height: none;
    max-width: 200px;
    display: block;
    object-fit: contain;
    margin-top: -20px;
    margin-bottom: -20px;
}

.logo a:hover {
    opacity: 0.8;
}

.nav-links {
    display: flex;
    gap: clamp(1rem, 2vw, 2.5rem);
    list-style: none;
    margin: 0;
    padding: 0;
    flex-wrap: nowrap;
}

.nav-links a {
    color: rgba(255, 255, 255, 0.75);
    font-weight: 600;
    font-size: clamp(0.75rem, 1.2vw, 0.95rem);
    transition: all 0.2s ease;
    white-space: nowrap;
}

.nav-links a:hover {
    color: var(--bma-green-bright);
}

.nav-auth {
    display: flex;
    gap: clamp(0.5rem, 1vw, 1rem);
    align-items: center;
    flex-shrink: 0;
}

.nav-auth .btn {
    padding: clamp(0.5rem, 1vw, 0.75rem) clamp(1rem, 2vw, 1.5rem);
    font-size: clamp(0.75rem, 1.1vw, 0.9rem);
    white-space: nowrap;
}

/* Removed duplicate menu-toggle styles */

/* Mobile Menu Drawer */
.mobile-menu {
    position: fixed;
    top: 0;
    right: -100%;
    width: 80%;
    max-width: 320px;
    height: 100vh;
    background: linear-gradient(135deg,
        rgba(20, 20, 20, 0.98) 0%,
        rgba(15, 15, 15, 0.98) 100%
    );
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.5);
    z-index: 999;
    padding: 6rem 2rem 2rem;
    transition: right 0.3s ease;
    overflow-y: auto;
}

.mobile-menu.active {
    right: 0;
}

.mobile-nav-links {
    list-style: none;
    margin: 0;
    padding: 0;
    margin-bottom: 2rem;
}

.mobile-nav-links li {
    margin-bottom: 0;
}

.mobile-nav-links a {
    display: block;
    padding: 1rem 1.5rem;
    color: rgba(255, 255, 255, 0.85);
    font-weight: 600;
    font-size: 1.1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    transition: all 0.2s ease;
}

.mobile-nav-links a:hover {
    color: var(--bma-green-bright);
    background: rgba(255, 255, 255, 0.03);
    padding-left: 2rem;
}

.mobile-cta {
    width: 100%;
    text-align: center;
}

.mobile-auth {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* Mobile menu overlay */
.mobile-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: rgba(0, 0, 0, 0.7);
    z-index: 998;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.mobile-overlay.active {
    opacity: 1;
    pointer-events: auto;
}

/* ===== Hero Section - Rotating Background ===== */
.hero {
    height: calc(75vh + 120px);
    min-height: 650px;
    max-height: 850px;
    padding: 0;
    padding-top: calc(var(--hero-marquee-height) + var(--hero-header-height) + 0.75rem);
    margin-top: -120px;
    padding-bottom: clamp(3rem, 8vw, 6rem);
    position: relative;
    overflow: visible;
    background: #000;
    display: flex;
    align-items: center;
}


.hero::after,
.how-it-works::after,
.live-tournaments::after,
.beta-benefits::after,
.final-cta::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, rgba(255, 215, 0, 0.22) 50%, transparent 100%);
    opacity: 0.6;
    pointer-events: none;
}

/* Rotating Background Container - Shared by Hero & Live Tournaments */
.hero-bg {
    position: absolute;
    top: -120px;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    overflow: hidden;
}

/* Rotating Background Images with Ken Burns Effect */
.hero-bg-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: 0;
    animation: backgroundSlide 20s infinite;
}

.hero-bg-image:nth-child(1) {
    background-image: url('https://images.unsplash.com/photo-1471295253337-3ceaaedca402?q=80&w=2336&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D');
    animation-delay: 0s;
}

.hero-bg-image:nth-child(2) {
    background-image: url('https://images.unsplash.com/photo-1770067665792-9975acdec4fb?q=80&w=2340&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D');
    animation-delay: 5s;
}

.hero-bg-image:nth-child(3) {
    background-image: url('https://images.unsplash.com/photo-1629217855633-79a6925d6c47?q=80&w=2340&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D');
    animation-delay: 10s;
}

.hero-bg-image:nth-child(4) {
    background-image: url('https://images.unsplash.com/photo-1504450758481-7338eba7524a?q=80&w=2338&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D');
    animation-delay: 15s;
}

@keyframes backgroundSlide {
    0% {
        opacity: 1;
        transform: scale(1);
    }
    25% {
        opacity: 1;
        transform: scale(1.06);
    }
    40% {
        opacity: 0;
        transform: scale(1.1);
    }
    100% {
        opacity: 0;
        transform: scale(1.1);
    }
}

/* Overlay with Grid Pattern, Gradients, and Glows - Shared */
.hero-overlay {
    position: absolute;
    top: -120px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    background:
        repeating-linear-gradient(
            90deg,
            transparent,
            transparent 2px,
            rgba(255,255,255,0.015) 2px,
            rgba(255,255,255,0.015) 4px
        ),
        repeating-linear-gradient(
            0deg,
            transparent,
            transparent 2px,
            rgba(255,255,255,0.015) 2px,
            rgba(255,255,255,0.015) 4px
        ),
        linear-gradient(135deg, rgba(0, 230, 118, 0.7) 0%, rgba(0, 0, 0, 0.85) 100%),
        linear-gradient(45deg, rgba(255, 215, 0, 0.15) 0%, rgba(220, 20, 60, 0.1) 100%);
    z-index: 1;
}

.live-tournaments .hero-overlay {
    pointer-events: none;
}

.hero-overlay::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background:
        radial-gradient(circle at 30% 20%, rgba(0, 230, 118, 0.4) 0%, transparent 50%),
        radial-gradient(circle at 70% 80%, rgba(255, 215, 0, 0.3) 0%, transparent 50%);
    animation: pulseGlow 8s ease-in-out infinite;
}

@keyframes pulseGlow {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.6; }
}

.hero .container {
    position: relative;
    z-index: 2;
    height: 100%;
    display: flex;
    align-items: center;
    padding-left: clamp(1rem, 4vw, 2rem);
    padding-right: clamp(1rem, 4vw, 2rem);
}

.hero-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
    align-items: center;
    width: 100%;
}

.hero-left {
    text-align: left;
}

.beta-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: rgba(255, 215, 0, 0.25);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 2px solid var(--bma-yellow);
    color: var(--bma-yellow);
    padding: 0.75rem 1.5rem;
    border-radius: 50px;
    font-weight: 800;
    font-size: 0.85rem;
    letter-spacing: 1.5px;
    margin-bottom: 2rem;
    box-shadow: 0 0 30px rgba(255, 215, 0, 0.4), 0 8px 32px rgba(0, 0, 0, 0.6);
}

.hero h1 {
    font-size: clamp(1.75rem, 5vw + 1rem, 4.5rem);
    font-weight: 900;
    line-height: 0.95;
    margin-bottom: 1.5rem;
    letter-spacing: -0.03em;
    color: var(--bma-white);
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.6), 0 4px 24px rgba(0, 0, 0, 0.4);
}

.hero h1 .tm {
    font-size: 0.35em;
    font-weight: 400;
    margin-left: 0.25rem;
    opacity: 0.7;
}

.hero-lead {
    font-size: clamp(0.9rem, 1.2vw + 0.5rem, 1.1rem);
    color: rgba(255, 255, 255, 0.95);
    margin-bottom: 1.5rem;
    line-height: 1.7;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.8);
}

.hero-offer {
    background: linear-gradient(135deg, rgba(10, 10, 10, 0.72) 0%, rgba(20, 20, 20, 0.6) 100%);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 215, 0, 0.35);
    border-radius: 12px;
    padding: 1.25rem;
    margin-bottom: 0;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.55);
}

.offer-badge {
    display: inline-flex;
    margin-bottom: 0.75rem;
}

.offer-text {
    color: rgba(255, 255, 255, 0.95);
    font-size: 0.95rem;
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.6);
}

.offer-text strong {
    color: var(--bma-yellow);
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.8);
}

.hero-offer-link {
    display: inline-block;
    margin-top: 0.75rem;
    color: var(--bma-yellow);
    font-weight: 600;
    font-size: 1rem;
    text-decoration: underline;
    text-decoration-color: var(--bma-yellow);
    text-decoration-thickness: 2px;
    text-underline-offset: 4px;
    transition: all 0.2s ease;
}

.hero-offer-link:hover {
    color: var(--bma-yellow-bright);
    text-decoration-thickness: 3px;
}

.hero-ctas {
    margin-bottom: 2rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.hero-ctas .btn {
    min-height: 44px;
    min-width: 44px;
}

.cta-meta {
    display: flex;
    gap: 1.5rem;
    margin-top: 1rem;
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.6);
}

.hero-social-proof {
    display: flex;
    gap: 2rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.proof-stat {
    display: flex;
    flex-direction: column;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    padding: 1rem 1.5rem;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.15);
}

.proof-stat strong {
    font-size: 1.75rem;
    font-weight: 900;
    color: var(--bma-green-bright);
    margin-bottom: 0.25rem;
    text-shadow: 0 2px 12px rgba(0, 230, 118, 0.6);
}

.proof-stat span {
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.85);
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.8);
}

/* Product Preview - Right Side */
.hero-right {
    align-self: center;
    position: relative;
    display: flex;
    justify-content: center;
    overflow: visible;
}

/* Hide device stack when JS adds .mobile class (no media query) */
body.mobile .hero-right {
    display: none;
}

.hero .device-stack {
    max-width: 560px;
    width: 100%;
    margin: 0 auto;
    position: relative;
}

.hero .laptop-mockup {
    max-width: 520px;
}

.hero .phone-mockup {
    position: absolute;
    bottom: -50px;
    right: -50px;
    width: 220px;
    z-index: 3;
}

/* Device stack phones now use the same styling as preview phones */

/* Inline step numbers for hero section */
.section-header.display-large .step-number {
    display: inline-flex;
    width: 1.8em;
    height: 1.8em;
    border-radius: 50%;
    background: var(--gradient-accent);
    color: var(--bma-black);
    font-size: 0.5em;
    font-weight: 900;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(255, 215, 0, 0.3);
    vertical-align: middle;
    margin: 0 0.2em;
}

/* Steps displayed vertically - one per line */
.steps-vertical {
    text-align: center;
}

.steps-vertical .step-line {
    font-size: clamp(3rem, 6vw, 5rem);
    font-weight: 700;
    line-height: 1.2;
    margin: 0.5rem 0;
}

.steps-vertical .step-number {
    display: inline-flex;
    width: 1.2em;
    height: 1.2em;
    border-radius: 50%;
    background: var(--gradient-accent);
    color: var(--bma-black);
    font-size: 0.5em;
    font-weight: 900;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 20px rgba(255, 215, 0, 0.3);
    vertical-align: middle;
    margin-right: 0.3em;
}

.steps-vertical .accent {
    color: var(--bma-green-bright);
    font-weight: 900;
}

/* Hero Laptop Mockup */
.hero-laptop-mockup {
    position: relative;
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
}

.hero-laptop-screen {
    background: linear-gradient(135deg, #1a1a1a 0%, #0d0d0d 100%);
    border: 8px solid #0a0a0a;
    border-radius: 12px 12px 0 0;
    padding: 12px;
    box-shadow:
        0 20px 60px rgba(0, 0, 0, 0.7),
        inset 0 0 0 2px rgba(255, 255, 255, 0.1);
    aspect-ratio: 16 / 10;
    position: relative;
}

.hero-laptop-base {
    width: 120%;
    height: 12px;
    background: linear-gradient(135deg, #1a1a1a 0%, #0a0a0a 100%);
    margin: 0 auto;
    border-radius: 0 0 8px 8px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);
}

/* Hero Phone Mockup */
.hero-phone-mockup {
    width: clamp(220px, 80vw, 340px);
    max-width: 340px;
    margin: 0;
    position: relative;
}

.phone-screen {
    background: linear-gradient(135deg, rgba(10, 10, 10, 0.98) 0%, rgba(20, 20, 20, 0.98) 100%);
    padding: 1rem 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* Tournament Header */
.phone-tournament-header {
    text-align: center;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.phone-tournament-badge {
    display: inline-block;
    background: var(--bma-red);
    color: var(--bma-white);
    padding: 0.2rem 0.6rem;
    border-radius: 12px;
    font-size: 0.65rem;
    font-weight: 800;
    margin-bottom: 0.5rem;
}

.phone-tournament-title {
    color: var(--bma-white);
    font-weight: 800;
    font-size: 1rem;
    margin-bottom: 0.3rem;
}

.phone-tournament-meta {
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.7rem;
    font-weight: 600;
}

/* Leaderboard Section */
.phone-leaderboard-section {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.phone-section-title {
    color: var(--bma-green-bright);
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 0.5rem;
}

.phone-leader-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 10px;
    transition: all 0.2s ease;
}

.phone-leader-row.gold {
    background: linear-gradient(135deg, rgba(255, 215, 0, 0.25) 0%, rgba(255, 215, 0, 0.08) 100%);
    border: 1px solid rgba(255, 215, 0, 0.3);
}

.phone-leader-row.silver {
    background: linear-gradient(135deg, rgba(192, 192, 192, 0.2) 0%, rgba(192, 192, 192, 0.05) 100%);
    border: 1px solid rgba(192, 192, 192, 0.2);
}

.phone-leader-row.bronze {
    background: linear-gradient(135deg, rgba(205, 127, 50, 0.2) 0%, rgba(205, 127, 50, 0.05) 100%);
    border: 1px solid rgba(205, 127, 50, 0.2);
}

.phone-leader-row.your-rank {
    background: linear-gradient(135deg, rgba(46, 139, 87, 0.3) 0%, rgba(46, 139, 87, 0.1) 100%);
    border: 2px solid rgba(46, 139, 87, 0.5);
}

.phone-leader-rank {
    color: rgba(255, 255, 255, 0.5);
    font-weight: 800;
    font-size: 0.9rem;
    min-width: 24px;
    text-align: center;
}

.phone-leader-row.gold .phone-leader-rank {
    color: var(--bma-yellow);
}

.phone-leader-row.silver .phone-leader-rank {
    color: rgba(192, 192, 192, 0.9);
}

.phone-leader-row.bronze .phone-leader-rank {
    color: rgba(205, 127, 50, 0.9);
}

.phone-leader-info {
    flex: 1;
}

.phone-leader-name {
    color: var(--bma-white);
    font-weight: 700;
    font-size: 0.85rem;
}

.phone-leader-balance {
    color: var(--bma-green-bright);
    font-weight: 800;
    font-size: 0.9rem;
    white-space: nowrap;
}

/* Your Position Section */
.phone-your-position {
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.phone-position-label {
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.5rem;
}

.hero-product-showcase {
    text-align: center;
    padding: 4rem 0 0 0;
    max-width: 800px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
}

.hero-showcase-logo {
    width: clamp(180px, 40vw, 250px);
    height: auto;
    margin-bottom: 2rem;
}

.hero-product-showcase h2 {
    font-size: 2.25rem;
    font-weight: 800;
    color: var(--bma-white);
    margin-bottom: 1.25rem;
    line-height: 1.3;
}

.hero-product-showcase p {
    font-size: 1.15rem;
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.6;
}

.preview-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.preview-sport {
    font-weight: 800;
    font-size: 1rem;
}

.preview-live {
    color: var(--bma-red);
    font-weight: 800;
    font-size: 0.85rem;
    animation: pulse 2s ease-in-out infinite;
}

.leaderboard-title {
    font-size: 0.8rem;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.6);
    margin-bottom: 1rem;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.leaderboard-row {
    display: grid;
    grid-template-columns: 60px 1fr 80px;
    align-items: center;
    padding: 0.75rem;
    margin-bottom: 0.5rem;
    background: rgba(255, 255, 255, 0.03);
    border-radius: 8px;
    font-size: 0.9rem;
}

.leaderboard-row.gold {
    background: linear-gradient(90deg, rgba(255, 215, 0, 0.15) 0%, rgba(255, 215, 0, 0.05) 100%);
    border: 1px solid rgba(255, 215, 0, 0.3);
}

.leaderboard-row.silver {
    background: linear-gradient(90deg, rgba(192, 192, 192, 0.12) 0%, rgba(192, 192, 192, 0.04) 100%);
}

.leaderboard-row.bronze {
    background: linear-gradient(90deg, rgba(205, 127, 50, 0.12) 0%, rgba(205, 127, 50, 0.04) 100%);
}

.leaderboard-row .rank {
    font-weight: 800;
}

.leaderboard-row .name {
    font-weight: 600;
}

.leaderboard-row .points {
    text-align: right;
    font-weight: 700;
    color: var(--bma-green);
}

.preview-meta {
    display: flex;
    justify-content: space-between;
    margin-top: 1.5rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.6);
}

.preview-placeholder {
    margin-top: 1.5rem;
    padding: 2rem;
    background: rgba(255, 215, 0, 0.05);
    border: 2px dashed rgba(255, 215, 0, 0.3);
    border-radius: 12px;
    text-align: center;
    color: rgba(255, 255, 255, 0.5);
    font-size: 0.9rem;
}

/* ===== Buttons - Clean PrizePicks Style ===== */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.7rem 1.6rem;
    font-weight: 700;
    font-size: 0.9rem;
    border-radius: 4px;
    transition: all 0.2s ease;
    cursor: pointer;
    border: none;
    text-transform: none;
    letter-spacing: 0;
    min-height: 44px;
}

.btn-large {
    padding: 0.85rem 2rem;
    font-size: 0.95rem;
}

.btn-primary {
    background: var(--bma-green);
    color: var(--bma-white);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); /* Clean shadow, no color bleed */
}

.btn-primary:hover {
    background: var(--bma-green-bright);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); /* Slightly larger shadow on hover, still no green glow */
}

.btn-secondary {
    background: transparent;
    color: var(--bma-white);
    border: 2px solid rgba(255, 255, 255, 0.3);
    position: relative;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.25);
}

.btn-secondary::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 2px;
    background: linear-gradient(135deg, var(--bma-green-bright), var(--bma-yellow));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.btn-secondary:hover::before {
    opacity: 1;
}

.btn-secondary:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: transparent;
    color: var(--bma-yellow-bright);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    transform: translateY(-1px);
}

/* ===== Product Showcase Header (Animated) ===== */
.product-showcase-header {
    padding: 4rem 0 3rem 0;
    background:
        radial-gradient(circle at 20% -20%, rgba(0, 230, 118, 0.25) 0%, rgba(0, 230, 118, 0.1) 30%, transparent 50%),
        radial-gradient(circle at 80% -20%, rgba(255, 215, 0, 0.2) 0%, rgba(255, 215, 0, 0.08) 30%, transparent 50%),
        radial-gradient(circle at 30% 120%, rgba(255, 215, 0, 0.25) 0%, rgba(255, 215, 0, 0.1) 30%, transparent 50%),
        radial-gradient(circle at 70% 120%, rgba(0, 230, 118, 0.2) 0%, rgba(0, 230, 118, 0.08) 30%, transparent 50%),
        linear-gradient(135deg, var(--bma-dark-100) 0%, rgba(46, 139, 87, 0.15) 50%, var(--bma-dark-100) 100%);
    background-size: 200% 200%;
    animation: gradientShift 15s ease infinite;
    position: relative;
}

.product-showcase-header::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    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)' opacity='0.03'/%3E%3C/svg%3E");
    pointer-events: none;
    z-index: 1;
}

.product-showcase-header > * {
    position: relative;
    z-index: 2;
}

/* ===== Product Showcase Sports (Dark Background) ===== */
.product-showcase-sports {
    padding: 2rem 0 3rem 0;
    background: #101010;
    position: relative;
}

@keyframes gradientShift {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

.sport-category {
    margin-bottom: 4rem;
}

.sport-category:last-child {
    margin-bottom: 0;
}

.category-label {
    font-size: 0.95rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: var(--bma-green-bright);
    margin-bottom: 1.5rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    position: relative;
}

.category-label::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 60px;
    height: 2px;
    background: rgba(255, 255, 255, 0.8);
}

.sport-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
}

.sport-card {
    background:
        linear-gradient(135deg, rgba(46, 139, 87, 0.08) 0%, rgba(10, 10, 10, 0.6) 100%);
    border: 2px solid transparent;
    border-radius: 16px;
    padding: 1.5rem 1rem;
    text-align: center;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    position: relative;
    overflow: hidden;
}

.sport-card::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 2px;
    background: linear-gradient(135deg, var(--bma-green-bright), var(--bma-yellow));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.sport-card:hover {
    transform: translateY(-10px) scale(1.02);
    box-shadow: 0 20px 50px rgba(0, 230, 118, 0.4);
}

.sport-card:hover::before {
    opacity: 1;
}

.sport-icon {
    width: 60px;
    height: 60px;
    margin: 0 auto 0.75rem;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    padding: 1rem;
    background-color: rgba(255, 255, 255, 0.03);
    border-radius: 12px;
    border: 2px solid transparent;
    background-clip: padding-box;
    position: relative;
    transition: all 0.3s ease;
    filter: brightness(0) saturate(100%) invert(79%) sepia(79%) saturate(2476%) hue-rotate(86deg) brightness(98%) contrast(119%) drop-shadow(0 0 8px rgba(0, 230, 118, 0.6));
}

.sport-icon::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 16px;
    padding: 2px;
    background: var(--gradient-primary);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.sport-card:hover .sport-icon::before {
    opacity: 1;
}

.sport-card:hover .sport-icon {
    background-color: rgba(46, 139, 87, 0.1);
    transform: translateY(-4px);
    filter: brightness(0) saturate(100%) invert(79%) sepia(79%) saturate(2476%) hue-rotate(86deg) brightness(98%) contrast(119%) drop-shadow(0 0 16px rgba(0, 230, 118, 0.9)) drop-shadow(0 0 24px rgba(0, 230, 118, 0.7));
}

.sport-card h3 {
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0;
    color: var(--bma-white);
    letter-spacing: 0.5px;
}

.sport-leagues {
    font-size: 0.75rem;
    color: rgba(0, 230, 118, 0.7);
    margin: 0.25rem 0 0 0;
    font-weight: 500;
    letter-spacing: 0.5px;
}

/* Product Showcase - How It Works / Formats / Bet Types cards */
.sport-grid-steps {
    grid-template-columns: repeat(3, 1fr);
}

.showcard-number {
    width: 60px;
    height: 60px;
    margin: 0 auto 0.75rem;
    background: var(--gradient-accent);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    font-weight: 900;
    color: var(--bma-black);
    box-shadow: 0 6px 20px rgba(255, 215, 0, 0.3);
    transition: all 0.4s ease;
}

.sport-card:hover .showcard-number {
    transform: translateY(-4px) scale(1.1);
    box-shadow: 0 8px 30px rgba(255, 215, 0, 0.5);
}

.showcard-desc {
    font-size: 0.8rem;
    color: rgba(0, 230, 118, 0.7);
    margin: 0.5rem 0 0 0;
    font-weight: 500;
    letter-spacing: 0.5px;
    line-height: 1.4;
}

.sport-card.showcard-format .showcard-desc,
.sport-card.showcard-step .showcard-desc {
    margin-top: 0.35rem;
}

/* ===== How It Works - Tournament Mechanics ===== */
.how-it-works {
    padding: clamp(2.5rem, 4vw, 4rem) 0;
    background:
        linear-gradient(135deg, rgba(46, 139, 87, 0.15), rgba(255, 215, 0, 0.08)),
        rgba(10, 10, 10, 0.85);
    position: relative;
    overflow: visible;
}

.how-it-works .container {
    position: relative;
    z-index: 1;
}

/* ===== FanDuel Style Steps ===== */
.steps-horizontal {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    margin: 3rem 0;
}

.step-card {
    background: linear-gradient(135deg, rgba(46, 139, 87, 0.08) 0%, rgba(10, 10, 10, 0.6) 100%);
    border: 2px solid transparent;
    border-radius: 16px;
    padding: 2rem 1rem;
    text-align: center;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    position: relative;
    overflow: hidden;
}

.step-card::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 2px;
    background: linear-gradient(135deg, var(--bma-green-bright), var(--bma-yellow));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.step-card:hover {
    transform: translateY(-10px) scale(1.02);
    box-shadow: 0 20px 50px rgba(0, 230, 118, 0.4);
}

.step-card:hover::before {
    opacity: 1;
}

.step-number-circle {
    width: 60px;
    height: 60px;
    margin: 0 auto 1rem;
    background: var(--gradient-accent);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    font-weight: 900;
    color: var(--bma-black);
    box-shadow: 0 6px 20px rgba(255, 215, 0, 0.3);
    transition: all 0.4s ease;
}

.step-card:hover .step-number-circle {
    transform: translateY(-4px) scale(1.1);
    box-shadow: 0 8px 30px rgba(255, 215, 0, 0.5);
}

.step-card h3 {
    color: var(--bma-white);
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    letter-spacing: 0.5px;
}

.step-card p {
    color: rgba(0, 230, 118, 0.7);
    font-size: 0.85rem;
    font-weight: 500;
    letter-spacing: 0.5px;
    line-height: 1.4;
}

/* FanDuel Style Tabs */
.fd-tabs {
    margin-top: 4rem;
    background: rgba(10, 10, 10, 0.8);
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    overflow: hidden;
}

.fd-tab-nav {
    display: flex;
    background: rgba(0, 0, 0, 0.4);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.fd-tab-btn {
    flex: 1;
    padding: 1.25rem 2rem;
    background: none;
    border: none;
    color: rgba(255, 255, 255, 0.6);
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
}

.fd-tab-btn:hover {
    color: var(--bma-white);
    background: rgba(255, 255, 255, 0.05);
}

.fd-tab-btn.active {
    color: var(--bma-green-bright);
    background: rgba(0, 230, 118, 0.1);
}

.fd-tab-btn.active::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--bma-green-bright);
}

.fd-tab-content {
    padding: 2rem;
}

.fd-tab-panel {
    display: none;
}

.fd-tab-panel.active {
    display: block;
}

.format-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
}

.format-item {
    background: linear-gradient(135deg, rgba(46, 139, 87, 0.08) 0%, rgba(10, 10, 10, 0.6) 100%);
    border: 2px solid transparent;
    border-radius: 16px;
    padding: 1.5rem 1rem;
    text-align: center;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    position: relative;
    overflow: hidden;
}

.format-item::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 2px;
    background: linear-gradient(135deg, var(--bma-green-bright), var(--bma-yellow));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.format-item:hover {
    transform: translateY(-10px) scale(1.02);
    box-shadow: 0 20px 50px rgba(0, 230, 118, 0.4);
}

.format-item:hover::before {
    opacity: 1;
}

.format-badge {
    display: block;
    font-weight: 700;
    font-size: 1.1rem;
    color: var(--bma-white);
    margin-bottom: 0.5rem;
    letter-spacing: 0.5px;
}

.format-desc {
    display: block;
    color: rgba(0, 230, 118, 0.7);
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 0.5px;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .steps-horizontal {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .format-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    }

    .fd-tab-btn {
        font-size: 0.9rem;
        padding: 1rem;
    }
}

/* ===== How to Compete Section ===== */
.how-to-compete {
    padding: clamp(2.5rem, 4vw, 4rem) 0;
    background:
        linear-gradient(135deg, rgba(46, 139, 87, 0.15), rgba(255, 215, 0, 0.08)),
        rgba(10, 10, 10, 0.85);
    position: relative;
    overflow: visible;
}

.how-to-compete .container {
    position: relative;
    z-index: 1;
}

/* Tournament Types */
.tournament-types {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.5rem;
    margin: 3rem 0 5rem;
}

.tournament-type-card {
    background: linear-gradient(135deg, rgba(46, 139, 87, 0.08) 0%, rgba(10, 10, 10, 0.6) 100%);
    border: 2px solid transparent;
    border-radius: 16px;
    padding: 2rem 1.5rem;
    text-align: center;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    position: relative;
    overflow: hidden;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.tournament-type-card::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 2px;
    background: linear-gradient(135deg, var(--bma-green-bright), var(--bma-yellow));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.tournament-type-card:hover {
    transform: translateY(-10px) scale(1.02);
    box-shadow: 0 20px 50px rgba(0, 230, 118, 0.4);
}

.tournament-type-card:hover::before {
    opacity: 1;
}

.tournament-type-icon {
    width: 60px;
    height: 60px;
    margin: 0 auto 0.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(255, 255, 255, 0.03);
    border-radius: 12px;
    border: 2px solid transparent;
    background-clip: padding-box;
    position: relative;
    transition: all 0.3s ease;
}

.tournament-type-icon svg {
    filter: brightness(0) saturate(100%) invert(79%) sepia(79%) saturate(2000%) hue-rotate(86deg) brightness(98%) contrast(115%);
    transition: all 0.3s ease;
}

.tournament-type-icon::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 16px;
    padding: 2px;
    background: var(--gradient-primary);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.tournament-type-card:hover .tournament-type-icon::before {
    opacity: 1;
}

.tournament-type-card:hover .tournament-type-icon {
    background-color: rgba(46, 139, 87, 0.1);
    transform: translateY(-4px);
}

.tournament-type-card:hover .tournament-type-icon svg {
    filter: brightness(0) saturate(100%) invert(79%) sepia(79%) saturate(2476%) hue-rotate(86deg) brightness(98%) contrast(119%) drop-shadow(0 0 16px rgba(0, 230, 118, 0.9)) drop-shadow(0 0 24px rgba(0, 230, 118, 0.7));
}

.tournament-type-card h3 {
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0;
    color: var(--bma-white);
    letter-spacing: 0.5px;
}

/* Bet Types */
.bet-types {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 2rem;
    margin: 2rem 0 4rem;
    width: 100%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

.bet-type-label {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--bma-white);
    letter-spacing: 0.2px;
    text-transform: none;
    flex: 1;
    text-align: center;
    white-space: nowrap;
}

.bet-type-separator {
    color: var(--bma-green-bright);
    font-size: 2rem;
    font-weight: 900;
    flex-shrink: 0;
}

.mechanics-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: start;
}

/* LEFT COLUMN - Mechanics & Steps */
.mechanics-left {
    padding-right: 2rem;
}

.mechanics-intro {
    font-size: 1.1rem;
    color: rgba(255, 255, 255, 0.85);
    margin: 0 auto 1.5rem;
    line-height: 1.7;
    max-width: 800px;
    text-align: center;
    font-weight: 500;
}

.td-currency {
    color: var(--bma-green-bright);
    font-weight: 800;
    font-size: 1.1em;
}

.td-label {
    color: var(--bma-green-bright);
    font-size: 0.9em;
}

.mechanics-steps {
    margin-bottom: 2rem;
}

.mechanics-step {
    display: flex;
    gap: 1.5rem;
    margin-bottom: 2rem;
    align-items: flex-start;
}

.step-number {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: var(--gradient-accent);
    color: var(--bma-black);
    font-size: 1.5rem;
    font-weight: 900;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 6px 20px rgba(255, 215, 0, 0.3);
}

.step-content h3 {
    font-size: 1.25rem;
    font-weight: 800;
    margin-bottom: 0.5rem;
    color: var(--bma-white);
}

.step-content p {
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.95rem;
    line-height: 1.6;
}

.mechanics-note {
    background: linear-gradient(135deg, rgba(46, 139, 87, 0.1) 0%, rgba(46, 139, 87, 0.05) 100%);
    border: 1px solid rgba(46, 139, 87, 0.2);
    border-radius: 12px;
    padding: 1.5rem;
}

.mechanics-note p {
    color: rgba(255, 255, 255, 0.85);
    font-size: 0.95rem;
    line-height: 1.6;
    margin: 0;
}

.mechanics-note strong {
    color: var(--bma-green);
}

/* RIGHT COLUMN - Product Showcase */
.mechanics-right {
    position: sticky;
    top: 100px;
}

.tournament-mockup {
    position: relative;
    border: 2px solid rgba(46, 139, 87, 0.3);
    border-radius: 20px;
    padding: 2rem;
    margin-bottom: 2rem;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
    overflow: hidden;
}

.tournament-mockup::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-size: cover;
    background-position: center;
    z-index: 0;
    border-radius: 20px;
    animation: mockupBackgroundRotate 20s infinite;
}

@keyframes mockupBackgroundRotate {
    0%, 33.33% {
        background-image: url('https://images.unsplash.com/photo-1471295253337-3ceaaedca402?q=80&w=2336&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D');
    }
    33.34%, 66.66% {
        background-image: url('https://images.unsplash.com/photo-1770067665792-9975acdec4fb?q=80&w=2340&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D');
    }
    66.67%, 100% {
        background-image: url('https://images.unsplash.com/photo-1629217855633-79a6925d6c47?q=80&w=2340&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D');
    }
}

.tournament-mockup::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background:
        radial-gradient(circle at 30% 20%, rgba(0, 230, 118, 0.3) 0%, transparent 50%),
        radial-gradient(circle at 70% 80%, rgba(255, 215, 0, 0.25) 0%, transparent 50%),
        repeating-linear-gradient(
            90deg,
            transparent,
            transparent 2px,
            rgba(255,255,255,0.015) 2px,
            rgba(255,255,255,0.015) 4px
        ),
        repeating-linear-gradient(
            0deg,
            transparent,
            transparent 2px,
            rgba(255,255,255,0.015) 2px,
            rgba(255,255,255,0.015) 4px
        ),
        linear-gradient(135deg, rgba(0, 230, 118, 0.6) 0%, rgba(0, 0, 0, 0.9) 100%),
        linear-gradient(45deg, rgba(255, 215, 0, 0.12) 0%, rgba(220, 20, 60, 0.08) 100%);
    z-index: 1;
    border-radius: 20px;
}

.mockup-logo {
    height: 120px;
    width: 120px;
    margin: 0 auto 2rem;
    display: block;
    object-fit: contain;
}

.mockup-card {
    position: relative;
    z-index: 2;
    background: linear-gradient(135deg, rgba(46, 139, 87, 0.15) 0%, rgba(10, 10, 10, 0.85) 100%);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(46, 139, 87, 0.3);
    border-radius: 16px;
    padding: 1.5rem;
}

.mockup-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.tournament-title {
    font-size: 1.25rem;
    font-weight: 900;
    color: var(--bma-white);
}

.live-indicator {
    color: var(--bma-red);
    font-weight: 800;
    font-size: 0.85rem;
}

.mockup-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}

.mockup-stat {
    text-align: center;
}

.stat-label {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.6);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.5rem;
    display: block;
}

.stat-value {
    font-size: 1.5rem;
    font-weight: 900;
    color: var(--bma-white);
    display: block;
}

.stat-value.live {
    color: #00E676 !important;
}

#rotating-budget {
    color: #00E676 !important;
}

/* Platform Screenshots - Staggered Phone Layout */
.platform-previews {
    display: flex;
    flex-direction: column;
    gap: clamp(1.5rem, 3vw, 3rem);
    margin-top: 2rem;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

/* Mobile first approach - start with stacked layout */
.preview-item {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    align-items: center;
    text-align: center;
    position: relative;
    overflow: visible;
}

/* Desktop layout - side by side */
@media (min-width: 769px) {
    .preview-item {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 4rem;
        text-align: left;
        align-items: center;
    }

    .preview-center {
        margin-top: -3rem;
    }

    .preview-center .preview-content {
        order: 2;
    }

    .preview-center .phone-mockup {
        order: 1;
    }

    .preview-right {
        margin-top: -3rem;
    }

    .preview-content {
        align-items: flex-start;
    }
}

.preview-content {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

@media (max-width: 768px) {
    .how-to-compete .preview-content {
        align-items: center;
    }
}

.preview-number {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: var(--gradient-accent);
    color: var(--bma-black);
    font-size: 1.5rem;
    font-weight: 900;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 6px 20px rgba(255, 215, 0, 0.3);
}

.preview-title {
    font-size: 2.25rem;
    font-weight: 900;
    color: var(--bma-white);
    margin: 0;
    line-height: 1.1;
}

.preview-description {
    font-size: 1.15rem;
    color: rgba(255, 255, 255, 0.75);
    line-height: 1.7;
    margin: 0;
}

/* Phone Mockup */
.phone-mockup {
    width: 100%;
    max-width: 280px;
    margin: 0 auto;
    transition: transform 0.4s ease;
    position: relative;
}

/* No effects - clean phone mockups */

.phone-mockup:hover {
    transform: scale(1.05) rotate(2deg);
}

.preview-center .phone-mockup:hover {
    transform: scale(1.05) rotate(-2deg);
}

.phone-frame {
    position: relative;
    background: linear-gradient(135deg, #1a1a1a 0%, #0d0d0d 100%);
    border: 8px solid #0a0a0a;
    border-radius: 40px;
    padding: 12px;
    box-shadow:
        0 25px 70px rgba(0, 0, 0, 0.7),
        inset 0 0 0 2px rgba(255, 255, 255, 0.1);
    aspect-ratio: 9 / 19.5;
    z-index: 1;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.phone-frame::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 40px;
    padding: 2px;
    background: linear-gradient(135deg, var(--bma-green-bright), var(--bma-yellow));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.phone-mockup:hover .phone-frame::before {
    opacity: 1;
}

.phone-mockup:hover .phone-frame {
    box-shadow:
        0 25px 70px rgba(0, 0, 0, 0.7),
        inset 0 0 0 2px rgba(255, 255, 255, 0.1),
        0 0 40px rgba(0, 230, 118, 0.4);
}

.phone-notch {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 120px;
    height: 28px;
    background: #0a0a0a;
    border-radius: 0 0 20px 20px;
    z-index: 10;
}

.phone-screen {
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, #1a1a1a 0%, #0f0f0f 100%);
    border-radius: 32px;
    overflow: hidden;
    position: relative;
    padding: 0;
}

/* Images inside phone screens - proper fitting for iPhone screenshots */
.phone-screen img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top center;
    display: block;
    border-radius: 28px; /* Slightly smaller for natural inset */
}

.placeholder-content {
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.3);
    font-weight: 600;
    letter-spacing: 0.5px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.phone-screenshot {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    border-radius: 32px;
    position: absolute;
    top: 0;
    left: 0;
}

/* Remove phone-frame padding when there's a screenshot */
.phone-screen:has(.phone-screenshot) {
    padding: 0 !important;
}

.phone-frame:has(.phone-screenshot) {
    padding: 0 !important;
}

/* ===== Live Tournaments ===== */
.live-tournaments {
    padding: clamp(2.5rem, 4vw, 4rem) 0;
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(46, 139, 87, 0.15), rgba(255, 215, 0, 0.08)),
        rgba(10, 10, 10, 0.85);
}

.live-tournaments .container,
.live-tournaments-inner {
    position: relative;
    z-index: 2;
    max-width: 100%;
    margin: 0 auto;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
}

.live-tournaments .section-header h2,
.live-tournaments .section-header p {
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.8);
}

.tournament-list {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    margin-bottom: 3rem;
}

/* ===== Tournament Tables (Tabulator) ===== */
.tournament-table {
    margin-bottom: 3rem;
    width: 100%;
    max-width: 100%;
}

#starting-soon-table,
#tournaments-table {
    width: 100%;
    display: block;
}

.live-tournaments .tournament-table,
.live-tournaments #starting-soon-table {
    width: 100%;
    max-width: 100%;
    position: relative;
    z-index: 2;
}

.live-tournaments #starting-soon-table.tabulator {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
}

.starting-soon-header {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 2.5rem;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: clamp(1.5rem, 4vw, 4rem);
    padding-right: clamp(1.5rem, 4vw, 4rem);
}

.section-eyebrow {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.65);
}

.starting-soon-header h2 {
    margin: 0;
}

.section-subline {
    max-width: 640px;
    margin: 0 auto;
    color: rgba(255, 255, 255, 0.75);
}

.starting-soon-cta {
    margin-top: 0.25rem;
}

/* Footer section for View All button below the table */
.starting-soon-footer {
    text-align: center;
    padding: 2rem 0;
    margin-top: 2rem;
}

.starting-soon-shell {
    position: relative;
    padding: 0;
    background: linear-gradient(135deg,
        rgba(20, 20, 20, 0.9) 0%,
        rgba(10, 10, 10, 0.95) 100%);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 16px;
    box-shadow:
        0 20px 40px rgba(0, 0, 0, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    width: 95vw;
    max-width: 95vw;
    margin: 0 auto;
    overflow: hidden;
}

.starting-soon-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    background:
        linear-gradient(135deg,
            rgba(0, 230, 118, 0.15) 0%,
            rgba(255, 215, 0, 0.08) 100%),
        rgba(15, 15, 15, 0.95);
    border-bottom: 1px solid rgba(0, 230, 118, 0.4);
    box-shadow:
        inset 0 -1px 0 rgba(255, 215, 0, 0.2),
        0 2px 8px rgba(0, 0, 0, 0.3);
    padding: 1rem 1.25rem;
    margin: 0;
    width: 100%;
    border-radius: 16px 16px 0 0;
}

.starting-soon-toolbar .toolbar-left {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.toolbar-search input {
    background: rgba(0, 0, 0, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.9);
    padding: 0.5rem 0.75rem;
    min-width: 220px;
    border-radius: 6px;
}

.toolbar-search input::placeholder {
    color: rgba(255, 255, 255, 0.5);
}

.toolbar-filters {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.toolbar-pill {
    background: rgba(0, 0, 0, 0.45);
    border: 1px solid rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.7);
    padding: 0.35rem 0.65rem;
    font-size: 0.7rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    border-radius: 6px;
}

.toolbar-pill.active {
    border-color: rgba(0, 230, 118, 0.6);
    color: var(--bma-green-bright);
}

.toolbar-legend {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: rgba(255, 255, 255, 0.6);
}

.legend-item {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.legend-item::before {
    content: '';
    width: 8px;
    height: 8px;
    border-radius: 2px;
    background: rgba(255, 255, 255, 0.3);
}

.legend-live::before {
    background: rgba(0, 230, 118, 0.7);
}

.legend-upcoming::before {
    background: rgba(255, 215, 0, 0.8);
}

.legend-completed::before {
    background: rgba(255, 255, 255, 0.35);
}

.starting-soon-shell::before {
    content: none;
}

.starting-soon-shell::after {
    content: none;
}

.tournaments-page #tournaments-table {
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.tournaments-page #tournaments-table.tabulator {
    width: 100%;
    max-width: 100%;
}

#starting-soon-table.tabulator,
#tournaments-table.tabulator,
/* Enhanced Tabulator with glassmorphism */
.tabulator {
    background: linear-gradient(135deg,
        rgba(20, 20, 20, 0.9) 0%,
        rgba(10, 10, 10, 0.95) 100%);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 16px;
    overflow: hidden;
    position: relative;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow:
        0 20px 40px rgba(0, 0, 0, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
    width: 100%;
    margin-left: 0;
    margin-right: 0;
}

/* Special styling for Tabulator inside starting-soon-shell - seamless integration */
.starting-soon-shell .tabulator {
    background: transparent;
    border: none;
    border-radius: 0 0 16px 16px;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.starting-soon-shell .tabulator .tabulator-header {
    background: #0a0a0a;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: none;
}

.tabulator .tabulator-header {
    position: sticky;
    top: 0;
    z-index: 5;
}

.tabulator .tabulator-header .tabulator-col {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.tabulator .tabulator-row {
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
#starting-soon-table.tabulator .tabulator-header,
#starting-soon-table.tabulator .tabulator-col {
    background-color: #0a0a0a;
}

#starting-soon-table.tabulator .tabulator-col-title {
    color: rgba(255, 255, 255, 0.92);
}

.live-tournaments #starting-soon-table.tabulator .tabulator-header,
.live-tournaments #starting-soon-table.tabulator .tabulator-col {
    background-color: #0a0a0a;
}

.live-tournaments #starting-soon-table.tabulator .tabulator-col-title {
    color: rgba(255, 255, 255, 0.92);
}

.tabulator::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 0;
    pointer-events: none;
    box-shadow: inset 0 0 0 1px rgba(255, 215, 0, 0.08);
}

.tabulator .tabulator-tableholder,
.tabulator .tabulator-table {
    background: #0a0a0a;
    width: 100%;
}

#starting-soon-table.tabulator .tabulator-header,
#tournaments-table.tabulator .tabulator-header,
/* Enhanced header with better glassmorphism */
.tabulator .tabulator-header {
    background:
        linear-gradient(135deg,
            rgba(0, 230, 118, 0.15) 0%,
            rgba(255, 215, 0, 0.08) 100%),
        #0a0a0a;
    border-bottom: 1px solid rgba(0, 230, 118, 0.4);
    box-shadow:
        inset 0 -1px 0 rgba(255, 215, 0, 0.2),
        0 2px 8px rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    position: relative;
}

.tabulator .tabulator-header::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 2px;
    background: linear-gradient(90deg, rgba(0, 230, 118, 0.9), rgba(255, 215, 0, 0.9));
}

.tabulator .tabulator-col {
    background: #0a0a0a;
    border-right: 1px solid rgba(255, 255, 255, 0.04);
    cursor: pointer;
}

.tabulator .tabulator-col:last-child {
    border-right: none;
}

.tabulator .tabulator-col .tabulator-col-content {
    padding: 1rem 1.1rem;
}

#starting-soon-table.tabulator .tabulator-col-title,
#tournaments-table.tabulator .tabulator-col-title,
.tabulator .tabulator-col-title {
    font-family: var(--font-primary);
}

.tabulator .tabulator-col-sorter {
    color: rgba(255, 215, 0, 0.75);
}

.tabulator .tabulator-col-sorter .tabulator-arrow {
    border-bottom-color: rgba(255, 215, 0, 0.7);
    border-top-color: rgba(255, 215, 0, 0.7);
}

.tabulator .tabulator-col.tabulator-sortable:hover {
    background: rgba(0, 230, 118, 0.08);
}

.tabulator .tabulator-col[aria-sort="ascending"],
.tabulator .tabulator-col[aria-sort="descending"] {
    background: rgba(0, 230, 118, 0.12);
}

.tabulator .tabulator-col-title-holder {
    align-items: center;
}

#starting-soon-table.tabulator .tabulator-col-title,
#tournaments-table.tabulator .tabulator-col-title,
.tabulator .tabulator-col-title {
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.92);
    opacity: 1;
}

#starting-soon-table.tabulator .tabulator-col-title,
#tournaments-table.tabulator .tabulator-col-title {
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.65);
}

#starting-soon-table.tabulator .tabulator-row,
#tournaments-table.tabulator .tabulator-row,
.tabulator-row {
    background: #0a0a0a;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.tabulator-row.row-live {
    box-shadow: inset 4px 0 0 rgba(0, 230, 118, 0.8);
}

.tabulator-row.row-upcoming {
    box-shadow: inset 4px 0 0 rgba(255, 215, 0, 0.8);
}

.tabulator-row.row-completed {
    box-shadow: inset 4px 0 0 rgba(255, 255, 255, 0.25);
}

/* Row hover - removed specific backgrounds, using default transparent */

.tabulator-row.tabulator-selectable:hover {
    box-shadow: inset 0 0 0 1px rgba(0, 230, 118, 0.15);
}

#starting-soon-table.tabulator .tabulator-cell,
#tournaments-table.tabulator .tabulator-cell,
.tabulator-cell {
    padding: 1rem 1.1rem;
    color: rgba(255, 255, 255, 0.92);
    border-right: 1px solid rgba(255, 255, 255, 0.03);
    opacity: 1;
}

.tabulator .tabulator-cell.tabulator-cell-focus {
    outline: 2px solid rgba(0, 230, 118, 0.4);
    outline-offset: -2px;
}

/* Sports column with icons in Tabulator tables */
.sport-with-icon {
    display: inline-flex;
    align-items: center;
    margin-right: 0.75rem;
    white-space: nowrap;
}

.sport-with-icon .sport-icon-small {
    display: inline-block;
    width: 36px !important;
    height: 36px !important;
    margin-right: 0.5rem;
    padding: 6px;
    box-sizing: border-box;
    background-color: rgba(255, 255, 255, 0.03);
    background-size: 24px 24px !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 8px;
    /* Green glow filter to match rest of site */
    filter: brightness(0) saturate(100%) invert(79%) sepia(79%) saturate(2476%) hue-rotate(86deg) brightness(98%) contrast(119%) drop-shadow(0 0 4px rgba(0, 230, 118, 0.5)) !important;
    vertical-align: middle;
    transition: all 0.2s ease;
}

.tabulator-row:hover .sport-with-icon .sport-icon-small {
    background-color: rgba(46, 139, 87, 0.1);
    border-color: rgba(0, 230, 118, 0.2);
    transform: scale(1.05);
    filter: brightness(0) saturate(100%) invert(79%) sepia(79%) saturate(2476%) hue-rotate(86deg) brightness(98%) contrast(119%) drop-shadow(0 0 8px rgba(0, 230, 118, 0.8)) !important;
}

.sport-with-icon .sport-name {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.75px;
    vertical-align: middle;
    color: rgba(255, 255, 255, 0.85);
}

.tabulator .tabulator-cell {
    font-size: 0.95rem;
    line-height: 1.5;
}

.tabulator .tabulator-cell a {
    color: rgba(255, 255, 255, 0.95);
}

.tabulator .tabulator-cell[tabulator-field="title"] {
    font-weight: 600;
    color: rgba(255, 255, 255, 0.98);
}

.tabulator .tabulator-cell[tabulator-field="time"] {
    color: rgba(255, 255, 255, 0.78);
}

.tab-title {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tabulator .tabulator-cell[tabulator-field="sports"] {
    color: rgba(255, 255, 255, 0.75);
}

.tabulator .tabulator-cell[tabulator-field="matches"] {
    color: rgba(255, 255, 255, 0.9);
}

.tabulator .tabulator-cell[tabulator-field="entry"] {
    color: var(--bma-green-bright);
    font-weight: 700;
}

.tabulator .tabulator-cell[tabulator-field="td"] {
    color: var(--bma-yellow);
    font-weight: 700;
}

.tabulator .tabulator-cell[tabulator-field="status"] {
    letter-spacing: 0.05em;
}

/* Enhanced table CTA buttons */
.tabulator .tabulator-cell[tabulator-field="link"] .btn {
    padding: 0.6rem 1.3rem;
    min-height: 40px;
    font-weight: 700;
    border-radius: 4px;
    transition: all 0.3s ease;
}

/* Enter Free button - gradient green */
.tabulator .btn.btn-primary.btn-small {
    background: linear-gradient(135deg,
        var(--bma-green) 0%,
        rgba(0, 230, 118, 0.9) 100%);
    color: white;
    border: 1px solid rgba(0, 230, 118, 0.3);
}

.tabulator .btn.btn-primary.btn-small:hover {
    transform: translateY(-2px) scale(1.05);
    box-shadow: 0 6px 20px rgba(0, 230, 118, 0.35);
}

/* View Results button - glassmorphic */
.tabulator .btn.btn-secondary.btn-small {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.15);
    color: rgba(255, 255, 255, 0.9);
}

.tabulator .btn.btn-secondary.btn-small:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.25);
    transform: translateY(-2px);
}

.tabulator-cell.tabulator-cell-last {
    text-align: right;
}

.tabulator .tabulator-placeholder {
    background: #0a0a0a;
    color: rgba(255, 255, 255, 0.8);
}

.tabulator .tabulator-tableholder .tabulator-placeholder span {
    color: rgba(255, 255, 255, 0.8);
}

.tabulator-cell:last-child {
    border-right: none;
}

.tabulator-cell a {
    color: inherit;
    text-decoration: none;
}

.tabulator-cell .btn {
    text-decoration: none;
    white-space: nowrap;
}

/* Enhanced status badges with better prominence */
.tab-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.45rem 1rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    border: 1px solid transparent;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.4);
    transition: all 0.3s ease;
    white-space: nowrap;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.35);
    gap: 0.4rem;
}

.status-debug-copy {
    background: rgba(0, 0, 0, 0.45);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: rgba(255, 255, 255, 0.8);
    font-size: 0.6rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 0.2rem 0.45rem;
    cursor: pointer;
}

.status-debug-text {
    display: block;
    margin-top: 0.25rem;
    font-size: 0.65rem;
    letter-spacing: 0.05em;
    color: rgba(255, 255, 255, 0.55);
}

/* Enhanced LIVE status - clean, no pulsing */
.tab-status.status-live {
    background: linear-gradient(135deg,
        rgba(220, 20, 60, 0.85) 0%,
        rgba(255, 23, 68, 0.85) 100%);
    border-color: rgba(220, 20, 60, 0.8);
    color: white;
    font-weight: 900;
    position: relative;
    padding-left: 1.8rem;
    box-shadow: 0 2px 8px rgba(220, 20, 60, 0.3);
}

/* Static dot for LIVE */
.tab-status.status-live::before {
    content: '';
    position: absolute;
    left: 0.65rem;
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
    height: 8px;
    background: white;
    border-radius: 50%;
}

/* Enhanced UPCOMING status */
.tab-status.status-upcoming {
    background: linear-gradient(135deg,
        rgba(255, 215, 0, 0.25) 0%,
        rgba(255, 237, 78, 0.2) 100%);
    border-color: rgba(255, 215, 0, 0.7);
    color: var(--bma-yellow-bright);
    font-weight: 800;
}

/* COMPLETED status - subtle */
.tab-status.status-completed {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.25);
    color: rgba(255, 255, 255, 0.7);
}

/* Status with countdown styling - keep on single line */
.tab-status.with-countdown {
    flex-direction: row;
    align-items: center;
    padding: 0.35rem 0.7rem;
    white-space: nowrap;
}

.tabulator .tabulator-footer {
    background: rgba(6, 6, 6, 0.95);
    border-top: 1px solid rgba(0, 230, 118, 0.25);
    color: rgba(255, 255, 255, 0.8);
}

.tabulator .tabulator-footer .tabulator-paginator {
    padding: 0.75rem 1rem;
}

.tabulator .tabulator-footer .tabulator-page {
    background: rgba(0, 0, 0, 0.65);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: rgba(255, 255, 255, 0.82);
    border-radius: 8px;
    padding: 0.4rem 0.75rem;
    font-weight: 600;
}

.tabulator .tabulator-footer .tabulator-page.active {
    background: rgba(0, 230, 118, 0.3);
    border-color: rgba(0, 230, 118, 0.7);
    color: var(--bma-green-bright);
}

.tabulator .tabulator-footer .tabulator-page:hover {
    background: rgba(0, 230, 118, 0.12);
}

.tabulator .tabulator-footer .tabulator-page-size {
    background: rgba(0, 0, 0, 0.65);
    border: 1px solid rgba(255, 255, 255, 0.22);
    color: rgba(255, 255, 255, 0.85);
    border-radius: 8px;
    padding: 0.4rem 0.6rem;
}

.tabulator-responsive-collapse-toggle {
    color: var(--bma-green-bright);
}

.tabulator .tabulator-responsive-collapse {
    background: rgba(6, 6, 6, 0.95);
    border-top: 1px solid rgba(0, 230, 118, 0.2);
}

.tabulator .tabulator-responsive-collapse table {
    width: 100%;
}

.tabulator .tabulator-responsive-collapse td {
    padding: 0.65rem 0.75rem;
    color: rgba(255, 255, 255, 0.8);
}

.tab-collapse {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.4rem 0.2rem;
}

.tab-collapse-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}

.tab-collapse-label {
    font-size: 0.7rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.6);
}

.tab-collapse-value {
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.9);
}

@media (max-width: 768px) {
    .starting-soon-header {
        margin-bottom: 2rem;
        gap: 0.6rem;
    }

    .section-subline {
        font-size: 0.95rem;
    }

    .starting-soon-shell {
        padding: 0.75rem;
    }

    .starting-soon-toolbar {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
        width: 95vw;
        max-width: 95vw;
    }

    .toolbar-search input {
        width: 100%;
        min-width: 0;
    }

    .toolbar-legend {
        justify-content: center;
        flex-wrap: wrap;
    }

    .tabulator .tabulator-col .tabulator-col-content {
        padding: 0.8rem 0.75rem;
    }

    .tabulator-cell {
        padding: 0.75rem 0.75rem;
        font-size: 0.9rem;
    }

    .tab-status {
        font-size: 0.65rem;
        padding: 0.3rem 0.6rem;
    }

    .tabulator .tabulator-cell[tabulator-field="link"] .btn {
        padding: 0.45rem 0.9rem;
        min-height: 36px;
        font-size: 0.85rem;
    }

    .tabulator .tabulator-responsive-collapse td {
        padding: 0.55rem 0.6rem;
        font-size: 0.85rem;
    }

    .tabulator .tabulator-footer .tabulator-paginator {
        padding: 0.6rem 0.75rem;
    }
}

@media (max-width: 480px) {
    .starting-soon-header {
        margin-bottom: 1.6rem;
    }

    .section-eyebrow {
        font-size: 0.65rem;
        letter-spacing: 0.18em;
    }

    .section-subline {
        font-size: 0.9rem;
    }

    .starting-soon-shell {
        padding: 0.6rem;
    }

    .toolbar-filters {
        flex-wrap: wrap;
    }

    .tabulator {
        border-radius: 14px;
    }

    .tabulator .tabulator-col-title {
        font-size: 0.65rem;
    }

    .tabulator-cell {
        font-size: 0.85rem;
    }

    .tab-status {
        letter-spacing: 0.08em;
    }

    .tabulator .tabulator-cell[tabulator-field="link"] .btn {
        width: 100%;
        justify-content: center;
    }
}

.tournament-item {
    background: rgba(12, 12, 12, 0.7);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 16px;
    padding: 2rem;
    display: grid;
    grid-template-columns: 210px 1.2fr auto 180px;
    gap: 2rem;
    align-items: center;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    position: relative;
    overflow: hidden;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.tournament-item::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 2px;
    background: linear-gradient(135deg, rgba(0, 230, 118, 0.45), rgba(255, 215, 0, 0.4));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.tournament-item:hover {
    transform: translateY(-10px) scale(1.02);
    box-shadow: 0 20px 50px rgba(0, 230, 118, 0.4);
}

.tournament-item:hover::before {
    opacity: 1;
}

.tournament-card .card-status {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    min-width: 0;
}

.tournament-card .card-main h3 {
    margin-bottom: 0.35rem;
}

.tournament-card .card-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(80px, 1fr));
    gap: 1rem;
}

.tournament-card .card-cta {
    display: flex;
    justify-content: flex-end;
}

.tournament-card .card-cta .btn {
    width: 100%;
}

@media (max-width: 1024px) {
    .tournament-card {
        grid-template-columns: 1fr 1fr;
        grid-template-areas:
            "status main"
            "stats cta";
    }

    .tournament-card .card-status {
        grid-area: status;
    }

    .tournament-card .card-main {
        grid-area: main;
    }

    .tournament-card .card-stats {
        grid-area: stats;
        grid-template-columns: repeat(3, minmax(70px, 1fr));
    }

    .tournament-card .card-cta {
        grid-area: cta;
        justify-content: flex-end;
    }
}

@media (max-width: 768px) {
    .tournament-card {
        grid-template-columns: 1fr;
        grid-template-areas:
            "status"
            "main"
            "stats"
            "cta";
        padding: 1.5rem;
    }

    .tournament-card .card-stats {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.75rem;
    }

    .tournament-card .card-cta {
        width: 100%;
    }
}

.tournament-time {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    position: relative;
    z-index: 1;
}

.tournament-sport-icons {
    display: inline-flex;
    gap: 0.4rem;
    align-items: center;
    margin-bottom: 0.5rem;
    flex-wrap: nowrap;
    line-height: 1.2;
}

.tournament-sport-icons .sport-icon {
    width: 16px !important;
    height: 16px !important;
    display: inline-block;
    margin-right: 0.15rem;
    flex-shrink: 0;
    opacity: 1;
    vertical-align: middle;
    /* Add green glow filter like marquee */
    filter: brightness(0) saturate(100%) invert(79%) sepia(79%) saturate(2476%) hue-rotate(86deg) brightness(98%) contrast(119%) drop-shadow(0 0 6px rgba(0, 230, 118, 0.6));
}

.tournament-sport-icons .sport-label {
    color: var(--bma-green-bright);
    font-size: 0.7rem;
    font-weight: 700;
    margin-right: 0.4rem;
    letter-spacing: 0.3px;
    text-transform: uppercase;
    line-height: 1;
}

.time-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background: rgba(0, 0, 0, 0.35);
    color: var(--bma-yellow-bright);
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.5px;
    border: 1px solid rgba(255, 215, 0, 0.35);
}

.time-badge.urgent {
    background: rgba(220, 20, 60, 0.2);
    color: var(--bma-white);
    border-color: rgba(220, 20, 60, 0.55);
}

.time-badge.completed {
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.6);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.time-badge.live {
    background: rgba(255, 23, 68, 0.2) !important;
    color: var(--bma-white) !important;
    border-color: rgba(255, 23, 68, 0.5) !important;
    animation: none !important;
}

.time-detail {
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.65);
}

.tournament-info {
    flex: 1;
}

.tournament-sport-badge {
    display: inline-block;
    background: var(--gradient-primary);
    color: var(--bma-white);
    padding: 0.25rem 0.75rem;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.5px;
}

.tournament-info h3 {
    font-size: 1.5rem;
    font-weight: 800;
    margin-bottom: 0.5rem;
    color: var(--bma-white);
}

.tournament-info p {
    color: rgba(255, 255, 255, 0.6);
    font-size: 1rem;
}

.tournament-stats {
    display: flex;
    gap: 1.5rem;
}

.stat-item {
    text-align: center;
}

.stat-item strong {
    display: block;
    font-size: 1.2rem;
    font-weight: 800;
    color: var(--bma-green-bright);
    margin-bottom: 0.25rem;
}

.stat-item span {
    display: block;
    font-size: 0.8rem;
    color: rgba(255, 255, 255, 0.7);
}

.view-all-cta {
    text-align: center;
}

/* ===== Beta Benefits ===== */
.beta-benefits {
    padding: clamp(2.5rem, 4vw, 4rem) 0;
    background: var(--bma-dark-200);
}

.benefits-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(2rem, 4vw, 4rem);
    align-items: start;
}

.benefit-badge {
    display: inline-block;
    background: var(--gradient-primary);
    color: var(--bma-white);
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 1px;
    margin-bottom: 1rem;
}

.benefits-left h2 {
    font-size: 2.5rem;
    font-weight: 900;
    margin-bottom: 1rem;
    color: var(--bma-white);
}

.benefits-lead {
    font-size: 1.15rem;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 2rem;
}

.benefits-list {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.benefit-item {
    display: flex;
    gap: 2rem;
    align-items: flex-start;
    background: rgba(0, 0, 0, 0.25);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 14px;
    padding: 1.25rem;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.benefit-icon {
    width: 80px;
    height: 80px;
    flex-shrink: 0;
    padding: 1.25rem;
    background-color: rgba(255, 255, 255, 0.03);
    border-radius: 16px;
    border: 2px solid transparent;
    background-clip: padding-box;
    position: relative;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.35);
}

.benefit-icon svg {
    width: 100%;
    height: 100%;
    filter: brightness(0) saturate(100%) invert(79%) sepia(79%) saturate(2000%) hue-rotate(86deg) brightness(98%) contrast(115%);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.benefit-icon::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 16px;
    padding: 2px;
    background: linear-gradient(135deg, var(--bma-green-bright), var(--bma-yellow));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.benefit-icon:hover::before {
    opacity: 1;
}

.benefit-icon:hover {
    background-color: rgba(46, 139, 87, 0.1);
    transform: translateY(-4px);
}

.benefit-icon:hover svg {
    filter: brightness(0) saturate(100%) invert(79%) sepia(79%) saturate(2476%) hue-rotate(86deg) brightness(98%) contrast(119%) drop-shadow(0 0 16px rgba(0, 230, 118, 0.9)) drop-shadow(0 0 24px rgba(0, 230, 118, 0.7));
}

.benefit-text strong {
    display: block;
    font-size: 1.35rem;
    font-weight: 800;
    color: var(--bma-white);
    margin-bottom: 0.5rem;
}

.benefit-text p {
    color: rgba(255, 255, 255, 0.65);
    font-size: 1rem;
    margin: 0;
    line-height: 1.7;
}

.benefits-right {
    position: sticky;
    top: 100px;
    align-self: start;
}

.benefits-visual {
    background: url('../images/Bet Max Tourney Home.jpg') left center/cover no-repeat;
    border: 1px solid rgba(255, 215, 0, 0.2);
    border-radius: 20px;
    padding: 5rem 3rem;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.benefits-visual::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(10, 10, 10, 0.65) 0%, rgba(10, 10, 10, 0.35) 100%);
    opacity: 1;
    z-index: 0;
}

.visual-placeholder {
    color: rgba(255, 255, 255, 0.5);
    font-size: 1rem;
    position: relative;
    z-index: 1;
}

.benefits-logo {
    width: 60%;
    max-width: 400px;
    height: auto;
    position: relative;
    z-index: 1;
}

/* ===== Final CTA ===== */
.final-cta {
    padding: clamp(2rem, 3.5vw, 3.5rem) 0;
    background: #000;
    text-align: center;
    position: relative;
    overflow: hidden;
}

/* Ensure content is above the animated background */
.final-cta .container {
    position: relative;
    z-index: 3;
}

.final-cta-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(1.5rem, 3vw, 4rem);
    align-items: center;
    justify-items: center;
}

.final-cta-left {
    position: relative;
    z-index: 2;
    padding: clamp(1.5rem, 3vw, 3rem);
}

.final-cta-right {
    position: relative;
    z-index: 2;
    padding: clamp(0.75rem, 1.5vw, 1.5rem);
    text-align: center;
    max-width: 600px;
}

.device-stack {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Laptop Mockup */
.laptop-mockup {
    position: relative;
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
}

.laptop-screen {
    background: linear-gradient(135deg, #1a1a1a 0%, #0d0d0d 100%);
    border: 8px solid #0a0a0a;
    border-radius: 12px 12px 0 0;
    padding: 8px;
    box-shadow:
        0 20px 60px rgba(0, 0, 0, 0.7),
        inset 0 0 0 2px rgba(255, 255, 255, 0.1);
    aspect-ratio: 16 / 10;
}

.laptop-screenshot {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    border-radius: 6px;
}

.laptop-screen .placeholder-content {
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(46, 139, 87, 0.1) 0%, rgba(10, 10, 10, 0.95) 100%);
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(255, 255, 255, 0.3);
    font-size: 1.25rem;
    font-weight: 600;
}

.laptop-base {
    width: 120%;
    height: 12px;
    background: linear-gradient(135deg, #1a1a1a 0%, #0a0a0a 100%);
    margin: 0 auto;
    border-radius: 0 0 8px 8px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);
}

/* Phone Mockup - Positioned over laptop */
.final-cta .phone-mockup {
    position: absolute;
    bottom: -50px;
    right: -60px;
    width: 220px; /* Increased from 180px to match hero */
    z-index: 3;
}

.final-cta .phone-mockup .phone-frame {
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.final-cta .phone-mockup .phone-frame::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 40px;
    padding: 2px;
    background: linear-gradient(135deg, var(--bma-green-bright), var(--bma-yellow));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0;
    transition: opacity 0.4s ease;
}

.final-cta .phone-mockup:hover .phone-frame::before {
    opacity: 1;
}

.final-cta .phone-mockup:hover .phone-frame {
    box-shadow:
        0 25px 70px rgba(0, 0, 0, 0.7),
        inset 0 0 0 2px rgba(255, 255, 255, 0.1),
        0 0 40px rgba(0, 230, 118, 0.4);
}

.cta-content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 1rem 0;
    text-align: center;
}

.cta-content h2 {
    font-size: 3.5rem;
    font-weight: 900;
    margin-bottom: 1rem;
    color: var(--bma-white);
    line-height: 1.1;
}

.cta-content p {
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.85);
    margin: 0 0 1.5rem;
    line-height: 1.7;
}

.cta-content .btn-primary {
    align-self: center;
}

/* Responsive */
@media (max-width: 1024px) {
    /* Navigation adjustments */
    nav {
        padding: 1rem 1.75rem;
        gap: 1.5rem;
    }

    .logo-image {
        height: 100px;
    }

    .nav-links {
        gap: 1.5rem;
    }

    .nav-links a {
        font-size: 0.85rem;
    }

    .tournament-types {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }

    .bet-types {
        flex-direction: column;
        gap: 0.75rem;
    }

    .bet-type-separator {
        display: none;
    }

    .bet-type-label {
        display: block;
        text-align: center;
        padding: 0.75rem 1.5rem;
        background: rgba(46, 139, 87, 0.15);
        border-radius: 24px;
        color: var(--bma-green-bright);
    }

    .final-cta-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .final-cta .phone-mockup {
        right: -40px;
        bottom: -30px;
        width: 150px;
    }
}

@media (max-width: 768px) {
    .final-cta .phone-mockup {
        right: -20px;
        bottom: -20px;
        width: 120px;
    }

    .laptop-mockup {
        max-width: 400px;
    }
}

/* ===== Footer ===== */
footer {
    background: #101010;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding: 4rem 0 0;
    position: relative;
    overflow: hidden;
}

footer::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, rgba(255, 215, 0, 0.25) 50%, transparent 100%);
    opacity: 0.6;
    pointer-events: none;
}

.footer-top {
    text-align: center;
    margin-bottom: 3rem;
}

.footer-logo {
    height: 300px;
    width: auto;
    max-width: 400px;
    margin: 0 auto;
    display: block;
    object-fit: contain;
}

.footer-content {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 2rem;
    margin-bottom: 2rem;
}

.footer-column h4 {
    font-weight: 700;
    margin-bottom: 1rem;
    color: var(--bma-yellow);
}

.footer-column ul {
    list-style: none;
}

.footer-column li {
    margin-bottom: 0.5rem;
}

.footer-column a {
    color: rgba(255, 255, 255, 0.6);
    transition: color 0.2s ease;
}

.footer-column a:hover {
    color: var(--bma-yellow);
}

.footer-bottom {
    text-align: center;
    padding: 1.5rem 2rem;
    margin: 2rem calc(-50vw + 50%) 0 calc(-50vw + 50%); /* Full viewport width */
    background: #101010;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.5);
    font-size: 0.9rem;
}

.footer-bottom a {
    color: var(--bma-yellow);
    text-decoration: none;
    transition: color 0.3s ease;
}

.footer-bottom a:hover {
    color: var(--bma-yellow-bright);
    text-decoration: underline;
}

/* Copyright text responsive line breaks */
.footer-copyright {
    margin: 0;
}

.copyright-line {
    display: inline;
    white-space: nowrap;
}

/* Add spacing between spans on desktop */
.copyright-line:not(:last-child)::after {
    content: " ";
}

/* ===== Responsive Tablet (768px - 968px) ===== */
@media (max-width: 968px) {
    /* Layout adjustments */
    .hero-content,
    .benefits-content,
    .mechanics-grid {
        grid-template-columns: 1fr;
        gap: 3rem;
    }

    .mechanics-left {
        padding-right: 0;
    }

    /* Disable sticky on tablet */
    .mechanics-right,
    .hero-right,
    .benefits-right {
        position: static;
    }

    .hero-left {
        text-align: center;
    }

    .hero-social-proof {
        justify-content: center;
    }

    .marquee-promo-subtext {
        display: none;
    }

    .hero-right {
        margin-top: 0;
        justify-content: center;
    }

    .hero-content {
        gap: 3rem;
    }

    .hero h1 {
        font-size: clamp(2.75rem, 12vw, 4.5rem) !important;
        width: 100%;
        padding: 0 0.5rem;
    }

    .hero-ctas {
        margin-bottom: 0;
    }

    /* Devices stay overlayed - scale down only, never stack */
    .hero .device-stack {
        max-width: 100%;
    }

    .hero .laptop-mockup {
        max-width: min(400px, 55vw);
    }

    .hero .phone-mockup {
        position: absolute !important;
        width: min(180px, 35vw);
        bottom: 0;
        right: 0;
    }

    .tournament-item {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .tournament-stats {
        justify-content: center;
    }

    .platform-previews {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    /* Tablet pill header adjustments */
    nav {
        padding: 1rem 1.5rem;
        gap: 1.25rem;
        border-radius: 60px;
    }

    .logo-image {
        height: 90px;
    }

    .nav-links {
        gap: 1.25rem;
    }

    .nav-links a {
        font-size: 0.8rem;
    }

    /* Hide nav buttons and links, show mobile menu */
    .nav-links {
        display: none;
    }

    .nav-auth {
        display: none;
    }

    /* Removed - hamburger should only show on mobile, not tablet
    .menu-toggle {
        display: block;
    }
    */

    .logo {
        flex: 1;
        display: flex;
        justify-content: center;
    }

    /* Reduce section padding */
    .hero,
    .product-showcase,
    .how-it-works,
    .live-tournaments,
    .beta-benefits,
    .final-cta {
        padding: 3rem 0;
    }

    /* Hero stacked - auto height, consistent padding */
    .hero {
        min-height: auto;
        height: auto;
        padding-top: calc(var(--hero-marquee-height) + 44px + 0.25rem);
        padding-bottom: clamp(3rem, 6vw, 5rem);
    }
}

/* ===== Responsive Mobile (<768px) ===== */
@media (max-width: 768px) {
    /* Copyright text on separate lines for mobile */
    .copyright-line {
        display: block;
        margin: 0.25rem 0;
    }

    .copyright-line:not(:last-child)::after {
        content: "";
    }

    /* Sport grid responsive */
    .sport-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 1rem;
    }

    /* Typography scaling - hero h1 uses clamp() in base */

    .section-header h2 {
        font-size: clamp(2.5rem, 6vw, 4rem);
        white-space: normal;
        padding: 0 0.5rem;
    }

    /* Underline removed for cleaner look */

    .section-header.display-large h2 {
        font-size: clamp(3rem, 8vw, 5rem);
        word-spacing: normal;
        line-height: 0.9;
    }

    /* Mobile pill header */
    header {
        padding: 1rem 1rem;
    }

    nav {
        padding: 1rem 1.5rem;
        gap: 1rem;
        border-radius: 40px;
        min-height: 60px;
    }

    .logo {
        flex: 1;
        display: flex;
        justify-content: center;
    }

    .logo-image {
        height: 120px;
        width: auto;
        max-width: 200px;
    }

    .nav-links {
        display: none;
    }

    .nav-auth {
        display: none;
    }

    .menu-toggle {
        display: block;
    }

    /* Smaller button on mobile - ensure 44px touch target */
    nav .btn {
        padding: 0.7rem 1.4rem;
        font-size: 0.85rem;
        min-height: 44px;
    }

    /* Tournament mockup mobile adjustments */
    .mockup-stats {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .mockup-logo {
        height: 100px;
        width: 100px;
    }

    /* Sport cards mobile */
    .sport-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    /* Benefits mobile */
    .benefit-icon {
        width: 64px;
        height: 64px;
    }

    /* Hero offer box */
    .hero-offer {
        padding: 1rem;
    }

    .offer-text {
        font-size: 0.85rem;
    }

    .hero .hero-bg,
    .hero .hero-overlay {
        top: -120px;
    }

    /* Further reduce section padding */
    .hero,
    .product-showcase,
    .how-it-works,
    .live-tournaments,
    .beta-benefits,
    .final-cta {
        padding: 2.5rem 0;
    }

    .hero {
        margin-top: 0;
        padding-top: calc(48px + 44px + 0.25rem);
    }

    .cta-trust {
        flex-direction: column;
        gap: 0.5rem;
    }

    .hero-social-proof {
        flex-direction: column;
        gap: 1rem;
        text-align: center;
    }
}

/* ===== Extra Small Mobile (<480px) ===== */

/* ===== Sport League Icons ===== */
.AFL {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 176 176'%3E%3Cpath d='M45.45 112.63c-2.68-8.15 2.71-21.26 6.9-28.42 12.49-22.48 40.37-33.6 65.12-27.49 4.66 1.33 9.96 2.88 12.99 6.91-3.68-3.14-8.8-3.83-13.43-4.5-23.57-2.77-48.1 7.16-61.4 27.17-4.02 5.86-7.41 12.33-9.38 19.22-.6 2.31-1.22 4.72-.8 7.12Z'/%3E%3Cpath d='M45.45 112.63c-.23-6.13 9.79-17.32 14.18-21.6 15.64-15.21 36.29-25.61 57.94-28.63 3.27-.34 6.6-.57 9.87-.04 1.06.22 2.26.45 3.02 1.27-.93-.57-2.03-.54-3.07-.52-3.17.15-6.29.88-9.35 1.7-20.33 5.76-39.41 15.76-55.79 29.1-4.86 4.07-9.6 8.38-13.65 13.28-1.23 1.66-2.85 3.32-3.14 5.43Z'/%3E%3Cpath d='M78.56 71.69c1.4.58 2.43 1.39 2.98 2.72.19.65.16 1.46.46 2.05.28.6.79 1.04 1.4 1.41 2.45 1.49 3.99 3.61 4.17 6.66l-.23.19a6.85 6.85 0 0 1-4.62-3.95c-.7-1.11-.56-2.81-1.52-3.77-.45-.49-1.22-.77-1.74-1.21-.53-.45-.79-1.08-1.01-1.72-.2-.66-.32-1.39-.14-2.24l.26-.14ZM85.55 67.67c1.48.39 2.61 1.21 3.22 2.52.23.65.22 1.46.53 2.05.29.6.81 1.03 1.42 1.41 1.2.71 2.15 1.66 2.9 2.79.69 1.25 1.1 2.59.97 4.11l-.26.15c-1.49-.6-2.51-1.45-3.35-2.45-.77-1.09-1.33-2.3-1.6-3.65-.15-.7-.39-1.32-.86-1.79-.45-.48-1.23-.73-1.77-1.14-.54-.42-.82-1.01-1.09-1.63-.24-.63-.41-1.32-.35-2.18l.24-.18ZM70.91 77.28c1.4.58 2.43 1.39 2.98 2.72.19.65.16 1.46.46 2.05.28.6.79 1.04 1.4 1.41 2.45 1.49 3.99 3.61 4.17 6.66l-.23.19a6.85 6.85 0 0 1-4.62-3.95c-.7-1.11-.56-2.81-1.52-3.77-.45-.49-1.22-.77-1.74-1.21-.53-.45-.79-1.08-1.01-1.72-.2-.66-.32-1.39-.14-2.24l.26-.14ZM130.45 63.63c2.95 8.32-2.14 21.24-6.35 28.63-12.87 23.3-40.01 33.3-65.36 26.84-4.67-1.38-9.93-2.73-13.29-6.46 3.94 2.8 9.07 3.34 13.74 4.06 24.3 3.06 47.9-5.7 61.61-26.49 3.98-5.91 7.28-12.45 9.07-19.4.54-2.34 1.05-4.76.58-7.16Z'/%3E%3C/svg%3E");
}
.ATPChinaOpen {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' id='Layer_1' viewBox='0 0 176 176'%3E%3Cdefs%3E%3CclipPath id='clippath'%3E%3Cpath d='m62.67 87.88 26.41 29.02h-28.1V87.88z' class='cls-1'/%3E%3C/clipPath%3E%3CclipPath id='clippath-1'%3E%3Cpath d='m62.67 87.88 26.41 29.02 2.64-27.98-28.89-2.72z' class='cls-1'/%3E%3C/clipPath%3E%3CclipPath id='clippath-2'%3E%3Cpath d='M81.3 86.83c.35-7.85-2.58-16.16-8.87-23.08-10.41-11.44-26.74-13.53-36.47-4.67s-9.18 25.31 1.23 36.74c6.18 6.79 15.69 10.6 23.42 10.46 0 0 19.88-1.19 20.69-19.45' class='cls-1'/%3E%3C/clipPath%3E%3CclipPath id='clippath-3'%3E%3Cpath d='M113.33 87.88 86.92 116.9h28.1V87.88z' class='cls-1'/%3E%3C/clipPath%3E%3CclipPath id='clippath-4'%3E%3Cpath d='M113.33 87.88 86.92 116.9l-2.64-27.98 28.89-2.73z' class='cls-1'/%3E%3C/clipPath%3E%3CclipPath id='clippath-5'%3E%3Cpath d='M94.7 86.83c-.35-7.85 2.58-16.16 8.87-23.08 10.41-11.44 26.74-13.53 36.47-4.67s9.18 25.31-1.23 36.74c-6.18 6.79-15.69 10.6-23.42 10.46 0 0-19.88-1.19-20.69-19.45' class='cls-1'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg id='_x3C_Mirror_Repeat_x3E_' clip-path='url(%23clippath)'%3E%3Cpath d='m80.1 98.89 3.09 10a94 94 0 0 0-9.35-3.76c2.57-1.84 4.64-4.01 6.26-6.23m.78-11.02S77.76 103.61 60.97 106c14.98 2.29 28.88 10.9 28.88 10.9z'/%3E%3C/g%3E%3Cg id='_x3C_Mirror_Repeat_x3E_-2' clip-path='url(%23clippath-1)' data-name='_x3C_Mirror_Repeat_x3E_'%3E%3Cpath d='M78.79 100.62c.86 3.58 1.88 6.87 2.87 9.67L72 106.27c2.37-1.41 4.72-3.26 6.79-5.65m2.08-12.72c-3.95 16.49-19.91 18.12-19.91 18.12l28.05 11.66s-7.27-14.65-8.14-29.77Z'/%3E%3C/g%3E%3Cpath d='M80.87 87.89c.24-10.85-5.57-21.66-14.6-27.5-8.44-5.58-20.51-6.82-28.31.3-7.81 6.97-7.81 19.23-3.04 28.14 4.93 9.59 15.2 16.25 25.99 17.24-17.87 1.67-34.93-14.42-33.9-32.54.29-9.39 6.61-18.37 15.67-21.25 21.14-6.88 42.61 14.96 38.2 35.62ZM103.99 130.15a5.59 5.59 0 0 1-3.21 2.88c-.78.28-1.91-.16-2.42-.72-5.72-6.28-13.45-14.78-19.17-21.06l.06-.11c2.5-.23 4.54-2.09 5-4.55l.12-.05 19.11 21c.54.59.89 1.83.51 2.62Z'/%3E%3Cg clip-path='url(%23clippath-2)'%3E%3Cpath d='m19.32 76.98 36.32-33.55.27-.25.25.27c9.26 10.11 27.88 30.46 37.12 40.59l.34.37-.37.34-36.64 33.21-.3.27c-.49-.42-36.55-40.85-36.99-41.24Zm0 0 37.31 40.41-.56-.03 36.5-33.35-.03.71-18.47-20.37-18.45-20.39.52.02-36.82 33.01Z'/%3E%3Cpath d='M50.17 110.88A606 606 0 0 1 86.74 77.6a606 606 0 0 1-36.57 33.28M44 104.1a606 606 0 0 1 36.57-33.28A606 606 0 0 1 44 104.1M37.83 97.32A606 606 0 0 1 74.4 64.04a606 606 0 0 1-36.57 33.28M31.66 90.54a606 606 0 0 1 36.57-33.28 606 606 0 0 1-36.57 33.28M25.49 83.76a606 606 0 0 1 36.57-33.28 606 606 0 0 1-36.57 33.28'/%3E%3Cpath d='M49.79 49.25c12.81 13.07 25.2 26.7 37.02 40.68a750 750 0 0 1-37.02-40.68M43.7 54.79c12.81 13.07 25.2 26.7 37.02 40.68A750 750 0 0 1 43.7 54.79M37.6 60.34c12.81 13.07 25.2 26.7 37.02 40.68A750 750 0 0 1 37.6 60.34M31.51 65.89c12.81 13.07 25.2 26.7 37.02 40.68a750 750 0 0 1-37.02-40.68M25.41 71.43c12.81 13.07 25.2 26.7 37.02 40.68a750 750 0 0 1-37.02-40.68'/%3E%3C/g%3E%3Cg id='_x3C_Mirror_Repeat_x3E_-3' clip-path='url(%23clippath-3)' data-name='_x3C_Mirror_Repeat_x3E_'%3E%3Cpath d='M95.9 98.89c1.62 2.22 3.69 4.39 6.26 6.23a99 99 0 0 0-9.35 3.76l3.09-10m-.78-11-8.97 29.02s13.9-8.61 28.88-10.9c-16.78-2.39-19.91-18.12-19.91-18.12'/%3E%3C/g%3E%3Cg id='_x3C_Mirror_Repeat_x3E_-4' clip-path='url(%23clippath-4)' data-name='_x3C_Mirror_Repeat_x3E_'%3E%3Cpath d='M97.21 100.62c2.07 2.39 4.43 4.24 6.79 5.65l-9.66 4.02c.99-2.8 2.01-6.09 2.87-9.67M95.14 87.9c-.88 15.12-8.14 29.77-8.14 29.77l28.05-11.66s-15.95-1.63-19.91-18.12Z'/%3E%3C/g%3E%3Cpath d='M95.13 87.89c-4.4-20.66 17.07-42.5 38.21-35.62 9.05 2.89 15.37 11.86 15.67 21.25 1.03 18.12-16.04 34.21-33.9 32.54 10.78-.99 21.06-7.65 25.99-17.24 4.76-8.9 4.76-21.17-3.05-28.14-7.8-7.12-19.87-5.88-28.3-.3-9.03 5.84-14.84 16.65-14.6 27.5ZM72.01 130.15c.64 1.35 1.8 2.39 3.21 2.88.78.28 1.91-.16 2.42-.72 5.72-6.28 13.45-14.78 19.17-21.06l-.06-.11a5.61 5.61 0 0 1-5-4.55l-.12-.05c-5.7 6.26-13.41 14.74-19.11 21-.54.59-.89 1.83-.51 2.62Z'/%3E%3Cg clip-path='url(%23clippath-5)'%3E%3Cpath d='m156.68 76.98-36.82-33.01.52-.02-18.45 20.39-18.47 20.37-.03-.71 36.5 33.35-.56.03 37.31-40.41Zm0 0-36.72 40.94-.27.3c-.49-.34-36.48-33.14-36.93-33.48l-.37-.34.34-.37c9.24-10.12 27.85-30.49 37.12-40.59l.25-.27.27.25 36.32 33.55Z'/%3E%3Cpath d='M125.83 110.88A609 609 0 0 1 89.26 77.6a609 609 0 0 1 36.57 33.28M132 104.1a609 609 0 0 1-36.57-33.28A609 609 0 0 1 132 104.1M138.17 97.32a609 609 0 0 1-36.57-33.28 609 609 0 0 1 36.57 33.28M144.34 90.54a609 609 0 0 1-36.57-33.28 609 609 0 0 1 36.57 33.28M150.51 83.76a609 609 0 0 1-36.57-33.28 609 609 0 0 1 36.57 33.28'/%3E%3Cpath d='M126.21 49.25a750 750 0 0 1-37.02 40.68 754 754 0 0 1 37.02-40.68M132.3 54.79a750 750 0 0 1-37.02 40.68 754 754 0 0 1 37.02-40.68M138.4 60.34a750 750 0 0 1-37.02 40.68 754 754 0 0 1 37.02-40.68M144.49 65.89a750 750 0 0 1-37.02 40.68 754 754 0 0 1 37.02-40.68M150.59 71.43a750 750 0 0 1-37.02 40.68 754 754 0 0 1 37.02-40.68'/%3E%3C/g%3E%3Cpath d='M94.72 45.96c-.6.37-1.17.9-1.66 1.57-1.04 1.42-1.74 3.46-1.75 5.75s0 .11 0 .11c0 1.7.37 3.27.99 4.55s1.48 2.26 2.43 2.82c.01 0 .03.01.04.02 1.85-1.87 3.01-4.44 3.03-7.28.03-2.94-1.16-5.6-3.09-7.53Z'/%3E%3Cpath d='M91.36 60.27c-1.3-1.81-2.06-4.23-2.06-6.89v-.12c.02-2 .47-3.87 1.25-5.44.64-1.29 1.51-2.37 2.56-3.16a10.5 10.5 0 0 0-11.58-.04 8 8 0 0 1 1.7 1.77c1.3 1.81 2.06 4.23 2.06 6.89v.12c-.02 2-.47 3.87-1.25 5.44-.66 1.33-1.57 2.43-2.66 3.23 1.66 1.13 3.66 1.8 5.82 1.82 2.21.02 4.26-.64 5.96-1.79q-1.02-.75-1.8-1.83'/%3E%3Cpath d='M79.92 45.93c-1.9 1.88-3.09 4.48-3.11 7.37-.03 2.9 1.12 5.53 3 7.45.63-.37 1.23-.92 1.74-1.62 1.04-1.42 1.74-3.46 1.75-5.75s0-.11 0-.11c0-1.7-.37-3.27-.99-4.55-.61-1.26-1.46-2.23-2.39-2.79'/%3E%3C/svg%3E");
}
.Boxing {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 176 176'%3E%3Cpath d='M65.34 115.4c5.31-.06 10.36-3.03 12.9-7.48 2.5-4.67 4.99-9.5 7.48-14.24l7.57-14.23a14.16 14.16 0 0 0 1.7-6.9c-.07-5.06-3.1-9.84-7.64-12.01-6.83-3.52-13.74-7.16-20.31-11.13-6.65-4.85-15.9-3.26-20.64 3.54-1.11 1.62-2.4 3.36-3.57 4.93l-.44-.25c.5-1.26 1.01-2.51 1.55-3.75.5-1.15 1.15-2.69 1.81-3.76 5-8.11 15.75-9.99 23.73-5.07 7.12 3.74 14.14 7.91 20.98 12.16 5.17 3.23 8.34 9.31 8.15 15.37-.09 2.99-.98 5.97-2.49 8.47l-8.23 13.86c-2.79 4.61-5.5 9.19-8.36 13.83a16.15 16.15 0 0 1-6.22 5.5c-2.49 1.23-5.27 1.81-8 1.66v-.5Z'/%3E%3Cpath d='m45.39 73.58 6.25 3.14 1.56.79c3.63 2.18 7.02-.63 7.84-4.29.39-1.85-.49-3.81-1.99-4.58L46.69 62.2c-.47-.24-3.32-1.77-3.75-1.95-1.52-.63-3.38.13-4.18 1.54l-.7 1.37-4.16-2.34.27-.54 4.21 2.37c-2.58 5.29-5.78 10.53-8.85 15.48-2.75 4.92-3.52 10.73-1.59 16.2l-.43.25c-4.24-4.92-4.48-12.51-2.04-18.39 2.6-5.6 5.44-10.72 8.69-15.92l4.21 2.37-.32.51-4.16-2.34c2.12-4.31 7.38-6.54 11.63-3.69 5 3.01 9.98 5.98 14.99 9.08 1.26.8 2.19 2.04 2.66 3.4 1.36 3.81-1.26 8.63-5 9.91-1.86.67-4.08.25-5.62-.87l-1.49-.92-5.93-3.71.25-.44Z'/%3E%3Cpath d='m60.9 75.25 10.06 7.09c3.1 2.34 7.1 4.62 10.74 2.17-.73.71-1.63 1.3-2.66 1.64-3.12 1.04-6.56-.39-9.31-1.63l-11.28-4.91zM55.81 132.79c-9.83-3.92-20.01-8.57-29.13-14.33-3.21-2.06-6.26-4.32-9.33-6.35l-.9-.6.52-.77c3.84-5.74 6.91-11.94 9.72-18.25 10.4 4.64 20.54 9.81 30.4 15.49 3.79 2.21 7.54 4.63 11.27 6.97l-1.16 1.76c-3.34 5.22-7.75 11.35-11.39 16.09Zm-.13-.49c2.05-4.99 5.38-12.97 7.66-17.78l.85 3.02c-9.82-4.71-19.18-10.26-28.4-16.03-3.09-1.9-6.08-3.98-9.08-6.03l1.86-.52c-3.68 5.36-7.1 10.87-9.84 16.76l-.38-1.37c3.24 1.52 6.51 2.82 9.62 4.31 9.89 4.89 18.56 11.16 27.72 17.65Z'/%3E%3Cpath d='M43.67 103.99c.47-3.42 1.57-6.49 2.83-9.47.75-1.86 1.69-3.81 3.53-4.83 4.48-2.86 10.75.66 10.64 5.98.09 2.11-1.09 3.92-2.29 5.53-1.89 2.62-3.95 5.16-6.63 7.33.47-3.43 1.56-6.5 2.82-9.48.37-1.12 1.24-2.11 1.21-3.3-.04-.77-.48-1.48-1.13-1.83-.63-.37-1.47-.38-2.15-.02-1.03.6-1.43 1.85-2.19 2.75-1.89 2.62-3.95 5.16-6.63 7.34ZM89.53 56.33c6.29-4.25 13.07-8.79 19.52-12.83 8.69-4.83 20.24-1.93 23.23 8.17.5 1.59 1.05 3.3 1.33 4.96l-.44.25c-1.72-1.54-3.23-3.32-4.59-4.96-3.84-4.11-9.46-7.07-15.17-6.1-1.99.32-3.9 1.37-5.69 2.27l-5.96 2.94c-4 1.91-7.96 3.88-11.99 5.74l-.25-.43ZM110.72 117.15c-6.74-.33-12.86-4.75-15.27-10.92l-.83-1.81c-1.06-2.32-3.87-8.48-4.97-10.87 1.41 2.26 4.97 7.94 6.33 10.12l1.05 1.69c2.69 4.71 8.31 7.51 13.59 6.8l.09 5Z'/%3E%3Cpath d='m130.86 73.01-5.93 3.71c-.96.55-2.07 1.4-3.17 1.79-5.49 1.91-10.77-4.79-8.94-9.91.46-1.36 1.4-2.6 2.66-3.4 5-3.1 9.99-6.07 14.99-9.08 4.25-2.85 9.52-.62 11.63 3.69l-4.16 2.34-.32-.51 4.21-2.37c3.25 5.2 6.1 10.31 8.69 15.92 2.45 5.88 2.2 13.47-2.04 18.39l-.43-.25c1.93-5.46 1.15-11.28-1.59-16.2-3.07-4.96-6.27-10.19-8.85-15.48l4.21-2.37.27.54-4.16 2.34-.7-1.37c-.8-1.41-2.66-2.17-4.18-1.54-.4.17-3.29 1.71-3.75 1.95l-12.36 6.44c-1.5.78-2.38 2.73-1.99 4.58.16.92.82 2.04 1.24 2.8 1.37 2.19 4.38 2.91 6.6 1.49l1.56-.79 6.25-3.14.25.44Z'/%3E%3Cpath d='m117.55 78.61-10.17 4.18c-3 1.22-7.98 3.38-10.73.75 2.93 1.89 7.19-.97 9.59-2.77l8.86-6.52zM120.32 131.3c9.16-6.48 17.83-12.76 27.72-17.65 3.11-1.49 6.38-2.79 9.62-4.31l-.38 1.37c-2.74-5.89-6.16-11.39-9.84-16.76l1.86.52c-3.01 2.05-5.99 4.13-9.08 6.03-9.22 5.77-18.58 11.32-28.4 16.03l.85-3.02c2.29 4.77 5.59 12.83 7.66 17.78Zm-.13.49c-4.12-5.32-8.82-12.02-12.55-17.85 12.84-8.33 26.36-15.56 40.32-21.84l1.35-.62c2.81 6.31 5.88 12.51 9.72 18.25l.52.77-.9.6c-3.08 2.03-6.12 4.29-9.33 6.35-9.12 5.76-19.3 10.41-29.13 14.33Z'/%3E%3Cpath d='M132.33 102.99c-2.68-2.18-4.74-4.71-6.63-7.34-.76-.9-1.16-2.15-2.19-2.75-.68-.36-1.52-.35-2.15.02-.64.35-1.08 1.06-1.13 1.83-.02 1.19.84 2.18 1.21 3.3 1.26 2.98 2.35 6.05 2.82 9.48-2.69-2.18-4.74-4.71-6.63-7.33-1.2-1.61-2.38-3.42-2.29-5.53-.11-5.32 6.15-8.84 10.64-5.98 1.85 1.02 2.78 2.97 3.53 4.83 1.26 2.98 2.35 6.05 2.83 9.47Z'/%3E%3C/svg%3E");
}
.CFL {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 176 176'%3E%3Cpath d='M56.94 128.36c-2.68-8.15 2.71-21.26 6.9-28.42 12.49-22.48 40.37-33.6 65.12-27.49 4.66 1.33 9.96 2.88 12.99 6.91-3.68-3.14-8.8-3.83-13.43-4.5-23.57-2.77-48.1 7.16-61.4 27.17-4.02 5.86-7.41 12.33-9.38 19.22-.6 2.31-1.22 4.72-.8 7.12Z'/%3E%3Cpath d='M56.94 128.36c-.23-6.13 9.79-17.32 14.18-21.6 15.64-15.21 36.29-25.61 57.94-28.63 3.27-.34 6.6-.57 9.87-.04 1.06.22 2.26.45 3.02 1.27-.93-.57-2.03-.54-3.07-.52-3.17.15-6.29.88-9.35 1.7-20.33 5.76-39.41 15.76-55.79 29.1-4.86 4.07-9.6 8.38-13.65 13.28-1.23 1.66-2.85 3.32-3.14 5.43Z'/%3E%3Cpath d='M90.05 87.42c1.4.58 2.43 1.39 2.98 2.72.19.65.16 1.46.46 2.05.28.6.79 1.04 1.4 1.41 2.45 1.49 3.99 3.61 4.17 6.66l-.23.19a6.85 6.85 0 0 1-4.62-3.95c-.7-1.11-.56-2.81-1.52-3.77-.45-.49-1.22-.77-1.74-1.21-.53-.45-.79-1.08-1.01-1.72-.2-.66-.32-1.39-.14-2.24l.26-.14ZM97.04 83.41c1.48.39 2.61 1.21 3.22 2.52.23.65.22 1.46.53 2.05.29.6.81 1.03 1.42 1.41 1.2.71 2.15 1.66 2.9 2.79.69 1.25 1.1 2.59.97 4.11l-.26.15c-1.49-.6-2.51-1.45-3.35-2.45-.77-1.09-1.33-2.3-1.6-3.65-.15-.7-.39-1.32-.86-1.79-.45-.48-1.23-.73-1.77-1.14-.54-.42-.82-1.01-1.09-1.63-.24-.63-.41-1.32-.35-2.18l.24-.18ZM82.4 93.01c1.4.58 2.43 1.39 2.98 2.72.19.65.16 1.46.46 2.05.28.6.79 1.04 1.4 1.41 2.45 1.49 3.99 3.61 4.17 6.66l-.23.19a6.85 6.85 0 0 1-4.62-3.95c-.7-1.11-.56-2.81-1.52-3.77-.45-.49-1.22-.77-1.74-1.21-.53-.45-.79-1.08-1.01-1.72-.2-.66-.32-1.39-.14-2.24l.26-.14Z'/%3E%3Cpath d='M53.3 122.69c-7.64-1.63-15.31-3.4-22.9-5.27l2.88-2.37c4.37-3.55 10.16-8.6 14.73-11.75l-.56 3.49c-5.44-7.7-12.72-17.91-18.22-25.63 2.49-.41 10.45-1.73 13.08-2.16l-1.99 3.19c-1.14-3.8-4.98-16.57-6.05-20.16 3.28 1.54 15.48 7.27 18.99 8.92l-3.54 1.95c.31-2.48 1.21-9.72 1.51-12.1l3.21 1.73 19.24 10.35-3.67 1.93c.31-2.81 2.73-24.75 2.98-26.95 2.23 1.48 9.04 6.03 11.37 7.58l-3.79 1.39 4.69-16.3 1.82-6.35c2.36 4.94 5.65 12.01 8.09 16.9.63 1.19 1.08 2.47 1.57 3.73l-3.83-.63 7.52-6.76 2.28-2.05.55 2.78c1.16 6.23 3.02 14.88 4.08 21.03-2.12-5.83-5.26-14.19-7.33-20.13l2.83.72c-1.59 1.89-7.16 8.41-8.61 10.14-1.16-1.98-2.71-4.59-3.67-6.64-1.09-2.54-3.97-8.4-5.17-10.98l4.66-.38-4.69 16.3-.94 3.29c-1.87-1.24-8.8-5.87-10.79-7.19l3.87-1.81c-.28 2.51-2.73 24.75-2.93 26.55-1.6-.86-20.34-10.95-22.5-12.11l3.67-1.89c-.3 2.4-1.2 9.61-1.49 11.89-1.99-.94-14.75-6.93-17.03-8.01l3.46-2.98 4.44 14.79.82 2.72c-1.97.33-9.84 1.62-11.93 1.97l1.63-3.92c4.66 6.42 11.32 16.02 15.93 22.34l1.45 1.95c-5.05 4.14-12.09 8.51-17.56 12.17l-.52-3.2c6.15 2.56 12.28 5.19 18.36 7.91ZM141.94 79.36c2.95 8.32-2.14 21.24-6.35 28.63-12.87 23.3-40.01 33.3-65.36 26.84-4.67-1.38-9.93-2.73-13.29-6.46 3.94 2.8 9.07 3.34 13.74 4.06 24.3 3.06 47.9-5.7 61.61-26.49 3.98-5.91 7.28-12.45 9.07-19.4.54-2.34 1.05-4.76.58-7.16Z'/%3E%3C/svg%3E");
}
.EPL {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 176 176'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Ccircle cx='88.05' cy='87.78' r='36' fill='none'/%3E%3C/clipPath%3E%3C/defs%3E%3Cpath d='M57.15 69c9.24-18.75 34.22-24.46 51.48-13.14 12.91 8.03 19.8 24.52 16.05 39.26-1.19 4.77-3.33 9.26-6.36 12.98 6.34-12.7 5.44-27.76-2.76-38.96-14.31-19.73-43.43-19.22-58.4-.13Z'/%3E%3Cpath d='M118.63 107.77c-9.42 18.66-34.45 24.13-51.6 12.64C54.2 112.26 47.47 95.7 51.36 81c1.24-4.76 3.42-9.23 6.48-12.91-6.46 12.63-5.7 27.71 2.39 38.99 14.12 19.87 43.24 19.63 58.39.7Z'/%3E%3Cg clip-path='url(%23a)'%3E%3Cpath d='M75.71 80.48c-.59 5.08-1.08 10.36-1.43 15.44 4.7 2.12 9.73 4.25 14.65 6.22A488 488 0 0 0 99.6 90.39c-2.68-4.49-5.52-9.1-8.3-13.46-5.23 1.08-10.57 2.3-15.6 3.55ZM65.56 71.65c-4.27 1.46-7.97 3.03-10.61 4.62-1.09-3.26-1.86-6.06-2.65-8.64 1.51-3.55 3.91-7 6.82-9.8 2.78.52 5.84 1.08 9.39 1.88-1.15 3.35-2.14 7.46-2.96 11.95Z'/%3E%3Cpath d='M75.66 82.73c-4.29-4.66-8.1-8.91-11.16-12.42 3.62 2.87 8.08 6.4 13.04 10.32-.63.7-1.26 1.4-1.88 2.1M89.61 77.74c4.12-6.14 7.98-11.7 11.06-15.93-2.32 4.61-5.32 10.67-8.58 17.31-.83-.46-1.66-.93-2.48-1.38'/%3E%3Cpath d='M99.59 63.25c-2.32-3.69-4.59-6.74-6.62-8.78 3.07-1.41 5.67-2.24 7.83-2.74 3.76.37 7.8 1.35 11.63 2.93.3 2.26.4 5.19.28 8.72-3.9-.25-8.36-.29-13.11-.14ZM115.22 91.92c2.31-4.08 4.23-7.95 5.73-11.39 2.98 1.61 4.97 3.15 5.54 4.49.03 3.73.04 7.42.06 11.07-.52 1.84-2.46 3.88-5.34 5.95-1.56-2.96-3.55-6.38-5.99-10.12'/%3E%3Cpath d='M95.63 89.22c8.06 1.01 15.68 1.98 21.34 2.72-5.72.12-13.41.16-21.53.14.07-.95.13-1.91.19-2.86M77.32 95.96c-6.68 2.6-12.68 4.88-17.2 6.55 4.18-2.44 9.74-5.61 15.99-9.11.4.85.8 1.71 1.21 2.56'/%3E%3Cpath d='M62.76 101.37c-3.87-2.1-7.09-4.19-9.2-6.11-1.32 3-2.1 5.53-2.67 7.68.48 3.68 1.68 7.58 3.53 11.19 2.44.14 5.46.11 9.08-.15-.44-3.73-.69-8.02-.75-12.61ZM92.53 114.86c-3.56 2.92-6.91 5.33-9.82 7.14 2.4 2.43 4.57 3.94 6.32 4.31 3.73-.07 7.65-.2 11.66-.49 1.41-1.17 2.77-3.63 4.04-6.92a162 162 0 0 1-12.2-4.04'/%3E%3Cpath d='M90.06 99.41c1.3 7.62 2.5 14.6 3.36 19.53-1.68-4.77-3.86-11.51-6.13-18.9.92-.21 1.85-.41 2.77-.63'/%3E%3C/g%3E%3C/svg%3E");
}
.InternationalTwenty20 {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' id='Layer_1' viewBox='0 0 176 176'%3E%3Cdefs/%3E%3Cpath d='M99.49 60.79c-2.03-1.12-7.25-4.04-9.19-5.16-1.72-1.22-4.14-.7-5.08 1.19l-1.76 3.04c-10.53 18.22-21.47 36.26-32.49 54.18-.88 1.51-2.62 3.98-3.12 5.65-1.81 5.1.36 11.17 4.99 13.96 1.38.77 2.8 1.9 4.22 2.51 2.64 1.24 5.72 1.37 8.5.51 2.31-.74 4.4-2.18 5.87-4.12.54-.73 2.23-3.38 2.77-4.23 5.11-7.84 10.13-15.73 15.32-23.53 6.38-9.7 12.96-19.56 19.53-29.16l1.97-2.89c1.2-1.71.31-4.1-1.52-5.01-1.83-1.25-6.75-4.73-8.62-6.07l6.14 3.42 3.05 1.74c1.17.58 2.23 1.48 2.68 2.75.5 1.28.4 2.8-.3 4.03l-1.77 3.05c-5.83 10.07-11.87 20.27-17.87 30.21-4.79 8.04-9.74 15.98-14.61 23.97l-1.84 2.99c-3.41 5.94-10.66 9.33-17.42 8.07-3.26-.5-6.06-2.26-8.76-4.04-6.5-4-9.52-12.58-6.89-19.76.65-2.17 2.49-4.67 3.68-6.58 11.4-17.67 22.96-35.33 34.85-52.69l1.98-2.9c1.37-2.41 4.99-3.02 7.06-1.2 1.82 1.25 6.76 4.74 8.62 6.06Z' class='cls-5'/%3E%3Crect width='10' height='38' x='103.04' y='30.04' class='cls-5' rx='4.4' ry='4.4' transform='rotate(32.21 108.063 49.058)'/%3E%3Cpath d='m118.16 25.861 6.43 4.051a2.074 2.074 0 0 1 .648 2.855l-3.763 5.973a4.4 4.4 0 0 1-6.068 1.378l-2.496-1.572a4.4 4.4 0 0 1-1.378-6.069l3.764-5.973a2.074 2.074 0 0 1 2.854-.648ZM73.29 119.93c7.53-14.52 16.26-28.41 26.12-41.46a291.6 291.6 0 0 1-26.12 41.46M92.7 56.51c6.07 2.61 9.93 5.71 15.23 9.6-6.48 4.8-16.25-1.91-15.23-9.6' class='cls-5'/%3E%3Ccircle cx='114.5' cy='108.5' r='11.5' class='cls-5'/%3E%3Cpath d='M116.5 97.5c-.08.32-.17.64-.25.97' class='cls-2'/%3E%3Cpath fill='none' stroke='%23fff' stroke-dasharray='2.08 2.08' stroke-linecap='round' stroke-miterlimit='10' d='M115.82 100.49c-.41 2.31-.63 5.1-.32 9.01.31 4.01 1.81 7.82 3.01 10.21'/%3E%3Cpath d='M119 120.64c.18.33.35.62.5.86' class='cls-2'/%3E%3Cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M112.93 96.95c-.72 3.08-1.44 6.15-.93 12.14.46 5.49 2.3 9.85 3.44 11.77'/%3E%3Cpath d='M110.47 95.97c-.1.31-.21.63-.31.95' class='cls-2'/%3E%3Cpath fill='none' stroke='%23fff' stroke-dasharray='2 2' stroke-linecap='round' stroke-miterlimit='10' d='M109.6 98.83c-.57 2.17-.99 4.76-.91 8.67.07 4 .82 7.71 1.63 10.1'/%3E%3Cpath d='M110.67 118.55q.21.525.42.9' class='cls-2'/%3E%3C/svg%3E");
}
.MLB {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 176 176'%3E%3Cpath d='M57.16 68.76c9.24-18.75 34.22-24.46 51.48-13.14 12.91 8.03 19.8 24.52 16.05 39.26-1.19 4.77-3.33 9.26-6.36 12.98 6.34-12.7 5.44-27.76-2.76-38.96-14.31-19.73-43.43-19.22-58.4-.13Z'/%3E%3Cpath d='M118.65 107.53c-9.42 18.66-34.45 24.13-51.6 12.64-12.83-8.15-19.56-24.71-15.67-39.41 1.24-4.76 3.42-9.23 6.48-12.91-6.46 12.63-5.7 27.71 2.39 38.99 14.12 19.87 43.24 19.63 58.39.7Z'/%3E%3Cpath d='M81.5 51.5c.66.98.55 2.28.63 3.41 0 3.51-.67 6.99-1.7 10.34-3.47 11.11-11.23 21.46-22.11 26.16-1.91.74-3.92 1.46-5.99 1.37-.29-.03-.62-.06-.83-.29.53.21 1.1-.03 1.63-.18 1.59-.54 3.08-1.37 4.5-2.26 9.42-6.03 16.32-15.36 20.66-25.58 1.28-3.11 2.39-6.33 3.05-9.64.15-1.09.52-2.27.17-3.34Z'/%3E%3Cpath d='M55.04 86.32c2.84 2.25 4.98 5.19 6.01 8.68-3.18-1.76-5.55-5.06-6.01-8.68M60.09 83.59c3.08 1.9 5.56 4.57 6.98 7.92-3.36-1.37-6.1-4.38-6.98-7.92M64.24 79.48c3.36 1.34 6.26 3.54 8.25 6.59-3.55-.77-6.76-3.25-8.25-6.59M67.96 74.84c3.4 1.23 6.38 3.34 8.46 6.32-3.57-.66-6.87-3.03-8.46-6.32M71.01 69.38c3.55.7 6.8 2.34 9.31 4.98-3.63-.11-7.24-1.97-9.31-4.98M73.95 64.04c3.61.32 7.01 1.6 9.79 3.95-3.62.27-7.41-1.18-9.79-3.95M75.55 58.53c3.6-.36 7.19.27 10.35 2.06-3.51.94-7.5.22-10.35-2.06M91 123c-5.65-2.93-5.31-10.76-4.39-16.15 2.63-13.39 12.84-28.9 26.15-33.47 2.79-.82 6.22-1 8.57.99-5.53-1.99-10.52 2.2-14.46 5.57-7.88 7.52-13.95 17.24-17.24 27.63-1.3 5.02-2.86 11.35 1.36 15.44Z'/%3E%3Cpath d='M112.92 80.57c-3.06-2.21-5.48-5.13-6.83-8.68 3.39 1.69 6.06 4.95 6.83 8.68M107.82 83.75c-3.3-1.84-6.04-4.46-7.8-7.82 3.57 1.28 6.59 4.21 7.8 7.82M103.74 88.31c-3.57-1.24-6.72-3.34-9.04-6.35 3.73.64 7.22 3.01 9.04 6.35M100.15 93.39c-3.61-1.12-6.83-3.12-9.24-6.05 3.75.52 7.32 2.77 9.24 6.05M97.32 99.29c-3.73-.57-7.22-2.06-10.04-4.6 3.79-.05 7.65 1.64 10.04 4.6M94.59 105.05c-3.77-.17-7.4-1.28-10.47-3.5 3.76-.45 7.78.82 10.47 3.5M93.27 110.91c-3.74.54-7.51.12-10.94-1.49 3.61-1.15 7.8-.65 10.94 1.49'/%3E%3C/svg%3E");
}
.MLS {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 176 176'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Ccircle cx='88.05' cy='87.78' r='36' fill='none'/%3E%3C/clipPath%3E%3C/defs%3E%3Cpath d='M57.15 69c9.24-18.75 34.22-24.46 51.48-13.14 12.91 8.03 19.8 24.52 16.05 39.26-1.19 4.77-3.33 9.26-6.36 12.98 6.34-12.7 5.44-27.76-2.76-38.96-14.31-19.73-43.43-19.22-58.4-.13Z'/%3E%3Cpath d='M118.63 107.77c-9.42 18.66-34.45 24.13-51.6 12.64C54.2 112.26 47.47 95.7 51.36 81c1.24-4.76 3.42-9.23 6.48-12.91-6.46 12.63-5.7 27.71 2.39 38.99 14.12 19.87 43.24 19.63 58.39.7Z'/%3E%3Cg clip-path='url(%23a)'%3E%3Cpath d='M75.71 80.48c-.59 5.08-1.08 10.36-1.43 15.44 4.7 2.12 9.73 4.25 14.65 6.22A488 488 0 0 0 99.6 90.39c-2.68-4.49-5.52-9.1-8.3-13.46-5.23 1.08-10.57 2.3-15.6 3.55ZM65.56 71.65c-4.27 1.46-7.97 3.03-10.61 4.62-1.09-3.26-1.86-6.06-2.65-8.64 1.51-3.55 3.91-7 6.82-9.8 2.78.52 5.84 1.08 9.39 1.88-1.15 3.35-2.14 7.46-2.96 11.95Z'/%3E%3Cpath d='M75.66 82.73c-4.29-4.66-8.1-8.91-11.16-12.42 3.62 2.87 8.08 6.4 13.04 10.32-.63.7-1.26 1.4-1.88 2.1M89.61 77.74c4.12-6.14 7.98-11.7 11.06-15.93-2.32 4.61-5.32 10.67-8.58 17.31-.83-.46-1.66-.93-2.48-1.38'/%3E%3Cpath d='M99.59 63.25c-2.32-3.69-4.59-6.74-6.62-8.78 3.07-1.41 5.67-2.24 7.83-2.74 3.76.37 7.8 1.35 11.63 2.93.3 2.26.4 5.19.28 8.72-3.9-.25-8.36-.29-13.11-.14ZM115.22 91.92c2.31-4.08 4.23-7.95 5.73-11.39 2.98 1.61 4.97 3.15 5.54 4.49.03 3.73.04 7.42.06 11.07-.52 1.84-2.46 3.88-5.34 5.95-1.56-2.96-3.55-6.38-5.99-10.12'/%3E%3Cpath d='M95.63 89.22c8.06 1.01 15.68 1.98 21.34 2.72-5.72.12-13.41.16-21.53.14.07-.95.13-1.91.19-2.86M77.32 95.96c-6.68 2.6-12.68 4.88-17.2 6.55 4.18-2.44 9.74-5.61 15.99-9.11.4.85.8 1.71 1.21 2.56'/%3E%3Cpath d='M62.76 101.37c-3.87-2.1-7.09-4.19-9.2-6.11-1.32 3-2.1 5.53-2.67 7.68.48 3.68 1.68 7.58 3.53 11.19 2.44.14 5.46.11 9.08-.15-.44-3.73-.69-8.02-.75-12.61ZM92.53 114.86c-3.56 2.92-6.91 5.33-9.82 7.14 2.4 2.43 4.57 3.94 6.32 4.31 3.73-.07 7.65-.2 11.66-.49 1.41-1.17 2.77-3.63 4.04-6.92a162 162 0 0 1-12.2-4.04'/%3E%3Cpath d='M90.06 99.41c1.3 7.62 2.5 14.6 3.36 19.53-1.68-4.77-3.86-11.51-6.13-18.9.92-.21 1.85-.41 2.77-.63'/%3E%3C/g%3E%3C/svg%3E");
}
.MMA {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 176 176'%3E%3Cpath d='M76.01 68.5c-.83-2.52-1.42-5.03-2.02-7.55.04-3.63.01-7.67.02-11.32-.12-5.51 2.49-9.55 8.5-9.13 1.57-.02 3.09.01 4.58.77 4.48 2.21 3.92 8.03 3.92 12.14v7.55c-.61 2.52-1.2 5.03-2 7.55-.8-2.52-1.39-5.03-2-7.55V49.64c.02-2.63-.52-5.33-3.56-5.13h-1.89c-3.04-.19-3.58 2.51-3.56 5.13.01 3.66-.03 7.68.02 11.32-.6 2.52-1.19 5.03-2.02 7.55Z'/%3E%3Cpath d='M102.01 70.5c-.83-1.95-1.42-3.89-2.02-5.84.03-3.82.04-7.84 0-11.61-.1-4.41-1.2-4.67-5.37-4.54-3.55-.05-3.46 3.71-3.61 6.58-.58 1.91-1.11 3.89-1.87 5.85-.85-1.94-1.49-3.85-2.13-5.83-.16-4.95 1.62-10.76 7.6-10.59 6.19-.43 9.31 2.04 9.36 8.4.08 4.02-.02 7.79.05 11.75-.6 1.95-1.19 3.89-2.02 5.84ZM62.01 82.5c-.92-2.33-1.77-4.93-2.52-7.32-.32-.87-.52-1.75-.49-2.68.11-1.32.81-2.95 1.19-4.22.2-.57.69-2.05.84-2.59a1 1 0 0 0-.02.27V52.22c-.48-4.5 2.74-8.72 7.47-8.71h2.34c3.57-.25 6.92 2.59 7.17 6.17.08 2.38 0 6.21.03 8.6.2 3.67-1.17 7.59-2 11.23-.83-3.65-2.2-7.56-2-11.23v-7.96c.04-1.38-1.09-2.68-2.47-2.79-.75-.02-2.55-.02-3.37 0-1.59.11-2.98 1.47-3.14 3.05-.05.69-.01 2.67-.02 3.52v11.23c0 .22 0 .63-.01.85-.06.58-.27 1.12-.41 1.6-.47 1.46-1.19 3.41-1.58 4.89-.01.04 0 0 0-.04.01-.06 0-.25 0-.31.2.84.14 1.67.02 2.52-.25 2.49-.58 5.21-1.02 7.68Z'/%3E%3Cpath d='M107.01 109.5c1.25-2.76 2.8-5.32 4.04-8.04.4-.88.68-1.78 1.25-2.5 1-1.78 1.66-3.54 1.7-5.38.02-3.45 0-13.48 0-17.09v-5.95c.05-1.92-.1-3.34-.83-5.01l-.17-.39v-9.59c.2-2.03-.94-3.21-2.81-3.06-.98.02-2.44-.03-3.3.02-.97.1-1.93.26-2.37 1.06-.59.88-1.02 2.06-1.15 3.35-.39 2.3-.82 4.59-1.31 6.88-.53-2.29-1-4.57-1.42-6.87-1.2-4.73 1-8.02 5.97-8.41 1.35-.07 2.35-.01 3.58-.03 4-.29 7.18 3.14 6.81 7.06v9.17l-.17-.8c.92 1.97 1.26 4.57 1.17 6.61v20.83c-.02.42.02 1.8 0 2.25-.03 2.64-1.05 5.18-2.18 7.29-2.05 3.6-5.77 5.92-8.82 8.59Z'/%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-miterlimit='10' stroke-width='4' d='M73.01 109.5c-2.99-3.03-14.16-5.9-16-9-5.44-9.14-10.35-19.26-10-25 .49-8.23 14.6-9.73 14.6-9.73'/%3E%3Cpath d='M61.01 62.87c9.1-3.31 18.39-5.45 28.21-5.31 9.73.85 18.81 3.35 27.79 6.94-9.36-.43-18.81-2.24-28-2.95-9.18-.22-18.67 1.17-28 1.32M107.19 86.85c.27 3.52.54 7.04.6 10.57-.66 5.19-4.95 9.72-9.62 11.85-.16.07-.35-.08-.31-.25.82-3.96 3.07-7.32 6.09-9.9l-.12.17c.55-.65.94-1.45 1.16-2.3v.14c.5-3.44 1.11-6.87 1.79-10.29.04-.22.39-.2.4.02Z'/%3E%3Cpath d='M89.38 133.5c3.6-.31 7.59-.57 11.22-.77 2.1-.17 4.8.13 6.26-1.62.66-.76.93-1.55.84-2.56-.14-3.6-.25-7.6-.37-11.22-.03-.82-.04-2.43-.07-3.23-.07-1.66-1.95-2.8-3.55-2.71h-.23l-14.96.11-14.96-.11c-1.61-.15-3.48.81-3.77 2.42-.11 1.81-.13 5.31-.22 7.23l-.25 7.48c-.31 2.87 2.67 4.23 5.2 4.09 4.27.23 8.84.5 13.09.88-4.96.4-10.08.8-15.07.94-3.02-.1-5.96-2.76-5.85-5.91l-.25-7.48c-.04-1.23-.14-4.42-.16-5.61l-.02-.94c-.17-2.09 1.03-4.37 2.7-5.48 1.29-.96 3.02-1.42 4.58-1.41 7.58-.09 22.58-.11 30.16 0 3.5 0 7 2.67 7.02 6.4 0 1.93-.12 5.09-.18 7.05-.14 2.89-.06 5.71-.36 8.61-.48 2.7-3.15 4.65-5.76 4.76-4.99-.14-10.11-.54-15.06-.94ZM57.51 97l21 2-21 2c-2.9.16-2.9-4.16 0-4'/%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-miterlimit='10' stroke-width='3' d='M77.51 132.5v-3.43c0-2.12 2.02-3.86 4.5-3.86h15c2.47 0 4.5 1.74 4.5 3.86v3.43'/%3E%3C/svg%3E");
}
.NBA {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 176 176'%3E%3Cpath d='M60.03 65.95c7.33-19.57 31.62-27.74 49.91-18.19 13.64 6.7 22.14 22.43 19.87 37.47-.71 4.87-2.4 9.55-5.04 13.54 5.04-13.26 2.65-28.16-6.63-38.49-16.21-18.21-45.13-14.8-58.12 5.68Z'/%3E%3Cpath d='M125.06 98.4c-7.52 19.5-31.88 27.44-50.09 17.71-13.58-6.84-21.92-22.64-19.51-37.66.76-4.86 2.49-9.53 5.17-13.5-5.17 13.21-2.92 28.14 6.26 38.56 16.03 18.36 44.98 15.23 58.17-5.12Z'/%3E%3Cpath d='M126.42 95.69c-3.07 7.29-12.94 7.58-19.7 7.07-14.59-1.62-28.72-8.41-39.08-18.81-4.63-4.97-10.54-12.87-6.76-19.81-1.97 7.07 4.19 13.13 8.92 17.56 10.6 9.01 23.68 15.31 37.33 17.98 6.42.94 14.99 1.97 19.29-3.98Z'/%3E%3Cpath d='M76 113c-4.49-2.75-4.45-9.3-4.24-13.97.65-8.37 4.25-16.19 8.68-23.18 5.32-8.25 11.39-16.27 19.44-22.03 2.61-1.7 6.13-3.84 9.26-2.38-5.33-1.26-11.63 6.9-14.76 10.57-8.59 11.15-16.53 23.48-19.26 37.48-.62 3.02-1.02 6.13-.73 9.2.19 1.51.53 3.05 1.61 4.31'/%3E%3Cpath d='M96.92 119.94c-8.85-2.45-13.09-13.3-11.84-21.86 1.59-9.14 9.38-15.59 17.02-19.76 9.51-5.16 17.52-9.23 17.9-21.31 2.62 17.16-14.19 21.06-23.96 30.06-3.38 3.18-6.15 7.13-7.07 11.69-1.22 7.68 1.22 16.56 7.95 21.19ZM56 87c2.27.45 3.81-.44 5.17-1.6 1.36-1.17 2.54-2.65 3.57-4.21 2.18-3.28 3.63-6.95 4.49-10.91.93-3.93 1.3-8.26 2.88-12.43 1.46-4.12 4.42-7.69 8.06-10.02-2.78 3.11-4.87 6.66-5.75 10.72-.88 3.92-.9 8.09-1.61 12.42-.67 4.32-2.25 8.69-4.75 12.43-2.21 3.63-8.52 7.81-12.06 3.59Z'/%3E%3C/svg%3E");
}
.NCAAF {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 176 176'%3E%3Cpath d='M45.45 112.63c-2.68-8.15 2.71-21.26 6.9-28.42 12.49-22.48 40.37-33.6 65.12-27.49 4.66 1.33 9.96 2.88 12.99 6.91-3.68-3.14-8.8-3.83-13.43-4.5-23.57-2.77-48.1 7.16-61.4 27.17-4.02 5.86-7.41 12.33-9.38 19.22-.6 2.31-1.22 4.72-.8 7.12Z'/%3E%3Cpath d='M45.45 112.63c-.23-6.13 9.79-17.32 14.18-21.6 15.64-15.21 36.29-25.61 57.94-28.63 3.27-.34 6.6-.57 9.87-.04 1.06.22 2.26.45 3.02 1.27-.93-.57-2.03-.54-3.07-.52-3.17.15-6.29.88-9.35 1.7-20.33 5.76-39.41 15.76-55.79 29.1-4.86 4.07-9.6 8.38-13.65 13.28-1.23 1.66-2.85 3.32-3.14 5.43Z'/%3E%3Cpath d='M78.56 71.69c1.4.58 2.43 1.39 2.98 2.72.19.65.16 1.46.46 2.05.28.6.79 1.04 1.4 1.41 2.45 1.49 3.99 3.61 4.17 6.66l-.23.19a6.85 6.85 0 0 1-4.62-3.95c-.7-1.11-.56-2.81-1.52-3.77-.45-.49-1.22-.77-1.74-1.21-.53-.45-.79-1.08-1.01-1.72-.2-.66-.32-1.39-.14-2.24l.26-.14ZM85.55 67.67c1.48.39 2.61 1.21 3.22 2.52.23.65.22 1.46.53 2.05.29.6.81 1.03 1.42 1.41 1.2.71 2.15 1.66 2.9 2.79.69 1.25 1.1 2.59.97 4.11l-.26.15c-1.49-.6-2.51-1.45-3.35-2.45-.77-1.09-1.33-2.3-1.6-3.65-.15-.7-.39-1.32-.86-1.79-.45-.48-1.23-.73-1.77-1.14-.54-.42-.82-1.01-1.09-1.63-.24-.63-.41-1.32-.35-2.18l.24-.18ZM70.91 77.28c1.4.58 2.43 1.39 2.98 2.72.19.65.16 1.46.46 2.05.28.6.79 1.04 1.4 1.41 2.45 1.49 3.99 3.61 4.17 6.66l-.23.19a6.85 6.85 0 0 1-4.62-3.95c-.7-1.11-.56-2.81-1.52-3.77-.45-.49-1.22-.77-1.74-1.21-.53-.45-.79-1.08-1.01-1.72-.2-.66-.32-1.39-.14-2.24l.26-.14ZM130.45 63.63c2.95 8.32-2.14 21.24-6.35 28.63-12.87 23.3-40.01 33.3-65.36 26.84-4.67-1.38-9.93-2.73-13.29-6.46 3.94 2.8 9.07 3.34 13.74 4.06 24.3 3.06 47.9-5.7 61.61-26.49 3.98-5.91 7.28-12.45 9.07-19.4.54-2.34 1.05-4.76.58-7.16Z'/%3E%3C/svg%3E");
}
.NFL {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 176 176'%3E%3Cpath d='M45.45 112.63c-2.68-8.15 2.71-21.26 6.9-28.42 12.49-22.48 40.37-33.6 65.12-27.49 4.66 1.33 9.96 2.88 12.99 6.91-3.68-3.14-8.8-3.83-13.43-4.5-23.57-2.77-48.1 7.16-61.4 27.17-4.02 5.86-7.41 12.33-9.38 19.22-.6 2.31-1.22 4.72-.8 7.12Z'/%3E%3Cpath d='M45.45 112.63c-.23-6.13 9.79-17.32 14.18-21.6 15.64-15.21 36.29-25.61 57.94-28.63 3.27-.34 6.6-.57 9.87-.04 1.06.22 2.26.45 3.02 1.27-.93-.57-2.03-.54-3.07-.52-3.17.15-6.29.88-9.35 1.7-20.33 5.76-39.41 15.76-55.79 29.1-4.86 4.07-9.6 8.38-13.65 13.28-1.23 1.66-2.85 3.32-3.14 5.43Z'/%3E%3Cpath d='M78.56 71.69c1.4.58 2.43 1.39 2.98 2.72.19.65.16 1.46.46 2.05.28.6.79 1.04 1.4 1.41 2.45 1.49 3.99 3.61 4.17 6.66l-.23.19a6.85 6.85 0 0 1-4.62-3.95c-.7-1.11-.56-2.81-1.52-3.77-.45-.49-1.22-.77-1.74-1.21-.53-.45-.79-1.08-1.01-1.72-.2-.66-.32-1.39-.14-2.24l.26-.14ZM85.55 67.67c1.48.39 2.61 1.21 3.22 2.52.23.65.22 1.46.53 2.05.29.6.81 1.03 1.42 1.41 1.2.71 2.15 1.66 2.9 2.79.69 1.25 1.1 2.59.97 4.11l-.26.15c-1.49-.6-2.51-1.45-3.35-2.45-.77-1.09-1.33-2.3-1.6-3.65-.15-.7-.39-1.32-.86-1.79-.45-.48-1.23-.73-1.77-1.14-.54-.42-.82-1.01-1.09-1.63-.24-.63-.41-1.32-.35-2.18l.24-.18ZM70.91 77.28c1.4.58 2.43 1.39 2.98 2.72.19.65.16 1.46.46 2.05.28.6.79 1.04 1.4 1.41 2.45 1.49 3.99 3.61 4.17 6.66l-.23.19a6.85 6.85 0 0 1-4.62-3.95c-.7-1.11-.56-2.81-1.52-3.77-.45-.49-1.22-.77-1.74-1.21-.53-.45-.79-1.08-1.01-1.72-.2-.66-.32-1.39-.14-2.24l.26-.14ZM130.45 63.63c2.95 8.32-2.14 21.24-6.35 28.63-12.87 23.3-40.01 33.3-65.36 26.84-4.67-1.38-9.93-2.73-13.29-6.46 3.94 2.8 9.07 3.34 13.74 4.06 24.3 3.06 47.9-5.7 61.61-26.49 3.98-5.91 7.28-12.45 9.07-19.4.54-2.34 1.05-4.76.58-7.16Z'/%3E%3C/svg%3E");
}
.NHL {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' id='Layer_1' viewBox='0 0 176 176'%3E%3Cdefs/%3E%3Cpath d='M85.13 88.71c3.31-7.34 13.72-30.4 16.87-37.4.5-1.02.77-1.89.54-2.92-.69-2.54-4.61-2.44-5.61-.12-.35.74-1.85 3.79-2.24 4.61-5.27 10.8-16.03 33.05-21.16 43.61-1.99 4.27-7.44 6.3-11.76 4.37-3.37-1.62-10.16-4.87-13.52-6.51l-3.35-1.64c-1.88-.84-4.15-2.3-6.03-2.37-2.3.07-3.83 2.74-5 4.61-1.06 2.01-2.7 4.63-1.54 6.79.77 1.4 2.84 2.67 5.03 3.6l6.79 3.07c4.53 2.05 9.04 4.12 13.55 6.23 1.78.73 4.75 2.49 6.53 2.74 3.32.57 6.93-1.17 8.39-4.34l1.7-3.32c2.14-4.19 8.02-15.55 10.26-19.88l.36.17-6.38 13.48-3.21 6.73c-1.08 1.99-2.07 5.13-3.82 6.67-2.93 2.97-7.81 3.35-11.47 1.5l-3.47-1.37c-4.63-1.82-9.25-3.67-13.86-5.54-2.49-1.11-8.23-3.09-10.49-4.6-5.72-3.53-4.97-8.78-1.96-13.93 1.41-2.48 3.18-5.09 6.02-6.3 3.75-1.54 7.32.91 10.41 2.41l3.32 1.69 13.18 6.77c2.6 1.26 6.02.06 7.31-2.55l1.7-3.32 6.79-13.28c1.88-3.61 14.54-28.61 16.19-31.64 4.03-5.54 12.22-.78 8.56 5.41-1.02 2.03-3.92 7.88-4.99 10.01l-13.3 26.7-.36-.17Z'/%3E%3Cpath d='m46.52 91.57-2.94 18.76M53.59 95.04l-2.95 18.76' class='cls-1'/%3E%3Cpath d='M102.5 124.63c-.03 1.06-.21 6.01-.23 6.95l-.02.69c.06 1.55-.77 3.03-1.85 3.91-.73.69-1.99 1-2.9 1.31a38.45 38.45 0 0 1-19.6.75c-1.83-.41-3.61-.97-5.35-1.64-1.79-.51-3.53-1.91-3.53-3.9.14 1.96 1.88 3.16 3.66 3.55 1.76.54 3.56.97 5.37 1.25 5.43.83 10.99.48 16.22-1.1 1.26-.36 2.61-.87 3.82-1.37.9-.32 1.64-1.39 1.7-2.2l-.08-2.64-.19-5.56h3Z'/%3E%3Cpath d='m70.5 124.67-.19 5.56-.08 2.64c.06.82.8 1.88 1.7 2.2l1.25.5c5.96 2.27 12.46 2.94 18.79 1.96 1.81-.28 3.61-.71 5.37-1.25 1.77-.38 3.52-1.59 3.66-3.55 0 2-1.74 3.39-3.53 3.9a38.4 38.4 0 0 1-5.35 1.64c-6.89 1.56-14.27 1.14-20.96-1.19-1.95-.65-3.45-2.59-3.4-4.77-.02-.45-.05-1.62-.07-2.08l-.19-5.56z'/%3E%3Cpath d='M86.06 128.3c4.06-.56 8.15-1.04 12.02-2.27.75-.28 1.68-.57 2.15-1.08 0-.02-.04.02-.07.18-.03.14.05.28.04.27-2.04-1.1-4.67-1.27-7.02-1.54-5.34-.49-10.81-.49-16.15-.02-2.35.26-5.18.45-7.21 1.54-.04.03-.03.03 0-.08.04-.12 0-.3-.05-.34-.06-.06.08.14.3.26 4.16 2.05 9.06 2.34 13.64 3.08-2.76.29-5.53.32-8.33.15-2.17-.22-4.35-.36-6.4-1.35-.37-.22-.81-.44-1.21-1.1-.74-1.3.49-2.63 1.56-3.1 2.32-1.14 4.9-1.5 7.39-1.88 5.6-.67 11.2-.67 16.79.03 2.36.39 11.01 1.44 8.46 5.33-.98 1.01-2.18 1.24-3.37 1.54-4.15.82-8.37.78-12.54.39ZM79.23 77c-4.36-6.92-8.15-14.09-11.86-21.35-1.26-2.84-3.57-5.48-2.07-8.86 1.97-4.04 8.35-3.59 10.01.46l.43.92c3.16 6.77 6.18 13.58 8.74 20.63-4.08-6.29-7.69-12.81-11.19-19.41-.22-.38-.59-1.19-.88-1.49-1.03-1.39-3.71-1.35-4.42.2-.84 1.98 1.28 4.39 1.92 6.3 3.37 7.43 6.62 14.88 9.32 22.6M89.7 79.27c3.16 5.35 6.17 10.83 9.17 16.21 1.33 2.31 4.18 3.57 6.75 2.94 1.1-.23 2.83-1.29 3.87-1.82 4-2.1 8.36-4.46 12.36-6.51 4.84-2.42 9.96-6.29 14.79-1.1 1.78 1.79 3.03 4.15 4.15 6.37 1.25 2.62 1.81 5.95.12 8.55-2.17 3.25-5.35 4.26-8.59 5.67l-8.58 3.62-8.62 3.55-4.31 1.77c-1.43.56-3.37 1.47-4.93 1.5-4.55.46-9-2.37-10.48-6.67l-.95-2.13c-3.12-7.07-6.21-14.3-9.08-21.47 3.83 6.7 7.53 13.65 11.14 20.47l1.09 2.05c1.57 3.81 5.95 5.79 9.77 4.14 3.75-1.73 10.92-4.92 14.76-6.64l8.53-3.73c3.53-1.58 8.89-3.25 6.92-8.11-1.1-2.77-3.82-7.78-6.42-7.77-.95-.05-2.25.42-3.59 1.06-5.44 2.62-11.35 5.41-16.82 7.95l-2.11.99c-4.02 2.15-9.58.4-11.51-3.76-2.56-5.72-5.06-11.37-7.45-17.13Z'/%3E%3Cpath d='m123.43 91.57 2.94 18.76M116.36 95.04l2.94 18.76' class='cls-1'/%3E%3C/svg%3E");
}
.NRL {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 176 176'%3E%3Cpath d='M45.43 112.64c-2.6-8.04 3-21.17 7.22-28.17 12.56-22.04 40.32-33.29 64.84-27.55 4.65 1.27 9.96 2.71 13 6.7-6.39-5.15-19.67-4.93-27.57-4.2C84.09 61.3 66.75 70.96 55.9 86.61c-4.07 5.78-7.53 12.16-9.59 18.98-.62 2.29-1.29 4.67-.88 7.06Z'/%3E%3Cpath d='M130.48 63.62c2.89 8.18-2.45 21.18-6.67 28.38-13.03 22.88-39.88 32.95-65.09 26.9-4.65-1.31-9.92-2.58-13.29-6.26 3.95 2.74 9.06 3.2 13.71 3.84 24.09 2.71 47.59-6.22 61.4-26.59 4.01-5.83 7.41-12.28 9.29-19.17.57-2.31 1.13-4.72.66-7.11Z'/%3E%3Cpath d='M100.05 98.73c9.99-8.77 19.42-18.65 24.69-30.95.4-1.08.84-2.21.89-3.19 0 .03.01-.05 0 .07 0 .08.02.17.06.25l.9 1.71c.07.13.26.24.22.22-.79-.47-1.92-.7-3.01-.93-13.21-2.09-26.7.76-39.55 4.22l-.24-.44c3.52-1.91 7.18-3.58 10.96-4.93 7.58-2.65 15.57-4.22 23.62-4.19 3.03.05 6.11.27 9.02 1.21 1 .35 2.05.79 2.87 1.7l.02.11c.25 1.18.01 2.21-.23 3.2-.81 2.94-2.24 5.65-3.8 8.23-4.22 6.82-9.78 12.77-16.1 17.69-3.17 2.44-6.57 4.59-10.1 6.46l-.24-.44ZM74.98 76.66c-9.74 9.05-18.88 19.19-23.8 31.64-.37 1.09-.78 2.24-.8 3.21 0-.03 0 .05-.01-.07a.8.8 0 0 0-.06-.25l-.95-1.68c-.07-.12-.27-.23-.22-.22.8.44 1.94.65 3.03.85 13.26 1.72 26.67-1.52 39.41-5.34l.25.43c-3.47 2.01-7.08 3.78-10.82 5.23-7.5 2.87-15.45 4.66-23.49 4.85-3.03.03-6.11-.09-9.05-.95-1.01-.32-2.07-.73-2.92-1.61l-.03-.11c-.28-1.17-.07-2.2.14-3.21.72-2.96 2.08-5.71 3.57-8.34 4.03-6.94 9.41-13.04 15.59-18.14 3.1-2.53 6.43-4.77 9.91-6.74l.25.43Z'/%3E%3Cpath d='M68.9 91.03c-3.15 5.06-6.69 9.78-8.42 15.36-.04.13 0 .06 0-.02-.01.11.05-.58-.14-.95l-.95-1.68c-.77-.81-.99-.65-.84-.66 5.71 1.19 11.59.29 17.54.13l.25.43c-4.59 2.75-9.85 4.42-15.21 4.58-1.87-.04-3.9.09-5.46-1.16-.07-.06-.09-.06-.11-.19-.25-1.98.82-3.65 1.69-5.3 2.71-4.62 6.72-8.42 11.41-10.98l.25.43ZM107.64 84.05c3.25-4.99 6.87-9.65 8.72-15.2.04-.13 0-.06 0 .02.02-.11-.06.58.12.96l.91 1.7c.75.83.98.67.83.67-5.69-1.3-11.59-.52-17.53-.47l-.24-.44c4.64-2.66 9.93-4.23 15.3-4.29 1.86.07 3.9-.02 5.44 1.27.07.07.09.06.1.19.21 1.98-.89 3.63-1.79 5.27-2.8 4.56-6.88 8.29-11.62 10.76z'/%3E%3C/svg%3E");
}
.UEFFAChampionsLeague {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 176 176'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Ccircle cx='89.5' cy='78.5' r='36' fill='none'/%3E%3C/clipPath%3E%3C/defs%3E%3Cpath d='M58.6 59.72c9.24-18.75 34.22-24.46 51.48-13.14 12.91 8.03 19.8 24.52 16.05 39.26-1.19 4.77-3.33 9.26-6.36 12.98 6.34-12.7 5.44-27.76-2.76-38.96-14.31-19.73-43.43-19.22-58.4-.13Z'/%3E%3Cpath d='M120.08 98.49c-9.42 18.66-34.45 24.13-51.6 12.64-12.83-8.15-19.56-24.71-15.67-39.41 1.24-4.76 3.42-9.23 6.48-12.91-6.46 12.63-5.7 27.71 2.39 38.99 14.12 19.87 43.24 19.63 58.39.7Z'/%3E%3Cg clip-path='url(%23a)'%3E%3Cpath d='M77.16 71.2c-.59 5.08-1.08 10.36-1.43 15.44 4.7 2.12 9.73 4.25 14.65 6.22a488 488 0 0 0 10.67-11.75c-2.68-4.49-5.52-9.1-8.3-13.46-5.23 1.08-10.57 2.3-15.6 3.55ZM67.01 62.37c-4.27 1.46-7.97 3.03-10.61 4.62-1.09-3.26-1.86-6.06-2.65-8.64 1.51-3.56 3.91-7 6.82-9.8 2.78.52 5.84 1.08 9.39 1.88-1.15 3.35-2.14 7.46-2.96 11.95Z'/%3E%3Cpath d='M77.1 73.45c-4.29-4.66-8.1-8.91-11.16-12.42 3.62 2.87 8.08 6.4 13.04 10.32-.63.7-1.26 1.4-1.88 2.1M91.06 68.46c4.12-6.14 7.98-11.7 11.06-15.93-2.32 4.61-5.32 10.67-8.58 17.31-.83-.46-1.66-.93-2.48-1.38'/%3E%3Cpath d='M101.04 53.97c-2.32-3.69-4.59-6.74-6.62-8.78 3.07-1.41 5.67-2.24 7.83-2.74 3.76.37 7.8 1.35 11.63 2.93.3 2.26.4 5.19.28 8.72-3.9-.25-8.36-.29-13.11-.14ZM116.67 82.63c2.31-4.08 4.23-7.95 5.73-11.39 2.98 1.61 4.97 3.15 5.54 4.49.03 3.73.04 7.42.06 11.07-.52 1.84-2.45 3.88-5.34 5.95-1.56-2.96-3.55-6.38-5.99-10.12'/%3E%3Cpath d='M97.08 79.94c8.06 1.01 15.68 1.98 21.34 2.72-5.72.12-13.41.16-21.53.14.07-.95.13-1.91.19-2.86M78.77 86.68c-6.68 2.6-12.68 4.88-17.2 6.55 4.18-2.44 9.74-5.61 15.99-9.11.4.85.8 1.71 1.21 2.56'/%3E%3Cpath d='M64.21 92.08c-3.87-2.1-7.09-4.19-9.2-6.11-1.32 3-2.1 5.53-2.67 7.68.48 3.68 1.68 7.58 3.53 11.19 2.44.14 5.46.11 9.08-.15-.44-3.73-.69-8.02-.75-12.61ZM93.98 105.58c-3.56 2.92-6.91 5.33-9.82 7.14 2.4 2.43 4.57 3.94 6.32 4.31 3.73-.07 7.65-.2 11.66-.49 1.41-1.17 2.77-3.63 4.04-6.92a162 162 0 0 1-12.2-4.04'/%3E%3Cpath d='M91.5 90.12c1.3 7.62 2.5 14.6 3.36 19.53-1.68-4.77-3.86-11.51-6.13-18.9.92-.21 1.85-.41 2.77-.63'/%3E%3C/g%3E%3C/svg%3E");
@media (max-width: 480px) {
    /* Sport grid mobile */
    .sport-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.75rem;
    }

    .sport-card {
        padding: 1rem 0.75rem;
    }

    .sport-icon {
        width: 50px;
        height: 50px;
        padding: 0.75rem;
        margin-bottom: 0.5rem;
    }

    .sport-card h3 {
        font-size: 0.95rem;
    }

    /* Hero typography uses clamp() in base */

    .section-header h2 {
        font-size: clamp(2rem, 7vw, 3.5rem);
        padding: 0 0.5rem;
        line-height: 1;
        white-space: normal;
    }

    /* Underline removed for cleaner look */

    .section-header h2 .accent,
    .section-header h2 .accent-yellow {
        transform: skewX(-1deg);
        margin: 0 0.05em;
        display: inline-block;
    }

    .section-header.display-large h2 {
        font-size: clamp(2.5rem, 9vw, 4rem);
        padding: 0 0.25rem;
        word-spacing: normal;
    }

    /* Tighter container padding */
    .container {
        padding: 0 1.25rem;
    }

    /* Compact pill header */
    header {
        padding: 0.75rem 0.75rem;
    }

    nav {
        padding: 0.75rem 1.25rem;
        gap: 0.75rem;
        min-height: 56px;
    }

    nav .btn {
        padding: 0.65rem 1.1rem;
        font-size: 0.8rem;
    }

    /* Further section padding reduction */
    .hero,
    .product-showcase,
    .how-it-works,
    .live-tournaments,
    .beta-benefits,
    .final-cta {
        padding: 2rem 0;
    }

    /* Smaller step numbers */
    .step-number,
    .preview-number {
        width: 36px;
        height: 36px;
        font-size: 1.1rem;
    }
}

/* ===== Tournament Loading State ===== */
.tournaments-loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 6rem 2rem;
    min-height: 400px;
}

.loading-spinner {
    position: relative;
    width: 80px;
    height: 80px;
    margin-bottom: 2rem;
}

.spinner-ring {
    position: absolute;
    width: 100%;
    height: 100%;
    border: 4px solid transparent;
    border-radius: 50%;
    animation: spin 1.5s cubic-bezier(0.5, 0, 0.5, 1) infinite;
}

.spinner-ring:nth-child(1) {
    border-top-color: var(--bma-green);
    animation-delay: -0.45s;
}

.spinner-ring:nth-child(2) {
    border-top-color: var(--bma-yellow);
    animation-delay: -0.3s;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.loading-text {
    font-size: 1.1rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.8);
    text-align: center;
    animation: pulse 2s ease-in-out infinite;
}

@keyframes pulse {
    0%, 100% { opacity: 0.6; }
    50% { opacity: 1; }
}

.tournaments-error {
    text-align: center;
    padding: 2rem;
    background: rgba(220, 20, 60, 0.1);
    border: 1px solid rgba(220, 20, 60, 0.3);
    border-radius: 12px;
    margin-bottom: 2rem;
}

.tournaments-error p {
    color: rgba(255, 255, 255, 0.8);
    margin: 0;
}

/* ===== Breadcrumb Navigation ===== */
.breadcrumb {
    background: rgba(10, 10, 10, 0.6);
    border-bottom: 1px solid rgba(46, 139, 87, 0.2);
    padding: 1rem 0;
    margin-bottom: 2rem;
}

.breadcrumb-list {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    padding: 0;
    flex-wrap: wrap;
}

.breadcrumb-item {
    display: flex;
    align-items: center;
    font-size: 0.9rem;
}

.breadcrumb-item a {
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    transition: color 0.3s ease;
}

.breadcrumb-item a:hover {
    color: var(--bma-green-bright);
}

.breadcrumb-item.active {
    color: var(--bma-white);
    font-weight: 500;
}

.breadcrumb-separator {
    color: rgba(255, 255, 255, 0.3);
    display: flex;
    align-items: center;
}

.breadcrumb .icon {
    width: 16px;
    height: 16px;
}

/* ===== Tournaments Page ===== */
.tournaments-page {
    padding: 4rem 0 6rem;
    background: var(--bma-dark);
    min-height: 100vh;
}

.tournaments-header {
    text-align: center;
    margin-bottom: 3rem;
}

.tournaments-header .section-logo {
    height: 60px;
    margin-bottom: 1.5rem;
    opacity: 0.9;
}

.tournaments-header h1 {
    font-size: 3rem;
    font-weight: 800;
    margin-bottom: 1rem;
    background: linear-gradient(135deg, var(--bma-white) 0%, var(--bma-green-bright) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.tournaments-lead {
    font-size: 1.2rem;
    color: rgba(255, 255, 255, 0.7);
    max-width: 600px;
    margin: 0 auto;
}

/* Filter Controls */
.tournaments-controls {
    background: linear-gradient(135deg, rgba(46, 139, 87, 0.05) 0%, rgba(10, 10, 10, 0.6) 100%);
    border: 1px solid rgba(46, 139, 87, 0.2);
    border-radius: 16px;
    padding: 2rem;
    margin-bottom: 3rem;
}

.filter-tabs {
    display: flex;
    gap: 1rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}

.filter-tab {
    background: rgba(255, 255, 255, 0.05);
    border: 2px solid transparent;
    border-radius: 12px;
    padding: 0.75rem 1.5rem;
    color: rgba(255, 255, 255, 0.7);
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.filter-tab:hover {
    background: rgba(46, 139, 87, 0.1);
    color: var(--bma-white);
}

.filter-tab.active {
    background: linear-gradient(135deg, var(--bma-green) 0%, rgba(46, 139, 87, 0.8) 100%);
    border-color: var(--bma-green-bright);
    color: var(--bma-white);
}

.tab-count {
    background: rgba(0, 0, 0, 0.3);
    border-radius: 20px;
    padding: 0.2rem 0.6rem;
    font-size: 0.85rem;
    font-weight: 700;
}

.filter-tab.active .tab-count {
    background: rgba(0, 230, 118, 0.3);
    color: var(--bma-green-bright);
}

/* Sport Filters */
.sport-filters {
    display: flex;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}

.sport-pill {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 24px;
    padding: 0.5rem 1rem;
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.sport-pill:hover {
    background: rgba(46, 139, 87, 0.1);
    border-color: var(--bma-green);
    color: var(--bma-white);
}

.sport-pill.active {
    background: var(--bma-green);
    border-color: var(--bma-green-bright);
    color: var(--bma-white);
}

.sport-icon-small {
    display: inline-block;
    width: 20px;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    filter: brightness(0) saturate(100%) invert(79%) sepia(79%) saturate(2476%) hue-rotate(86deg) brightness(98%) contrast(119%);
}
/* Large sport icons - for homepage sport boxes */
.sport-icon.NFL,

.sport-icon-small.NFL {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 176 176'%3E%3Cpath d='M45.45 112.63c-2.68-8.15 2.71-21.26 6.9-28.42 12.49-22.48 40.37-33.6 65.12-27.49 4.66 1.33 9.96 2.88 12.99 6.91-3.68-3.14-8.8-3.83-13.43-4.5-23.57-2.77-48.1 7.16-61.4 27.17-4.02 5.86-7.41 12.33-9.38 19.22-.6 2.31-1.22 4.72-.8 7.12Z'/%3E%3Cpath d='M45.45 112.63c-.23-6.13 9.79-17.32 14.18-21.6 15.64-15.21 36.29-25.61 57.94-28.63 3.27-.34 6.6-.57 9.87-.04 1.06.22 2.26.45 3.02 1.27-.93-.57-2.03-.54-3.07-.52-3.17.15-6.29.88-9.35 1.7-20.33 5.76-39.41 15.76-55.79 29.1-4.86 4.07-9.6 8.38-13.65 13.28-1.23 1.66-2.85 3.32-3.14 5.43Z'/%3E%3Cpath d='M78.56 71.69c1.4.58 2.43 1.39 2.98 2.72.19.65.16 1.46.46 2.05.28.6.79 1.04 1.4 1.41 2.45 1.49 3.99 3.61 4.17 6.66l-.23.19a6.85 6.85 0 0 1-4.62-3.95c-.7-1.11-.56-2.81-1.52-3.77-.45-.49-1.22-.77-1.74-1.21-.53-.45-.79-1.08-1.01-1.72-.2-.66-.32-1.39-.14-2.24l.26-.14ZM85.55 67.67c1.48.39 2.61 1.21 3.22 2.52.23.65.22 1.46.53 2.05.29.6.81 1.03 1.42 1.41 1.2.71 2.15 1.66 2.9 2.79.69 1.25 1.1 2.59.97 4.11l-.26.15c-1.49-.6-2.51-1.45-3.35-2.45-.77-1.09-1.33-2.3-1.6-3.65-.15-.7-.39-1.32-.86-1.79-.45-.48-1.23-.73-1.77-1.14-.54-.42-.82-1.01-1.09-1.63-.24-.63-.41-1.32-.35-2.18l.24-.18ZM70.91 77.28c1.4.58 2.43 1.39 2.98 2.72.19.65.16 1.46.46 2.05.28.6.79 1.04 1.4 1.41 2.45 1.49 3.99 3.61 4.17 6.66l-.23.19a6.85 6.85 0 0 1-4.62-3.95c-.7-1.11-.56-2.81-1.52-3.77-.45-.49-1.22-.77-1.74-1.21-.53-.45-.79-1.08-1.01-1.72-.2-.66-.32-1.39-.14-2.24l.26-.14ZM130.45 63.63c2.95 8.32-2.14 21.24-6.35 28.63-12.87 23.3-40.01 33.3-65.36 26.84-4.67-1.38-9.93-2.73-13.29-6.46 3.94 2.8 9.07 3.34 13.74 4.06 24.3 3.06 47.9-5.7 61.61-26.49 3.98-5.91 7.28-12.45 9.07-19.40.54-2.34 1.05-4.76.58-7.16Z'/%3E%3C/svg%3E");
}

.sport-icon-small.NBA {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 176 176'%3E%3Cpath d='M60.03 65.95c7.33-19.57 31.62-27.74 49.91-18.19 13.64 6.7 22.14 22.43 19.87 37.47-.71 4.87-2.4 9.55-5.04 13.54 5.04-13.26 2.65-28.16-6.63-38.49-16.21-18.21-45.13-14.8-58.12 5.68Z'/%3E%3Cpath d='M125.06 98.4c-7.52 19.5-31.88 27.44-50.09 17.71-13.58-6.84-21.92-22.64-19.51-37.66.76-4.86 2.49-9.53 5.17-13.5-5.17 13.21-2.92 28.14 6.26 38.56 16.03 18.36 44.98 15.23 58.17-5.12Z'/%3E%3Cpath d='M126.42 95.69c-3.07 7.29-12.94 7.58-19.7 7.07-14.59-1.62-28.72-8.41-39.08-18.81-4.63-4.97-10.54-12.87-6.76-19.81-1.97 7.07 4.19 13.13 8.92 17.56 10.6 9.01 23.68 15.31 37.33 17.98 6.42.94 14.99 1.97 19.29-3.98Z'/%3E%3Cpath d='M76 113c-4.49-2.75-4.45-9.3-4.24-13.97.65-8.37 4.25-16.19 8.68-23.18 5.32-8.25 11.39-16.27 19.44-22.03 2.61-1.7 6.13-3.84 9.26-2.38-5.33-1.26-11.63 6.9-14.76 10.57-8.59 11.15-16.53 23.48-19.26 37.48-.62 3.02-1.02 6.13-.73 9.2.19 1.51.53 3.05 1.61 4.31'/%3E%3Cpath d='M96.92 119.94c-8.85-2.45-13.09-13.3-11.84-21.86 1.59-9.14 9.38-15.59 17.02-19.76 9.51-5.16 17.52-9.23 17.9-21.31 2.62 17.16-14.19 21.06-23.96 30.06-3.38 3.18-6.15 7.13-7.07 11.69-1.22 7.68 1.22 16.56 7.95 21.19ZM56 87c2.27.45 3.81-.44 5.17-1.6 1.36-1.17 2.54-2.65 3.57-4.21 2.18-3.28 3.63-6.95 4.49-10.91.93-3.93 1.3-8.26 2.88-12.43 1.46-4.12 4.42-7.69 8.06-10.02-2.78 3.11-4.87 6.66-5.75 10.72-.88 3.92-.9 8.09-1.61 12.42-.67 4.32-2.25 8.69-4.75 12.43-2.21 3.63-8.52 7.81-12.06 3.59Z'/%3E%3C/svg%3E");
}

.sport-icon-small.MLB {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 176 176'%3E%3Cpath d='M57.16 68.76c9.24-18.75 34.22-24.46 51.48-13.14 12.91 8.03 19.8 24.52 16.05 39.26-1.19 4.77-3.33 9.26-6.36 12.98 6.34-12.7 5.44-27.76-2.76-38.96-14.31-19.73-43.43-19.22-58.4-.13Z'/%3E%3Cpath d='M118.65 107.53c-9.42 18.66-34.45 24.13-51.6 12.64-12.83-8.15-19.56-24.71-15.67-39.41 1.24-4.76 3.42-9.23 6.48-12.91-6.46 12.63-5.7 27.71 2.39 38.99 14.12 19.87 43.24 19.63 58.39.7Z'/%3E%3Cpath d='M81.5 51.5c.66.98.55 2.28.63 3.41 0 3.51-.67 6.99-1.7 10.34-3.47 11.11-11.23 21.46-22.11 26.16-1.91.74-3.92 1.46-5.99 1.37-.29-.03-.62-.06-.83-.29.53.21 1.1-.03 1.63-.18 1.59-.54 3.08-1.37 4.5-2.26 9.42-6.03 16.32-15.36 20.66-25.58 1.28-3.11 2.39-6.33 3.05-9.64.15-1.09.52-2.27.17-3.34Z'/%3E%3Cpath d='M55.04 86.32c2.84 2.25 4.98 5.19 6.01 8.68-3.18-1.76-5.55-5.06-6.01-8.68M60.09 83.59c3.08 1.9 5.56 4.57 6.98 7.92-3.36-1.37-6.1-4.38-6.98-7.92M64.24 79.48c3.36 1.34 6.26 3.54 8.25 6.59-3.55-.77-6.76-3.25-8.25-6.59M67.96 74.84c3.4 1.23 6.38 3.34 8.46 6.32-3.57-.66-6.87-3.03-8.46-6.32M71.01 69.38c3.55.7 6.8 2.34 9.31 4.98-3.63-.11-7.24-1.97-9.31-4.98M73.95 64.04c3.61.32 7.01 1.6 9.79 3.95-3.62.27-7.41-1.18-9.79-3.95M75.55 58.53c3.6-.36 7.19.27 10.35 2.06-3.51.94-7.5.22-10.35-2.06M91 123c-5.65-2.93-5.31-10.76-4.39-16.15 2.63-13.39 12.84-28.9 26.15-33.47 2.79-.82 6.22-1 8.57.99-5.53-1.99-10.52 2.2-14.46 5.57-7.88 7.52-13.95 17.24-17.24 27.63-1.3 5.02-2.86 11.35 1.36 15.44Z'/%3E%3Cpath d='M112.92 80.57c-3.06-2.21-5.48-5.13-6.83-8.68 3.39 1.69 6.06 4.95 6.83 8.68M107.82 83.75c-3.3-1.84-6.04-4.46-7.8-7.82 3.57 1.28 6.59 4.21 7.8 7.82M103.74 88.31c-3.57-1.24-6.72-3.34-9.04-6.35 3.73.64 7.22 3.01 9.04 6.35M100.15 93.39c-3.61-1.12-6.83-3.12-9.24-6.05 3.75.52 7.32 2.77 9.24 6.05M97.32 99.29c-3.73-.57-7.22-2.06-10.04-4.6 3.79-.05 7.65 1.64 10.04 4.6M94.59 105.05c-3.77-.17-7.4-1.28-10.47-3.5 3.76-.45 7.78.82 10.47 3.5M93.27 110.91c-3.74.54-7.51.12-10.94-1.49 3.61-1.15 7.8-.65 10.94 1.49'/%3E%3C/svg%3E");
}

.sport-icon-small.NHL {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' id='Layer_1' viewBox='0 0 176 176'%3E%3Cdefs/%3E%3Cpath d='M85.13 88.71c3.31-7.34 13.72-30.4 16.87-37.4.5-1.02.77-1.89.54-2.92-.69-2.54-4.61-2.44-5.61-.12-.35.74-1.85 3.79-2.24 4.61-5.27 10.8-16.03 33.05-21.16 43.61-1.99 4.27-7.44 6.3-11.76 4.37-3.37-1.62-10.16-4.87-13.52-6.51l-3.35-1.64c-1.88-.84-4.15-2.3-6.03-2.37-2.3.07-3.83 2.74-5 4.61-1.06 2.01-2.7 4.63-1.54 6.79.77 1.4 2.84 2.67 5.03 3.6l6.79 3.07c4.53 2.05 9.04 4.12 13.55 6.23 1.78.73 4.75 2.49 6.53 2.74 3.32.57 6.93-1.17 8.39-4.34l1.7-3.32c2.14-4.19 8.02-15.55 10.26-19.88l.36.17-6.38 13.48-3.21 6.73c-1.08 1.99-2.07 5.13-3.82 6.67-2.93 2.97-7.81 3.35-11.47 1.5l-3.47-1.37c-4.63-1.82-9.25-3.67-13.86-5.54-2.49-1.11-8.23-3.09-10.49-4.6-5.72-3.53-4.97-8.78-1.96-13.93 1.41-2.48 3.18-5.09 6.02-6.3 3.75-1.54 7.32.91 10.41 2.41l3.32 1.69 13.18 6.77c2.6 1.26 6.02.06 7.31-2.55l1.7-3.32 6.79-13.28c1.88-3.61 14.54-28.61 16.19-31.64 4.03-5.54 12.22-.78 8.56 5.41-1.02 2.03-3.92 7.88-4.99 10.01l-13.3 26.7-.36-.17Z'/%3E%3Cpath d='m46.52 91.57-2.94 18.76M53.59 95.04l-2.95 18.76' class='cls-1'/%3E%3Cpath d='M102.5 124.63c-.03 1.06-.21 6.01-.23 6.95l-.02.69c.06 1.55-.77 3.03-1.85 3.91-.73.69-1.99 1-2.9 1.31a38.45 38.45 0 0 1-19.6.75c-1.83-.41-3.61-.97-5.35-1.64-1.79-.51-3.53-1.91-3.53-3.9.14 1.96 1.88 3.16 3.66 3.55 1.76.54 3.56.97 5.37 1.25 5.43.83 10.99.48 16.22-1.1 1.26-.36 2.61-.87 3.82-1.37.9-.32 1.64-1.39 1.7-2.2l-.08-2.64-.19-5.56h3Z'/%3E%3Cpath d='m70.5 124.67-.19 5.56-.08 2.64c.06.82.8 1.88 1.7 2.2l1.25.5c5.96 2.27 12.46 2.94 18.79 1.96 1.81-.28 3.61-.71 5.37-1.25 1.77-.38 3.52-1.59 3.66-3.55 0 2-1.74 3.39-3.53 3.9a38.4 38.4 0 0 1-5.35 1.64c-6.89 1.56-14.27 1.14-20.96-1.19-1.95-.65-3.45-2.59-3.4-4.77-.02-.45-.05-1.62-.07-2.08l-.19-5.56z'/%3E%3Cpath d='M86.06 128.3c4.06-.56 8.15-1.04 12.02-2.27.75-.28 1.68-.57 2.15-1.08 0-.02-.04.02-.07.18-.03.14.05.28.04.27-2.04-1.1-4.67-1.27-7.02-1.54-5.34-.49-10.81-.49-16.15-.02-2.35.26-5.18.45-7.21 1.54-.04.03-.03.03 0-.08.04-.12 0-.30-.05-.34-.06-.06.08.14.3.26 4.16 2.05 9.06 2.34 13.64 3.08-2.76.29-5.53.32-8.33.15-2.17-.22-4.35-.36-6.4-1.35-.37-.22-.81-.44-1.21-1.1-.74-1.3.49-2.63 1.56-3.1 2.32-1.14 4.9-1.5 7.39-1.88 5.6-.67 11.2-.67 16.79.03 2.36.39 11.01 1.44 8.46 5.33-.98 1.01-2.18 1.24-3.37 1.54-4.15.82-8.37.78-12.54.39ZM79.23 77c-4.36-6.92-8.15-14.09-11.86-21.35-1.26-2.84-3.57-5.48-2.07-8.86 1.97-4.04 8.35-3.59 10.01.46l.43.92c3.16 6.77 6.18 13.58 8.74 20.63-4.08-6.29-7.69-12.81-11.19-19.41-.22-.38-.59-1.19-.88-1.49-1.03-1.39-3.71-1.35-4.42.2-.84 1.98 1.28 4.39 1.92 6.3 3.37 7.43 6.62 14.88 9.32 22.6M89.7 79.27c3.16 5.35 6.17 10.83 9.17 16.21 1.33 2.31 4.18 3.57 6.75 2.94 1.1-.23 2.83-1.29 3.87-1.82 4-2.1 8.36-4.46 12.36-6.51 4.84-2.42 9.96-6.29 14.79-1.1 1.78 1.79 3.03 4.15 4.15 6.37 1.25 2.62 1.81 5.95.12 8.55-2.17 3.25-5.35 4.26-8.59 5.67l-8.58 3.62-8.62 3.55-4.31 1.77c-1.43.56-3.37 1.47-4.93 1.5-4.55.46-9-2.37-10.48-6.67l-.95-2.13c-3.12-7.07-6.21-14.3-9.08-21.47 3.83 6.7 7.53 13.65 11.14 20.47l1.09 2.05c1.57 3.81 5.95 5.79 9.77 4.14 3.75-1.73 10.92-4.92 14.76-6.64l8.53-3.73c3.53-1.58 8.89-3.25 6.92-8.11-1.10-2.77-3.82-7.78-6.42-7.77-.95-.05-2.25.42-3.59 1.06-5.44 2.62-11.35 5.41-16.82 7.95l-2.11.99c-4.02 2.15-9.58.4-11.51-3.76-2.56-5.72-5.06-11.37-7.45-17.13Z'/%3E%3Cpath d='m123.43 91.57 2.94 18.76M116.36 95.04l2.94 18.76' class='cls-1'/%3E%3C/svg%3E");
}

.sport-icon.SOCCER,
.sport-icon-small.SOCCER,
.sport-icon.EPL,
.sport-icon-small.EPL,
.sport-icon.UEFA,
.sport-icon-small.UEFA,
.sport-icon.MLS,
.sport-icon-small.MLS {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 176 176'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Ccircle cx='88.05' cy='87.78' r='36' fill='none'/%3E%3C/clipPath%3E%3C/defs%3E%3Cpath d='M57.15 69c9.24-18.75 34.22-24.46 51.48-13.14 12.91 8.03 19.8 24.52 16.05 39.26-1.19 4.77-3.33 9.26-6.36 12.98 6.34-12.7 5.44-27.76-2.76-38.96-14.31-19.73-43.43-19.22-58.4-.13Z'/%3E%3Cpath d='M118.63 107.77c-9.42 18.66-34.45 24.13-51.6 12.64C54.2 112.26 47.47 95.7 51.36 81c1.24-4.76 3.42-9.23 6.48-12.91-6.46 12.63-5.7 27.71 2.39 38.99 14.12 19.87 43.24 19.63 58.39.7Z'/%3E%3Cg clip-path='url(%23a)'%3E%3Cpath d='M75.71 80.48c-.59 5.08-1.08 10.36-1.43 15.44 4.7 2.12 9.73 4.25 14.65 6.22A488 488 0 0 0 99.6 90.39c-2.68-4.49-5.52-9.1-8.3-13.46-5.23 1.08-10.57 2.3-15.6 3.55ZM65.56 71.65c-4.27 1.46-7.97 3.03-10.61 4.62-1.09-3.26-1.86-6.06-2.65-8.64 1.51-3.55 3.91-7 6.82-9.8 2.78.52 5.84 1.08 9.39 1.88-1.15 3.35-2.14 7.46-2.96 11.95Z'/%3E%3Cpath d='M75.66 82.73c-4.29-4.66-8.1-8.91-11.16-12.42 3.62 2.87 8.08 6.4 13.04 10.32-.63.7-1.26 1.4-1.88 2.1M89.61 77.74c4.12-6.14 7.98-11.7 11.06-15.93-2.32 4.61-5.32 10.67-8.58 17.31-.83-.46-1.66-.93-2.48-1.38'/%3E%3Cpath d='M99.59 63.25c-2.32-3.69-4.59-6.74-6.62-8.78 3.07-1.41 5.67-2.24 7.83-2.74 3.76.37 7.8 1.35 11.63 2.93.3 2.26.4 5.19.28 8.72-3.9-.25-8.36-.29-13.11-.14ZM115.22 91.92c2.31-4.08 4.23-7.95 5.73-11.39 2.98 1.61 4.97 3.15 5.54 4.49.03 3.73.04 7.42.06 11.07-.52 1.84-2.46 3.88-5.34 5.95-1.56-2.96-3.55-6.38-5.99-10.12'/%3E%3Cpath d='M95.63 89.22c8.06 1.01 15.68 1.98 21.34 2.72-5.72.12-13.41.16-21.53.14.07-.95.13-1.91.19-2.86M77.32 95.96c-6.68 2.6-12.68 4.88-17.2 6.55 4.18-2.44 9.74-5.61 15.99-9.11.4.85.8 1.71 1.21 2.56'/%3E%3Cpath d='M62.76 101.37c-3.87-2.1-7.09-4.19-9.20-6.11-1.32 3-2.1 5.53-2.67 7.68.48 3.68 1.68 7.58 3.53 11.19 2.44.14 5.46.11 9.08-.15-.44-3.73-.69-8.02-.75-12.61ZM92.53 114.86c-3.56 2.92-6.91 5.33-9.82 7.14 2.4 2.43 4.57 3.94 6.32 4.31 3.73-.07 7.65-.2 11.66-.49 1.41-1.17 2.77-3.63 4.04-6.92a162 162 0 0 1-12.2-4.04'/%3E%3Cpath d='M90.06 99.41c1.3 7.62 2.5 14.6 3.36 19.53-1.68-4.77-3.86-11.51-6.13-18.90.92-.21 1.85-.41 2.77-.63'/%3E%3C/g%3E%3C/svg%3E");
}

.sport-icon.CFL,
.sport-icon-small.CFL,
.sport-icon.AFL,
.sport-icon-small.AFL {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 176 176'%3E%3Cpath d='M45.45 112.63c-2.68-8.15 2.71-21.26 6.9-28.42 12.49-22.48 40.37-33.6 65.12-27.49 4.66 1.33 9.96 2.88 12.99 6.91-3.68-3.14-8.8-3.83-13.43-4.5-23.57-2.77-48.1 7.16-61.4 27.17-4.02 5.86-7.41 12.33-9.38 19.22-.6 2.31-1.22 4.72-.8 7.12Z'/%3E%3Cpath d='M45.45 112.63c-.23-6.13 9.79-17.32 14.18-21.6 15.64-15.21 36.29-25.61 57.94-28.63 3.27-.34 6.6-.57 9.87-.04 1.06.22 2.26.45 3.02 1.27-.93-.57-2.03-.54-3.07-.52-3.17.15-6.29.88-9.35 1.7-20.33 5.76-39.41 15.76-55.79 29.1-4.86 4.07-9.6 8.38-13.65 13.28-1.23 1.66-2.85 3.32-3.14 5.43Z'/%3E%3Cpath d='M78.56 71.69c1.4.58 2.43 1.39 2.98 2.72.19.65.16 1.46.46 2.05.28.6.79 1.04 1.4 1.41 2.45 1.49 3.99 3.61 4.17 6.66l-.23.19a6.85 6.85 0 0 1-4.62-3.95c-.7-1.11-.56-2.81-1.52-3.77-.45-.49-1.22-.77-1.74-1.21-.53-.45-.79-1.08-1.01-1.72-.2-.66-.32-1.39-.14-2.24l.26-.14ZM85.55 67.67c1.48.39 2.61 1.21 3.22 2.52.23.65.22 1.46.53 2.05.29.6.81 1.03 1.42 1.41 1.2.71 2.15 1.66 2.9 2.79.69 1.25 1.10 2.59.97 4.11l-.26.15c-1.49-.6-2.51-1.45-3.35-2.45-.77-1.09-1.33-2.30-1.6-3.65-.15-.7-.39-1.32-.86-1.79-.45-.48-1.23-.73-1.77-1.14-.54-.42-.82-1.01-1.09-1.63-.24-.63-.41-1.32-.35-2.18l.24-.18ZM70.91 77.28c1.4.58 2.43 1.39 2.98 2.72.19.65.16 1.46.46 2.05.28.6.79 1.04 1.4 1.41 2.45 1.49 3.99 3.61 4.17 6.66l-.23.19a6.85 6.85 0 0 1-4.62-3.95c-.7-1.11-.56-2.81-1.52-3.77-.45-.49-1.22-.77-1.74-1.21-.53-.45-.79-1.08-1.01-1.72-.2-.66-.32-1.39-.14-2.24l.26-.14ZM130.45 63.63c2.95 8.32-2.14 21.24-6.35 28.63-12.87 23.3-40.01 33.3-65.36 26.84-4.67-1.38-9.93-2.73-13.29-6.46 3.94 2.8 9.07 3.34 13.74 4.06 24.3 3.06 47.9-5.7 61.61-26.49 3.98-5.91 7.28-12.45 9.07-19.40.54-2.34 1.05-4.76.58-7.16Z'/%3E%3C/svg%3E");
}

.sport-icon.NCAAF,
.sport-icon-small.NCAAF {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 176 176'%3E%3Cpath d='M45.45 112.63c-2.68-8.15 2.71-21.26 6.9-28.42 12.49-22.48 40.37-33.6 65.12-27.49 4.66 1.33 9.96 2.88 12.99 6.91-3.68-3.14-8.8-3.83-13.43-4.5-23.57-2.77-48.1 7.16-61.4 27.17-4.02 5.86-7.41 12.33-9.38 19.22-.6 2.31-1.22 4.72-.8 7.12Z'/%3E%3Cpath d='M45.45 112.63c-.23-6.13 9.79-17.32 14.18-21.6 15.64-15.21 36.29-25.61 57.94-28.63 3.27-.34 6.6-.57 9.87-.04 1.06.22 2.26.45 3.02 1.27-.93-.57-2.03-.54-3.07-.52-3.17.15-6.29.88-9.35 1.7-20.33 5.76-39.41 15.76-55.79 29.1-4.86 4.07-9.6 8.38-13.65 13.28-1.23 1.66-2.85 3.32-3.14 5.43Z'/%3E%3Cpath d='M78.56 71.69c1.4.58 2.43 1.39 2.98 2.72.19.65.16 1.46.46 2.05.28.6.79 1.04 1.4 1.41 2.45 1.49 3.99 3.61 4.17 6.66l-.23.19a6.85 6.85 0 0 1-4.62-3.95c-.7-1.11-.56-2.81-1.52-3.77-.45-.49-1.22-.77-1.74-1.21-.53-.45-.79-1.08-1.01-1.72-.2-.66-.32-1.39-.14-2.24l.26-.14ZM85.55 67.67c1.48.39 2.61 1.21 3.22 2.52.23.65.22 1.46.53 2.05.29.6.81 1.03 1.42 1.41 1.2.71 2.15 1.66 2.9 2.79.69 1.25 1.1 2.59.97 4.11l-.26.15c-1.49-.6-2.51-1.45-3.35-2.45-.77-1.09-1.33-2.30-1.6-3.65-.15-.7-.39-1.32-.86-1.79-.45-.48-1.23-.73-1.77-1.14-.54-.42-.82-1.01-1.09-1.63-.24-.63-.41-1.32-.35-2.18l.24-.18ZM70.91 77.28c1.4.58 2.43 1.39 2.98 2.72.19.65.16 1.46.46 2.05.28.6.79 1.04 1.4 1.41 2.45 1.49 3.99 3.61 4.17 6.66l-.23.19a6.85 6.85 0 0 1-4.62-3.95c-.7-1.11-.56-2.81-1.52-3.77-.45-.49-1.22-.77-1.74-1.21-.53-.45-.79-1.08-1.01-1.72-.2-.66-.32-1.39-.14-2.24l.26-.14ZM130.45 63.63c2.95 8.32-2.14 21.24-6.35 28.63-12.87 23.3-40.01 33.3-65.36 26.84-4.67-1.38-9.93-2.73-13.29-6.46 3.94 2.8 9.07 3.34 13.74 4.06 24.3 3.06 47.9-5.7 61.61-26.49 3.98-5.91 7.28-12.45 9.07-19.40.54-2.34 1.05-4.76.58-7.16Z'/%3E%3C/svg%3E");
}

.sport-icon.BOXING,
.sport-icon-small.BOXING,
.marquee-item .sport-icon-small.BOXING,
.sport-icon.MMA,
.sport-icon-small.MMA,
.marquee-item .sport-icon-small.MMA {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 176 176'%3E%3Cpath d='M45.45 112.63c-2.68-8.15 2.71-21.26 6.9-28.42 12.49-22.48 40.37-33.6 65.12-27.49 4.66 1.33 9.96 2.88 12.99 6.91-3.68-3.14-8.8-3.83-13.43-4.5-23.57-2.77-48.1 7.16-61.4 27.17-4.02 5.86-7.41 12.33-9.38 19.22-.6 2.31-1.22 4.72-.8 7.12Z'/%3E%3Cpath d='M45.45 112.63c-.23-6.13 9.79-17.32 14.18-21.6 15.64-15.21 36.29-25.61 57.94-28.63 3.27-.34 6.6-.57 9.87-.04 1.06.22 2.26.45 3.02 1.27-.93-.57-2.03-.54-3.07-.52-3.17.15-6.29.88-9.35 1.7-20.33 5.76-39.41 15.76-55.79 29.1-4.86 4.07-9.6 8.38-13.65 13.28-1.23 1.66-2.85 3.32-3.14 5.43Z'/%3E%3Cpath d='M78.56 71.69c1.4.58 2.43 1.39 2.98 2.72.19.65.16 1.46.46 2.05.28.6.79 1.04 1.4 1.41 2.45 1.49 3.99 3.61 4.17 6.66l-.23.19a6.85 6.85 0 0 1-4.62-3.95c-.7-1.11-.56-2.81-1.52-3.77-.45-.49-1.22-.77-1.74-1.21-.53-.45-.79-1.08-1.01-1.72-.2-.66-.32-1.39-.14-2.24l.26-.14ZM85.55 67.67c1.48.39 2.61 1.21 3.22 2.52.23.65.22 1.46.53 2.05.29.6.81 1.03 1.42 1.41 1.2.71 2.15 1.66 2.9 2.79.69 1.25 1.1 2.59.97 4.11l-.26.15c-1.49-.6-2.51-1.45-3.35-2.45-.77-1.09-1.33-2.3-1.6-3.65-.15-.7-.39-1.32-.86-1.79-.45-.48-1.23-.73-1.77-1.14-.54-.42-.82-1.01-1.09-1.63-.24-.63-.41-1.32-.35-2.18l.24-.18ZM70.91 77.28c1.4.58 2.43 1.39 2.98 2.72.19.65.16 1.46.46 2.05.28.6.79 1.04 1.4 1.41 2.45 1.49 3.99 3.61 4.17 6.66l-.23.19a6.85 6.85 0 0 1-4.62-3.95c-.7-1.11-.56-2.81-1.52-3.77-.45-.49-1.22-.77-1.74-1.21-.53-.45-.79-1.08-1.01-1.72-.2-.66-.32-1.39-.14-2.24l.26-.14ZM130.45 63.63c2.95 8.32-2.14 21.24-6.35 28.63-12.87 23.3-40.01 33.3-65.36 26.84-4.67-1.38-9.93-2.73-13.29-6.46 3.94 2.8 9.07 3.34 13.74 4.06 24.3 3.06 47.9-5.7 61.61-26.49 3.98-5.91 7.28-12.45 9.07-19.40.54-2.34 1.05-4.76.58-7.16Z'/%3E%3C/svg%3E");
}

/* Sort Controls */
.sort-controls {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.sort-controls label {
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.95rem;
    font-weight: 600;
}

.sort-select {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    padding: 0.5rem 1rem;
    color: var(--bma-white);
    font-size: 0.95rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

.sort-select:hover {
    background: rgba(255, 255, 255, 0.08);
    border-color: var(--bma-green);
}

.sort-select:focus {
    outline: none;
    border-color: var(--bma-green-bright);
    box-shadow: 0 0 0 3px rgba(0, 230, 118, 0.1);
}

/* Tournament Grid */
.tournament-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 2rem;
}

.tournament-card-full {
    background: linear-gradient(135deg, rgba(46, 139, 87, 0.08) 0%, rgba(10, 10, 10, 0.6) 100%);
    border: 2px solid rgba(255, 255, 255, 0.05);
    border-radius: 16px;
    padding: 1.5rem;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    position: relative;
    overflow: hidden;
}

.tournament-card-full:hover {
    transform: translateY(-8px);
    border-color: var(--bma-green);
    box-shadow: 0 12px 40px rgba(0, 230, 118, 0.15);
}

.tournament-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.sport-badge-large {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: rgba(0, 230, 118, 0.1);
    border: 1px solid rgba(0, 230, 118, 0.3);
    border-radius: 8px;
    padding: 0.4rem 0.8rem;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--bma-green-bright);
}

.status-badge {
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0.3rem 0.7rem;
    border-radius: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.status-live {
    background: rgba(46, 139, 87, 0.2);
    color: var(--bma-green-bright);
    animation: pulse 2s ease-in-out infinite;
}

.status-upcoming {
    background: rgba(255, 215, 0, 0.2);
    color: var(--bma-yellow);
}

.status-completed {
    background: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.5);
}

.tournament-title {
    font-size: 1.3rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    color: var(--bma-white);
}

.tournament-desc {
    font-size: 0.95rem;
    color: rgba(255, 255, 255, 0.6);
    margin-bottom: 1rem;
    line-height: 1.5;
}

.tournament-meta {
    display: flex;
    gap: 1.5rem;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.meta-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.9rem;
}

.meta-item svg {
    color: var(--bma-green);
}

.tournament-time-detail {
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.5);
    margin-bottom: 1rem;
}

.tournament-card-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}

.entry-badge {
    background: var(--gradient-primary);
    border-radius: 6px;
    padding: 0.4rem 0.8rem;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--bma-white);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.btn-small {
    padding: 0.6rem 1.2rem;
    font-size: 0.9rem;
}

/* Empty State */
.tournaments-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
}

.empty-icon {
    color: rgba(255, 255, 255, 0.2);
    margin-bottom: 1.5rem;
}

.tournaments-empty h3 {
    font-size: 1.5rem;
    color: var(--bma-white);
    margin-bottom: 0.5rem;
}

.tournaments-empty p {
    color: rgba(255, 255, 255, 0.5);
    max-width: 400px;
}

/* Responsive */
@media (max-width: 768px) {
    .tournaments-header h1 {
        font-size: 2.2rem;
    }

    .tournaments-lead {
        font-size: 1rem;
    }

    .tournaments-controls {
        padding: 1.5rem;
    }

    .filter-tabs {
        gap: 0.75rem;
    }

    .filter-tab {
        padding: 0.6rem 1rem;
        font-size: 0.9rem;
    }

    .sport-filters {
        gap: 0.5rem;
    }

    .sport-pill {
        padding: 0.4rem 0.8rem;
        font-size: 0.85rem;
    }

    .tournament-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .sort-controls {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .sort-select {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .breadcrumb {
        padding: 0.75rem 0;
    }

    .breadcrumb-item {
        font-size: 0.8rem;
    }

    .tournaments-header .section-logo {
        height: 50px;
    }

    .tournaments-header h1 {
        font-size: 1.8rem;
    }

    .filter-tabs {
        flex-direction: column;
    }

    .filter-tab {
        width: 100%;
        justify-content: center;
    }

    .tournament-card-full {
        padding: 1.25rem;
    }

    .tournament-title {
        font-size: 1.1rem;
    }
}

/* ===== PHASE 1: CRITICAL MOBILE FIXES ===== */

/* Tablet and Below - 768px */
@media (max-width: 768px) {
    /* CRITICAL: Fix Marquee Horizontal Scroll */
    .marquee-promo {
        min-width: 0 !important;
        width: auto !important;
        flex: 0 0 auto;
        padding: 0 0.3rem 0 0.5rem !important;
        border-right: none;
    }

    .marquee-promo-text {
        font-size: 0.72rem;
    }

    
    .marquee-track {
        padding: 0 0.75rem;
        -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 20px, #000 100%);
        mask-image: linear-gradient(90deg, transparent 0, #000 20px, #000 100%);
    }

    /* Unified mobile spacing and headings */
    section {
        padding: 3rem 0 !important;
    }

    .section-header {
        margin-bottom: 2.25rem;
    }

    .section-header h2 {
        font-size: clamp(2rem, 7vw, 3rem);
        line-height: 1.05;
    }

    .section-header p {
        font-size: 0.95rem;
        line-height: 1.6;
        margin-top: 0.75rem;
    }
    
    .marquee-logo {
        height: 22px;
        width: auto;
    }
    
    
    /* CRITICAL: Hero Section Mobile Layout - nav floats over hero */
    .hero {
        min-height: auto;
        height: auto;
        padding-top: calc(var(--hero-marquee-height) + 44px + 0.25rem);
        padding-bottom: clamp(3.5rem, 8vw, 5rem);
    }
    
    .hero-content {
        grid-template-columns: 1fr;
        gap: 3rem;
    }
    
    .hero h1 {
        line-height: 1.1;
        font-size: clamp(3rem, 18vw, 5rem) !important;
        width: 100%;
        max-width: 100%;
        padding: 0 0.5rem;
    }
    
    .hero-left {
        text-align: center;
    }
    
    .hero-ctas {
        margin-bottom: 0;
    }
    
    .hero-left {
        order: 1;
    }

    /* Device stack hidden on mobile */
    .hero .laptop-mockup {
        max-width: min(320px, 50vw);
    }

    .hero .phone-mockup {
        position: absolute !important;
        width: min(150px, 30vw);
        bottom: 0;
        right: 0;
    }
    
    /* CRITICAL: Tournament Card Grid Collapse */
    .tournament-item {
        grid-template-columns: 1fr;
        gap: 1.5rem;
        padding: 1.75rem;
        border-radius: 20px;
    }

    .tournament-time {
        text-align: left;
        display: flex;
        flex-wrap: wrap;
        gap: 0.5rem;
        align-items: center;
    }

    .time-badge {
        display: inline-block;
        margin-right: 0;
        font-size: 0.8rem;
        padding: 0.6rem 1rem;
    }

    .tournament-info h3 {
        font-size: 1.4rem;
        margin-bottom: 0.75rem;
        line-height: 1.3;
    }

    .tournament-info p {
        font-size: 0.95rem;
        line-height: 1.6;
    }

    .tournament-stats {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
        background: rgba(46, 139, 87, 0.08);
        padding: 1rem;
        border-radius: 12px;
    }

    .stat-item {
        text-align: center;
    }

    .stat-item .label {
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        color: rgba(255, 255, 255, 0.6);
        margin-bottom: 0.25rem;
    }

    .stat-item .value {
        font-size: 1.1rem;
        font-weight: 700;
        color: var(--bma-green-bright);
    }

    .tournament-action {
        width: 100%;
    }

    .tournament-action .btn {
        width: 100%;
        display: block;
        text-align: center;
        padding: 0.85rem 1.5rem;
        font-size: 0.95rem;
        min-height: 44px;
    }
    
    /* Tournament Types Grid - Stack Vertically */
    .tournament-types {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        grid-auto-flow: row;
        gap: 1rem;
    }

    .tournament-type-card {
        padding: 1.5rem 1rem;
        width: 100%;
    }
    
    /* Mechanics Grid */
    .mechanics-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    /* Benefits Section */
    .benefits-content {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .benefits-left {
        text-align: center;
    }
    
    .benefits-right {
        order: -1;
    }
    
    .benefits-logo {
        max-width: 200px;
    }
    
    /* Final CTA */
    .final-cta-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .final-cta-left {
        order: 2;
    }
    
    .final-cta-right {
        order: 1;
        text-align: center;
    }
}

/* Small Mobile - 480px */
@media (max-width: 480px) {
    /* CRITICAL: Marquee Further Optimization */
    .marquee-promo {
        min-width: 0 !important;
        width: auto !important;
        flex: 0 0 auto;
        padding: 0 0.2rem 0 0.4rem !important;
        border-right: none;
    }

    .marquee-promo-text {
        font-size: 0.68rem;
    }
    
    .marquee-track {
        padding: 0 0.5rem;
        -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 16px, #000 100%);
        mask-image: linear-gradient(90deg, transparent 0, #000 16px, #000 100%);
        gap: 2.5rem;
    }

    /* Unified small mobile spacing and headings */
    section {
        padding: 2.5rem 0 !important;
    }

    .section-header {
        margin-bottom: 2rem;
    }

    .section-header h2 {
        font-size: clamp(1.8rem, 8vw, 2.6rem);
        line-height: 1.05;
    }

    .section-header p {
        font-size: 0.9rem;
        line-height: 1.6;
        margin-top: 0.65rem;
    }
    
    .marquee-tournament {
        font-size: 0.75rem;
    }
    
    .marquee-status {
        font-size: 0.52rem;
        padding: 0.2rem 0.5rem;
    }
    
    /* CRITICAL: Navigation Mobile Optimization */
    nav {
        border-radius: 30px;
        padding: 0.75rem 1.25rem;
        gap: 0.5rem;
    }

    .logo {
        flex: 1;
        display: flex;
        justify-content: center;
    }

    .logo-image {
        height: 120px;
        width: auto;
        max-width: 180px;
        margin-top: 0;
        margin-bottom: 0;
    }
    
    .menu-toggle {
        min-width: 44px;
        min-height: 44px;
        /* font-size: 1.25rem; -- Removed to prevent text display */
    }
    
    /* CRITICAL: Hero Further Scaling */
    .hero {
        min-height: auto;
        padding-top: calc(var(--hero-marquee-height) + 44px + 0.25rem);
        padding-bottom: clamp(2rem, 5vw, 3rem);
    }
    
    /* Hero h1 and lead use clamp() in base */
    
    .beta-badge {
        font-size: 0.7rem;
        padding: 0.6rem 1.2rem;
    }
    
    .hero-offer {
        padding: 1rem;
    }
    
    .offer-text {
        font-size: 0.85rem;
    }
    
    /* CRITICAL: Tournament Stats Single Column */
    .tournament-item {
        padding: 1.25rem;
    }
    
    .tournament-info h3 {
        font-size: 1.1rem;
    }
    
    .tournament-stats {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }
    
    .stat-item {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    
    /* Tournament Types Single Column */
    .tournament-types {
        grid-template-columns: 1fr;
    }
    
    /* Bet Types Stack Vertically */
    .bet-types {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0.5rem;
    }

    .bet-type-label {
        display: block;
        text-align: center;
    }

    .bet-type-separator {
        display: none;
    }
    
    /* Phone Mockups - global (How to Compete, etc.) */
    .phone-mockup {
        max-width: 180px;
    }
    
    /* Hero devices - scale down, stay overlayed */
    .hero .laptop-mockup {
        max-width: min(280px, 55vw);
    }
    .hero .phone-mockup {
        position: absolute !important;
        width: min(130px, 28vw);
        bottom: 0;
        right: 0;
    }
    
    /* Benefits Mobile */
    .benefit-item {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    
    .benefit-icon {
        margin-bottom: 0.75rem;
    }
    
    .benefits-logo {
        max-width: 160px;
    }
}


/* ===== PHASE 2: HIGH PRIORITY UX IMPROVEMENTS ===== */

/* Touch Interactions - All Breakpoints */
@media (max-width: 1024px) {
    /* Add active states for touch devices */
    .btn:active,
    .sport-pill:active,
    .filter-tab:active,
    .tournament-type-card:active,
    .sport-card:active {
        transform: scale(0.98);
        opacity: 0.9;
    }
    
    /* Ensure all interactive elements have minimum touch target */
    .btn,
    .sport-pill,
    .filter-tab,
    .menu-toggle {
        min-height: 44px;
        min-width: 44px;
    }
    
    /* Remove hover-only effects that don't work on touch */
    .tournament-type-card:hover,
    .sport-card:hover {
        transform: none;
    }
    
    /* Add touch-friendly spacing */
    .sport-pills {
        gap: 0.75rem;
    }
}

/* Tablet - Additional Typography and Layout */
@media (max-width: 768px) {
    /* Typography Scaling */
    h2 {
        font-size: 2rem !important;
    }
    
    h3 {
        font-size: 1.5rem !important;
    }
    
    .section-header h2 {
        font-size: clamp(2.25rem, 8vw, 3.5rem) !important;
        line-height: 0.9 !important;
    }

    .section-header p {
        font-size: clamp(0.9rem, 1.5vw, 1.1rem);
    }
    
    /* Sport Filter Horizontal Scroll */
    .sport-filters {
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x mandatory;
        padding-bottom: 0.5rem;
        scrollbar-width: none; /* Firefox */
        -ms-overflow-style: none;  /* IE and Edge */
    }
    
    .sport-filters::-webkit-scrollbar {
        display: none; /* Chrome, Safari, Opera */
    }
    
    .sport-pill {
        flex-shrink: 0;
        scroll-snap-align: start;
    }
    
    /* Filter Tabs Responsive */
    .filter-tabs {
        flex-wrap: wrap;
        gap: 0.5rem;
    }
    
    .filter-tab {
        padding: 0.6rem 1rem;
        font-size: 0.85rem;
        flex: 1 1 auto;
        min-width: 140px;
    }
    
    /* Sort Controls */
    .sort-controls {
        flex-direction: column;
        align-items: stretch;
        gap: 0.5rem;
    }
    
    .sort-select {
        width: 100%;
    }
    
    /* Platform Previews */
    .platform-previews {
        gap: 3rem;
    }
    
    .preview-title {
        font-size: 1.5rem;
    }
    
    .preview-description {
        font-size: 0.95rem;
    }
    
    .phone-mockup {
        max-width: 220px;
    }
    
    /* Sport Icons */
    .sport-icon {
        width: 48px;
        height: 48px;
    }
    
    .sport-card h3 {
        font-size: 0.95rem;
    }
}

/* Small Mobile - Additional Refinements */
@media (max-width: 480px) {
    /* Further Typography Scaling */
    h2 {
        font-size: 1.5rem !important;
    }
    
    h3 {
        font-size: 1.2rem !important;
    }
    
    .section-header h2 {
        font-size: clamp(1.5rem, 4.5vw, 2rem) !important;
    }
    
    /* Filter Tabs Full Width */
    .filter-tabs {
        flex-direction: column;
    }
    
    .filter-tab {
        width: 100%;
        min-width: auto;
    }
    
    .sport-pill {
        font-size: 0.8rem;
        padding: 0.5rem 0.75rem;
    }
    
    /* Platform Previews */
    .platform-previews {
        gap: 2rem;
    }
    
    /* Sport Icons Further Scaling */
    .sport-icon {
        width: 40px;
        height: 40px;
    }
    
    .sport-card h3 {
        font-size: 0.85rem;
    }
    
    .category-label {
        font-size: 0.8rem;
    }
    
    /* Laptop Mockup */
    .laptop-mockup {
        max-width: 250px;
    }
    
    .final-cta .phone-mockup {
        max-width: 120px;
    }
    
    .cta-content h2 {
        font-size: 1.5rem;
    }
    
    .cta-content p {
        font-size: 0.9rem;
    }
}


/* ===== PHASE 3: CRITICAL LAYOUT FIXES ===== */

/* All Breakpoints - Fix Footer Logo */
@media (max-width: 768px) {
    /* CRITICAL FIX #3: Footer Logo Sizing */
    .footer-logo {
        height: 180px;
        max-width: 280px;
    }
    
    /* CRITICAL FIX #4: Standardize Section Padding */
    .hero,
    .product-showcase,
    .product-showcase-sports,
    .how-it-works,
    .live-tournaments,
    .beta-benefits,
    .final-cta {
        padding: 2.5rem 0 !important;
    }
    
    /* CRITICAL FIX #5: Hero Offer Box Mobile */
    .hero-offer {
        padding: 1rem;
    }
    
    .offer-text {
        font-size: 0.85rem;
    }
    
    .offer-badge {
        font-size: 0.7rem;
    }
    
    /* HIGH PRIORITY #6: Platform Preview Negative Margins */
    .preview-center,
    .preview-right {
        margin-top: 0 !important;
    }
    
    .preview-item {
        text-align: center;
    }
    
    /* HIGH PRIORITY #9: Mechanics Steps */
    .mechanics-step {
        gap: 1.25rem;
    }
    
    .step-number {
        width: 40px;
        height: 40px;
        font-size: 1.25rem;
    }
    
    /* MEDIUM PRIORITY #13: Section Headers */
    .section-logo {
        height: 120px !important;
        width: 120px !important;
    }
    
    /* HIGH PRIORITY #11: Breadcrumb */
    .breadcrumb {
        padding: 0.75rem 0;
    }
    
    .breadcrumb-item {
        font-size: 0.85rem;
    }
}

@media (max-width: 480px) {
    /* CRITICAL FIX #3: Footer Logo Further Reduction */
    .footer-logo {
        height: 120px;
        max-width: 200px;
    }
    
    /* CRITICAL FIX #4: Section Padding Tighter */
    .hero,
    .product-showcase,
    .product-showcase-sports,
    .how-it-works,
    .live-tournaments,
    .beta-benefits,
    .final-cta {
        padding: 2rem 0 !important;
    }
    
    /* CRITICAL FIX #5: Hero Offer Box Smaller */
    .hero-offer {
        padding: 0.75rem;
    }
    
    .offer-text {
        font-size: 0.8rem;
    }
    
    .hero-offer-link {
        font-size: 0.85rem;
    }
    
    /* HIGH PRIORITY #7: Tournament Stats Keep 2 Columns */
    .tournament-stats {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 0.75rem;
    }
    
    .stat-item {
        background: rgba(46, 139, 87, 0.1);
        padding: 0.5rem;
        border-radius: 8px;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0.25rem;
    }
    
    .stat-label {
        font-size: 0.75rem;
    }
    
    .stat-value {
        font-size: 1rem;
        font-weight: 600;
    }
    
    /* HIGH PRIORITY #8: Mechanics Steps Smaller */
    .mechanics-step {
        gap: 1rem;
    }
    
    .step-number {
        width: 36px;
        height: 36px;
        font-size: 1.1rem;
    }
    
    /* HIGH PRIORITY #9: Benefits Optimization */
    .benefit-icon svg {
        width: 32px;
        height: 32px;
    }
    
    .benefit-item {
        margin-bottom: 1.5rem;
    }
    
    /* HIGH PRIORITY #10: View All CTA */
    .view-all-cta {
        margin: 2rem 0;
    }
    
    .view-all-cta .btn {
        padding: 0.75rem 1.5rem;
    }
    
    /* HIGH PRIORITY #11: Breadcrumb Further Reduction */
    .breadcrumb-item {
        font-size: 0.8rem;
    }
    
    .breadcrumb .icon {
        width: 14px;
        height: 14px;
    }
    
    /* HIGH PRIORITY #12: Sport Filter Visual Indicators */
    .sport-filters {
        position: relative;
    }
    
    .sport-filters::before,
    .sport-filters::after {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        width: 2rem;
        pointer-events: none;
        z-index: 1;
    }
    
    .sport-filters::before {
        left: 0;
        background: linear-gradient(to right, var(--bma-dark-100), transparent);
    }
    
    .sport-filters::after {
        right: 0;
        background: linear-gradient(to left, var(--bma-dark-100), transparent);
    }
    
    .sport-pill {
        min-height: 44px;
        display: flex;
        align-items: center;
    }
    
    /* MEDIUM PRIORITY #14: Tournament Type Cards */
    .tournament-type-card {
        padding: 1.25rem 1rem;
    }
    
    .tournament-type-card svg {
        width: 36px;
        height: 36px;
    }
    
    /* MEDIUM PRIORITY #15: Bet Types Visual Separation */
    .bet-type-label {
        background: rgba(46, 139, 87, 0.15);
        padding: 0.4rem 0.8rem;
        border-radius: 20px;
    }
    
    .bet-types {
        gap: 0.75rem;
        text-align: center;
    }
    
    /* MEDIUM PRIORITY #16: Mockup Cards */
    .tournament-mockup {
        max-width: 320px;
        margin: 0 auto;
    }
    
    .mockup-card {
        padding: 1.25rem;
    }
    
    .mockup-stats {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 0.75rem;
    }
    
    /* MEDIUM PRIORITY #17: Hero Offer Link Touch Target */
    .hero-offer-link {
        padding: 0.5rem 0;
        display: block;
        margin-top: 1rem;
        text-decoration-thickness: 3px;
    }
    
    /* MEDIUM PRIORITY #18: Final CTA Device Stack */
    .final-cta .phone-mockup {
        display: none;
    }
    
    .laptop-mockup {
        margin: 0 auto;
    }
    
    /* MEDIUM PRIORITY #19: Mobile Menu Spacing */
    .mobile-auth {
        display: flex;
        flex-direction: column;
        gap: 1rem;
        padding: 1.5rem;
    }
    
    .mobile-cta {
        width: 100%;
    }
    
    /* MEDIUM PRIORITY #20: Tournament Controls */
    .tournaments-controls {
        padding: 1.25rem;
    }
    
    /* LOW PRIORITY #21: Loading Spinner */
    .loading-spinner {
        transform: scale(0.8);
    }
    
    /* LOW PRIORITY #22: Empty State Icon */
    .empty-icon svg {
        width: 48px;
        height: 48px;
    }
    
    /* MEDIUM PRIORITY #13: Section Headers */
    .section-logo {
        height: 80px !important;
        width: 80px !important;
    }
}

/* 320px - Ultra Small Mobile (iPhone SE) */
@media (max-width: 380px) {
    /* CRITICAL FIX #2: Container Padding at 320px */
    .container {
        padding: 0 1rem !important;
    }
    
    /* CRITICAL FIX #3: Footer Logo Smallest */
    .footer-logo {
        height: 100px;
        max-width: 160px;
    }
    
    /* CRITICAL FIX #4: Section Padding Minimal */
    .hero,
    .product-showcase,
    .product-showcase-sports,
    .how-it-works,
    .live-tournaments,
    .beta-benefits,
    .final-cta {
        padding: 1.5rem 0 !important;
    }

    /* Hero top padding for marquee + header at 380px - tighter on mobile */
    .hero {
        padding-top: calc(var(--hero-marquee-height) + 44px + 0.25rem) !important;
    }
    
    /* CRITICAL FIX #5: Hero Offer Box Tightest */
    .hero-offer {
        padding: 0.6rem;
    }
    
    .offer-text {
        font-size: 0.75rem;
    }
    
    /* HIGH PRIORITY #7: Tournament Stats Single Column at 320px */
    .tournament-stats {
        grid-template-columns: 1fr !important;
    }
    
    /* HIGH PRIORITY #8: Mechanics Steps Stack */
    .mechanics-step {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 0.75rem;
    }
    
    .step-number {
        width: 32px;
        height: 32px;
        font-size: 1rem;
    }
    
    /* HIGH PRIORITY #9: Benefits Smallest Icons */
    .benefit-icon svg {
        width: 28px;
        height: 28px;
    }
    
    .benefits-logo {
        max-width: 140px !important;
    }
    
    /* HIGH PRIORITY #10: View All CTA Full Width */
    .view-all-cta .btn {
        width: 100%;
        display: block;
    }
    
    /* HIGH PRIORITY #11: Breadcrumb Smallest */
    .breadcrumb-item {
        font-size: 0.75rem;
    }
    
    .breadcrumb .icon {
        width: 12px;
        height: 12px;
    }
    
    /* MEDIUM PRIORITY #13: Section Headers Smallest */
    .section-header h2 {
        font-size: clamp(1.25rem, 4vw, 1.75rem) !important;
    }

    .section-header p {
        font-size: clamp(0.85rem, 1.2vw, 1rem);
    }
    
    .section-logo {
        height: 60px !important;
        width: 60px !important;
    }
    
    /* MEDIUM PRIORITY #14: Tournament Type Cards Single Column */
    .tournament-types {
        grid-template-columns: 1fr !important;
    }
    
    .tournament-type-card {
        padding: 1rem 0.75rem;
    }
    
    .tournament-type-card svg {
        width: 32px;
        height: 32px;
    }
    
    /* LOW PRIORITY #20: Tournament Controls Tighter */
    .tournaments-controls {
        padding: 1rem;
    }
    
    /* LOW PRIORITY #21: Loading Spinner Smaller */
    .loading-spinner {
        transform: scale(0.7);
    }
    
    /* LOW PRIORITY #22: Empty State Icon Smaller */
    .empty-icon svg {
        width: 40px;
        height: 40px;
    }
    
    /* LOW PRIORITY #23: Category Labels */
    .category-label {
        font-size: 0.75rem !important;
    }
    
    /* Hero h1 - largest on smallest viewport */
    .hero h1 {
        font-size: clamp(3rem, 22vw, 4.5rem) !important;
    }

    /* Hero devices - smallest viewport, stay overlayed */
    .hero .laptop-mockup {
        max-width: min(240px, 60vw);
    }
    .hero .phone-mockup {
        position: absolute !important;
        width: min(110px, 25vw);
        bottom: 0;
        right: 0;
    }
}

/* Landscape Orientation - Edge Case #26 */
@media (max-height: 500px) and (orientation: landscape) {
    .hero {
        min-height: 400px !important;
        padding: 3rem 0 2rem !important;
    }
    
    .hero h1 {
        font-size: 1.75rem !important;
    }
    
    .hero .laptop-mockup {
        max-width: 200px;
    }
    .hero .phone-mockup {
        position: absolute !important;
        width: 120px;
        bottom: 0;
        right: 0;
    }
    
    .tournament-marquee {
        position: relative !important;
    }
    
    header {
        position: relative !important;
    }
}

/* Intermediate Tablet Breakpoint - Edge Case #27 */
@media (min-width: 900px) and (max-width: 1024px) {
    .sport-grid {
        grid-template-columns: repeat(4, 1fr) !important;
    }
}


/* ===== CRITICAL FIX #4: Sport Grid Complete Responsive Coverage ===== */

@media (max-width: 768px) {
    /* Sport grid already handled - verify 3 columns */
    .sport-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 1rem;
    }
    
    .sport-card {
        padding: 1.25rem 0.75rem;
    }
    
    .sport-icon {
        width: 48px;
        height: 48px;
    }
    
    .sport-card h3 {
        font-size: 0.95rem;
    }
}

@media (max-width: 480px) {
    /* CRITICAL: 2 columns for better fit */
    .sport-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 0.75rem;
    }
    
    .sport-card {
        padding: 1rem 0.75rem;
    }
    
    .sport-icon {
        width: 40px;
        height: 40px;
    }
    
    .sport-card h3 {
        font-size: 0.85rem;
    }
}

@media (max-width: 380px) {
    /* CRITICAL: Single column for 320px screens */
    .sport-grid {
        grid-template-columns: 1fr !important;
        gap: 0.75rem;
        max-width: 300px;
        margin: 0 auto;
    }
    
    .sport-card {
        padding: 1rem;
    }
    
    .sport-icon {
        width: 48px;
        height: 48px;
    }
    
    .sport-card h3 {
        font-size: 0.95rem;
    }
}


/* ===== PERFORMANCE OPTIMIZATIONS ===== */

/* Reduce motion for accessibility and performance */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    
    .marquee-track {
        animation: none !important;
    }
    
    .hero-bg-image {
        animation: none !important;
    }
}

/* Optimize background images for mobile */
@media (max-width: 768px) {
    .hero-bg-image {
        background-size: cover;
        background-position: center;
    }
    
    /* Consider using smaller images or solid colors on mobile */
    .hero-bg {
        opacity: 0.5;
    }
}

/* Z-index management - Edge Case #28 */
.mobile-menu {
    z-index: 9999 !important;
}

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

header {
    z-index: 1000;
}

.tournament-marquee {
    z-index: 999;
}

/* Sticky header optimization on mobile */
@media (max-width: 768px) {
    header.scrolled {
        padding: 0.5rem 0.75rem;
    }
    
    header.scrolled nav {
        min-height: 50px;
    }
    
    header.scrolled .logo-image {
        height: 40px !important;
    }
}

/* Additional touch target verification */
@media (max-width: 768px) {
    /* Ensure all interactive elements meet 44x44px minimum */
    /* .btn, -- REMOVED: was overriding tournament button display */
    .sport-pill,
    .filter-tab,
    /* .tournament-action .btn, -- REMOVED to prevent inline-flex override */
    .app-store-button,
    .nav-links a,
    .mobile-nav-links a {
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
}

/* ========================================
   PAGINATION CONTROLS
   ======================================== */

.pagination-container {
    display: block;
    margin-top: 3rem;
    padding: 2rem 0;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.pagination-info {
    display: block;
    text-align: center;
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.95rem;
    margin-bottom: 1.5rem;
}

.pagination-info span {
    color: var(--bma-green-bright);
    font-weight: 600;
}

.pagination-controls {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.pagination-btn {
    background: rgba(46, 139, 87, 0.1);
    border: 1px solid rgba(46, 139, 87, 0.3);
    color: var(--bma-white);
    padding: 0.75rem 1rem;
    border-radius: 8px;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    min-width: 44px;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pagination-btn:hover:not(:disabled) {
    background: rgba(46, 139, 87, 0.2);
    border-color: var(--bma-green-bright);
    transform: translateY(-2px);
}

.pagination-btn:disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

.pagination-numbers {
    display: flex;
    gap: 0.25rem;
    align-items: center;
}

.page-number {
    min-width: 44px;
    min-height: 44px;
    padding: 0.75rem;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    color: rgba(255, 255, 255, 0.8);
    cursor: pointer;
    transition: all 0.3s ease;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
}

.page-number:hover {
    background: rgba(46, 139, 87, 0.2);
    border-color: var(--bma-green-bright);
    transform: translateY(-2px);
}

.page-number.active {
    background: var(--gradient-primary);
    border-color: var(--bma-green-bright);
    color: var(--bma-white);
    cursor: default;
    box-shadow: 0 0 20px rgba(0, 230, 118, 0.4);
}

.page-ellipsis {
    color: rgba(255, 255, 255, 0.5);
    padding: 0 0.5rem;
    user-select: none;
}

.pagination-settings {
    display: block;
    text-align: center;
    margin-top: 1.5rem;
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.9rem;
}

.pagination-settings label {
    margin-right: 0.5rem;
}

.pagination-settings select {
    margin: 0 0.5rem;
    padding: 0.5rem 0.75rem;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 6px;
    color: var(--bma-white);
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.pagination-settings select:hover {
    background: rgba(255, 255, 255, 0.08);
    border-color: var(--bma-green-bright);
}

.pagination-settings select:focus {
    outline: 2px solid var(--bma-green-bright);
    outline-offset: 2px;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .pagination-container {
        margin-top: 2rem;
        padding: 1.5rem 0;
    }

    .pagination-info {
        font-size: 0.85rem;
        margin-bottom: 1rem;
    }

    .pagination-btn {
        padding: 0.5rem 0.75rem;
        font-size: 0.85rem;
        min-width: 40px;
        min-height: 40px;
    }

    .pagination-btn:first-child,
    .pagination-btn:last-child {
        display: none; /* Hide First/Last on mobile */
    }

    .page-number {
        min-width: 40px;
        min-height: 40px;
        padding: 0.5rem;
        font-size: 0.9rem;
    }

    .pagination-settings {
        font-size: 0.85rem;
        margin-top: 1rem;
    }

    .pagination-settings select {
        padding: 0.4rem 0.6rem;
        font-size: 0.85rem;
    }
}

@media (max-width: 480px) {
    .pagination-controls {
        gap: 0.25rem;
    }

    .pagination-btn {
        padding: 0.4rem 0.6rem;
        font-size: 0.8rem;
    }

    .page-number {
        min-width: 36px;
        min-height: 36px;
        padding: 0.4rem;
        font-size: 0.85rem;
    }

    .page-ellipsis {
        padding: 0 0.25rem;
        font-size: 0.85rem;
    }
}

/* ============================================
COMPREHENSIVE MOBILE RESPONSIVENESS FIX
Priority: Homepage mobile experience improvements
RESET AND REBUILD APPROACH
============================================ */

/* Tablet breakpoint improvements */
@media (max-width: 768px) {
    /* Fix phone module overlapping issues - exclude hero device stack */
    .phone-mockup:not(.hero-device-phone) {
        position: relative !important;
        z-index: 1;
        max-width: 200px;
        margin: 2rem auto;
    }

    /* Prevent phone module overflow */
    .final-cta .phone-mockup {
        position: static !important;
        margin: 2rem auto 0;
        transform: none !important;
    }

    /* Hero phone module adjustments */
    .hero-phone-mockup {
        width: 280px;
        max-width: 90%;
        margin: 2rem auto;
    }

    /* Make headlines bolder and more impactful */
    .section-header h2 {
        font-size: clamp(2.5rem, 10vw, 4rem) !important;
        font-weight: 900 !important;
        line-height: 0.95 !important;
        letter-spacing: -0.04em !important;
        padding: 0 0.5rem !important;
        text-align: center;
        word-break: break-word;
    }

    .section-header h2 .accent,
    .section-header h2 .accent-yellow {
        display: inline !important;
        margin: 0 0.1em !important;
    }

    /* AUTHORITATIVE TOURNAMENT CARD MOBILE RESET */
    .live-tournaments .tournament-item {
        /* FORCE BLOCK LAYOUT - NOT GRID */
        display: block !important;
        grid-template-columns: none !important;
        grid-auto-columns: unset !important;
        gap: 0 !important;

        /* Mobile-optimized padding and styling */
        padding: 1.25rem !important;
        background: #1a1a1a !important;
        border: 2px solid rgba(46, 139, 87, 0.3) !important;
        border-radius: 12px !important;
    }

    /* Force ALL direct children to be block and full width */
    .live-tournaments .tournament-item > div {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        grid-column: unset !important;
    }

    /* Top section - badges and time in a row */
    .tournament-item .tournament-time {
        display: flex !important;
        flex-direction: row !important;
        justify-content: flex-start !important;
        align-items: center !important;
        gap: 0.5rem !important;
        margin-bottom: 1rem !important;
        text-align: left !important;
    }

    .tournament-item .tournament-sport-badge {
        order: 1 !important;
        margin: 0 !important;
    }

    .tournament-item .time-badge {
        order: 2 !important;
        margin: 0 !important;
    }

    .tournament-item .time-detail {
        order: 3 !important;
        margin: 0 !important;
        font-size: 0.75rem !important;
        opacity: 0.6 !important;
    }

    /* Info section */
    .tournament-item .tournament-info {
        margin-bottom: 1rem !important;
        padding: 0 !important;
        flex: unset !important;
    }

    .tournament-item .tournament-info h3 {
        font-size: 1.2rem !important;
        margin-bottom: 0.5rem !important;
    }

    .tournament-item .tournament-info p {
        font-size: 0.85rem !important;
        line-height: 1.4 !important;
    }

    /* Stats section */
    .tournament-item .tournament-stats {
        display: flex !important;
        justify-content: space-around !important;
        padding: 0.75rem 0 !important;
        margin-bottom: 0.75rem !important;
        border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    }

    .tournament-item .stat-item {
        text-align: center !important;
        flex: 1 !important;
    }

    .tournament-item .stat-item strong {
        display: block !important;
        font-size: 1.25rem !important;
        margin-bottom: 0.25rem !important;
    }

    .tournament-item .stat-item span {
        display: block !important;
        font-size: 0.7rem !important;
        opacity: 0.7 !important;
    }

    /* CTA Button - COMPLETE ARCHITECTURAL REBUILD */
    .tournament-item .tournament-action {
        padding: 0 !important;
        margin: 0 !important;
        width: 100% !important;
    }

    /* ABSOLUTE NUCLEAR - IF GRID WON'T DIE, SPAN ALL COLUMNS */
    body .live-tournaments .tournament-list .tournament-item .tournament-action {
        /* Force it to span all 4 grid columns */
        grid-column-start: 1 !important;
        grid-column-end: 5 !important;
        grid-row: 4 !important;

        /* Make it block and full width */
        display: block !important;
        width: 100% !important;
        max-width: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    body .live-tournaments .tournament-list .tournament-item .tournament-action a {
        display: block !important;
        width: 100% !important;
        max-width: none !important;
        padding: 0.875rem !important;
        margin: 0 !important;
        text-align: center !important;
        background: var(--bma-green) !important;
        color: white !important;
        border-radius: 8px !important;
        box-sizing: border-box !important;
    }

    /* Improve general spacing */
    section {
        padding: 3rem 0 !important;
    }

    .container {
        padding: 0 1rem !important;
    }
}

/* FORCE TOURNAMENT BUTTONS FULL WIDTH ON MOBILE */
@media (max-width: 768px) {
    .live-tournaments .tournament-item {
        display: flex !important;
        flex-direction: column !important;
        grid-template-columns: none !important;
    }

    .live-tournaments .tournament-item > div {
        width: 100% !important;
    }

    .live-tournaments .tournament-action {
        width: 100% !important;
        display: block !important;
    }

    .live-tournaments .tournament-action a {
        display: block !important;
        width: 100% !important;
    }
}

/* Mobile breakpoint enhancements */
@media (max-width: 480px) {
    /* Phone modules need more aggressive positioning fixes - exclude hero device stack */
    .phone-mockup:not(.hero-device-phone),
    .hero-phone-mockup {
        position: relative !important;
        z-index: 1 !important;
        max-width: 160px !important;
        margin: 1.5rem auto !important;
        transform: none !important;
    }

    /* Complete removal of overlapping phone in final CTA */
    .final-cta .phone-mockup {
        display: none !important;
    }

    /* Make headlines even more dramatic on small screens */
    .section-header h2 {
        font-size: clamp(2.2rem, 12vw, 3.5rem) !important;
        font-weight: 900 !important;
        line-height: 0.9 !important;
        letter-spacing: -0.05em !important;
        text-align: center !important;
        padding: 0 0.25rem !important;
        margin-bottom: 1rem !important;
    }

    .section-header h2 .accent,
    .section-header h2 .accent-yellow {
        font-size: 1.05em !important;
        display: block !important;
        margin: 0.1em 0 !important;
        transform: none !important;
    }

    /* Tournament cards ultra-compact mobile design */
    .tournament-list {
        display: flex !important;
        flex-direction: column !important;
        gap: 1rem !important;
    }

    .tournament-item {
        padding: 1rem !important;
        border-radius: 12px !important;
    }

    .tournament-time {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 0.5rem !important;
    }

    .time-badge {
        font-size: 0.65rem !important;
        padding: 0.25rem 0.5rem !important;
        letter-spacing: 0.5px !important;
    }

    .tournament-info h3 {
        font-size: 1.1rem !important;
        line-height: 1.2 !important;
    }

    .tournament-sport-badge {
        font-size: 0.65rem !important;
        padding: 0.2rem 0.5rem !important;
        margin-bottom: 0.5rem !important;
    }

    .tournament-stats {
        flex-direction: row !important;
        gap: 1.5rem !important;
    }

    .stat-item {
        text-align: center !important;
    }

    .stat-item strong {
        font-size: 1rem !important;
    }

    .stat-item span {
        font-size: 0.7rem !important;
    }

    /* Spacing improvements */
    section {
        padding: 2rem 0 !important;
    }

    .hero {
        padding: calc(48px + 44px + 0.25rem) 0 3rem !important;
    }

    .value-props {
        padding: 2rem 0 !important;
    }

    .how-to-play {
        padding: 2rem 0 !important;
    }

    /* Fix overlapping elements in hero */
    .hero-content {
        position: relative !important;
        z-index: 10 !important;
    }

    .hero-ctas {
        margin: 1.5rem 0 !important;
        gap: 0.75rem !important;
    }

    .hero-ctas .btn {
        padding: 0.75rem 1.5rem !important;
        font-size: 0.9rem !important;
        min-height: 44px;
    }


    .live-tournaments {
        background-attachment: scroll;
    }

    .final-cta {
        background-attachment: scroll;
    }
}

/* Ultra-small mobile adjustments */
@media (max-width: 375px) {
    /* Even more aggressive headline sizing */
    .section-header h2 {
        font-size: clamp(1.8rem, 11vw, 2.8rem) !important;
        padding: 0 0.2rem !important;
    }

    /* Tournament cards minimal padding */
    .tournament-item {
        padding: 0.875rem !important;
    }

    /* Smaller buttons */
    .btn {
        font-size: 0.85rem !important;
        padding: 0.65rem 1.25rem !important;
    }

    .marquee-promo {
        padding: 0 0.15rem 0 0.35rem !important;
    }

    .marquee-promo-text {
        font-size: 0.64rem;
    }

    .marquee-track {
        padding: 0 0.35rem;
        -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 12px, #000 100%);
        mask-image: linear-gradient(90deg, transparent 0, #000 12px, #000 100%);
    }
}




/* ============================================
FINAL CSS FIX - TOURNAMENT BUTTONS FULL WIDTH
This MUST be at the END of the file to override everything
============================================ */
@media (max-width: 768px) {
    /* Force tournament items to NOT be grid */
    section.live-tournaments .tournament-list .tournament-item {
        display: flex !important;
        flex-direction: column !important;
        grid-template-columns: none !important;
        grid-template-rows: none !important;
    }

    /* Force ALL children to be full width blocks */
    section.live-tournaments .tournament-list .tournament-item > * {
        display: block !important;
        width: 100% !important;
        grid-column: unset !important;
        grid-row: unset !important;
        margin: 0 !important;
        max-width: 100% !important;
    }

    /* Specific fix for tournament action */
    section.live-tournaments .tournament-list .tournament-item .tournament-action {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* Specific fix for the button */
    section.live-tournaments .tournament-list .tournament-item .tournament-action a {
        display: block !important;
        width: 100% !important;
        text-align: center !important;
        margin: 0 !important;
        max-width: none !important;
    }
}


/* Spacing for bet-types-display in how-it-works section */
.how-it-works .bet-types-display {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 2rem;
    margin-top: 1.5rem;
    flex-wrap: wrap;
}

.how-it-works .bet-type-label {
    font-size: 1.2rem;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.9);
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.how-it-works .bet-type-separator {
    color: var(--bma-green-bright);
    font-size: 1.5rem;
    font-weight: 900;
    margin: 0 1rem;
}

@media (max-width: 768px) {
    .how-it-works .bet-types-display {
        gap: 1rem;
    }
    
    .how-it-works .bet-type-separator {
        margin: 0 0.5rem;
        font-size: 1.2rem;
    }
    
    .how-it-works .bet-type-label {
        font-size: 0.9rem;
    }
}

/* ============================================
   TOURNAMENT STATE VISUAL SYSTEM
   Performance-optimized animations (GPU-accelerated)
   ============================================ */

/* GPU Acceleration - Performance Optimization */
@keyframes pulse-green {
    0%, 100% {
        transform: translateZ(0) scale(1);
        box-shadow: 0 0 25px rgba(0, 230, 118, 0.4), 0 0 50px rgba(0, 230, 118, 0.2);
    }
    50% {
        transform: translateZ(0) scale(1.04);
        box-shadow: 0 0 35px rgba(0, 230, 118, 0.7), 0 0 70px rgba(0, 230, 118, 0.4);
    }
}

@keyframes pulse-red {
    0%, 100% {
        transform: translateZ(0) scale(1);
        opacity: 1;
    }
    50% {
        transform: translateZ(0) scale(1.15);
        opacity: 0.7;
    }
}

@keyframes urgent-pulse {
    0%, 100% {
        transform: translateZ(0) scale(1);
        box-shadow: 0 0 30px rgba(220, 20, 60, 0.6), 0 0 60px rgba(220, 20, 60, 0.3);
    }
    50% {
        transform: translateZ(0) scale(1.05);
        box-shadow: 0 0 45px rgba(220, 20, 60, 0.9), 0 0 90px rgba(220, 20, 60, 0.5);
    }
}

@keyframes live-glow {
    0%, 100% {
        box-shadow: 0 0 20px rgba(220, 20, 60, 0.6), 0 0 40px rgba(220, 20, 60, 0.3), inset 0 0 10px rgba(255, 255, 255, 0.1);
    }
    50% {
        box-shadow: 0 0 30px rgba(220, 20, 60, 0.9), 0 0 60px rgba(220, 20, 60, 0.5), inset 0 0 15px rgba(255, 255, 255, 0.2);
    }
}

/* Dual Badge Container - INLINE LAYOUT */
.time-badge-dual {
    display: inline-flex !important;
    flex-direction: row !important;
    gap: 0.4rem;
    align-items: stretch;
    flex-wrap: nowrap;
    line-height: 1;
    height: 24px;
}

.time-badge-dual .time-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 24px !important;
    box-sizing: border-box !important;
    vertical-align: middle !important;
}

/* UPCOMING State - Countdown Badge with MASSIVE GLOW */
.time-badge.countdown {
    background: linear-gradient(135deg, var(--bma-green-bright) 0%, var(--bma-yellow) 100%);
    color: var(--bma-black);
    padding: 0.6rem 1.2rem;
    border-radius: 24px;
    font-size: 0.85rem;
    font-weight: 900;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    box-shadow: 0 0 25px rgba(0, 230, 118, 0.5), 0 0 50px rgba(0, 230, 118, 0.3);
    animation: pulse-green 2s ease-in-out infinite;
    will-change: transform, box-shadow;
    transform: translateZ(0);
    border: 2px solid rgba(255, 215, 0, 0.3);
}

/* Urgent Countdown (<3 hours) - INTENSE RED FLASH */
.time-badge.countdown.urgent-pulse {
    background: linear-gradient(135deg, #FF1744 0%, #DC143C 100%);
    color: var(--bma-white);
    animation: urgent-pulse 1.2s ease-in-out infinite;
    box-shadow: 0 0 30px rgba(220, 20, 60, 0.7), 0 0 60px rgba(220, 20, 60, 0.4);
    border: 2px solid rgba(255, 23, 68, 0.5);
}

/* LOCKED Badge - Compact, Subdued */
span.time-badge.locked,
.time-badge.locked {
    background: linear-gradient(135deg, rgba(100, 100, 100, 0.4) 0%, rgba(80, 80, 80, 0.3) 100%) !important;
    color: rgba(255, 255, 255, 0.85) !important;
    padding: 0 0.7rem !important;
    border-radius: 14px !important;
    font-size: 0.65rem !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    border: 1px solid rgba(255, 255, 255, 0.25) !important;
    text-transform: uppercase !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    line-height: 1 !important;
    height: 24px !important;
    align-self: center !important;
    position: relative !important;
    top: 0 !important;
    box-sizing: border-box !important;
    box-shadow: none !important;
    animation: none !important;
}

/* LIVE Badge with HUGE GLOW and Pulsing Dot */
span.time-badge.live,
.time-badge.live {
    background: linear-gradient(135deg, #FF1744 0%, #C62828 100%) !important;
    color: var(--bma-white) !important;
    padding: 0 0.7rem !important;
    border-radius: 14px !important;
    font-size: 0.65rem !important;
    font-weight: 800 !important;
    letter-spacing: 1px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
    gap: 0.35rem !important;
    text-transform: uppercase !important;
    animation: live-glow 1.5s ease-in-out infinite !important;
    will-change: box-shadow !important;
    transform: translateZ(0) !important;
    border: 1px solid rgba(255, 23, 68, 0.6) !important;
    height: 24px !important;
    align-self: center !important;
    position: relative !important;
    top: 0 !important;
    box-sizing: border-box !important;
}

/* Live Recording Dot - RED SOLID */
.live-dot {
    width: 8px;
    height: 8px;
    background: #FF0000;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    align-self: center;
    animation: pulse-red 1s ease-in-out infinite;
    will-change: transform, opacity;
    transform: translateZ(0);
    box-shadow: 0 0 8px rgba(255, 0, 0, 0.8), 0 0 12px rgba(255, 0, 0, 0.4);
}

/* Tournament Card State Classes - ENHANCED BORDERS */
.tournament-item.state-upcoming {
    border-color: rgba(0, 230, 118, 0.3);
    position: relative;
}

.tournament-item.state-upcoming::before {
    content: '';
    position: absolute;
    inset: -2px;
    background: linear-gradient(135deg, var(--bma-green-bright), var(--bma-yellow));
    border-radius: inherit;
    opacity: 0;
    transition: opacity 0.4s ease;
    z-index: -1;
    filter: blur(8px);
}

.tournament-item.state-upcoming:hover {
    border-color: var(--bma-green-bright);
    box-shadow: 0 20px 60px rgba(0, 230, 118, 0.4);
}

.tournament-item.state-upcoming:hover::before {
    opacity: 0.4;
}

.tournament-item.state-locked {
    border-color: rgba(220, 20, 60, 0.3);
    position: relative;
}

.tournament-item.state-locked::before {
    content: '';
    position: absolute;
    inset: -2px;
    background: linear-gradient(135deg, #FF1744, #C62828);
    border-radius: inherit;
    opacity: 0;
    transition: opacity 0.4s ease;
    z-index: -1;
    filter: blur(8px);
}

.tournament-item.state-locked:hover {
    border-color: var(--bma-red);
    box-shadow: 0 20px 60px rgba(220, 20, 60, 0.35);
}

.tournament-item.state-locked:hover::before {
    opacity: 0.3;
}

/* Button States */
.btn-secondary {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.08) 100%);
    color: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(255, 255, 255, 0.2);
    padding: 0.75rem 1.5rem;
    border-radius: 4px;
    font-weight: 700;
    font-size: 0.9rem;
    letter-spacing: 0.5px;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    text-transform: uppercase;
    cursor: pointer;
}

.btn-secondary:hover {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.25) 0%, rgba(255, 255, 255, 0.15) 100%);
    border-color: rgba(255, 255, 255, 0.4);
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
}

/* Respect User Motion Preferences - Performance */
@media (prefers-reduced-motion: reduce) {
    .time-badge.countdown,
    .time-badge.countdown.urgent-pulse,
    .live-dot {
        animation: none !important;
    }

    .tournament-item.state-upcoming:hover,
    .tournament-item.state-locked:hover,
    .btn-secondary:hover {
        transform: none !important;
    }
}

/* Mobile Optimizations */
@media (max-width: 768px) {
    .time-badge-dual {
        gap: 0.3rem;
    }

    .time-badge.countdown {
        font-size: 0.7rem;
        padding: 0.5rem 0.9rem;
    }

    .time-badge.locked,
    .time-badge.live {
        font-size: 0.6rem;
        padding: 0.3rem 0.6rem;
    }

    .live-dot {
        width: 8px;
        height: 8px;
    }

    /* Reduce glow intensity on mobile for performance */
    .time-badge.countdown {
        box-shadow: 0 0 15px rgba(0, 230, 118, 0.4);
    }

    .time-badge.countdown.urgent-pulse {
        box-shadow: 0 0 20px rgba(220, 20, 60, 0.5);
    }
}

/* ============================================
   COMPREHENSIVE RESPONSIVE DESIGN OVERHAUL
   Professional mobile-first responsive design
   ============================================ */

/* 1. FLUID TYPOGRAPHY SYSTEM
   Using clamp() for smooth scaling between breakpoints */

/* Reset base font sizes for proper scaling */
html {
    font-size: 16px; /* Base size for rem calculations */
}

body {
    font-size: clamp(0.875rem, 1vw + 0.75rem, 1rem); /* 14-16px */
    line-height: 1.6;
}

/* Heading scales with proper mobile sizing */
h1, .hero h1 {
    font-size: clamp(1.75rem, 5vw + 1rem, 4.5rem) !important; /* 28-72px */
    line-height: 1.1;
    letter-spacing: -0.02em;
    word-wrap: break-word;
}

h2, .section-header h2 {
    font-size: clamp(1.75rem, 4vw + 0.5rem, 3.5rem) !important; /* 28-56px */
    line-height: 1.2;
    word-wrap: break-word;
}

h3 {
    font-size: clamp(1.25rem, 3vw + 0.25rem, 2.5rem) !important; /* 20-40px */
    line-height: 1.3;
}

h4 {
    font-size: clamp(1.125rem, 2vw + 0.5rem, 1.75rem) !important; /* 18-28px */
}

/* Lead text and descriptions */
.hero-lead, .lead {
    font-size: clamp(1rem, 1.5vw + 0.5rem, 1.375rem) !important; /* 16-22px */
    line-height: 1.6;
}

/* 2. CONTAINER AND SPACING SYSTEM */

.container {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 clamp(1rem, 4vw, 3rem); /* 16-48px padding */
}

/* Section padding scales with viewport */
section {
    padding: clamp(3rem, 8vw, 6rem) 0; /* 48-96px vertical padding */
}

.hero {
    padding-top: calc(var(--hero-marquee-height) + var(--hero-header-height) + clamp(0.75rem, 2vw, 2rem));
    padding-bottom: clamp(3rem, 8vw, 6rem);
}

/* 3. MOBILE-FIRST BREAKPOINTS */

/* Small phones (320-480px) */
@media (max-width: 480px) {
    /* Navigation fixes */
    nav {
        padding: 0.75rem 1rem !important;
        border-radius: 16px !important;
    }

    .nav-links {
        display: none; /* Should be hamburger menu */
    }

    /* Hero section */
    .hero {
        padding-top: calc(var(--hero-marquee-height) + 44px + 0.25rem);
        padding-bottom: 2rem;
    }

    .hero h1 {
        margin-bottom: 1rem;
        font-size: clamp(3.25rem, 20vw, 5rem) !important;
        width: 100%;
        padding: 0 0.5rem;
    }

    .hero h1 .tm {
        display: block;
        margin-top: 0.5rem;
        font-size: 1rem !important;
    }

    .hero-ctas {
        margin-bottom: 0;
    }

    .hero-content {
        gap: 3rem;
    }

    /* Buttons and CTAs */
    .btn, .cta-button {
        width: 100%;
        padding: 1rem 1.5rem !important;
        font-size: 1rem !important;
        margin-bottom: 0.75rem;
    }

    .hero-ctas {
        flex-direction: column;
        gap: 0.75rem;
        max-width: 280px;
        margin-left: auto;
        margin-right: auto;
        width: 100%;
    }

    .hero-ctas .btn {
        min-height: 44px;
    }

    /* Cards stack vertically */
    .value-grid,
    .tournament-grid,
    .how-grid {
        grid-template-columns: 1fr !important;
        gap: 1.5rem !important;
    }

    /* Tournament cards */
    .tournament-card {
        padding: 1.5rem 1rem !important;
        min-height: auto !important;
    }

    /* Badges and pills */
    .badge {
        font-size: 0.625rem !important;
        padding: 0.25rem 0.5rem !important;
        letter-spacing: 1px !important;
    }

    /* Tables - make scrollable */
    .tabulator-table-holder {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    .tabulator {
        min-width: 600px; /* Force horizontal scroll */
    }

    /* Table cells smaller */
    .tabulator-cell {
        padding: 0.75rem 0.5rem !important;
        font-size: 0.875rem !important;
    }

    /* Hide less important columns on mobile */
    .tabulator-col[tabulator-field="td"],
    .tabulator-col[tabulator-field="matches"] {
        display: none !important;
    }
}

/* Tablets and small laptops (481-768px) */
@media (min-width: 481px) and (max-width: 768px) {
    /* Navigation */
    nav {
        padding: 1rem 1.5rem !important;
    }

    /* Grid layouts */
    .value-grid {
        grid-template-columns: 1fr !important;
        gap: 2rem !important;
    }

    .tournament-grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 1.5rem !important;
    }

    /* Buttons */
    .btn {
        padding: 0.875rem 2rem !important;
    }

    /* Tables */
    .tabulator-cell {
        padding: 0.875rem !important;
        font-size: 0.9rem !important;
    }
}

/* Medium devices (769-1024px) */
@media (min-width: 769px) and (max-width: 1024px) {
    .container {
        max-width: 960px;
    }

    .tournament-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* 4. COMPONENT-SPECIFIC MOBILE FIXES */

/* Tournament Marquee - restore horizontal flex layout on mobile */
@media (max-width: 768px) {
    .tournament-marquee {
        height: 48px !important;
        min-height: 48px !important;
        position: relative !important;
        padding: 0 !important;
        overflow: hidden;
    }

    .marquee-content {
        display: flex !important;
        align-items: center;
        overflow: hidden;
    }

    .marquee-track {
        min-width: fit-content;
        flex: 1 1 auto;
        animation-duration: 25s;
        will-change: transform;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        animation-play-state: running;
    }

    /* Tournament Types - Stack vertically on mobile */
    .tournament-types {
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
        margin: 2rem 0 3rem !important;
    }

    .tournament-type-card {
        padding: 1.5rem 1rem !important;
    }
}

/* Stats grid */
@media (max-width: 640px) {
    .stats-grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 1rem !important;
    }

    .stat-number {
        font-size: clamp(1.5rem, 4vw, 2.5rem) !important;
    }
}

/* Hide final CTA device stack on smaller screens */
@media (max-width: 1024px) {
    .final-cta-left {
        display: none !important;
    }

    .final-cta-grid {
        grid-template-columns: 1fr !important;
    }

    .final-cta-right {
        text-align: center;
        padding: 1rem 0.75rem;
    }
}

/* Sport icons in mobile */
@media (max-width: 480px) {
    .sport-with-icon {
        display: block !important;
        margin-bottom: 0.5rem;
    }

    .sport-icon-small {
        width: 28px !important;
        height: 28px !important;
    }
}

/* Enhanced mobile table experience */
@media (max-width: 768px) {
    /* Better table container */
    .tabulator {
        border-radius: 12px;
        font-size: 0.875rem;
    }

    /* Improved scrolling */
    .tabulator-table-holder {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        scroll-behavior: smooth;
    }

    /* Visual scroll indicator */
    .tabulator-table-holder::-webkit-scrollbar {
        height: 6px;
    }

    .tabulator-table-holder::-webkit-scrollbar-track {
        background: rgba(255, 255, 255, 0.05);
    }

    .tabulator-table-holder::-webkit-scrollbar-thumb {
        background: rgba(255, 215, 0, 0.4);
        border-radius: 3px;
    }

    /* Larger touch targets */
    .tabulator-cell {
        padding: 0.9rem 0.8rem !important;
    }

    /* Bigger status badges on mobile */
    .tab-status {
        padding: 0.5rem 0.9rem !important;
        font-size: 0.7rem !important;
    }

    /* Full width buttons on very small screens */
    .tabulator .btn.btn-small {
        padding: 0.7rem 1rem !important;
        font-size: 0.875rem !important;
    }

    /* Better sport icon sizing */
    .sport-with-icon {
        font-size: 0.75rem;
    }

    /* Ensure countdown doesn't break */
    .tab-status.with-countdown {
        font-size: 0.65rem !important;
    }
}

/* Very small devices */
@media (max-width: 480px) {
    /* Hide less important info */
    .tabulator-col[tabulator-field="td"],
    .tabulator-col[tabulator-field="matches"] {
        display: none !important;
    }

    /* Even larger touch targets */
    .tabulator-cell {
        padding: 1rem 0.6rem !important;
    }

    /* Bigger buttons */
    .tabulator .btn.btn-small {
        padding: 0.8rem 0.9rem !important;
        min-width: 100px !important;
    }
}

/* 5. TEXT OVERFLOW AND WRAPPING */

/* Prevent awkward breaks */
h1, h2, h3, h4, h5, h6 {
    word-wrap: break-word;
    overflow-wrap: break-word;
    hyphens: auto;
}

p, .description, .lead {
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* Tournament titles shouldn't break awkwardly */
.tournament-card h3 {
    word-break: normal;
    hyphens: none;
}

/* 6. PERFORMANCE OPTIMIZATIONS FOR MOBILE */

@media (max-width: 768px) {
    /* Reduce animations on mobile (exclude marquee - it needs its own duration) */
    *:not(.marquee-track) {
        animation-duration: 0.3s !important;
    }

    /* Simplify shadows for performance */
    .card,
    .tournament-card,
    .value-card {
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
    }

    /* Reduce blur effects */
    .glassmorphic {
        backdrop-filter: blur(8px) !important;
    }
}

/* 7. ACCESSIBILITY IMPROVEMENTS */

/* Larger touch targets on mobile */
@media (max-width: 768px) {
    a, button, .btn {
        min-height: 44px;
        min-width: 44px;
    }

    /* Better spacing between interactive elements */
    .nav-links a {
        padding: 0.75rem 1rem;
    }
}

/* 8. FULL WIDTH MOBILE LAYOUTS */

@media (max-width: 640px) {
    /* Prevent horizontal scroll on mobile */
    body {
        overflow-x: hidden !important;
    }

    /* Remove side margins on mobile
    .hero,
    section {
        margin-left: -1rem;
        margin-right: -1rem;
        padding-left: 1rem;
        padding-right: 1rem;
    }
    */

    /* Full width cards - commented out as it causes overflow
    .tournament-card,
    .value-card,
    .card {
        border-radius: 0 !important;
        margin-left: -1rem;
        margin-right: -1rem;
        width: calc(100% + 2rem);
    }
    */
}

/* 9. MOBILE NAVIGATION IMPROVEMENTS */

/* Hamburger menu button - hidden by default, shown on mobile */
.menu-toggle {
    display: none; /* Hidden by default */
    background: transparent;
    border: none;
    padding: 8px;
    cursor: pointer;
    z-index: 1001;
    position: relative;
    width: 44px;
    height: 44px;
}

/* SVG Hamburger and Close Icons */
.hamburger-icon,
.close-icon {
    display: block;
    width: 24px;
    height: 24px;
    color: #00E676; /* Sets currentColor for SVG fill */
}

/* Toggle icons on menu active state */
.menu-toggle.active .hamburger-icon {
    display: none !important;
}

.menu-toggle.active .close-icon {
    display: block !important;
}

/* Mobile menu styles */
.mobile-menu {
    position: fixed;
    top: 0;
    right: -100%;
    width: 80%;
    max-width: 320px;
    height: 100vh;
    background: rgba(10, 10, 10, 0.98);
    backdrop-filter: blur(20px);
    padding: 5rem 2rem 2rem;
    transition: right 0.3s ease;
    z-index: 1000;
    overflow-y: auto;
    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.5);
}

.mobile-menu.active {
    right: 0;
}

.mobile-nav-links {
    list-style: none;
    padding: 0;
    margin: 0 0 2rem 0;
}

.mobile-nav-links li {
    margin-bottom: 1rem;
}

.mobile-nav-links a {
    display: block;
    padding: 0.75rem 1rem;
    color: var(--bma-white);
    text-decoration: none;
    font-size: 1.125rem;
    font-weight: 500;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.mobile-nav-links a:hover {
    background: rgba(255, 255, 255, 0.05);
    color: var(--bma-green-bright);
    transform: translateX(4px);
}

.mobile-auth {
    padding-top: 2rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.mobile-cta {
    width: 100%;
    text-align: center;
}

/* Overlay when menu is open */
body.menu-open {
    overflow: hidden;
}

body.menu-open::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 999;
    animation: fadeIn 0.3s ease;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* DESKTOP: Force hide hamburger and show nav */
@media (min-width: 769px) {
    .menu-toggle {
        display: none !important; /* Never show on desktop */
    }

    .nav-links,
    .nav-auth {
        display: flex !important; /* Always show nav on desktop */
    }
}

/* MOBILE: Show hamburger menu on mobile only */
@media (max-width: 768px) {
    .menu-toggle {
        display: block;
    }

    .nav-links,
    .nav-auth {
        display: none;
    }

    /* Tighter gap between nav and hero text on mobile */
    .hero {
        padding-top: calc(var(--hero-marquee-height) + 44px + 0.25rem) !important;
    }

    /* Adjust logo size on mobile */
    .logo-image {
        height: 32px;
        width: auto;
    }

    /* Fix nav container on mobile */
    nav {
        justify-content: space-between;
        padding: 0.75rem 1rem !important;
    }

    /* Center hero content and buttons on mobile */
    .hero-content {
        justify-items: center;
    }

    .hero-left {
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        max-width: 320px;
    }

    .hero-ctas {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
        width: 100%;
    }

    .hero-ctas .btn {
        width: 100%;
        justify-content: center;
    }

    /* Fix mockups that are positioned off-screen causing horizontal scroll */
    .hero .phone-mockup,
    .hero .laptop-mockup,
    .final-cta .phone-mockup {
        display: none; /* Hide mockups on mobile to prevent overflow */
    }

    /* Alternative: reposition them if you want to keep them visible
    .hero .phone-mockup,
    .final-cta .phone-mockup {
        position: relative;
        right: 0;
        bottom: 0;
        margin: 0 auto;
    }
    */

    /* Ensure no horizontal overflow */
    body {
        overflow-x: hidden;
    }

    .container,
    section {
        overflow-x: hidden;
    }
}