/* Page-specific compositions. Kept small; most of the layout is the shared grid. */

/* Home hero: 7 + 5 */
.hero { padding-block: var(--sp-7) var(--sp-8); }
.hero .grid > .cell { padding-top: 0; }
.hero__ctas { display: flex; flex-wrap: wrap; gap: var(--sp-3); align-items: stretch; }
.featured-card { display: flex; flex-direction: column; gap: var(--sp-4); }
.featured-card__art { aspect-ratio: 16 / 9; }
.featured-card__time { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-4); }

/* Paths */
.paths .cell { display: flex; gap: var(--sp-4); align-items: flex-start; }
.path__body { display: flex; flex-direction: column; gap: 6px; }
.path__body a { text-decoration: none; font-family: var(--font-display); font-weight: 600; font-size: var(--fs-4); }
.path__body a:hover { text-decoration: underline; text-decoration-color: var(--red); }

/* Front-page three-column band: Help topics | Live | Today's schedule */
.band .cell { display: flex; flex-direction: column; gap: var(--sp-4); }
.band .cell > .eyebrow { margin-bottom: var(--sp-1); }
.topic-list li { border-bottom: var(--hair) solid var(--rule); }
.topic-list a { display: flex; justify-content: space-between; gap: var(--sp-3); padding: 10px 0; text-decoration: none; }
.topic-list a:hover .topic-list__t { text-decoration: underline; text-decoration-color: var(--red); }
.topic-list__t { font-family: var(--font-display); font-weight: 600; }
.topic-list__l { color: var(--muted); font-size: var(--fs-1); font-style: italic; font-family: var(--font-display); text-align: right; }
.today { display: grid; gap: 0; }
.today__row { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px var(--sp-3); padding: var(--sp-3) 0; border-bottom: var(--hair) solid var(--rule); }
.today__slot { font-size: var(--fs-0); letter-spacing: var(--track-caps); text-transform: uppercase; color: var(--muted); font-weight: 600; grid-column: 1 / -1; }
.today__slot--featured { color: var(--red); }
.today__time { font-variant-numeric: tabular-nums; white-space: nowrap; color: var(--muted); font-size: var(--fs-1); padding-top: 3px; }
.today__show { font-family: var(--font-display); font-weight: 600; }
.today__ep { color: var(--muted); font-size: var(--fs-1); }

/* Shows grid */
.shows-grid { --cols-sm: 2; --cols-md: 3; --cols-lg: 5; }
.shows-grid--6 { --cols-lg: 6; }
.shows-grid--4 { --cols-lg: 4; }

/* Help */
.topic-grid { --cols-sm: 1; --cols-md: 2; --cols-lg: 3; }
.help-search { max-width: 640px; }
.help-foot { font-size: var(--fs-1); color: var(--muted); }
.help-foot a { color: var(--text); }
.next-steps { --cols-sm: 1; --cols-md: 2; --cols-lg: 4; }

/* Watch everywhere */
.mockups { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-5); align-items: end; }
@media (min-width: 640px) { .mockups { grid-template-columns: 3fr 1fr; } }

/* Partners */
.events-grid { --cols-sm: 1; --cols-md: 3; --cols-lg: 3; }
.books-grid { --cols-sm: 1; --cols-md: 2; --cols-lg: 3; }
.lanes-grid { --cols-sm: 1; --cols-md: 2; --cols-lg: 4; }
.sats-grid { --cols-sm: 1; --cols-md: 2; --cols-lg: 3; }

