/* Design J — Retro Sport: cream/orange/navy, 70s stripes, Bebas varsity type */
:root{--cream:#f6efe1;--cream-2:#efe4cf;--navy:#1e3a5f;--orange:#e8622a;--gold:#f2b134;--ink:#1c1c1c;--mute:#5c5a55;--disp:'Bebas Neue',Impact,sans-serif;--body:'DM Sans',sans-serif}
*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}
body{font-family:var(--body);color:var(--ink);background:var(--cream);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}.wrap{max-width:1160px;margin:0 auto;padding:0 24px}
h1,h2,h3{font-family:var(--disp);line-height:.95;letter-spacing:.02em;font-weight:400}
h1{font-size:clamp(4rem,10vw,8rem)}h2{font-size:clamp(2.4rem,5vw,4rem);margin-bottom:36px}h3{font-size:1.6rem}
.o{color:var(--orange)}.sub{font-family:var(--body);font-size:.95rem;color:var(--mute);letter-spacing:0;margin-left:14px}
.sec{padding:90px 0}.sec-navy{background:var(--navy);color:#fff}.sec-navy h2{color:#fff}.sec-cream{background:var(--cream-2)}.sec-orange{background:var(--orange);color:#fff}
.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--disp);font-size:1.15rem;letter-spacing:.06em;padding:12px 24px;border-radius:6px;text-decoration:none;transition:transform .15s;white-space:nowrap}
.btn:hover{transform:translateY(-2px)}.btn-lg{padding:15px 30px;font-size:1.3rem}
.btn-navy{background:var(--navy);color:#fff}.btn-orange{background:var(--orange);color:#fff}.btn-cream{background:var(--cream);color:var(--navy)}.btn-outline{border:2px solid var(--navy);color:var(--navy)}
/* stripes */
.stripes{position:fixed;top:0;left:0;right:0;height:8px;display:flex;z-index:101}.stripes i{flex:1}.stripes i:nth-child(1){background:var(--orange)}.stripes i:nth-child(2){background:var(--gold)}.stripes i:nth-child(3){background:var(--navy)}
/* header */
.hdr{position:sticky;top:8px;z-index:100;background:var(--cream);border-bottom:2px solid var(--navy)}
.hdr-in{display:flex;align-items:center;gap:26px;height:70px}
.brand{font-family:var(--disp);font-size:1.6rem;letter-spacing:.06em;text-decoration:none;color:var(--navy)}.brand em{font-style:normal;color:var(--orange)}
.nav{display:flex;gap:22px;margin-left:auto}.nav a{color:var(--navy);text-decoration:none;font-weight:700;font-size:.9rem;text-transform:uppercase;letter-spacing:.06em}.nav a:hover{color:var(--orange)}
.hdr-cta{padding:8px 16px;font-size:1rem}
.burger{display:none;background:none;border:none;cursor:pointer;padding:8px}.burger span{display:block;width:26px;height:3px;background:var(--navy);margin:6px 0}
/* hero */
.hero{padding:70px 0 80px;position:relative}
.hero-in{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
.est{font-size:.75rem;letter-spacing:.2em;font-weight:700;color:var(--mute);display:block;margin-bottom:22px}
.hero p{font-size:1.1rem;color:var(--mute);margin:20px 0 30px;max-width:32rem}
.hero-btns{display:flex;gap:14px;flex-wrap:wrap}
.badges{display:flex;gap:10px;flex-wrap:wrap;margin-top:30px}
.badge{font-family:var(--disp);font-size:1rem;letter-spacing:.08em;background:var(--gold);color:var(--ink);padding:6px 14px;border-radius:999px}.b-o{background:var(--orange);color:#fff}.b-n{background:var(--navy);color:#fff}
.hero-visual{display:flex;justify-content:center}
.ring{width:min(100%,440px);aspect-ratio:1;border-radius:50%;overflow:hidden;border:10px solid var(--navy);outline:6px solid var(--orange);outline-offset:6px;box-shadow:0 30px 60px rgba(30,58,95,.25)}
.ring img{width:100%;height:100%;object-fit:cover;filter:sepia(.25) contrast(1.05)}
/* band */
.band{background:var(--navy);color:var(--cream);overflow:hidden;padding:12px 0;border-top:4px solid var(--orange);border-bottom:4px solid var(--gold)}
.band-track{display:flex;gap:30px;width:max-content;font-family:var(--disp);font-size:1.3rem;letter-spacing:.1em;animation:bd 28s linear infinite;white-space:nowrap}.band-track span:nth-child(even){color:var(--gold)}
@keyframes bd{to{transform:translateX(-50%)}}
/* cards */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.card{background:#fff;border:2px solid var(--navy);border-radius:14px;padding:26px;display:flex;flex-direction:column;gap:8px;box-shadow:5px 5px 0 var(--navy);transition:transform .15s,box-shadow .15s}
.card:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 var(--orange)}
.card p{color:var(--mute);font-size:.95rem}.card small{font-weight:700;letter-spacing:.1em;font-size:.75rem;color:var(--orange)}
.num{font-family:var(--disp);font-size:1.4rem;color:var(--orange);letter-spacing:.06em}
.card-navy{background:var(--navy);color:#fff;justify-content:center;align-items:flex-start}.card-navy p{color:#cfd8e3}.card-navy .btn{margin-top:10px}
.q{flex:1;font-size:1rem;color:var(--ink);font-weight:500}.who{font-family:var(--disp);letter-spacing:.08em;color:var(--navy);font-size:1.05rem}
.jersey{font-family:var(--disp);font-size:1.6rem;width:58px;height:58px;border-radius:50%;background:var(--orange);color:#fff;display:flex;align-items:center;justify-content:center;border:3px solid var(--navy);letter-spacing:.04em}
/* why */
.why-in{display:grid;grid-template-columns:.95fr 1.05fr;gap:56px;align-items:center}
.why-media img{border-radius:14px;border:4px solid var(--orange);aspect-ratio:4/3.3;object-fit:cover}
.list{list-style:none;margin:20px 0 32px}.list li{padding:11px 0 11px 30px;border-bottom:1px solid rgba(255,255,255,.15);position:relative;color:#dfe6ee}.list li::before{content:"★";position:absolute;left:0;color:var(--gold)}
/* assoc */
.assoc{display:flex;justify-content:center;align-items:center;gap:clamp(20px,4vw,50px);flex-wrap:wrap;margin:52px 0 20px}.assoc img{height:52px;width:auto;object-fit:contain;background:#fff;padding:6px 10px;border-radius:8px;border:2px solid var(--navy)}
.ins{text-align:center;font-weight:700;font-size:.82rem;letter-spacing:.06em;color:var(--mute)}.ins a{color:var(--orange)}
/* contact */
.contact-in{text-align:center;display:flex;flex-direction:column;align-items:center;gap:14px}.sec-orange h2{color:#fff;font-size:clamp(3.5rem,8vw,6.5rem);margin:0}.contact-in p{color:rgba(255,255,255,.9);font-size:1.05rem}.contact-in .hero-btns{justify-content:center;margin-top:8px}
.foot{background:var(--navy);color:#9fb0c3;font-family:var(--disp);letter-spacing:.1em;font-size:.95rem;padding:22px 0;text-align:center}
.reveal{opacity:0;transform:translateY(20px);transition:opacity .5s,transform .5s}.reveal.in{opacity:1;transform:none}
@media(max-width:1000px){.grid3{grid-template-columns:1fr 1fr}.grid4{grid-template-columns:1fr 1fr}}
@media(max-width:800px){.hero-in,.why-in{grid-template-columns:1fr;gap:40px}.hero-visual{order:-1}.nav{display:none;position:absolute;top:70px;left:0;right:0;background:var(--cream);border-bottom:2px solid var(--navy);flex-direction:column;gap:0;padding:8px 24px 16px}.nav.open{display:flex}.nav a{padding:12px 0;border-bottom:1px solid var(--cream-2)}.burger{display:block;margin-left:auto}.hdr-cta{display:none}}
@media(max-width:560px){.grid3,.grid4{grid-template-columns:1fr}}
