:root{
  --bg:#FAFAF8;
  --bg-alt:#F1F1EC;
  --ink:#14181B;
  --ink-soft:#5B6066;
  --ink-faint:#9A9E9F;
  --accent:#1F5A6B;
  --accent-bright:#2C7A8F;
  --accent-soft:#E6EEEE;
  --electric:#2F7BFF;
  --line:#E2E2DC;
  --white:#FFFFFF;
  --radius:14px;
  --max:1180px;
}

*{box-sizing:border-box; margin:0; padding:0;}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:'Inter', -apple-system, sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.display{
  font-family:'Space Grotesk', 'Inter', sans-serif;
  font-weight:700;
  letter-spacing:-0.02em;
  line-height:1.05;
  color:var(--ink);
}
.mono{
  font-family:'JetBrains Mono', monospace;
  letter-spacing:0.06em;
  text-transform:uppercase;
  font-size:0.72rem;
  font-weight:500;
}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
.wrap{max-width:var(--max); margin:0 auto; padding:0 40px;}
section{padding:120px 0;}
.accent{color:var(--accent);}

/* ---------- Eyebrow / dividers ---------- */
.eyebrow{
  display:flex; align-items:center; gap:14px;
  color:var(--accent); margin-bottom:22px;
}
.eyebrow::before{
  content:''; width:32px; height:1px; background:var(--accent);
  display:inline-block;
}

