:root{--paper:#fafaf6;--white:#fff;--ink:#252e29;--muted:#626d65;--green:#215746;--tint:#eef2ec;--line:#dce1d8;--radius:12px;--max:1100px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;font-size:17px;line-height:1.75;-webkit-font-smoothing:antialiased}a{color:var(--green);text-underline-offset:5px;text-decoration-thickness:1px;overflow-wrap:anywhere}a:hover{text-decoration:underline}a:focus-visible,summary:focus-visible{outline:3px solid var(--green);outline-offset:5px;border-radius:3px}img{display:block;max-width:100%;height:auto}h1,h2,h3,p{margin-top:0}h1,h2,h3{line-height:1.35;font-weight:600;letter-spacing:-.03em}h1{font-size:clamp(2.25rem,5vw,3.65rem);margin-bottom:22px}h2{font-size:1.7rem;margin-bottom:22px}h3{font-size:1.3rem;margin-bottom:12px}p{margin-bottom:18px}ul{padding-left:1.25em}li{margin-bottom:9px}.container{width:min(var(--max),calc(100% - 64px));margin-inline:auto}.skip{position:fixed;top:-100px;left:16px;z-index:10;padding:8px 16px;background:var(--white)}.skip:focus{top:16px}.site-header{border-bottom:1px solid var(--line)}.header-inner{min-height:96px;display:flex;justify-content:space-between;align-items:center;gap:32px}.brand{display:flex;align-items:center;gap:13px;font-weight:650;color:var(--ink);text-decoration:none;white-space:nowrap}.brand-mark{display:grid;place-items:center;width:36px;height:36px;background:var(--green);color:white;border-radius:50%;font-size:.82rem;letter-spacing:.03em}nav{display:flex;align-items:center;gap:32px}nav a{color:var(--muted);font-size:.94rem;text-decoration:none;padding:7px 0;white-space:nowrap;border-bottom:2px solid transparent}nav a[aria-current=page]{color:var(--green);border-bottom-color:var(--green)}.eyebrow{font-size:.85rem;font-weight:600;letter-spacing:.08em;color:var(--green);margin-bottom:22px}.hero{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:72px;padding-block:80px 76px;align-items:center}.hero-name{font-family:Georgia,"Times New Roman",serif;font-size:clamp(3rem,5.5vw,4.4rem);letter-spacing:-.055em;font-weight:400;line-height:1.1;margin:0 0 16px;color:var(--green)}.hero-title{font-size:clamp(1.85rem,3.6vw,2.5rem);margin-bottom:25px;white-space:pre-line}.hero-copy{max-width:650px;color:var(--muted)}.hero-copy p:last-child{margin-bottom:0}.actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px;margin-top:30px}.button{display:inline-flex;justify-content:center;align-items:center;min-height:48px;background:var(--green);color:white;padding:9px 22px;border-radius:6px;text-decoration:none;font-size:.96rem;transition:background .15s}.button:hover{background:#163f32;text-decoration:none}.text-link{font-weight:550;text-decoration:underline}.field-note{border-top:2px solid var(--green);padding:25px 0 0}.field-note .label{font-size:.82rem;letter-spacing:.04em;color:var(--muted);margin-bottom:14px}.field-note h2{font-size:1.06rem;margin-bottom:8px}.field-note p{font-size:.92rem;color:var(--muted);margin-bottom:24px}.focus-list{list-style:none;padding:0;margin:0}.focus-list li{padding:10px 0;margin:0;border-bottom:1px solid var(--line);font-size:.97rem}.focus-list li:last-child{border:0}.section{padding-block:52px 64px;border-top:1px solid var(--line)}.section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:24px;margin-bottom:28px}.section-heading h2{margin:0}.section-heading a{font-size:.93rem}.section-intro{max-width:720px;color:var(--muted)}.project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}.project-card{min-width:0;padding:29px 30px 27px;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);display:flex;flex-direction:column;align-items:flex-start}.project-meta{display:flex;flex-wrap:wrap;gap:8px 16px;font-size:.82rem;color:var(--muted);margin-bottom:22px}.project-index{font-family:Georgia,serif;font-size:1.3rem;color:var(--green);line-height:1}.project-card h3{margin-bottom:14px}.project-card h3 a{color:var(--ink);text-decoration:none}.project-card h3 a:hover{color:var(--green)}.project-summary{color:var(--muted);margin-bottom:18px}.role{font-size:.94rem;margin-bottom:24px}.role strong{font-weight:600;color:var(--green)}.tags{display:flex;flex-wrap:wrap;gap:8px 14px;color:var(--muted);font-size:.82rem;list-style:none;padding:0;margin:0 0 22px}.tags li{margin:0}.tags li:not(:last-child)::after{content:" /";color:#909a92;padding-left:12px}.project-card .text-link{margin-top:auto;font-size:.92rem}.project-image{width:100%;height:auto;border:1px solid var(--line);border-radius:7px;margin-bottom:22px}.page-header{padding:64px 0 40px;max-width:850px}.page-header .eyebrow{margin-bottom:16px}.page-header p{color:var(--muted);max-width:720px;margin-bottom:0}.reading{max-width:780px}.reading p{overflow-wrap:anywhere}.body-section{padding-block:36px 42px;border-top:1px solid var(--line)}.body-section h2{font-size:1.5rem}.about-intro{padding-top:12px;padding-bottom:38px}.portrait{width:220px;border-radius:var(--radius);margin-bottom:24px}.timeline{margin:0;padding:0;list-style:none}.timeline>li{margin:0;padding:0 0 32px 24px;border-left:1px solid var(--line);position:relative}.timeline>li:last-child{padding-bottom:0}.timeline>li::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--green);position:absolute;left:-4px;top:10px}.timeline .date{color:var(--muted);font-size:.85rem;margin-bottom:5px}.timeline h3{font-size:1.1rem;margin-bottom:5px}.timeline p{font-size:.96rem;margin:0 0 8px}.timeline ul{font-size:.94rem;color:var(--muted);margin-top:10px}.muted{color:var(--muted)}.pending-text{color:var(--muted);font-size:.94rem}.publications{font-size:.91rem;list-style:none;padding:0}.publications li{margin-bottom:24px}.publications .pub-title{color:var(--ink);font-weight:600;display:block}.publications p{margin:6px 0 0;overflow-wrap:anywhere}.pending-box{background:var(--tint);padding:20px 24px;border-radius:6px;font-size:.93rem}.pending-box summary{cursor:pointer;font-weight:600}.pending-box ul{margin-bottom:0}.site-footer{border-top:1px solid var(--line);margin-top:32px;padding-block:32px 38px}.footer-inner{display:flex;justify-content:space-between;align-items:flex-start;gap:28px}.footer-name{margin:0 0 4px;font-weight:600}.footer-note{font-size:.83rem;color:var(--muted);margin:0}.contact-links{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px 24px;max-width:630px;font-size:.91rem}.contact-links a{text-decoration:none}.contact-links a:hover{text-decoration:underline}.list-page{padding-bottom:40px}.back-link{display:inline-block;font-size:.93rem;margin-bottom:26px}.detail-header{max-width:850px;padding-block:44px 32px}.detail-header h1{font-size:clamp(2rem,4vw,3rem)}.detail-summary{font-size:1.1rem;color:var(--muted);max-width:700px}.detail-meta{display:flex;flex-wrap:wrap;gap:10px 26px;font-size:.9rem;color:var(--muted);margin:24px 0}.detail-layout{display:grid;grid-template-columns:minmax(0,760px) 230px;gap:70px;align-items:start}.detail-nav{border-top:1px solid var(--line);padding-top:23px;position:sticky;top:25px}.detail-nav p{font-size:.85rem;color:var(--muted);margin-bottom:10px}.detail-nav a{display:block;text-decoration:none;font-size:.91rem;padding-block:6px}.detail-nav a:hover{text-decoration:underline}.detail-main .body-section:first-child{padding-top:28px}.measurement-note{border-left:2px solid var(--green);padding-left:18px;color:var(--muted);font-size:.89rem;margin-top:24px}.resume-header .actions{margin-top:25px}.resume-section{padding-block:32px;border-top:1px solid var(--line)}.resume-entry{margin-bottom:32px}.resume-entry:last-child{margin-bottom:0}.entry-top{display:flex;justify-content:space-between;align-items:baseline;gap:20px}.entry-top h3{font-size:1.1rem;margin-bottom:5px}.entry-top .date{color:var(--muted);font-size:.85rem;flex-shrink:0}.entry-subtitle{color:var(--muted);font-size:.92rem;margin-bottom:12px}.resume-entry ul{font-size:.96rem;margin-top:0;margin-bottom:12px}.skill-group{margin-bottom:24px}.skill-group h3{font-size:1.05rem;margin-bottom:8px}.skill-group p{font-size:.96rem;margin-bottom:8px}.skill-group .application{font-size:.89rem;color:var(--muted)}.error-page{padding:96px 0 128px;max-width:670px}.error-code{font-family:Georgia,serif;font-size:4rem;color:var(--green);margin-bottom:12px;line-height:1}.error-page h1{font-size:2rem}.compact-tags{display:flex;flex-wrap:wrap;gap:12px 28px;list-style:none;padding:0}.compact-tags li{margin:0;color:var(--green)}
.practice-header{max-width:850px;padding-bottom:42px}.practice-header p{max-width:730px}.practice-list{border-top:1px solid var(--line);padding-top:34px;padding-bottom:48px}.practice-card{padding:30px 32px;gap:0}.practice-context{display:flex;align-items:baseline;justify-content:space-between;gap:16px;width:100%;color:var(--green);font-size:.85rem;letter-spacing:.02em;margin-bottom:22px}.practice-number{font-family:Georgia,serif;font-size:1.15rem;color:var(--muted);letter-spacing:0}.practice-card h2{font-size:1.42rem;margin-bottom:12px;letter-spacing:-.025em}.practice-card h2 a{color:var(--ink);text-decoration:none}.practice-card h2 a:hover{color:var(--green);text-decoration:underline}.practice-source{font-size:.84rem;line-height:1.7;color:var(--muted);margin-bottom:20px}.practice-card .project-summary{margin-bottom:24px;color:var(--ink)}.practice-work{margin-bottom:20px}.practice-work h3{font-size:.92rem;letter-spacing:0;color:var(--green);margin-bottom:10px}.practice-work ul{margin:0;font-size:.94rem;padding-left:1.15em}.practice-work li{margin-bottom:6px}.practice-work li:last-child{margin-bottom:0}.practice-work li::marker{color:var(--green)}.practice-delivery{font-size:.92rem;color:var(--muted);margin-top:auto;margin-bottom:22px;line-height:1.7}.practice-delivery span{display:block;color:var(--ink);font-size:.85rem;font-weight:600;margin-bottom:5px}.practice-bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 16px;width:100%;padding-top:18px;border-top:1px solid var(--line)}.practice-bottom .tags{margin:0;font-size:.82rem;gap:6px 12px}.practice-bottom .tags li:not(:last-child)::after{padding-left:10px}.practice-bottom .text-link{margin:0;white-space:nowrap;font-size:.9rem}
@media(min-width:1440px){.hero{padding-block:90px}.hero-name{font-size:4.6rem}}
@media(max-width:1000px){.hero{grid-template-columns:minmax(0,1fr) 220px;gap:40px}.detail-layout{grid-template-columns:minmax(0,1fr) 180px;gap:35px}nav{gap:22px}.project-card{padding:26px}}
@media(max-width:760px){.container{width:calc(100% - 40px)}.header-inner{flex-direction:column;align-items:flex-start;gap:12px;padding-block:20px 14px;min-height:auto}nav{width:100%;gap:0;justify-content:space-between}nav a{font-size:.9rem}.hero{grid-template-columns:1fr;padding-block:46px;gap:34px}.hero-name{font-size:3.5rem}.hero-title{font-size:2rem}.field-note{display:none}.project-grid{grid-template-columns:1fr}.section{padding-block:36px 42px}.section-heading{align-items:center;gap:16px}.section-heading h2{font-size:1.5rem}.project-card{padding:25px}.page-header{padding-block:42px 30px}.footer-inner{flex-direction:column;gap:22px}.contact-links{justify-content:flex-start;gap:8px 20px}.detail-layout{grid-template-columns:1fr;gap:0}.detail-nav{display:none}.detail-header{padding-top:30px}.entry-top{display:block}.entry-top .date{display:block;margin-bottom:6px}.body-section{padding-block:28px 32px}.site-footer{margin-top:20px}.error-page{padding-block:64px 90px}}
@media(max-width:380px){.container{width:calc(100% - 32px)}.hero-name{font-size:3rem}.hero-title{font-size:1.75rem}.project-card{padding:22px}nav a{font-size:.85rem}.section-heading{align-items:flex-start;flex-direction:column;gap:8px}}
@media(max-width:760px){.practice-header{padding-bottom:28px}.practice-list{padding-top:25px}.practice-card{padding:25px}.practice-context{margin-bottom:18px}.practice-card h2{font-size:1.32rem}.practice-card .project-summary{margin-bottom:20px}.practice-work{margin-bottom:20px}.practice-delivery{margin-bottom:20px}.practice-bottom{gap:14px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}
@media print{body{background:white;color:black;font-size:11pt}.container{width:100%;max-width:none}.site-header,.site-footer,.actions,.back-link,.detail-nav,.skip{display:none}.page-header{padding:0 0 20px}h1{font-size:24pt}h2{font-size:16pt}.resume-section,.body-section{padding-block:15px}.resume-entry,.project-card{break-inside:avoid}.detail-layout{display:block}a{color:inherit;text-decoration:none}}

/* Personal identity, clear reading, and small purposeful interactions. */
:root {
  --ink: #19382e;
  --muted: #67736a;
  --lime: #c3e45b;
  --tint: #f0f3e9;
  --line: #dde3d8;
  --radius: 18px;
  --max: 1200px;
}
html { scroll-padding-top: 110px; }
body { font-size: 16px; line-height: 1.8; }
button, input, textarea { font: inherit; }
button { cursor: pointer; }
[hidden] { display: none !important; }
.skip { z-index: 50; }
::selection { background: var(--lime); color: var(--ink); }
a, button, summary { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible, summary:focus-visible {
  outline: 3px solid var(--green);
  outline-offset: 5px;
  border-radius: 5px;
}
.container { width: min(var(--max), calc(100% - 96px)); }
.site-header {
  position: sticky;
  top: 0;
  z-index: 30;
  background: rgba(250, 250, 246, .9);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
  transition: box-shadow 180ms ease, background 180ms ease;
}
.site-header.is-scrolled {
  background: rgba(250, 250, 246, .96);
  box-shadow: 0 7px 24px rgba(25, 56, 46, .045);
}
.header-inner { min-height: 84px; gap: 24px; }
.brand { min-height: 44px; font-size: .96rem; letter-spacing: -.02em; }
.brand:hover { text-decoration: none; }
.brand-mark {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  font-size: .78rem;
  transition: transform 180ms ease, background 180ms ease;
}
.brand:hover .brand-mark { transform: rotate(-7deg); background: #173d30; }
.header-inner nav { gap: 28px; }
.header-inner nav a {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 8px 2px;
  border: 0;
  transition: color 180ms ease;
}
.header-inner nav a::after {
  content: "";
  position: absolute;
  bottom: 4px;
  left: 2px;
  right: 2px;
  height: 2px;
  background: var(--green);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 180ms ease;
}
.header-inner nav a:hover { color: var(--green); text-decoration: none; }
.header-inner nav a:hover::after,
.header-inner nav a[aria-current="page"]::after { transform: scaleX(1); }
.scroll-progress {
  position: fixed;
  inset: 0 0 auto;
  z-index: 40;
  height: 3px;
  background: var(--green);
  transform: scaleX(var(--scroll-progress, 0));
  transform-origin: left;
  pointer-events: none;
}
.hero {
  position: relative;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 370px);
  gap: 64px;
  padding-block: 76px 68px;
  align-items: center;
}
.hero-intro { min-width: 0; }
.hero-kicker, .hero-intro > .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 24px;
  color: var(--green);
  font-size: .79rem;
  font-weight: 650;
  letter-spacing: .07em;
}
.hero-kicker::before, .hero-intro > .eyebrow::before {
  content: "";
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  background: var(--green);
  border-radius: 50%;
  box-shadow: 0 0 0 5px #eaf0db;
}
.hero-name {
  font-family: inherit;
  font-size: clamp(4.3rem, 7.2vw, 6.1rem);
  font-weight: 750;
  line-height: 1.02;
  letter-spacing: -.075em;
  color: var(--ink);
  margin-bottom: 25px;
}
.hero-title {
  font-size: clamp(1.7rem, 2.75vw, 2.35rem);
  font-weight: 550;
  line-height: 1.5;
  letter-spacing: -.045em;
  margin-bottom: 24px;
}
.hero-copy { max-width: 570px; font-size: .97rem; line-height: 1.9; }
.hero-copy p { margin-bottom: 13px; }
.hero .actions { margin-top: 29px; gap: 12px 25px; }
.button {
  gap: 19px;
  padding: 11px 23px;
  min-height: 50px;
  border: 1px solid var(--green);
  border-radius: 8px;
  font-size: .9rem;
  font-weight: 600;
  transition: background 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}
.button::after { content: none; }
.button > span[aria-hidden] { font-size: 1.18rem; font-weight: 400; line-height: 1; }
.button:hover { transform: translateY(-2px); box-shadow: 0 7px 18px rgba(33, 87, 70, .13); }
.button.secondary, .button.button-secondary { color: var(--green); background: transparent; border-color: #c6d1c4; }
.button.secondary:hover, .button.button-secondary:hover { background: var(--tint); }
.text-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  gap: 9px;
  text-decoration: none;
  font-size: .91rem;
}
.text-link::after { content: none; }
.text-link > span[aria-hidden] { transition: transform 180ms ease; }
.text-link:hover { text-decoration: none; }
.text-link:hover > span[aria-hidden] { transform: translate(2px, -2px); }
.focus-explorer {
  position: relative;
  isolation: isolate;
  min-width: 0;
  min-height: 390px;
  padding: 27px;
  background: linear-gradient(145deg, #f3f5ed, #edf2e6);
  border: 1px solid #dce3d3;
  border-radius: 24px;
  overflow: hidden;
}
.focus-explorer::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: 290px;
  height: 290px;
  right: -168px;
  top: 71px;
  border: 1px solid rgba(33, 87, 70, .13);
  border-radius: 50%;
  box-shadow: 0 0 0 27px rgba(33, 87, 70, .035), 0 0 0 54px rgba(33, 87, 70, .025), 0 0 0 82px rgba(33, 87, 70, .018);
  transform: rotate(-25deg) scaleX(.72);
}
.focus-explorer::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: 33px;
  top: 143px;
  width: 8px;
  height: 8px;
  background: var(--lime);
  border: 1px solid rgba(33, 87, 70, .16);
  border-radius: 50%;
  box-shadow: 0 0 0 8px rgba(195, 228, 91, .16);
}
.focus-explorer-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding-bottom: 21px;
  font-size: .75rem;
  color: var(--muted);
}
.focus-explorer-header .label, .focus-explorer-header p { margin: 0; }
.focus-explorer-header .label { color: var(--green); font-weight: 650; letter-spacing: .06em; }
.focus-explorer-header small { font-size: .68rem; letter-spacing: .03em; }
[data-focus-tabs] {
  display: flex;
  gap: 5px;
  width: 100%;
  padding: 4px;
  background: rgba(255, 255, 255, .65);
  border: 1px solid rgba(33, 87, 70, .08);
  border-radius: 10px;
  margin-bottom: 27px;
}
.focus-tab {
  flex: 1 1 0;
  min-width: 0;
  min-height: 44px;
  padding: 8px 3px;
  color: #67776c;
  background: transparent;
  border: 0;
  border-radius: 7px;
  font-size: .78rem;
  line-height: 1.5;
  font-weight: 550;
  transition: color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}
