/* Reference layout; retain the existing white modal and blurred backdrop. */
#info{position:fixed;inset:0;width:min(800px,calc(100vw - 64px));max-width:none;height:fit-content;max-height:calc(100svh - 64px);margin:auto;padding:42px 40px;border:1px solid #e0e3e8;border-radius:12px;overflow:auto;overscroll-behavior:contain;background:#fff;color:#111;box-shadow:0 16px 70px #00000014}
#info::backdrop{background:rgba(255,255,255,.42);backdrop-filter:blur(5px)}
#info[open]{animation:info-appear 220ms ease both}
.info-top{position:absolute;right:20px;top:16px}
#info-close{font-size:25px;font-weight:400;line-height:1;width:32px;height:32px;padding:0;color:#6a6a6a}
.info-layout{display:grid;grid-template-columns:minmax(0,1.85fr) minmax(0,1fr);column-gap:38px;row-gap:22px;align-items:start}
.info-copy{display:contents}
#info #info-heading.info-lead{grid-column:1;grid-row:1;font-size:20px;font-weight:400;line-height:1.25;letter-spacing:-.35px;color:#111;margin:0}
.info-body{grid-column:1;grid-row:2;min-width:0}
#info .info-body p,#info .info-contact p{font-size:16px;line-height:1.4;letter-spacing:-.15px;margin:0 0 20px}
#info .info-body p:last-child{margin-bottom:0}
.info-portrait{grid-column:2;grid-row:2;display:block;width:100%;height:auto;border-radius:8px}
#info .info-contact{grid-column:1/-1;grid-row:3;margin:6px 0 0}
#info .info-contact p{font-size:16px;line-height:1.5;margin:0 0 20px}
#info .info-contact p:last-child{margin-bottom:0}
.info-contact a{color:inherit;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
.info-contact a[aria-disabled=true]{cursor:default;text-decoration-style:dotted}
#info button:hover{color:#000}
@keyframes info-appear{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:700px){#info{width:calc(100vw - 32px);max-height:calc(100svh - 40px);padding:54px 26px 30px}.info-layout{grid-template-columns:minmax(0,1fr);gap:24px}#info #info-heading.info-lead{grid-column:1;grid-row:1;font-size:20px}.info-body{grid-column:1;grid-row:2}#info .info-body p{font-size:16px;line-height:1.45;margin-bottom:22px}.info-portrait{grid-column:1;grid-row:3;width:min(100%,240px);justify-self:center}#info .info-contact{grid-column:1;grid-row:4;margin:0}}
@media(prefers-reduced-motion:reduce){#info[open]{animation:none}}

#info .info-body p{color:#666}

/* Let the biography determine the shared row height, not the photo. */
.info-portrait-frame{grid-column:2;grid-row:2;position:relative;align-self:stretch;min-height:0;overflow:hidden;border-radius:8px}
.info-portrait-frame .info-portrait{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%;border-radius:0}
@media(max-width:700px){.info-portrait-frame{grid-column:1;grid-row:3;width:min(100%,240px);justify-self:center}.info-portrait-frame .info-portrait{position:static;height:auto}}

#info .info-keyword{position:relative;display:inline;padding:0;color:inherit;font:inherit;letter-spacing:inherit;white-space:nowrap;background:transparent}
.info-keyword::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform 240ms ease}
.info-keyword:hover::after,.info-keyword:focus-visible::after{transform:scaleX(1)}
.info-portrait-frame .info-photo-swap{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;opacity:0;transition:opacity 240ms ease;pointer-events:none}
.info-portrait-frame .info-photo-swap.is-active{opacity:1}
@media(prefers-reduced-motion:reduce){.info-keyword::after,.info-portrait-frame .info-photo-swap{transition:none}}

#info .info-keyword{color:#000}
[data-theme="dark"] #info .info-keyword{color:#f2f2f2}
