@import url('https://fonts.googleapis.com/css2?family=Anton&family=Inter:wght@400;500;600;700;800&display=swap');

:root{
    --black:#030303;
    --dark:#0a0a0a;
    --panel:#101010;
    --gold:#c89b3c;
    --white:#f5f5f5;
    --muted:#a8a8a8;
    --line:rgba(200,155,60,.28);
    --ease:cubic-bezier(.22,.61,.36,1);
}

::selection{
    background:rgba(200,155,60,.85);
    color:#050505;
}

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

::-webkit-scrollbar-track{
    background:#070707;
}

::-webkit-scrollbar-thumb{
    background:rgba(200,155,60,.35);
    border:3px solid #070707;
    border-radius:999px;
}

::-webkit-scrollbar-thumb:hover{
    background:rgba(200,155,60,.6);
}

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

html{
    scroll-behavior:smooth;
}

body{
    background:var(--black);
    color:var(--white);
    font-family:'Inter', sans-serif;
    overflow-x:hidden;
}

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

:focus-visible{
    outline:2px solid var(--gold);
    outline-offset:3px;
}

img{
    max-width:100%;
}

.site-header{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    z-index:1000;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:24px 56px;
    background:rgba(0,0,0,.55);
    backdrop-filter:blur(12px);
    border-bottom:1px solid rgba(255,255,255,.06);
}

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

.brand-mark{
    width:48px;
    height:48px;
    border:1px solid var(--gold);
    color:var(--gold);
    display:flex;
    align-items:center;
    justify-content:center;
    font-family:'Anton', sans-serif;
    font-size:24px;
    letter-spacing:1px;
}

.brand strong{
    color:var(--gold);
    letter-spacing:4px;
    font-size:16px;
}

.brand span{
    display:block;
    color:var(--muted);
    font-size:11px;
    letter-spacing:2px;
    text-transform:uppercase;
}

.nav{
    display:flex;
    gap:28px;
}

.nav a{
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:1.5px;
    transition:.25s ease;
}

.nav a:hover,
.nav a.active-link{
    color:var(--gold);
}

.nav a.active-link::after{
    content:"";
    display:block;
    width:100%;
    height:1px;
    background:var(--gold);
    margin-top:6px;
}

.menu-toggle{
    display:none;
    background:none;
    border:1px solid rgba(200,155,60,.45);
    color:var(--gold);
    font-size:26px;
    padding:8px 14px;
    cursor:pointer;
}

#particles{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    z-index:1;
    pointer-events:none;
}

.site-header,
.hero,
.stats-wrap,
.split-section,
.media-section,
.sponsors-strip,
.about-page,
.record-page,
.media-page,
.news-page,
.sponsors-page,
.contact-page,
.site-footer{
    position:relative;
    z-index:2;
}

.btn{
    padding:17px 34px;
    border:1px solid var(--gold);
    text-transform:uppercase;
    font-size:12px;
    font-weight:800;
    letter-spacing:1.5px;
    transition:transform .3s var(--ease), box-shadow .3s var(--ease), background .25s ease, color .25s ease;
}

.btn.primary{
    background:var(--gold);
    color:#050505;
}

.btn.secondary{
    background:rgba(0,0,0,.35);
    color:white;
}

.btn:hover{
    transform:translateY(-3px);
    box-shadow:0 16px 45px rgba(200,155,60,.22);
}

.btn.primary:hover{
    background:#d8ab4a;
}

.btn.secondary:hover{
    background:rgba(200,155,60,.12);
    border-color:var(--gold);
}

.btn:active{
    transform:translateY(-1px);
}

.text-link{
    position:relative;
    display:inline-block;
    margin-top:28px;
    color:var(--gold);
    font-size:12px;
    font-weight:800;
    letter-spacing:2px;
    text-transform:uppercase;
}

.text-link::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-5px;
    width:100%;
    height:1px;
    background:var(--gold);
    transform:scaleX(0);
    transform-origin:left;
    transition:transform .35s var(--ease);
}

.text-link:hover::after{
    transform:scaleX(1);
}

#loader{
    position:fixed;
    inset:0;
    background:#030303;
    z-index:9999;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    transition:opacity .8s ease, visibility .8s ease;
}

.loader-logo{
    width:90px;
    height:90px;
    border:1px solid #c89b3c;
    color:#c89b3c;
    display:flex;
    align-items:center;
    justify-content:center;
    font-family:'Anton', sans-serif;
    font-size:44px;
    margin-bottom:22px;
    animation:pulseGlow 1.4s infinite alternate;
}

.loader-text{
    color:#c89b3c;
    letter-spacing:7px;
    font-size:13px;
    font-weight:800;
}

.hide-loader{
    opacity:0;
    visibility:hidden;
}

@keyframes pulseGlow{
    from{
        transform:scale(1);
        box-shadow:0 0 0 rgba(200,155,60,0);
    }

    to{
        transform:scale(1.06);
        box-shadow:0 0 45px rgba(200,155,60,.35);
    }
}

