/* =============================================================
   Buffalo eXtreme — approved design system (mockup "final" F1–F16)
   Base: Direction B · C4 roster cards · red ticker · championship
   season-ticket marketing. Oswald + Open Sans.
   ============================================================= */
:root {
  --red: #ab0f27;
  --red-bright: #d41428;
  --black: #0b0b0d;
  --panel: #101116;
  --panel-line: #23252c;
  --ink: #111;
  --ink-soft: #374151;
  --gray: #6b7280;
  --gray-soft: #9ca3af;
  --line: #e5e7eb;
  --bg: #f7f7f8;
  --white: #fff;
  --grad-red: linear-gradient(135deg, #ab0f27, #d41428);
  --shadow: 0 2px 10px rgba(17, 24, 39, .07);
  --shadow-hover: 0 14px 30px rgba(17, 24, 39, .14);
  --oswald: 'Oswald', 'Arial Narrow', sans-serif;
  --sans: 'Open Sans', system-ui, sans-serif;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: var(--sans); color: var(--ink); background: var(--bg); line-height: 1.55; }
h1, h2, h3, h4 { font-family: var(--oswald); text-transform: uppercase; }
img { max-width: 100%; }
a { color: var(--red); }
.angled { clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%); }

/* ---- header ---- */
.site-header { background: var(--black); position: sticky; top: 0; z-index: 60; }
.header-inner { max-width: 1150px; margin: 0 auto; display: flex; align-items: stretch;
  justify-content: space-between; height: 78px; padding-left: 20px; }
.brand { display: flex; align-items: center; gap: 14px; text-decoration: none; }
.brand .wordmark { height: 40px; width: auto; }
.site-nav { display: flex; align-items: stretch; }
.site-nav a { display: flex; align-items: center; font: 600 14px var(--oswald); letter-spacing: 2px;
  text-transform: uppercase; color: #cfcfd4; text-decoration: none; padding: 0 15px;
  border-bottom: 3px solid transparent; }
.site-nav a:hover, .site-nav a.on { color: var(--white); border-bottom-color: var(--red-bright); }
.site-nav a.nav-cta { background: var(--grad-red); color: var(--white); padding: 0 26px;
  clip-path: polygon(12% 0, 100% 0, 100% 100%, 0 100%); margin-left: 16px; border-bottom: 0; }
.nav-toggle { display: none; background: none; border: 0; color: var(--white);
  font-size: 1.7rem; cursor: pointer; padding: 0 18px; }
@media (max-width: 1000px) {
  .nav-toggle { display: block; }
  .site-nav { display: none; }
  body.nav-open .site-nav { display: flex; flex-direction: column; position: absolute;
    top: 78px; left: 0; right: 0; background: var(--black); border-top: 1px solid var(--panel-line);
    padding: 10px 0 16px; }
  body.nav-open .site-nav a { padding: 14px 24px; border-bottom: 0; border-left: 3px solid transparent; }
  body.nav-open .site-nav a:hover, body.nav-open .site-nav a.on { border-left-color: var(--red-bright); }
  body.nav-open .site-nav a.nav-cta { clip-path: none; margin: 10px 24px 0; justify-content: center; padding: 14px; }
}

/* ---- hero (home) ---- */
.hero { position: relative; background: var(--black); overflow: hidden; color: var(--white); }
.hero::after { content: ''; position: absolute; right: -8%; top: 0; bottom: 0; width: 58%;
  background: url('/media/players/mccrea-javon-bg.jpg') center 25%/cover;
  clip-path: polygon(18% 0, 100% 0, 100% 100%, 0 100%); opacity: .85; }
.hero::before { content: attr(data-watermark); position: absolute; left: -10px; bottom: -28px;
  z-index: 1; font: 700 19vw/1 var(--oswald); color: rgba(255,255,255,.05); letter-spacing: -5px; }
.hero-inner { position: relative; z-index: 2; max-width: 1150px; margin: 0 auto; padding: 90px 20px 100px; }
.hero-chip { display: inline-flex; align-items: center; gap: 10px; background: rgba(212,20,40,.15);
  border: 1px solid var(--red-bright); border-radius: 999px; padding: 6px 16px;
  font: 600 13px var(--oswald); letter-spacing: 2px; text-transform: uppercase; }
.hero-chip b { color: var(--red-bright); }
.hero h1 { font-size: clamp(46px, 7.5vw, 92px); line-height: .92; margin: 18px 0 8px; }
.hero h1 em { font-style: normal; color: transparent; -webkit-text-stroke: 2px var(--red-bright); }
.hero p { max-width: 500px; color: #c9c9cf; font-size: 17px; }
@media (max-width: 700px) { .hero::after { width: 100%; opacity: .25; clip-path: none; } }

/* ---- buttons ---- */
.btn { display: inline-block; font: 700 14px var(--oswald); letter-spacing: 2px;
  text-transform: uppercase; text-decoration: none; padding: 15px 32px; border: 0; cursor: pointer; }
.btn + .btn { margin-left: 10px; }
.btn-red { background: var(--grad-red); color: var(--white);
  clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%); }
.btn-line { color: inherit; border: 2px solid rgba(255,255,255,.4); }
.btn-line:hover { border-color: currentColor; }
.btn-sm { padding: 11px 22px; font-size: 12px; }