/* On Demand: sidebar index + main */
.od-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-6); }
@media (min-width: 1024px) {
  .od-layout { grid-template-columns: 3fr 9fr; gap: 0; }
  .od-layout > .od-main { border-left: var(--hair) solid var(--rule); padding-left: var(--sp-6); }
  .od-index { position: sticky; top: calc(var(--nav-h) + var(--sp-4)); align-self: start; padding-right: var(--sp-5); }
}
.od-index h2 { font-size: var(--fs-3); }
.od-index__group { margin-top: var(--sp-4); }
.od-index__group h3 { font-size: var(--fs-0); letter-spacing: var(--track-caps); text-transform: uppercase; color: var(--muted); font-family: var(--font-body); font-weight: 600; padding-bottom: 6px; border-bottom: var(--hair) solid var(--rule); }
.od-index__group ul { columns: 2; column-gap: var(--sp-4); }
@media (min-width: 1024px) { .od-index__group ul { columns: 1; } }
.od-index__group li { break-inside: avoid; }
.od-index__group a { display: flex; justify-content: space-between; gap: 8px; padding: 6px 0; text-decoration: none; font-size: var(--fs-1); border-bottom: var(--hair) solid transparent; }
.od-index__group a:hover { text-decoration: underline; text-decoration-color: var(--red); }
.od-index__group a.is-active { color: var(--text); font-weight: 600; }
.od-index__group a.is-active .count { color: var(--red); }
.od-index__group .count { color: var(--muted); font-variant-numeric: tabular-nums; }
.od-hero { display: grid; gap: var(--sp-5); }
@media (min-width: 768px) { .od-hero { grid-template-columns: 7fr 5fr; } }
.od-filter-bar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--sp-3); padding: var(--sp-3) 0; border-top: var(--hair) solid var(--red); border-bottom: var(--hair) solid var(--rule); }
.od-filter-bar h2 { font-size: var(--fs-4); }
.lane { padding-block: var(--sp-6); }
.lane[hidden] { display: none; }
.family-banner { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--sp-4); padding: var(--sp-5); background: var(--panel); border-top: var(--hair) solid var(--red); }

/* Show page */
.show-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-6); }
@media (min-width: 1024px) { .show-layout { grid-template-columns: 8fr 4fr; gap: 0; } .show-layout > .show-side { border-left: var(--hair) solid var(--rule); padding-left: var(--sp-6); } }
.episodes li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--sp-2) var(--sp-4); align-items: baseline; padding: var(--sp-3) 0; border-bottom: var(--hair) solid var(--rule); }
.episodes .ep__num { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-5); color: var(--red); line-height: 1; }
.episodes .ep__title { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-3); }
.episodes .ep__meta { color: var(--muted); font-size: var(--fs-1); }
.episodes .ep__dur { font-variant-numeric: tabular-nums; color: var(--muted); font-size: var(--fs-1); }
.episodes .tags { grid-column: 2 / -1; }
.episodes a { text-decoration: none; }
.episodes a:hover { text-decoration: underline; text-decoration-color: var(--red); }

/* Topic page */
.topic-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-6); }
@media (min-width: 1024px) { .topic-layout { grid-template-columns: 7fr 5fr; gap: 0; } .topic-layout > .topic-side { border-left: var(--hair) solid var(--rule); padding-left: var(--sp-6); } }
.topic-opener { font-family: var(--font-display); font-size: var(--fs-4); line-height: 1.45; }
.rec { display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: var(--sp-4); padding: var(--sp-4) 0; border-bottom: var(--hair) solid var(--rule); }
.rec__note { color: var(--muted); font-size: var(--fs-1); }

/* Find channel */
.finder { display: grid; gap: var(--sp-4); }
.finder__results { display: grid; gap: 0; }
.nationwide { display: grid; gap: var(--sp-3); padding: var(--sp-5); background: var(--panel); border-top: var(--hair) solid var(--red); }

/* Give */
.give-hero { padding-block: var(--sp-8); text-align: center; }
.give-hero .lede { margin-inline: auto; }
.give-hero .hero__ctas { justify-content: center; }
.give-lines { --cols-sm: 1; --cols-md: 3; --cols-lg: 3; }

/* 404 */
.notfound { padding-block: var(--sp-9); }
.notfound .section-num { font-size: clamp(5rem, 20vw, 14rem); }

/* Channel list on watch page */
.channel-list li { display: flex; justify-content: space-between; gap: var(--sp-3); padding: var(--sp-3) 0; border-bottom: var(--hair) solid var(--rule); }
.channel-list .ch { font-size: var(--fs-0); letter-spacing: var(--track-caps); text-transform: uppercase; color: var(--muted); }

/* Narrow screens: the ghost numeral sits above the heading instead of beside it. */
@media (max-width: 639.98px) {
  .section-head { grid-template-columns: minmax(0, 1fr); gap: var(--sp-2); }
  .section-head .section-num { font-size: 2.6rem; }
  .paths .cell { gap: var(--sp-3); }
  .paths .section-num { font-size: 2.6rem; }
  .notfound .section-num { font-size: 6rem; }
}
