:root{--navy:#0A1628;--navy2:#0F1E35;--navy3:#07101F;--silver:#C3CAD4;--muted:#A9B4C6;--line:#22324D;--light:#EEF1F5;--ink:#0A1628;--ink2:#33415A;--display:Anton,Impact,'Arial Narrow',sans-serif;--body:Barlow,'Helvetica Neue',Arial,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--navy);color:#fff;font-family:var(--body);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}a:hover{opacity:.85}
img{max-width:100%}
.wrap{max-width:1320px;margin:0 auto;padding:0 24px}
.eyebrow{font-size:14px;font-weight:700;letter-spacing:4px;color:var(--muted);text-transform:uppercase}
.display{font-family:var(--display);font-weight:400;margin:0;line-height:.95;text-transform:uppercase}
.hl{color:var(--silver)}
.btn{display:inline-block;padding:18px 30px;font-weight:700;letter-spacing:2px;font-size:15px;text-transform:uppercase}
.btn-silver{background:var(--silver);color:var(--navy)}
.btn-outline{border:2px solid var(--silver);color:var(--silver)}
.btn-navy{background:var(--navy);color:#fff}
/* header */
.site-header{position:sticky;top:0;z-index:20;background:var(--navy);border-bottom:1px solid var(--line)}
.site-header .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding-top:14px;padding-bottom:14px}
.brand{display:flex;align-items:center;gap:12px}
.brand img{width:46px;display:block}
.brand span{display:flex;flex-direction:column;line-height:1}
.brand strong{font-family:var(--display);font-weight:400;font-size:22px;letter-spacing:1px}
.brand small{font-size:12px;font-weight:700;letter-spacing:3px;color:var(--muted)}
.mainnav{display:flex;flex-wrap:wrap;align-items:center;gap:4px 18px;font-weight:700;font-size:14px;letter-spacing:1px;text-transform:uppercase}
.mainnav a{padding:12px 0;border-bottom:2px solid transparent}
.mainnav a.active{border-bottom-color:var(--silver)}
.mainnav a.cta{padding:12px 18px;background:var(--silver);color:var(--navy);border:0}
.menu-btn{display:none;background:none;border:2px solid var(--silver);color:var(--silver);font:700 14px var(--body);letter-spacing:2px;padding:10px 16px;cursor:pointer}
@media (max-width:1360px){.menu-btn{display:block}.mainnav{display:none;width:100%;flex-direction:column;align-items:flex-start}.mainnav.open{display:flex}}
/* photo helpers */
.cover{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.shade-left{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,22,40,.92) 0%,rgba(10,22,40,.55) 55%,rgba(10,22,40,.2) 100%),linear-gradient(0deg,rgba(10,22,40,.85) 0%,rgba(10,22,40,0) 50%)}
.shade-bottom{position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,22,40,.95) 0%,rgba(10,22,40,.4) 45%,rgba(10,22,40,0) 70%)}
/* home */
.hero{position:relative;min-height:46rem;display:flex;align-items:flex-end;overflow:hidden}
.hero .inner{position:relative;width:100%;padding-top:96px;padding-bottom:72px;display:flex;flex-direction:column;gap:28px}
.hero h1{font-size:clamp(3rem,10vw,9.5rem);line-height:.92;letter-spacing:1px}
.hero p{margin:0;font-size:22px;line-height:1.4;color:#D5DCE8;max-width:30rem}
.hero .eyebrow{color:var(--silver)}
.row{display:flex;flex-wrap:wrap;gap:16px;align-items:center}
.ticker{background:var(--silver);color:var(--navy);white-space:nowrap;overflow:hidden;font-family:var(--display);font-size:26px;letter-spacing:3px;padding:14px 0;text-align:center}
.intro{padding-top:120px;padding-bottom:64px;display:flex;flex-wrap:wrap;gap:48px;align-items:flex-end}
.intro>div{flex:1 1 520px;display:flex;flex-direction:column;gap:20px}
.intro h2{font-size:clamp(3rem,7vw,6.5rem)}
.intro p{flex:1 1 360px;margin:0;font-size:20px;line-height:1.6;color:#D5DCE8}
.wide-photo{display:block;width:100%;height:clamp(18rem,38vw,34rem);object-fit:cover;object-position:50% 35%}
.teams{background:#fff;color:var(--ink);padding:120px 0}
.teams .head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:48px}
.teams .head .eyebrow{color:#4A5B78;margin-bottom:16px;display:block}
.teams h2{font-size:clamp(3rem,6vw,5.5rem)}
.teams .head p{margin:0;font-size:19px;line-height:1.5;color:var(--ink2);max-width:22rem}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.card{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:30rem;padding:28px;background:var(--navy);color:#fff;overflow:hidden}
.card>span{position:relative}
.card .tag{font-size:14px;font-weight:700;letter-spacing:3px;color:var(--silver)}
.card .name{font-family:var(--display);font-size:56px;line-height:1.05}
.card .go{font-weight:700;letter-spacing:2px;font-size:13px;margin-top:8px}
.split{display:flex;flex-wrap:wrap}
.split .photo{flex:1 1 520px;min-height:36rem;position:relative;overflow:hidden}
.split .text{flex:1 1 480px;padding:96px 48px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:24px;background:var(--navy2)}
.split h2{font-size:clamp(2.8rem,5vw,4.8rem);line-height:.98}
.split p{margin:0;font-size:19px;line-height:1.6;color:#D5DCE8;max-width:30rem}
.more{padding-top:120px;padding-bottom:120px}
.more h2{font-size:clamp(3rem,6vw,5.5rem);margin:16px 0 48px}
.list{border-top:1px solid var(--line)}
.list a{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 32px;padding:28px 4px;border-bottom:1px solid var(--line)}
.list .n{font-weight:700;font-size:15px;letter-spacing:2px;color:var(--silver);width:2.5rem}
.list .t{font-family:var(--display);font-size:clamp(2rem,4vw,3.2rem);line-height:1.1;flex:1 1 18rem}
.list .s{font-size:15px;font-weight:700;letter-spacing:2px;color:var(--muted);text-transform:uppercase}
/* inner pages */
.page-hero{position:relative;min-height:30rem;display:flex;align-items:flex-end;overflow:hidden;background:var(--navy)}
.page-hero .inner{position:relative;width:100%;padding-top:72px;padding-bottom:56px;display:flex;flex-direction:column;gap:20px}
.crumbs{display:flex;flex-wrap:wrap;gap:8px 28px;font-size:13px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:#D5DCE8}
.crumbs a{color:#fff}
.page-hero h1{font-size:clamp(2.75rem,11vw,10rem);line-height:.9}
.page-hero p{margin:0;font-size:20px;line-height:1.5;max-width:34rem;color:#E6EBF2}
.body-light{background:var(--light);color:var(--ink);padding:96px 0 120px}
.body-light .grid{display:grid;grid-template-columns:minmax(200px,1fr) 3fr;gap:48px}
@media (max-width:820px){.body-light .grid{grid-template-columns:1fr;gap:28px}}
.side .eyebrow{color:#4A5B78;font-size:12px}
.side h3{font-family:var(--display);font-weight:400;font-size:28px;line-height:1.05;margin:16px 0 0;text-transform:uppercase}
.content{max-width:44rem}
.content .eyebrow{color:#4A5B78;font-size:12px}
.content h2{font-size:clamp(2.6rem,6vw,4.8rem);margin:16px 0 24px;color:var(--ink)}
.content p{font-size:19px;line-height:1.6;color:var(--ink2);margin:0 0 32px}
.note{display:flex;flex-wrap:wrap;gap:8px 40px;border-top:1px solid #C9D1DC;border-bottom:1px solid #C9D1DC;padding:20px 0;margin-bottom:40px;font-size:18px}
.note .eyebrow{font-size:12px;padding-top:4px}
.tabs{display:flex;flex-wrap:wrap;gap:4px 32px;border-bottom:1px solid #C9D1DC;margin-bottom:40px}
.tabs button{background:none;border:0;border-bottom:3px solid transparent;padding:12px 0;margin-bottom:-1px;font:400 22px var(--display);letter-spacing:1px;text-transform:uppercase;color:#6B7A92;cursor:pointer}
.tabs button[aria-selected=true]{color:var(--ink);border-bottom-color:var(--ink)}
.panel[hidden]{display:none}
.soon{display:inline-block;border-top:1px solid #C9D1DC;padding-top:18px;font-size:13px;font-weight:700;letter-spacing:3px;color:var(--ink)}
table.roster{width:100%;border-collapse:collapse;font-size:17px;margin-bottom:32px}
table.roster th{text-align:left;font-size:12px;letter-spacing:2px;text-transform:uppercase;color:#4A5B78;padding:10px 8px;border-bottom:2px solid var(--ink)}
table.roster td{padding:14px 8px;border-bottom:1px solid #C9D1DC}
.cta-band{padding:110px 0}
.cta-band h2{font-size:clamp(3.5rem,9vw,8rem);line-height:.9;margin:20px 0 40px}
.cta-band .row a.small{font-weight:700;letter-spacing:2px;font-size:14px;text-transform:uppercase;color:var(--muted);padding:12px 0}
/* footer */
footer{background:var(--navy3);border-top:1px solid var(--line)}
footer .top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:40px;padding-top:80px;padding-bottom:56px}
footer .brandf{display:flex;align-items:center;gap:18px}
footer .brandf img{width:80px;display:block}
footer .brandf span{font-family:var(--display);font-size:34px;line-height:1}
footer .tagline{font-family:var(--display);font-size:clamp(2rem,4.5vw,4rem);line-height:1;color:var(--silver);text-align:right}
@media (max-width:700px){footer .tagline{text-align:left}}
footer .bottom{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;border-top:1px solid var(--line);padding-top:20px;padding-bottom:32px;font-size:13px;color:var(--muted)}
footer .bottom nav{display:flex;flex-wrap:wrap;gap:4px 24px}
footer .bottom nav a,footer .bottom>a{padding:10px 0;color:#D5DCE8}

/* North County Classic */
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:20px;border-top:1px solid #C9D1DC;padding-top:28px}
.facts strong{display:block;margin-top:10px;font-family:var(--display);font-weight:400;font-size:26px;line-height:1.15;color:var(--ink)}
.pools-wrap{padding-top:96px}
.sec{font-size:clamp(2.6rem,6vw,4.8rem);color:var(--ink);margin-bottom:32px}
.navy-hl{color:#5B6B85}
.pools{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.pool{background:#fff;padding:28px;border-top:4px solid var(--ink)}
.pool .eyebrow{color:#4A5B78}
.pool ul{list-style:none;margin:16px 0 0;padding:0}
.pool li{font-family:var(--display);font-size:26px;line-height:1.2;padding:10px 0;border-bottom:1px solid #E1E6ED;text-transform:uppercase;color:var(--ink)}
.pool li:last-child{border-bottom:0}
.pool li strong{font-weight:400;color:var(--ink);border-left:4px solid var(--silver);padding-left:10px;margin-left:-14px}
.footnote{font-size:15px;color:var(--ink2);margin:14px 0 48px}
.rules{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px 40px}
.rules div{display:flex;gap:16px;border-top:1px solid #C9D1DC;padding-top:18px}
.rules .n{font-weight:700;letter-spacing:2px;color:#4A5B78;font-size:14px;padding-top:3px}
.rules p{margin:0;font-size:17px;line-height:1.55;color:var(--ink2)}
.schedule{padding:110px 0 120px}
.sec-dark{font-size:clamp(3rem,7vw,6rem);margin:16px 0 20px}
.legend{display:flex;align-items:center;gap:12px;font-size:16px;color:#D5DCE8;margin:0 0 48px;flex-wrap:wrap}
.swatch{width:28px;height:14px;background:var(--silver);display:inline-block}
.days{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,520px),1fr));gap:48px 56px}
.day h3{margin:0;font-family:var(--display);font-weight:400;font-size:34px;text-transform:uppercase;border-bottom:2px solid var(--silver);padding-bottom:10px}
.day h3 span{color:var(--silver)}
.daynote{display:block;margin-top:10px;font-size:13px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--muted)}
.day ul{list-style:none;margin:8px 0 0;padding:0}
.game{display:grid;grid-template-columns:5.5rem 4.5rem 1fr;gap:4px 12px;align-items:baseline;padding:14px 10px;border-bottom:1px solid var(--line)}
.game .time{font-weight:700;font-size:15px;color:#D5DCE8}
.game .lvl{font-size:12px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--muted)}
.game .match{font-size:18px;line-height:1.35}
.game .match strong{font-weight:700}
.game .at{color:var(--muted);padding:0 2px}
.game .where{grid-column:3;font-size:13px;color:var(--muted)}
.game.knights{background:var(--silver);color:var(--navy);border-bottom-color:var(--silver)}
.game.knights .time,.game.knights .lvl,.game.knights .at,.game.knights .where{color:#33415A}
.game.champ .match{font-family:var(--display);font-size:22px;text-transform:uppercase;color:var(--silver)}
@media (max-width:520px){.game{grid-template-columns:5rem 1fr}.game .lvl{grid-column:2}.game .match,.game .where{grid-column:1 / -1}}

.wide-photo.pano{height:auto;aspect-ratio:2000/764;min-height:14rem;object-position:50% 50%}

/* Records */
.recs-wrap{padding-top:96px}
.recs{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.rec{background:#fff;padding:24px 24px 22px;border-top:4px solid var(--ink);display:flex;flex-direction:column;gap:6px;color:var(--ink)}
.rec-label{font-size:12px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#4A5B78}
.rec-val{font-family:var(--display);font-size:64px;line-height:1;margin-top:6px}
.rec-who{font-family:var(--display);font-size:22px;text-transform:uppercase;line-height:1.15}
.rec-yr{font-size:15px;font-weight:600;color:var(--ink2)}

/* Coaches */
.head-coach{display:grid;grid-template-columns:minmax(240px,2fr) 3fr;gap:48px;align-items:start}
@media (max-width:820px){.head-coach{grid-template-columns:1fr;gap:28px}}
.coach-photo{background:var(--navy);display:flex;align-items:center;justify-content:center;aspect-ratio:4/5;overflow:hidden}
.coach-photo img{width:100%;height:100%;object-fit:cover;display:block}
.coach-photo span{font-family:var(--display);font-size:56px;color:var(--silver);letter-spacing:2px}
.coach-photo.big span{font-size:96px}
.coach-body .eyebrow{color:#4A5B78;font-size:12px}
.head-coach h2{font-size:clamp(3rem,7vw,6rem);color:var(--ink);margin:12px 0 28px}
.head-coach p{font-size:18px;line-height:1.65;color:var(--ink2);margin:0 0 18px;max-width:44rem}
.head-coach .btn{margin-top:16px}
.coach-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:16px;border-top:1px solid #C9D1DC;border-bottom:1px solid #C9D1DC;padding:20px 0;margin-bottom:28px}
.coach-stats strong{display:block;font-family:var(--display);font-weight:400;font-size:44px;line-height:1;color:var(--ink)}
.coach-stats span{display:block;margin-top:6px;font-size:12px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#4A5B78}
.staff{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px}
.coach{background:#fff;color:var(--ink);border-top:4px solid var(--ink)}
.coach .coach-photo{aspect-ratio:1/1}
.coach-body{padding:0}
.coach>.coach-body{padding:22px 24px 26px}
.coach h3{font-family:var(--display);font-weight:400;font-size:32px;line-height:1.05;margin:8px 0 0;text-transform:uppercase}
.coach p{font-size:15px;line-height:1.6;color:var(--ink2);margin:14px 0 0}
.staff{align-items:start}

/* Tryouts */
.must{background:var(--ink);color:#fff;padding:22px 26px;display:flex;flex-direction:column;gap:6px;border-left:6px solid var(--silver)}
.must strong{font-family:var(--display);font-weight:400;font-size:26px;text-transform:uppercase;letter-spacing:.5px}
.must span{font-size:16px;color:#D5DCE8}
.tryouts-wrap{padding-top:96px}
.tries{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.try{background:#fff;border-top:4px solid var(--ink);padding:26px 26px 18px;color:var(--ink)}
.try h3{font-family:var(--display);font-weight:400;font-size:34px;margin:0 0 10px;text-transform:uppercase}
.try ul{list-style:none;margin:0;padding:0}
.try li{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:14px 0;border-top:1px solid #E1E6ED}
.try li span{font-size:13px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#4A5B78;padding-top:4px}
.try li strong{font-size:19px}
.rules p strong{color:var(--ink)}
