/* MLAIA design C: topic subpages (/audio-ai/<topic>/, /medical-ai/<topic>/, /predictive-intelligence/<topic>/).
   Load after /assets/mlaia-c.css. Generated by _tools/audio-pages/render_audio.py.
   Layout: dark C nav and hero, then the long article body inside
   <div class="c-page c-reading c-tp-body"> (the light reading tokens from mlaia-c.css),
   then the dark contact section and footer. Everything here is scoped to body.c-topic. */

/* ---------- Hero: no instrument, a text-only C hero sized for longer headlines ---------- */
.c-topic .c-tp-hero .c-hero__copy{padding-top:56px;padding-bottom:64px}
.c-topic .c-tp-hero .c-display{font-size:clamp(44px,6.4vw,112px);max-width:13em;line-height:.9}
.c-topic .c-tp-hero .c-kicker{margin-bottom:24px}
.c-topic .c-tp-hero .c-creds a{color:var(--c-muted)}
.c-topic .c-tp-hero .c-creds a:hover{color:var(--c-amber)}
.c-topic .c-tp-hero .c-specs+.c-creds{margin-top:32px}

/* ---------- Reading body: light surface, C type and accents ---------- */
.c-tp-body{background:var(--c-bg);color:var(--c-text);counter-reset:c-tp-sec}
.c-tp-body .c-sec{counter-increment:c-tp-sec}
/* Section index in the kicker comes from a counter, so it adds no text to the page. */
.c-tp-body .c-tp-head>.c-kicker::before{content:counter(c-tp-sec,decimal-leading-zero);color:var(--c-fg)}
.c-tp-h2{font-size:clamp(34px,4.4vw,68px);line-height:.95;max-width:18em}
.c-tp-head{max-width:60em}
.c-tp-head .c-lead{max-width:44em}
.c-tp-para{max-width:44em;margin:20px 0 0;font-size:var(--c-fs-body);line-height:1.7;color:var(--c-text)}
.c-tp-body .c-cell p:last-child{margin-bottom:0}
.c-tp-body .c-cell p a,.c-tp-body .c-tp-para a,.c-tp-body .c-lead a,.c-tp-body .c-faq a,.c-tp-body .c-note a{color:var(--c-blue)}
.c-tp-body .c-cell p a:hover,.c-tp-body .c-tp-para a:hover,.c-tp-body .c-lead a:hover,.c-tp-body .c-faq a:hover,.c-tp-body .c-note a:hover{color:var(--c-amber)}
.c-tp-body .c-cell h3{font-size:clamp(21px,1.8vw,26px)}
.c-tp-body .c-cells--2 .c-cell{padding:32px}
.c-tp-body .c-chips span{background:var(--c-bg)}
.c-tp-body .c-sec--alt .c-chips span{background:var(--c-bg-2)}
.c-tp-cta{margin:40px 0 0}
.c-tp-body .c-faq{max-width:980px}
.c-tp-body .c-faq summary{padding:22px 0}
@media (max-width:640px){
  .c-tp-body .c-cells--2 .c-cell{padding:22px 0}
  .c-topic .c-tp-hero .c-hero__copy{padding-top:32px;padding-bottom:44px}
}

/* ---------- Tiles: related reading and sources ---------- */
.c-tp-reads{margin-top:0}
.c-tp-body .c-tile strong span{display:inline;font:inherit;color:inherit;margin:0}
.c-tp-body a.c-tile:hover{background:var(--c-bg-2)}
.c-tp-body .c-sec--alt a.c-tile:hover{background:var(--c-bg)}
.c-tp-body .c-tile strong{font-size:21px}
.c-tp-body .c-tile i{font-style:italic}

/* ---------- Figures: dark-on-white SVGs stay on a white panel ---------- */
.c-fig{margin:48px 0 0;padding:28px;background:#fff;border:1px solid var(--c-rule)}
.c-fig svg{display:block;width:100%;height:auto}
.c-fig__panels{display:flex;flex-wrap:wrap;justify-content:center;gap:24px}
.c-fig__panels svg{flex:1 1 300px;max-width:420px}
.c-fig__scroll svg{max-width:900px;margin-inline:auto}
.c-fig__scroll:focus-visible{outline-offset:6px}
.c-fig figcaption{margin:20px auto 0;max-width:760px;font-size:15px;line-height:1.6;color:#4a4f4b;text-align:left;border-top:1px solid #e3e0da;padding-top:14px}
@media (max-width:700px){
  .c-fig{padding:16px}
  .c-fig__scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .c-fig__scroll svg{min-width:620px}
}

/* ---------- Contact: dark C section; bullet list for the prediction pages ---------- */
.c-topic .c-contact .c-tp-h2{margin-bottom:28px}
.c-tp-contact-list{list-style:none;padding:0;margin:0 0 22px;color:var(--c-text)}
.c-tp-contact-list li{padding:6px 0 6px 22px;position:relative}
.c-tp-contact-list li::before{content:"";position:absolute;left:0;top:15px;width:8px;height:8px;background:var(--c-amber)}
.c-tp-reach{font-size:14px;line-height:1.9;margin-top:24px}
.c-tp-band{align-self:end}
.c-topic .c-contact__copy a:not(.c-btn){color:var(--c-fg)}
.c-topic .c-contact__copy a:not(.c-btn):hover{color:var(--c-amber)}