.bio-sequence {
  box-sizing:border-box;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:center;
  gap:14px;
  width:min(1100px,calc(100% - 32px));
  margin:32px auto;
  padding:16px;
  border:2px solid #b9dce7;
  border-radius:22px;
  background:linear-gradient(120deg,#f3fdff,#fffbef);
  box-shadow:0 10px 26px #173b5b18;
  font-family:system-ui,-apple-system,"Segoe UI",sans-serif;
  color:#193b5b;
}
.bio-sequence .bio-sequence-link {
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-height:76px;
  padding:12px 18px;
  border:1px solid #b5d4e1;
  border-radius:14px;
  background:white;
  color:#193b5b;
  text-decoration:none;
  text-transform:none;
  letter-spacing:normal;
  line-height:1.3;
  box-shadow:0 4px 0 #d3e9ee;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.bio-sequence .bio-sequence-link:hover {
  transform:translateY(-3px);
  border-color:#5ba5bb;
  box-shadow:0 7px 0 #d3e9ee;
}
.bio-sequence .bio-sequence-link:focus-visible { outline:3px solid #e69d33; outline-offset:3px; }
.bio-sequence .bio-sequence-link span { color:#55758a; font-size:.76rem; font-weight:800; text-transform:uppercase; letter-spacing:.09em; }
.bio-sequence .bio-sequence-link strong { margin-top:3px; color:#193b5b; font-size:1.08rem; font-weight:850; }
.bio-sequence .bio-sequence-next { text-align:right; align-items:flex-end; background:#fff4cf; border-color:#ead38a; box-shadow:0 4px 0 #eee2b8; }
.bio-sequence .bio-sequence-next:hover { border-color:#d3a64a; box-shadow:0 7px 0 #eee2b8; }
.bio-sequence .bio-sequence-position { white-space:nowrap; color:#4f6b7c; font-size:.78rem; font-weight:850; letter-spacing:.08em; text-transform:uppercase; }
@media(max-width:580px) {
  .bio-sequence { grid-template-columns:1fr 1fr; gap:10px; padding:12px; }
  .bio-sequence .bio-sequence-position { grid-column:1/-1; grid-row:1; text-align:center; }
  .bio-sequence .bio-sequence-link { min-width:0; min-height:82px; padding:10px; }
  .bio-sequence .bio-sequence-link strong { font-size:.93rem; overflow-wrap:anywhere; }
}
@media(prefers-reduced-motion:reduce) { .bio-sequence .bio-sequence-link { transition:none; } }