/* Shared presentation. Edit content.json for texts, links and new entries. */
:root {
  --ink: #19212b;
  --muted: #606974;
  --accent: #234d83;
  --line: #e3e8ef;
  --paper: #fff;
  --font: 'Segoe UI', Helvetica, Arial, sans-serif;
  --serif: Georgia, 'Times New Roman', serif;
}
* { box-sizing: border-box; }
html { font-size: 100%; background: var(--paper); }
body { margin: 0; color: var(--ink); font: 1rem/1.8 var(--font); -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; overflow-wrap: anywhere; }
a:hover { color: var(--accent); }
a:focus-visible, button:focus-visible { outline: 2px solid var(--accent); outline-offset: 6px; }
button { font: inherit; }
p { margin: 0 0 1.25rem; }
h1, h2, h3 { margin: 0; font-weight: 400; line-height: 1.25; }
h1, h2 { font-family: var(--serif); letter-spacing: -.035em; }
h1 { font-size: clamp(2.5rem, 5.2vw, 4.6rem); line-height: 1.14; }
h2 { font-size: 1.9rem; margin-bottom: 1.25rem; }
h3 { font: 600 1.0625rem/1.45 var(--font); margin-bottom: .5rem; }
::selection { background: #dce7f5; }
[hidden] { display: none !important; }
.site-header { width: calc(100% - 112px); max-width: 1440px; margin: 35px auto 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 32px; }
.wordmark { font: 1.5rem/1.25 var(--serif); letter-spacing: -.04em; flex-shrink: 0; }
.wordmark span { display: block; font: .875rem/1.5 var(--font); letter-spacing: .01em; color: var(--muted); margin-top: 8px; }
.site-header nav { display: flex; gap: 30px; padding: 9px 0; flex-wrap: wrap; }
.site-header nav a { font-size: .9375rem; padding: 0 0 7px; border-bottom: 1px solid transparent; }
.site-header nav a[aria-current=page] { color: var(--accent); border-color: var(--accent); }
.home main { min-height: calc(100svh - 172px); padding: 80px max(56px, calc((100vw - 1180px)/2)); display: flex; align-items: center; }
.intro { width: 100%; max-width: 760px; position: relative; padding-bottom: 28px; }
.eyebrow { font-size: .875rem; letter-spacing: .025em; margin-bottom: 22px; color: var(--accent); }
.intro h1 { font-size: clamp(2.5rem, 7vw, 6.5rem); letter-spacing: -.055em; margin-bottom: 32px; }
.name-period { color: var(--accent); }
.intro-copy { max-width: 690px; font-size: 1.125rem; line-height: 1.85; color: #37414c; }
.intro-copy p { margin: 0 0 14px; }
.letter-pending { visibility: hidden; }
.typing-cursor { position: absolute; display: inline-block; height: 1.1em; width: 1px; background: currentColor; margin-top: .3em; animation: blink .9s step-end infinite; pointer-events: none; }
@keyframes blink { 50% { opacity: 0; } }
.site-footer { width: calc(100% - 112px); max-width: 1440px; margin: 0 auto; padding: 18px 0 24px; border-top: 1px solid var(--line); display: flex; justify-content: space-between; align-items: baseline; gap: 18px 28px; flex-wrap: wrap; color: var(--muted); font-size: .875rem; }
.footer-links { display: flex; flex-wrap: wrap; gap: 20px; }
.footer-links a { border-bottom: 1px solid transparent; }
.footer-links a:hover { border-color: var(--accent); }
.inner main { max-width: 1040px; min-height: calc(100svh - 370px); margin: 95px auto 100px; padding: 0 28px; }
.page-heading { max-width: 790px; margin-bottom: 62px; }
.lead { font-size: 1.1875rem; line-height: 1.8; color: #4d5965; margin-top: 27px; max-width: 700px; }
.research-item { display: grid; grid-template-columns: 160px minmax(0,1fr); gap: 44px; padding: 42px 0; border-top: 1px solid var(--line); }
.section-index { color: var(--accent); font-size: .875rem; line-height: 1.75; padding-top: 5px; }
.research-item div > p, .prose > p, .tools-section p { color: #4d5965; }
.research-item div > p { max-width: 680px; }
.text-link { display: inline-block; border-bottom: 1px solid #a5b3c5; padding-bottom: 2px; line-height: 1.7; }
.research-figure { margin: 34px 0 0; padding: 28px 0 0; border-top: 1px solid var(--line); }
.research-figure img { display: block; width: min(100%, 409px); height: auto; margin: 0 auto; }
.research-figure > a { display: block; }
figcaption { font-size: .875rem; color: var(--muted); line-height: 1.65; margin-top: 20px; }
figcaption a { text-decoration: underline; text-underline-offset: 3px; }
.tools-section { margin-top: 12px; border-top: 1px solid var(--line); padding-top: 40px; padding-left: 204px; }
.publication { border-top: 1px solid var(--line); padding: 30px 0 38px; }
.publication:last-of-type { border-bottom: 1px solid var(--line); }
.publication-meta { font-size: .875rem; color: var(--accent); margin-bottom: 22px; }
.publication h2 { font-size: 2rem; line-height: 1.35; max-width: 870px; }
.thesis-section { margin-top: 2.5rem; }
.thesis-section .publication { padding: 1.25rem 0 1.75rem; }
.thesis-section .publication h3, .thesis-section .publication h4 { font-size: 1.2rem; line-height: 1.45; margin: 0 0 1rem; max-width: 870px; }
.authors { color: #555; font-size: 1rem; margin-top: 24px; }
.authors strong { font-weight: 600; color: var(--ink); }
.paper-summary { border-left: 2px solid var(--accent); padding-left: 20px; margin: 26px 0; color: #34465b; font-size: 1.0625rem; max-width: 760px; }
.citation { font-size: .9375rem; color: var(--muted); }
.publication-links, .profile-links { display: flex; gap: 16px 26px; flex-wrap: wrap; }
.profile-links { margin-top: 36px; font-size: .9375rem; }
.profile-links a { border-bottom: 1px solid #a5b3c5; }
.about-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 42px; }
.about-layout:has(.portrait) { grid-template-columns: minmax(0, 1fr) 220px; }
.prose { max-width: 690px; }
.about-layout .prose { grid-column: 1; grid-row: 1; }
.prose .lead { margin-top: 0; }
.portrait { grid-column: 2; grid-row: 1; margin: 0; }
.portrait img { width: 220px; max-width: 100%; height: auto; display: block; border-radius: 2px; }
.outside-heading { margin-top: 36px; font-size: 1.6rem; }
.cv-link { margin-top: 26px; }
.experience { margin-top: 62px; }
.experience > h2 { margin-bottom: 26px; }
.experience-row { display: grid; grid-template-columns: 180px minmax(0,1fr); gap: 30px; border-top: 1px solid var(--line); padding: 26px 0; }
.experience-row > p { font-size: .875rem; color: var(--muted); }
.experience-row div p { color: #4d5965; margin: 0; }
.experience-row div .experience-description { margin-top: 12px; }
.experience-row .text-link { margin-top: 16px; margin-right: 20px; }
.photo-section { margin-top: 62px; }
.photo-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 32px; }
.gallery-photo { margin: 0; }
.gallery-photo img { width: 100%; height: auto; display: block; }
.email-link { font-size: clamp(1.5rem, 4vw, 2.5rem); color: var(--accent); letter-spacing: -.03em; border-bottom: 1px solid #aaa; }
.contact-details { display: grid; grid-template-columns: 1fr 1fr; gap: 35px; margin-top: 45px; color: #4d5965; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; top: -100px; left: 20px; background: #111; color: white; padding: 10px; z-index: 10; }
.skip-link:focus { top: 10px; }
@media(max-width:850px) {
  .site-header { width: calc(100% - 48px); gap: 24px; flex-direction: column; }
  .wordmark { flex-shrink: 1; }
  .site-header nav { gap: 25px; padding: 0; }
  .home main { padding: 65px 36px 75px; min-height: calc(100svh - 225px); }
  .site-footer { width: calc(100% - 48px); }
  .inner main { margin-top: 60px; }
  .research-item { grid-template-columns: 1fr; gap: 12px; }
  .section-index { margin-bottom: 4px; }
  .section-index br { display: none; }
  .section-index br::after { content: ' '; }
  .tools-section { padding-left: 0; }
  .about-layout:has(.portrait) { grid-template-columns: minmax(0,1fr) 160px; }
  .portrait img { width: 160px; }
}
@media(max-width:540px) {
  .site-header { margin-top: 24px; }
  .wordmark { font-size: 1.4rem; }
  .site-header nav { gap: 18px; }
  .site-header nav a { font-size: .875rem; }
  .home main { padding: 60px 24px 80px; }
  .intro h1 { font-size: clamp(2.5rem, 10.6vw, 3.8rem); margin-bottom: 28px; }
  .intro-copy { font-size: 1.0625rem; }
  .inner main { padding: 0 24px; margin-bottom: 65px; }
  .page-heading { margin-bottom: 42px; }
  .publication h2 { font-size: 1.6rem; }
  .about-layout:has(.portrait) { grid-template-columns: 1fr; gap: 12px; }
  .portrait { grid-column: 1; grid-row: 1; margin: 0 0 20px; }
  .portrait img { width: 180px; }
  .about-layout:has(.portrait) .prose { grid-row: 2; }
  .experience-row { grid-template-columns: 1fr; gap: 7px; }
  .experience-row > p { margin-bottom: 8px; }
  .contact-details { grid-template-columns: 1fr; gap: 0; }
  .photo-grid { grid-template-columns: 1fr; }
  .site-footer { flex-direction: column; gap: 10px; }
}
@media(prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation: none !important; scroll-behavior: auto !important; }
}

/* A quiet homepage: the animated introduction is the main visual element. */
.home main { justify-content: center; }
.intro { max-width: 690px; padding-bottom: 28px; }
.intro-copy { font-size: 1.0625rem; line-height: 1.8; }
.intro-copy p { margin-bottom: 14px; }
.intro h1.sr-only { font-size: 1rem; margin: -1px; }
@media(max-width:540px) { .intro-copy { font-size: 1rem; } }

/* My journey: a geographic index beside a readable chronological account. */
.journey-layout { display:grid; grid-template-columns:minmax(280px, .95fr) minmax(300px, 1.05fr); gap:64px; align-items:start; margin:20px 0 90px; }
.journey-map { margin:0; position:sticky; top:28px; }
.map-surface { position:relative; border:1px solid var(--line); border-radius:10px; overflow:hidden; background:#edf3f8; }
.map-surface>img { display:block; width:100%; height:auto; }
.journey-route { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.journey-route polyline { fill:none; stroke:#4776a4; stroke-width:2; stroke-dasharray:5 7; }
.journey-pin { position:absolute; transform:translate(-50%,-50%); display:flex; width:44px; height:44px; align-items:center; justify-content:center; color:var(--accent); }
.pin-dot { width:14px; height:14px; border-radius:50%; background:var(--accent); border:3px solid white; box-shadow:0 0 0 1px #234d83; }
.pin-label { position:absolute; left:36px; padding:2px 9px; border-radius:4px; background:#fff; box-shadow:0 2px 12px #234d8310; font-size:.9375rem; white-space:nowrap; color:var(--ink); }
.journey-pin:hover .pin-label,.journey-pin[aria-current="location"] .pin-label { background:var(--accent); color:white; }
.journey-map figcaption { padding-top:12px; color:var(--muted); font-size:.875rem; line-height:1.6; }
.journey-map figcaption a { text-decoration:underline; text-underline-offset:3px; }
.journey-city { border-left:1px solid #cbd7e1; padding:0 0 30px 28px; scroll-margin-top:28px; }
.journey-city h2 { position:relative; margin-bottom:24px; font-size:2rem; }
.journey-city h2:before { content:""; position:absolute; left:-33px; top:14px; width:9px; height:9px; border-radius:50%; background:var(--accent); }
.journey-city:target { border-left-color:var(--accent); }
.journey-city:focus { outline:none; }
.journey-city:focus-visible { outline:2px solid var(--accent); outline-offset:8px; }
.journey-step { padding:0 0 18px; }
.journey-period { color:var(--accent); font-size:.875rem; margin-bottom:6px; }
.journey-period:empty { display:none; }
.journey-institution { color:var(--muted); margin-bottom:12px; }
.journey-step p:last-child { margin-bottom:0; }
.journey-layout + .about-layout { border-top:1px solid var(--line); padding-top:48px; }
@media(max-width:760px) { .journey-layout { grid-template-columns:1fr; gap:36px; margin-bottom:44px; } .journey-map { position:static; width:100%; max-width:420px; margin:0 auto; } .journey-city { padding-left:24px; } .journey-city h2:before { left:-29px; } }

/* Research collaborations and reading list */
.research-context { margin: -1rem 0 3rem; padding: 0 0 2rem 204px; border-bottom: 1px solid var(--line, #e4e8ed); }
.research-context h3 { font-size: 1.2rem; margin: 2rem 0 .8rem; }
.programme-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.2rem; margin: 1.4rem 0 2.5rem; }
.programme-card { display: flex; flex-direction: column; gap: .65rem; color: inherit; text-decoration: none; border: 1px solid #e1e6ed; border-radius: 8px; padding: 1rem; }
.programme-card:hover { border-color: #234d83; }
.programme-logo { height: 120px; display: flex; align-items: center; justify-content: center; border-radius: 4px; padding: 16px; }
.programme-logo.dark { background: #142a47; }
.programme-logo.light { background: #fff; }
.programme-logo img { width: 100%; height: 100%; object-fit: contain; }
.programme-title { font-weight: 600; font-size: 1.1rem; }
.programme-card > span:not(.programme-title) { font-size: .95rem; }
.reference-list { padding-left: 1.25rem; }
.reference-list li { padding-left: .4rem; margin-bottom: 1.4rem; }
.reference-title { color: #234d83; text-underline-offset: 3px; }
.reference-list p { margin: .3rem 0; font-size: .95rem; }
.reference-list .citation { color: #667085; }
@media (max-width: 760px) { .research-context { padding-left: 0; } }
@media (max-width: 480px) { .programme-grid { grid-template-columns: 1fr; } }

.skill-group { padding: 2rem 0; border-top: 1px solid var(--line); }
.skill-group h2 { margin: 0 0 1rem; }
.skill-group ul { padding-left: 1.25rem; max-width: 740px; }
.skill-group li { margin: .65rem 0; color: #4d5965; }

/* Scrollable project and skills capsules */
.capsule-deck { margin: 1rem -2px 3rem; }
.deck-controls { display: flex; justify-content: space-between; align-items: center; min-height: 48px; margin: 0 6px 16px; color: #667085; font-size: .9rem; }
.deck-controls button { width: 44px; height: 44px; margin-left: 8px; border: 1px solid #dce3ed; border-radius: 50%; background: white; color: #234d83; font-size: 1.3rem; cursor: pointer; }
.deck-controls button:disabled { opacity: .3; cursor: default; }
.deck-controls button:hover:not(:disabled) { background: #edf3fa; }
.capsule-track { display: flex; gap: 24px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 4px 6px 26px; align-items: flex-start; scrollbar-width: thin; scrollbar-color: #b9c8d9 transparent; }
.capsule { flex: 0 0 92%; min-width: 0; scroll-snap-align: start; border: 1px solid #dfe6ef; border-radius: 24px; background: linear-gradient(145deg,#fff,#f7f9fc); box-shadow: 0 10px 28px #18375708; }
.research-item.capsule { display: block; padding: 36px; }
.research-item.capsule .section-index { margin: 0 0 22px; color: #557394; }
.research-item.capsule h2 { max-width: 700px; }
.capsule .research-context { padding: 0; margin: 2rem 0 0; border: 0; }
.skill-group.capsule { flex-basis: 76%; padding: 32px 36px; }
.capsule-track:focus-visible,.deck-controls button:focus-visible { outline: 2px solid #234d83; outline-offset: 3px; }
@media(max-width:600px) { .capsule-track { gap: 14px; } .research-item.capsule,.skill-group.capsule { flex-basis: 94%; padding: 24px; border-radius: 20px; } }
@media(prefers-reduced-motion:no-preference) { .capsule-track { scroll-behavior: smooth; } }

/* Equal card heights within each deck, including research projects. */
.capsule-track { align-items: stretch; }
.capsule { height: auto; }

/* Journey capsules keep the station line and its city markers. */
.journey-step { margin: 0 0 18px; padding: 24px; border: 1px solid #dfe6ef; border-radius: 20px; background: linear-gradient(145deg,#fff,#f7f9fc); box-shadow: 0 8px 24px #18375708; }
.journey-step h3 { margin-top: .4rem; }
.journey-institution { font-weight: 500; }
.journey-step .journey-period:empty { display:none; }
.about-layout .prose:has(.outside-heading) { border: 1px solid #dfe6ef; border-radius: 20px; padding: 26px; background: #f8fafc; }
.about-layout .outside-heading { margin-top: 0; }
@media(max-width:480px) { .journey-step { padding:20px; } }

.affiliation-logos { display:flex; gap:20px; align-items:center; margin-bottom:20px; flex-wrap:wrap; }
.affiliation-logos a { display:flex; align-items:center; background:#fff; border-radius:8px; padding:8px; }
.affiliation-logos img { width:auto; height:52px; max-width:180px; object-fit:contain; }
.map-affiliation { padding:20px; border:1px solid #dfe6ef; border-radius:16px; background:white; margin:12px 0; box-shadow:0 8px 24px #18375708; }
.map-affiliation[hidden] { display:none; }
.map-affiliation h3 { margin:0 0 14px; }
.map-affiliation .affiliation-logos img { height:42px; max-width:140px; }

.country-flag { display:inline-block; width:24px !important; height:16px !important; max-width:none; object-fit:fill; vertical-align:middle; margin-right:7px; border:1px solid #dfe3e8; border-radius:2px; }

.journey-heading { display:flex; justify-content:space-between; align-items:center; gap:40px; margin-bottom:40px; }
.journey-heading .page-heading { margin-bottom:0; }
.journey-portrait { margin:0; flex:0 0 170px; }
.journey-portrait img { display:block; width:170px; height:190px; object-fit:cover; object-position:50% 24%; border-radius:20px; box-shadow:0 10px 30px #18375715; }
.journey-portrait figcaption:empty { display:none; }
@media(max-width:600px) { .journey-heading { flex-direction:column-reverse; align-items:flex-start; gap:24px; } .journey-portrait { flex-basis:auto; } .journey-portrait img { width:130px; height:145px; border-radius:16px; } }

.intro-action { margin-top:28px; }
.intro-action[hidden] { display:none; }
.journey-cta { display:inline-flex; align-items:center; gap:26px; padding:12px 22px; border:1px solid #dbe3ee; border-radius:99px; color:#234d83; text-decoration:none; background:#f8fafc; }
.journey-cta:hover { background:#edf3fa; border-color:#234d83; }
.journey-cta:focus-visible { outline:2px solid #234d83; outline-offset:4px; }
.journey-portrait { flex-basis:220px; }
.journey-portrait img { width:220px; height:240px; image-rendering:auto; object-position:50% 25%; }
@media(max-width:600px) { .journey-portrait { flex-basis:auto; } .journey-portrait img { width:180px; height:195px; } }
@media(prefers-reduced-motion:no-preference) { .intro-action:not([hidden]) { animation:cta-appear .5s ease both; } @keyframes cta-appear { from { opacity:0; transform:translateY(5px); } to { opacity:1; transform:translateY(0); } } }
.cv-updated{display:block;font-size:.8rem;color:#6b7280;margin-top:.4rem}.teaching-section{margin-top:4rem}.teaching-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.teaching-card{border:1px solid #dbe2ea;border-radius:20px;padding:1.5rem;background:#fafbfd}.teaching-card h3{font-size:1.2rem}.teaching-card p{font-size:.95rem}@media(max-width:800px){.teaching-grid{grid-template-columns:1fr}}

/* Match visual presence despite the logos' different aspect ratios. */
.affiliation-logos img[src$="qpl-logo.png"],.affiliation-logos img[src$="hwu-logo.png"]{height:82px;max-width:190px}
.map-affiliation .affiliation-logos img[src$="qpl-logo.png"],.map-affiliation .affiliation-logos img[src$="hwu-logo.png"]{height:66px;max-width:160px}
.skills-browser{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start;margin-bottom:32px}
.skill-domain{background:#fafbfd;border:1px solid #dbe3ee;border-radius:20px;overflow:hidden}
.skill-domain summary{display:flex;align-items:center;justify-content:space-between;gap:18px;cursor:pointer;padding:24px;font-size:1.05rem;font-weight:500;color:#234d83;list-style:none}
.skill-domain summary::-webkit-details-marker{display:none}
.skill-domain summary:hover{background:#edf3fa}
.skill-domain summary:focus-visible{outline:2px solid #234d83;outline-offset:-4px;border-radius:18px}
.skill-toggle{font-size:1.6rem;font-weight:400;transition:transform .15s}
.skill-domain[open] .skill-toggle{transform:rotate(45deg)}
.skill-domain[open]{border-color:#8fa8c6}
.skill-details{padding:0 24px 22px;border-top:1px solid #e5eaf1}
.skill-details ul{padding-left:20px;margin:18px 0 0}
.skill-details li{color:#4d5965;line-height:1.7;margin:10px 0}
.email-link{display:inline-block;font-size:1.05rem;letter-spacing:normal;border-bottom:1px solid #c9d4e2;padding-bottom:3px}
@media(max-width:650px){.skills-browser{grid-template-columns:1fr}.skill-domain summary{padding:20px}}
@media(prefers-reduced-motion:reduce){.skill-toggle{transition:none}}

.typing-cursor{width:.62em;height:1em;margin-top:.34em;border-radius:1px;background:#234d83;animation:blink 1.05s step-end infinite;opacity:.85}
@media(prefers-reduced-motion:reduce){.typing-cursor{animation:none}}

/* Keep the standalone teaching page aligned with the other sections. */
.teaching-section{margin-top:0}.teaching-grid{align-items:stretch}.teaching-card{overflow-wrap:anywhere}
.site-header nav{column-gap:24px;row-gap:12px}.site-header nav a{white-space:nowrap}

/* A warmer visual identity: paper and ink. */
:root{--paper:#f8f7f3;--ink:#21313d;--muted:#637078;--accent:#28586c;--line:#dcded8}
body{background:radial-gradient(ellipse at 95% 4%,#e9efeb70 0,transparent 40%),var(--paper)}
::selection{background:#d8e7df}
.site-header{align-items:center;padding-bottom:24px;border-bottom:1px solid var(--line)}
.site-header nav{gap:8px 10px;justify-content:flex-end;max-width:850px}
.site-header nav a{padding:6px 11px;border:1px solid transparent;border-radius:99px;font-size:.875rem}
.site-header nav a:hover{background:#e9eeea}
.site-header nav a[aria-current=page]{background:#e5ece6;border-color:#d3ddd4;color:#244f5d}
.wordmark{color:#253d4c}
.wordmark span{font-size:.8rem;letter-spacing:.025em;margin-top:5px}
.home main{padding:66px max(40px,calc((100vw - 1180px)/2));min-height:calc(100svh - 218px)}

.home .intro{max-width:650px;padding:24px 0}


.intro-copy{color:#394b55;font-size:1.0625rem;line-height:1.9}



.journey-cta{border-color:#ccd8d0;background:#e8eee6;color:#274f5c;padding:11px 20px}
.journey-cta:hover{background:#dce7dc;border-color:#9eb3a5}
.typing-cursor{background:#28586c}
.inner main{margin-top:72px}
.page-heading .eyebrow{display:flex;align-items:center;gap:12px;text-transform:uppercase;font-size:.75rem;letter-spacing:.1em}
.page-heading .eyebrow:before{content:"";width:26px;height:1px;background:#b99059}
.page-heading h1{color:#263e4c}
.lead{color:#52626c}
.capsule{background:#fffefa;border-color:#dce1d9;box-shadow:0 14px 40px #233e4410}
.research-item.capsule{position:relative;overflow:hidden;border-top:3px solid #73988c}
.research-item.capsule:nth-child(2){border-top-color:#bd9a66}
.research-item.capsule .section-index{font-size:.8rem;color:#41697a;letter-spacing:.015em;padding-bottom:18px;border-bottom:1px solid #e4e8e0}
.deck-controls button{background:#fffefa;border-color:#d4ded4;color:var(--accent)}
.deck-controls button:hover:not(:disabled){background:#e8eee6}
.programme-card{background:#fff;border-color:#dce2d9;border-radius:14px}
.journey-step{background:#fffefa;border-color:#dde2d9;box-shadow:0 8px 26px #233e4408}
.journey-portrait img{box-shadow:0 12px 30px #233e4418;border:6px solid #fffefa}
.journey-city{border-color:#b8cbbd}
.journey-city h2:before{background:#5b8479}
.map-surface{border-color:#d4ded4;background:#e8eee9}
.map-affiliation{background:#fffefa;border-color:#dce2d9}
.teaching-card,.skill-domain{background:#fffefa;border-color:#dce2d9;box-shadow:0 6px 20px #233e4406}
.teaching-card{border-top:3px solid #9ab3a4}
.teaching-card:nth-child(2){border-top-color:#bd9a66}
.teaching-card:nth-child(3){border-top-color:#7796a8}
.skill-domain summary{color:#315d6c}
.skill-domain summary:hover{background:#eaf0e7}
.skill-domain[open]{border-color:#8ba99a}
.skill-details{border-color:#e2e7df}
.publication-meta{color:#426a77;font-size:.8rem;letter-spacing:.025em}
.publication{border-color:#dce1d9}
.paper-summary{border-color:#a9bfac;color:#405864}
.email-link{color:#28586c;border-color:#b7cabc}
.site-footer{border-color:#d6ded4}
@media(min-width:1000px){.home .site-footer{margin-top:0}}
@media(max-width:1100px){.site-header{width:calc(100% - 64px);gap:24px}.site-header nav{gap:6px 4px}.site-header nav a{padding:5px 8px}}
@media(max-width:850px){.site-header{width:calc(100% - 48px);align-items:flex-start;gap:20px;padding-bottom:18px}.site-header nav{justify-content:flex-start}.home main{padding:38px 28px 54px}.home .intro{padding:16px 0 20px}.inner main{margin-top:48px}}
@media(max-width:540px){.site-header nav{gap:5px 3px}.site-header nav a{font-size:.81rem;padding:5px 8px}.home main{padding:28px 24px 44px}.intro-copy{font-size:1rem;line-height:1.85}.journey-cta{font-size:.9rem;gap:18px}}

/* The homepage gives the animated introduction the full composition. */
.home .intro{max-width:690px;margin-inline:auto}

/* White pixels blend into their surrounding card instead of forming a box. */
.affiliation-logos a,.programme-logo.light{background:transparent}
.affiliation-logos img,.programme-logo.light img{mix-blend-mode:multiply}
.programme-card{background:#fffefa;isolation:isolate}