/* ============================================================
   Arcanium · Solid Text / Transition card (shared)
   The reusable "definition / segue / transition" text block — an
   eyebrow badge, a bold title, and body copy on a soft blue panel.
   Use it anywhere you need a self-contained chunk of teaching text
   or a transition between sections (mirrors the CAV Physiology
   clinical-anchor cards). Loaded globally; drop it in by markup:

     <div class="solid-text-card">
       <div class="solid-text-card__badge">Label</div>
       <h4>Bold headline statement.</h4>
       <p>Body copy. Inline <strong>bold</strong> and
          <span class="cav-term" tabindex="0" data-tooltip="…">terms</span> work.</p>
     </div>

   Optional: wrap in <article class="topic-section-card full-width">
   to get the white outer frame + page section spacing.
   ============================================================ */
.solid-text-card {
    display: grid;
    gap: 14px;
    padding: 22px;
    border-radius: 24px;
    background: linear-gradient(180deg, rgba(225, 238, 255, 0.92), rgba(255, 255, 255, 0.96));
    border: 1px solid rgba(10, 132, 255, 0.18);
    box-shadow: 0 18px 36px rgba(15, 23, 42, 0.06);
}

.solid-text-card__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    padding: 8px 12px;
    border-radius: 999px;
    color: var(--accent-strong);
    background: rgba(240, 247, 255, 0.98);
    border: 1px solid rgba(10, 132, 255, 0.14);
    font-size: 12px;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.solid-text-card h4 {
    margin: 0;
    color: var(--text);
    font-size: 24px;
    line-height: 1.2;
    letter-spacing: -0.04em;
}

.solid-text-card p {
    margin: 0;
    color: var(--muted-strong);
    font-size: 16.5px;
    line-height: 1.65;
}
.solid-text-card p strong { color: var(--text); }

@media (max-width: 700px) {
    .solid-text-card { padding: 18px; }
    .solid-text-card h4 { font-size: 21px; }
    .solid-text-card p { font-size: 15.5px; }
}