.reveal.show{
    opacity:1;
    transform:translateY(0);
}

.about-page,
.record-page,
.media-page,
.news-page,
.sponsors-page,
.contact-page{
    padding-top:130px;
}

.about-hero,
.record-hero,
.media-hero,
.news-hero,
.sponsors-hero,
.contact-hero{
    padding:80px 55px 40px;
}

.about-hero h1,
.record-hero h1,
.media-hero h1,
.news-hero h1,
.sponsors-hero h1,
.contact-hero h1{
    font-family:'Anton', sans-serif;
    line-height:.95;
    color:var(--gold);
    margin-bottom:20px;
}

.record-hero h1{
    font-size:clamp(80px, 12vw, 180px);
    line-height:.9;
}

.about-hero p,
.record-hero p,
.media-hero p,
.news-hero p,
.sponsors-hero p,
.contact-hero p{
    max-width:780px;
    color:var(--muted);
    line-height:1.8;
    font-size:18px;
}

.win,
.loss{
    display:inline-block;
    padding:8px 14px;
    border-radius:999px;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:1.2px;
}

.win{
    color:#4ade80;
    background:rgba(74,222,128,.10);
    border:1px solid rgba(74,222,128,.28);
}

.loss{
    color:#ef4444;
    background:rgba(239,68,68,.10);
    border:1px solid rgba(239,68,68,.28);
}

.site-footer{
    padding:60px 55px 25px;
    background:#050505;
    border-top:1px solid rgba(255,255,255,.06);
}

.footer-grid{
    display:grid;
    grid-template-columns:1.4fr 1fr 1fr;
    gap:35px;
    padding-bottom:36px;
    border-bottom:1px solid rgba(255,255,255,.08);
}

.footer-logo{
    width:56px;
    height:56px;
    border:1px solid var(--gold);
    color:var(--gold);
    display:flex;
    align-items:center;
    justify-content:center;
    font-family:'Anton', sans-serif;
    font-size:26px;
    margin-bottom:16px;
}

.site-footer h3,
.site-footer h4{
    color:var(--gold);
    letter-spacing:2px;
    margin-bottom:14px;
}

.site-footer p,
.site-footer a{
    display:block;
    color:#8d8d8d;
    margin-bottom:10px;
    line-height:1.6;
}

.footer-btn{
    color:var(--gold) !important;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:1px;
}

.copyright{
    padding-top:22px;
    color:#666;
    font-size:12px;
}

@media(max-width:900px){

    body{
        overflow-x:hidden;
    }

    .site-header{
        position:fixed !important;
        top:0 !important;
        left:0 !important;
        width:100% !important;
        height:82px !important;
        padding:14px 18px !important;
        background:#050505 !important;
        z-index:999999 !important;
    }

    .brand{
        gap:12px;
    }

    .brand-mark{
        width:42px;
        height:42px;
        font-size:20px;
    }

    .brand strong{
        font-size:13px;
        letter-spacing:2px;
    }

    .brand span{
        font-size:9px;
        letter-spacing:1px;
    }

    .menu-toggle{
        display:flex !important;
        align-items:center;
        justify-content:center;
        width:44px;
        height:44px;
        background:#0b0b0b !important;
        border:1px solid rgba(200,155,60,.55) !important;
        color:var(--gold) !important;
        font-size:24px !important;
        z-index:1000000 !important;
        cursor:pointer;
    }

    .nav{
        position:fixed !important;
        top:82px !important;
        left:0 !important;
        right:0 !important;
        display:none !important;
        flex-direction:column !important;
        gap:0 !important;
        background:#000 !important;
        padding:24px 28px !important;
        z-index:999998 !important;
        border:1px solid rgba(200,155,60,.35);
        box-shadow:0 30px 80px rgba(0,0,0,.95);
    }

    .nav.nav-open{
        display:flex !important;
    }

    .nav a{
        display:block !important;
        color:#fff !important;
        font-size:15px !important;
        letter-spacing:3px !important;
        padding:17px 0 !important;
        border-bottom:1px solid rgba(255,255,255,.1) !important;
    }

    .nav a:last-child{
        border-bottom:0 !important;
    }

    .nav a.active-link{
        color:var(--gold) !important;
    }

    .nav a.active-link::after{
        display:none !important;
    }

    .about-page,
    .record-page,
    .media-page,
    .news-page,
    .sponsors-page,
    .contact-page{
        padding-top:100px !important;
    }

    .about-hero,
    .record-hero,
    .media-hero,
    .news-hero,
    .sponsors-hero,
    .contact-hero{
        padding-top:45px;
        padding-left:22px;
        padding-right:22px;
    }

    .record-hero h1{
        font-size:70px !important;
        line-height:.95 !important;
    }

    .stats-wrap,
    .split-section,
    .media-grid,
    .sponsors-strip,
    .footer-grid,
    .contact-section,
    .about-split,
    .world-stage-card,
    .record-summary,
    .news-grid,
    .sponsor-packages{
        grid-template-columns:1fr !important;
    }

    .split-section,
    .media-section,
    .sponsors-strip,
    .site-footer,
    .contact-section,
    .about-split,
    .record-summary,
    .record-table-section,
    .media-featured,
    .media-library,
    .sponsor-packages,
    .news-grid{
        padding-left:22px;
        padding-right:22px;
    }
}

