:root{--ink:#14213d;--teal:#0f766e;--teal-d:#0b5a54;--paper:#f7f8fb;--white:#fff;--text:#2b3550;--muted:#5d6882;--line:#dde2ec;--serif:'Newsreader',Georgia,serif;--sans:'Hanken Grotesk',system-ui,sans-serif}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{font:17px/1.7 var(--sans);color:var(--text);background:var(--white)}
a{color:var(--teal-d);text-underline-offset:3px}
a:hover{color:var(--ink)}
:focus-visible{outline:3px solid var(--teal);outline-offset:2px}
h1,h2,h3{font-family:var(--serif);color:var(--ink);line-height:1.2;font-weight:600}
h1{font-size:clamp(2.3rem,5vw,3.6rem);letter-spacing:-.01em}
h2{font-size:clamp(1.8rem,3vw,2.3rem);margin-bottom:22px}
h3{font-size:1.2rem;margin:0 0 8px}
p+p{margin-top:14px}
.wrap{width:min(1080px,90%);margin-inline:auto}
.narrow{max-width:760px}
.sec{padding:80px 0}
.alt{background:var(--paper);border-block:1px solid var(--line)}
.skip{position:absolute;left:-999px}
.skip:focus{left:10px;top:10px;background:var(--white);padding:8px 14px;z-index:99}
.meta,.sub{color:var(--muted);font-size:.93rem}
.sub{margin:-10px 0 22px}

.top{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.top nav{display:flex;justify-content:space-between;align-items:center;min-height:66px}
.brand{font:600 1.35rem var(--serif);color:var(--ink);text-decoration:none}
.top ul{display:flex;gap:26px;list-style:none}
.top ul a{text-decoration:none;color:var(--text);font-size:.95rem;font-weight:500;padding:6px 0;border-bottom:2px solid transparent}
.top ul a:hover,.top ul a.active{color:var(--teal-d);border-color:var(--teal)}
.menu{display:none;font:inherit;background:none;border:1px solid var(--line);border-radius:8px;padding:6px 14px;color:var(--ink);cursor:pointer}

.hero{background:var(--ink);color:#d6dcea;padding:70px 0 0}
.hero h1{color:var(--white);max-width:16ch}
.hero-grid{display:grid;grid-template-columns:1.4fr .8fr;gap:60px;align-items:center}
.role{color:#8fd3cb;font-weight:500;margin-bottom:14px}
.lead{font-size:1.15rem;max-width:52ch;margin:20px 0 28px}
.actions{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-block;padding:12px 22px;border-radius:8px;background:var(--teal);color:var(--white);font-weight:700;text-decoration:none;border:2px solid var(--teal)}
.btn:hover{background:var(--teal-d);border-color:var(--teal-d);color:var(--white)}
.btn.ghost{background:none;border-color:#6b7894;color:var(--white)}
.btn.ghost:hover{background:rgba(255,255,255,.1);border-color:var(--white)}
.portrait{position:relative;width:min(320px,80%);aspect-ratio:1;margin:auto;border-radius:50%;overflow:hidden;border:6px solid rgba(255,255,255,.12)}
.portrait img,.ct{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ct{background:radial-gradient(circle at 38% 42%,#d9eeea 0 7%,transparent 8%),radial-gradient(circle at 62% 48%,#b8d9d4 0 9%,transparent 10%),radial-gradient(ellipse 36% 44% at 36% 50%,#355a66 0 60%,transparent 62%),radial-gradient(ellipse 36% 44% at 64% 50%,#355a66 0 60%,transparent 62%),radial-gradient(circle,#1e3a52 0 48%,#0c1a2e 70%)}
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:60px;border-top:1px solid #2e3d61;padding:26px 0 34px}
.facts b{display:block;font:600 2rem var(--serif);color:var(--white)}
.facts span{font-size:.9rem}

.rows article{padding:24px 0 24px 22px;border-left:3px solid var(--teal);margin-bottom:18px}
.rows article p{max-width:75ch}
.rows .meta{margin-top:8px}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.tags span{background:var(--white);border:1px solid var(--line);border-radius:20px;padding:4px 14px;font-size:.88rem}

.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.filters button{font:inherit;font-size:.92rem;padding:6px 16px;border-radius:20px;border:1px solid var(--line);background:var(--white);color:var(--text);cursor:pointer}
.filters button.on{background:var(--ink);color:var(--white);border-color:var(--ink)}
.pubs{list-style:none;border-top:1px solid var(--line)}
.pubs li{display:grid;grid-template-columns:60px 1fr;gap:12px;padding:16px 0;border-bottom:1px solid var(--line)}
.pubs .y{font:600 1.1rem var(--serif);color:var(--teal-d)}
.pubs .t{font-weight:700;color:var(--ink);line-height:1.4}
.pubs .a,.pubs .v{font-size:.93rem;color:var(--muted)}
.pubs .a strong{color:var(--text)}
.pubs .d{font-size:.88rem}
.two{display:grid;grid-template-columns:1fr 1fr;gap:50px;margin-top:50px}
#teaching .two,#background .two{margin-top:0}
.two h3:not(:first-child){margin-top:26px}
.plain{list-style:none}
.plain li{padding:5px 0 5px 16px;position:relative}
.plain li::before{content:"";position:absolute;left:0;top:.95em;width:6px;height:6px;border-radius:50%;background:var(--teal)}
.time{list-style:none;border-left:2px solid var(--line);padding-left:18px}
.time li{margin-bottom:14px;line-height:1.5}
.time em{display:block;color:var(--muted);font-size:.9rem;font-style:normal}
.contact{margin:16px 0 22px}
.links{display:flex;flex-wrap:wrap;gap:8px 24px}
footer{padding:30px 0;color:var(--muted);font-size:.9rem;border-top:1px solid var(--line)}

@media(max-width:820px){
 .hero-grid,.two{grid-template-columns:1fr;gap:34px}
 .portrait{order:-1;width:200px}
 .facts{grid-template-columns:1fr 1fr}
 .menu{display:block}
 .top ul{display:none;position:absolute;top:66px;left:0;right:0;background:var(--white);flex-direction:column;gap:0;padding:8px 5%;border-bottom:1px solid var(--line)}
 .top ul.open{display:flex}
 .top ul a{display:block;padding:12px 0}
 .sec{padding:56px 0}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.philosophy{margin-top:56px;padding-top:40px;border-top:1px solid var(--line);max-width:820px}
.philosophy blockquote{font:500 clamp(1.4rem,3vw,1.9rem)/1.35 var(--serif);color:var(--teal-d);margin:6px 0 18px;padding-left:20px;border-left:3px solid var(--teal)}
.philosophy details{margin-top:14px}
.philosophy summary{cursor:pointer;color:var(--teal-d);font-weight:700;padding:4px 0}
.philosophy details p{margin-top:14px}

.statement{font-size:1.1rem;max-width:72ch;margin:-6px 0 26px}
.flow{list-style:none;display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin:14px 0 30px}
.flow li{background:var(--white);border:1px solid var(--line);border-top:3px solid var(--teal);border-radius:8px;padding:12px;font-size:.85rem;line-height:1.4;position:relative}
.flow b{display:block;color:var(--ink);font-size:.95rem;margin-bottom:4px}
.flow li:not(:last-child)::after{content:"\2192";position:absolute;right:-11px;top:50%;transform:translateY(-50%);color:var(--teal-d);font-weight:700;background:var(--paper);z-index:1;line-height:1}
.collab{margin-top:32px;padding:18px 22px;background:var(--white);border:1px solid var(--line);border-left:4px solid var(--teal);border-radius:8px}
.collab b{display:block;color:var(--ink);font-family:var(--serif);font-size:1.15rem}
.scroll{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:8px;z-index:60}
.scroll button{width:44px;height:44px;border-radius:50%;border:0;background:var(--ink);color:var(--white);font-size:.95rem;cursor:pointer;box-shadow:0 2px 10px rgba(20,33,61,.3)}
.scroll button:hover{background:var(--teal)}
.scroll button[hidden]{display:none}
@media(max-width:820px){
 .flow{grid-template-columns:1fr;gap:20px}
 .flow li:not(:last-child)::after{content:"\2193";right:50%;top:auto;bottom:-17px;transform:translateX(50%)}
}

.slider{position:relative;--h:440px}
.track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding-bottom:6px;scrollbar-width:thin}
.track figure{flex:0 0 auto;scroll-snap-align:start}
.track img{height:var(--h);width:auto;max-width:86vw;object-fit:contain;border-radius:10px;display:block;background:var(--line)}
.track figcaption{font-size:.9rem;color:var(--muted);padding-top:8px;max-width:min(420px,86vw)}
.sbtns{position:absolute;left:0;right:0;top:calc(var(--h)/2 - 22px);display:flex;justify-content:space-between;padding:0 10px;pointer-events:none}
.sbtns button{pointer-events:auto;width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.92);color:var(--ink);font-size:1.1rem;cursor:pointer;box-shadow:0 2px 10px rgba(20,33,61,.3)}
.sbtns button:hover{background:var(--ink);color:var(--white)}
@media(max-width:820px){.slider{--h:340px}}
@media(prefers-reduced-motion:reduce){.track{scroll-behavior:auto}}

.banner{margin:0 0 40px}
.banner img{width:100%;height:auto;display:block;border-radius:12px;box-shadow:0 6px 24px rgba(20,33,61,.18)}

.brand{font-size:1.7rem}
.hero h1.name{font-size:clamp(3rem,9vw,5.4rem);line-height:1.02;max-width:none;margin-bottom:10px}
.hero .role{font-size:1.1rem;margin:0 0 18px}
.tagline{font:500 clamp(1.4rem,3vw,2rem)/1.25 var(--serif);color:var(--white);max-width:24ch}
.hero .lead{margin-top:14px}

/* Social profile icons in the top navigation */
/* Refined social profile links */
.social-links {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-left: 36px;
  padding-left: 28px;
  border-left: 1px solid var(--line);
  flex-shrink: 0;
}

.social-links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 36px;
  color: var(--ink);
  text-decoration: none;
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
  transition: color .2s ease, transform .2s ease;
}

.social-links a:hover {
  color: var(--teal);
  transform: translateY(-2px);
}

/* Navigation spacing: seven links plus profile icons */
@media (min-width: 821px) { .top ul { gap: 22px; } }
@media (min-width: 821px) and (max-width: 1000px) { .top ul { gap: 16px; } .brand { font-size: 1.45rem; } }
@media (max-width: 1199px) { .social-links { display: none; } }
@media (min-width: 1200px) { .brand { font-size: 1.6rem; } .social-links { margin-left: 24px; padding-left: 20px; gap: 12px; } }

/* Collaborators */
.collabs{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:18px;margin:6px 0 24px}
.cc{display:flex;gap:18px;align-items:flex-start;padding:22px;background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--teal);border-radius:10px}
.cc .num{font:600 3rem/1 var(--serif);color:var(--teal-d);min-width:1.1em}
.cc h3{margin-bottom:4px}
.linkbtn{font:inherit;font-weight:700;color:var(--teal-d);background:none;border:0;padding:6px 0 0;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.linkbtn:hover{color:var(--ink)}
.allco{margin:0 0 18px}
.allco summary{cursor:pointer;color:var(--teal-d);font-weight:700}
.chipbtn{font:inherit;font-size:.88rem;background:var(--white);border:1px solid var(--line);border-radius:20px;padding:4px 14px;color:var(--text);cursor:pointer}
.chipbtn:hover{border-color:var(--teal);color:var(--teal-d)}
#authorNote{margin:0 0 14px}

.where{margin-top:20px;font-size:.95rem;color:#b7c2dd}