:root {
  --cardinal-red: #C8102E;
  --cardinal-red-dark: #A50D25;
  --scarlet: #E41E3F;
  --scarlet-bar: #D91B3A;
  --charcoal: #1A1A1A;
  --navy: #14284B;
  --navy-dark: #0e1c36;
  --navy-bright: #17368F;
  --white: #FFFFFF;
  --silver: #C7C7C7;
  --silver-soft: #ebebeb;
  --gray-100: #f5f5f5;
  --gray-200: #efefef;
  --gray-300: #d9d9d9;
  --offwhite: #f4f3f3;
  --body-gray: #4a4e57;
  --success: #22C55E;
  --warning: #EAB308;
  --danger: #EF4444;
  --max-width: 1200px;
  --font-sans: "Inter", "Segoe UI", sans-serif;
  --font-body: "Inter", "Segoe UI", sans-serif;
  --font-display: "Barlow Condensed", "Arial Narrow", Impact, sans-serif;
  --notch: 12px;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: var(--font-body);
  background: var(--white);
  color: var(--charcoal);
  line-height: 1.6;
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  max-width: 100%;
  display: block;
}

.container {
  width: min(var(--max-width), calc(100% - 32px));
  margin: 0 auto;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 30;
  background: rgba(255, 255, 255, 0.92);
  border-bottom: 1px solid rgba(26, 26, 26, 0.08);
  backdrop-filter: blur(10px);
}

.nav-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 78px;
  gap: 20px;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-weight: 800;
}

.wordmark {
  display: flex;
  flex-direction: column;
  line-height: 0.9;
}

.wordmark-main {
  font-family: var(--font-sans);
  font-size: 1rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 800;
}

.wordmark-sub {
  font-size: 0.54rem;
  letter-spacing: 0.38em;
  text-transform: uppercase;
  color: rgba(26, 26, 26, 0.62);
  margin-top: 0.2rem;
  font-weight: 700;
}

.brand-mark {
  position: relative;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, var(--cardinal-red) 0%, #b42a42 100%);
  color: var(--white);
  border-radius: 12px;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.12), 0 10px 20px rgba(158, 27, 50, 0.18);
}

.brand-mark::before {
  content: "";
  position: absolute;
  inset: 5px;
  border-radius: 9px;
  border: 1px solid rgba(255,255,255,0.2);
}

.main-nav,
.nav-actions {
  display: flex;
  align-items: center;
  gap: 22px;
}

.main-nav a,
.nav-link,
.button {
  transition: 0.2s ease;
}

.main-nav a,
.nav-link {
  color: rgba(26, 26, 26, 0.8);
  font-weight: 600;
}

.main-nav a:hover,
.nav-link:hover {
  color: var(--cardinal-red);
}

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 0.9rem 1.4rem;
  font-weight: 700;
  border: 1px solid transparent;
}

.button-primary {
  background: var(--cardinal-red);
  color: var(--white);
  box-shadow: 0 16px 30px rgba(158, 27, 50, 0.18);
}

.button-primary:hover {
  background: var(--cardinal-red-dark);
}

.button-secondary {
  border-color: rgba(26, 26, 26, 0.12);
  background: rgba(255, 255, 255, 0.9);
}

.button-secondary:hover {
  border-color: rgba(158, 27, 50, 0.35);
  color: var(--cardinal-red);
}

.hero {
  position: relative;
  padding: 5.2rem 0 4rem;
  background: linear-gradient(180deg, #fff 0%, #f8f5f6 100%);
}

.hero-grid {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  align-items: center;
  gap: 48px;
}

.eyebrow {
  display: inline-flex;
  font-size: 0.76rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 800;
  color: var(--cardinal-red);
  margin-bottom: 1rem;
  background: rgba(158, 27, 50, 0.08);
  border: 1px solid rgba(158, 27, 50, 0.12);
  border-radius: 999px;
  padding: 0.5rem 0.8rem;
}

.hero-copy h1,
.section-header h2,
.quote-card h2 {
  margin: 0;
  letter-spacing: -0.06em;
  line-height: 0.98;
  color: var(--charcoal);
}

.hero-copy h1 {
  font-size: clamp(2.8rem, 5vw, 5rem);
  max-width: 620px;
}

.hero-text {
  max-width: 620px;
  margin: 1.2rem 0 1.8rem;
  color: rgba(26, 26, 26, 0.72);
  font-size: 1.08rem;
}

.cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-bottom: 1.5rem;
}

.hero-points {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 18px;
  padding: 0;
  margin: 0;
  list-style: none;
  color: rgba(26, 26, 26, 0.78);
  font-weight: 600;
}

.hero-points li {
  position: relative;
  padding-left: 20px;
}

.hero-points li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.62em;
  width: 10px;
  height: 10px;
  background: var(--cardinal-red);
  border-radius: 50%;
}

.hero-panel {
  background: #171717;
  border-radius: 28px;
  box-shadow: 0 30px 60px rgba(26, 26, 26, 0.18);
  padding: 18px 18px 14px;
}

.panel-topbar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 6px 14px;
}

.dot {
  width: 11px;
  height: 11px;
  border-radius: 50%;
  display: inline-block;
}

.dot.red { background: #ff5f57; }
.dot.amber { background: #febc2e; }
.dot.green { background: #28c840; }

.panel-body {
  padding: 14px 12px 10px;
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.01));
  border: 1px solid rgba(255,255,255,0.06);
}

.score-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  padding: 8px 0 18px;
}

.label {
  margin: 0 0 6px;
  color: rgba(255,255,255,0.7);
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.large-score {
  font-size: clamp(2.6rem, 5vw, 4rem);
  font-weight: 800;
  letter-spacing: -0.06em;
  color: var(--white);
}

.confidence {
  min-width: 150px;
  padding: 10px 12px;
  border-radius: 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 0.8rem;
  color: var(--white);
}

.confidence strong {
  font-size: 1.2rem;
}

.confidence.high {
  background: rgba(34, 197, 94, 0.18);
  border: 1px solid rgba(34, 197, 94, 0.4);
}

.mini-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

.mini-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 16px;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  color: var(--white);
}

.mini-card span {
  color: rgba(255,255,255,0.7);
  font-size: 0.76rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.mini-card strong {
  font-size: 1.5rem;
}

.insights {
  display: grid;
  gap: 12px;
}

.insight-row {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 14px;
  padding: 12px 14px;
  display: grid;
  gap: 4px;
  color: rgba(255,255,255,0.8);
}

.insight-row span {
  color: rgba(255,255,255,0.6);
  font-size: 0.74rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.insight-row strong {
  font-size: 0.95rem;
  color: var(--white);
  line-height: 1.45;
}

.stats-bar {
  background: var(--charcoal);
  color: var(--white);
  padding: 1.4rem 0;
}

.stats-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.stats-grid div {
  display: flex;
  flex-direction: column;
  gap: 4px;
  text-align: center;
}

.stats-grid strong {
  font-size: clamp(1.6rem, 2vw, 2.1rem);
  letter-spacing: -0.05em;
  color: var(--white);
}

.stats-grid span {
  color: rgba(255,255,255,0.7);
  font-size: 0.86rem;
}

.section {
  padding: 6rem 0;
}

.section-alt {
  background: var(--gray-100);
}

.section-header {
  margin-bottom: 2.5rem;
}

.narrow {
  max-width: 780px;
}

.section-header h2,
.quote-card h2 {
  font-size: clamp(2.2rem, 4vw, 3.5rem);
}

.feature-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

.feature-card,
.score-card,
.price-card {
  background: var(--white);
  border: 1px solid rgba(26, 26, 26, 0.06);
  border-radius: 24px;
  box-shadow: 0 12px 28px rgba(26, 26, 26, 0.04);
}

.feature-card {
  padding: 1.6rem;
}

.icon {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: rgba(158, 27, 50, 0.08);
  color: var(--cardinal-red);
  font-weight: 800;
  margin-bottom: 1.2rem;
}

.feature-card h3,
.score-card h3,
.price-card h3 {
  margin: 0 0 0.7rem;
  font-size: 1.4rem;
}

.feature-card p,
.score-card p,
.price-card ul,
.workflow-layout p,
.quote-card p,
.site-footer p {
  margin: 0;
  color: rgba(26, 26, 26, 0.72);
}

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

.score-card {
  padding: 1.4rem 1.3rem;
}

.pill {
  display: inline-flex;
  align-items: center;
  padding: 0.42rem 0.72rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 0.9rem;
}

.pill.red {
  background: rgba(158, 27, 50, 0.08);
  color: var(--cardinal-red);
}

.pill.gray {
  background: rgba(26, 26, 26, 0.06);
  color: rgba(26, 26, 26, 0.8);
}

.workflow-layout {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 32px;
  align-items: center;
}

.timeline {
  display: grid;
  gap: 18px;
}

.timeline-item {
  display: flex;
  gap: 18px;
  padding: 18px 20px;
  border: 1px solid rgba(26, 26, 26, 0.08);
  background: rgba(255,255,255,0.75);
  border-radius: 18px;
}

.timeline-item span {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: var(--cardinal-red);
  color: var(--white);
  font-weight: 800;
}

.timeline-item h4 {
  margin: 0 0 0.3rem;
  font-size: 1.2rem;
}

.section-dark {
  background: var(--charcoal);
  color: var(--white);
}

.quote-wrap {
  display: flex;
  justify-content: center;
}

.quote-card {
  max-width: 900px;
  text-align: center;
  padding: 1rem 0;
}

.eyebrow.light {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.9);
}

.quote-card h2,
.quote-card p {
  color: var(--white);
}

.quote-card p {
  max-width: 760px;
  margin: 1rem auto 0;
  color: rgba(255,255,255,0.72);
}

.pricing-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

.price-card {
  padding: 1.7rem 1.4rem;
  position: relative;
}

.price-card.featured {
  background: linear-gradient(180deg, #fff 0%, #fff7f8 100%);
  border-color: rgba(158, 27, 50, 0.16);
  transform: translateY(-6px);
}

.badge {
  position: absolute;
  top: -12px;
  left: 20px;
  background: var(--cardinal-red);
  color: var(--white);
  padding: 0.35rem 0.7rem;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.price {
  margin: 0.8rem 0 1rem;
  font-size: clamp(2.4rem, 3vw, 3rem);
  font-weight: 800;
  letter-spacing: -0.07em;
  color: var(--charcoal);
}

.price span {
  font-size: 1rem;
  color: rgba(26, 26, 26, 0.65);
  letter-spacing: 0;
}

.price-card ul {
  list-style: none;
  padding: 0;
  display: grid;
  gap: 12px;
}

.price-card ul li {
  position: relative;
  padding-left: 18px;
}

.price-card ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.7em;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--cardinal-red);
}

.site-footer {
  background: #f7f2f3;
  border-top: 1px solid rgba(26, 26, 26, 0.06);
  padding: 2.5rem 0;
}

.footer-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.footer-brand {
  margin-bottom: 0.8rem;
}

.footer-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}

@media (max-width: 980px) {
  .hero-grid,
  .workflow-layout,
  .feature-grid,
  .score-grid,
  .pricing-grid,
  .stats-grid {
    grid-template-columns: 1fr 1fr;
  }

  .hero-grid,
  .workflow-layout {
    grid-template-columns: 1fr;
  }

  .main-nav {
    display: none;
  }
}

@media (max-width: 640px) {
  .nav-wrap,
  .nav-actions,
  .cta-row,
  .footer-inner {
    flex-direction: column;
    align-items: flex-start;
  }

  .feature-grid,
  .score-grid,
  .pricing-grid,
  .stats-grid {
    grid-template-columns: 1fr;
  }

  .hero {
    padding-top: 3.5rem;
  }

  .hero-copy h1 {
    font-size: 2.7rem;
  }

  .button {
    width: 100%;
  }

  .footer-actions {
    width: 100%;
  }
}

/* ===== Site-wide extensions (multi-page build) ===== */

body { overflow-x: hidden; }

:focus-visible {
  outline: 3px solid var(--navy);
  outline-offset: 2px;
  border-radius: 4px;
}

.skip-link {
  position: absolute;
  left: 8px;
  top: -60px;
  background: var(--navy);
  color: var(--white);
  padding: 0.6rem 1rem;
  border-radius: 8px;
  z-index: 100;
  font-weight: 700;
}
.skip-link:focus { top: 8px; }

.brand { color: var(--charcoal); }

.main-nav { gap: 18px; font-size: 0.93rem; }
.main-nav a[aria-current="page"],
.footer-col a[aria-current="page"] {
  color: var(--cardinal-red);
  border-bottom: 2px solid var(--cardinal-red);
}

.mobile-only { display: none; }

