@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&family=Instrument+Serif:ital@0;1&display=swap');

/* Foundation and shared elements */
:root{--bg:#10151d;--panel:#171f2b;--line:#303d50;--text:#e9eef5;--muted:#a5b2c4;--accent:#94b4d5;--mono:'IBM Plex Mono',monospace;--sans:'DM Sans',sans-serif;--serif:'Instrument Serif',Georgia,serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:30px}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.65 var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}button{font:inherit}a,button{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:6px}
::selection{background:var(--accent);color:var(--bg)}
h1,h2,h3,h4,p{margin:0}h1,h2,h3,h4{font-weight:500;line-height:1.13}
h2{font-size:clamp(32px,3.4vw,46px);letter-spacing:-1.6px}h3{letter-spacing:-.8px}
em{font-family:var(--serif);font-weight:400;color:var(--accent)}
.shell{max-width:1240px;margin:auto;padding:86px 48px}.divided{border-top:1px solid var(--line)}
.eyebrow{font:14px/1.7 var(--mono);letter-spacing:1.6px;color:var(--muted);margin-bottom:24px}
.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);margin-right:9px;box-shadow:0 0 12px #94b4d525}
.text-link{display:inline-flex;align-items:center;font-size:16px;font-weight:500}.text-link:hover{color:var(--accent)}
.button{display:inline-flex;align-items:center;justify-content:center;gap:24px;padding:14px 20px;font-size:16px;font-weight:600;border-radius:3px;background:linear-gradient(145deg,#365778,#243c56);border:1px solid #6584a5;color:#f0f5fc;transition:background .2s,transform .2s}.button:hover{transform:translateY(-2px);background:#345474}
.actions{display:flex;align-items:center;flex-wrap:wrap;gap:27px;margin-top:30px}
.tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:23px}.tags span{font:12px/1.6 var(--mono);color:#b5c6da;background:#202c3c;padding:5px 9px;border:1px solid #364960;border-radius:3px}
.skip-link{position:fixed;top:-100px;left:20px;z-index:20;background:var(--accent);color:var(--bg);padding:12px}.skip-link:focus{top:10px}
.section-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:37px}.section-heading .eyebrow{margin-bottom:15px}.section-heading>.text-link{margin-bottom:5px;white-space:nowrap}

/* Header */
.site-header{max-width:1240px;margin:auto;padding:24px 48px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:24px}
/* Frame the existing PNG's central mark without changing the source image.
   Invert + screen blend removes its white background against the dark header. */
.wordmark { display: inline-flex; flex-shrink: 0; }
.logo-frame { display: block; position: relative; width: 96px; height: 46px; overflow: hidden; }
.logo-frame img {
  position: absolute;
  width: 148px;
  height: 148px;
  max-width: none;
  left: -23px;
  top: -51px;
  filter: invert(1);
  mix-blend-mode: screen;
}

nav{display:flex;gap:29px}nav a,.header-contact{font-size:16px;color:#bfcbd9}nav a:hover,.header-contact:hover{color:var(--accent)}
.header-contact{color:var(--text);border-bottom:1px solid #516d8c;padding-bottom:3px}.header-contact span{margin-left:22px}.menu-toggle{display:none}

/* Introduction */
.hero{padding-top:88px;padding-bottom:0;display:grid;grid-template-columns:1fr}
.hero h1{font-size:clamp(48px,5.4vw,72px);line-height:1.07;letter-spacing:-3.5px}
.hero-intro{font-size:17px;max-width:620px;color:var(--muted);line-height:1.85;margin-top:27px}
.hero-caption{font-family:var(--mono);font-size:12px;color:#a1b1c7;margin-top:42px}.hero-caption>span{color:var(--accent);font-size:17px;margin-right:8px}
.hero-bottom{grid-column:1/-1;display:flex;gap:28px;align-items:center;margin-top:62px;padding:23px 0;font-size:14px;color:var(--muted);border-top:1px solid var(--line)}.hero-bottom strong{font-weight:500;color:var(--text)}.hero-bottom>a:hover{color:var(--accent)}.hero-bottom>span{margin-right:25px}.scroll-link{margin-left:auto;font:12px var(--mono);letter-spacing:1px}
/* Profile */
.about{display:grid;grid-template-columns:1fr 1.15fr;gap:72px}.about-copy>p{color:var(--muted);font-size:16px;margin-bottom:18px}.about-copy>.lead{font-size:18px;color:#d5dfec;line-height:1.65}.certification{display:flex;gap:17px;margin-top:28px;padding-top:24px;border-top:1px solid var(--line)}.certification>span{font-size:31px;color:var(--accent)}.certification strong{font-size:14px;font-weight:600}.certification p{font-size:14px;line-height:1.9;color:var(--muted);margin-top:4px}.certification small{font:12px var(--mono);margin-left:15px;color:#a2b3cb}

/* Experience */
.experience{display:grid;grid-template-columns:1fr 1.65fr;gap:80px}.experience h2{margin-bottom:29px}.timeline{border-left:1px solid var(--line);padding-left:31px}.job{position:relative;padding-bottom:34px;margin-bottom:30px;border-bottom:1px solid var(--line)}.job:before{content:'';width:7px;height:7px;border-radius:50%;background:#647e9d;border:4px solid var(--bg);box-sizing:content-box;position:absolute;left:-39px;top:2px}.job:first-child:before{background:var(--accent)}.job:last-child{margin-bottom:0;padding-bottom:0;border-bottom:0}.job-date{font:12px var(--mono);color:#a4b7ce;letter-spacing:.6px;margin-bottom:12px}.job h3{font-size:21px;letter-spacing:-.5px}.company{font-size:16px;margin:8px 0 14px}.company span{color:#a2b3cb;margin-left:6px}.job>p:not(.job-date):not(.company){font-size:16px;color:var(--muted);line-height:1.85;margin-top:14px}.job .tags{margin-top:16px}

/* Shared resources, contact, and footer */
.articles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}.article-card{display:flex;flex-direction:column;padding:25px 24px;background:var(--panel);border:1px solid var(--line);border-radius:4px;transition:border-color .2s,transform .2s}.article-card:hover{border-color:#6489b4;transform:translateY(-4px)}.article-top{display:flex;justify-content:space-between;font:12px var(--mono);letter-spacing:.5px;color:#a6b9d1;margin-bottom:33px}.article-card h3{font-size:22px;line-height:1.3;letter-spacing:-.6px}.article-card>p{font-size:16px;color:var(--muted);margin:16px 0 28px;line-height:1.85}.article-footer{display:flex;justify-content:space-between;gap:10px;border-top:1px solid var(--line);padding-top:19px;margin-top:auto;font:12px var(--mono);color:#a3b7cf}.contact{padding-top:77px;padding-bottom:70px}.contact h2{font-size:clamp(43px,5.8vw,75px);letter-spacing:-2.8px}.contact-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:30px;gap:24px}.contact-bottom p{font-size:16px;color:var(--muted)}.site-footer{border-top:1px solid var(--line);padding-top:24px;padding-bottom:24px;display:flex;justify-content:space-between;gap:24px;color:#a1b2c9;font-size:12px}.site-footer>div{display:flex;gap:19px}.site-footer a:hover{color:var(--accent)}

/* Responsive layouts */
@media(min-width:1500px){.shell,.site-header{max-width:1340px}.hero{padding-top:105px}.hero h1{font-size:80px}}
@media(max-width:950px){.shell{padding:65px 30px}.site-header{padding:22px 30px}nav{gap:18px}.hero{padding-bottom:0;column-gap:15px}.hero h1{font-size:53px}.hero-intro{font-size:16px}.hero .eyebrow{font-size:12px}.hero-caption{font-size:12px}.about{gap:38px}.experience{gap:42px;grid-template-columns:1fr 1.6fr}.article-card{padding:22px 17px}.article-card h3{font-size:20px}.site-footer>span:nth-child(2){display:none}.hero-bottom{margin-top:38px}.hero-bottom>span{margin-right:0}}
@media(max-width:700px){html{scroll-padding-top:20px}.shell{padding:53px 23px}.site-header{padding:22px 23px;position:relative}.header-contact{margin-left:auto;margin-right:17px}.menu-toggle{display:block;order:3;background:none;color:var(--text);border:1px solid var(--line);border-radius:3px;font-size:14px;padding:8px 10px}nav{display:none;position:absolute;top:100%;left:0;right:0;padding:22px;background:#192435;z-index:5;border-bottom:1px solid var(--line);flex-wrap:wrap;justify-content:center}nav.is-open{display:flex}.hero{grid-template-columns:1fr;padding-bottom:0;padding-top:50px}.hero h1{font-size:clamp(47px,9vw,65px);letter-spacing:-2.5px}.hero .eyebrow{font-size:12px;letter-spacing:1px}.hero-intro{font-size:16px;max-width:470px}.hero-caption{margin-top:27px;font-size:12px}.hero-bottom{margin-top:27px;gap:20px;flex-wrap:wrap;font-size:14px;padding:22px 0}.scroll-link{display:none}.hero-bottom>span{width:100%;margin-bottom:-10px}.about{grid-template-columns:1fr;gap:27px}.about-copy>.lead{font-size:17px}.section-heading{align-items:start;flex-direction:column;gap:18px;margin-bottom:26px}h2{font-size:35px;letter-spacing:-1.2px}.experience{grid-template-columns:1fr;gap:33px}.experience h2{margin-bottom:20px}.timeline{margin-left:5px;padding-left:25px}.job:before{left:-33px}.job h3{font-size:21px}.articles{grid-template-columns:1fr}.article-card{padding:25px}.article-top{margin-bottom:22px}.article-card h3{font-size:25px}.article-card>p{font-size:16px}.contact h2{font-size:48px;letter-spacing:-2px}.contact-bottom{align-items:start;flex-direction:column}.contact-bottom .button{max-width:100%;font-size:14px}.site-footer{padding-top:23px;padding-bottom:23px;flex-direction:column;gap:13px}.site-footer>div{gap:25px}.eyebrow{font-size:12px}}
@media(max-width:380px){.hero h1{font-size:43px}.hero .actions{gap:20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}

/* Content refinements */
.hero-copy { max-width: 900px; }
.hero h1 { font-size: clamp(48px, 6.5vw, 88px); }
.hero { background: radial-gradient(ellipse at 90% 20%, #29446422, transparent 65%); }
.about { grid-template-columns: 0.85fr 1.3fr; }
.about-copy > p { line-height: 1.9; }
.service-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:17px; }
.service-card { display:flex; flex-direction:column; min-height:360px; padding:25px 24px; background:var(--panel); border:1px solid var(--line); border-radius:4px; }
.service-card:last-child { grid-column:1 / -1; max-width:calc(50% - 8px); }
.service-card img { width:58px; height:58px; object-fit:contain; object-position:center; margin-bottom:25px; filter:saturate(.72) contrast(1.05); }
.service-number { font:12px var(--mono); letter-spacing:.6px; color:var(--accent); margin-bottom:12px; }
.service-card h3 { font-size:22px; line-height:1.3; margin-bottom:14px; }
.service-card > p:not(.service-number) { color:var(--muted); font-size:16px; line-height:1.8; }
.service-tags { display:flex; flex-wrap:wrap; gap:7px; margin-top:auto; padding-top:25px; }
.service-tags span { font:12px/1.6 var(--mono); color:#b5c6da; background:#202c3c; padding:5px 9px; border:1px solid #364960; border-radius:3px; }
.section-description { max-width: 740px; color: var(--muted); font-size: 17px; line-height: 1.85; margin: -12px 0 32px; }
.repository-card { background: linear-gradient(135deg, #233247, var(--panel)); border-color: #4a6484; }
.repository-card .tags { margin: 0 0 25px; }

@media (max-width: 700px) {
  .about { grid-template-columns: 1fr; }
  .hero h1 { font-size: clamp(43px, 9vw, 65px); }

  .section-description { font-size: 16px; }
  .service-grid { grid-template-columns:1fr; }
  .service-card:last-child { grid-column:auto; max-width:none; }
}

/* Name-led introduction and shared talks */
.hero-role {
  display: block;
  margin-top: 20px;
  font-size: clamp(24px, 3.2vw, 42px);
  line-height: 1.25;
  letter-spacing: -0.8px;
  color: var(--accent);
}

@media (max-width: 700px) {
  .hero h1 { font-size: clamp(36px, 8vw, 56px); }
  .hero-role { margin-top: 16px; }
}

/* Let larger labels wrap without squeezing navigation or card content. */
.hero-bottom,
.article-top,
.article-footer,
.site-footer,
.site-footer > div {
  flex-wrap: wrap;
}
.article-top,
.article-footer {
  line-height: 1.6;
  row-gap: 8px;
}
.hero-bottom { row-gap: 16px; }
@media (min-width: 701px) and (max-width: 950px) {
  .site-header { flex-wrap: wrap; }
  .site-header nav { order: 3; width: 100%; justify-content: center; flex-wrap: wrap; }
}
@media (max-width: 700px) {
  .site-header { gap: 12px; }
  .header-contact { margin-right: 0; white-space: nowrap; }
  .header-contact span { margin-left: 8px; }
  .menu-toggle { white-space: nowrap; }
}

/* Shared resource cards use explicit links to support multiple destinations. */
.article-card:focus-within { border-color: var(--accent); }
.article-top { align-items: center; gap: 12px; }
.resource-type {
  padding: 5px 10px;
  border: 1px solid #4a6484;
  border-radius: 3px;
  color: var(--text);
  background: #243449;
  font-size: 13px;
}
.resource-topic { color: var(--muted); font-size: 12px; }
.article-footer .text-link { font-family: var(--sans); font-size: 14px; padding: 8px 0; }
.resource-details {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 25px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.7;
}

/* Verifiable credentials with readable links on narrow screens. */
.certification-content { flex: 1; min-width: 0; }
.credential-link {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px 16px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
  font-size: 14px;
  line-height: 1.7;
}
.credential-link:last-child { border-bottom: 0; }
.credential-action { color: var(--accent); }
.credential-link:hover .credential-action { text-decoration: underline; text-underline-offset: 4px; }