/* Shared marketing chrome — DaisyUI + Tailwind browser CDN handle most styling.
   Pin: daisyui@5 and @tailwindcss/browser@4 in each page <head>. */

:root {
  --team-accent: #1e3a5f;
  --team-accent-2: #3b82a6;
  --team-surface: #f0f5fa;
  --team-ink: #0f172a;
  --page-grad: linear-gradient(165deg, #e8f0f7 0%, #f8fafc 42%, #eef2f7 100%);
}

body.theme-hub {
  --team-accent: #1e3a5f;
  --team-accent-2: #64748b;
  --team-surface: #eef2f7;
  --page-grad: linear-gradient(160deg, #dbe7f3 0%, #f8fafc 45%, #e8eef5 100%);
}

body.theme-padres {
  --team-accent: #2f241d;
  --team-accent-2: #c4a35a;
  --team-surface: #f5efe6;
  --page-grad: linear-gradient(160deg, #ebe0d0 0%, #faf7f2 48%, #e8e2d8 100%);
}

body.theme-mariners {
  --team-accent: #0c2c56;
  --team-accent-2: #005c5c;
  --team-surface: #e6f0f0;
  --page-grad: linear-gradient(160deg, #d4e4ef 0%, #f4f8fa 48%, #ddeae8 100%);
}

body.theme-royals {
  --team-accent: #004687;
  --team-accent-2: #bd9b60;
  --team-surface: #e8eef6;
  --page-grad: linear-gradient(160deg, #cfdcf0 0%, #f5f7fb 48%, #ebe4d6 100%);
}

body.theme-whitesox {
  --team-accent: #27251f;
  --team-accent-2: #8a8d8f;
  --team-surface: #ececee;
  --page-grad: linear-gradient(160deg, #d5d6d8 0%, #f7f7f8 48%, #e6e7e9 100%);
}

body.theme-brewers {
  --team-accent: #0a2240;
  --team-accent-2: #ffc72c;
  --team-surface: #eef2f7;
  --page-grad: linear-gradient(160deg, #d5dde8 0%, #f7f8fa 48%, #ebe4c8 100%);
}

body.theme-bluejays {
  --team-accent: #134a8e;
  --team-accent-2: #e8291c;
  --team-surface: #e8eef6;
  --page-grad: linear-gradient(160deg, #c9d7eb 0%, #f5f7fb 48%, #ece4e4 100%);
}

body.theme-whitesox .team-ticket {
  --ticket-ink: #27251f;
  --ticket-paper: #f4f4f5;
  --field-line: #f4f4f5;
  --infield-color: #a8a9ad;
}

.hp {
  display: none !important;
  position: absolute;
  left: -9999px;
}

body.site-body {
  background: var(--page-grad);
  background-attachment: fixed;
  color: var(--team-ink);
  min-height: 100vh;
}

.site-main {
  max-width: 1024px;
}

/* Plans / support tables — wider than FAQ & About (room for full club names) */
.content-table {
  max-width: 880px;
  margin-inline: auto;
  text-align: left;
}

/* FAQ, About — narrower reading column, centered on page */
.content-narrow {
  max-width: 620px;
  margin-inline: auto;
  text-align: left;
}

.lede {
  font-size: 1.125rem;
  line-height: 1.65;
}

.page-title {
  font-size: clamp(1.75rem, 2.5vw, 2.35rem);
  line-height: 1.2;
  letter-spacing: -0.02em;
}

.section-gap {
  margin-bottom: 2.75rem;
}

/* Expect (accented, left) + Who (right); stacks on small screens */
.who-expect-band {
  display: grid;
  gap: 1.25rem;
  align-items: stretch;
}

@media (min-width: 768px) {
  .who-expect-band {
    grid-template-columns: 1.15fr 1fr;
    gap: 1.5rem;
  }
}

.site-navbar {
  background: color-mix(in srgb, white 88%, var(--team-surface));
  border-bottom: 1px solid color-mix(in srgb, var(--team-accent) 18%, transparent);
  backdrop-filter: blur(8px);
}

/* Parent brand lockup: fixed-color ticket mark + HTML Martel wordmark */
.brand-lockup {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  line-height: 1;
  text-decoration: none;
  min-height: 32px;
}

.brand-lockup img {
  display: block;
  height: 30px;
  width: auto;
  flex-shrink: 0;
}

.brand-wordmark {
  font-family: "Martel", Georgia, "Times New Roman", serif;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #142a43;
  white-space: nowrap;
  line-height: 1;
}

/* .run accent: hub slate / team theme tokens */
.brand-wordmark .brand-tld {
  color: var(--team-accent-2);
}

.site-navbar a.link-hover:hover {
  color: var(--team-accent);
}

.site-navbar .dropdown > summary {
  color: var(--team-accent);
  font-weight: 500;
  border: none;
  box-shadow: none;
  background: transparent;
  min-height: 2rem;
  height: 2rem;
  padding-inline: 0.5rem;
}

.site-navbar .dropdown > summary:hover,
.site-navbar .dropdown > summary:focus {
  background: color-mix(in srgb, var(--team-accent) 8%, transparent);
  color: var(--team-accent);
}

.site-navbar .dropdown-content {
  background: color-mix(in srgb, white 96%, var(--team-surface));
  border: 1px solid color-mix(in srgb, var(--team-accent) 14%, #e2e8f0);
}

.btn-primary {
  background-color: var(--team-accent) !important;
  border-color: var(--team-accent) !important;
}

.btn-primary:hover {
  filter: brightness(1.08);
}

.waitlist-card {
  border-color: color-mix(in srgb, var(--team-accent) 28%, #e2e8f0) !important;
  box-shadow: 0 10px 30px color-mix(in srgb, var(--team-accent) 12%, transparent);
}

.panel-card {
  background: color-mix(in srgb, white 92%, var(--team-surface));
  border: 1px solid color-mix(in srgb, var(--team-accent) 14%, #e2e8f0);
}

.expect-panel {
  border-left: 4px solid var(--team-accent-2);
  background: color-mix(in srgb, var(--team-surface) 55%, white);
  box-shadow: 0 6px 18px color-mix(in srgb, var(--team-accent-2) 10%, transparent);
}

.expect-panel .card-title,
.who-expect-band .expect-panel h2 {
  color: var(--team-accent);
}

/* Desktop: benefits ~60% + form ~40%; mobile: form first */
.hero-band {
  display: grid;
  gap: 1.75rem;
  align-items: start;
}

.hero-band .waitlist-card {
  order: -1;
}

@media (min-width: 768px) {
  .hero-band {
    grid-template-columns: 1.45fr 1fr;
    gap: 2rem;
  }

  .hero-band .waitlist-card {
    order: 0;
  }
}

.team-ticket {
  position: relative;
  flex-shrink: 0;
  width: 120px;
  height: 180px;
  --ticket-ink: #142A43;
  --ticket-paper: #F7F3E8;
  --field-color: var(--team-accent, #5B8061);
  --field-line: #F7F3E8;
  --infield-color: #C9A979;
}

.team-ticket svg {
  display: block;
  width: 120px;
  height: 180px;
}

.team-initials {
  position: absolute;
  left: 50%;
  top: 40%;
  transform: translate(-50%, -50%);
  width: 62px;
  height: 38px;
  display: grid;
  place-items: center;
  font-family: ui-sans-serif, system-ui, sans-serif;
  font-weight: 800;
  font-size: 1.55rem;
  letter-spacing: 0.06em;
  color: var(--team-accent);
  line-height: 1;
  pointer-events: none;
}

.team-initials.is-three {
  font-size: 1.18rem;
  letter-spacing: 0.04em;
}

.support-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.92rem;
  table-layout: auto;
}

.support-table th,
.support-table td {
  border: 1px solid color-mix(in srgb, var(--team-accent) 12%, #e2e8f0);
  padding: 0.55rem 0.7rem;
  text-align: left;
  vertical-align: top;
}

.support-table th {
  background: color-mix(in srgb, var(--team-surface) 80%, white);
  font-weight: 600;
  color: var(--team-accent);
}

/* Package tables: col 1 shrinks to short labels (Gold A, Plan B, …) */
.support-table--packages th[scope="row"],
.support-table--packages thead th:first-child {
  width: 1%;
  white-space: nowrap;
  min-width: 0;
}

/* Hub: prefer full team names on one line; named-packages col wraps freely */
.support-table--hub th[scope="row"],
.support-table--hub thead th:first-child {
  width: 1%;
  white-space: nowrap;
  min-width: 0;
}

.support-table--hub td:last-child {
  word-break: normal;
  overflow-wrap: anywhere;
}

/* Very small screens: allow team names to wrap (~2 lines) so other cols stay readable */
@media (max-width: 480px) {
  .support-table th,
  .support-table td {
    padding: 0.45rem 0.45rem;
    font-size: 0.85rem;
  }

  .support-table--hub th[scope="row"] {
    white-space: normal;
    max-width: 6.75rem;
    hyphens: auto;
  }

  .support-table--packages th[scope="row"],
  .support-table--packages thead th:first-child {
    width: 1%;
    white-space: nowrap;
  }
}

.support-table-wrap {
  overflow-x: auto;
  border-radius: 0.75rem;
  -webkit-overflow-scrolling: touch;
}

.proof-note {
  font-size: 0.95rem;
  line-height: 1.55;
  color: color-mix(in srgb, var(--team-ink) 72%, transparent);
  margin-top: 0.85rem;
}

.site-footer {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 1.5rem;
  width: 100%;
  padding: 1.75rem 1.25rem 1.5rem;
  background: color-mix(in srgb, white 85%, var(--team-surface));
  border-top: 1px solid color-mix(in srgb, var(--team-accent) 14%, transparent);
  color: color-mix(in srgb, var(--team-ink) 70%, transparent);
  font-size: 0.75rem;
}

.footer-teams {
  max-width: 960px;
  width: 100%;
  margin-inline: auto;
  display: grid;
  gap: 1.35rem;
}

@media (min-width: 768px) {
  .footer-teams {
    grid-template-columns: 1fr 1fr;
    gap: 1.75rem 2rem;
  }
}

.footer-league-title {
  margin: 0 0 0.55rem;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--team-accent);
}

.footer-divisions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.65rem 0.85rem;
}

.footer-div-title {
  margin: 0 0 0.3rem;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--team-accent) 70%, var(--team-ink));
}

.footer-club-list {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 0.7rem;
  line-height: 1.5;
}

.footer-club-list li {
  margin: 0;
}

.footer-club-muted {
  color: color-mix(in srgb, var(--team-ink) 48%, transparent);
}

.footer-club-supported {
  font-weight: 650;
  color: var(--team-accent);
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-color: color-mix(in srgb, var(--team-accent-2) 55%, transparent);
}

.footer-club-supported:hover {
  color: var(--team-accent);
  text-decoration-color: var(--team-accent-2);
}

.footer-legal {
  max-width: 42rem;
  margin-inline: auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.footer-legal p {
  margin: 0;
  line-height: 1.55;
}

.footer-legal a.link {
  color: var(--team-accent);
}