*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body,h1,h2,h3,h4,p,ul,ol,figure,blockquote,dl,dd{margin:0}
ul,ol{padding:0}
img,svg,video{display:block;max-width:100%}
input,button,textarea,select{font:inherit}

:root{
--c-primary:#0B1B3D;
--c-accent:#FF6B35;
--c-blue:#1A3A6B;
--c-light:#F2F4F8;
--c-gray:#2E3A4E;
--c-white:#FFFFFF;
--c-cyan:#0EA5E9;
--c-gold:#F59E0B;
--font-display:Impact,"Arial Black","Helvetica Neue",Arial,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
--font-body:"Helvetica Neue",Arial,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
--font-data:"Roboto Mono","SFMono-Regular",Consolas,"Liberation Mono",Menlo,"Courier New",monospace;
--container-w:1240px;
--ease:cubic-bezier(.22,.61,.36,1);
--dur:.28s
}

body{
font-family:var(--font-body);
font-size:16px;
line-height:1.6;
color:var(--c-gray);
background:var(--c-light);
-webkit-font-smoothing:antialiased
}

h1,h2,h3,h4{
font-family:var(--font-display);
font-weight:700;
line-height:1.12;
color:var(--c-primary);
text-transform:uppercase;
letter-spacing:.02em
}

a{
color:var(--c-cyan);
text-decoration:underline;
text-underline-offset:2px;
text-decoration-thickness:1px
}
a:hover{color:var(--c-accent)}

::selection{background:var(--c-accent);color:var(--c-primary)}
:focus-visible{outline:3px solid var(--c-accent);outline-offset:3px}

.container{
width:100%;
max-width:var(--container-w);
margin-inline:auto;
padding-inline:clamp(16px,3vw,32px)
}

.content{padding-block:clamp(40px,6vw,80px)}

.sr-only{
position:absolute;
width:1px;
height:1px;
padding:0;
margin:-1px;
overflow:hidden;
clip:rect(0,0,0,0);
white-space:nowrap;
border:0
}

.skip-link{
position:fixed;
top:-72px;
left:16px;
z-index:2000;
padding:12px 18px;
background:var(--c-accent);
border:2px solid var(--c-accent);
color:var(--c-primary);
font-weight:700;
font-size:.92rem;
text-decoration:none;
transition:top .2s ease
}
.skip-link:focus,.skip-link:focus-visible{top:12px;outline:none}

main{display:block}
#main-content{scroll-margin-top:96px}

.btn{
display:inline-flex;
align-items:center;
justify-content:center;
gap:.5em;
padding:14px 28px;
background:var(--c-accent);
border:2px solid var(--c-accent);
color:var(--c-primary);
font-family:var(--font-display);
font-size:1rem;
font-weight:700;
letter-spacing:.04em;
line-height:1;
text-transform:uppercase;
text-decoration:none;
cursor:pointer;
transition:background .2s,color .2s,transform .25s var(--ease),box-shadow .25s
}
.btn:hover{
background:transparent;
color:var(--c-accent);
transform:translateY(-2px)
}
.btn--ghost{
background:transparent;
border-color:rgba(11,27,61,.35);
color:var(--c-primary)
}
.btn--ghost:hover{
background:rgba(11,27,61,.05);
border-color:var(--c-accent);
color:var(--c-accent)
}
.btn--invert{
background:transparent;
border-color:rgba(255,255,255,.65);
color:var(--c-white)
}
.btn--invert:hover{
background:rgba(255,107,53,.08);
border-color:var(--c-accent);
color:var(--c-accent)
}

.breadcrumb{
display:flex;
flex-wrap:wrap;
align-items:center;
margin:0 0 24px;
padding:0;
list-style:none;
font-size:.88rem;
color:inherit
}
.breadcrumb li{display:inline-flex;align-items:center}
.breadcrumb li+li::before{content:"/";margin-inline:.5rem;color:inherit;opacity:.5}
.breadcrumb a{
color:inherit;
text-decoration:none;
border-bottom:1px solid transparent;
transition:color .2s,border-color .2s
}
.breadcrumb a:hover{color:var(--c-accent);border-color:var(--c-accent)}
.breadcrumb [aria-current="page"]{color:var(--c-accent);font-family:var(--font-data)}