.nav-toggle {
  display: none;
  background: var(--white);
  border: 1px solid rgba(20, 40, 75, 0.25);
  color: var(--navy);
  border-radius: 10px;
  padding: 0.55rem 0.9rem;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.button-navy { background: var(--navy); color: var(--white); }
.button-navy:hover { background: var(--navy-dark); }
.button-small { padding: 0.55rem 1rem; font-size: 0.9rem; }

.stats-bar, .section-dark { background: var(--navy); }
.hero-panel { background: var(--navy-dark); }
.eyebrow.navy { background: rgba(20, 40, 75, 0.08); border-color: rgba(20, 40, 75, 0.15); color: var(--navy); }

/* Audience cards */
.audience-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin: 1.6rem 0 1.2rem;
}
.audience-card {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 1rem 1.1rem;
  border: 2px solid rgba(20, 40, 75, 0.14);
  border-radius: 18px;
  background: var(--white);
  transition: 0.2s ease;
}
.audience-card:hover { border-color: var(--cardinal-red); transform: translateY(-2px); }
.audience-card strong { font-family: var(--font-sans); color: var(--navy); font-size: 1.05rem; }
.audience-card span { font-size: 0.88rem; color: rgba(26, 26, 26, 0.75); }
.audience-card em { font-style: normal; font-weight: 800; color: var(--cardinal-red); font-size: 0.88rem; margin-top: 6px; }

