.roster-header { background: var(--ink); position: relative; }

.roster-hero { background: var(--ink); color: #fff; }

.roster-hero-content { padding: 78px 0 88px; }

.roster-hero h1 { margin: 18px 0 12px; font: 800 clamp(4rem, 10vw, 8rem)/.82 'Barlow Condensed', sans-serif; text-transform: uppercase; }

.roster-hero p { max-width: 530px; margin: 0; color: rgba(255,255,255,.72); font-size: 1.05rem; line-height: 1.6; }

.roster-section { background: var(--paper); }

.roster-toolbar { display: flex; gap: 8px; margin: -8px 0 28px; }

.roster-filter { border: 1px solid var(--line); padding: 10px 15px; background: transparent; color: var(--ink); cursor: pointer; font: 700 .76rem 'DM Sans', sans-serif; text-transform: uppercase; }

.roster-filter:hover, .roster-filter:focus-visible, .roster-filter.is-active { border-color: var(--coral); background: var(--coral); color: #fff; }

.roster-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }

.roster-card { overflow: hidden; background: var(--surface); box-shadow: 0 8px 26px rgba(20,33,43,.08); }

.roster-card[hidden] { display: none; }

.roster-card > img { width: 100%; height: 190px; object-fit: cover; }

.roster-card-body { padding: 22px; }

.roster-tag { color: var(--teal); font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }

.roster-card h3 { margin: 10px 0 8px; font: 700 2rem/.9 'Barlow Condensed', sans-serif; text-transform: uppercase; }

.roster-card p { min-height: 51px; margin: 0 0 20px; color: var(--muted); font-size: .85rem; line-height: 1.5; }

.roster-card dl { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 0; padding: 15px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }

.roster-card dt { margin-bottom: 5px; color: var(--muted); font-size: .65rem; font-weight: 700; text-transform: uppercase; }

.roster-card dd { margin: 0; font-size: .78rem; line-height: 1.35; }

.text-link { display: inline-block; margin-top: 18px; color: var(--coral); font-size: .76rem; font-weight: 700; text-decoration: none; text-transform: uppercase; }

.text-link:hover, .text-link:focus-visible { color: var(--teal); }

.roster-cta { padding: 70px 0; background: var(--yellow); }

.roster-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 30px; }

.roster-cta h2 { max-width: 620px; margin: 12px 0 0; font: 700 clamp(2.3rem, 5vw, 4.5rem)/.88 'Barlow Condensed', sans-serif; text-transform: uppercase; }

.roster-cta .section-kicker { color: var(--ink); }

@media (max-width: 760px) {

  .roster-hero-content { padding: 58px 0 68px; }

  .roster-grid { grid-template-columns: 1fr; }

  .roster-card p { min-height: 0; }

  .roster-cta-inner { display: block; }

  .roster-cta .button { margin-top: 28px; }

}