.section{padding-block:clamp(48px,7vw,96px)}
.section--dark{
background:var(--c-primary);
color:rgba(255,255,255,.72)
}
.section--dark .section-title,
.section--dark h2{color:var(--c-white)}
.section-label{
display:inline-flex;
align-items:center;
gap:10px;
margin-bottom:14px;
font-family:var(--font-data);
font-size:.8rem;
font-weight:700;
letter-spacing:.18em;
text-transform:uppercase;
color:var(--c-accent)
}
.section-label::before{content:"";width:24px;height:2px;background:var(--c-accent)}
.section-title{
margin-bottom:12px;
font-size:clamp(1.9rem,4vw,3rem);
line-height:1.06
}
.section-desc{
max-width:640px;
margin-bottom:32px;
font-size:1.02rem;
color:var(--c-gray)
}
.section--dark .section-desc{color:rgba(255,255,255,.68)}

.grid{display:grid;gap:24px}
.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}

.grid-card{
display:flex;
flex-direction:column;
gap:10px;
padding:24px;
background:var(--c-white);
border:1px solid rgba(11,27,61,.1);
border-top:3px solid var(--c-primary);
box-shadow:0 2px 0 rgba(11,27,61,.04);
transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .2s
}
.grid-card:hover{
transform:translateY(-4px);
border-top-color:var(--c-accent);
box-shadow:0 14px 30px rgba(11,27,61,.1)
}
.card-meta{
font-family:var(--font-data);
font-size:.8rem;
letter-spacing:.1em;
text-transform:uppercase;
color:var(--c-cyan)
}
.card-title{margin:0;font-size:1.15rem;line-height:1.25}
.card-text{margin:0;font-size:.94rem;line-height:1.7;color:var(--c-gray)}
.card-foot{
margin-top:auto;
padding-top:12px;
border-top:1px solid var(--c-light);
font-size:.84rem;
color:var(--c-gray)
}

.media-frame{
position:relative;
overflow:hidden;
background:
linear-gradient(135deg,rgba(14,165,233,.18),transparent 48%),
linear-gradient(215deg,rgba(255,107,53,.15),transparent 48%),
var(--c-primary);
border:1px solid rgba(11,27,61,.14)
}
.media-frame::after{
content:"";
position:absolute;
inset:0;
z-index:3;
background:
linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),
linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);
background-size:20px 20px;
opacity:.5;
pointer-events:none
}
.media-frame img{
position:absolute;
inset:0;
z-index:2;
width:100%;
height:100%;
object-fit:cover
}
.media-frame[data-ratio="16/9"]{aspect-ratio:16/9}
.media-frame[data-ratio="4/3"]{aspect-ratio:4/3}
.media-frame[data-ratio="3/2"]{aspect-ratio:3/2}
.media-frame[data-ratio="1/1"]{aspect-ratio:1/1}
.media-ph{
position:absolute;
inset:0;
z-index:1;
display:flex;
align-items:center;
justify-content:center;
padding:20px;
font-family:var(--font-data);
font-size:.82rem;
letter-spacing:.12em;
color:rgba(255,255,255,.65);
text-align:center
}

.fold{
background:var(--c-white);
border:1px solid rgba(11,27,61,.12);
border-left:3px solid var(--c-primary);
transition:border-color .2s
}
.fold[open]{border-left-color:var(--c-accent)}
.fold+.fold{margin-top:12px}
.fold-summary{
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
padding:18px 22px;
cursor:pointer;
font-family:var(--font-body);
font-weight:700;
font-size:1rem;
color:var(--c-primary);
background:linear-gradient(90deg,rgba(11,27,61,.04),transparent 55%);
list-style:none
}
.fold-summary::-webkit-details-marker{display:none}
.fold-summary::after{
content:"+";
flex-shrink:0;
font-family:var(--font-data);
font-size:1.25rem;
color:var(--c-accent);
transition:transform .2s
}
.fold[open] .fold-summary::after{transform:rotate(45deg)}
.fold-body{
padding:2px 22px 20px;
font-size:.95rem;
line-height:1.75;
color:var(--c-gray)
}

[data-reveal]{
opacity:0;
transform:translateY(22px);
transition:opacity .6s var(--ease),transform .6s var(--ease);
transition-delay:var(--reveal-delay,0ms)
}
[data-reveal].is-revealed{opacity:1;transform:none}

