/* LEUKEMIA.WORLD — Story section 8 local preview (dark navy + coral) */
.s8-page { max-width: 920px; }
.s8-draft {
  display: inline-block; margin-top: .6rem; padding: .25rem .65rem;
  border-radius: 999px; font-size: .78rem; letter-spacing: .02em;
  background: rgba(255,123,132,.12); color: #ff9aa3; border: 1px solid rgba(255,123,132,.28);
}
.s8-h2 { margin: 1.6rem 0 .85rem; font-size: 1.05rem; color: #c9d4ea; }
.s8-hosp-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .7rem; }
.s8-hosp {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: 1rem 1.15rem; border-radius: 14px;
  background: linear-gradient(160deg, rgba(18,28,52,.95), rgba(10,16,32,.98));
  border: 1px solid rgba(255,123,132,.22); color: inherit; text-decoration: none;
  box-shadow: 0 8px 28px rgba(0,0,0,.28);
  transition: border-color .2s, transform .2s;
}
.s8-hosp:hover { border-color: rgba(255,123,132,.55); transform: translateY(-1px); }
.s8-hosp-t { font-weight: 650; line-height: 1.35; color: #eef2ff; }
.s8-hosp-n { flex: 0 0 auto; font-size: .82rem; color: #ff9aa3; opacity: .95; }

.s8-block h2 { font-size: 1.05rem; margin-bottom: .85rem; }
.s8-grid {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: .85rem;
}
.s8-person a {
  display: block; border-radius: 14px; overflow: hidden; text-decoration: none; color: inherit;
  background: #0b1224; border: 1px solid rgba(255,123,132,.2);
  box-shadow: 0 10px 30px rgba(0,0,0,.32);
  transition: border-color .2s, transform .2s;
}
.s8-person a:hover { border-color: rgba(255,123,132,.55); transform: translateY(-2px); }
.s8-person.is-featured a { border-color: rgba(255,180,120,.55); box-shadow: 0 0 0 1px rgba(255,180,120,.2), 0 12px 34px rgba(0,0,0,.4); }
.s8-card-ph {
  display: block; aspect-ratio: 16/9; background:
    radial-gradient(circle at 30% 40%, rgba(255,123,132,.28), transparent 55%),
    linear-gradient(145deg, #101a33, #070d1c);
  position: relative; overflow: hidden;
}
.s8-card-ph img { width: 100%; height: 100%; object-fit: cover; display: block; }
.s8-card-ph.is-fallback::after {
  content: attr(data-initials);
  position: absolute; inset: 0; display: grid; place-items: center;
  font-size: 1.6rem; font-weight: 700; color: #ffb3ba; letter-spacing: .04em;
}
.s8-person-meta { display: block; padding: .7rem .85rem .9rem; }
.s8-person-meta b { display: block; font-size: .95rem; color: #f3f6ff; line-height: 1.3; }
.s8-person-meta small { display: block; margin-top: .25rem; color: #9aabca; font-size: .78rem; line-height: 1.35; }

.s8-placeholder {
  margin-top: .75rem; padding: 1rem 1.1rem; border-radius: 12px;
  border: 1px dashed rgba(255,123,132,.35); color: #b7c4df; background: rgba(255,123,132,.05);
  font-size: .92rem;
}

.s8-person-page .s8-hero-card {
  max-width: 560px; margin: 0 0 1.1rem; border-radius: 16px; overflow: hidden;
  border: 1px solid rgba(255,123,132,.28); box-shadow: 0 16px 40px rgba(0,0,0,.4);
}
.s8-person-page .s8-hero-card .s8-card-ph { aspect-ratio: 16/9; max-width: 720px; }
.s8-keys { margin: 0; padding-left: 1.15rem; color: #d5def0; }
.s8-keys li { margin: .35rem 0; }
.s8-faq dt { margin-top: .7rem; font-weight: 650; color: #ffb3ba; }
.s8-faq dd { margin: .25rem 0 0; color: #c9d4ea; }
.s8-src { margin: 0; padding-left: 1.15rem; color: #9aabca; font-size: .88rem; }
.s8-sign { margin-top: 1.4rem; color: #ff9aa3; font-weight: 600; }
.s8-tsec { margin-top: 1.25rem; }

@media (max-width: 640px) {
  .s8-grid { grid-template-columns: 1fr 1fr; gap: .65rem; }
  .s8-hosp { flex-direction: column; align-items: flex-start; }
}

.s8-donors-hero { max-width: 640px; margin: 0 0 1.2rem; }
.s8-donors-lead { font-size: 1.05rem; line-height: 1.55; color: #e8eefc; }
.s8-note { margin-top: .9rem; color: #9aabca; font-size: .9rem; }
.s8-hosp.is-donors { border-color: rgba(255,180,120,.4); }
/* t476u per-person article images */
.s8-gal { margin: 1.2rem 0; border-radius: 16px; overflow: hidden; aspect-ratio: 16/9; background: #0b1428; box-shadow: 0 10px 30px rgba(6,12,30,.35); }
.s8-gal img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* t480u premium list grid: name only on photo, 4 cols desktop / 2 mobile */
.s8-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.s8-page { max-width: 1080px; }
.s8-grid { grid-template-columns: repeat(4, minmax(0,1fr)); gap: 1rem; }
.s8-person a { position: relative; border-radius: 18px; border: 1px solid rgba(255,123,132,.18); background:#070d1c; transition: border-color .25s, transform .25s, box-shadow .25s; }
.s8-person a:hover, .s8-person a:focus-visible { border-color: #ff7b84; transform: translateY(-3px); box-shadow: 0 0 0 1px rgba(255,123,132,.45), 0 16px 36px rgba(255,123,132,.18); }
.s8-person a:hover img { transform: scale(1.03); }
.s8-card-ph img { transition: transform .4s ease; }
.s8-block { margin-top: 2rem; scroll-margin-top: 90px; }
.s8-block h2 { display:flex; align-items:center; gap:.6rem; font-size: 1.15rem; font-weight: 700; letter-spacing:.01em; margin: 0 0 1rem; }
.s8-block h2::before { content:""; width:4px; height:1.15em; border-radius:2px; background: linear-gradient(#ff9aa3,#ff7b84); }
.s8-page { padding-top: 1rem; }
@media (max-width: 900px) { .s8-grid { grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (max-width: 640px) { .s8-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: .6rem; } .s8-person a { border-radius: 14px; } }
/* t497 department tiles */
.s8-dept-grid{list-style:none;margin:16px 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.s8-dept{display:block;border-radius:16px;overflow:hidden;background:#0f1a3a;color:#fff;text-decoration:none;box-shadow:0 6px 18px rgba(10,20,50,.18)}
.s8-dept-ph{display:block;aspect-ratio:16/9;overflow:hidden}.s8-dept-ph img{width:100%;height:100%;object-fit:cover;display:block}
.s8-dept-t{display:block;padding:12px 14px 2px;font-weight:700;font-size:1.05rem}
.s8-dept-n{display:block;padding:0 14px 12px;opacity:.75;font-size:.9rem}
/* t609: readable name plate under each card */
.s8-person a { display: flex; flex-direction: column; height: 100%; }
.s8-nameplate { display: block; flex: 1; padding: .7rem .8rem .8rem; background: linear-gradient(180deg, #0a1022 0%, #050914 100%); border-top: 2px solid #ff7b84; }
.s8-nameplate b { display: block; font-size: 1.08rem; font-weight: 800; line-height: 1.25; color: #ffffff; letter-spacing: .01em; text-shadow: 0 1px 2px rgba(0,0,0,.6); }
.s8-nameplate small { display: block; margin-top: .3rem; font-size: .8rem; font-weight: 600; line-height: 1.3; color: #ff9aa3; }
@media (max-width: 640px) { .s8-nameplate { padding: .6rem .65rem .7rem; } .s8-nameplate b { font-size: 1rem; } .s8-nameplate small { font-size: .76rem; } }
/* t613: name plate styled like menu section items */
.s8-person a { border: 1px solid rgba(232,196,120,.22); border-radius: 14px;
  background: linear-gradient(rgba(255,255,255,.075), rgba(255,255,255,.016)), #0b1224;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), inset 0 -2px 0 rgba(0,0,0,.25), 0 8px 22px rgba(0,0,0,.7); }
.s8-nameplate { background: none; border-top: 1px solid rgba(232,196,120,.22); padding: 12px 14px; }
.s8-nameplate b { font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", Arial, sans-serif; font-size: 16px; font-weight: 400; line-height: 1.65; color: #e9eff8; text-shadow: none; letter-spacing: 0; }
.s8-nameplate small { font-family: Inter, system-ui, sans-serif; font-size: 12px; font-weight: 500; color: #9aabca; margin-top: 2px; }
@media (max-width: 640px) { .s8-nameplate { padding: 10px 12px; } .s8-nameplate b { font-size: 15px; line-height: 1.4; } .s8-nameplate small { font-size: 12px; } }
/* t616: people list like the homepage menu */
.s8-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; grid-template-columns: 1fr !important; }
.s8-mi a { display: flex; align-items: center; gap: 12px; padding: 12px 14px; min-height: 64px; text-decoration: none; color: #e9eff8;
  border: 1px solid rgba(232,196,120,.22); border-radius: 14px;
  background: linear-gradient(rgba(255,255,255,.075), rgba(255,255,255,.016));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), inset 0 -2px 0 rgba(0,0,0,.25), 0 8px 22px rgba(0,0,0,.45); }
.s8-mi a:hover { border-color: rgba(255,123,132,.55); }
.s8-mi .mthumb { width: 56px; height: 40px; object-fit: cover; border-radius: 8px; flex-shrink: 0; display: block; }
.s8-mi-t { display: block; min-width: 0; }
.s8-mi-n { display: block; font: 400 16px/1.4 Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; color: #e9eff8; }
.s8-mi-r { display: block; font: 500 12px/1.35 Inter, system-ui, sans-serif; color: #9aabca; margin-top: 2px; }
.s8-mi.is-featured a { border-color: rgba(255,123,132,.6); box-shadow: 0 0 0 1px rgba(255,123,132,.25), inset 0 1px 0 rgba(255,255,255,.14), 0 8px 22px rgba(0,0,0,.45); }
.s8-mi.is-featured .s8-mi-r { color: #ff9aa3; }
.s8-mi .mthumb { object-position: 72% 55%; }
/* t620 role hero with readable name label */
.s8-role-hero{position:relative}
.s8-hero-lbl{position:absolute;left:0;right:0;bottom:0;padding:28px 18px 14px;background:linear-gradient(transparent,rgba(8,14,30,.92));display:block}
.s8-hero-lbl b{display:block;font:700 22px/1.25 Inter,system-ui,sans-serif;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.6)}
.s8-hero-lbl small{display:block;font:500 13px/1.3 Inter,system-ui,sans-serif;color:#ff9aa3;margin-top:3px}
.s8-empty{color:#9aabca;margin:12px 2px}