/* Sub-page hero */
.page-hero {
  padding: 4rem 0 3rem;
  background: linear-gradient(180deg, #fff 0%, #f8f5f6 100%);
  border-bottom: 1px solid rgba(26, 26, 26, 0.06);
}
.page-hero h1 {
  margin: 0;
  font-size: clamp(2.2rem, 4.5vw, 3.6rem);
  line-height: 1.05;
  letter-spacing: -0.04em;
  color: var(--navy);
  max-width: 820px;
}
.page-hero p { max-width: 720px; color: rgba(26, 26, 26, 0.75); font-size: 1.08rem; margin: 1rem 0 0; }
.page-hero .cta-row { margin: 1.4rem 0 0; }

.section-tight { padding: 3.5rem 0; }
.section-header h2 { color: var(--navy); }
.section-header p { max-width: 760px; color: rgba(26, 26, 26, 0.75); margin: 1rem 0 0; }
.lead { font-size: 1.1rem; color: rgba(26, 26, 26, 0.78); max-width: 780px; }

h2.sub { font-size: 1.7rem; color: var(--navy); margin: 0 0 1rem; letter-spacing: -0.02em; }
h3.sub { font-size: 1.2rem; color: var(--navy); margin: 0 0 0.5rem; }

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

.card {
  background: var(--white);
  border: 1px solid rgba(26, 26, 26, 0.08);
  border-radius: 20px;
  padding: 1.4rem;
  box-shadow: 0 10px 24px rgba(26, 26, 26, 0.04);
}
.card h3 { margin: 0 0 0.5rem; font-size: 1.2rem; color: var(--navy); }
.card p { margin: 0; color: rgba(26, 26, 26, 0.75); }
.card ul { margin: 0.5rem 0 0; padding-left: 1.1rem; color: rgba(26, 26, 26, 0.78); }
.card .pill { margin-bottom: 0.7rem; }
a.card:hover { border-color: var(--cardinal-red); }
.card .more { display: inline-block; margin-top: 0.8rem; font-weight: 800; color: var(--cardinal-red); }

.pill.navy { background: rgba(20, 40, 75, 0.09); color: var(--navy); }
.pill.green { background: rgba(22, 120, 60, 0.12); color: #136c37; }
.pill.amber { background: rgba(180, 120, 0, 0.14); color: #7a5200; }

.notice {
  border-left: 5px solid var(--cardinal-red);
  background: #fff6f7;
  border-radius: 12px;
  padding: 0.9rem 1.1rem;
  margin: 1rem 0;
  color: var(--charcoal);
}
.notice.navy { border-left-color: var(--navy); background: #f1f4fa; }
.notice strong { color: var(--navy); }

.split-compare {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.split-compare .card.obj { border-top: 6px solid var(--navy); }
.split-compare .card.subj { border-top: 6px solid var(--cardinal-red); }

/* Forms */
.form-wrap { max-width: 820px; }
.form-card {
  background: var(--white);
  border: 1px solid rgba(26, 26, 26, 0.1);
  border-radius: 24px;
  padding: 1.8rem;
  box-shadow: 0 16px 36px rgba(26, 26, 26, 0.06);
}
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.field { display: flex; flex-direction: column; gap: 6px; }
.field.full, fieldset.full { grid-column: 1 / -1; }
.field label, fieldset legend { font-weight: 700; color: var(--navy); font-size: 0.95rem; }
.req { color: var(--cardinal-red); }
.hint { font-size: 0.85rem; color: rgba(26, 26, 26, 0.7); margin: 0; }
input[type="text"], input[type="email"], input[type="tel"], select, textarea {
  font: inherit;
  padding: 0.75rem 0.9rem;
  border: 1.5px solid rgba(26, 26, 26, 0.35);
  border-radius: 12px;
  background: var(--white);
  color: var(--charcoal);
  width: 100%;
}
textarea { min-height: 120px; resize: vertical; }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid var(--navy); outline-offset: 1px; }
[aria-invalid="true"] { border-color: var(--danger) !important; background: #fff7f7; }
.field-error { color: #b42318; font-size: 0.85rem; font-weight: 600; min-height: 0; margin: 0; }
fieldset { border: 1.5px solid rgba(26, 26, 26, 0.18); border-radius: 14px; padding: 0.9rem 1.1rem 1.1rem; margin: 0; min-width: 0; }
fieldset legend { padding: 0 6px; }
.check-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 8px 16px; margin-top: 6px; }
.check { display: flex; align-items: center; gap: 8px; font-weight: 500; color: var(--charcoal); }
.check input { width: 20px; height: 20px; accent-color: var(--cardinal-red); flex: none; }
.check.all { font-weight: 800; color: var(--navy); }
.form-actions { margin-top: 1.4rem; display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.form-status { margin-top: 1rem; font-weight: 600; color: var(--navy); }
.form-status:empty { display: none; }
.form-status.error { color: #b42318; }
.form-status a { text-decoration: underline; color: var(--cardinal-red); }

/* Expandable guides / FAQ */
details.expand {
  background: var(--white);
  border: 1px solid rgba(26, 26, 26, 0.12);
  border-radius: 16px;
  margin-bottom: 12px;
  overflow: hidden;
}
details.expand > summary {
  cursor: pointer;
  list-style: none;
  padding: 1.1rem 1.3rem;
  font-weight: 800;
  font-family: var(--font-sans);
  color: var(--navy);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}
details.expand > summary::-webkit-details-marker { display: none; }
details.expand > summary::after { content: "+"; font-size: 1.5rem; color: var(--cardinal-red); line-height: 1; }
details.expand[open] > summary::after { content: "\2212"; }
details.expand[open] > summary { border-bottom: 1px solid rgba(26, 26, 26, 0.08); background: #f6f8fc; }
.expand-body { padding: 1.2rem 1.3rem 1.4rem; }
.expand-body h4 { margin: 1rem 0 0.4rem; color: var(--cardinal-red); font-size: 0.82rem; letter-spacing: 0.1em; text-transform: uppercase; }
.expand-body h4:first-child { margin-top: 0; }
.expand-body ul { margin: 0; padding-left: 1.2rem; }
.expand-body p { margin: 0 0 0.5rem; }

/* Tables */
.table-wrap { overflow-x: auto; border: 1px solid rgba(26, 26, 26, 0.12); border-radius: 14px; background: var(--white); }
table { border-collapse: collapse; width: 100%; font-size: 0.92rem; }
th, td { text-align: left; padding: 0.7rem 0.9rem; border-bottom: 1px solid rgba(26, 26, 26, 0.08); vertical-align: top; }
th { background: #f1f4fa; color: var(--navy); font-weight: 800; white-space: nowrap; }
tr:last-child td { border-bottom: 0; }
.yes { color: #136c37; font-weight: 800; }
.no { color: #b42318; font-weight: 800; }

/* Score-formula strip */
.formula {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  font-weight: 700;
  color: var(--navy);
  margin: 1rem 0;
}
.formula span { background: #f1f4fa; border-radius: 10px; padding: 0.45rem 0.8rem; }
.formula span.op { background: none; padding: 0; color: var(--cardinal-red); font-size: 1.3rem; }

/* Preview workspace */
.preview-banner {
  background: var(--cardinal-red);
  color: var(--white);
  text-align: center;
  padding: 0.7rem 1rem;
  font-weight: 700;
  font-size: 0.93rem;
}
.workspace { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 0; border: 1px solid rgba(20, 40, 75, 0.2); border-radius: 20px; overflow: hidden; background: var(--white); box-shadow: 0 24px 50px rgba(20, 40, 75, 0.12); }
.ws-side { background: var(--navy); color: var(--white); padding: 1.2rem 0.9rem; display: flex; flex-direction: column; gap: 4px; }
.ws-side .ws-brand { font-family: var(--font-sans); font-weight: 800; letter-spacing: 0.14em; padding: 0 0.6rem 0.8rem; font-size: 0.9rem; }
.ws-side .ws-brand small { display: block; font-weight: 600; letter-spacing: 0.04em; opacity: 0.8; margin-top: 2px; }
.ws-nav { background: none; border: 0; color: rgba(255, 255, 255, 0.88); text-align: left; font: inherit; font-weight: 600; padding: 0.6rem 0.8rem; border-radius: 10px; cursor: pointer; }
.ws-nav:hover { background: rgba(255, 255, 255, 0.1); }
.ws-nav.active, .ws-nav[aria-pressed="true"] { background: var(--cardinal-red); color: var(--white); }
.ws-side .ws-group { font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase; opacity: 0.7; padding: 0.8rem 0.8rem 0.2rem; }
.ws-main { padding: 1.5rem; min-width: 0; background: #fafbfd; }
.ws-main > header { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 1.2rem; }
.ws-main h1 { margin: 0; font-size: 1.7rem; color: var(--navy); letter-spacing: -0.03em; }
.ws-panel[hidden] { display: none; }
.ws-panel > .card, .ws-panel .card { box-shadow: none; }
.ws-panel h3.sub { margin-top: 0.2rem; }

.board { display: grid; grid-template-columns: repeat(5, minmax(160px, 1fr)); gap: 12px; overflow-x: auto; padding-bottom: 8px; }
.board-col { background: #eef1f7; border-radius: 14px; padding: 10px; min-width: 160px; }
.board-col h4 { margin: 0 0 10px; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.1em; color: var(--navy); display: flex; justify-content: space-between; }
.player-card { background: var(--white); border: 1px solid rgba(26, 26, 26, 0.1); border-radius: 12px; padding: 10px; margin-bottom: 8px; font-size: 0.86rem; }
.player-card strong { display: block; color: var(--navy); }
.player-card span { color: rgba(26, 26, 26, 0.72); display: block; }
.player-card .tags { margin-top: 6px; }
.tag { display: inline-block; font-size: 0.72rem; font-weight: 700; padding: 0.15rem 0.5rem; border-radius: 999px; background: rgba(20, 40, 75, 0.09); color: var(--navy); margin: 2px 2px 0 0; }
.tag.red { background: rgba(158, 27, 50, 0.1); color: var(--cardinal-red); }

.profile-head { display: flex; flex-wrap: wrap; gap: 18px; align-items: center; margin-bottom: 1rem; }
.avatar { width: 76px; height: 76px; border-radius: 50%; background: var(--navy); color: var(--white); display: grid; place-items: center; font-weight: 800; font-size: 1.5rem; }
.kv { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.kv div { background: var(--white); border: 1px solid rgba(26, 26, 26, 0.08); border-radius: 12px; padding: 0.7rem 0.9rem; }
.kv span { display: block; font-size: 0.74rem; text-transform: uppercase; letter-spacing: 0.08em; color: rgba(26, 26, 26, 0.7); }
.kv strong { font-size: 1.25rem; color: var(--navy); }

.bar-row { display: grid; grid-template-columns: 170px 1fr 56px; gap: 12px; align-items: center; margin: 0.55rem 0; font-size: 0.92rem; }
.bar { height: 12px; background: #e3e7f0; border-radius: 999px; overflow: hidden; }
.bar i { display: block; height: 100%; background: var(--navy); border-radius: 999px; }
.bar.red i { background: var(--cardinal-red); }
.bar-row b { text-align: right; color: var(--navy); }

.spark { display: flex; align-items: flex-end; gap: 6px; height: 90px; margin-top: 0.6rem; }
.spark i { flex: 1; background: var(--cardinal-red); border-radius: 6px 6px 0 0; position: relative; min-width: 12px; }
.spark-labels { display: flex; gap: 6px; font-size: 0.72rem; color: rgba(26, 26, 26, 0.7); }
.spark-labels span { flex: 1; text-align: center; }

.flag { display: inline-block; background: #fff3cd; color: #6b4b00; border: 1px solid #e5c76b; border-radius: 8px; padding: 0.15rem 0.5rem; font-weight: 700; font-size: 0.8rem; }

.timeline-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.timeline-list li { background: var(--white); border: 1px solid rgba(26, 26, 26, 0.08); border-radius: 12px; padding: 0.7rem 0.9rem; font-size: 0.92rem; }
.timeline-list time { font-weight: 800; color: var(--cardinal-red); margin-right: 8px; }

.lock { display: inline-flex; gap: 6px; align-items: center; font-weight: 800; color: var(--navy); font-size: 0.82rem; }

/* Pricing / misc */
.price-note { font-size: 0.85rem; color: rgba(26, 26, 26, 0.7); margin-top: 0.8rem; }
.price-card .button { margin-top: 1rem; }

.steps { counter-reset: step; list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; }
.steps li { counter-increment: step; position: relative; padding: 1rem 1rem 1rem 4rem; background: var(--white); border: 1px solid rgba(26, 26, 26, 0.08); border-radius: 16px; }
.steps li::before { content: counter(step); position: absolute; left: 1rem; top: 1rem; width: 2.2rem; height: 2.2rem; border-radius: 10px; background: var(--cardinal-red); color: var(--white); font-weight: 800; display: grid; place-items: center; }
.steps strong { color: var(--navy); }

.article { max-width: 760px; }
.article h2 { color: var(--navy); margin: 2rem 0 0.5rem; letter-spacing: -0.02em; }
.article p, .article li { color: rgba(26, 26, 26, 0.85); font-size: 1.03rem; }
.meta { color: rgba(26, 26, 26, 0.7); font-size: 0.9rem; }

.legal { max-width: 800px; }
.legal h2 { color: var(--navy); margin-top: 2rem; }

.placeholder-box { border: 2px dashed rgba(20, 40, 75, 0.35); border-radius: 20px; padding: 2rem; text-align: center; background: #f6f8fc; color: rgba(26, 26, 26, 0.8); }

/* Footer */
.site-footer { background: var(--navy); color: rgba(255, 255, 255, 0.85); border-top: 0; }
.site-footer p, .site-footer a { color: rgba(255, 255, 255, 0.85); }
.site-footer .brand { color: var(--white); }
.footer-cols { display: grid; grid-template-columns: 1.6fr repeat(3, 1fr); gap: 28px; }
.footer-col h4 { margin: 0 0 0.7rem; font-size: 0.78rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--white); }
.footer-col a { display: block; padding: 3px 0; }
.footer-col a:hover { text-decoration: underline; }
.site-footer a[aria-current="page"] { color: var(--white); border-bottom: 2px solid var(--white); }
.footer-bottom { margin-top: 1.8rem; padding-top: 1.2rem; border-top: 1px solid rgba(255, 255, 255, 0.2); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; font-size: 0.85rem; }

@media (max-width: 1180px) {
  .main-nav { display: none; position: absolute; left: 0; right: 0; top: 100%; background: var(--white); flex-direction: column; align-items: flex-start; padding: 1rem 16px 1.4rem; border-bottom: 1px solid rgba(26, 26, 26, 0.12); box-shadow: 0 18px 30px rgba(26, 26, 26, 0.1); gap: 12px; }
  .main-nav.open { display: flex; }
  .nav-toggle { display: inline-flex; }
  .nav-wrap { flex-wrap: wrap; position: relative; }
  .site-header { position: sticky; }
  .nav-wrap { position: static; }
  .site-header .container.nav-wrap { position: relative; }
}

@media (max-width: 980px) {
  .grid-3, .grid-4, .audience-grid { grid-template-columns: 1fr 1fr; }
  .workspace { grid-template-columns: 1fr; }
  .ws-side { flex-direction: row; flex-wrap: wrap; }
  .ws-side .ws-group, .ws-side .ws-brand { width: 100%; }
  .footer-cols { grid-template-columns: 1fr 1fr; }
  .split-compare { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .grid-2, .grid-3, .grid-4, .audience-grid, .form-grid, .footer-cols { grid-template-columns: 1fr; }
  .nav-wrap { flex-direction: row; align-items: center; }
  .nav-actions { display: none; }
  .main-nav .mobile-only { display: block; font-weight: 800; color: var(--cardinal-red); }
  .nav-actions .nav-link { display: none; }
  .nav-actions { flex-direction: row; }
  .nav-actions .button { width: auto; padding: 0.6rem 0.9rem; font-size: 0.88rem; }
  .form-card { padding: 1.1rem; }
  .bar-row { grid-template-columns: 110px 1fr 44px; }
  .section { padding: 3.5rem 0; }
  .price-card.featured { transform: none; }
  .footer-bottom { flex-direction: column; }
  .button { width: 100%; }
  .nav-toggle { width: auto; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { transition: none !important; }
}

/* =====================================================================
   VISUAL REDESIGN: scarlet bar, notched corners, heavy italic condensed
   display type. Brand: scarlet (main), navy (secondary), white background.
   ===================================================================== */

html { scroll-padding-top: 110px; }
body { color: var(--charcoal); }

.visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* ---------- Header / navigation ---------- */
.site-header {
  background: var(--scarlet-bar);
  border-bottom: 0;
  backdrop-filter: none;
  color: var(--white);
}
.site-header .container.nav-wrap {
  position: static;
  width: min(1360px, calc(100% - 32px));
  min-height: 84px;
  padding: 10px 0;
  gap: 18px;
  flex-wrap: nowrap;
}
.site-header :focus-visible { outline-color: var(--white); }

.brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--white);
  color: var(--navy);
  padding: 6px 18px 6px 8px;
  border-radius: 3px;
  flex: none;
}
.brand-emblem { width: 52px; height: 52px; flex: none; }
.wordmark {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 7px;
  line-height: 1;
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 900;
  text-transform: uppercase;
  white-space: nowrap;
}
.wordmark::before, .wordmark::after {
  content: "";
  width: 14px; height: 3px;
  background: var(--scarlet);
  transform: skewX(-30deg);
  flex: none;
}
.wordmark-main { font-size: 1.85rem; letter-spacing: -0.01em; color: var(--scarlet); margin: 0; }
.wordmark-sub { font-size: 1.45rem; letter-spacing: 0; color: var(--navy); margin: 0; font-weight: 800; }
.site-footer .brand { color: var(--navy); }

.main-nav, .nav-actions { gap: 22px; }
.main-nav { flex: 1; justify-content: flex-end; font-size: 0.8rem; }
.main-nav a, .nav-link {
  color: var(--white);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  line-height: 1.25;
  padding: 6px 0;
  border-bottom: 3px solid transparent;
}
.nav-link { font-size: 0.8rem; }
.main-nav a:hover, .nav-link:hover { color: var(--white); border-bottom-color: rgba(255, 255, 255, 0.6); }
.main-nav a[aria-current="page"] { color: var(--white); border-bottom: 3px solid var(--white); }
.nav-actions { flex: none; }

.nav-actions .button-primary,
.mobile-only.button {
  background: var(--white);
  color: var(--scarlet-bar);
  box-shadow: none;
  padding: 0.95rem 1.5rem;
  clip-path: polygon(var(--notch) 0, 100% 0, 100% calc(100% - var(--notch)), calc(100% - var(--notch)) 100%, 0 100%, 0 var(--notch));
}
.nav-actions .button-primary:hover { background: #ffe9ed; color: var(--cardinal-red-dark); }
.nav-actions .button-primary:focus-visible { outline: 3px solid var(--navy); outline-offset: -6px; }

.nav-toggle {
  align-items: center;
  gap: 10px;
  background: var(--white);
  color: var(--scarlet-bar);
  border: 0;
  border-radius: 0;
  padding: 0.8rem 1.1rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.85rem;
  font-weight: 800;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%);
}
.nav-toggle:focus-visible { outline: 3px solid var(--navy); outline-offset: -6px; }
.nav-toggle-bars {
  display: inline-block;
  width: 18px; height: 2px;
  background: currentColor;
  box-shadow: 0 6px 0 currentColor, 0 -6px 0 currentColor;
}

/* ---------- Buttons ---------- */
.button {
  border-radius: 0;
  padding: 1rem 1.7rem;
  font-weight: 800;
  font-size: 0.95rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  border: 0;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--notch)), calc(100% - var(--notch)) 100%, 0 100%);
}
.button-primary {
  background: linear-gradient(135deg, #E41E3F 0%, #C8102E 100%);
  color: var(--white);
  box-shadow: none;
}
.button-primary:hover { background: linear-gradient(135deg, #C8102E 0%, #A50D25 100%); }
.button-primary:focus-visible { outline: 3px solid var(--white); outline-offset: -6px; }
.button-secondary {
  background: var(--white);
  color: var(--charcoal);
  border: 1px solid #8a8f99;
  border-right-color: #8a8f99;
}
.button-secondary:hover { background: #fdf0f2; border-color: var(--cardinal-red); color: var(--cardinal-red); }
.button-secondary:focus-visible { outline: 3px solid var(--navy); outline-offset: -6px; }
.button-navy { background: var(--navy); color: var(--white); }
.button-navy:focus-visible { outline: 3px solid var(--white); outline-offset: -6px; }
.button-small { padding: 0.6rem 1.1rem; font-size: 0.8rem; --notch: 8px; }

/* ---------- Typography ---------- */
.hero-copy h1.hero-title,
.page-hero h1,
.section-header h2,
.quote-card h2,
h2.sub,
.hero-headline {
  font-family: var(--font-display);
  font-style: italic;
  text-transform: uppercase;
}
.section-header h2, .quote-card h2 {
  font-weight: 900;
  font-size: clamp(2.4rem, 5vw, 4rem);
  letter-spacing: 0;
  line-height: 0.98;
  color: var(--navy);
}
.quote-card h2 { color: var(--white); }
h2.sub { font-weight: 800; font-size: 2rem; letter-spacing: 0.01em; color: var(--navy); line-height: 1.05; }
h3.sub { color: var(--navy); }
.article h2, .legal h2 { font-family: var(--font-display); font-style: italic; text-transform: uppercase; font-weight: 800; font-size: 1.9rem; color: var(--navy); letter-spacing: 0.01em; }
.lead, .hero-text, .page-hero p, .section-header p, .article p, .article li { color: var(--body-gray); }

.eyebrow {
  background: none;
  border: 0;
  border-left: 5px solid var(--scarlet);
  border-radius: 0;
  padding: 0.2rem 0 0.2rem 0.9rem;
  color: var(--navy-bright);
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.24em;
  margin-bottom: 1.1rem;
}
.eyebrow.light { background: none; border-color: var(--scarlet); color: var(--white); }
.eyebrow.navy { background: none; color: var(--navy-bright); border-color: var(--scarlet); }
.quote-card .eyebrow { text-align: left; }

/* ---------- Home hero ---------- */
.hero {
  padding: 2.2rem 0 3.4rem;
  background: linear-gradient(180deg, var(--offwhite) 0%, #efeff1 100%);
  border-bottom: 3px solid var(--scarlet);
}
.hero-grid { align-items: start; gap: 40px; grid-template-columns: minmax(0, 1fr); }
.hero-copy { max-width: 980px; }
.hero-copy .audience-grid { max-width: 900px; }
.tagline {
  margin: 0 0 0.2rem;
  color: var(--cardinal-red);
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.3em;
  text-transform: uppercase;
}
.hero-copy h1.hero-title {
  margin: 0;
  max-width: none;
  font-weight: 900;
  font-size: clamp(4.4rem, 13vw, 9.2rem);
  line-height: 0.9;
  letter-spacing: -0.01em;
  color: var(--scarlet);
  padding-right: 0.1em;
}
.hero-title .t-the::first-letter { color: var(--navy); }
.hero-subtitle {
  margin: 1.1rem 0 1.4rem;
  padding: 0.35rem 0 0.35rem 1.1rem;
  border-left: 5px solid var(--scarlet);
  color: var(--navy-bright);
  font-weight: 800;
  font-size: clamp(0.95rem, 2vw, 1.45rem);
  letter-spacing: 0.26em;
  line-height: 1.5;
  text-transform: uppercase;
  max-width: 760px;
}
.hero-headline {
  margin: 0 0 0.6rem;
  font-weight: 800;
  font-size: clamp(1.7rem, 3vw, 2.3rem);
  line-height: 1.05;
  letter-spacing: 0.01em;
  color: var(--navy);
}
.hero-text { font-size: 1.1rem; margin: 0.8rem 0 1.6rem; }
.hero-points { color: var(--charcoal); }
.hero-points li::before { border-radius: 0; transform: skewX(-20deg); }
.cta-row { gap: 12px; }

.hero-panel {
  background: var(--navy);
  border-radius: 4px;
  border-top: 5px solid var(--scarlet);
  box-shadow: 0 24px 50px rgba(20, 40, 75, 0.22);
  margin-top: 1.4rem;
}
.panel-body, .mini-card, .insight-row { border-radius: 3px; }
.confidence { border-radius: 3px; }
.large-score { font-family: var(--font-display); font-style: italic; letter-spacing: 0; }

/* ---------- Sport tiles ---------- */
.sport-strip { background: #fafbfc; padding: 1.6rem 0 2rem; }
.sport-tiles {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
}
.sport-tile {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: 92px;
  padding: 0.8rem;
  color: var(--white);
  background: linear-gradient(135deg, #EE2A4D 0%, #CC1632 100%);
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 800;
  font-size: 1.3rem;
  line-height: 1.1;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--notch)), calc(100% - var(--notch)) 100%, 0 100%);
  transition: transform 0.2s ease, filter 0.2s ease;
}
.sport-tile:hover { transform: translateY(-3px); filter: brightness(1.08); }
.sport-tile:focus-visible { outline: 3px solid var(--navy); outline-offset: -7px; }
.sport-tile-soon {
  background: #0d1a30;
  border: 2px dashed rgba(255, 255, 255, 0.45);
}
.sport-tile-soon:focus-visible { outline-color: var(--white); }

/* ---------- Page hero / sections ---------- */
.page-hero {
  background: linear-gradient(180deg, var(--offwhite) 0%, #efeff1 100%);
  border-bottom: 3px solid var(--scarlet);
  padding: 3.4rem 0 2.8rem;
}
.page-hero h1 {
  font-weight: 900;
  font-size: clamp(2.6rem, 6.5vw, 5rem);
  line-height: 0.95;
  letter-spacing: 0;
  color: var(--scarlet);
  max-width: 960px;
}
.page-hero p { font-size: 1.1rem; }
.section-alt { background: var(--offwhite); }
.stats-bar, .section-dark { background: var(--navy); }
.stats-grid strong { font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: clamp(2rem, 3vw, 2.8rem); letter-spacing: 0.02em; }
.stats-bar { border-top: 3px solid var(--scarlet); }

/* ---------- Cards, panels ---------- */
.feature-card, .score-card, .price-card, .card, .form-card, .audience-card, .timeline-item {
  border-radius: 4px;
  border: 1px solid #dfe2e8;
  border-top: 4px solid var(--scarlet);
  background: var(--white);
  box-shadow: 0 8px 22px rgba(20, 40, 75, 0.06);
}
.audience-card { border-top: 1px solid #dfe2e8; border-left: 5px solid var(--scarlet); border-width: 1px 1px 1px 5px; }
.audience-card:hover { border-color: var(--navy); border-left-color: var(--scarlet); transform: translateY(-2px); }
.audience-card strong { color: var(--navy); font-weight: 800; }
.audience-card span { color: var(--body-gray); }
.audience-card em { color: var(--cardinal-red); }
.feature-card p, .score-card p, .card p, .workflow-layout p, .price-card ul { color: var(--body-gray); }
.feature-card h3, .score-card h3, .price-card h3, .card h3 { color: var(--navy); font-weight: 800; }
.feature-card h3 a:hover, .card .more:hover { color: var(--scarlet-bar); text-decoration: underline; }
.split-compare .card.obj { border-top-color: var(--navy); }
.split-compare .card.subj { border-top-color: var(--scarlet); }
a.card { display: block; }
a.card:hover { border-color: var(--cardinal-red); }

.icon, .timeline-item span, .steps li::before {
  border-radius: 0;
  background: linear-gradient(135deg, #EE2A4D 0%, #CC1632 100%);
  color: var(--white);
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 800;
  font-size: 1.3rem;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%);
}
.timeline-item { background: var(--white); }
.steps li { border-radius: 4px; border-left: 5px solid var(--scarlet); }
.steps li::before { border-radius: 0; }

.pill, .badge, .tag, .flag {
  border-radius: 0;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%);
}
.tag { padding-bottom: 0.2rem; }
.flag { clip-path: none; border-radius: 2px; }
.pill.red { background: rgba(200, 16, 46, 0.1); color: var(--cardinal-red); }
.price-card.featured { background: var(--white); border-top: 8px solid var(--scarlet); border-color: #dfe2e8; border-top-color: var(--scarlet); }
.badge { background: var(--scarlet-bar); }
.price { font-family: var(--font-display); font-style: italic; font-weight: 800; letter-spacing: 0; color: var(--navy); }
.price span { font-family: var(--font-body); font-style: normal; font-weight: 500; }
.price-card ul li::before { border-radius: 0; transform: skewX(-20deg); }

.notice { border-radius: 2px; background: #fdf3f5; }
.notice.navy { background: #eef2fa; }
.placeholder-box { border-radius: 4px; }

/* ---------- Forms ---------- */
.form-card { border-radius: 4px; }
input[type="text"], input[type="email"], input[type="tel"], select, textarea { border-radius: 2px; border-color: #6b7280; }
fieldset { border-radius: 4px; border-color: #b9bec8; }
.field label, fieldset legend { color: var(--navy); }

/* ---------- Expanders, tables ---------- */
details.expand { border-radius: 4px; border: 1px solid #dfe2e8; border-left: 5px solid var(--scarlet); }
details.expand > summary { font-family: var(--font-display); font-style: italic; text-transform: uppercase; font-size: 1.35rem; letter-spacing: 0.02em; font-weight: 800; }
details.expand[open] > summary { background: var(--offwhite); }
.table-wrap { border-radius: 4px; border-top: 4px solid var(--scarlet); }
th { background: var(--navy); color: var(--white); text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.8rem; }

/* ---------- Preview workspace ---------- */
.preview-banner { background: var(--scarlet-bar); letter-spacing: 0.04em; }
.workspace { border-radius: 4px; border-top: 4px solid var(--scarlet); }
.ws-nav { border-radius: 2px; }
.ws-nav.active, .ws-nav[aria-pressed="true"] { background: var(--scarlet-bar); }
.ws-side .ws-brand { font-family: var(--font-display); font-style: italic; font-size: 1.2rem; letter-spacing: 0.06em; }
.ws-main h1 { font-family: var(--font-display); font-style: italic; text-transform: uppercase; font-size: 2.2rem; font-weight: 800; letter-spacing: 0.01em; }
.board-col, .player-card, .kv div, .timeline-list li { border-radius: 3px; }
.ws-nav:focus-visible { outline-color: var(--white); }

/* ---------- Footer ---------- */
.site-footer { background: var(--navy); border-top: 5px solid var(--scarlet); padding: 3rem 0 2rem; }
.site-footer .brand { margin-bottom: 1rem; padding: 6px 16px 6px 8px; }
.site-footer .brand-emblem { width: 44px; height: 44px; }
.site-footer .wordmark-main { font-size: 1.5rem; }
.site-footer .wordmark-sub { font-size: 1.2rem; }
.site-footer :focus-visible { outline-color: var(--white); }
.footer-col h4 { font-family: var(--font-display); font-style: italic; font-size: 1.15rem; letter-spacing: 0.1em; }
.site-footer p, .site-footer a { color: rgba(255, 255, 255, 0.9); }
.site-footer .brand { color: var(--navy); }

/* ---------- "THE READ" brand name: always bold bright scarlet ---------- */
.tr { color: var(--scarlet); font-weight: 800; }
.section-dark .tr, .stats-bar .tr, .site-footer .tr, .ws-side .tr, .preview-banner .tr, .hero-panel .tr { color: #FF5A78; }
.preview-banner .tr { color: var(--white); }

/* ---------- Responsive ---------- */
@media (max-width: 1399px) {
  .nav-toggle { display: inline-flex; order: 3; }
  .nav-actions { order: 2; margin-left: auto; gap: 16px; }
  .site-header { position: sticky; }
  .main-nav {
    display: none;
    position: absolute;
    left: 0; right: 0; top: 100%;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 0.4rem 16px 1rem;
    background: var(--cardinal-red-dark);
    border-bottom: 4px solid var(--scarlet);
    box-shadow: 0 18px 30px rgba(14, 28, 54, 0.25);
    font-size: 0.95rem;
    max-height: calc(100vh - 90px);
    overflow-y: auto;
  }
  .main-nav.open { display: flex; }
  .main-nav a {
    padding: 0.95rem 0.4rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.22);
  }
  .main-nav a[aria-current="page"] { border-bottom: 1px solid rgba(255, 255, 255, 0.22); border-left: 5px solid var(--white); padding-left: 0.8rem; }
  .main-nav .mobile-only { display: block; }
  .main-nav .mobile-only { color: var(--white); }
}
@media (min-width: 1400px) {
  .main-nav .mobile-only { display: none; }
}

@media (max-width: 980px) {
  .hero-grid { grid-template-columns: 1fr; }
  .sport-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hero-panel { margin-top: 0; }
}

@media (max-width: 640px) {
  .site-header .container.nav-wrap { flex-direction: row; align-items: center; min-height: 72px; gap: 10px; }
  .nav-actions { display: none; }
  .brand { padding: 5px 12px 5px 6px; gap: 6px; }
  .brand-emblem { width: 40px; height: 40px; }
  .wordmark { gap: 4px; }
  .wordmark::before, .wordmark::after { display: none; }
  .wordmark-main { font-size: 1.35rem; }
  .wordmark-sub { font-size: 1.05rem; }
  .nav-toggle { width: auto; padding: 0.7rem 0.9rem; margin-left: auto; }
  .sport-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .sport-tile { min-height: 76px; font-size: 1.1rem; }
  .hero { padding-top: 1.6rem; }
  .hero-copy h1.hero-title { font-size: clamp(4rem, 22vw, 6rem); }
  .hero-subtitle { letter-spacing: 0.16em; font-size: 0.9rem; }
  .eyebrow { letter-spacing: 0.16em; }
  .stats-grid { grid-template-columns: 1fr 1fr; }
  .site-footer .brand { margin-bottom: 0.8rem; }
}

@media (max-width: 360px) {
  .wordmark-sub { display: none; }
}

/* ---------- More navy balance ---------- */
.page-hero { background: linear-gradient(135deg, var(--navy-dark) 0%, var(--navy) 100%); border-bottom: 4px solid var(--scarlet); }
.page-hero h1 { color: var(--white); }
.page-hero h1 .tr, .page-hero .tr { color: #FF5A78; }
.page-hero p { color: rgba(255, 255, 255, 0.88); }
.page-hero .eyebrow { background: none; border-color: var(--scarlet); color: var(--white); }
.page-hero a:not(.button) { color: var(--white); text-decoration: underline; }
.page-hero .button-secondary { background: transparent; color: var(--white); border-color: var(--white); }
.page-hero .button-secondary:hover { background: var(--white); color: var(--navy); }
.page-hero :focus-visible { outline-color: var(--white); }
.sport-strip { background: var(--navy); border-top: 4px solid var(--scarlet); padding: 2rem 0 2.4rem; }
.section-alt { background: #E9EDF6; }
.section-alt .card, .section-alt .feature-card, .section-alt .score-card { background: var(--white); }
.section-dark h2, .section-dark h3 { color: var(--white); }details.expand > summary { display: block; position: relative; padding-right: 3.2rem; }
details.expand > summary::after { position: absolute; right: 1.3rem; top: 50%; transform: translateY(-50%); }
/* ---------- Header: role links, More menu, Sign In / Get Started ---------- */
:where(h1, h2, h3, h4, h5, h6, summary, legend, label, th, .audience-card strong, .audience-card em) { text-transform: capitalize; }
.main-nav { gap: 16px; }
.nav-actions { gap: 10px; }
.nav-actions .button { padding: 0.7rem 1.1rem; font-size: 0.82rem; white-space: nowrap; }
.nav-actions .button-outline-light { background: transparent; color: var(--white); border: 2px solid var(--white); clip-path: none; }
.nav-actions .button-outline-light:hover { background: var(--white); color: var(--cardinal-red-dark); }
.nav-actions .button-outline-light:focus-visible { outline: 3px solid var(--white); outline-offset: 3px; }
.nav-more { position: relative; }
.nav-more > summary { list-style: none; cursor: pointer; color: rgba(255, 255, 255, 0.95); font-weight: 800; font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; padding: 0.4rem 0; border-bottom: 3px solid transparent; font-family: var(--font-sans); font-style: normal; }
.nav-more > summary::-webkit-details-marker { display: none; }
.nav-more > summary::after { content: " \25BE"; }
.nav-more.has-current > summary, .nav-more > summary:hover { color: var(--white); border-bottom-color: rgba(255, 255, 255, 0.6); }
.nav-more > summary:focus-visible { outline: 3px solid var(--white); outline-offset: 3px; }
.nav-more-menu { position: absolute; right: 0; top: calc(100% + 14px); min-width: 190px; background: var(--navy); border-top: 4px solid var(--scarlet); box-shadow: 0 18px 30px rgba(14, 28, 54, 0.3); display: flex; flex-direction: column; z-index: 60; }
.nav-more-menu a { padding: 0.8rem 1.1rem; border-bottom: 1px solid rgba(255, 255, 255, 0.15); color: var(--white); }
.nav-more-menu a:hover { background: var(--navy-bright); }
.main-nav .narrow-only { display: none; }
@media (max-width: 1399px) {
  .main-nav .desktop-only { display: none; }
  .nav-actions { order: 2; margin-left: auto; }
  .nav-actions .nav-link { display: none; }
}
@media (max-width: 900px) {
  .nav-actions { display: none; }
  .main-nav .narrow-only { display: block; font-weight: 800; color: var(--white); }
}.main-nav a, .nav-more > summary { white-space: nowrap; }
@media (min-width: 1400px) { .main-nav { gap: 14px; font-size: 0.76rem; } .main-nav a, .nav-more > summary { letter-spacing: 0.05em; } }
/* ---------- Bolder scarlet + navy bands ---------- */
main > .section { background: #E9EDF6; border-top: 0; }
main > .section:nth-child(4n+3), main > .section.section-dark { background: linear-gradient(135deg, var(--navy-dark) 0%, var(--navy) 100%); color: var(--white); }
main > .section:nth-child(4n+1) { background: linear-gradient(135deg, var(--cardinal-red-dark) 0%, var(--cardinal-red) 100%); color: var(--white); border-top: 4px solid var(--navy); }
main > .section:nth-child(4n+3), main > .section.section-dark { border-top: 4px solid var(--scarlet); }
main > .section.section-alt:nth-child(4n+2), main > .section.section-alt:nth-child(4n) { background: #E9EDF6; color: inherit; }
main > .section:nth-child(4n+3) .section-header h2, main > .section:nth-child(4n+1) .section-header h2,
main > .section.section-dark .section-header h2, main > .section:nth-child(4n+3) .section-header p, main > .section:nth-child(4n+1) .section-header p,
main > .section.section-dark .section-header p { color: var(--white); }
main > .section:nth-child(4n+3) .eyebrow, main > .section:nth-child(4n+1) .eyebrow, main > .section.section-dark .eyebrow { color: var(--white); background: none; border-color: var(--scarlet); }
main > .section:nth-child(4n+1) .eyebrow { border-color: var(--white); }
main > .section:nth-child(4n+3) :is(.price-note, .lead), main > .section:nth-child(4n+1) :is(.price-note, .lead),
main > .section:nth-child(4n+3) > .container > p, main > .section:nth-child(4n+1) > .container > p { color: rgba(255, 255, 255, 0.92); }
main > .section :is(.card, .feature-card, .score-card, .price-card, .form-card, .audience-card, .timeline-item, details.expand, .table-wrap, .article, .legal, .panel, .callout, .steps li, .stat-card) { background: var(--white); color: var(--body-gray); }
main > .section a:not(.button):not(.card):not(.audience-card) { text-decoration-color: currentColor; }
main > .section:nth-child(4n+3) > .container > p a, main > .section:nth-child(4n+1) > .container > p a, main > .section:nth-child(4n+3) .section-header a, main > .section:nth-child(4n+1) .section-header a { color: var(--white); }
main > .section:nth-child(4n+3) .button-secondary, main > .section:nth-child(4n+1) .button-secondary, main > .section.section-dark .button-secondary { background: transparent; color: var(--white); border-color: var(--white); }
main > .section:nth-child(4n+3) .button-secondary:hover, main > .section:nth-child(4n+1) .button-secondary:hover { background: var(--white); color: var(--navy); }
main > .section:nth-child(4n+1) .button-primary { background: var(--white); color: var(--cardinal-red-dark); }
main > .section:nth-child(4n+3) :is(.tr, .section-header .tr), main > .section.section-dark .tr { color: #FF5A78; }
main > .section:nth-child(4n+1) .tr { color: var(--white); }
main > .section :is(.card, .feature-card, .score-card, .price-card, .audience-card):nth-child(even) { border-top-color: var(--navy); }
#pricing { background: #E9EDF6 !important; color: inherit !important; }
.hero { border-bottom: 5px solid var(--navy); }
/* ---------- Keep white as the base; color comes from bands ---------- */
main > .section { background: var(--white); border-top: 4px solid var(--scarlet); }
main > .section:nth-child(4n+1) { border-top: 4px solid var(--navy); }
main > .section:nth-child(4n+3), main > .section.section-dark { border-top: 4px solid var(--scarlet); }
main > .section.section-alt:nth-child(4n+2), main > .section.section-alt:nth-child(4n) { background: var(--white); }
#pricing { background: var(--white) !important; }
main > .section:not(:nth-child(4n+3)):not(:nth-child(4n+1)):not(.section-dark) .section-header h2 { color: var(--navy); }
main > .section :is(.card, .feature-card, .score-card, .price-card, .audience-card):nth-child(odd) { border-top-color: var(--scarlet); }main > .page-hero + .section:last-child { background: #E9EDF6; }
/* ---------- Navy home hero ---------- */
.hero { background: radial-gradient(ellipse at 80% 20%, #1d3a6b 0%, transparent 55%), linear-gradient(135deg, var(--navy-dark) 0%, var(--navy) 100%); border-bottom: 5px solid var(--scarlet); }
.hero .tagline { color: var(--white); }
.hero-title .t-the, .hero-title .t-the::first-letter { color: var(--white); }
.hero-copy h1.hero-title .t-read { color: #FF3B5C; }
.hero-subtitle { color: var(--white); border-left-color: var(--scarlet); }
.hero-headline { color: var(--white); }
.hero-text { color: rgba(255, 255, 255, 0.92); }
.hero .hero-text .tr { color: #FF5A78; }
.hero-points { color: var(--white); }
.hero-points li::before { background: var(--scarlet); }
.hero .button-secondary { background: transparent; color: var(--white); border-color: var(--white); }
.hero .button-secondary:hover { background: var(--white); color: var(--navy); }
.hero .button-primary { background: linear-gradient(135deg, #F0314F 0%, var(--cardinal-red) 100%); color: var(--white); }
.hero :focus-visible { outline-color: var(--white); }
.hero .audience-card:focus-visible { outline-color: var(--scarlet); }
.sport-strip { border-top: 0; }.sport-strip { background: var(--white); }
.sport-tile-soon { background: var(--navy); }
/* ===== Coach workspace + department view (fictional preview) ===== */
.coach-section { background: #E9EDF6 !important; color: var(--navy) !important; border-top: 4px solid var(--scarlet) !important; }
.coach-section .preview-banner { margin-bottom: 1rem; border-radius: 4px; }
.coach-subnav { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 1.4rem; padding: 8px; background: var(--navy); border-bottom: 4px solid var(--scarlet); }
.coach-subnav a { color: #fff; text-decoration: none; font-family: var(--font-display); font-style: italic; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; padding: .45rem .8rem; font-size: 1rem; }
.coach-subnav a:hover { background: rgba(255,255,255,.14); }
.coach-subnav a[aria-current="page"] { background: var(--scarlet); }
.coach-subnav .coach-subnav-home { background: rgba(255,255,255,.12); }
.coach-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 18px; margin: 1.2rem 0; align-items: start; }
.coach-card { padding: 0 !important; overflow: hidden; background: #fff; border: 1px solid rgba(20,40,75,.15); border-top: 0 !important; }
.coach-card > h2 { margin: 0 0 .8rem; padding: .6rem 1rem; background: var(--navy); color: #fff; font-size: 1.25rem; border-bottom: 3px solid var(--scarlet); }
.coach-card > :not(h2) { margin-left: 1rem; margin-right: 1rem; }
.coach-card > .table-wrap { margin-left: 0; margin-right: 0; border: 0; border-radius: 0; box-shadow: none; }
.coach-card > :last-child { margin-bottom: 1rem; }
.coach-card.wide { grid-column: 1 / -1; }
.coach-card table th, .coach-card table td { padding: .5rem .7rem; font-size: .92rem; }
.coach-h2 { color: var(--navy); font-size: 1.8rem; margin: 2rem 0 .4rem; padding-bottom: .3rem; border-bottom: 3px solid var(--scarlet); }
.coach-note { font-size: .85rem; color: #3b4660; margin: .6rem 1rem; }
.coach-count { margin: .6rem 0; font-weight: 700; color: var(--navy); }
.kpi-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin: 0 0 1.2rem; }
.kpi { background: var(--navy); color: #fff; padding: .8rem 1rem; border-left: 5px solid var(--scarlet); }
.kpi span { display: block; font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; color: #d5dcec; }
.kpi strong { font-family: var(--font-display); font-style: italic; font-size: 2rem; line-height: 1.1; color: #fff; }
.controls { display: flex; flex-wrap: wrap; gap: 14px; align-items: end; background: #fff; border: 1px solid rgba(20,40,75,.15); border-left: 5px solid var(--scarlet); padding: .9rem 1rem; margin-bottom: 1rem; }
.controls label { display: flex; flex-direction: column; gap: 4px; font-weight: 700; font-size: .85rem; color: var(--navy); }
.controls input, .controls select { font: inherit; padding: .5rem .6rem; border: 1px solid #8892a8; background: #fff; color: #14284B; min-width: 150px; border-radius: 3px; }
.controls input:focus-visible, .controls select:focus-visible { outline: 3px solid var(--scarlet); outline-offset: 1px; }
#r-table thead th, .h2h-table thead th { background: var(--navy); color: #fff; }
#r-table th button { all: unset; cursor: pointer; font-weight: 800; color: #fff; text-transform: uppercase; letter-spacing: .04em; font-size: .78rem; white-space: nowrap; }
#r-table th button:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.coach-section table a { color: var(--cardinal-red); font-weight: 700; }
.coach-section table tbody th { color: var(--navy); }
.kvs .kv, .kvs.kv { display: flex; justify-content: space-between; gap: 10px; border: 0; border-bottom: 1px solid rgba(20,40,75,.12); border-radius: 0; padding: .35rem 0; background: none; }
.kvs .kv span { text-transform: none; letter-spacing: 0; font-size: .9rem; color: #3b4660; }
.kvs .kv strong { font-size: 1rem; text-align: right; }
.adv-good { color: #0a6b2f; font-weight: 700; }
.adv-bad { color: var(--cardinal-red); font-weight: 700; }
.adv-a { color: var(--cardinal-red); font-weight: 800; }
.adv-b { color: var(--navy-bright); font-weight: 800; }
.adv-even { color: #3b4660; }
.adv-cell { text-align: center; white-space: nowrap; }
.h2h-head { display: grid; grid-template-columns: 1fr auto 1fr; gap: 12px; align-items: center; margin-bottom: 1rem; text-align: center; }
.h2h-p { background: var(--navy); color: #d5dcec; padding: .7rem; font-size: .8rem; text-transform: uppercase; letter-spacing: .1em; }
.h2h-p strong { display: block; color: #fff; font-family: var(--font-display); font-style: italic; font-size: 1.6rem; text-transform: none; }
.h2h-mid { font-family: var(--font-display); font-style: italic; font-weight: 900; font-size: 2.2rem; color: var(--scarlet); }
.h2h-table { margin-bottom: 1rem; }
.h2h-table caption { text-align: left; font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 1.3rem; text-transform: uppercase; color: var(--navy); padding: .4rem .7rem; border-bottom: 3px solid var(--scarlet); }
.h2h-table td { text-align: center; }
.read-note { margin: 1.5rem 0 0; background: #fff; border-left: 6px solid var(--scarlet); padding: 1rem 1.2rem; color: var(--navy); }
.pill-t1 { background: var(--scarlet); color: #fff; }
.pill-t2 { background: var(--navy); color: #fff; }
.pill-t3 { background: #d5dcec; color: var(--navy); }
.coach-card .pill { margin: 0; }
.plain-list { padding-left: 1.2rem; }
.philo { border: 0; padding: 0; margin: 0 1rem .6rem; }
.philo legend { font-weight: 800; color: var(--navy); }
.philo label { display: block; padding: .25rem 0; }
.frame-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 16px; }
.frame-table caption { font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 1.3rem; text-align: left; padding: .5rem .7rem; background: var(--navy); color: #fff; border-bottom: 3px solid var(--scarlet); text-transform: uppercase; }
.frame-table td, .frame-table th { text-align: center; padding: .35rem .5rem; font-size: .9rem; }
.table-wrap.narrow { max-width: 360px; }
.calc { margin: 0 1rem 1rem; border-left: 0; padding-left: 0; background: none; border: 0; }
.calc-out { margin: 0 1rem; }
.link-banner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; background: #fff; border-left: 8px solid var(--scarlet); padding: 1.2rem 1.4rem; }
.link-banner h2 { color: var(--navy); margin: 0 0 .4rem; font-size: 1.6rem; }
.link-banner p { margin: 0; max-width: 60ch; color: #3b4660; }
.link-banner a:not(.button) { color: var(--cardinal-red); font-weight: 700; }
.coach-link-section .link-banner { margin: 0; }
@media (max-width: 700px) {
  .h2h-head { grid-template-columns: 1fr; }
  .h2h-mid { font-size: 1.6rem; }
  .coach-subnav a { padding: .4rem .55rem; font-size: .92rem; }
  .controls label, .controls input, .controls select { width: 100%; min-width: 0; }
}
/* Coach tables + header fit */
tbody th, .coach-card tbody th { background: #f1f4fa; color: var(--navy); text-transform: none; letter-spacing: 0; font-size: .9rem; white-space: normal; }
.coach-card table { width: 100%; }
@media (min-width: 1400px) {
  .main-nav { gap: 9px; font-size: 0.72rem; }
  .main-nav a, .nav-more > summary { letter-spacing: 0.02em; }
  .nav-actions { gap: 8px; }
  .nav-actions .button { padding: 0.6rem 0.85rem; font-size: 0.76rem; }
}
.h2h-table { width: 100%; table-layout: fixed; }
.h2h-table th, .h2h-table td { white-space: normal; }
.h2h-table th:nth-child(2) { width: 34%; }
@media (max-width: 700px) { .h2h-table th { font-size: .68rem; letter-spacing: 0; padding: .4rem .3rem; } .h2h-table td { padding: .4rem .3rem; font-size: .85rem; } }

/* ===== Workspace tabs: notched buttons; coach = scarlet band, department = navy band ===== */
.coach-subnav, .dept-subnav { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 1.4rem; padding: 12px; border-bottom: 0; }
.coach-subnav { background: var(--scarlet); }
.dept-subnav { background: var(--navy); border-top: 4px solid var(--scarlet); }
.coach-subnav a, .dept-subnav a { position: relative; display: inline-block; color: #fff; text-decoration: none; font-family: var(--font-display); font-style: italic; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; padding: .55rem 1rem; font-size: 1rem; background: transparent; box-shadow: inset 0 0 0 2px #fff; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%); }
.coach-subnav a:hover, .dept-subnav a:hover { background: rgba(255,255,255,.18); }
.coach-subnav a[aria-current="page"] { background: var(--navy); color: #fff; box-shadow: none; }
.dept-subnav a[aria-current="page"] { background: var(--scarlet); color: #fff; box-shadow: none; }
.coach-subnav a:focus-visible, .dept-subnav a:focus-visible { outline: 3px solid #fff; outline-offset: -6px; background: rgba(255,255,255,.22); }
.coach-subnav a[aria-current="page"]:focus-visible { outline-color: #fff; }
.coach-subnav .coach-subnav-home, .dept-subnav .ws-out { margin-left: auto; background: #fff; color: var(--navy); box-shadow: none; }
.coach-subnav .coach-subnav-home:hover, .dept-subnav .ws-out:hover { background: #e9edf6; }
.ws-label { color: #fff; font-family: var(--font-display); font-style: italic; font-weight: 800; text-transform: uppercase; letter-spacing: .12em; font-size: .85rem; padding: 0 .6rem; flex-basis: 100%; opacity: .9; }
.coach-subnav + *, .dept-subnav + * { margin-top: 0; }

/* Department workspace: its own look (navy-headed cards, program tiles) */
.ws-dept .coach-section { background: #fff !important; border-top-color: var(--navy) !important; }
.ws-dept .coach-card, .ws-dept .dept-card { border-top: 0 !important; border-left: 8px solid var(--navy) !important; }
.ws-dept .coach-card h2, .ws-dept .dept-card h2 { background: var(--navy); color: #fff; margin: -1.2rem -1.2rem 1rem; padding: .7rem 1.2rem; }
.ws-dept .kpi { background: var(--navy); color: #fff; border-top: 0; border-bottom: 6px solid var(--scarlet); }
.ws-dept .kpi span, .ws-dept .kpi strong { color: #fff; }
.ws-dept table thead th { background: var(--navy); color: #fff; }
.dept-programs { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; margin-bottom: 1.4rem; }
.dept-card { background: #fff; padding: 1.2rem; }
.dept-card p { margin: .4rem 0; }
.dept-coach { color: var(--scarlet-dark, #B3122F); font-weight: 700; }
.dept-dl { display: flex; gap: .6rem; margin: .8rem 0; }
.dept-dl div { flex: 1; background: #E9EDF6; padding: .5rem; text-align: center; }
.dept-dl dt { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--navy); font-weight: 700; }
.dept-dl dd { margin: 0; font-size: 1.5rem; font-weight: 800; color: var(--navy); }
.dept-list { padding-left: 1.2rem; }
.dept-note { border-left-color: var(--navy); }
@media (max-width: 720px) { .coach-subnav, .dept-subnav { gap: 6px; padding: 8px; } .coach-subnav a, .dept-subnav a { padding: .45rem .7rem; font-size: .9rem; } .coach-subnav .coach-subnav-home, .dept-subnav .ws-out { margin-left: 0; } }
/* Department look overrides: light cards with navy rule, scarlet headings (coach keeps navy-header cards) */
.coach-subnav .coach-subnav-home { order: 99; }
.ws-dept .coach-section { background: #F4F6FB !important; }
.ws-dept .coach-card, .ws-dept .dept-card { background: #fff; border: 1px solid #cfd6e6 !important; border-left: 8px solid var(--scarlet) !important; padding: 1.2rem; }
.ws-dept .coach-card h2, .ws-dept .dept-card h2 { background: transparent; color: var(--scarlet); margin: 0 0 .8rem; padding: 0 0 .4rem; border-bottom: 3px solid var(--navy); }
.ws-dept .kpi { background: #fff; color: var(--navy); border: 1px solid #cfd6e6; border-left: 8px solid var(--navy); border-bottom: 1px solid #cfd6e6; }
.ws-dept .kpi span { color: #4a5675; }
.ws-dept .kpi strong { color: var(--scarlet); }
.ws-dept table thead th { background: #E9EDF6; color: var(--navy); border-bottom: 3px solid var(--navy); }
/* H2H sheet layout: Player A labels|values | center | Player B values|labels */
.h2h-sheet { background: #fff; border: 1px solid #cfd6e6; border-top: 6px solid var(--scarlet); padding: 1rem; margin-bottom: 1.5rem; }
.h2h-title { text-align: center; color: var(--navy); margin: 0 0 1rem; }
.h2h-top { display: grid; grid-template-columns: 1fr auto 1fr; gap: 12px; align-items: end; margin-bottom: 1rem; }
.h2h-pick { display: block; background: var(--navy); color: #fff; padding: .6rem; font-size: .8rem; text-transform: uppercase; letter-spacing: .1em; font-weight: 700; }
.h2h-pick select { display: block; width: 100%; margin-top: .4rem; }
.h2h-mid { font-family: var(--font-display); font-style: italic; font-weight: 900; font-size: 2.4rem; color: var(--scarlet); text-align: center; padding: 0 1rem; }
.h2h-block { display: grid; grid-template-columns: 1.3fr 1fr .8fr 1fr 1.3fr; margin-bottom: 1rem; border: 1px solid #cfd6e6; }
.h2h-row, .h2h-sec { display: contents; }
.h2h-row > span, .h2h-sec > span { padding: .5rem .7rem; border-bottom: 1px solid #e3e8f2; }
.h2h-l { font-weight: 700; color: var(--navy); background: #E9EDF6; }
.h2h-r { font-weight: 700; color: var(--navy); background: #E9EDF6; text-align: right; }
.h2h-a, .h2h-b, .h2h-c { text-align: center; }
.h2h-c { background: #F4F6FB; }
.h2h-sec span { background: var(--navy) !important; color: #fff !important; font-family: var(--font-display); font-style: italic; font-weight: 800; font-size: 1.15rem; text-transform: uppercase; border-bottom: 3px solid var(--scarlet); }
.h2h-sec .h2h-c { text-align: center; font-size: .9rem; }
.h2h-sec .h2h-l, .h2h-sec .h2h-r { grid-column: auto; }
.h2h-sec .h2h-l { grid-column: 1 / 3; }
.h2h-sec .h2h-r { grid-column: 4 / 6; }
.h2h-read { grid-column: 3; grid-row: 2 / span 5; background: var(--navy); color: #fff; padding: 1rem; font-size: .9rem; border-bottom: 1px solid #e3e8f2; }
.h2h-read strong { display: block; font-size: 1.1rem; margin-bottom: .5rem; }
.h2h-read .tr { color: #ff4d6a; }
@media (max-width: 760px) {
  .h2h-top { grid-template-columns: 1fr 1fr; }
  .h2h-mid { grid-column: 1 / -1; order: -1; }
  .h2h-mid { font-size: 1.8rem; padding: 0; }
  .h2h-block { display: block; }
  .h2h-row { display: grid; grid-template-columns: 1fr auto 1fr; border-bottom: 1px solid #e3e8f2; }
  .h2h-row .h2h-l { grid-column: 1 / -1; padding: .3rem .7rem; font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; }
  .h2h-row .h2h-r { display: none; }
  .h2h-row .h2h-c { min-width: 6.5rem; grid-column: 2; }
  .h2h-row .h2h-a { grid-column: 1; }
  .h2h-row .h2h-b { grid-column: 3; }
  .h2h-sec { display: grid; grid-template-columns: 1fr auto; }
  .h2h-sec .h2h-l { grid-column: 1; }
  .h2h-sec .h2h-r { display: none; }
  .h2h-read { display: block; border-bottom: 0; }
}
.h2h-block { grid-template-columns: 1.2fr .9fr 1.3fr .9fr 1.2fr; }
.h2h-c .adv-a, .h2h-c .adv-b, .h2h-c .adv-even { font-size: .9rem; }
.h2h-ai { background: var(--navy); color: #fff; border-top: 6px solid var(--scarlet); padding: 1.2rem; }
.h2h-ai h3 { color: #fff; margin: 0; font-size: 1.6rem; }
.h2h-ai .tr { color: #ff4d6a; }
.h2h-ai h4 { color: #fff; border-bottom: 2px solid var(--scarlet); padding-bottom: .3rem; margin: 0 0 .5rem; text-transform: uppercase; letter-spacing: .06em; font-size: .85rem; }
.h2h-ai-tag { background: var(--scarlet); color: #fff; display: inline-block; padding: .3rem .6rem; font-weight: 800; margin: .5rem 0; }
.h2h-ai-note { color: #d5dcec; font-size: .85rem; margin: .3rem 0; }
.h2h-ai-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1.2rem; margin: 1rem 0; }
.h2h-ai ul { margin: 0; padding-left: 1.1rem; }
.h2h-ai li { margin-bottom: .35rem; }
.h2h-ai p { margin: 0; }
@media (max-width: 760px) { .h2h-block { display: block; } .h2h-row .h2h-c { min-width: 7.5rem; } }
.h2h-read { grid-column: auto; grid-row: auto; margin-bottom: 1rem; border-bottom: 0; }
.h2h-sub { display: block; font-size: .72rem; color: #4a5675; font-weight: 400; }
.h2h-avgs { border: 1px solid #cfd6e6; border-top: 4px solid var(--navy); padding: 1rem; margin-bottom: 1rem; background: #fff; }
.h2h-avgs h3 { margin: 0 0 .4rem; color: var(--navy); }
.h2h-avgs .h2h-ai-tag { margin: 0 0 .6rem; }
/* Recruit Score, Player Tier, Confidence badges (shared classification.js) */
.rd-badge { display: inline-flex; align-items: center; gap: 6px; min-height: 28px; padding: 0 10px; border-radius: 999px; border: 1px solid; font-weight: 600; font-size: .85rem; line-height: 1; white-space: nowrap; font-variant-numeric: tabular-nums; }
.rd-badge:focus-visible { outline: 3px solid var(--navy); outline-offset: 2px; }
.rd-badge.rd-large { min-height: 34px; padding: 0 14px; font-size: 1rem; font-weight: 700; }
.rd-dot { width: 9px; height: 9px; border-radius: 50%; background: currentColor; flex: none; }
.rd-num { text-align: right; font-variant-numeric: tabular-nums; }
.rd-multi { border: 1px solid #c9d0de; border-radius: 6px; padding: 6px 10px; margin: 0; display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: center; }
.rd-multi legend { font-weight: 700; font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; color: var(--navy); padding: 0 4px; }
.rd-check { display: inline-flex; align-items: center; gap: 4px; font-size: .9rem; min-height: 28px; }
.rd-check input { width: 18px; height: 18px; }
.rd-legend { margin: 1.2rem 1rem; padding: 12px 16px; border-left: 4px solid var(--scarlet); background: #f6f8fc; }
.rd-legend h2 { font-size: 1rem; margin: 0 0 .4rem; }
.rd-legend ul { margin: 0; padding-left: 1.1rem; font-size: .9rem; color: #3b4660; }
.rd-empty td { text-align: center; padding: 28px 12px; }
.rd-mobile-meta { display: none; color: #3b4660; font-size: .8rem; }
.rd-triple .rd-badge { margin-top: 2px; }
@media (max-width: 760px) {
  #r-table, #r-table tbody { display: block; }
  #r-table thead { display: none; }
  #r-table tr { display: grid; grid-template-columns: 1fr auto; gap: 6px 10px; padding: 12px; margin: 0 0 12px; border: 1px solid #c9d0de; border-radius: 8px; background: #fff; }
  #r-table td, #r-table th { border: 0; padding: 0; text-align: left; }
  #r-table .c-name { grid-column: 1; font-size: 1.05rem; }
  #r-table .c-rs { grid-column: 2; grid-row: 1; font-size: 1.2rem; font-weight: 700; text-align: right; }
  #r-table .c-tier, #r-table .c-conf { grid-column: 1 / -1; }
  #r-table .c-rank, #r-table .c-crank, #r-table .c-grade { grid-column: 1 / -1; font-size: .85rem; }
  #r-table .c-rank::before, #r-table .c-crank::before, #r-table .c-grade::before { content: attr(data-label) ": "; font-weight: 700; }
  #r-table .c-grad, #r-table .c-pos, #r-table .c-sec { display: none; }
  #r-table .rd-mobile-meta { display: block; }
  #r-table .rd-empty { display: block; }
  #r-table .rd-empty td { grid-column: 1 / -1; display: block; }
}.controls .rd-check { display: inline-flex; flex-direction: row; align-items: center; gap: 6px; text-transform: none; letter-spacing: 0; font-weight: 600; }
.controls .rd-check input { width: 18px; height: 18px; margin: 0; flex: none; }
.controls .rd-multi { flex-direction: row; }
.rd-table { font-size: .88rem; }
.rd-table th, .rd-table td { padding: 8px 8px; }
.rd-table .c-name a { white-space: nowrap; }
.rd-table .rd-badge { font-size: .8rem; padding: 0 8px; }.controls .rd-check { width: auto; flex: 0 0 auto; justify-content: flex-start; margin: 0; }
.controls .rd-check span { flex: none; }
@media (max-width: 760px) {
  #r-table .c-name { grid-row: 1; background: transparent; }
  #r-table .c-rs { grid-row: 1; }
}
/* Master Database */
.md-note { margin: 0 0 .8rem; }
.md-msg { padding: 8px 12px; border-left: 4px solid var(--navy); background: #eef1f7; font-weight: 700; }
.md-add { margin: 0 0 1rem; padding: 12px 16px; }
.md-add summary { cursor: pointer; font-weight: 800; color: var(--navy); font-size: 1.05rem; }
.md-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px 14px; margin-top: 12px; }
.md-grid label { display: flex; flex-direction: column; gap: 4px; font-size: .85rem; font-weight: 700; }
.md-grid input, .md-grid select, .md-grid textarea { font: inherit; padding: 6px 8px; border: 1px solid #9aa6bf; border-radius: 4px; }
.md-grid .md-check { flex-direction: row; align-items: center; }
.md-grid .md-wide { grid-column: 1 / -1; }
.md-errors { color: #a1112b; font-weight: 700; margin: .6rem 0; padding-left: 1.1rem; }
.md-errors:empty { display: none; }
.md-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.md-wrap { max-height: 70vh; overflow: auto; }
.md-table { font-size: .82rem; min-width: 2600px; }
.md-table th, .md-table td { white-space: nowrap; }
.md-table td:nth-child(36) { white-space: normal; min-width: 220px; }
.md-del { font: inherit; font-size: .75rem; padding: 2px 8px; border: 1px solid var(--scarlet); background: #fff; color: var(--scarlet); cursor: pointer; border-radius: 3px; }
.md-table th button { background: none; border: 0; color: inherit; font: inherit; font-weight: 800; text-transform: uppercase; cursor: pointer; padding: 0; }
.md-table thead th { position: sticky; top: 0; z-index: 1; background: var(--navy); color: #fff; }
/* ===== Workspace header, THE READ AI note, player pop-up, commitments layout, grading/connect ===== */
.ws-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 14px; color: #fff; font-size: .85rem; font-weight: 700; }
.ws-actions a { color: #fff; text-decoration: none; font-family: var(--font-display); font-style: italic; text-transform: uppercase; letter-spacing: .04em; }
.ws-actions a:hover { text-decoration: underline; }
.ws-actions a:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.ws-prog { background: rgba(255,255,255,.16); padding: .3rem .6rem; font-weight: 700; }
.ws-prog em { font-style: normal; font-weight: 600; opacity: .9; }
.ws-seg { display: inline-flex; border: 2px solid #fff; }
.ws-seg a { padding: .25rem .6rem; }
.ws-seg a[aria-current="true"] { background: var(--navy); }
.ws-bell b { margin-left: 4px; background: #fff; color: var(--scarlet); padding: 0 .4rem; font-size: .75rem; }
.read-note .read-label { display: block; font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; margin-bottom: .35rem; color: var(--navy); }
.read-note .read-label .tr { font-weight: 800; }
.pc-head { display: flex; gap: 16px; align-items: center; margin: 0 0 1rem; }
.pc-photo { flex: none; width: 96px; height: 96px; border: 3px solid var(--navy); overflow: hidden; background: #e9edf6; }
.pc-photo img, .pc-photo svg { width: 100%; height: 100%; object-fit: cover; display: block; }
.pc-name { margin: 0; color: var(--navy); }
.pc-sub { margin: .2rem 0; font-weight: 700; color: #3b4660; }
body.pc-open { overflow: hidden; }
.pc-modal { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 16px; }
.pc-backdrop { position: absolute; inset: 0; background: rgba(10,20,40,.7); }
.pc-dialog { position: relative; background: #fff; width: min(980px, 100%); max-height: calc(100vh - 32px); display: flex; flex-direction: column; border-top: 6px solid var(--scarlet); box-shadow: 0 20px 60px rgba(0,0,0,.4); }
.pc-dialog:focus { outline: none; }
.pc-bar { display: flex; flex-wrap: wrap; gap: 8px; justify-content: space-between; align-items: center; padding: .6rem 1rem; background: var(--navy); color: #fff; font-weight: 800; }
.pc-bar .button { padding: .4rem .8rem; font-size: .85rem; background: #fff; color: var(--navy); }
.pc-close { background: var(--scarlet); color: #fff; border: 2px solid #fff; padding: .4rem .8rem; font-weight: 800; cursor: pointer; min-height: 40px; }
.pc-close:focus-visible, .pc-bar .button:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.pc-body { overflow: auto; padding: 1rem; -webkit-overflow-scrolling: touch; }
.commit-layout { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 18px; align-items: start; margin: 1.2rem 0; }
.commit-side { display: grid; gap: 18px; }
.commit-side .card { margin: 0; }
@media (max-width: 1000px) { .commit-layout { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .pc-head { flex-direction: column; align-items: flex-start; } .pc-modal { padding: 0; } .pc-dialog { max-height: 100vh; height: 100vh; } }.site-header .container.nav-wrap { flex-wrap: wrap; }
.nav-actions.ws-actions { order: 9; flex: 1 0 100%; margin-left: 0; justify-content: flex-end; border-top: 1px solid rgba(255,255,255,.35); padding: 6px 0 2px; }
@media (max-width: 1100px) { .nav-actions.ws-actions { display: none; } }
.pc-connect-btn { margin-top: .5rem; }
.pc-connect { margin: 0 0 1rem; border-left: 6px solid #E41E3F; }
.pc-connect[hidden] { display: none; }
.pc-connect h4 { margin: .8rem 0 .3rem; color: #14284B; }
.pc-vers { list-style: none; padding: 0; margin: 0; }
.pc-ver { display: grid; gap: 2px; padding: .5rem .7rem; margin-bottom: .5rem; background: #f6f8fc; border: 1px solid #d6dcea; }

.msg-banner { background: #fff4d6; border: 2px solid #14284B; border-left: 8px solid #E41E3F; padding: .6rem .9rem; margin: 0 0 1rem; color: #14284B; }
.msg-layout { display: grid; grid-template-columns: minmax(260px, 340px) 1fr; gap: 1rem; margin-bottom: 1rem; align-items: start; }
.msg-threads { list-style: none; margin: 0; padding: 0; display: grid; gap: .4rem; max-height: 520px; overflow: auto; }
.msg-thread { width: 100%; text-align: left; display: grid; gap: 2px; padding: .55rem .7rem; background: #fff; border: 1px solid #d6dcea; cursor: pointer; font: inherit; color: #14284B; }
.msg-thread small { color: #4a5570; }
.msg-thread.is-unread { border-left: 6px solid #E41E3F; font-weight: 700; }
.msg-thread.is-sel { background: #eef2fb; outline: 2px solid #14284B; }
.msg-head { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; align-items: flex-start; }
.msg-log { list-style: none; margin: .8rem 0; padding: 0; display: grid; gap: .6rem; max-height: 380px; overflow: auto; }
.msg { max-width: 85%; padding: .5rem .8rem; border: 1px solid #d6dcea; background: #f6f8fc; }
.msg p { margin: .2rem 0 0; white-space: pre-wrap; }
.msg.mine { justify-self: end; background: #14284B; color: #fff; border-color: #14284B; }
.msg-by { font-size: .78rem; opacity: .85; }
.msg-conv textarea, .pc-compose textarea { width: 100%; }
.pc-compose fieldset { border: 1px solid #d6dcea; margin: .5rem 0; }
.pc-to { display: block; padding: .15rem 0; }
@media (max-width: 800px) { .msg-layout { grid-template-columns: 1fr; } .msg { max-width: 100%; } }

.pc-board-row{margin:.5rem 0}.btn-board{min-height:36px;padding:.3rem .8rem;font-size:.85rem}.ba-wrap{max-height:340px;overflow:auto}.b-edit{max-width:11rem;min-height:32px}.signed-in{border-left:4px solid var(--scarlet,#E41E3F);padding-left:.75rem}.demo-controls{margin:.75rem 0;padding:.5rem .75rem;border:1px dashed #14284B;border-radius:6px}.demo-controls summary{cursor:pointer;font-weight:700;color:#14284B}


.board-icon{width:32px;min-width:32px;height:32px;border-radius:50%;border:2px solid #1E8E3E;background:#1E8E3E;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0}.board-icon:hover{background:#17722f}.board-icon:focus-visible{outline:3px solid #14284B;outline-offset:2px}.board-na{font-size:.8rem;color:#555}.board-toast{position:fixed;left:50%;bottom:1rem;transform:translateX(-50%);background:#14284B;color:#fff;padding:.6rem 1rem;border-radius:8px;z-index:3000;display:flex;gap:.75rem;align-items:center;max-width:92vw}.board-toast[hidden]{display:none}.board-toast .button{min-height:32px;padding:.2rem .8rem}

.act-det{margin-top:.3rem}.act-det summary{cursor:pointer;font-weight:700;color:#14284B}.act-actions{display:flex;flex-wrap:wrap;gap:.4rem;margin:.5rem 0}.act-actions .button{min-height:32px;padding:.25rem .7rem;font-size:.85rem}.act-log{list-style:none;margin:.5rem 0 0;padding:0}.act-log li{border-left:3px solid #E41E3F;padding:.2rem .6rem;margin:.3rem 0;font-size:.9rem}.act-log li.void{opacity:.6;text-decoration:line-through}.act-by{color:#555}.act-stage{margin:.2rem 0 .5rem}.how-calc{margin-top:1rem}
.cal-bar{display:flex;flex-wrap:wrap;gap:.75rem;align-items:flex-end;justify-content:space-between;margin:.75rem 0}.cal-nav,.cal-views{display:flex;gap:.4rem;flex-wrap:wrap}.cal-title{margin:0;font-size:1.5rem;color:#14284B}
.cal-month{table-layout:fixed;width:100%;border-collapse:collapse}.cal-month th{text-align:center}.cal-day{vertical-align:top;height:6.5rem;border:1px solid #d6d9e0;padding:.2rem;overflow:hidden}.cal-day.out{background:#f5f6f8;color:#777}.cal-day.today{outline:3px solid #E41E3F;outline-offset:-3px}.cal-daynum{background:none;border:0;font-weight:700;color:#14284B;cursor:pointer;min-height:28px;min-width:28px;padding:0 .3rem;text-align:left}.cal-daynum:focus-visible,.cal-ev:focus-visible{outline:3px solid #14284B;outline-offset:1px}
.cal-ev{display:block;width:100%;text-align:left;border:0;border-left:4px solid #E41E3F;background:#fdecef;color:#14284B;font-size:.78rem;padding:.15rem .3rem;margin:.15rem 0;cursor:pointer;border-radius:3px;line-height:1.25}.cal-ev-t{font-weight:700;text-transform:uppercase;font-size:.68rem;letter-spacing:.03em}.cal-t0{border-left-color:#1E8E3E;background:#e8f5ec}.cal-t1{border-left-color:#14284B;background:#e9edf5}.cal-t2{border-left-color:#B26A00;background:#fff3e0}.cal-t3{border-left-color:#6B2FA0;background:#f1e8f8}.cal-t4{border-left-color:#E41E3F;background:#fdecef}.cal-t5{border-left-color:#555;background:#eee}
.cal-dow-short{display:none}.cal-week{display:grid;gap:.6rem}.cal-wk-day{border:1px solid #d6d9e0;border-radius:6px;padding:.5rem .75rem}.cal-wk-day.today{border-color:#E41E3F;border-width:2px}.cal-wk-day h3{margin:0 0 .3rem;font-size:1rem;color:#14284B}.cal-ag{list-style:none;margin:0 0 1rem;padding:0}.cal-ag li{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}.cal-ag .cal-ev{width:auto;min-width:14rem}.cal-ag-h{margin:.8rem 0 .3rem;color:#14284B}
.cal-dlg{border:2px solid #14284B;border-radius:10px;padding:1rem 1.25rem;max-width:34rem;width:92vw;max-height:92vh;overflow:auto}.cal-dlg::backdrop{background:rgba(20,40,75,.55)}.cal-form label{display:block;margin:.5rem 0;font-weight:600}.cal-form input[type=text],.cal-form input[type=date],.cal-form input[type=time],.cal-form select,.cal-form textarea{display:block;width:100%;min-height:36px;margin-top:.2rem}.cal-row{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}.cal-vis{border:1px solid #d6d9e0;margin:.5rem 0;padding:.5rem}.cal-chk{display:inline-block!important;margin-right:1rem!important;font-weight:400!important}
@media (max-width:700px){.cal-dow-full{display:none}.cal-dow-short{display:inline}.cal-day{height:5rem;font-size:.7rem}.cal-ev{font-size:.65rem}.cal-ev-t{display:none}.cal-row{grid-template-columns:1fr}}
.intro-list{margin:0 0 1rem;padding:.8rem 1rem .8rem 2rem;list-style:disc;background:#fff;border-left:4px solid var(--scarlet,#E41E3F)}.intro-list li{margin:.2rem 0;line-height:1.45}.lvl-code{display:inline-block;font-weight:700;color:#14284B;white-space:nowrap}.lvl-legend{font-size:.9rem}.lvl-legend abbr{text-decoration:underline dotted;cursor:help}

/* Athlete signup wizard + guardian demo */
.wiz-progress { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 0 0 1rem; padding: 0; counter-reset: none; }
.wiz-progress li { flex: 1 1 120px; padding: .5rem .6rem; background: #eef1f7; color: var(--navy); font-weight: 700; font-size: .85rem; clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px)); }
.wiz-progress li span { display: inline-block; min-width: 1.6em; text-align: center; background: var(--navy); color: #fff; border-radius: 50%; margin-right: 4px; }
.wiz-progress li.on { background: var(--scarlet); color: #fff; }
.wiz-progress li.on span { background: #fff; color: var(--scarlet); }
.wiz-progress li.done { background: #d7deed; }
.age-line { font-size: 1.1rem; }
.photo-prev { width: 96px; height: 96px; object-fit: cover; border: 3px solid var(--scarlet); margin-top: .5rem; }
.ver-row { margin: 0 0 1rem; }
.review-list { display: grid; grid-template-columns: minmax(130px, 220px) 1fr; gap: 6px 14px; margin: 0 0 1rem; }
.review-list dt { font-weight: 800; color: var(--navy); }
.review-list dd { margin: 0; }
.st-badge { display: inline-block; padding: .15rem .6rem; font-weight: 800; font-size: .8rem; text-transform: uppercase; background: #e5e9f2; color: var(--navy); }
.st-verified, .st-confirmeddemo { background: #d8f0e0; color: #0f5a2c; }
.st-pending, .st-requested { background: #fff1c9; color: #6b4a00; }
.st-declined, .st-expired { background: #fde0e4; color: #9b1030; }
.hero-list { max-width: 60ch; }
@media (max-width: 560px) { .review-list { grid-template-columns: 1fr; } .wiz-progress li { flex-basis: 100%; } }
html.hide-sample-labels [data-sample-label] { display: none !important; }

/* Athlete profile */
.prof-tabs{flex-wrap:wrap}
.prof-sec{margin-bottom:1rem}
.prof-purpose{color:#4a5568;margin-top:0}
.req-tag{display:inline-block;font:700 .7rem/1 Inter,sans-serif;text-transform:uppercase;letter-spacing:.06em;padding:.25rem .5rem;vertical-align:middle;clip-path:polygon(0 0,calc(100% - 6px) 0,100% 6px,100% 100%,6px 100%,0 calc(100% - 6px))}
.req-tag.req{background:var(--scarlet);color:#fff}
.req-tag.opt{background:#e8edf6;color:var(--navy)}
.prof-head{display:flex;gap:1rem;align-items:flex-start;flex-wrap:wrap}
.prof-photo{width:110px;height:110px;object-fit:cover;border:3px solid var(--navy);border-radius:50%}
.prof-initial{display:flex;align-items:center;justify-content:center;background:var(--navy);color:#fff;font:800 2.6rem Inter,sans-serif}
.prof-name{margin:0 0 .25rem}
.sport-switch{display:flex;flex-wrap:wrap;gap:6px;margin:.5rem 0}
.sport-switch .chip{min-height:36px;padding:.3rem .8rem;border:2px solid var(--navy);background:#fff;color:var(--navy);font-weight:700;cursor:pointer}
.sport-switch .chip.on{background:var(--navy);color:#fff}
.meter{height:14px;background:#e8edf6;margin:.75rem 0 .25rem}
.meter span{display:block;height:100%;background:var(--scarlet)}
.check-list{list-style:none;padding:0;columns:2 260px}
.check-list .done{color:#1f6b3a}
.link-btn{background:none;border:0;color:var(--scarlet);text-decoration:underline;cursor:pointer;font:inherit;min-height:32px}
.st-declined { background: #f8d7dd; color: #8a1029; }
.notif-bell { display: inline-block; margin-right: 10px; font-weight: 700; color: #fff; text-decoration: none; }
.notif-count { background: #fff; color: #E41E3F; }
.int-list li { margin: 8px 0; }

/* Athletic Department shell: breadcrumb, tools, two tab rows, sport cards */
.ad-nav { margin: 0 0 1.2rem; }
.ad-nav .dept-subnav, .ad-nav .coach-subnav { margin: 0 0 6px; }
.ad-nav .dept-subnav { background: var(--navy); }
.ad-nav .coach-subnav { background: var(--scarlet); }
.ad-crumbs { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; margin: 0 0 .7rem; font-weight: 700; color: var(--navy); }
.ad-crumbs a { color: var(--scarlet); }
.ad-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; font-weight: 600; }
.ad-tools select { margin-left: 6px; padding: .35rem .5rem; }
.ad-sport-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 16px; margin: 1rem 0; }
.ad-sport h3 { font-family: var(--font-display); font-style: italic; text-transform: uppercase; color: var(--navy); margin: 0 0 .5rem; }
.ad-scope { font-weight: 700; color: var(--navy); }
.inline-check { display: inline-flex; align-items: center; gap: 6px; margin: 0 12px 6px 0; }
/* Account menu (signed-in header) and sign-in pages */
.acct-menu { position: relative; }
.acct-menu summary { display: flex; align-items: center; gap: 8px; cursor: pointer; list-style: none; color: #fff; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; font-size: .85rem; padding: 6px 8px; }
.acct-menu summary::-webkit-details-marker { display: none; }
.acct-menu summary:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.acct-ava { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #fff; color: #14284B; font-weight: 900; }
.acct-name { max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.acct-pop { position: absolute; right: 0; top: calc(100% + 6px); min-width: 230px; background: #fff; color: #14284B; border: 2px solid #14284B; border-top: 4px solid #E41E3F; padding: 12px; z-index: 60; display: grid; gap: 6px; box-shadow: 0 8px 22px rgba(20,40,75,.25); }
.acct-pop p { margin: 0 0 4px; font-size: .9rem; }
.acct-pop a, .acct-pop button { display: block; text-align: left; padding: 8px 10px; background: #fff; color: #14284B; border: 1px solid #d9deea; font: inherit; font-weight: 700; text-decoration: none; cursor: pointer; }
.acct-pop a:hover, .acct-pop button:hover, .acct-pop a:focus-visible, .acct-pop button:focus-visible { background: #14284B; color: #fff; }
@media (max-width: 900px) { .acct-menu { display: none; } }
.cn-badge{display:inline-block;min-width:1.3em;margin-left:.35em;padding:0 .4em;border-radius:999px;background:#E41E3F;color:#fff;font-size:.75rem;font-weight:800;line-height:1.5;text-align:center}
.coach-subnav .cn-badge,.dept-subnav .cn-badge{background:#fff;color:#E41E3F}

.fin-tag { display: inline-block; font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; padding: .1rem .45rem; vertical-align: middle; }
.fin-in { background: var(--navy); color: #fff; }
.fin-calc { background: #fff; color: var(--scarlet); border: 1px solid var(--scarlet); }
.fin-ne { color: #5a6275; font-style: italic; }
.fin-total th, .fin-total td { font-weight: 800; border-top: 2px solid var(--navy); }
.fin-how { margin: .4rem 0; border-left: 4px solid var(--scarlet); padding: .2rem .7rem; background: #f6f7fa; }
.fin-how summary { cursor: pointer; font-weight: 700; color: var(--navy); }
.fin-example > summary h2 { display: inline; }
.fin-gloss dd { margin: 0; }

/* Verifier workspace (queue, bulk grid, sticky summary) */
.v-tabs .v-util { margin-left: auto; display: flex; gap: 6px; }
.v-tabs .v-util a { background: rgba(255,255,255,.12); }
.v-sticky { position: sticky; top: 0; z-index: 20; display: flex; flex-wrap: wrap; align-items: center; gap: .4rem 1.2rem; padding: .6rem .9rem; margin: 0 0 1rem; background: var(--white); border: 1px solid rgba(26,26,26,.15); border-left: 5px solid var(--scarlet); box-shadow: 0 2px 6px rgba(20,40,75,.12); color: var(--navy); }
.v-sticky strong { color: var(--scarlet); font-size: 1.2rem; }
.v-sticky .v-msg { flex: 1 1 14rem; font-weight: 700; }
.v-reqlist { list-style: none; margin: 0 0 .8rem; padding: 0; }
.v-reqlist li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem; padding: .6rem 0; border-bottom: 1px solid rgba(26,26,26,.12); }
.v-exp td { background: #f7f8fb; }
.v-mrow:focus { outline: 3px solid var(--navy); outline-offset: -3px; }
.v-obs, .v-cell { min-height: 44px; width: 100%; min-width: 5.5rem; padding: .4rem .5rem; font-size: 1rem; border: 1px solid rgba(20,40,75,.4); }
.v-cell[aria-invalid="true"] { border-color: var(--scarlet); background: #fff1f3; }
.v-acts .button { margin: 2px 2px 2px 0; }
.v-grid th, .v-grid td { white-space: nowrap; }
.v-grid thead th, .v-grid tbody th { position: sticky; left: 0; background: var(--white); }
.v-grid thead th:not(:first-child) { position: static; }
.v-filters { display: flex; flex-wrap: wrap; gap: .8rem; margin: 1rem 0; }
.v-filters label { display: grid; gap: 4px; font-weight: 700; color: var(--navy); }
.v-filters input, .v-filters select { min-height: 44px; padding: .3rem .5rem; }
kbd { border: 1px solid rgba(20,40,75,.4); border-bottom-width: 2px; padding: 0 .3rem; background: #fff; font-size: .9em; }
.empty-state { padding: 1rem 1.2rem; border: 2px dashed rgba(20,40,75,.35); background: #f7f8fb; }
.next-step { margin: 0 0 1rem; padding: .8rem 1rem; border-left: 5px solid var(--scarlet); background: #fff; border: 1px solid rgba(26,26,26,.15); border-left: 5px solid var(--scarlet); color: var(--navy); }
.next-step strong:first-child { text-transform: uppercase; letter-spacing: .05em; color: var(--scarlet); margin-right: .4rem; }
@media (max-width: 720px) { .v-tabs .v-util { margin-left: 0; } .v-sticky { gap: .3rem .8rem; font-size: .9rem; } .v-acts .button { width: 100%; } }
/* Evaluator note colors (Coach Grading) */
.ev-legend { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 10px 0; }
.ev-key, .ev-note { color: #14284B; padding: 6px 10px; border-radius: 4px; font-size: .9rem; }
.ev-note { margin: 6px 0; display: block; }
.ev-note small { display: block; color: #3B4A66; }
.ev-text { display: block; margin-top: 2px; }
.ev-ini { display: inline-block; min-width: 2em; padding: 1px 5px; border-radius: 3px; color: #fff; font-size: .75rem; font-weight: 700; text-align: center; }
.grade-letter { font-weight: 700; border-bottom: 1px dotted currentColor; cursor: help; }

/* Menu panels: always below the header, scrollable, readable */
.nav-more-menu, .acct-pop { max-height: calc(100vh - 140px); overflow-y: auto; overscroll-behavior: contain; }
@media (max-width: 1399px) {
  .main-nav.open { max-height: calc(100vh - 90px); max-height: calc(100dvh - 90px); overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; padding-bottom: 2rem; }
  .main-nav.open a { color: #fff; }
}
.notif-bell { white-space: nowrap; }
.notif-bell .notif-count { background: #fff; color: #E41E3F; }

/* Home sign-in entry points */
.signin-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 22px 0 8px; }
.signin-card { display: flex; flex-direction: column; gap: 10px; background: #fff; border: 1px solid #dfe2e8; border-left: 5px solid var(--scarlet); border-radius: 10px; padding: 18px; color: var(--ink, #1a1a1a); }
.signin-card h2 { font-size: 1.1rem; margin: 0; color: var(--navy); }
.signin-card p { margin: 0; font-size: 0.92rem; color: var(--body-gray, #444); flex: 1; }
.signin-card .button { text-align: center; }
.signin-new { font-size: 0.88rem; font-weight: 700; color: var(--cardinal-red); text-align: center; padding: 6px 0; }
.signin-card a:focus-visible { outline: 3px solid var(--navy); outline-offset: 2px; }
@media (max-width: 1000px) { .signin-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .signin-grid { grid-template-columns: 1fr; } .signin-card .button, .signin-new { min-height: 44px; display: flex; align-items: center; justify-content: center; } }