.catalog-section{max-width:1440px;margin:auto;padding:40px 5% 75px}
.catalog-heading{max-width:800px;margin:12px 0 48px}
.catalog-heading h1,.catalog-series-hero h1{font-family:var(--font-display);font-size:var(--type-page);font-weight:var(--weight-medium);line-height:var(--leading-tight);letter-spacing:-.025em;margin:0 0 24px}
.catalog-heading p{font-size:var(--type-lead);color:var(--color-text-muted)}
.catalog-series-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:28px}
.catalog-series{background:var(--color-cobalt);color:var(--color-white);border-radius:18px;overflow:hidden;max-width:650px}
.catalog-cobalt{background:var(--color-cobalt)}.catalog-purple{background:var(--color-purple)}
.catalog-series>img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;background:var(--color-paper)}
.catalog-series>div{padding:28px}
.catalog-series h3,.catalog-episode h3{font-family:var(--font-display);font-size:var(--type-card-title);line-height:1.15;font-weight:var(--weight-medium);margin:12px 0}
.catalog-series h3 a,.catalog-episode h3 a{text-decoration:none}
.catalog-series h3 a:hover,.catalog-episode h3 a:hover{text-decoration:underline}
.catalog-meta{font-size:var(--type-meta);margin:0}
.catalog-link{display:inline-flex;align-items:center;justify-content:space-between;gap:20px;min-height:44px;font-size:var(--cta-font-size);font-weight:var(--cta-font-weight);line-height:var(--cta-line-height);text-underline-offset:5px}
.catalog-episode-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 28px}
.catalog-episode{min-width:0;border-bottom:1px solid var(--color-border);padding-bottom:24px}
.catalog-episode[hidden]{display:none}
.catalog-episode>a{display:block}
.catalog-episode img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:14px}
.catalog-episode-copy{padding-top:18px}.catalog-episode-copy>p:not(.catalog-meta){font-size:var(--type-body)}
.catalog-status{color:var(--color-azure-deep);font-weight:var(--weight-semibold)}
.catalog-series-hero{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:50px;margin:35px 0 65px}
.catalog-series-hero>img{width:100%;height:auto;border-radius:18px}
.catalog-back{display:inline-block;padding:8px 0;text-underline-offset:5px}
.catalog-filters{display:flex;flex-wrap:wrap;gap:24px;margin-bottom:24px}
.catalog-filters label{display:grid;gap:8px;font-weight:var(--weight-semibold)}
.catalog-filters select{font:inherit;color:var(--color-ink);background:var(--color-paper);border:1px solid var(--color-text-muted);border-radius:8px;padding:12px;min-width:210px;max-width:100%}
.catalog-filters select:focus-visible{outline:3px solid var(--color-cobalt);outline-offset:4px}
.catalog-preview-note{background:var(--color-gold);color:var(--color-on-wonder);padding:22px;margin-bottom:32px}
@media(max-width:1000px){.catalog-episode-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.catalog-section{padding:30px 6% 50px}.catalog-episode-grid,.catalog-series-hero{grid-template-columns:1fr}.catalog-series-hero{gap:25px}.catalog-heading{margin-bottom:32px}.catalog-filters{display:grid}.catalog-series>div{padding:24px}}
/* Keep all three catalog destinations visible on smaller screens. */
@media(max-width:760px){.header nav a:nth-child(1){display:inline-flex}}
@media(max-width:380px){.header{gap:10px}.header nav{gap:9px}.header nav a{font-size:var(--type-tiny)}.brand{gap:6px}}

.catalog-list-heading{margin:0 0 28px}

