/* ── Live pulse dot ── */
    .inst-live { display:inline-flex; align-items:center; gap:8px; font-family:'Inter',system-ui,sans-serif; font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.45); margin-bottom:28px; }
    .inst-live-dot { width:8px; height:8px; border-radius:50%; background:#4ade80; flex-shrink:0; box-shadow:0 0 0 0 rgba(74,222,128,.5); animation:instPulse 2s infinite; }
    @keyframes instPulse { 0%{box-shadow:0 0 0 0 rgba(74,222,128,.5)} 70%{box-shadow:0 0 0 7px rgba(74,222,128,0)} 100%{box-shadow:0 0 0 0 rgba(74,222,128,0)} }
    /* ── Role cards ── */
    .inst-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:48px; }
    @media(max-width:960px){ .inst-grid{grid-template-columns:1fr;} }
    .inst-card { background:rgba(255,255,255,.04); border:1px solid rgba(244,196,48,.15); border-radius:16px; overflow:hidden; transition:border-color .2s,background .2s; }
    .inst-card:hover { border-color:rgba(244,196,48,.4); background:rgba(244,196,48,.04); }
    .inst-card details { padding:0; }
    .inst-card summary { list-style:none; cursor:pointer; padding:28px 28px 24px; display:flex; flex-direction:column; gap:12px; }
    .inst-card summary::-webkit-details-marker { display:none; }
    .inst-card-tag { font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:500; letter-spacing:.12em; text-transform:uppercase; color:#C8A84E; margin-bottom:4px; }
    .inst-card-title { font-family:'Inter',system-ui,sans-serif; font-size:20px; font-weight:700; color:#F5F0E8; margin:0; line-height:1.2; }
    .inst-card-sub { font-family:'Inter',system-ui,sans-serif; font-size:14px; color:rgba(245,240,232,.52); line-height:1.6; margin:0; }
    .inst-card-toggle { display:flex; align-items:center; gap:6px; font-family:'Inter',system-ui,sans-serif; font-size:12px; font-weight:600; color:#C8A84E; letter-spacing:.04em; margin-top:4px; }
    .inst-card-toggle-arrow { display:inline-block; transition:transform .22s; }
    details[open] .inst-card-toggle-arrow { transform:rotate(90deg); }
    .inst-card-body { border-top:1px solid rgba(244,196,48,.12); padding:24px 28px 28px; display:flex; flex-direction:column; gap:18px; }
    .inst-endpoint { background:rgba(0,0,0,.35); border-radius:8px; padding:12px 14px; }
    .inst-endpoint code { font-family:'JetBrains Mono',monospace; font-size:11.5px; color:#93c5fd; display:block; margin-bottom:4px; }
    .inst-endpoint span { font-size:12px; color:rgba(245,240,232,.45); }
    .inst-cta { display:inline-flex; align-items:center; gap:7px; background:#C8A84E; color:#000; font-family:'Inter',system-ui,sans-serif; font-size:13px; font-weight:700; padding:10px 20px; border-radius:100px; text-decoration:none; transition:background .2s,transform .15s; margin-top:4px; align-self:flex-start; }
    .inst-cta:hover { background:#E8C96A; transform:translateY(-1px); text-decoration:none; }
    /* ── Stream ticker ── */
    .inst-stream { display:flex; align-items:center; gap:16px; background:rgba(74,222,128,.06); border:1px solid rgba(74,222,128,.18); border-radius:10px; padding:14px 20px; margin-top:48px; overflow:hidden; }
    .inst-stream-label { font-family:'JetBrains Mono',monospace; font-size:11px; color:#4ade80; white-space:nowrap; font-weight:600; letter-spacing:.08em; }
    .inst-stream-ticker { font-family:'JetBrains Mono',monospace; font-size:11px; color:rgba(245,240,232,.4); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    /* ── Demo link bar ── */
    .inst-demo-bar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; margin-top:36px; padding:20px 24px; background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.07); border-radius:12px; }
    .inst-demo-bar p { font-family:'Inter',system-ui,sans-serif; font-size:14px; color:rgba(245,240,232,.55); margin:0; }
    .inst-demo-link { display:inline-flex; align-items:center; gap:6px; font-family:'Inter',system-ui,sans-serif; font-size:13px; font-weight:600; color:#C8A84E; text-decoration:none; white-space:nowrap; }
    .inst-demo-link:hover { color:#E8C96A; text-decoration:none; }
    /* Section head on dark bg */
    #institutions .section-eyebrow { color:#C8A84E; }
    #institutions h2 { color:#F5F0E8; }
    #institutions .section-head p { color:rgba(245,240,232,.6); }

/* ─────────────────────────────────────────────────────────────────
   #institutions section · CSP-strip rescue · 2026-05-26
   Inline style="background:#0A0F1A; padding:100px 0" on the section
   tag is stripped by strict CSP, dropping the section into body-light
   cream and making the (correctly cream-coloured) text invisible.
   These rules restore the dark register the section was designed for.
───────────────────────────────────────────────────────────────── */
#institutions {
  background: #0A0F1A !important;
  padding: 100px 0 !important;
}
@media (max-width: 720px) {
  #institutions { padding: 64px 0 !important; }
}
/* Belt-and-suspenders on the italic GenesisOS callout paragraph
   (it had its own inline color stripped by CSP). */
#institutions .section-head > p:nth-of-type(2) {
  color: rgba(245, 240, 232, .55) !important;
  font-size: 14px;
  font-style: italic;
  margin-top: 18px;
}
#institutions .section-head > p:nth-of-type(2) strong {
  color: #C8A84E !important;
  font-style: normal;
}

/* ─────────────────────────────────────────────────────────────────
   #institutions role-card text legibility · belt-and-suspenders
   The class-only rules at L14-15 should already render cream-on-dark,
   but Safari caching + any cascade override would let the text stay
   dim. Higher-specificity #institutions parent locks the colors.
   2026-05-26
───────────────────────────────────────────────────────────────── */
#institutions .inst-card-title {
  color: #F5F0E8 !important;
}
#institutions .inst-card-sub {
  color: rgba(245, 240, 232, .68) !important;
}
#institutions .inst-card-tag {
  color: #C8A84E !important;
}
#institutions .inst-card-toggle {
  color: #C8A84E !important;
}
/* Card body when expanded · code rows */
#institutions .inst-card-body { color: rgba(245, 240, 232, .85) !important; }
#institutions .inst-endpoint span { color: rgba(245, 240, 232, .58) !important; }
