/* A complete portrait beside an independently scrolling biography. */
#experiencia{--biography-height:clamp(340px,calc(100svh - 230px),780px);scroll-margin-top:0}
#experiencia .experience-layout{align-items:center;gap:clamp(32px,5vw,90px)}
#experiencia .experience-lead{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;margin:0}
#experiencia .portrait-frame{width:min(100%,calc((var(--biography-height) - 44px)*941/1672));flex:none;border-radius:10px}
#experiencia .portrait-caption{width:min(100%,calc((var(--biography-height) - 44px)*941/1672));padding:10px 0;gap:10px;font-size:7px;letter-spacing:.5px}
#experiencia .portrait-caption>span:last-child{text-align:right}
#experiencia .portrait-frame figcaption{left:18px;right:18px;bottom:18px}
#experiencia .portrait-frame figcaption strong{font-size:32px}
#experiencia .portrait-frame figcaption span{font-size:7px}
#experiencia .biography-panel{height:var(--biography-height);min-width:0;display:flex;flex-direction:column;border-block:1px solid #d4d9cc38}
#experiencia .biography-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:15px 0;flex:none;font:9px/1.5 ui-monospace,monospace;letter-spacing:1.2px;color:#c3c5bb}
#experiencia .biography-scroll-hint{font-size:11px;line-height:1.5;letter-spacing:0;color:#b1b6aa}
#experiencia .biography{min-height:0;overflow-y:auto;overscroll-behavior-y:contain;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:#9c9e8d #ffffff08;padding:4px 22px 26px 0;scroll-padding-block:16px}
#experiencia .biography:focus-visible{outline:1px solid #dad7c4;outline-offset:5px}
#experiencia .biography h2{font-size:clamp(28px,2.6vw,44px);line-height:1.16;font-weight:400;letter-spacing:-.04em;margin:0 0 28px;color:#eeece6}
#experiencia .biography h2 em{color:#cbd0c3}
#experiencia .biography>p.bio-lead{font-size:clamp(19px,1.45vw,25px);line-height:1.55}
#experiencia .biography>p{font-size:14px;line-height:1.95}
#experiencia .biography>.pill{display:inline-flex;margin-top:28px;background:#deded5;color:#181b17;border-color:#f1f1e9}
#experiencia .biography>.pill:hover{background:#f1f1e9}
@media(max-width:760px){
  #experiencia .experience-layout{display:block}
  #experiencia .experience-lead{margin-bottom:36px}
  #experiencia .portrait-frame,#experiencia .portrait-caption{width:min(100%,300px)}
  #experiencia .biography-panel{height:auto}
  #experiencia .biography{overflow:visible;scrollbar-gutter:auto;padding-right:0}
  #experiencia .biography-scroll-hint{display:none}
  #experiencia .biography h2{font-size:30px}
  #experiencia .biography>p{font-size:13px}
}
@media print{
  #experiencia .biography-panel{height:auto;display:block}
  #experiencia .biography{overflow:visible}
  #experiencia .biography-scroll-hint{display:none}
}
@media(forced-colors:active){
  #experiencia .biography-panel{border-color:CanvasText}
  #experiencia .biography-panel-heading,#experiencia .biography h2,#experiencia .biography h2 em{color:CanvasText}
}