/* ---------- Header ---------- */
header{
  position:sticky; top:0; z-index:100;
  background:rgba(250,250,248,0.86);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav{
  display:flex; align-items:center; justify-content:space-between;
  padding:20px 40px; max-width:var(--max); margin:0 auto;
}
.brand{display:flex; align-items:center; gap:12px; cursor:pointer; background:none; border:none; padding:0; font:inherit; text-align:left; appearance:none; -webkit-appearance:none; color:var(--ink);}
.brand-mark{
  width:52px; height:52px; border-radius:50%;
  background:#fff; border:1px solid var(--line); box-shadow:0 1px 4px rgba(20,24,27,0.06);
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0; overflow:hidden;
}
.brand-mark svg{width:41px; height:41px;}
.brand-mark .node{transform-box:fill-box; transform-origin:center; fill:var(--accent); animation:node-glow 1s ease-in-out infinite;}
@keyframes node-glow{
  0%,78%,100%{fill:var(--accent); opacity:.6; transform:scale(1); filter:none;}
  10%{fill:var(--electric); opacity:1; transform:scale(1.35); filter:drop-shadow(0 0 2px var(--electric));}
}
.brand-mark .spark{transform-box:fill-box; transform-origin:center; fill:var(--electric); filter:drop-shadow(0 0 2px var(--electric));}
.brand-mark .spark-a{animation:travel-a 1.1s linear infinite alternate;}
.brand-mark .spark-b{animation:travel-b 1.1s linear infinite alternate; animation-delay:.2s;}
.brand-mark .spark-c{animation:travel-c 1.1s linear infinite alternate; animation-delay:.4s;}
.brand-mark .spark-d{animation:travel-d 1.1s linear infinite alternate; animation-delay:.6s;}
.brand-mark .spark-e{animation:travel-e 1.3s linear infinite alternate; animation-delay:.1s;}
.brand-mark .spark-f{animation:travel-f 1.3s linear infinite alternate; animation-delay:.3s;}
.brand-mark .spark-g{animation:travel-g 1.3s linear infinite alternate; animation-delay:.5s;}
.brand-mark .spark-h{animation:travel-h 1.3s linear infinite alternate; animation-delay:.7s;}
.brand-mark .spark-i{animation:travel-i 1.4s linear infinite alternate; animation-delay:.05s;}
.brand-mark .spark-j{animation:travel-j 1.4s linear infinite alternate; animation-delay:.25s;}
.brand-mark .spark-k{animation:travel-k 1.4s linear infinite alternate; animation-delay:.45s;}
.brand-mark .spark-l{animation:travel-l 1.4s linear infinite alternate; animation-delay:.65s;}
@keyframes travel-a{0%{transform:translate(0,0);} 100%{transform:translate(0,4px);}}
@keyframes travel-b{0%{transform:translate(0,0);} 100%{transform:translate(-3px,1.75px);}}
@keyframes travel-c{0%{transform:translate(0,0);} 100%{transform:translate(-3.9px,2.25px);}}
@keyframes travel-d{0%{transform:translate(0,0);} 100%{transform:translate(0,12px);}}
@keyframes travel-e{0%{transform:translate(0,0);} 100%{transform:translate(-6.9px,-4px);}}
@keyframes travel-f{0%{transform:translate(0,0);} 100%{transform:translate(0,-4px);}}
@keyframes travel-g{0%{transform:translate(0,0);} 100%{transform:translate(0,-4.5px);}}
@keyframes travel-h{0%{transform:translate(0,0);} 100%{transform:translate(0,-12px);}}
@keyframes travel-i{0%{transform:translate(0,0);} 100%{transform:translate(10.4px,6px);}}
@keyframes travel-j{0%{transform:translate(0,0);} 100%{transform:translate(-10.4px,6px);}}
@keyframes travel-k{0%{transform:translate(0,0);} 100%{transform:translate(-10.4px,-6px);}}
@keyframes travel-l{0%{transform:translate(0,0);} 100%{transform:translate(10.4px,-6px);}}
@media (prefers-reduced-motion: reduce){
  .brand-mark .node, .brand-mark .spark{animation:none;}
}
.brand-text .name{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1rem; line-height:1.2; color:var(--ink);}
.brand-text .tag{font-family:'JetBrains Mono',monospace; font-size:0.65rem; letter-spacing:0.08em; color:var(--ink-faint); text-transform:uppercase;}
nav.links{display:flex; gap:36px; font-size:0.92rem; color:var(--ink-soft);}
.mobile-contact-link{display:none;}
nav.links a.nav-link{background:none; border:none; font:inherit; color:inherit; cursor:pointer; padding:0; transition:color .2s; appearance:none; -webkit-appearance:none;}
nav.links a.nav-link:hover, nav.links a.nav-link.active{color:var(--ink);}
nav.links a.nav-link.active{font-weight:600;}
.cta-btn{background:none; border:none; font:inherit; cursor:pointer;
  background:var(--ink); color:#fff; padding:11px 22px; border-radius:999px;
  font-size:0.88rem; font-weight:500; display:inline-flex; align-items:center; gap:8px;
  transition:background .2s, transform .2s;
}
.cta-btn:hover{background:var(--accent); transform:translateY(-1px);}

/* ---------- Hero ---------- */
.hero{padding:96px 0 60px; position:relative; overflow:hidden;}
.hero-grid{
  display:grid; grid-template-columns:0.85fr 1.15fr; gap:64px; align-items:center;
  position:relative; z-index:2;
}
.portrait-frame{
  position:relative; border-radius:var(--radius); overflow:hidden;
  aspect-ratio:4/5; background:linear-gradient(160deg,#EDEEEA, #E1E4E1);
  border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
}
.portrait-frame img{
  width:100%; height:100%; object-fit:cover; object-position:center 20%;
}
.gallery-grid{
  display:flex; flex-wrap:wrap; gap:24px; margin-top:28px;
}
.gallery-card{
  flex:0 1 240px; display:flex; flex-direction:column; gap:10px;
}
.gallery-item{
  position:relative; border-radius:var(--radius); overflow:hidden;
  aspect-ratio:4/5; background:linear-gradient(160deg,#EDEEEA, #E1E4E1);
  border:1px solid var(--line);
}
.gallery-item img{
  width:100%; height:100%; object-fit:cover; object-position:center 22%;
  transition:transform 0.4s ease;
}
.gallery-item:hover img{transform:scale(1.03);}
.gallery-caption{
  font-size:0.82rem; line-height:1.45; color:var(--ink-soft);
}
.gallery-caption strong{color:var(--ink); font-weight:600;}
.hero-copy h1{font-size:3.1rem; margin-bottom:22px;}
.hero-copy p.lede{font-size:1.15rem; color:var(--ink-soft); max-width:520px; margin-bottom:32px;}
.badge-row{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:36px;}
.badge{
  font-family:'JetBrains Mono',monospace; font-size:0.68rem; letter-spacing:0.05em;
  text-transform:uppercase; padding:7px 13px; border-radius:999px;
  background:var(--accent-soft); color:var(--accent); border:1px solid rgba(31,90,107,0.15);
}
.hero-actions{display:flex; gap:14px; flex-wrap:wrap;}
.btn-outline{
  border:1px solid var(--ink); padding:11px 22px; border-radius:999px;
  font-size:0.88rem; font-weight:500; transition:all .2s;
}
.btn-outline:hover{background:var(--ink); color:#fff;}

/* dendritic svg accent */
.neural-bg{position:absolute; top:-10%; right:-8%; width:60%; height:120%; z-index:1; opacity:0.5; pointer-events:none;}

/* ---------- Stats ---------- */
.stats-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:var(--line); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;
  margin-top:44px;
}
.stat-cell{background:var(--white); padding:36px 28px;}
.stat-cell .num{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:2.6rem; color:var(--accent);}
.stat-cell .label{color:var(--ink-soft); font-size:0.88rem; margin-top:6px;}

.section-head{max-width:640px; margin-bottom:56px;}
.section-head h2{font-size:2.2rem;}
.section-head p{color:var(--ink-soft); margin-top:14px; font-size:1.02rem;}

/* ---------- Journey / timeline ---------- */
.bg-alt{background:var(--bg-alt);}
.timeline{position:relative; padding-left:36px; border-left:1px solid var(--line); margin-top:20px;}
.t-item{position:relative; padding-bottom:48px;}
.t-item:last-child{padding-bottom:0;}
.t-item::before{
  content:''; position:absolute; left:-42px; top:4px; width:12px; height:12px;
  border-radius:50%; background:var(--white); border:2px solid var(--accent);
}
.t-date{font-family:'JetBrains Mono',monospace; font-size:0.72rem; letter-spacing:0.05em; color:var(--accent); text-transform:uppercase; margin-bottom:8px; display:block;}
.t-item h3{font-size:1.18rem; margin-bottom:6px; font-weight:600;}
.t-item p{color:var(--ink-soft); font-size:0.96rem; max-width:600px;}

.cv-callout{
  margin-top:52px; padding:28px 32px; border-radius:var(--radius);
  background:var(--white); border:1px solid var(--line);
  display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
}
.cv-callout p{color:var(--ink-soft); font-size:0.94rem;}
.cv-callout strong{color:var(--ink); font-weight:600; display:block; margin-bottom:4px; font-family:'Space Grotesk',sans-serif; font-size:1.05rem;}

/* ---------- Publications ---------- */
.pub-list{display:flex; flex-direction:column; gap:0; margin-top:20px; border-top:1px solid var(--line);}
.pub-item{
  display:grid; grid-template-columns:90px 1fr auto; gap:24px; align-items:start;
  padding:28px 0; border-bottom:1px solid var(--line);
}
.pub-year{font-family:'JetBrains Mono',monospace; color:var(--accent); font-size:0.92rem; padding-top:2px;}
.pub-item h3{font-size:1.05rem; font-weight:600; margin-bottom:6px; line-height:1.35;}
.pub-item p{color:var(--ink-soft); font-size:0.9rem;}
.pub-status{
  font-family:'JetBrains Mono',monospace; font-size:0.65rem; text-transform:uppercase; letter-spacing:0.05em;
  padding:6px 12px; border-radius:999px; background:var(--accent-soft); color:var(--accent);
  height:fit-content; white-space:nowrap;
}

/* ---------- Focus areas ---------- */
.focus-list{border-top:1px solid var(--line); margin-top:20px;}
.focus-item{display:grid; grid-template-columns:70px 1fr; gap:24px; padding:28px 0; border-bottom:1px solid var(--line); align-items:start;}
.focus-num{font-family:'JetBrains Mono',monospace; color:var(--accent); font-size:1rem; padding-top:2px;}
.focus-item h3{font-size:1.08rem; font-weight:600; margin-bottom:6px;}
.focus-item p{color:var(--ink-soft); font-size:0.92rem; max-width:580px;}

/* ---------- Values ---------- */
.values-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
  background:var(--line); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;
  margin-top:20px;
}
.value-card{background:var(--white); padding:34px 28px;}
.value-num{font-family:'JetBrains Mono',monospace; color:var(--ink-faint); font-size:0.82rem;}
.value-card h3{font-size:1.05rem; margin:12px 0 8px;}
.value-card p{color:var(--ink-soft); font-size:0.88rem; line-height:1.55;}

/* ---------- Notes / mini blog ---------- */
.notes-list{display:flex; flex-direction:column; margin-top:20px; border-top:1px solid var(--line);}
.note-item{padding:30px 0; border-bottom:1px solid var(--line);}
.note-date{font-family:'JetBrains Mono',monospace; font-size:0.72rem; color:var(--accent); text-transform:uppercase; letter-spacing:0.05em; margin-bottom:8px; display:block;}
.note-item h3{font-size:1.08rem; font-weight:600; margin-bottom:8px;}
.note-item p{color:var(--ink-soft); font-size:0.94rem; max-width:640px; margin-bottom:14px;}
.note-item p:last-child{margin-bottom:0;}
.note-langs{display:flex; gap:6px; margin-bottom:16px;}
.note-lang-btn{
  font-family:'JetBrains Mono',monospace; font-size:0.68rem; letter-spacing:0.05em;
  text-transform:uppercase; padding:5px 12px; border-radius:999px; cursor:pointer;
  background:transparent; color:var(--ink-faint); border:1px solid var(--line);
  transition:all 0.15s ease;
}
.note-lang-btn:hover{color:var(--accent); border-color:var(--accent);}
.note-lang-btn.active{background:var(--accent); color:#fff; border-color:var(--accent);}
.note-body{display:none;}
.note-body.active{display:block;}
.note-body h4{font-size:0.95rem; font-weight:600; color:var(--ink); margin:20px 0 8px;}
.note-body h4:first-of-type{margin-top:0;}
.note-chart{margin:18px 0; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line);}
.note-chart img{width:100%;}
.note-chart figcaption{font-size:0.78rem; color:var(--ink-faint); padding:10px 16px; background:var(--white);}
.note-refs{font-size:0.78rem; color:var(--ink-faint); margin-top:18px; line-height:1.7;}
.note-refs summary{cursor:pointer; color:var(--accent); font-family:'JetBrains Mono',monospace; font-size:0.72rem; letter-spacing:0.04em; text-transform:uppercase; margin-bottom:10px;}
.note-refs ol{padding-left:20px; margin-top:8px;}

/* ---------- Recognition ---------- */
.rec-grid{
  display:flex; flex-wrap:wrap; gap:1px;
  background:var(--line); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;
  margin-top:20px;
}
.rec-cell{background:var(--white); padding:26px 24px; flex:1 1 260px;}
.rec-cell .rname{font-weight:600; font-size:0.94rem; margin-bottom:6px; line-height:1.35;}
.rec-cell .rrole{color:var(--ink-soft); font-size:0.83rem; line-height:1.5;}

/* ---------- Interests / Languages ---------- */
.two-col{display:grid; grid-template-columns:1fr 1fr; gap:64px;}
.chip-row{display:flex; flex-wrap:wrap; gap:10px; margin-top:18px;}
.chip{
  font-size:0.85rem; padding:8px 16px; border-radius:999px; border:1px solid var(--line);
  color:var(--ink-soft); background:var(--white);
}
.lang-row{display:flex; justify-content:space-between; padding:14px 0; border-bottom:1px solid var(--line); font-size:0.94rem;}
.lang-row:last-child{border-bottom:none;}
.lang-row .level{color:var(--accent); font-family:'JetBrains Mono',monospace; font-size:0.78rem;}

/* ---------- Footer / contact ---------- */
footer.contact-footer{background:var(--ink); color:#EDEEEA; padding:90px 0 40px;}
.footer-top{display:grid; grid-template-columns:1.3fr 1fr; gap:60px; padding-bottom:60px; border-bottom:1px solid rgba(255,255,255,0.12);}
footer h2{color:#fff; font-size:2.4rem; margin-bottom:20px;}
footer .lede{color:#B7BBB8; max-width:440px; font-size:1.02rem; margin-bottom:32px;}
.footer-btn{
  background:var(--accent-bright); color:#fff; padding:13px 26px; border-radius:999px;
  display:inline-flex; align-items:center; gap:8px; font-weight:500; font-size:0.94rem;
  transition:background .2s;
}
.footer-btn:hover{background:var(--accent);}
.footer-links .flabel{color:#7D817E; font-size:0.72rem; text-transform:uppercase; letter-spacing:0.08em; font-family:'JetBrains Mono',monospace; margin-bottom:16px;}
.footer-links a{display:block; color:#EDEEEA; font-size:0.98rem; padding:8px 0; border-bottom:1px solid rgba(255,255,255,0.08); transition:color .2s;}
.footer-links a:hover{color:var(--accent-bright);}
.footer-bottom{display:flex; justify-content:space-between; align-items:center; padding-top:28px; flex-wrap:wrap; gap:14px;}
.footer-bottom p{color:#7D817E; font-size:0.82rem;}
.footer-wordmark{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.6rem; color:#fff; margin-bottom:8px;}

/* ---------- Slim sitewide footer (non-contact pages) ---------- */
.slim-footer{background:var(--ink); color:#B7BBB8; padding:48px 0 28px;}
.slim-footer .slim-top{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:20px; padding-bottom:26px; border-bottom:1px solid rgba(255,255,255,0.12);}
.slim-footer .slim-nav{display:flex; gap:26px; flex-wrap:wrap; font-size:0.9rem;}
.slim-footer .slim-nav a:hover{color:#fff;}
.slim-footer .slim-cta{background:var(--accent-bright); color:#fff; padding:10px 20px; border-radius:999px; font-size:0.86rem; font-weight:500; display:inline-flex; align-items:center; gap:8px; transition:background .2s;}
.slim-footer .slim-cta:hover{background:var(--accent);}
.slim-footer .slim-bottom{display:flex; justify-content:space-between; align-items:center; padding-top:22px; flex-wrap:wrap; gap:10px; font-size:0.8rem; color:#7D817E;}
.slim-footer .footer-wordmark{font-size:1.2rem; margin-bottom:0;}

/* ---------- Reveal on scroll ---------- */
.reveal{opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease;}
.reveal.in{opacity:1; transform:translateY(0);}

@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1; transform:none; transition:none;}
  html{scroll-behavior:auto;}
}

/* ---------- Responsive ---------- */
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr; gap:40px;}
  .portrait-frame{max-width:340px; margin:0 auto;}
  .stats-grid{grid-template-columns:repeat(2,1fr);}
  .rec-cell{flex-basis:45%;}
  .values-grid{grid-template-columns:1fr 1fr;}
  .two-col{grid-template-columns:1fr; gap:40px;}
  .footer-top{grid-template-columns:1fr;}
  .nav{flex-wrap:wrap; row-gap:14px;}
  .brand{flex:1 1 100%;}
  nav.links{flex:1 1 100%; gap:22px; overflow-x:auto; -webkit-overflow-scrolling:touch; max-width:100%;}
  nav.links::-webkit-scrollbar{display:none;}
  .brand-text .tag{display:none;}
  header .nav > .cta-contact{display:none;}
  .mobile-contact-link{display:inline-block !important;}
  .slim-footer .slim-top{flex-direction:column; align-items:flex-start;}
}
@media (max-width:600px){
  .wrap{padding:0 22px;}
  section{padding:80px 0;}
  .hero-copy h1{font-size:2.2rem;}
  .stats-grid{grid-template-columns:1fr;}
  .pub-item{grid-template-columns:1fr; gap:8px;}
  .focus-item{grid-template-columns:1fr; gap:8px;}
  .rec-cell{flex-basis:100%;}
  .values-grid{grid-template-columns:1fr;}
  .nav{padding:16px 22px;}
  .cta-btn{padding:9px 16px; font-size:0.8rem;}
}