.focus-tab:hover { color: var(--green); background: #e5ecdb; }
.focus-tab[aria-selected="true"] { color: white; background: var(--green); box-shadow: 0 2px 6px rgba(33, 87, 70, .12); }
.focus-panel { position: relative; }
.focus-panel h2 { max-width: 250px; font-size: 1.48rem; line-height: 1.5; letter-spacing: -.025em; margin-bottom: 13px; }
.focus-panel p { font-size: .86rem; line-height: 1.8; color: var(--muted); margin-bottom: 22px; max-width: 285px; }
.focus-flow { display: flex; flex-wrap: wrap; align-items: center; gap: 17px; list-style: none; padding: 0; margin: 0 0 22px; font-size: .71rem; }
.focus-flow li { position: relative; margin: 0; display: flex; gap: 7px; align-items: center; padding: 5px 7px; white-space: nowrap; color: var(--green); background: rgba(255, 255, 255, .5); border: 1px solid #d6dfcb; border-radius: 5px; }
.focus-flow li:not(:last-child)::after { content: "→"; position: absolute; right: -14px; color: #99a78d; }
.focus-flow li span { background: rgba(255, 255, 255, .5); border: 1px solid #d6dfcb; padding: 5px 7px; border-radius: 5px; }
.focus-link { display: inline-flex; align-items: center; min-height: 44px; gap: 9px; color: var(--green); font-size: .83rem; font-weight: 600; text-decoration: none; }
.focus-link::after { content: none; }
.focus-link > span[aria-hidden] { transition: transform 180ms ease; }
.focus-link:hover { text-decoration: none; }
.focus-link:hover > span[aria-hidden] { transform: translate(2px, -2px); }
.hero-bottom { grid-column: 1 / -1; }
.hero-footnote { color: var(--muted); font-size: .78rem; letter-spacing: .015em; margin: 0; }
.quick-summary { display: flex; flex-wrap: wrap; align-items: center; gap: 32px 50px; list-style: none; padding: 25px 0; border-top: 1px solid var(--line); margin: 0 0 6px; }
.quick-summary > * { margin: 0; min-width: 0; }
.quick-summary .summary-item, .quick-summary > li { display: flex; flex-wrap: wrap; gap: 2px 10px; align-items: baseline; }
.quick-summary strong { color: var(--ink); font-size: 1rem; font-weight: 650; letter-spacing: -.015em; }
.quick-summary span, .quick-summary small { color: var(--muted); font-size: .8rem; }
.section { padding-block: 49px 66px; }
.section-heading { margin-bottom: 29px; }
.section-heading h2 { font-size: 1.78rem; letter-spacing: -.04em; }
.section-heading > a { display: inline-flex; align-items: center; min-height: 44px; font-size: .85rem; text-decoration: none; }
.section-heading > a:hover { text-decoration: underline; }
.project-grid { gap: 24px; }
.project-card {
  position: relative;
  padding: 30px 32px 26px;
  border-color: #dce2d7;
  background: rgba(255, 255, 255, .74);
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}
.project-card::before { content: ""; position: absolute; top: -1px; left: 28px; right: 28px; height: 2px; background: var(--green); transform: scaleX(0); transform-origin: left; transition: transform 180ms ease; }
.project-card:hover { transform: translateY(-3px); border-color: #a8bea2; box-shadow: 0 12px 30px rgba(25, 56, 46, .055); }
.project-card:hover::before { transform: scaleX(1); }
.project-meta { align-items: center; gap: 8px 14px; font-size: .76rem; margin-bottom: 28px; }
.project-index { font-family: inherit; font-size: .79rem; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; width: 29px; height: 29px; border: 1px solid #d7e1cc; border-radius: 50%; background: #eff4e7; }
.project-card h3 { font-size: 1.32rem; line-height: 1.5; margin-bottom: 13px; letter-spacing: -.035em; }
.project-card h3 a { transition: color 180ms ease; }
.project-summary { font-size: .94rem; line-height: 1.85; margin-bottom: 19px; }
.role { font-size: .88rem; color: var(--muted); margin-bottom: 18px; }
.role strong { font-size: .8rem; color: var(--green); }
.tags { gap: 7px; margin-bottom: 19px; }
.tags li { padding: 3px 9px; background: #f3f5ef; border: 1px solid #e1e6dc; border-radius: 5px; color: #61715f; font-size: .73rem; line-height: 1.65; }
.tags li:not(:last-child)::after { content: none; }
.project-card .text-link { font-size: .84rem; }
.project-expand { width: 100%; border-top: 1px solid var(--line); margin: 0 0 8px; }
.project-expand summary {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 46px;
  padding: 9px 0;
  cursor: pointer;
  color: var(--green);
  font-size: .82rem;
  font-weight: 600;
}
.project-expand summary::-webkit-details-marker { display: none; }
.project-expand summary::after { content: "+"; color: var(--green); font-size: 1.12rem; font-weight: 400; transition: transform 180ms ease; }
.project-expand[open] summary::after { transform: rotate(45deg); }
.role-highlights { margin: 0 0 17px; padding-left: 1.1em; font-size: .86rem; color: var(--muted); line-height: 1.85; }
.role-highlights li { margin-bottom: 6px; }
.role-highlights li::marker { color: #8cab65; }
.project-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding-bottom: 28px; }
.filter-button { min-height: 44px; padding: 8px 17px; background: transparent; border: 1px solid #d9e1d2; border-radius: 100px; color: var(--muted); font-size: .83rem; transition: color 180ms ease, background 180ms ease, border-color 180ms ease; }
.filter-button:hover { color: var(--green); background: #edf2e4; border-color: #b6c7a5; }
.filter-button[aria-pressed="true"] { background: var(--green); border-color: var(--green); color: white; }
.filter-count { margin-left: auto; font-size: .78rem; color: var(--muted); }
.page-header { padding-block: 62px 38px; }
.page-header h1 { font-size: clamp(2.45rem, 4.5vw, 3.7rem); line-height: 1.25; font-weight: 650; letter-spacing: -.055em; }
.page-header .eyebrow, .detail-header .eyebrow { font-size: .76rem; letter-spacing: .07em; }
.page-header p { font-size: .96rem; }
.reading { max-width: 800px; }
.body-section h2 { font-size: 1.46rem; }
.timeline > li::before { width: 9px; height: 9px; left: -5px; background: var(--green); box-shadow: 0 0 0 4px var(--paper); }
.timeline > li { padding-left: 28px; }
.detail-layout { grid-template-columns: minmax(0, 800px) 210px; gap: 72px; }
.detail-nav { top: 118px; padding-top: 20px; }
.detail-nav a { display: flex; align-items: center; min-height: 44px; padding: 8px 13px; border-left: 2px solid transparent; border-radius: 0 6px 6px 0; color: var(--muted); transition: background 180ms ease, color 180ms ease; }
.detail-nav a:hover { color: var(--green); text-decoration: none; background: #eff3e7; }
.detail-nav a[aria-current="location"] { color: var(--green); border-left-color: var(--green); background: #edf2e5; }
.detail-header h1 { font-weight: 650; letter-spacing: -.04em; }
.practice-card { padding: 30px 32px; }
.practice-number { font-family: inherit; font-size: .85rem; }
.practice-work ul { font-size: .89rem; }
.practice-card .project-summary { color: var(--muted); }
.practice-bottom .tags { gap: 6px; }
.practice-bottom .tags li:not(:last-child)::after { content: none; }
.practice-bottom .text-link { font-size: .84rem; }
.site-footer { margin-top: 30px; padding-block: 33px 36px; }
.footer-name { font-size: .98rem; letter-spacing: -.02em; }
.footer-note { font-size: .77rem; }
.contact-links { gap: 6px 21px; font-size: .83rem; align-items: center; }
.contact-links a { display: inline-flex; align-items: center; min-height: 44px; }
.copy-email-button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 6px 10px; background: transparent; border: 1px solid #d9e1d2; border-radius: 7px; color: var(--green); font-size: .77rem; transition: background 180ms ease, border-color 180ms ease; }
.copy-email-button:hover { background: #edf2e5; border-color: #b6c7a5; }
.copy-status { display: block; width: 100%; min-height: 20px; color: var(--muted); font-size: .74rem; text-align: right; }
.back-top { position: fixed; z-index: 25; right: 24px; bottom: 24px; display: grid; place-items: center; width: 46px; height: 46px; padding: 0; background: var(--paper); color: var(--green); border: 1px solid #becdb5; border-radius: 50%; box-shadow: 0 5px 18px rgba(25, 56, 46, .08); font-size: 1.2rem; transition: transform 180ms ease, background 180ms ease; }
.back-top:hover { transform: translateY(-3px); background: var(--lime); }
@media (prefers-reduced-motion: no-preference) {
  [data-reveal].reveal-ready { opacity: 0; transform: translateY(14px); transition: opacity 180ms ease, transform 180ms ease; }
  [data-reveal].reveal-ready.is-visible { opacity: 1; transform: none; }
}
@media (min-width: 1440px) {
  .hero { padding-block: 86px 74px; }
  .hero-name { font-size: 6.3rem; }
}
@media (max-width: 1120px) {
  .container { width: calc(100% - 72px); }
  .hero { grid-template-columns: minmax(0, 1fr) 330px; gap: 38px; }
  .hero-name { font-size: clamp(3.8rem, 7.4vw, 5.8rem); }
  .hero-title { font-size: 1.88rem; }
  .focus-explorer { padding: 24px; }
  .detail-layout { grid-template-columns: minmax(0, 1fr) 180px; gap: 42px; }
}
@media (max-width: 880px) {
  .container { width: calc(100% - 48px); }
  .hero { grid-template-columns: minmax(0, 1fr) 300px; gap: 28px; padding-block: 52px 48px; }
  .hero-name { font-size: 4.15rem; }
  .hero-title { font-size: 1.68rem; }
  .hero-copy { font-size: .9rem; }
  .focus-explorer { padding: 21px; }
  .focus-panel h2 { font-size: 1.34rem; }
  .focus-tab { font-size: .71rem; }
  .project-card { padding: 26px; }
  .quick-summary { gap: 16px 30px; }
}
@media (max-width: 760px) {
  html { scroll-padding-top: 140px; }
  .container { width: calc(100% - 40px); }
  .header-inner { gap: 6px; min-height: 118px; padding-block: 12px 8px; }
  .brand-mark { width: 32px; height: 32px; border-radius: 9px; }
  .header-inner nav { gap: 12px; justify-content: space-between; flex-wrap: wrap; }
  .header-inner nav a { min-height: 44px; font-size: .82rem; padding-inline: 0; }
  .header-inner nav a::after { left: 0; right: 0; bottom: 2px; }
  .hero { grid-template-columns: 1fr; gap: 31px; padding-block: 43px 39px; }
  .hero-kicker, .hero-intro > .eyebrow { font-size: .72rem; margin-bottom: 22px; }
  .hero-name { font-size: clamp(3.75rem, 12vw, 5.15rem); margin-bottom: 23px; }
  .hero-title { font-size: 1.87rem; margin-bottom: 21px; }
  .hero-copy { font-size: .95rem; }
  .hero .actions { gap: 11px 23px; margin-top: 23px; }
  .button { min-height: 48px; padding: 10px 19px; font-size: .85rem; }
  .focus-explorer { display: block; min-height: 0; max-width: 100%; padding: 24px; border-radius: 18px; }
  .focus-explorer-header { padding-bottom: 19px; }
  [data-focus-tabs] { max-width: 390px; margin-bottom: 24px; }
  .focus-tab { font-size: .79rem; }
  .focus-panel h2 { font-size: 1.45rem; max-width: 80%; }
  .focus-panel p { max-width: 90%; font-size: .88rem; margin-bottom: 18px; }
  .focus-flow { margin-bottom: 14px; font-size: .74rem; }
  .focus-link { font-size: .84rem; }
  .hero-bottom { margin-top: -12px; }
  .hero-footnote { font-size: .73rem; }
  .quick-summary { padding-block: 20px; gap: 13px 23px; }
  .quick-summary strong { font-size: .9rem; }
  .quick-summary span, .quick-summary small { font-size: .74rem; }
  .section { padding-block: 34px 43px; }
  .section-heading { gap: 12px; margin-bottom: 23px; }
  .section-heading h2 { font-size: 1.5rem; }
  .section-heading > a { font-size: .79rem; }
  .project-grid { grid-template-columns: 1fr; gap: 18px; }
  .project-card, .practice-card { padding: 25px; }
  .project-meta { margin-bottom: 22px; }
  .project-card h3 { font-size: 1.23rem; }
  .page-header { padding-block: 40px 29px; }
  .page-header h1 { font-size: 2.6rem; margin-bottom: 20px; }
  .page-header p { font-size: .93rem; }
  .project-filter { padding-bottom: 24px; gap: 8px; }
  .filter-button { font-size: .77rem; padding-inline: 13px; }
  .filter-count { flex-basis: 100%; margin: 4px 0 0; }
  .detail-layout { grid-template-columns: 1fr; gap: 0; }
  .detail-nav { display: none; }
  .detail-header h1 { font-size: 2.05rem; }
  .detail-summary { font-size: 1rem; }
  .body-section { padding-block: 28px 33px; }
  .contact-links { justify-content: flex-start; gap: 4px 19px; }
  .copy-status { text-align: left; }
  .site-footer { padding-block: 28px 25px; }
  .back-top { right: 17px; bottom: 17px; }
}
@media (max-width: 380px) {
  .container { width: calc(100% - 32px); }
  .header-inner nav { gap: 9px; }
  .header-inner nav a { font-size: .76rem; }
  .hero-name { font-size: 3.65rem; }
  .hero-title { font-size: 1.62rem; }
  .hero-kicker, .hero-intro > .eyebrow { font-size: .66rem; letter-spacing: .03em; }
  .focus-explorer { padding: 20px 18px; }
  .focus-tab { font-size: .71rem; }
  .focus-flow { gap: 16px; font-size: .67rem; }
  .focus-flow li { gap: 5px; padding-inline: 6px; }
  .focus-panel p { max-width: 100%; }
  .project-card, .practice-card { padding: 22px; }
  .section-heading { flex-direction: row; align-items: center; }
  .section-heading h2 { font-size: 1.35rem; }
  .section-heading > a { font-size: .73rem; }
  .quick-summary { gap: 12px 18px; }
  .quick-summary .summary-item, .quick-summary > li { gap: 2px 7px; }
  .page-header h1 { font-size: 2.3rem; }
}
@media (hover: none) {
  .project-card:hover, .button:hover, .back-top:hover { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  [data-reveal].reveal-ready { opacity: 1; transform: none; }
}
@media print {
  .scroll-progress, .back-top, .copy-email-button, .copy-status, .project-filter, .focus-explorer { display: none !important; }
  .site-header { position: static; }
  .container { width: 100%; max-width: none; }
  .hero { display: block; padding-block: 0 24px; }
  .hero-name { font-size: 32pt; }
  .hero-title { font-size: 18pt; }
  .project-card { background: white; box-shadow: none; transform: none; }
  [data-reveal].reveal-ready { opacity: 1; transform: none; }
}

/* A quiet interactive field sits below each page's content. */
body.has-interactive-background { isolation: isolate; }
.site-backdrop {
  --background-node-rgb: 33, 87, 70;
  --background-accent-rgb: 123, 153, 47;
  position: fixed;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 88% 17%, rgba(195, 228, 91, .20), transparent 48%),
    radial-gradient(ellipse at 7% 76%, rgba(111, 166, 144, .13), transparent 48%),
    radial-gradient(ellipse at 50% 92%, rgba(220, 222, 189, .15), transparent 54%),
    var(--paper);
}
.has-interactive-background > main,
.has-interactive-background > .site-footer { position: relative; z-index: 1; }
.site-backdrop::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(33, 87, 70, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(33, 87, 70, .045) 1px, transparent 1px);
  background-size: 64px 64px;
  -webkit-mask-image: radial-gradient(ellipse at 82% 40%, #000 5%, transparent 72%);
  mask-image: radial-gradient(ellipse at 82% 40%, #000 5%, transparent 72%);
}
.background-glow {
  position: absolute;
  inset: 0;
  background: radial-gradient(310px circle at var(--pointer-x, 78vw) var(--pointer-y, 26vh), rgba(195, 228, 91, .24), rgba(123, 169, 142, .085) 48%, transparent 78%);
  opacity: .45;
  transition: opacity 240ms ease;
}
.site-backdrop.is-active .background-glow { opacity: 1; }
.site-backdrop canvas { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.has-interactive-background .project-card { background: rgba(255, 255, 255, .91); }
.has-interactive-background .focus-explorer { background: linear-gradient(145deg, rgba(245, 248, 238, .92), rgba(235, 242, 224, .92)); }
@media (max-width: 760px), (hover: none) {
  .background-glow { display: none; }
  .site-backdrop canvas { opacity: .7; }
  .site-backdrop::before { background-size: 48px 48px; }
}
@media (prefers-reduced-motion: reduce) {
  .background-glow { display: none; }
}
@media print {
  .site-backdrop { display: none !important; }
}

/* Language navigation follows the existing type and green palette. */
.language-switch { display:flex; align-items:center; gap:8px; white-space:nowrap; font-size:.78rem; }
.language-switch a { padding:8px 2px; color:var(--muted); }
.language-switch a[aria-current] { color:var(--green); font-weight:650; }
.language-switch span { opacity:.35; }
html[lang="en"] .hero-title { font-size:clamp(1.9rem,3.8vw,3rem); line-height:1.2; }
html[lang="en"] .focus-tab { font-size:.73rem; padding-inline:8px; }
html[lang="en"] .quick-summary strong { font-size:.95rem; }
@media(max-width:760px) {
  .header-inner { flex-wrap:wrap; gap:8px 12px; padding-block:12px; }
  .header-inner nav { order:3; flex-basis:100%; justify-content:space-between; }
  .language-switch { margin-left:auto; }
  html[lang="en"] .focus-flow { font-size:.67rem; }
}
@media print { .language-switch { display:none; } }
