.bio-main { max-width: var(--max-width); margin: 0 auto; padding: 2.5rem 1rem 4rem; }
.bio-intro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, .95fr); gap: clamp(2rem, 6vw, 5rem); align-items: center; }
.bio-heading h1 { margin: 0 0 .8rem; color: var(--primary-dark); font-size: clamp(2.6rem, 6vw, 4.8rem); line-height: 1.04; }
.bio-lede { max-width: 52ch; margin: 0; color: var(--muted-color); font-size: clamp(1.15rem, 2vw, 1.4rem); }
.bio-photo { margin: 0; overflow: hidden; border: 1px solid var(--border-color); border-radius: 1.25rem; background: #fff; box-shadow: var(--shadow); }
.bio-photo img { width: 100%; height: auto; }
.bio-photo figcaption { padding: .7rem 1rem; color: var(--muted-color); font-size: .88rem; }
.bio-layout { display: grid; grid-template-columns: minmax(0, 720px) minmax(220px, 1fr); gap: clamp(2rem, 6vw, 5rem); align-items: start; margin-top: 4rem; }
.bio-story section + section { margin-top: 2.5rem; }
.bio-story h2 { margin: 0 0 .75rem; color: var(--primary-dark); font-size: clamp(1.45rem, 3vw, 1.85rem); line-height: 1.25; }
.bio-story p { margin: 0 0 1rem; }
.bio-aside { position: sticky; top: 1.5rem; padding: 1.35rem; border: 1px solid var(--border-color); border-radius: 1rem; background: var(--secondary-color); }
.bio-aside h2 { margin: 0 0 .5rem; color: var(--primary-dark); font-size: 1.2rem; }
.bio-aside p { margin: 0 0 1rem; color: var(--muted-color); }
.profile-links { display: flex; flex-direction: column; align-items: stretch; gap: .65rem; }
.profile-links a { padding: .65rem .8rem; border: 1px solid var(--border-color); border-radius: 999px; background: #fff; text-align: center; text-decoration: none; font-weight: 700; }
.bio-quote { margin: 4rem 0 0; padding: clamp(2rem, 6vw, 4rem); border-radius: 1.25rem; background: var(--primary-color); color: #fff; text-align: center; box-shadow: var(--shadow); }
.bio-quote p { margin: 0; font-size: clamp(1.6rem, 4vw, 2.7rem); font-style: italic; line-height: 1.3; }
.bio-quote cite { display: block; margin-top: .85rem; color: rgba(255, 255, 255, .78); font-size: .85rem; font-style: normal; letter-spacing: .12em; text-transform: uppercase; }
.bio-next { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 2rem; padding: 1.25rem 0 0; }
.bio-next p { margin: 0; color: var(--muted-color); }

@media (max-width: 768px) {
  .bio-main { padding-top: 1.25rem; }
  .bio-intro, .bio-layout { grid-template-columns: 1fr; }
  .bio-photo { order: -1; }
  .bio-layout { margin-top: 3rem; }
  .bio-aside { position: static; }
}