/* The bio is a dedicated route, not a section revealed by scrolling. */
html[data-portfolio-page="home"] #about { display:none!important; }
html[data-portfolio-page="about"] #top,
html[data-portfolio-page="about"] #work { display:none!important; }
html[data-portfolio-page="about"] header:has(.liquid-toolbar) { display:block!important; }
html[data-portfolio-page="about"] #about {
  display:block!important; position:relative!important;
  width:min(1216px,calc(100% - 48px))!important;
  height:auto!important; min-height:calc(100svh - 120px);
  max-width:1216px!important; margin:0 auto!important;
  padding:130px 0 48px!important; overflow:visible!important;
}
html[data-portfolio-page="about"] #about > .bio-editorial {
  position:relative!important; inset:auto!important; height:auto!important;
  min-height:0!important; width:100%!important;
  padding:clamp(28px,5vw,64px)!important;
  border-radius:32px!important; clip-path:none!important;
  transform:none!important; opacity:1!important;
}
html[data-portfolio-page="about"] #about .bio-statement {
  max-height:none!important; overflow:visible!important;
  transform:none!important; opacity:1!important;
}
html[data-portfolio-page] footer {
  margin-top:0!important; background:transparent!important;
  border:0!important; box-shadow:none!important;
}
html[data-portfolio-page="about"] .nav-profile-avatar { outline:2px solid currentColor!important; outline-offset:4px; }
@media(max-width:640px){html[data-portfolio-page="about"] #about{width:calc(100% - 32px)!important;padding-top:110px!important;}}
html[data-portfolio-page="about"] #about{
  display:grid!important;place-items:center;width:100%!important;max-width:none!important;
  min-height:92svh;padding:clamp(110px,18vh,190px) 0 80px!important;
}
html[data-portfolio-page="about"] #about > .bio-editorial{
  width:min(1120px,calc(100% - 108px))!important;padding:0!important;
  background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important;
}
html[data-portfolio-page="about"] #about > .bio-editorial::before,
html[data-portfolio-page="about"] #about > .bio-editorial::after{display:none!important;}
html[data-portfolio-page="about"] #about .bio-statement{
  width:100%!important;max-width:none!important;margin:0!important;text-align:center!important;
  font-size:clamp(26px,3.2vw,46px)!important;line-height:1.4!important;
}
html[data-portfolio-page="about"] #about > .about-heading{position:absolute!important;top:max(98px,14%)!important;left:50%!important;translate:-50% 0;width:min(1240px,calc(100% - 64px))!important;background:transparent!important;}
@media(max-width:640px){html[data-portfolio-page="about"] #about > .bio-editorial{width:calc(100% - 40px)!important;}html[data-portfolio-page="about"] #about{padding-top:160px!important;}}
/* Use the same viewport anchor and typography for all focused-page titles. */
html [data-mode="desk"] > .pocket-heading,
html[data-portfolio-page="about"] #about > .about-heading{
  position:absolute!important;top:max(98px,12.88svh)!important;
  left:50%!important;translate:-50% 0;
  width:min(1240px,calc(100% - 64px))!important;margin:0!important;padding:0!important;
}
html [data-mode="desk"] > .pocket-heading h2,
html[data-portfolio-page="about"] #about > .about-heading h2{
  margin:0!important;padding:0!important;font-size:clamp(20px,2.4vw,32px)!important;
  line-height:1!important;font-weight:500!important;color:#eee!important;
}
@media(max-width:640px){
  html [data-mode="desk"] > .pocket-heading,
  html[data-portfolio-page="about"] #about > .about-heading{
    top:86px!important;width:calc(100% - 40px)!important;
  }
}