/* Work history: a visible company index beside a focused role detail. */
.career-heading { display: grid; grid-template-columns: 1fr auto; gap: 16px 24px; align-items: end; margin-bottom: 32px; }
.career-heading>.eyebrow { grid-column: 1/-1; display: flex; justify-content: space-between; gap: 20px; color: var(--muted); font: 14px var(--body); letter-spacing: .05em; }
.career-heading>.eyebrow span { font: 14px var(--mono); letter-spacing: 0; }
.career-heading h2 { font-size: clamp(36px,5vw,66px); letter-spacing: -.045em; line-height: 1.05; }
.experience-links { display: flex; align-items: center; gap: 22px; font-size: 14px; padding-bottom: 5px; }
.experience-links a,.experience-links button { display: inline-flex; align-items: center; gap: 10px; min-height: 34px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.experience-links button { color: var(--dark); border-color: var(--dark); }
.experience-links a { color: var(--muted); }
.experience-links a:hover,.experience-links button:hover { color: var(--accent); border-color: var(--accent); }
.enhanced.career-explorer { display: grid; grid-template-columns: 245px minmax(0,1fr); gap: 38px; align-items: start; }
.career-index { display: none; }
.enhanced .career-index { display: block; position: sticky; top: 24px; }
.career-guide { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 0 2px 15px; color: var(--muted); font: 14px var(--body); letter-spacing: .06em; }
.career-guide>span { font: 14px var(--mono); color: var(--dark); letter-spacing: 0; }
.career-rail { display: grid; gap: 4px; }
.career-tab { position: relative; display: flex; gap: 13px; align-items: center; text-align: left; width: 100%; min-width: 0; min-height: 82px; padding: 16px 14px; border: 1px solid transparent; border-bottom-color: var(--line); border-radius: 3px; transition: background .2s, border-color .2s; }
.career-tab-number { align-self: flex-start; padding-top: 4px; font: 14px/1.2 var(--mono); color: var(--muted); }
.career-tab-copy { display: flex; flex: 1; min-width: 0; flex-direction: column; gap: 7px; }
.career-tab-name { font: 500 17px/1.2 var(--display); letter-spacing: -.025em; }
.career-tab-years { font: 14px/1.2 var(--body); color: var(--muted); }
.career-tab-arrow { width: 18px; height: 18px; flex: 0 0 18px; fill: none; stroke: currentColor; stroke-width: 1.5; opacity: 0; transform: translateX(-4px); transition: transform .2s, opacity .2s; }
.career-tab[aria-selected=true] { background: var(--surface); border-color: var(--line); color: var(--dark); box-shadow: inset 3px 0 0 var(--action); }
.career-tab[aria-selected=true] .career-tab-number { color: var(--accent); }
.career-tab[aria-selected=true] .career-tab-arrow { opacity: 1; transform: translateX(0); }
.career-tab:hover:not([aria-selected=true]) { background: var(--surface-raised); }
.career-tab:focus-visible { outline-offset: 3px; z-index: 1; }
.career-panels { min-width: 0; }
.career-panel { padding: 30px 34px; margin-bottom: 26px; border: 1px solid var(--line); border-top: 3px solid var(--action); border-radius: 3px; background: var(--surface); scroll-margin-top: 24px; }
.career-panel[hidden] { display: none; }
.enhanced .career-panel { margin-bottom: 0; }
.career-identity { display: grid; grid-template-columns: minmax(0,1fr) 190px; gap: 17px 24px; padding-bottom: 25px; margin-bottom: 26px; border-bottom: 1px solid var(--line); }
.identity-top { display: flex; align-items: center; gap: 15px; grid-column: 1/-1; font: 14px var(--body); color: var(--muted); }
.identity-top>span:first-child { display: none; }
/* Recording-light treatment for the ongoing role; this is a status, not a button. */
.chapter-status { display: inline-flex; align-items: center; gap: 11px; padding: 9px 13px; border: 1px solid color-mix(in srgb,var(--accent) 30%,transparent); border-radius: 999px; background: color-mix(in srgb,var(--accent) 6%,var(--surface)); color: var(--ink); font: 600 14px/1 var(--body); letter-spacing: .08em; }
.chapter-status::before { content: ''; box-sizing: border-box; flex: 0 0 16px; width: 16px; height: 16px; border: 3px solid var(--surface); border-radius: 50%; outline: 1px solid var(--accent); background: var(--accent); animation: current-recording 2.6s ease-out infinite; }
@keyframes current-recording { 0%,100% { box-shadow: 0 0 0 0 color-mix(in srgb,var(--accent) 30%,transparent); } 65% { box-shadow: 0 0 0 6px transparent; } }
.motion-paused .chapter-status::before { animation-play-state: paused; }
@media (prefers-reduced-motion:reduce) { .chapter-status::before { animation: none; } }
.career-logo { grid-column: 2; grid-row: 2; width: 190px; max-width: 100%; height: 80px; display: flex; justify-content: flex-end; align-items: center; margin-top: 2px; }
.career-logo img { display: block; max-width: 100%; width: 100%; height: 100%; object-fit: contain; object-position: right center; }
.career-logo--mcap img,.career-logo--skyview img { filter: brightness(0) invert(1); }
.career-logo--watonomous img { max-width: 150px; }
.career-logo--dell img { max-width: 180px; }
.career-identity-copy { grid-column: 1; grid-row: 2; min-width: 0; }
.career-identity-copy h3 { font: 600 clamp(25px,2.5vw,35px)/1.1 var(--display); letter-spacing: -.035em; color: var(--ink); }
.career-identity-copy>p { font-size: 14px; margin-top: 8px; color: var(--dark); }
.career-identity-copy dl { display: flex; flex-wrap: wrap; gap: 13px 25px; margin: 20px 0 0; }
.career-identity-copy dt { font: 14px var(--body); color: var(--muted); margin-bottom: 4px; }
.career-identity-copy dd { margin: 0; font-size: 14px; color: var(--ink); }
.career-story { min-width: 0; }
.career-story>.eyebrow { font: 14px var(--body); letter-spacing: .03em; color: var(--muted); margin-bottom: 12px; }
.career-story h4 { font: 500 clamp(26px,2.6vw,35px)/1.15 var(--display); letter-spacing: -.03em; margin-bottom: 17px; }
.career-story>p:not(.eyebrow) { font-size: 14px; color: var(--muted); line-height: 1.8; }
.career-contributions { padding: 0; list-style: none; display: grid; gap: 16px; font-size: 14px; line-height: 1.8; color: var(--muted); margin: 22px 0 0; }
.career-contributions strong { color: var(--ink); font-weight: 600; }
.career-contributions li { position: relative; padding-left: 18px; }
.career-contributions li:before { content: '↳'; position: absolute; left: 0; color: var(--accent); }
.career-progression { display: grid; grid-template-columns: 1fr 1.25fr 1.4fr; gap: 18px; border-top: 1px solid var(--line); margin-top: 25px; padding-top: 18px; }
.career-progression>span { font-size: 14px; line-height: 1.6; }
.career-progression b { display: block; font: 14px var(--mono); color: var(--accent); margin-bottom: 9px; }
.career-progression small { display: block; font: 14px/1.6 var(--body); color: var(--muted); margin-top: 5px; }
.career-tools { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 20px; border-top: 1px solid var(--line); margin-top: 25px; padding-top: 20px; }
.career-tools>.mono { font: 14px var(--body); color: var(--muted); }
.career-tools .tags span { font-size: 14px; }
.career-impact { display: flex; gap: 22px; align-items: center; border-top: 1px solid var(--line); padding-top: 20px; margin-top: 25px; }
.career-impact>strong { font: 500 46px var(--display); color: var(--dark); letter-spacing: -.05em; }
.career-impact>strong>span { font-size: 25px; }
.career-impact>p { font-size: 14px; color: var(--muted); line-height: 1.7; }
.career-context,.career-signal-note { border-top: 1px solid var(--line); padding-top: 20px; margin-top: 25px; }
.career-context>.mono,.career-signal-note>.mono { font: 14px var(--body); color: var(--muted); }
.career-context dl { margin: 12px 0 0; }
.career-context dl>div { display: flex; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line); padding: 9px 0; font-size: 14px; }
.career-context dt { color: var(--muted); }
.career-context dd { margin: 0; text-align: right; }
.career-signal-note>p { font: 500 22px var(--display); margin-top: 13px; }
.career-signal-note>p>span { color: var(--accent); margin: 0 7px; }
@media (max-width:1100px) {
  .career-heading { grid-template-columns: 1fr; gap: 18px; }
  .experience-links { padding-bottom: 0; }
  .enhanced.career-explorer { grid-template-columns: 215px minmax(0,1fr); gap: 24px; }
  .career-panel { padding: 25px; }
  .career-identity { grid-template-columns: minmax(0,1fr) 160px; gap: 17px; }
  .career-logo { width: 160px; }
}
@media (max-width:900px) {
  .career-heading { margin-bottom: 27px; }
  .enhanced.career-explorer { grid-template-columns: 1fr; gap: 24px; }
  .enhanced .career-index { position: static; }
  .career-guide { padding-bottom: 12px; }
  .career-rail { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
  .career-tab { border-color: var(--line); min-height: 76px; padding: 13px 14px; gap: 10px; }
  .career-tab:first-child { grid-column: 1/-1; min-height: 60px; }
  .career-tab:first-child .career-tab-copy { flex-direction: row; align-items: center; justify-content: space-between; gap: 15px; }
  .career-tab:first-child .career-tab-number { align-self: center; padding-top: 0; }
  .career-tab-name { font-size: 15px; }
  .career-tab-arrow { display: none; }
  .career-tab:first-child .career-tab-arrow { display: block; }
  .career-panel { padding: 25px; }
}
@media (max-width:500px) {
  .career-heading h2 { font-size: clamp(32px,8.6vw,42px); }
  .career-heading>.eyebrow { font-size: 14px; }
  .career-heading>.eyebrow span { font-size: 14px; }
  .experience-links { justify-content: space-between; gap: 14px; font-size: 14px; }
  .experience-links a,.experience-links button { gap: 12px; }
  .career-tab { padding: 12px 10px; gap: 9px; }
  .career-tab-name { font-size: 14px; }
  .career-tab-number { font-size: 14px; }
  .career-tab-years { font-size: 14px; }
  .career-panel { padding: 22px 18px; }
  .career-identity { grid-template-columns: minmax(0,1fr); gap: 16px; }
  .career-logo { grid-column: 1; grid-row: 2; width: 190px; height: 78px; justify-content: flex-start; margin: 0; }
  .career-logo img { object-position: left center; }
  .career-identity-copy { grid-row: 3; }
  .career-identity-copy h3 { font-size: 26px; }
  .career-identity-copy>p { font-size: 14px; }
  .career-identity-copy dl { flex-direction: column; gap: 12px; margin-top: 17px; }
  .career-story h4 { font-size: 27px; }
  .career-story>p:not(.eyebrow),.career-contributions { font-size: 14px; }
  .career-progression { gap: 12px; grid-template-columns: 1fr; }
  .career-progression>span { display: grid; grid-template-columns: 22px 1fr; gap: 0 10px; font-size: 14px; }
  .career-progression b { grid-row: 1/3; margin-top: 4px; }
  .career-progression small { margin: 0; grid-column: 2; font-size: 14px; }
  .career-impact { gap: 14px; }
  .career-impact>strong { font-size: 40px; }
  .career-impact>p { font-size: 14px; }
}
@media (prefers-reduced-motion:reduce) { .career-tab,.career-tab-arrow { transition: none; } }

/* Separate education and research, with a softer marginal-note treatment. */
.academic-layout { display: grid; grid-template-columns: 1fr 1.2fr; gap: 8%; padding-bottom: 105px; align-items: start; }
.academic-heading .eyebrow { margin-bottom: 25px; }
.academic-heading h2 { font-size: 55px; margin-bottom: 35px; }
.degree-record { padding: 25px 0 28px; border-top: 1px solid var(--line); }
.degree-meta { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; font-size: 14px; color: var(--muted); margin-bottom: 23px; }
.degree-status { color: var(--dark); }
.degree-brand { display: flex; align-items: center; width: fit-content; max-width: 100%; height: 86px; margin-bottom: 20px; }
.degree-brand img { display: block; object-fit: contain; max-width: 100%; }
.degree-brand--ubc { padding: 9px 0; height: 96px; }
.degree-brand--ubc img { width: 60px; height: 78px; }
.degree-brand--waterloo { height: 96px; padding: 9px 0; }
/* Fit the complete shield, including its outer edge. */
.degree-brand--waterloo img { width: 68px; height: 78px; object-fit: contain; object-position: left top; }
.degree-record h3 { font-size: 28px; margin-bottom: 17px; line-height: 1.15; }
.degree-name { font-size: 14px; line-height: 1.7; margin-bottom: 15px; }
.degree-detail { color: var(--muted); font-size: 14px; line-height: 1.9; }
.degree-award { color: var(--accent); font-size: 14px; line-height: 1.8; margin-top: 17px; }
.research-section { padding: 35px 36px 37px; background: var(--surface); border-radius: 0 70px 0 0; border-left: 3px solid var(--action); }
.research-section .academic-heading h2 { font-size: 48px; color: var(--dark); }
.research-meta { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; font-size: 14px; color: var(--muted); padding-top: 22px; border-top: 1px solid var(--line); }
.research-position { display: grid; grid-template-columns: 48px 1fr; gap: 20px; align-items: center; margin-top: 25px; }
.research-logo { display: block; width: 48px; height: 64px; object-fit: contain; }
.research-position h3 { font-size: 25px; }
.research-position p { font-size: 14px; color: var(--muted); margin-top: 9px; }
.research-subject { margin-top: 30px; border-top: 1px solid var(--line); padding-top: 25px; }
.research-subject>.mono { font-size: 14px; color: var(--muted); }
.research-subject h4 { font: italic 31px/1.1 var(--serif); color: var(--dark); margin: 18px 0; }
.research-subject>p { font-size: 14px; color: var(--muted); line-height: 1.85; }
.research-contributions { list-style: none; padding: 0; margin: 25px 0; display: grid; gap: 19px; }
.research-contributions li { display: grid; grid-template-columns: 20px 1fr; gap: 12px; }
.research-contributions .mono { font: italic 17px var(--serif); color: var(--accent); }
.research-contributions strong { font-size: 14px; font-weight: 600; }
.research-contributions p { font-size: 14px; color: var(--muted); line-height: 1.8; margin-top: 5px; }
.research-toolkit { border-top: 1px solid var(--line); padding-top: 20px; }
.research-toolkit span { font-size: 14px; background: var(--surface-raised); }
.research-actions { display: flex; flex-wrap: wrap; gap: 18px 23px; margin-top: 24px; }
.research-actions .inline-link { font-size: 14px; color: var(--dark); }

@media (max-width:1100px) {
  .academic-layout { gap: 5%; }
  .academic-heading h2 { font-size: 47px; }
  .research-section { padding: 30px; }
  .research-section .academic-heading h2 { font-size: 43px; }
  .degree-record h3 { font-size: 25px; }
}
@media (max-width:800px) {
  .academic-layout { grid-template-columns: 1fr; gap: 40px; padding-bottom: 75px; }
  .degree-record h3 { font-size: 29px; }
  .degree-record h3 br { display: none; }
  .research-section .academic-heading h2 { font-size: 49px; }
  .research-subject h4 { font-size: 35px; }
  .research-subject>p,.research-contributions p { font-size: 14px; }
  .research-contributions strong { font-size: 14px; }
}
@media (max-width:600px) {
  .academic-layout { gap: 30px; padding-bottom: 60px; }
  .academic-heading h2 { font-size: 43px; }
  .degree-record { padding: 23px 0 27px; }
  .degree-meta { font-size: 14px; }
  .degree-record h3 { font-size: 25px; }
  .degree-name { font-size: 14px; }
  .degree-detail { font-size: 14px; }
  .research-section { padding: 28px 24px; border-radius: 0 50px 0 0; }
  .research-section .academic-heading h2 { font-size: 40px; }
  .research-subject h4 { font-size: 30px; }
  .research-subject>p,.research-contributions p { font-size: 14px; }
  .research-contributions strong { font-size: 14px; }
  .research-contributions li { grid-template-columns: 17px 1fr; gap: 9px; }
  .research-actions .inline-link { font-size: 14px; }
}
@media (max-width:360px) {
  .research-position { gap: 14px; grid-template-columns: 40px 1fr; }
  .research-logo { width: 40px; height: 55px; }
  .research-position h3 { font-size: 22px; }
  .research-section { padding: 25px 19px; }
  .research-section .academic-heading h2 { font-size: 34px; }
  .research-subject h4 { font-size: 27px; }
}