[data-spy-link]{
display:block;
padding:7px 12px;
border-left:3px solid transparent;
color:var(--c-gray);
text-decoration:none;
transition:color .2s,border-color .2s,background .2s
}
[data-spy-link]:hover{color:var(--c-primary)}
[data-spy-link].is-active{
color:var(--c-accent);
border-left-color:var(--c-accent);
background:rgba(255,107,53,.06)
}
[data-spy-section]{scroll-margin-top:96px}

.page-hero{
position:relative;
overflow:hidden;
padding-block:clamp(40px,7vw,84px);
background:linear-gradient(120deg,var(--c-primary) 0%,var(--c-blue) 68%,var(--c-primary) 100%);
color:rgba(255,255,255,.72)
}
.page-hero::after{
content:"";
position:absolute;
right:-8%;
bottom:-42%;
width:46%;
padding-top:46%;
background:
linear-gradient(135deg,transparent 44%,rgba(255,107,53,.22) 45%,rgba(255,107,53,.22) 50%,transparent 51%),
linear-gradient(45deg,transparent 42%,rgba(255,255,255,.06) 43%,rgba(255,255,255,.06) 47%,transparent 48%);
transform:rotate(-10deg);
pointer-events:none
}
.page-hero .container{position:relative;z-index:1}
.page-hero .breadcrumb{margin-bottom:14px;color:rgba(255,255,255,.6)}
.page-hero .breadcrumb a{color:rgba(255,255,255,.75)}
.page-hero .breadcrumb a:hover{color:var(--c-accent)}
.page-hero-title{
margin-bottom:12px;
color:var(--c-white);
font-size:clamp(2rem,5vw,3.4rem)
}
.page-hero-desc{
max-width:640px;
margin:0;
font-size:1.02rem;
color:rgba(255,255,255,.68)
}

.status-dot{
display:inline-block;
width:7px;
height:7px;
flex-shrink:0;
background:var(--c-cyan);
border-radius:1px;
transform:rotate(45deg);
animation:statusBlink 1.3s ease-in-out infinite alternate
}
@keyframes statusBlink{
from{opacity:1;box-shadow:0 0 0 0 rgba(14,165,233,.45)}
to{opacity:.65;box-shadow:0 0 10px 3px rgba(14,165,233,.2)}
}

.site-header{
position:sticky;
top:0;
z-index:1000;
background:var(--c-primary);
border-bottom:1px solid rgba(255,255,255,.08);
box-shadow:0 6px 24px rgba(3,11,28,.18)
}

.scroll-progress{
position:absolute;
left:0;
right:0;
bottom:-1px;
height:3px;
z-index:10;
background:linear-gradient(90deg,var(--c-accent),var(--c-gold));
transform:scaleX(0);
transform-origin:left center;
pointer-events:none
}

.header-strip{
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
max-width:var(--container-w);
margin-inline:auto;
padding:7px clamp(16px,3vw,32px) 6px;
border-bottom:1px solid rgba(255,255,255,.06);
max-height:44px;
overflow:hidden;
transition:max-height .35s var(--ease),opacity .25s ease
}
.header-strip-text{
font-size:.78rem;
letter-spacing:.1em;
color:rgba(255,255,255,.5)
}
.header-strip-state{
display:inline-flex;
align-items:center;
gap:8px;
font-size:.76rem;
letter-spacing:.08em;
color:rgba(255,255,255,.66)
}
.site-header.is-shrunk .header-strip{max-height:0;opacity:0}

.header-main{
display:flex;
align-items:center;
justify-content:space-between;
gap:24px;
max-width:var(--container-w);
margin-inline:auto;
padding:12px clamp(16px,3vw,32px);
transition:padding .3s var(--ease)
}
.site-header.is-shrunk .header-main{padding-top:8px;padding-bottom:8px}

.brand{
display:inline-flex;
align-items:center;
gap:10px;
flex-shrink:0;
color:var(--c-white);
text-decoration:none
}
.brand:hover{color:var(--c-white)}
.brand-mark{
display:inline-block;
font-family:var(--font-display);
font-size:1.7rem;
font-weight:800;
line-height:1;
padding:.2em .32em .22em .28em;
color:var(--c-primary);
background:var(--c-accent);
clip-path:polygon(0 0,100% 0,100% 70%,82% 100%,0 100%)
}
.brand-name{
font-family:var(--font-display);
font-size:1.4rem;
line-height:1;
letter-spacing:.16em;
text-transform:uppercase
}

