/* Quick Read hub (/index/) and articles (/index/<slug>/) on the public design system (DESIGN.md).
 * Loaded after clinical-index.css; remaps its tokens to pro.css, calms the surfaces, sentence-case labels,
 * phone/tablet layout. Content, links and structured data are untouched (Quick Read stays fully public). */
.ci-list-page, .ci-detail-main, .ci-detail-hero {
  --mh-text: var(--pr-ink);
  --mh-muted: var(--pr-ink-2);
  --mh-muted-strong: var(--pr-ink-2);
  --mh-accent: var(--pr-accent);
  --mh-accent-ink: var(--pr-link);
  --mh-card-border: var(--pr-line);
  position: relative; z-index: 1;
}
:is(.ci-list-page, .ci-detail-main, .ci-detail-hero) .uppercase { text-transform: none; }
:is(.ci-list-page, .ci-detail-main, .ci-detail-hero) :is(.tracking-widest, .tracking-wider, .tracking-wide) { letter-spacing: 0; }
:is(.ci-list-page, .ci-detail-main, .ci-detail-hero) .mh-eyebrow { font-size: var(--pr-t-small); }
:is(.ci-list-page, .ci-detail-main, .ci-detail-hero) .ci-text-strong { color: var(--pr-ink); }
:is(.ci-list-page, .ci-detail-main, .ci-detail-hero) :is(.ci-hero__orb, .ci-detail-cta__orb, .ci-feat-card__hover, .ci-rel-card__hover) { display: none; }

/* ---------------------------------------------------------------- hub */
.ci-list-page { padding-bottom: var(--pr-section) !important; }
.ci-list-page .ci-hero { padding-top: 48px; padding-bottom: 8px; background: none; overflow: visible; }
.ci-list-page .ci-hero .mh-section-title { font-size: var(--pr-t-display); line-height: var(--pr-lh-display); letter-spacing: var(--pr-track-display); font-weight: 600; color: var(--pr-ink); }
:root[dir="rtl"] .ci-list-page .ci-hero .mh-section-title { font-weight: 700; }
.ci-list-page .ci-trust-pill {
  display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 0 12px; border-radius: 10px;
  border: 1px solid var(--pr-line); background: var(--pr-glass); color: var(--pr-ink-2); font-size: var(--pr-t-caption); box-shadow: none;
}
.ci-list-page .ci-search-lg {
  min-height: 52px; border-radius: 14px; border: 1px solid var(--pr-line-2); background: var(--pr-raised); color: var(--pr-ink);
  font-size: 1rem; box-shadow: none;
}
.ci-list-page .ci-search-lg:focus { border-color: var(--pr-accent); box-shadow: var(--pr-focus); outline: none; }
.ci-list-page :is(.ci-feat-card, .ci-eeat-card, .ci-cta-box, .ci-rel-card),
.ci-list-page .index-list > * > a, .ci-list-page .index-list > a {
  border-radius: 20px; border: 1px solid var(--pr-line); background: var(--pr-raised); box-shadow: none;
  -webkit-backdrop-filter: none; backdrop-filter: none;
}
:root[data-theme="dark"] .ci-list-page :is(.ci-feat-card, .ci-eeat-card) { background: color-mix(in srgb, var(--pr-raised) 88%, transparent); }
.ci-list-page .ci-feat-card { transition: transform .35s var(--pr-ease), border-color .35s var(--pr-ease); }
@media (hover: hover) { .ci-list-page .ci-feat-card:hover { transform: translateY(-4px); border-color: var(--pr-line-2); } }
.ci-list-page :is(.ci-feat-badge, .ci-featured-badge-sm, .ci-sect-badge) { border-radius: 8px; letter-spacing: 0; text-transform: none; font-weight: 600; }
.ci-list-page .mh-utility-chip { border-radius: 10px; min-height: 40px; }
.ci-list-page .mh-utility-chip.is-active { background: var(--pr-ink); color: var(--pr-bg); border-color: var(--pr-ink); }
.ci-list-page .ci-browse-section > .grid { display: grid; gap: 40px; }
@media (min-width: 1024px) { .ci-list-page .ci-browse-section > .grid { grid-template-columns: 1fr 1fr; gap: 48px; } }
.ci-list-page .ci-cta-box {
  border-radius: 32px; border: 1px solid var(--pr-line);
  background: radial-gradient(60% 90% at 100% 0%, rgba(0, 217, 255, .2), transparent 70%), radial-gradient(50% 80% at 0% 100%, rgba(33, 230, 193, .14), transparent 70%), var(--pr-raised);
}
.ci-list-page .ci-cta-box h2 { font-weight: 600; letter-spacing: -.02em; }

