.page-home{--depth-a:0 18px 40px rgba(2,8,20,.38);--depth-b:0 8px 18px rgba(44,30,22,.09);--gold-hair:rgba(212,175,55,.28);--text-muted:rgba(245,235,221,.78);overflow-x:hidden}
.page-home .home-hero{position:relative;min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;background:var(--night-blue);padding:7rem 1.5rem 4rem;isolation:isolate;overflow:hidden}
.page-home .home-hero-bg{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;filter:saturate(.85) contrast(1.05)}
.page-home .home-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 72% 22%,rgba(212,175,55,.22) 0%,rgba(10,22,40,.65) 42%,transparent 70%),linear-gradient(110deg,rgba(10,22,40,.97) 0%,rgba(10,22,40,.82) 45%,rgba(10,22,40,.55) 100%)}
.page-home .home-hero-inner{width:min(1080px,100%);padding-top:2.5rem}
.page-home .hero-kicker{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap;margin-bottom:1.4rem}
.page-home .kicker-crumb{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--font-body);font-size:.78rem;letter-spacing:.12em;color:var(--glacier-blue);padding:.35rem .8rem;background:rgba(184,216,232,.08);border:1px solid rgba(184,216,232,.2);border-left:2px solid var(--gold)}
.page-home .hero-title{font-family:var(--font-display);font-size:clamp(2.6rem,9vw,7rem);font-weight:900;line-height:.92;text-transform:uppercase;color:var(--cream);margin:0 0 1.4rem;letter-spacing:.02em;max-width:9em}
.page-home .hero-lead{font-family:var(--font-body);font-size:1rem;line-height:1.85;color:rgba(245,235,221,.88);max-width:42rem;margin:0 0 2rem}
.page-home .hero-actions{display:flex;flex-wrap:wrap;gap:1rem}
.page-home .home-hero .btn{box-shadow:var(--depth-a)}
.page-home .home-hero .btn-ghost{color:var(--cream);border-color:rgba(245,235,221,.5)}
.page-home .hero-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem 1.2rem;width:min(1080px,100%);margin-top:4rem;border-top:1px solid var(--gold-hair);padding-top:1.6rem}
.page-home .stat-item{display:flex;flex-direction:column;gap:.2rem}
.page-home .stat-num{font-family:var(--font-display);font-size:clamp(1.7rem,5vw,3rem);font-weight:900;color:var(--gold);line-height:1;animation:page-home-numReveal .8s ease both}
.page-home .stat-label{font-family:var(--font-body);font-size:.8rem;letter-spacing:.1em;color:rgba(245,235,221,.62)}
@keyframes page-home-numReveal{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.page-home .league-section{position:relative;background:var(--cream);color:var(--deep-brown);padding:6rem 0 6.5rem;clip-path:polygon(0 2.2%,100% 0,100% 97.2%,0 100%)}
.page-home .league-section::after{content:"02";position:absolute;right:2%;top:2.4rem;font-family:var(--font-display);font-weight:900;font-size:clamp(6rem,12vw,12rem);line-height:1;color:rgba(44,30,22,.05);pointer-events:none}
.page-home .section-head{position:relative;z-index:1;margin-bottom:2.8rem}
.page-home .section-label{display:inline-block;font-family:var(--font-body);font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:.6rem;padding-left:1.1rem;position:relative}
.page-home .section-label::before{content:"";position:absolute;left:0;top:.55em;width:.65rem;height:2px;background:var(--gold)}
.page-home .section-title{font-family:var(--font-display);font-weight:900;font-size:clamp(1.8rem,4.5vw,3.4rem);line-height:1;text-transform:uppercase;margin:0 0 .9rem;color:inherit}
.page-home .section-desc{font-family:var(--font-body);font-size:.98rem;line-height:1.8;color:inherit;opacity:.82;max-width:44rem;margin:0}
.page-home .light-head .section-title{color:var(--cream)}
.page-home .light-head .section-desc{color:var(--text-muted)}
.page-home .league-layout{display:grid;grid-template-columns:1fr;gap:2.6rem;align-items:center;position:relative;z-index:1}
.page-home .league-media{position:relative;transform:rotate(-1.4deg)}
.page-home .league-media img{display:block;width:100%;height:auto;border-radius:4px;box-shadow:var(--depth-a);border:1px solid rgba(255,255,255,.3)}
.page-home .league-media-caption{margin-top:.8rem;font-family:var(--font-body);font-size:.78rem;text-align:center;letter-spacing:.08em;opacity:.66}
.page-home .league-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem}
.page-home .league-card{--tilt:-1deg;position:relative;background:rgba(245,235,221,.88);border-left:4px solid var(--gold);border-radius:2px;box-shadow:var(--depth-b);padding:1.1rem 1rem 1rem;transform:rotate(var(--tilt));transition:transform .22s ease,box-shadow .22s ease,background .22s ease,border-color .22s ease;min-height:104px;display:flex;flex-direction:column;justify-content:center;gap:.25rem}
.page-home .league-card:nth-child(3n){--tilt:1.2deg}
.page-home .league-card:nth-child(4n){--tilt:-.7deg}
.page-home .league-card:nth-child(5n){--tilt:.8deg}
.page-home .league-card:hover{--tilt:0deg;background:#fff;border-left-color:var(--stadium-red);box-shadow:0 18px 34px rgba(44,30,22,.16);transform:rotate(0) translateY(-4px)}
.page-home .league-badge{position:absolute;top:.7rem;right:.7rem;width:1.5rem;height:1.5rem;border:1px solid var(--gold-hair);border-radius:4px;background:linear-gradient(135deg,rgba(212,175,55,.14),transparent);transition:transform .22s ease}
.page-home .league-card:hover .league-badge{transform:rotate(45deg)}
.page-home .league-code{font-family:var(--font-display);font-weight:900;letter-spacing:.1em;font-size:.72rem;color:var(--ember-orange)}
.page-home .league-name{font-family:var(--font-display);font-weight:900;font-size:1.12rem;margin:0;color:var(--deep-brown);text-transform:uppercase}
.page-home .league-meta{font-family:var(--font-body);font-size:.76rem;color:rgba(44,30,22,.66)}
.page-home .snapshot-section{position:relative;background:linear-gradient(135deg,rgba(10,22,40,.98),rgba(15,34,60,.96)),repeating-linear-gradient(45deg,rgba(184,216,232,.04),rgba(184,216,232,.04) 2px,transparent 2px,transparent 8px);color:var(--cream);padding:6.5rem 0 7rem}
.page-home .snapshot-section::after{content:"03";position:absolute;left:2%;bottom:1rem;font-family:var(--font-display);font-weight:900;font-size:clamp(6rem,10vw,10rem);line-height:1;color:rgba(212,175,55,.04);pointer-events:none}
.page-home .snapshot-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr;gap:1.8rem}
.page-home .snapshot-card{background:rgba(245,235,221,.04);border:1px solid rgba(184,216,232,.18);border-top:4px solid var(--gold);border-radius:6px;padding:1.8rem 1.5rem 1.2rem;box-shadow:inset 0 1px 0 rgba(255,255,255,.04);display:flex;flex-direction:column}
.page-home .snapshot-head{display:flex;align-items:center;gap:.75rem;margin-bottom:.6rem}
.page-home .snapshot-index{font-family:var(--font-display);font-weight:900;font-size:.9rem;color:var(--ember-orange);background:rgba(230,126,34,.12);padding:.2rem .5rem;border-radius:2px}
.page-home .snapshot-card-title{font-family:var(--font-display);font-weight:900;font-size:1.3rem;margin:0;text-transform:uppercase;letter-spacing:.04em}
.page-home .snapshot-card p{font-family:var(--font-body);font-size:.92rem;line-height:1.75;color:var(--text-muted);margin:0 0 1.2rem}
.page-home .shot-bars{display:flex;flex-direction:column;gap:.85rem;padding:1.1rem 0 .7rem;border-bottom:1px solid rgba(184,216,232,.18);margin-bottom:1rem}
.page-home .bar-row{display:grid;grid-template-columns:2.5rem 1fr;align-items:center;gap:.7rem}
.page-home .bar-label{font-family:var(--font-body);font-size:.78rem;letter-spacing:.08em;color:rgba(245,235,221,.66)}
.page-home .bar-track{height:12px;border-radius:8px;background:rgba(184,216,232,.12);overflow:hidden}
.page-home .bar-fill{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--football-green),var(--glacier-blue));width:76%}
.page-home .away-fill{width:62%;background:linear-gradient(90deg,var(--gold),var(--ember-orange))}
.page-home .h2h-strip{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;font-family:var(--font-body);font-size:.84rem;color:rgba(245,235,221,.78);padding:.4rem 0 .6rem;border-bottom:1px solid rgba(184,216,232,.18);margin-bottom:1rem}
.page-home .strip-dot{width:12px;height:12px;border-radius:50%;display:inline-block}
.page-home .strip-home{background:var(--football-green)}
.page-home .strip-away{background:var(--gold)}
.page-home .snapshot-figure{margin:auto 0 0;position:relative}
.page-home .snapshot-figure img{display:block;width:100%;height:auto;border-radius:6px;margin-top:1rem;border:1px solid rgba(255,255,255,.08)}
.page-home .snapshot-figure::after{content:"";display:block;position:absolute;right:-6px;bottom:-6px;width:64%;height:18px;background:rgba(212,175,55,.14);z-index:-1}
.page-home .subscribe-section{position:relative;background:var(--deep-brown);padding:6.5rem 0;overflow:hidden}
.page-home .subscribe-section::before{content:"";position:absolute;top:-16%;right:-6%;width:40%;height:130%;background:linear-gradient(160deg,var(--gold),#b3912e);transform:skewX(-12deg)}
.page-home .subscribe-section::after{content:"04";position:absolute;bottom:-2rem;left:3%;font-family:var(--font-display);font-weight:900;font-size:clamp(5rem,9vw,8.5rem);line-height:1;color:rgba(212,175,55,.07);pointer-events:none}
.page-home .container{position:relative;z-index:1}
.page-home .subscribe-box{position:relative;z-index:1;background:rgba(10,22,40,.9);border:1px solid var(--gold-hair);padding:2.2rem 1.6rem 2rem;border-radius:4px;max-width:820px;box-shadow:0 24px 50px rgba(0,0,0,.4)}
.page-home .subscribe-title{font-family:var(--font-display);font-weight:900;font-size:clamp(1.6rem,4vw,2.6rem);line-height:1.1;text-transform:uppercase;color:var(--cream);margin:0 0 1rem}
.page-home .subscribe-desc{font-family:var(--font-body);font-size:.96rem;line-height:1.8;color:var(--text-muted);margin:0 0 1.6rem;max-width:38rem}
.page-home .subscribe-actions{display:flex;flex-wrap:wrap;gap:1rem}
.page-home .subscribe-actions .btn:active{transform:scale(.97)}
.page-home .subscribe-note{margin:1.6rem 0 0;font-family:var(--font-body);font-size:.78rem;line-height:1.6;color:rgba(245,235,221,.5);border-top:1px solid rgba(184,216,232,.12);padding-top:1rem}
.page-home .explore-section{background:var(--cream);color:var(--deep-brown);padding:6.5rem 0}
.page-home .explore-section::after{content:"05";position:absolute;right:2%;bottom:1rem;font-family:var(--font-display);font-weight:900;font-size:clamp(6rem,11vw,11rem);line-height:1;color:rgba(44,30,22,.05);pointer-events:none;z-index:0}
.page-home .explore-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr;gap:1rem}
.page-home .explore-card{position:relative;display:flex;flex-direction:column;justify-content:center;padding:1.5rem 1.4rem;background:#fff;border-left:4px solid var(--gold);box-shadow:var(--depth-b);text-decoration:none;color:inherit;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;min-height:150px}
.page-home .explore-card:hover{transform:translateY(-5px) rotate(.4deg);box-shadow:0 20px 38px rgba(44,30,22,.14);border-left-color:var(--stadium-red)}
.page-home .explore-index{font-family:var(--font-display);font-weight:900;color:var(--ember-orange);font-size:.9rem;letter-spacing:.12em}
.page-home .explore-name{font-family:var(--font-display);font-weight:900;font-size:1.45rem;text-transform:uppercase;margin:.7rem 0 .35rem;color:var(--deep-brown)}
.page-home .explore-desc{font-family:var(--font-body);font-size:.9rem;line-height:1.7;color:rgba(44,30,22,.7);margin:0}
@media (min-width:720px){
.page-home .home-hero{padding:7rem 3rem 4rem}
.page-home .hero-stats{grid-template-columns:repeat(4,minmax(0,1fr))}
.page-home .league-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.page-home .league-card{min-height:112px}
.page-home .explore-grid{grid-template-columns:repeat(2,1fr)}
.page-home .subscribe-box{padding:2.6rem 2.2rem 2.2rem}
}
@media (min-width:960px){
.page-home .league-layout{grid-template-columns:.85fr 1.15fr;gap:3rem}
.page-home .snapshot-grid{grid-template-columns:1fr 1fr;gap:2.8rem}
.page-home .snapshot-card{padding:2rem 1.8rem 1.4rem}
}
@media (min-width:1024px){
.page-home .explore-grid{grid-template-columns:repeat(3,1fr);gap:1.4rem}
.page-home .subscribe-section::before{width:34%}
}
@media (min-width:1200px){
.page-home .league-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
}
@media (max-width:767px){
.page-home .home-hero{padding:6rem 1.2rem 3.5rem}
.page-home .home-hero-bg{filter:saturate(.7) contrast(1.05)}
.page-home .hero-kicker{gap:.5rem}
.page-home .kicker-crumb{font-size:.7rem}
.page-home .hero-lead{font-size:.94rem}
.page-home .league-section{clip-path:none;padding:4.5rem 0 5rem}
.page-home .league-section::after{font-size:6rem}
.page-home .league-media{transform:none}
.page-home .league-grid{gap:.6rem}
.page-home .league-card{padding:.9rem .7rem .8rem;min-height:88px}
.page-home .league-name{font-size:.95rem}
.page-home .league-code{font-size:.64rem}
.page-home .league-badge{width:1.1rem;height:1.1rem}
.page-home .snapshot-section{padding:5rem 0 5.5rem}
.page-home .snapshot-section::after{font-size:5.5rem}
.page-home .snapshot-card{padding:1.4rem 1.1rem 1rem}
.page-home .subscribe-section{padding:5rem 0}
.page-home .subscribe-section::before{width:16%;right:-8%}
.page-home .subscribe-section::after{font-size:4.5rem;left:auto;right:8%}
.page-home .explore-section{padding:5rem 0}
}
@media (max-width:380px){
.page-home .league-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.page-home .stat-num{font-size:1.5rem}
.page-home .hero-actions{flex-direction:column;align-items:stretch}
.page-home .hero-actions .btn{text-align:center;justify-content:center}
}
