.career-portrait .career-video,
.career-portrait .career-video-poster {
  position: absolute;
  width: 30vw;
  height: auto;
  max-width: none;
  top: 50%;
  left: 7.5vw;
  transform: translateY(-50%);
  pointer-events: none;
  background: transparent;
}
.career-video { opacity: 0; }
.career-job-timeline { position: absolute; left: 0; top: 24px; width: 13vw; z-index: 2; display: flex; flex-direction: column; justify-content: space-between; padding-left: 18px; font-family: var(--font-sans); }
.career-job-timeline::before { content: ''; position: absolute; top: 0; bottom: 0; left: 3px; width: 1px; background: currentColor; transform: scaleY(var(--job-progress, 1)); transform-origin: top; }
.career-job-timeline li { position: relative; }
.career-job-timeline li::before { content: ''; position: absolute; left: -18px; top: 6px; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.career-job-timeline time { display: block; font-size: clamp(9px,.7vw,13px); opacity: .75; margin-bottom: 6px; }
.career-job-timeline strong { display: block; font-size: clamp(12px,1.15vw,22px); font-weight: 400; }
.career-job-timeline small { display: block; font-size: clamp(8px,.6vw,12px); margin-top: 4px; letter-spacing: .04em; }
.career-job-timeline [aria-current] strong { font-weight: 700; }
.career-portrait.is-video-ready .career-video { opacity: 1; }
.career-portrait.is-video-ready .career-video-poster { visibility: hidden; }
.career { height: auto; overflow: visible; }
.career-stage { background: #919071; }
.career-stage .career-inner { min-height: max(41.55vw, calc(100svh - 80px)); height: auto; }
.career-panels { min-width: 0; padding-bottom: 3vw; }
.career-panels .career-copy h2 { white-space: normal; line-height: 1.35; }
.career-panels .career-copy header { align-items: flex-start; }
.career-panels .career-role { display: block; font: inherit; font-size: .8em; opacity: .8; margin-top: .3em; }
.career-panels .career-copy { padding-bottom: 1vw; }
.career-panels .career-details { line-height: 1.65; }
.career-panels .career-footer { gap: 2vw; margin-top: 2.5vw; }
.career-panels .career-labels { gap: 1.3vw; }
.career-panels .career-labels li { white-space: nowrap; }
.career-portrait { min-height: 41.55vw; }
.is-scroll-career { height: calc(var(--career-stage-height, 50vw) + 360svh); }
.is-scroll-career .career-stage { position: sticky; top: var(--career-top, 80px); overflow: hidden; }
.is-scroll-career .career-panels { display: grid; }
.is-scroll-career .career-copy { grid-area: 1 / 1; visibility: hidden; opacity: 0; pointer-events: none; }
.is-scroll-career .career-copy.is-active { visibility: visible; opacity: 1; pointer-events: auto; }
.is-scroll-career .career-stage .career-inner { height: var(--career-stage-height); min-height: 0; align-items: center; }
.is-scroll-career .career-portrait { height: 100%; min-height: 0; }
.is-scroll-career .career-panels { container-type: inline-size; padding-block: 0; align-self: start; }
.is-scroll-career .career-copy {
  padding-block: 0; align-self: stretch; min-height: 0;
  display: grid;
  grid-template-rows: auto auto minmax(min-content, 1fr) var(--career-footer-height, auto);
}
.career-panels .career-footer { display: flex; flex-direction: column; justify-content: space-between; gap: 1.4vw; margin-top: 0; padding-top: 2vw; min-height: 16vw; }
.career-panels .career-footer > div { order: 0; }
.career-panels .career-labels { order: 1; display: flex; width: 100%; gap: 1.5vw; }
.career-panels .career-labels li { writing-mode: horizontal-tb; text-align: center; flex: 1; padding: .65vw .6vw; height: auto; font-size: 1.05vw; }
.career-panels .career-quote { margin-top: .5vw; font-size: .95vw; }
.career-panels .career-details { align-self: start; }
.career-copy header, .career-copy .career-date, .career-copy .career-details,
.career-copy .career-footer > div, .career-copy .career-labels { will-change: opacity, transform; }
.is-scroll-career .career-video, .is-scroll-career .career-video-poster { max-height: calc(100% - 32px); object-fit: contain; }
/* Match the supplied 490px-wide text block proportionally, without shrinking
   the type while allowing its containing column to grow. */
@media (min-width: 761px) {
  .career-panels .career-copy header { gap: 4cqw; }
  .career-panels .career-copy header > span { font-size: 16cqw; line-height: .9; border-right: 1px solid currentColor; padding-right: 3cqw; }
  .career-panels .career-copy h2 { font-size: 5.2cqw; line-height: 1.2; }
  .career-panels .career-copy header p { font-size: 4.3cqw; line-height: 1.45; }
  .career-panels .career-date { font-size: 5.2cqw; margin-top: 4.5cqw; }
  .career-panels .career-details { font-size: 3.65cqw; line-height: 1.7; margin-top: 5.5cqw; padding-left: 0; list-style-position: inside; }
  .career-panels .career-copy:nth-child(2) .career-details,
  .career-panels .career-copy:nth-child(3) .career-details { font-size: 3.1cqw; }
  .career-panels .career-footer { min-height: 27cqw; padding-top: 2cqw; gap: 4cqw; }
  .career-panels .career-footer > div > p:first-child { font-size: 3.65cqw; line-height: 1.5; }
  .career-panels .career-quote { font-size: 2.7cqw; line-height: 1.6; margin-top: 1cqw }
  .career-panels .career-labels { gap: 5.5%; }
  .career-panels .career-labels li { flex: 0 0 23%; font-size: 3cqw; padding: 1.7cqw .5cqw; border-width: 1px; }
}
@media (max-width: 760px) {
  .career-job-timeline { width: 112px; padding-left: 12px; }
  .career-job-timeline li::before { left: -12px; width: 5px; height: 5px; }
  .career-job-timeline time { font-size: 7px; margin-bottom: 1px; }
  .career-job-timeline strong { font-size: 10px; }
  .career-job-timeline small { font-size: 6px; margin-top: 1px; }
  .career-stage .career-portrait .career-video, .career-stage .career-portrait .career-video-poster { left: calc(60% - 90px); }
  .career-portrait .career-video,
  .career-portrait .career-video-poster { width: 400px; left: calc(50% - 200px); }
  .career-stage .career-inner { grid-template-columns: 1fr; }
  .is-scroll-career .career-stage .career-inner { grid-template-rows: 140px minmax(0, 1fr); padding-bottom: 20px; }
  .career-stage .career-portrait { order: 0; height: 140px; min-height: 0; margin: 0; }
  .career-stage .career-video, .career-stage .career-video-poster { width: 180px; left: calc(50% - 90px); }
  .career-panels { padding-bottom: 24px; }
  .career-panels .career-copy { padding-top: 16px; }
  .career-panels .career-details { font-size: 13px; margin-top: 16px; }
  .career-panels .career-footer { gap: 18px; margin-top: 0; padding-top: 22px; min-height: 170px; }
  .career-panels .career-labels { gap: 8px; }
  .career-panels .career-labels li { height: auto; font-size: 13px; padding: 10px 6px; }
  .career-panels .career-quote { margin-top: 14px; }
}
/* Two equally sized stages within the viewport below the fixed navigation. */
.career-stage .container.career-inner{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:repeat(2,minmax(0,1fr));width:calc(100% - 12vw);height:var(--career-stage-height,calc(100svh - 80px));min-height:0;gap:0;padding:0;align-items:stretch}
.is-scroll-career .career-stage .career-inner{grid-template-rows:repeat(2,minmax(0,1fr));align-items:stretch;padding:0}
.career-stage .career-portrait{order:0;position:relative;width:100%;height:100%;min-height:0;margin:0;overflow:hidden}
.career-stage .career-portrait .career-video,.career-stage .career-portrait .career-video-poster{height:calc(100% - 16px);width:auto;max-width:52%;max-height:none;left:55%;top:50%;transform:translateY(-50%);object-fit:contain}
.career-stage .career-job-timeline{left:14%;top:16px;width:38%;height:calc(100% - 32px);padding-left:22px;justify-content:space-between}
.career-stage .career-job-timeline time{font-size:clamp(11px,1vw,16px);margin-bottom:4px}
.career-stage .career-job-timeline strong{font-size:clamp(18px,1.6vw,28px);line-height:1.2}
.career-stage .career-job-timeline small{font-size:clamp(9px,.75vw,13px);margin-top:3px}
.career-stage .career-job-timeline li::before{left:-22px;top:7px;width:8px;height:8px}
.career-stage .career-panels{order:1;width:100%;max-width:1120px;height:100%;min-height:0;align-self:stretch;justify-self:center;padding:18px 20px;overflow-y:auto;overscroll-behavior:contain;border-top:1px solid #e1e0ce55;scrollbar-gutter:stable;container-type:inline-size}
.career-stage .career-panels .career-copy{padding:0;grid-template-rows:auto auto auto auto;align-content:start;gap:10px}
.career-stage .career-panels .career-copy header{gap:20px}
.career-stage .career-panels .career-copy header>span{font-size:clamp(38px,4vw,60px);padding-right:18px;line-height:1}
.career-stage .career-panels .career-copy h2{font-size:clamp(20px,1.8vw,30px);line-height:1.3}
.career-stage .career-panels .career-copy header p{font-size:clamp(14px,1.2vw,20px);line-height:1.5}
.career-stage .career-panels .career-date{font-size:clamp(16px,1.3vw,22px);margin:0}
.career-stage .career-panels .career-details{font-size:clamp(13px,1vw,17px);line-height:1.65;margin:0;padding-left:0;list-style-position:inside}
.career-stage .career-panels .career-footer{min-height:0;padding-top:4px;gap:10px;margin:0}
.career-stage .career-panels .career-footer>div>p:first-child{font-size:clamp(13px,1vw,17px);line-height:1.5}
.career-stage .career-panels .career-quote{font-size:clamp(10px,.8vw,13px);line-height:1.5;margin-top:3px}
.career-stage .career-panels .career-labels{gap:12px}
.career-stage .career-panels .career-labels li{flex:0 1 auto;min-width:110px;font-size:clamp(12px,1vw,16px);padding:7px 14px;border-width:1px}
@media(max-width:760px){.career-stage .container.career-inner{width:92%}.career-stage .career-job-timeline{left:3%;width:48%;padding-left:14px}.career-stage .career-job-timeline li::before{left:-14px;width:6px;height:6px}.career-stage .career-portrait .career-video,.career-stage .career-portrait .career-video-poster{left:53%;max-width:47%}.career-stage .career-panels{padding:14px 4px}.career-stage .career-panels .career-copy header{gap:12px}.career-stage .career-panels .career-copy header>span{padding-right:10px}.career-stage .career-panels .career-labels{gap:8px;flex-wrap:wrap}.career-stage .career-panels .career-labels li{min-width:0;padding:6px 10px}}
/* Match visible head/feet rather than the transparent video canvas. */
.career-stage .career-portrait .career-video,.career-stage .career-portrait .career-video-poster{width:var(--character-width);height:var(--character-height);max-width:none;max-height:none;top:var(--character-top);left:var(--character-left);transform:none;object-fit:fill}
.career-stage .career-panels{overscroll-behavior:auto}

/* Keep experience text anchored while the sticky scene advances. */
.is-scroll-career .career-stage .career-panels{overflow:hidden;scrollbar-gutter:auto;overflow-anchor:none}
.is-scroll-career .career-panels .career-copy{display:none}
.is-scroll-career .career-panels .career-copy.is-active{display:grid}

.career-stage .career-panels{touch-action:pan-y pinch-zoom}

/* Desktop keeps the original side-by-side career composition. */
@media (min-width:761px){
  .career-stage .container.career-inner,
  .is-scroll-career .career-stage .career-inner{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr);column-gap:4vw}
  .career-stage .career-job-timeline{left:3%;width:42%}
  .career-stage .career-panels{border-top:0;max-width:none;padding:0;height:var(--career-copy-height);margin-top:var(--career-copy-top);align-self:start;align-content:stretch}
  .career-stage .career-panels .career-copy{gap:clamp(14px,1.4vw,26px);grid-template-rows:auto auto minmax(min-content,1fr) auto;align-content:stretch}
  .career-stage .career-panels .career-copy header{gap:18px}
  .career-stage .career-panels .career-copy h2{font-size:clamp(20px,1.8vw,34px)}
  .career-stage .career-panels .career-details{font-size:clamp(13px,1.05vw,19px)}
}

/* Anchor desktop copy to the visible character bounds, with flexible space above the footer. */
@media (min-width: 761px) {
 .is-scroll-career .career-stage .career-panels{display:block;padding:0;align-self:start}
 .is-scroll-career .career-stage .career-panels .career-copy.is-active{display:flex;flex-direction:column;justify-content:flex-start;box-sizing:border-box;padding:0;margin:0}
 .is-scroll-career .career-stage .career-panels .career-copy>*{flex-shrink:0}
 .is-scroll-career .career-stage .career-panels .career-copy .career-footer{margin-top:auto;padding-top:0}
}
