:root { --ink:#3d4348; --muted:#68737c; --blue:#224b8d; --blue-dark:#173766; --line:#e5e8eb; --paper:#fff; --soft:#f5f7f9; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:82px; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:"Trebuchet MS","Segoe UI",Arial,sans-serif; font-size:15px; line-height:1.65; -webkit-font-smoothing:antialiased; }
a { color:var(--blue); text-decoration:none; transition:color 160ms ease; }
a:hover { color:var(--blue-dark); text-decoration:underline; }
.masthead { position:sticky; top:0; z-index:50; min-height:66px; background:rgba(255,255,255,.96); border-bottom:1px solid var(--line); backdrop-filter:blur(12px); }
.masthead__inner { width:min(1180px,calc(100% - 40px)); min-height:66px; margin:0 auto; display:flex; align-items:center; gap:32px; }
.site-name { display:none; color:#20262b; font-weight:700; }
.nav-links { display:flex; align-items:stretch; gap:6px; }
.nav-links a { position:relative; display:flex; align-items:center; min-height:66px; padding:0 15px; color:#5d666e; font-size:13px; font-weight:600; white-space:nowrap; }
.nav-links a::after { content:""; position:absolute; right:15px; bottom:0; left:15px; height:2px; background:var(--blue); transform:scaleX(0); transform-origin:left; transition:transform 160ms ease; }
.nav-links a:hover { color:var(--blue); text-decoration:none; }
.nav-links a:hover::after,.nav-links a:focus-visible::after { transform:scaleX(1); }
.page-shell { width:min(1180px,calc(100% - 40px)); margin:0 auto; padding:44px 0 64px; display:grid; grid-template-columns:220px minmax(0,1fr); gap:62px; }
.profile { position:sticky; top:104px; align-self:start; }
.profile__avatar { display:block; width:184px; height:184px; object-fit:cover; border-radius:50%; border:1px solid #dce0e3; padding:5px; background:#fff; }
.profile h1 { margin:14px 0 2px; color:#343a3f; font-size:24px; line-height:1.2; }
.profile__title,.profile__bio { margin:7px 0 0; font-size:13px; line-height:1.55; }
.profile__title { color:#505860; font-weight:600; }
.profile__bio { margin-top:16px; color:var(--muted); }
.profile__links { margin:18px 0 0; padding:14px 0 0; list-style:none; border-top:1px solid var(--line); }
.profile__links li { display:grid; grid-template-columns:20px 1fr; align-items:center; gap:7px; margin:7px 0; color:#525b63; font-size:13px; }
.profile__links span { color:#29343c; font-size:11px; font-weight:700; text-align:center; }
.profile__links a { color:inherit; }
.profile blockquote { margin:23px 0 0; padding:12px 0 0 14px; color:#747d85; border-left:2px solid #dce2e7; font-family:Georgia,serif; font-size:12px; font-style:italic; line-height:1.55; }
.content { min-width:0; max-width:880px; }
.section-anchor { scroll-margin-top:84px; }
.intro { padding-bottom:2px; }
.intro p { margin:0 0 13px; color:#4c555c; font-size:15px; line-height:1.76; }
.content section + section { margin-top:28px; }
h2 { margin:0 0 14px; padding-bottom:7px; color:#333a40; border-bottom:1px solid var(--line); font-size:21px; line-height:1.35; }
h2 span { margin-right:6px; font-size:17px; }
.news-list { margin:0; padding:0 0 0 20px; }
.news-list li { margin:7px 0; padding-left:4px; }
.news-list time { display:inline-block; min-width:78px; color:#575f66; font-family:Georgia,serif; font-style:italic; font-weight:700; }
.projects { display:grid; gap:17px; }
.project { display:grid; grid-template-columns:220px minmax(0,1fr); gap:22px; padding:16px; border:1px solid #e3e7ea; background:#fff; transition:box-shadow 160ms ease,transform 160ms ease; }
.project:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(31,53,70,.08); }
.project__visual { display:block; width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; border:1px solid #e6eaed; background:#f7f9fa; }
.project__eyebrow { margin:0 0 1px!important; color:#7b858d; font-size:10px!important; font-weight:700; letter-spacing:.11em; text-transform:uppercase; }
.project h3 { margin:0 0 7px; font-size:17px; line-height:1.35; }
.project__body > p { margin:0 0 10px; color:#59636b; font-size:13px; line-height:1.62; }
.project__meta { display:flex; align-items:center; justify-content:space-between; gap:14px; padding-top:6px; border-top:1px solid #edf0f2; color:#59636b; font-size:11px; }
.project__meta span { display:flex; gap:12px; }
.education-list { display:grid; }
.timeline-card { display:grid; grid-template-columns:122px 1fr; gap:24px; align-items:center; padding:14px 0; }
.timeline-card + .timeline-card { border-top:1px solid var(--line); }
.timeline-card__mark { display:grid; place-items:center; min-height:82px; color:var(--blue); border:1px solid #d8e0e8; background:var(--soft); font-family:Georgia,serif; font-size:19px; font-weight:700; }
.timeline-card__mark--logo { height:104px; padding:9px; background:#fff; }
.timeline-card__mark--logo img { display:block; width:84px; height:84px; object-fit:contain; }
.timeline-card__mark--qmul { background:#073b8f; border-color:#073b8f; }
.timeline-card h3,.experience-grid h3 { margin:0 0 4px; color:#3c444a; font-size:15px; }
.timeline-card p,.experience-grid p { margin:2px 0; color:#59636b; font-size:13px; }
.timeline-card .muted { color:#7a848c; }
.experience-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.experience-grid > div { min-height:142px; padding:18px; background:#fff; }
footer { margin-top:44px; padding-top:18px; display:flex; justify-content:space-between; gap:20px; color:#858e95; border-top:1px solid var(--line); font-size:11px; }
@media (max-width:900px) {
  .masthead__inner,.page-shell { width:min(100% - 32px,760px); }
  .site-name { display:block; }
  .masthead__inner { justify-content:space-between; }
  .page-shell { grid-template-columns:1fr; gap:34px; padding-top:30px; }
  .profile { position:static; }
  .profile__top { display:flex; align-items:center; gap:20px; }
  .profile__avatar { width:112px; height:112px; }
  .profile h1 { margin-top:0; }
  .profile__bio { max-width:620px; }
  .profile blockquote { display:none; }
}
@media (max-width:680px) {
  body { font-size:14px; }
  .masthead { position:relative; }
  .masthead__inner { min-height:auto; padding:14px 0 0; display:block; }
  .nav-links { margin-top:8px; overflow-x:auto; scrollbar-width:none; }
  .nav-links a { min-height:45px; padding:0 11px; font-size:12px; }
  .nav-links a:first-child { padding-left:0; }
  .nav-links a::after { right:10px; left:10px; }
  .page-shell { width:min(100% - 28px,540px); padding-top:24px; }
  .profile__top { align-items:flex-start; }
  .profile__avatar { width:86px; height:86px; }
  .profile h1 { font-size:21px; }
  .profile__title { font-size:11px; }
  .project { grid-template-columns:1fr; }
  .experience-grid { grid-template-columns:1fr; }
  .experience-grid > div { min-height:0; }
}
@media (max-width:430px) {
  .profile__top { display:block; }
  .profile__avatar { width:96px; height:96px; margin-bottom:16px; }
  .timeline-card { grid-template-columns:1fr; }
  .timeline-card__mark { width:110px; }
  .project__meta,footer { align-items:flex-start; flex-direction:column; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { transition-duration:.01ms!important; }
}