/* Browse pages continue the blue-sky opening and the illustrated page palette. */
.series-index,.episodes-index{background:var(--color-paper-warm);min-height:70vh}
.series-index .catalog-section,.episodes-index .catalog-section{max-width:none;padding:0 max(5%,calc((100% - 1296px)/2)) clamp(72px,8vw,110px)}
.series-index .catalog-heading,.episodes-index .catalog-heading{position:relative;isolation:isolate;max-width:none;overflow:hidden;margin:0 0 clamp(50px,6vw,82px);padding:clamp(70px,8vw,112px) max(5%,calc((100% - 1296px)/2));background:var(--color-sky) url('/assets/home/painted-sky.webp') center 54%/cover no-repeat;color:var(--color-ivory)}
.series-index .catalog-heading::before,.episodes-index .catalog-heading::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,color-mix(in srgb, var(--color-navy) 91%, transparent) 0%,color-mix(in srgb, var(--color-navy) 73%, transparent) 48%,color-mix(in srgb, var(--color-navy) 33%, transparent) 100%)}
.series-index .catalog-heading h1,.episodes-index .catalog-heading h1{max-width:850px;margin-bottom:22px;font-size:var(--type-page);letter-spacing:-.03em;text-wrap:balance}
.series-index .catalog-heading p,.episodes-index .catalog-heading p{max-width:670px;margin:0;color:var(--color-ivory);font-size:var(--type-lead);line-height:1.65}
.series-index .catalog-list-heading,.episodes-index .catalog-list-heading{color:var(--color-navy);font-size:var(--type-section);font-weight:var(--weight-medium);margin-bottom:30px}
.series-index .catalog-series,.episodes-index .catalog-series{box-shadow:0 22px 42px -27px color-mix(in srgb, var(--color-navy) 50%, transparent)}
.episodes-index .catalog-episode{overflow:hidden;background:var(--color-pale-sky);border:0;border-radius:16px;padding:0;box-shadow:0 18px 34px -26px color-mix(in srgb, var(--color-navy) 38%, transparent)}
.episodes-index .catalog-episode img{border-radius:0}
.episodes-index .catalog-episode-copy{padding:24px 28px 28px}
.episodes-index .catalog-status{color:var(--color-azure-deep)}
.episodes-index .catalog-filters select{background:var(--color-white);border-color:var(--color-text-muted)}
.episodes-index #episode-count{margin:0 0 22px;color:var(--color-text-muted)}
.episodes-index #empty-episodes{padding:24px 0;color:var(--color-text-muted)}
@media(min-width:761px){
  .episodes-index .catalog-episode-grid:has(> :only-child){grid-template-columns:minmax(0,1fr)}
  .episodes-index .catalog-episode-grid:has(> :only-child) .catalog-episode{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);max-width:1060px}
  .episodes-index .catalog-episode-grid:has(> :only-child) .catalog-episode>a,.episodes-index .catalog-episode-grid:has(> :only-child) .catalog-episode img{height:100%}
  .episodes-index .catalog-episode-grid:has(> :only-child) .catalog-episode img{object-fit:cover}
  .episodes-index .catalog-episode-grid:has(> :only-child) .catalog-episode-copy{align-self:center;padding:clamp(28px,4vw,55px)}
}
@media(max-width:760px){
  .series-index .catalog-section,.episodes-index .catalog-section{padding:0 6% 72px}
  .series-index .catalog-heading,.episodes-index .catalog-heading{margin:0 0 50px;padding:62px 6% 70px;background-position:65% center}
  .series-index .catalog-heading::before,.episodes-index .catalog-heading::before{background:linear-gradient(90deg,color-mix(in srgb, var(--color-navy) 91%, transparent),color-mix(in srgb, var(--color-navy) 66%, transparent))}
  .series-index .catalog-heading h1,.episodes-index .catalog-heading h1{font-size:var(--type-page)}
}

/* A single series reads as a feature; the regular grid takes over as the catalog grows. */
@media(min-width:761px){
  .catalog-series-grid:has(> :only-child){grid-template-columns:minmax(0,1fr)}
  .catalog-series-grid:has(> :only-child) .catalog-series{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);max-width:1060px;min-height:340px}
  .catalog-series-grid:has(> :only-child) .catalog-series>img{height:100%;object-fit:cover;object-position:center}
  .catalog-series-grid:has(> :only-child) .catalog-series>div{align-self:center;padding:clamp(28px,4vw,55px)}
}