.site-nav{display:block}
.nav-list{
display:flex;
align-items:center;
gap:.2rem;
margin:0;
padding:0;
list-style:none
}
.nav-link{
position:relative;
display:inline-block;
padding:.6em .85em;
font-size:.96rem;
font-weight:500;
letter-spacing:.02em;
color:rgba(255,255,255,.82);
text-decoration:none;
white-space:nowrap;
transition:color .2s
}
.nav-link::after{
content:"";
position:absolute;
left:.85em;
right:.85em;
bottom:.24em;
height:2px;
background:var(--c-accent);
transform:scaleX(0);
transform-origin:left center;
transition:transform .25s var(--ease)
}
.nav-link:hover{color:var(--c-white)}
.nav-link:hover::after,
.nav-link[aria-current="page"]::after{transform:scaleX(1)}
.nav-link[aria-current="page"]{color:var(--c-white)}

.nav-link--cta,
.nav-link--cta[aria-current="page"]{
margin-left:.6rem;
padding:.62em 1.2em;
border:1px solid var(--c-accent);
background:var(--c-accent);
color:var(--c-primary)
}
.nav-link--cta::after{display:none}
.nav-link--cta:hover,
.nav-link--cta[aria-current="page"]:hover{
background:transparent;
color:var(--c-accent)
}

.nav-toggle{
display:none;
align-items:center;
gap:10px;
padding:10px 14px;
background:transparent;
border:1px solid rgba(255,255,255,.24);
color:var(--c-white);
cursor:pointer;
transition:border-color .2s,background .2s
}
.nav-toggle:hover{
border-color:var(--c-accent);
background:rgba(255,107,53,.08)
}
.nav-toggle-bars{
display:inline-flex;
flex-direction:column;
gap:4px
}
.nav-toggle-bar{
display:block;
width:18px;
height:2px;
background:var(--c-white);
transition:transform .25s var(--ease),opacity .2s
}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.nav-toggle-text{font-size:.86rem;letter-spacing:.1em}

.live-ticker{
border-top:1px solid rgba(255,255,255,.07);
background:rgba(8,20,44,.72);
backdrop-filter:blur(8px);
-webkit-backdrop-filter:blur(8px)
}
.ticker-inner{
display:flex;
align-items:center;
gap:16px;
max-width:var(--container-w);
margin-inline:auto;
padding:7px clamp(16px,3vw,32px)
}
.ticker-label{
display:inline-flex;
align-items:center;
gap:8px;
flex-shrink:0;
font-family:var(--font-data);
font-size:.78rem;
font-weight:700;
letter-spacing:.14em;
text-transform:uppercase;
color:var(--c-accent)
}
.ticker-viewport{
flex:1;
min-width:0;
overflow:hidden
}
.ticker-track{
display:flex;
width:max-content;
animation:tickerScroll 32s linear infinite;
will-change:transform
}
@keyframes tickerScroll{
from{transform:translateX(0)}
to{transform:translateX(-50%)}
}
.ticker-group{
display:flex;
align-items:center;
gap:32px;
padding-right:32px;
flex-shrink:0
}
.ticker-item{
display:inline-flex;
align-items:baseline;
gap:8px;
white-space:nowrap;
font-size:.88rem;
color:rgba(255,255,255,.82)
}
.ticker-league{
font-family:var(--font-data);
font-size:.72rem;
font-weight:700;
letter-spacing:.08em;
padding:3px 6px;
border:1px solid rgba(14,165,233,.55);
color:var(--c-cyan)
}
.ticker-score{
font-family:var(--font-data);
font-weight:700;
color:var(--c-white)
}
.ticker-period{
font-family:var(--font-data);
font-style:normal;
font-size:.78rem;
color:var(--c-gold)
}
.ticker-more{
display:inline-flex;
align-items:center;
gap:.4em;
flex-shrink:0;
font-size:.8rem;
font-weight:500;
color:rgba(255,255,255,.62);
text-decoration:none;
border-bottom:1px solid rgba(255,255,255,.28);
transition:color .2s,border-color .2s
}
.ticker-more::after{content:"→";font-family:var(--font-data)}
.ticker-more:hover{
color:var(--c-accent);
border-color:var(--c-accent)
}