/* ---- ticker ---- */
.ticker { position: relative; background: linear-gradient(90deg, #ab0f27, #d41428, #ab0f27);
  border-top: 2px solid var(--black); font: 600 13px var(--oswald); letter-spacing: 2px;
  text-transform: uppercase; padding: 12px 0; white-space: nowrap; overflow: hidden; color: var(--white); }
.ticker span { display: inline-block; padding-left: 100%; animation: tick 48s linear infinite; }
@keyframes tick { to { transform: translateX(-100%); } }

/* ---- sections ---- */
.section { max-width: 1150px; margin: 0 auto; padding: 52px 20px 4px; }
.section-title { font: 600 30px var(--oswald); margin: 0 0 22px; padding-bottom: 12px; position: relative; }
.section-title::after { content: ''; position: absolute; left: 0; bottom: 0; width: 64px; height: 4px;
  background: var(--grad-red); border-radius: 2px; }
.section-sub { color: var(--gray); margin: -12px 0 22px; font-size: 15px; }
.section-more { margin: 16px 0 0; font-weight: 600; }
.page-head { background: var(--black); color: var(--white); padding: 44px 20px; text-align: center; }
.record-chips { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; margin-top: 18px; }
.record-chip { border: 1px solid #2a2d35; border-radius: 12px; padding: 10px 22px; text-align: center; min-width: 110px; }
.record-chip.gold { border-color: #e2b93b; background: rgba(226,185,59,.08); }
.record-chip .v { font: 700 26px var(--oswald); color: #e2b93b; line-height: 1.1; }
.record-chip .k { font: 700 10px var(--sans); color: var(--gray-soft); letter-spacing: 2px; text-transform: uppercase; }
.page-head h1 { font-size: clamp(32px, 5vw, 52px); margin: 0; line-height: 1; text-align: center; }
.page-head p { display: inline-flex; align-items: center; gap: 14px; margin: 14px auto 0;
  font: 600 13px var(--oswald); letter-spacing: 3px; text-transform: uppercase; color: var(--gray-soft); }
.page-head p::before, .page-head p::after { content: ''; width: 34px; height: 3px;
  background: var(--grad-red); border-radius: 2px; flex: none; }
.empty { color: var(--gray); font-style: italic; }

/* ---- schedule cards (B3) ---- */
.game-list { display: flex; flex-direction: column; gap: 22px; }
.game-card { display: grid; grid-template-columns: 56px 150px 1fr 210px; background: var(--white);
  border-radius: 14px; overflow: hidden; box-shadow: var(--shadow); }
.game-card.is-cancelled { opacity: .55; }
.gc-side { display: flex; align-items: center; justify-content: center; writing-mode: vertical-rl; }
.gc-side span { font: 600 14px var(--oswald); letter-spacing: 4px; text-transform: uppercase; }
.gc-side-home { background: var(--black); } .gc-side-home span { color: var(--white); }
.gc-side-away { background: #e7e8ea; } .gc-side-away span { color: var(--gray); }
.gc-side-playoff { background: linear-gradient(180deg, #ab0f27, #d41428); }
.gc-side-playoff span { color: var(--white); font-size: 12px; letter-spacing: 2px; }
.gc-left { display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 10px; padding: 26px 18px; border-right: 1px dashed var(--line); }
.gc-wl { width: 54px; height: 54px; border-radius: 50%; display: flex; align-items: center;
  justify-content: center; font: 600 26px var(--oswald); color: var(--white); flex: none; }
.gc-wl-w { background: #10b981; box-shadow: 0 0 0 4px rgba(16,185,129,.18); }
.gc-wl-l { background: #ef4444; box-shadow: 0 0 0 4px rgba(239,68,68,.18); }
.gc-date { text-align: center; }
.gc-date .dow { font: 700 12px var(--sans); color: var(--gray); text-transform: uppercase; }
.gc-date .d { font: 600 22px var(--oswald); text-transform: uppercase; }
.gc-date .t { font: 700 12px var(--sans); color: var(--red); }
.gc-center { display: flex; align-items: center; justify-content: center; gap: 44px; padding: 26px; min-width: 0; }
.gc-team { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
.gc-team img { max-width: 110px; max-height: 110px; object-fit: contain;
  filter: drop-shadow(0 6px 8px rgba(0,0,0,.12)); }
.gc-team .n { font: 600 17px var(--oswald); text-transform: uppercase; }
.gc-score { font: 700 44px var(--oswald); display: flex; gap: 14px; align-items: center;
  font-variant-numeric: tabular-nums; }
.gc-score .sep { color: #d1d5db; font-size: 30px; }
.gc-vs { font: 700 22px var(--oswald); color: #d1d5db; }
.gc-right { display: flex; flex-direction: column; justify-content: center; gap: 10px; padding: 26px 26px 26px 0; }
.gc-btn { display: block; text-align: center; text-decoration: none; font: 600 13px var(--oswald);
  letter-spacing: 2px; text-transform: uppercase; padding: 14px 22px;
  clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%); }
.gc-btn-tix { background: var(--grad-red); color: var(--white); }
.gc-btn-dark { background: var(--black); color: var(--white); }
.gc-btn-lite { background: #eef0f2; color: var(--ink); }
.gc-note { text-align: center; }
.gc-note .big { font: 600 24px var(--oswald); text-transform: uppercase; }
.gc-note .sub { color: var(--gray); font-size: 14px; }
.game-card.coming-soon { border: 2px dashed #d1d5db; box-shadow: none; background: var(--white); }
@media (max-width: 900px) {
  .game-card { grid-template-columns: 44px 1fr; }
  .gc-left { grid-column: 2; flex-direction: row; justify-content: space-between;
    border-right: 0; border-bottom: 1px dashed var(--line); padding: 16px 20px; }
  .gc-center { grid-column: 2; gap: 18px; padding: 18px; }
  .gc-team img { max-width: 70px; max-height: 70px; }
  .gc-score { font-size: 32px; }
  .gc-right { grid-column: 2; flex-direction: row; padding: 0 18px 18px; flex-wrap: wrap; }
  .gc-side { grid-row: 1 / span 3; }
}

/* ---- toggle tabs ---- */
.toggle { display: inline-flex; background: var(--white); border: 1px solid var(--line);
  border-radius: 999px; padding: 4px; margin-bottom: 22px; }
.toggle-btn { border: 0; background: none; padding: 10px 26px; border-radius: 999px;
  font: 600 13px var(--oswald); letter-spacing: 2px; text-transform: uppercase;
  cursor: pointer; color: var(--gray); }
.toggle-btn.is-active { background: var(--black); color: var(--white); }

/* ---- roster cards (C4 trading cards) ---- */
.roster-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
@media (max-width: 1024px) { .roster-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .roster-grid { grid-template-columns: 1fr; } }
.roster-card { position: relative; background: linear-gradient(180deg, #16181f, #101116);
  border: 1px solid var(--panel-line); border-radius: 16px; overflow: hidden; color: #e8e8ec;
  text-decoration: none; display: block;
  transition: transform .18s, border-color .18s, box-shadow .18s; }
.roster-card:hover { transform: translateY(-6px); border-color: var(--red-bright);
  box-shadow: 0 18px 40px rgba(212,20,40,.28); }
.rc-photo { position: relative; aspect-ratio: 1/1; background: linear-gradient(160deg, #16181d 30%, var(--red) 140%); }
.rc-photo::after { content: ''; position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 55%, #101116 98%); }
.rc-photo img { width: 100%; height: 100%; object-fit: cover; object-position: top; display: block; }
.rc-num { position: absolute; top: 12px; left: 16px; font: 700 44px/1 var(--oswald);
  color: var(--red-bright); text-shadow: 0 0 18px rgba(212,20,40,.7); }
.rc-body { padding: 0 18px 18px; margin-top: -34px; position: relative; text-align: center; }
.rc-first { font: 500 13px var(--oswald); letter-spacing: 4px; color: #8b8f99; text-transform: uppercase; }
.rc-last { font: 600 30px var(--oswald); text-transform: uppercase; line-height: 1; color: var(--white); }
.rc-pos { font: 700 11px var(--sans); color: var(--red-bright); letter-spacing: 2px;
  text-transform: uppercase; margin: 4px 0 14px; }
.rc-stats { display: flex; justify-content: space-around; border-top: 1px solid var(--panel-line); padding-top: 12px; }
.rc-stats .v { font: 600 24px var(--oswald); color: var(--white); }
.rc-stats .k { font: 700 10px var(--sans); color: #8b8f99; letter-spacing: 1px; text-transform: uppercase; }

/* ---- staff cards ---- */
.staff-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
@media (max-width: 900px) { .staff-grid { grid-template-columns: 1fr; } }
.staff-card { background: var(--white); border-radius: 16px; overflow: hidden; box-shadow: var(--shadow);
  transition: transform .18s, box-shadow .18s; }
.staff-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-hover); }
.staff-card .ph { aspect-ratio: 1/1; overflow: hidden; background: var(--black); }
.staff-card .ph img { width: 100%; height: 100%; object-fit: cover; object-position: top; display: block; }
.staff-card .nm { padding: 16px 18px 18px; text-align: center; }
.staff-card .nm .l { font: 600 24px var(--oswald); text-transform: uppercase; line-height: 1.05; }
.staff-card .nm .r { font: 700 11px var(--sans); color: var(--red-bright); letter-spacing: 2px;
  text-transform: uppercase; margin-top: 3px; }

/* ---- player hero (B5) ---- */
.player-hero { position: relative; background: var(--black) var(--hero-image, none) center 20%/cover;
  overflow: hidden; color: var(--white); }
.player-hero::before { content: ''; position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(11,11,13,.96) 30%, rgba(171,15,39,.72)); }
.ph-num { position: absolute; right: 2%; top: 50%; transform: translateY(-50%);
  font: 700 34vw/1 var(--oswald); color: transparent; -webkit-text-stroke: 3px rgba(255,255,255,.09); }
.player-hero-inner { position: relative; max-width: 1150px; margin: 0 auto; padding: 56px 20px;
  display: flex; gap: 44px; align-items: flex-end; flex-wrap: wrap; }
.player-headshot { width: 270px; border-radius: 12px; box-shadow: 0 20px 50px rgba(0,0,0,.5); }
.player-kick { font: 600 14px var(--oswald); letter-spacing: 4px; color: var(--red-bright); text-transform: uppercase; }
.player-hero h1 { font-size: clamp(42px, 6vw, 74px); line-height: .95; margin: 6px 0 16px; }
.stat-pills { display: flex; gap: 10px; flex-wrap: wrap; }
.stat-pill { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18);
  border-radius: 10px; padding: 10px 18px; text-align: center; backdrop-filter: blur(4px); }
.stat-pill .v { font: 600 26px var(--oswald); }
.stat-pill .k { font: 700 10px var(--sans); color: #cbd0d6; letter-spacing: 1px; text-transform: uppercase; }
.player-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 18px 32px; margin: 0 0 26px; }
.player-facts .lab { display: block; font: 600 11px var(--sans); color: var(--gray);
  letter-spacing: 1.5px; text-transform: uppercase; }
.player-facts .val { display: block; font: 500 20px var(--oswald); margin-top: 2px; }
.player-jump select { padding: 10px 12px; border-radius: 8px; border: 1px solid var(--line);
  font: 600 13px var(--sans); background: var(--white); }
.player-bio { max-width: 46rem; margin-bottom: 26px; color: var(--ink-soft); }

/* ---- stats tables ---- */
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; background: var(--white);
  border-radius: 14px; box-shadow: var(--shadow); }
.stats-table { border-collapse: collapse; width: 100%; font-variant-numeric: tabular-nums; white-space: nowrap; }
.stats-table th, .stats-table td { padding: 12px 14px; text-align: right; border-bottom: 1px solid var(--line); }
.stats-table th:first-child, .stats-table td:first-child { text-align: left; }
.stats-table thead th { background: var(--black); color: var(--white); font: 600 12px var(--oswald);
  letter-spacing: 1.5px; text-transform: uppercase; position: sticky; top: 0; }
.stats-table tbody tr:hover { background: var(--bg); }
.stats-table a { text-decoration: none; font-weight: 600; }
th.sortable { cursor: pointer; user-select: none; }
th.sortable[data-dir="desc"]::after { content: " ▾"; }
th.sortable[data-dir="asc"]::after { content: " ▴"; }

/* ---- game page hero ---- */
.game-hero { background: var(--black); color: var(--white); display: flex; justify-content: center;
  align-items: center; gap: clamp(16px, 6vw, 64px); padding: 48px 20px; text-align: center; flex-wrap: wrap; }
.game-hero-team img { height: 96px; object-fit: contain; filter: drop-shadow(0 6px 12px rgba(0,0,0,.5)); }
.game-hero-team h2 { margin: 8px 0 0; font-size: 22px; }
.gh-score { font: 700 56px var(--oswald); color: var(--red-bright); font-variant-numeric: tabular-nums; }
.gh-at { font-size: 24px; color: var(--gray); font: 700 24px var(--oswald); }
.game-hero-mid p { margin: 4px 0; color: #c9c9cf; }
.gh-forfeit { color: #fbbf24; }
.game-actions { display: flex; gap: 12px; margin-bottom: 28px; flex-wrap: wrap; }

/* ---- playoff run banner (F10) ---- */
.run-banner { background: var(--black); border-radius: 18px; overflow: hidden; color: var(--white); position: relative; }
.run-banner::before { content: '2026'; position: absolute; right: -20px; bottom: -60px;
  font: 700 20vw/1 var(--oswald); color: rgba(212,20,40,.12); }
.run-grid { display: grid; grid-template-columns: 1fr 340px; align-items: center; }
@media (max-width: 900px) { .run-grid { grid-template-columns: 1fr; } }
.run-head { padding: 40px 40px 10px; text-align: center; position: relative; }
.run-head .k { font: 600 14px var(--oswald); letter-spacing: 5px; color: var(--red-bright); text-transform: uppercase; }
.run-head h2 { margin: 8px 0 4px; font: 700 clamp(32px, 5vw, 52px) var(--oswald); line-height: 1; }
.run-head p { color: #c9c9cf; max-width: 620px; margin: 8px auto 0; }
.run-badges { display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; padding: 22px 20px 26px; position: relative; }
.run-badge { border: 1px solid #2a2d35; border-radius: 12px; padding: 14px 22px; text-align: center; min-width: 128px; }
.run-badge.gold { border-color: #e2b93b; background: rgba(226,185,59,.08); }
.run-badge .v { font: 700 30px var(--oswald); color: #e2b93b; }
.run-badge .k { font: 700 10px var(--sans); color: var(--gray-soft); letter-spacing: 2px; text-transform: uppercase; }
.run-photo { position: relative; align-self: stretch; min-height: 280px; margin: 0;
  background: url('/assets/img/coach-net.jpg') center top/cover; }
.run-photo::before { content: ''; position: absolute; inset: 0;
  background: linear-gradient(90deg, var(--black) 0%, transparent 40%); }
.run-photo figcaption { position: absolute; bottom: 12px; right: 16px; font: 600 12px var(--oswald);
  letter-spacing: 2px; color: rgba(255,255,255,.85); text-transform: uppercase; }
.run-path { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1px; background: var(--panel-line); position: relative; }
@media (max-width: 900px) { .run-path { grid-template-columns: 1fr; } }
.run-step { background: var(--panel); padding: 18px 16px; text-align: center; }
.run-step .r { font: 600 11px var(--oswald); letter-spacing: 2px; color: var(--red-bright); text-transform: uppercase; }
.run-step .o { font: 600 16px var(--oswald); text-transform: uppercase; margin: 4px 0 2px; }
.run-step .s { font: 700 14px var(--sans); color: #34d399; }
.run-step.loss .s { color: #ef4444; }

/* ---- packs (F6) ---- */
.packs { display: grid; grid-template-columns: repeat(2, 1fr); gap: 26px; max-width: 820px; }
@media (max-width: 700px) { .packs { grid-template-columns: 1fr; } }
.pack { position: relative; background: var(--black); color: var(--white); border-radius: 16px;
  padding: 30px 28px; overflow: hidden; }
.pack::after { content: ''; position: absolute; right: -40px; top: -40px; width: 160px; height: 160px;
  background: radial-gradient(circle, rgba(212,20,40,.5), transparent 70%); }
.pack .n { font: 600 26px var(--oswald); letter-spacing: 3px; color: var(--red-bright); text-transform: uppercase; }
.pack .price { font: 700 56px var(--oswald); line-height: 1.05; margin: 6px 0 2px; }
.pack .price small { font-size: 22px; color: var(--red-bright); }
.pack .d { color: #c9c9cf; font-size: 14px; margin-bottom: 18px; }

/* ---- season ticket tiers (F7) ---- */
.tiers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
@media (max-width: 900px) { .tiers { grid-template-columns: 1fr; } }
.tier { background: var(--white); border-radius: 16px; padding: 28px; box-shadow: var(--shadow);
  text-align: center; border-top: 4px solid var(--black); }
.tier.vip { border-top-color: var(--red-bright); box-shadow: 0 10px 30px rgba(212,20,40,.18); }
.tier .n { font: 600 17px var(--oswald); letter-spacing: 2px; text-transform: uppercase; }
.tier .price { font: 700 52px var(--oswald); margin: 8px 0 2px; }
.tier .per { font: 600 11px var(--sans); color: var(--gray); letter-spacing: 1px; text-transform: uppercase; }
.tier ul { list-style: none; padding: 0; margin: 16px 0 20px; color: var(--ink-soft); font-size: 14px; text-align: left; }
.tier li { padding: 7px 0; border-bottom: 1px dashed var(--line); }
.tier li::before { content: '■ '; color: var(--red-bright); font-size: 9px; vertical-align: 2px; }
.tier-badge { display: inline-block; background: var(--red-bright); color: var(--white);
  font: 600 11px var(--oswald); letter-spacing: 2px; padding: 3px 12px; border-radius: 999px;
  margin-bottom: 8px; text-transform: uppercase; }
.tier-photo { padding: 0; overflow: hidden; border-top: 0; position: relative; display: flex;
  align-items: flex-end; min-height: 300px;
  background: var(--black) url('/assets/img/coach-net.jpg') center top/cover; }
.tier-photo::before { content: ''; position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 30%, rgba(11,11,13,.92)); }
.tier-photo .cap { position: relative; padding: 24px; text-align: left; color: var(--white);
  font: 700 30px var(--oswald); text-transform: uppercase; line-height: 1.05; }
.seating { margin-top: 26px; background: var(--black); border-radius: 16px; padding: 26px 28px; color: var(--white); }
.seating h3 { margin: 0 0 16px; font: 600 15px var(--oswald); letter-spacing: 3px; color: var(--red-bright); }
.seating-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
@media (max-width: 700px) { .seating-grid { grid-template-columns: repeat(2, 1fr); } }
.seat { border: 1px solid #2a2d35; border-radius: 10px; padding: 14px; text-align: center; }
.seat.vip { border-color: var(--red-bright); background: rgba(212,20,40,.12); }
.seat .s { font: 600 16px var(--oswald); text-transform: uppercase; }
.seat .w { font: 600 11px var(--sans); color: var(--gray-soft); letter-spacing: 1px; }

/* ---- league (F11) ---- */
.league { display: grid; grid-template-columns: 300px 1fr; gap: 40px; align-items: center;
  background: var(--white); border-radius: 18px; padding: 40px; box-shadow: var(--shadow); }
@media (max-width: 800px) { .league { grid-template-columns: 1fr; text-align: center; } }
.league h3 { font: 600 26px var(--oswald); margin: 0 0 10px; }
.league p { color: var(--ink-soft); font-size: 15px; margin: 0 0 10px; }
.league-facts { display: flex; gap: 26px; margin-top: 16px; flex-wrap: wrap; justify-content: inherit; }
.league-facts div { text-align: center; }
.league-facts .v { font: 700 28px var(--oswald); color: var(--red); }
.league-facts .k { font: 700 10px var(--sans); color: var(--gray); letter-spacing: 1.5px; text-transform: uppercase; }

/* ---- socials (F12) ---- */
.socials { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
@media (max-width: 900px) { .socials { grid-template-columns: 1fr; } }
.social-card { display: flex; align-items: center; gap: 16px; background: var(--black); color: var(--white);
  border-radius: 14px; padding: 20px 22px; text-decoration: none; transition: transform .15s, box-shadow .15s; }
.social-card:hover { transform: translateY(-4px); box-shadow: 0 12px 26px rgba(212,20,40,.25); }
.social-card .ic svg { width: 24px; height: 24px; fill: #fff; }
.social-card.x .ic { background: #000; border: 1px solid #2a2d35; }
.social-card .ic { width: 46px; height: 46px; border-radius: 12px; display: flex; align-items: center;
  justify-content: center; font-size: 22px; flex: none; }
.social-card.ig .ic { background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888); }
.social-card.fb .ic { background: #1877f2; }
.social-card.yt .ic { background: #f00; }
.social-card .t { font: 600 17px var(--oswald); text-transform: uppercase; line-height: 1.1; }
.social-card .h { font: 600 12px var(--sans); color: var(--gray-soft); }

/* ---- press (F9) ---- */
.press-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 26px; align-items: start; }
@media (max-width: 900px) { .press-grid { grid-template-columns: 1fr; } }
.press-release { display: flex; gap: 18px; align-items: baseline; background: var(--white);
  border-radius: 12px; padding: 18px 22px; box-shadow: var(--shadow); margin-bottom: 12px;
  text-decoration: none; color: var(--ink); }
.press-release:hover { box-shadow: var(--shadow-hover); }
.press-release .dt { font: 600 13px var(--oswald); color: var(--red); white-space: nowrap; text-transform: uppercase; }
.press-release .t { font: 600 17px var(--oswald); text-transform: uppercase; line-height: 1.2; }
.media-kit-card { background: var(--black); color: var(--white); border-radius: 16px; padding: 26px; }
.media-kit-card h3 { margin: 0 0 8px; font: 600 15px var(--oswald); letter-spacing: 3px; color: var(--red-bright); }
.media-kit-card p { color: #c9c9cf; font-size: 14px; }
.media-kit-card a.plain { border-bottom: 0; }
.media-kit-card a { display: block; color: var(--white); font: 600 13px var(--oswald); letter-spacing: 1.5px;
  text-transform: uppercase; text-decoration: none; padding: 12px 0; border-bottom: 1px solid #2a2d35; }
.media-kit-card a small { display: block; font: 600 12px var(--sans); color: var(--gray-soft);
  text-transform: none; letter-spacing: 0; }

/* ---- sponsor CTA (F16) ---- */
.sponsor-cta { background: var(--white); border-radius: 16px; padding: 34px; text-align: center; box-shadow: var(--shadow); }
.sponsor-cta h3 { font: 600 24px var(--oswald); margin: 0 0 8px; }
.sponsor-cta p { color: var(--gray); max-width: 520px; margin: 0 auto 18px; font-size: 15px; }

/* ---- about (F15) ---- */
.about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: start; }
@media (max-width: 900px) { .about-grid { grid-template-columns: 1fr; } }
.about-grid p { color: var(--ink-soft); font-size: 15px; line-height: 1.7; margin: 0 0 14px; }
.timeline { border-left: 3px solid var(--red-bright); padding-left: 22px; }
.timeline-item { margin-bottom: 18px; position: relative; }
.timeline-item::before { content: ''; position: absolute; left: -29px; top: 5px; width: 11px;
  height: 11px; border-radius: 50%; background: var(--red-bright); }
.timeline-item .y { font: 600 18px var(--oswald); color: var(--red); }
.timeline-item .e { font-size: 14px; color: var(--ink-soft); }

/* ---- news ---- */
.news-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 22px; }
.news-card { background: var(--white); border-radius: 14px; overflow: hidden; text-decoration: none;
  color: var(--ink); box-shadow: var(--shadow); transition: transform .15s, box-shadow .15s; }
.news-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-hover); }
.news-card img { width: 100%; aspect-ratio: 16/9; object-fit: cover; display: block; }
.news-card h3 { margin: 14px 16px 4px; font-size: 19px; line-height: 1.2; }
.news-card p { margin: 0 16px 8px; color: var(--ink-soft); font-size: 14px; }
.news-card time { display: block; margin: 0 16px 16px; font: 600 12px var(--oswald);
  color: var(--red); text-transform: uppercase; letter-spacing: 1px; }
.news-article { max-width: 46rem; }
.news-hero { border-radius: 14px; margin-bottom: 24px; }
.news-body { color: var(--ink-soft); line-height: 1.7; }

/* ---- content pages / embeds ---- */
.content-page { max-width: 52rem; }
.content-page h2 { font-size: 26px; }
.embed-form { margin-top: 24px; background: var(--white); border-radius: 14px; padding: 20px; box-shadow: var(--shadow); }
.page-banner { border-radius: 14px; margin-bottom: 26px; width: 100%; }
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 34px; align-items: center; }
@media (max-width: 800px) { .split { grid-template-columns: 1fr; } }
.split img { border-radius: 14px; }

/* ---- footer + newsletter (F13) ---- */
.site-footer { background: var(--black); color: #c9c9cf; margin-top: 60px; }
.footer-inner { max-width: 1150px; margin: 0 auto; padding: 44px 20px 20px;
  display: grid; grid-template-columns: 1.3fr 1fr 1.2fr; gap: 40px; }
@media (max-width: 900px) { .footer-inner { grid-template-columns: 1fr; } }
.site-footer h4 { font: 600 15px var(--oswald); letter-spacing: 3px; color: var(--white); margin: 0 0 12px; }
.footer-newsletter { background: #14161d; border: 1px solid #2a2d35; border-radius: 14px; padding: 22px; }
.footer-newsletter h4 { font-size: 19px; letter-spacing: 2px; }
.footer-newsletter h4::before { content: '\2709  '; color: var(--red-bright); }
.site-footer h4 em { color: var(--red-bright); font-style: normal; }
.footer-brand p { font-size: 14px; margin: 0 0 12px; }
.footer-brand .wordmark { height: 54px; margin-top: 6px; }
.footer-nav a { display: block; color: #c9c9cf; text-decoration: none; padding: 5px 0; font-size: 14px; }
.footer-nav a:hover { color: var(--white); }
.footer-copy { border-top: 1px solid #1c1e25; margin: 30px 0 0; padding: 16px 20px;
  text-align: center; font-size: 12px; color: var(--gray); }
/* newsletter widget */
.nl-step { display: flex; gap: 8px; }
.nl-step input { flex: 1; background: #16181f; border: 1px solid #2a2d35; border-radius: 8px;
  color: var(--white); padding: 12px 14px; font: 400 14px var(--sans); }
.nl-step input::placeholder { color: var(--gray); }
.nl-step button, .nl-btn { font: 600 13px var(--oswald); letter-spacing: 2px; text-transform: uppercase;
  background: var(--grad-red); color: var(--white); border: 0; padding: 12px 20px;
  clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%); cursor: pointer; }
.nl-progress { height: 4px; background: #16181f; border-radius: 2px; margin-top: 10px; overflow: hidden; }
.nl-progress span { display: block; height: 100%; background: var(--red-bright); transition: width .25s; }
.nl-msg { min-height: 1.2em; font-size: 13px; color: #fbbf24; }
.hp { position: absolute; left: -9999px; height: 0; width: 0; opacity: 0; }

.error-page { text-align: center; padding: 72px 16px; }

/* ---- head coach feature (Team page) ---- */
.coach-feature { display: grid; grid-template-columns: 320px 1fr; background: var(--white);
  border-radius: 16px; overflow: hidden; box-shadow: var(--shadow); margin-bottom: 26px; }
@media (max-width: 800px) { .coach-feature { grid-template-columns: 1fr; } }
.coach-feature .ph { background: var(--black); }
.coach-feature .ph img { width: 100%; height: 100%; object-fit: cover; object-position: top; display: block; }
.coach-feature .bio { padding: 28px 30px; }
.coach-feature .bio .r { font: 700 12px var(--sans); color: var(--red-bright); letter-spacing: 2px; text-transform: uppercase; }
.coach-feature .bio h3 { font: 600 32px var(--oswald); margin: 2px 0 12px; line-height: 1; }
.coach-feature .bio p { color: var(--ink-soft); font-size: 14.5px; line-height: 1.65; margin: 0 0 10px; }

/* ---- game packs page graphics ---- */
.pack .bgimg { position: absolute; inset: 0; object-fit: cover; opacity: .22; }
.pack > *:not(.bgimg) { position: relative; }

/* ---- press: in the news ---- */
.mention { display: flex; gap: 18px; align-items: center; background: var(--white); border-radius: 12px;
  padding: 16px 22px; box-shadow: var(--shadow); margin-bottom: 12px; text-decoration: none; color: var(--ink); }
.mention:hover { box-shadow: var(--shadow-hover); }
.mention .t { font: 600 16px var(--oswald); text-transform: uppercase; line-height: 1.25; flex: 1; }
.mention .meta { display: flex; flex-direction: column; align-items: flex-end; gap: 5px; flex: none; }
.mention .pub { font: 600 12px var(--oswald); color: var(--white); background: var(--black);
  padding: 3px 10px; border-radius: 6px; letter-spacing: 1px; text-transform: uppercase; white-space: nowrap; }
.mention .dt { font: 600 12px var(--sans); color: var(--gray); white-space: nowrap; }

/* ---- assistant coaches: compact horizontal cards ---- */
.staff-card-h { display: flex; align-items: center; gap: 18px; background: var(--white);
  border-radius: 14px; padding: 14px; box-shadow: var(--shadow); }
.staff-card-h img { width: 96px; height: 96px; border-radius: 12px; object-fit: cover;
  object-position: top; flex: none; }
.staff-card-h .l { font: 600 22px var(--oswald); text-transform: uppercase; line-height: 1.05; }
.staff-card-h .r { font: 700 11px var(--sans); color: var(--red-bright); letter-spacing: 2px;
  text-transform: uppercase; margin-top: 3px; }

/* ---- game page: badges, top performers, totals ---- */
.gh-badges { display: flex; justify-content: center; gap: 10px; margin: 10px 0 0; flex-wrap: wrap; }
.gh-badge { font: 600 12px var(--oswald); letter-spacing: 2px; text-transform: uppercase;
  border: 1px solid #2a2d35; border-radius: 999px; padding: 4px 14px; color: var(--gray-soft); }
.gh-badge.win { border-color: #34d399; color: #34d399; }
.gh-badge.loss { border-color: #ef4444; color: #ef4444; }
.gh-badge.playoff { border-color: var(--red-bright); color: var(--red-bright); }
.performers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-bottom: 28px; }
@media (max-width: 800px) { .performers { grid-template-columns: 1fr; } }
.performer { display: flex; align-items: center; gap: 14px; background: var(--white);
  border-radius: 14px; padding: 14px 16px; box-shadow: var(--shadow); text-decoration: none; color: var(--ink); }
.performer img { width: 62px; height: 62px; border-radius: 10px; object-fit: cover; object-position: top; flex: none; }
.performer .cat { font: 700 10px var(--sans); color: var(--red-bright); letter-spacing: 2px; text-transform: uppercase; }
.performer .nm { font: 600 17px var(--oswald); text-transform: uppercase; line-height: 1.1; }
.performer .ln { font: 600 13px var(--sans); color: var(--gray); }
.stats-table tfoot td { font-weight: 800; background: #eef0f2; border-top: 2px solid var(--black); }
.game-meta { display: flex; gap: 26px; flex-wrap: wrap; margin: 28px 0; color: var(--ink-soft); font-size: 14px; }
.game-meta b { font: 600 11px var(--oswald); letter-spacing: 2px; color: var(--gray); text-transform: uppercase; display: block; }

/* ---- packs full width variant ---- */
.packs-full { max-width: none; }

/* ---- footer contact + socials ---- */
.footer-contact { font-size: 14px; line-height: 1.8; margin-top: 14px; }
.footer-label { font: 600 11px var(--oswald); letter-spacing: 2px; color: var(--gray); text-transform: uppercase; }
.footer-newsletter p { font-size: 14px; margin: 0 0 12px; }
.footer-contact a { color: #c9c9cf; text-decoration: none; }
.footer-contact a:hover { color: var(--white); }
.footer-socials { display: flex; gap: 10px; margin-top: 14px; }
.footer-socials a { width: 40px; height: 40px; border-radius: 10px; display: flex; align-items: center;
  justify-content: center; color: var(--white); text-decoration: none; font-size: 17px; font-weight: 700;
  background: #1b1d24; border: 1px solid #2a2d35; transition: background .15s, border-color .15s; }
.footer-socials a:hover { background: var(--red); border-color: var(--red-bright); }

/* ---- sponsors strip ---- */
.sponsors-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 26px; }
@media (max-width: 700px) { .sponsors-grid { grid-template-columns: 1fr; } }
.sponsor-logo { background: var(--white); border-radius: 12px; box-shadow: var(--shadow);
  display: flex; align-items: center; justify-content: center; padding: 18px; aspect-ratio: 16/9; }
.sponsor-logo img { max-height: 70px; max-width: 100%; object-fit: contain; }

/* ---- sponsors: executive rows + overlay CTA ---- */
.sponsor-exec { display: grid; gap: 16px; margin-bottom: 30px; }
.sponsor-exec .row { background: var(--white); border-radius: 14px; box-shadow: var(--shadow);
  display: flex; align-items: center; justify-content: center; padding: 40px 20px; }
.sponsor-exec .row img { max-height: 190px; max-width: min(760px, 92%); object-fit: contain; }
.sponsor-h3 { font: 600 15px var(--oswald); letter-spacing: 3px; text-transform: uppercase;
  color: var(--red); margin: 26px 0 14px; }
.sponsor-overlay { position: relative; border-radius: 18px; overflow: hidden; margin-top: 34px;
  min-height: 320px; display: flex; align-items: center; justify-content: center; text-align: center;
  background: var(--black) url('/assets/img/player-on-court.jpg') center 30%/cover; }
.sponsor-overlay::before { content: ''; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(11,11,13,.55), rgba(171,15,39,.82)); }
.sponsor-overlay .in { position: relative; padding: 56px 24px; color: var(--white); }
.sponsor-overlay h3 { font: 700 clamp(28px, 4.5vw, 44px) var(--oswald); margin: 0 0 20px;
  text-shadow: 0 4px 20px rgba(0,0,0,.5); }
.sponsor-overlay .btn-white { background: var(--white); color: var(--black);
  clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%); }
.sponsor-overlay .btn-white:hover { background: #f1f1f3; }

/* ---- jersey shop section ---- */
.jersey-cta { display: grid; grid-template-columns: 1fr 1.2fr; border-radius: 18px; overflow: hidden;
  background: var(--black); color: var(--white); }
@media (max-width: 800px) { .jersey-cta { grid-template-columns: 1fr; } }
.jersey-cta .ph { min-height: 260px; background: var(--jersey-image) center 20%/cover; }
.jersey-cta .in { padding: 40px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.jersey-cta h3 { font: 700 clamp(26px, 4vw, 40px) var(--oswald); margin: 0 0 10px; }
.jersey-cta p { color: #c9c9cf; margin: 0 0 22px; }

/* ---- footer social SVG icons ---- */
.footer-socials a svg { width: 19px; height: 19px; fill: currentColor; }

/* ---- shared content blocks (replaces former inline styles) ---- */
.split-title { font: 700 clamp(26px, 4vw, 40px) var(--oswald); margin: 0 0 10px; }
.lead { color: var(--ink-soft); margin: 0 0 20px; }
.lead-tight { color: var(--ink-soft); margin: 0 0 10px; }
.staff-pair { grid-template-columns: repeat(2, 1fr); }
.btn-dark { background: var(--black); color: var(--white); }
.wide-sub { max-width: 52rem; }
.section-gap { margin-top: 34px; }

/* ---- media kit page ---- */
.mk-card { background: var(--black); border-radius: 16px; box-shadow: var(--shadow); overflow: hidden; }
.mk-card .swatch { aspect-ratio: 16/10; display: flex; align-items: center; justify-content: center; padding: 24px; }
.mk-card .swatch img { max-height: 110px; }
.mk-card .meta { background: var(--white); padding: 14px 18px; display: flex;
  justify-content: space-between; align-items: center; }
.mk-card .meta .n { font: 600 15px var(--oswald); text-transform: uppercase; }
.mk-card .meta a { font: 700 12px var(--sans); }
.mk-colors { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
@media (max-width: 700px) { .mk-colors { grid-template-columns: repeat(2, 1fr); } }
.mk-color { background: var(--white); border-radius: 12px; overflow: hidden; box-shadow: var(--shadow); }
.mk-color .c { height: 84px; }
.mk-color .c.bordered { border-bottom: 1px solid #eee; }
.mk-color .m { padding: 10px 12px; font-size: 12px; }
.mk-color .m b { display: block; font: 600 13px var(--oswald); text-transform: uppercase; }
.mk-photos { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
@media (max-width: 700px) { .mk-photos { grid-template-columns: repeat(2, 1fr); } }
.mk-photos img { aspect-ratio: 1/1; object-fit: cover; border-radius: 10px; width: 100%; }
.mk-facts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px 40px; margin: 0; }
@media (max-width: 700px) { .mk-facts { grid-template-columns: 1fr; } }
.mk-facts dt { font: 600 11px var(--oswald); letter-spacing: 2px; color: var(--red-bright); text-transform: uppercase; }
.mk-facts dd { margin: 2px 0 0; font-size: 15px; }
.mk-contact { background: var(--white); border-radius: 16px; padding: 28px; box-shadow: var(--shadow);
  display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; }
.mk-contact .n { font: 600 22px var(--oswald); text-transform: uppercase; }
.mk-contact .r { color: var(--gray); font-size: 14px; }

.player-shop-btn { margin: 0 0 18px; }
.tiers-pair { max-width: 820px; }