/* Chapter catalog: the illustrated textbook's table of contents. */
.topic-catalog {
  --catalog-ink:#302e29; --catalog-muted:#797368; --catalog-line:#ded8cc;
  --catalog-paper:#f8f5ed; --catalog-accent:#9b4d24;
  padding-bottom:3rem; color:var(--catalog-ink);
  font-family:"Manrope",ui-sans-serif,system-ui,sans-serif;
}
.catalog-heading { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:3rem; align-items:center; margin:1rem 0 1.7rem; }
.catalog-eyebrow { margin:0 0 .7rem; font-size:.64rem; line-height:1.5; letter-spacing:.13em; font-weight:650; text-transform:uppercase; color:var(--catalog-accent); }
.catalog-heading h1 { margin:0 0 .8rem; font:500 clamp(2.4rem,4.5vw,3.6rem)/1.08 Georgia,serif; letter-spacing:-.045em; text-wrap:balance; }
.catalog-description { max-width:42rem; margin:0; color:#686258; font-size:.93rem; line-height:1.7; }
.catalog-overview { padding-left:1.8rem; border-left:1px solid var(--catalog-line); min-width:11rem; font-size:.75rem; line-height:1.5; color:var(--catalog-muted); }
.catalog-overview p { margin:0 0 .6rem; }
.catalog-overview p:first-child strong { display:block; color:var(--catalog-ink); font:500 2rem/1.15 Georgia,serif; letter-spacing:-.035em; }
.catalog-overview p:first-child span { display:block; margin-top:.25rem; }
.catalog-ready-count strong { font-weight:650; color:var(--catalog-ink); }
.catalog-crosslink { display:inline-block; padding-bottom:.1rem; color:var(--catalog-accent); border-bottom:1px solid #d4b18d; }
.catalog-crosslink:hover { border-color:currentColor; }
.catalog-intro { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); background:#f0e9d9; border:1px solid #ddd1bc; overflow:hidden; }
.catalog-intro-copy { padding:1.35rem 1.8rem; align-self:center; }
.catalog-intro h2 { margin:0 0 .55rem; font:500 clamp(1.7rem,2.5vw,2rem)/1.1 Georgia,serif; letter-spacing:-.035em; }
.catalog-intro-copy>p:not(.catalog-eyebrow) { max-width:31rem; margin:0 0 .7rem; color:#6b6254; font-size:.87rem; line-height:1.65; }
.catalog-intro-image { width:100%; height:100%; min-height:11.5rem; max-height:11.5rem; object-fit:cover; object-position:center 55%; }
.catalog-intro-copy>.catalog-eyebrow { margin-bottom:.4rem; }
.catalog-intro-action { display:inline-flex; align-items:center; gap:1.5rem; padding-bottom:.1rem; color:var(--catalog-ink); border-bottom:1px solid #b3a386; font-size:.8rem; font-weight:650; }
.catalog-intro-action span { transition:transform 150ms ease; }
.catalog-intro:hover .catalog-intro-action span { transform:translate(2px,-2px); }
.catalog-toolbar { display:flex; justify-content:space-between; align-items:center; gap:1rem; margin:2rem 0 2.25rem; padding-bottom:1rem; border-bottom:1px solid var(--catalog-line); }
.catalog-filters { display:flex; flex-wrap:wrap; gap:.35rem; }
.catalog-filters button { display:inline-flex; align-items:center; gap:.65rem; padding:.65rem .9rem; border:1px solid transparent; border-radius:.45rem; font:500 .8rem/1.4 "Manrope",sans-serif; color:#756e62; background:transparent; }
.catalog-filters button span { font-size:.67rem; font-variant-numeric:tabular-nums; opacity:.75; }
.catalog-filters button[aria-pressed="true"] { border-color:#ded5c5; background:#f5f0e5; color:var(--catalog-ink); }
.catalog-filters button:hover { background:#f7f3eb; }
.catalog-search { display:flex; gap:.6rem; align-items:center; min-width:17rem; padding:.6rem .8rem; background:#fff; border:1px solid #e2dcd0; border-radius:.45rem; }
.catalog-search svg { flex-shrink:0; stroke:#9b9387; stroke-width:1.6; stroke-linecap:round; }
.catalog-search input { width:100%; min-width:0; padding:0; border:0; border-radius:0; background:transparent; color:var(--catalog-ink); font:400 .8rem/1.5 "Manrope",sans-serif; }
.catalog-search input:focus { outline:none; }
.catalog-search:focus-within { outline:2px solid #b87c38; outline-offset:3px; }
.catalog-search input::placeholder { color:#9a9285; }
.catalog-layout { display:grid; grid-template-columns:12rem minmax(0,1fr); gap:2.5rem; align-items:start; }
.catalog-directory { position:sticky; top:7rem; padding-top:.4rem; }
.catalog-directory>.catalog-eyebrow { color:#9a9285; margin-bottom:.85rem; }
.catalog-directory nav { display:flex; flex-direction:column; gap:.15rem; }
.catalog-directory nav a { display:grid; grid-template-columns:1.5rem 1fr auto; align-items:baseline; gap:.4rem; padding:.7rem .15rem; border-bottom:1px solid #e9e3d9; font-size:.82rem; line-height:1.6; }
.catalog-directory nav a:hover { color:var(--catalog-accent); }
.catalog-directory-number,.catalog-directory nav small { color:#a39989; font-size:.65rem; font-variant-numeric:tabular-nums; }
.catalog-route-note { margin:1rem 0 0; max-width:10rem; color:#999082; font-size:.72rem; line-height:1.65; }
.catalog-content { min-width:0; }
.catalog-result-count { margin:0 0 .6rem; color:var(--catalog-muted); font-size:.74rem; line-height:1.5; }
.catalog-result-count:empty { display:none; }
.catalog-group { margin-bottom:2.5rem; scroll-margin-top:7rem; }
.catalog-group-heading { display:flex; gap:1rem; align-items:baseline; padding:0 0 1rem; }
.catalog-group-number { color:#c1b39b; font:400 2.3rem/1 Georgia,serif; letter-spacing:-.06em; }
.catalog-group-heading h2 { margin:0 0 .35rem; font:500 1.6rem/1.15 Georgia,serif; letter-spacing:-.035em; }
.catalog-group-heading p { margin:0; color:var(--catalog-muted); font-size:.8rem; line-height:1.6; }
.catalog-topics { display:grid; gap:.65rem; list-style:none; margin:0; padding:0; }
.catalog-topic { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) 1rem; align-items:center; gap:1.4rem; min-height:9.25rem; padding:1.25rem 1.35rem; border:1px solid #e3ddd2; border-radius:.4rem; background:#fffefa; transition:border-color 150ms ease,background-color 150ms ease,transform 150ms ease; }
.catalog-topic:hover { background:white; border-color:#bfab8b; transform:translateX(2px); }
.catalog-topic-meta { display:flex; align-items:center; flex-wrap:wrap; gap:.8rem; margin-bottom:.7rem; color:#9a8e7b; font-size:.69rem; line-height:1.5; font-variant-numeric:tabular-nums; }
.catalog-topic-status { display:inline-flex; align-items:center; gap:.35rem; color:#9b4d24; }
.catalog-topic-status::before { content:""; width:.28rem; height:.28rem; border-radius:50%; background:currentColor; }
.catalog-topic h3 { margin:0 0 .5rem; font-size:1.1rem; line-height:1.4; font-weight:650; letter-spacing:-.025em; }
.catalog-prerequisite { margin:0; color:#8c8170; font-size:.75rem; line-height:1.6; }
.catalog-topic-preview { min-width:0; padding-left:1.2rem; border-left:1px solid #e6dfd2; }
.catalog-topic-preview [lang=de] { margin:0 0 .5rem; color:#353c3c; font:400 clamp(1.15rem,1.8vw,1.45rem)/1.3 Georgia,serif; letter-spacing:-.025em; }
.catalog-translation { margin:0; color:#827b6f; font-size:.75rem; line-height:1.6; }
.catalog-topic-arrow { color:#a28a64; font-size:1.1rem; }
.catalog-topic.is-planned { background:#f8f6f0; border-color:#e7e1d6; }
.catalog-topic.is-planned .catalog-topic-status { color:#968b7a; }
.catalog-topic.is-planned .catalog-topic-status::before { background:transparent; border:1px solid currentColor; }
.catalog-topic.is-planned .catalog-topic-preview [lang=de] { color:#746c60; }
.catalog-empty { padding:3rem 1.5rem; text-align:center; border:1px solid var(--catalog-line); border-radius:.4rem; background:#faf7f0; }
.catalog-empty h2 { font:500 1.8rem/1.2 Georgia,serif; letter-spacing:-.03em; }
.catalog-empty p { font-size:.85rem; color:var(--catalog-muted); }
.catalog-empty button { margin-top:.6rem; padding:.65rem 1rem; border:1px solid #cfbfa5; border-radius:.4rem; background:#fff; color:var(--catalog-accent); font:500 .8rem/1.5 "Manrope",sans-serif; }
.catalog-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.topic-catalog [hidden] { display:none!important; }
.topic-catalog :is(a,button):focus-visible { outline:2px solid #b87c38; outline-offset:4px; }
@media(max-width:900px) {
  .catalog-layout { grid-template-columns:10rem minmax(0,1fr); gap:1.5rem; }
  .catalog-topic { grid-template-columns:minmax(0,1fr) 1rem; gap:.85rem; }
  .catalog-topic-preview { grid-column:1; border:0; padding:0; }
  .catalog-topic-arrow { grid-column:2; grid-row:1/3; }
  .catalog-topic-preview [lang=de] { font-size:1.3rem; }
}
@media(max-width:650px) {
  .catalog-heading { grid-template-columns:1fr; gap:1rem; margin-top:1.5rem; }
  .catalog-heading h1 { font-size:2.5rem; }
  .catalog-description { font-size:.85rem; }
  .catalog-overview { display:flex; flex-wrap:wrap; align-items:center; gap:.6rem 1.2rem; min-width:0; border:0; padding:0; }
  .catalog-overview p { margin:0; font-size:.7rem; }
  .catalog-overview p:first-child strong { display:inline; font:600 .75rem/1.5 "Manrope",sans-serif; letter-spacing:0; }
  .catalog-overview p:first-child span { display:none; }
  .catalog-crosslink { font-size:.7rem; }
  .catalog-intro { grid-template-columns:minmax(0,1fr) 6.5rem; }
  .catalog-intro-copy { padding:1.1rem; }
  .catalog-intro-copy>p:not(.catalog-eyebrow) { display:none; }
  .catalog-intro-image { height:100%; min-height:0; max-height:none; object-position:56% center; }
  .catalog-intro h2 { font-size:1.45rem; }
  .catalog-intro .catalog-eyebrow { font-size:.57rem; }
  .catalog-intro-action { font-size:.72rem; gap:.7rem; }
  .catalog-toolbar { flex-direction:column; align-items:stretch; gap:.8rem; margin:1.5rem 0; }
  .catalog-search { min-width:0; }
  .catalog-filters button { min-height:2.75rem; flex:1; justify-content:center; }
  .catalog-layout { display:block; }
  .catalog-directory { position:static; padding:0 0 1.5rem; }
  .catalog-directory nav { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.2rem .85rem; }
  .catalog-directory nav a { padding:.5rem 0; font-size:.71rem; }
  .catalog-route-note { max-width:none; margin:.65rem 0 0; font-size:.64rem; }
  .catalog-group-heading { gap:.8rem; }
  .catalog-group-heading h2 { font-size:1.5rem; }
  .catalog-group-heading p { font-size:.72rem; }
  .catalog-topic { padding:1.1rem; }
  .catalog-topic h3 { font-size:1.03rem; }
  .catalog-topic-preview [lang=de] { font-size:1.35rem; }
}
@media(prefers-reduced-motion:reduce) { .catalog-topic,.catalog-intro-action span { transition:none; transform:none; } }