.site-footer{
position:relative;
overflow:hidden;
background:var(--c-primary);
color:rgba(255,255,255,.72);
border-top:2px solid var(--c-accent)
}
.site-footer::before{
content:"";
position:absolute;
inset:0;
background:
linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),
linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);
background-size:44px 44px;
pointer-events:none
}
.footer-grid{
position:relative;
z-index:1;
display:grid;
grid-template-columns:1.5fr 1fr 1fr 1.6fr;
gap:40px;
max-width:var(--container-w);
margin-inline:auto;
padding:clamp(44px,6vw,64px) clamp(16px,3vw,32px) 40px
}
.footer-brand{
display:flex;
flex-direction:column;
align-items:flex-start
}
.brand--footer .brand-mark{font-size:1.45rem}
.brand--footer .brand-name{font-size:1.2rem}
.footer-tagline{
margin-top:18px;
font-size:.92rem;
color:rgba(255,255,255,.58)
}
.footer-trust{
margin-top:18px;
padding-top:14px;
border-top:1px dashed rgba(255,255,255,.14);
max-width:300px;
font-size:.84rem;
line-height:1.7;
color:rgba(255,255,255,.5)
}
.footer-column,.footer-contact{min-width:0}
.footer-heading{
display:inline-block;
margin:0 0 16px;
padding-bottom:8px;
border-bottom:2px solid var(--c-accent);
font-family:var(--font-display);
font-size:.9rem;
letter-spacing:.16em;
text-transform:uppercase;
color:var(--c-white)
}
.footer-list{
list-style:none;
margin:0;
padding:0
}
.footer-list a{
display:inline-block;
padding:6px 0;
font-size:.92rem;
color:rgba(255,255,255,.62);
text-decoration:none;
border-bottom:1px solid transparent;
transition:color .2s,border-color .2s,padding-left .2s
}
.footer-list a:hover{
color:var(--c-accent);
border-color:rgba(255,107,53,.5);
padding-left:4px
}
.footer-contact-line{
margin:0 0 10px;
font-size:.9rem;
color:rgba(255,255,255,.72)
}
.footer-contact-note{
margin-top:14px;
padding-top:12px;
border-top:1px solid rgba(255,255,255,.1);
font-size:.82rem;
color:rgba(255,255,255,.45)
}
.footer-bottom{
position:relative;
z-index:1;
display:flex;
flex-wrap:wrap;
align-items:center;
justify-content:space-between;
gap:8px 20px;
max-width:var(--container-w);
margin-inline:auto;
padding:18px clamp(16px,3vw,32px);
border-top:1px solid rgba(255,255,255,.09);
font-size:.82rem;
color:rgba(255,255,255,.48)
}
.footer-bottom p{margin:0}

@media (max-width:1023.98px){
.nav-toggle{display:inline-flex}
.site-nav{
display:none;
position:absolute;
top:100%;
left:0;
right:0;
z-index:60;
background:var(--c-primary);
border-bottom:1px solid rgba(255,255,255,.12);
box-shadow:0 20px 32px rgba(3,11,28,.38);
max-height:calc(100vh - 64px);
overflow-y:auto
}
.site-nav[data-open]{display:block}
.nav-list{
flex-direction:column;
align-items:stretch;
gap:0;
padding:10px clamp(16px,3vw,32px) 18px
}
.nav-link{
display:block;
padding:14px 6px;
font-size:1.05rem;
border-bottom:1px solid rgba(255,255,255,.07)
}
.nav-link::after{display:none}
.nav-link--cta,.nav-link--cta[aria-current="page"]{
margin:14px 0 2px;
text-align:center
}
}

@media (max-width:991.98px){
.grid--3,.grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}
.footer-grid{grid-template-columns:1fr 1fr}
}

@media (max-width:767.98px){
.header-strip{display:none}
}

@media (max-width:575.98px){
.grid--2,.grid--3,.grid--4{grid-template-columns:1fr}
.footer-grid{grid-template-columns:1fr;gap:28px}
.footer-bottom{flex-direction:column;align-items:flex-start}
.ticker-more{display:none}
.ticker-group{gap:20px;padding-right:20px}
.ticker-item{font-size:.82rem}
.brand-mark{font-size:1.5rem}
.brand-name{font-size:1.2rem}
}

@media (prefers-reduced-motion:reduce){
html{scroll-behavior:auto}
*,*::before,*::after{
animation-duration:.01ms !important;
animation-iteration-count:1 !important;
transition-duration:.01ms !important;
scroll-behavior:auto !important
}
.ticker-track{animation:none}
.ticker-viewport{overflow-x:auto}
[data-reveal]{opacity:1;transform:none;transition-delay:0ms !important}
.nav-toggle-bar{transition:none}
}