@media(prefers-reduced-motion:reduce){
    *,
    *::before,
    *::after{
        animation-duration:.01ms !important;
        animation-iteration-count:1 !important;
        scroll-behavior:auto !important;
        transition-duration:.01ms !important;
    }
}

.reveal.show,
.reveal-item.show{
    opacity:1;
    transform:translateY(0);
}

@media(min-width:901px){
}

@media(max-width:900px){
    .site-header{
        background:#050505 !important;
    }

    .nav{
        background:#000 !important;
    }
}

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

.site-header{
    transition:padding .35s var(--ease), background .35s ease, border-color .35s ease;
}

.site-header.scrolled{
    padding-top:14px;
    padding-bottom:14px;
    background:rgba(3,3,3,.86);
    border-bottom-color:rgba(200,155,60,.22);
    box-shadow:0 10px 40px rgba(0,0,0,.45);
}

@keyframes kenBurns{
    from{ transform:scale(1.04) translate(0, 0); }
    to{ transform:scale(1.16) translate(-1.5%, -2%); }
}

@keyframes scrollCue{
    0%{ opacity:0; transform:translateY(0); }
    35%{ opacity:1; }
    70%{ opacity:0; transform:translateY(14px); }
    100%{ opacity:0; }
}

@keyframes marquee{
    from{ transform:translateX(0); }
    to{ transform:translateX(calc(-50% - 40px)); }
}

#backToTop{
    position:fixed;
    right:26px;
    bottom:26px;
    z-index:998;
    width:48px;
    height:48px;
    border:1px solid var(--gold);
    background:rgba(8,8,8,.85);
    backdrop-filter:blur(8px);
    color:var(--gold);
    font-size:20px;
    cursor:pointer;
    opacity:0;
    visibility:hidden;
    transform:translateY(16px);
    transition:opacity .3s ease, transform .3s var(--ease), background .25s ease, color .25s ease;
}

#backToTop.show{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}

#backToTop:hover{
    background:var(--gold);
    color:#050505;
}

.footer-social{
    display:flex;
    gap:18px;
    margin-top:22px;
}

.footer-social a{
    display:inline-block;
    margin:0;
    color:var(--muted) !important;
    font-size:12px;
    font-weight:700;
    letter-spacing:1.5px;
    text-transform:uppercase;
    transition:color .25s ease;
}

.footer-social a:hover{
    color:var(--gold) !important;
}

.copyright{
    display:flex;
    flex-wrap:wrap;
    gap:10px 24px;
    justify-content:space-between;
}

@media(max-width:900px){

    #backToTop{
        right:16px;
        bottom:16px;
        width:44px;
        height:44px;
    }
}

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

@media(max-width:900px){
}
.lx-contact-card--no-main-icon {
    align-items: flex-start;
}

.lx-contact-card--no-main-icon > div {
    width: 100%;
}

.lx-contact-card--social {
    padding: 24px;
}

.lx-contact-card--social h4 {
    margin-bottom: 16px;
}

.lx-contact-social__links {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.lx-contact-social__links a {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 15px 10px 11px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 999px;
    color: #fff;
    text-decoration: none;
    font-size: 13px;
    letter-spacing: .03em;
    background: rgba(255,255,255,.045);
    transition: .25s ease;
}

.lx-contact-social__links a:hover {
    border-color: rgba(218,181,107,.65);
    background: rgba(218,181,107,.12);
    transform: translateY(-2px);
}

.lx-social-icon {
    width: 28px;
    height: 28px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 28px;
}

.lx-social-icon svg {
    width: 16px;
    height: 16px;
    display: block;
}

.lx-social-icon svg,
.lx-social-icon path,
.lx-social-icon rect,
.lx-social-icon circle {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.lx-social-icon--instagram {
    color: #fff;
    background: radial-gradient(circle at 30% 110%, #feda75 0%, #fa7e1e 28%, #d62976 48%, #962fbf 72%, #4f5bd5 100%);
}

.lx-social-icon--tiktok {
    color: #fff;
    background: #050505;
    box-shadow: inset 3px 0 0 rgba(37,244,238,.75), inset -3px 0 0 rgba(254,44,85,.7);
}

.lx-social-icon--facebook {
    color: #fff;
    background: #1877f2;
}

.lx-social-icon--facebook svg path,
.lx-social-icon--youtube svg path {
    fill: currentColor;
    stroke: none;
}

.lx-social-icon--youtube {
    color: #fff;
    background: #ff0033;
}

.lx-social-icon--youtube .lx-youtube-play {
    fill: #ff0033;
    stroke: none;
}