/* ---------------------------------------------------------------- article */
.ci-detail-main { padding-top: 32px; padding-bottom: var(--pr-section); }
.ci-detail-hero h1 { font-size: clamp(2.125rem, 1.4rem + 2.8vw, 3.25rem) !important; line-height: 1.08; letter-spacing: -.03em; font-weight: 600 !important; color: var(--pr-ink); }
:root[dir="rtl"] .ci-detail-hero h1 { letter-spacing: 0; line-height: 1.3; font-weight: 700 !important; }
.ci-detail-main .mh-clinical-content { font-size: var(--pr-t-body); line-height: var(--pr-lh-body); color: var(--pr-ink-2); }
.ci-detail-main .mh-clinical-content :is(h2, h3) { color: var(--pr-ink); font-weight: 600; letter-spacing: -.01em; }
.ci-detail-main .ci-detail-lead { color: var(--pr-ink-2); border-color: var(--pr-line) !important; }
.ci-detail-main :is(.ci-detail-disclaimer-surface, .ci-detail-disclaimer) {
  border-radius: 20px !important; border: 1px solid var(--pr-line); background: var(--pr-bg-2); box-shadow: none;
}
.ci-detail-main .ci-detail-disclaimer::before, .ci-detail-main .ci-detail-disclaimer::after { display: none; }
.ci-detail-main .ci-rel-card { border-radius: 18px; border: 1px solid var(--pr-line); background: var(--pr-raised); box-shadow: none; }
.ci-detail-main [class*="ci-detail-cta"] { border-radius: 28px; }
.ci-detail-main .ci-detail-drugs__list a { border-radius: 10px; }

/* ---------------------------------------------------------------- phones and tablets */
@media (max-width: 1023px) {
  .ci-list-page .ci-feat-section > .flex, .ci-list-page .ci-recent-section > .flex { justify-content: center; text-align: center; }
  .ci-list-page .ci-topic-tabs { justify-content: center; }
}
@media (max-width: 767px) {
  .ci-list-page .ci-hero { padding-top: 20px; }
  .ci-list-page .ci-hero .mh-section-title { font-size: clamp(2.125rem, 1.1rem + 5vw, 2.75rem); }
  .ci-list-page :is(.ci-feat-section, .ci-browse-section, .ci-recent-section, .ci-eeat-section, .ci-cta-section) { padding-top: 32px !important; padding-bottom: 8px !important; }
  .ci-list-page .ci-eeat-section .grid { grid-auto-flow: column; grid-auto-columns: 80%; grid-template-columns: none; overflow-x: auto; scroll-snap-type: x mandatory; margin-inline: -16px; padding: 0 16px 8px; scrollbar-width: none; }
  .ci-list-page .ci-eeat-card { scroll-snap-align: start; }
  .ci-list-page .ci-cta-box { padding: 32px 20px !important; border-radius: 24px; }
  .ci-detail-main { padding-top: 16px; }
  .ci-detail-main nav { justify-content: center; }
}

.ci-detail-hero .ci-detail-topic-glow { display: none; }
.ci-detail-hero { padding-top: 32px; }
@media (max-width: 767px) { .ci-detail-hero { padding-top: 12px; } .ci-detail-hero nav { justify-content: center; } .ci-detail-hero .max-w-3xl { text-align: center; } .ci-detail-hero .max-w-3xl > .flex { justify-content: center; } }

/* RTL-safe corner badge and search icon (logical properties; clinical-index.css pins them to the physical right/left). */
:is(.ci-list-page, .ci-detail-main) .ci-feat-badge { right: auto; inset-inline-end: 1.25rem; }
:is(.ci-list-page, .ci-detail-main) .ci-feat-card h3.pr-16 { padding-right: 0; padding-inline-end: 4rem; }
:is(.ci-list-page, .ci-detail-main) .ci-search-icon { left: auto; inset-inline-start: 1rem; }
:is(.ci-list-page, .ci-detail-main) .ci-search-icon--sm { left: auto; inset-inline-start: .875rem; }
:is(.ci-list-page, .ci-detail-main) .ml-1 { margin-left: 0; margin-inline-start: .25rem; }
:is(.ci-list-page, .ci-detail-main) .ci-search-lg { padding-inline: 3rem 1.25rem; }
:is(.ci-list-page, .ci-detail-main) .ci-search-sm { padding-inline: 2.4rem 1.25rem; }
/* Topic tabs: wrap on phones, and centring never pushes a tab out of reach (safe center). */
.ci-list-page .ci-topic-tabs { justify-content: safe center; }
@media (max-width: 767px) { .ci-list-page .ci-topic-tabs { flex-wrap: wrap; overflow: visible; } }

/* ---------------------------------------------------------------- text contrast (QC 2026-10-20, WCAG AA 1.4.3)
   Faded meta labels (opacity .6), amber "Featured" badges, pink condition badge and cyan text links measured
   1.9 to 2.9 : 1 on the light ground (meta labels 3.96 : 1 on dark). Same hues, darker light-theme values. */
:is(.ci-list-page, .ci-detail-main, .ci-detail-hero) :is(.ci-meta-label, .ci-muted-soft) { opacity: 1 !important; color: var(--pr-ink-2); }
:root[data-theme="light"] :is(.ci-list-page, .ci-detail-main, .ci-detail-hero) :is(.ci-feat-badge, .ci-featured-badge-sm, .ci-detail-featured-badge) { color: var(--pr-warn) !important; }
:root[data-theme="light"] :is(.ci-list-page, .ci-detail-main, .ci-detail-hero) .ci-detail-type-badge--condition { color: #b0256f !important; }
:root[data-theme="light"] :is(.ci-list-page, .ci-detail-main, .ci-detail-hero) :is(.ci-read-more, a:not([class])) { color: var(--pr-link); }