/* Series detail shares the painted opening and section rhythm of the browse pages. */
.series-detail{background:var(--color-paper-warm)}
.series-detail-hero{position:relative;isolation:isolate;background:var(--color-sky) url('/assets/home/painted-sky.webp') center 55%/cover no-repeat;color:var(--color-ivory)}
.series-detail-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,color-mix(in srgb,var(--color-navy) 91%,transparent),color-mix(in srgb,var(--color-navy) 42%,transparent))}
.series-detail-hero-inner{max-width:1296px;margin:auto;padding:35px 0 clamp(70px,8vw,112px)}
.series-detail-hero .catalog-back{color:var(--color-ivory);margin-bottom:42px}
.series-detail-hero-grid{display:grid;grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);gap:6%;align-items:center}
.series-detail-copy h1{font-family:var(--font-display);font-size:var(--type-page);font-weight:var(--weight-medium);line-height:var(--leading-tight);letter-spacing:-.03em;text-wrap:balance;margin:0 0 26px}
.series-detail-copy .eyebrow{color:var(--color-gold-soft);margin-bottom:20px}
.series-detail-copy .intro{max-width:540px;line-height:1.55;margin:0 0 22px}
.series-detail-age{font-size:var(--type-small);font-weight:var(--weight-semibold);margin:0 0 28px}
.series-detail-copy .hero-actions{margin:0}
.series-detail-copy .button{background:var(--color-orange-action);color:var(--color-on-orange-action)}
.series-detail-copy .button:hover{background:var(--color-orange-action-hover)}
.series-detail-copy .text-link{color:var(--color-ivory)}
.series-detail-hero-grid>img{display:block;width:100%;height:auto;border-radius:16px;box-shadow:0 26px 44px -24px color-mix(in srgb,var(--color-navy) 65%,transparent)}
.series-detail-episodes{max-width:none;padding:clamp(64px,7vw,100px) max(5%,calc((100% - 1296px)/2)) clamp(72px,8vw,110px)}
.series-detail-episodes .section-heading{align-items:baseline;margin-bottom:34px}
.series-detail-episodes .section-heading h2{color:var(--color-navy);font-size:var(--type-section);font-weight:var(--weight-medium)}
.series-detail-episodes .catalog-episode{background:var(--color-pale-sky);border:0;border-radius:16px;overflow:hidden;padding:0;box-shadow:0 18px 34px -26px color-mix(in srgb,var(--color-navy) 38%,transparent)}
.series-detail-episodes .catalog-episode img{border-radius:0}
.series-detail-episodes .catalog-episode-copy{padding:25px 28px 28px}
.series-detail .friends-section{max-width:none;background:var(--color-pale-sky);padding:clamp(64px,7vw,100px) max(5%,calc((100% - 1296px)/2))}
.series-detail .friend-portrait{display:block;width:100%;height:auto;aspect-ratio:6/5;object-fit:contain;margin:0 0 24px;filter:drop-shadow(0 18px 18px color-mix(in srgb,var(--color-navy) 16%,transparent))}
@media(min-width:761px){
  .series-detail-episodes .catalog-episode-grid:has(> :only-child){grid-template-columns:minmax(0,1fr)}
  .series-detail-episodes .catalog-episode-grid:has(> :only-child) .catalog-episode{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);max-width:1060px}
  .series-detail-episodes .catalog-episode-grid:has(> :only-child) .catalog-episode>a,.series-detail-episodes .catalog-episode-grid:has(> :only-child) .catalog-episode img{height:100%}
  .series-detail-episodes .catalog-episode-grid:has(> :only-child) .catalog-episode img{object-fit:cover}
  .series-detail-episodes .catalog-episode-grid:has(> :only-child) .catalog-episode-copy{align-self:center;padding:clamp(28px,4vw,55px)}
}
@media(max-width:1370px){.series-detail-hero-inner{padding-left:5%;padding-right:5%}}
@media(max-width:760px){
  .series-detail-hero-inner{padding:25px 6% 70px}
  .series-detail-hero .catalog-back{margin-bottom:35px}
  .series-detail-hero-grid{grid-template-columns:1fr;gap:36px}
  .series-detail-copy .intro{max-width:650px}
  .series-detail-episodes{padding:64px 6% 72px}
  .series-detail-episodes .section-heading{align-items:flex-start;flex-direction:column;gap:8px}
  .series-detail .friends-section{padding:64px 6% 72px}
}

/* Utility copy keeps the same type system in a calmer reading column. */
.privacy-page .catalog-section{max-width:820px;padding:clamp(52px,6vw,88px) 5% clamp(80px,8vw,112px)}
.privacy-page .catalog-heading{max-width:68ch;margin:0 0 48px}
.privacy-page .catalog-heading h1{color:var(--color-navy);margin-bottom:20px}
.privacy-page .catalog-heading p{line-height:1.55}
.privacy-page .resource-body{max-width:68ch}
.privacy-page .resource-body section+section{margin-top:40px}
.privacy-page .resource-body h2{font-family:var(--font-display);font-size:var(--type-card-title);font-weight:var(--weight-medium);line-height:var(--leading-heading);color:var(--color-navy);margin:0 0 14px}
.privacy-page .resource-body p{margin:0 0 16px}
.privacy-page .resource-body dl{margin:14px 0 0}
.privacy-page .resource-body dt{margin-top:22px}
@media(max-width:760px){.privacy-page .catalog-section{padding:52px 6% 80px}.privacy-page .resource-body section+section{margin-top:34px}}
