:root {
  --ink: #172b35;
  --muted: #64716f;
  --accent: #386c5e;
  --line: #d5dcd5;
  --paper: #f5f4ee;
  --serif: "Iowan Old Style", "Palatino Linotype", "Songti SC", "Noto Serif CJK SC", Georgia, serif;
}
html { scroll-behavior: auto; scroll-padding-top: 30px; }
body { font-size: 16px; }
::selection { background: #b8d9c3; color: #122b32; }
.shell { width: min(1220px, calc(100% - 112px)); }
.opening { background: #172b25; color: #f4f2e9; position: relative; isolation: isolate; }
.opening::before {
  content: ""; position: absolute; right: 0; top: 0; width: 30%; height: 100%; z-index: -1;
  background-image: linear-gradient(#b7d9cd07 1px, transparent 1px), linear-gradient(90deg, #b7d9cd07 1px, transparent 1px);
  background-size: 58px 58px;
  mask-image: linear-gradient(90deg, transparent, #000);
  pointer-events: none;
}
.masthead { height: 98px; border-bottom: 1px solid #d9e6dc30; justify-content: flex-end; }
.wordmark { font-size: 17px; font-weight: 500; letter-spacing: -.035em; }
.wordmark::before { content: ""; display: inline-block; width: 9px; height: 9px; background: #b3d9b6; margin-right: 13px; }
.wordmark span { color: #b8c7c9; font-size: 12px; margin-left: 9px; }
.masthead nav { gap: 29px; }
.masthead nav a { font-size: 12px; color: #dce3df; }
.masthead nav a:hover { color: #b3d9b6; }
.masthead .language { border-color: #d9e6dc30; }
.hero {
  min-height: 510px; padding-block: 85px; grid-template-columns: .9fr 1.1fr;
  gap: 100px; align-items: center; position: relative; z-index: 2;
}
.hero::after { content: ""; position: absolute; left: 0; bottom: 0; height: 4px; width: 80px; background: #b3d9b6; }
.small-label { color: #c8e0c5; font-size: 10px; letter-spacing: .16em; margin-bottom: 29px; }
.identity h1 {
  font-family: var(--serif); font-size: 58px; font-weight: 400;
  letter-spacing: .07em; line-height: 1.2;
}
.alternate-name {
  font-family: var(--serif); font-size: 29px; font-style: normal; font-weight: 400;
  letter-spacing: -.015em; line-height: 1.3; margin-top: 13px; color: #e0e8db;
}
.role { display: flex; align-items: center; gap: 13px; margin-top: 28px; color: #d4dfd8; font-family: var(--mono); font-size: 12px; letter-spacing: .07em; }
.role::before { content: ""; width: 27px; height: 1px; background: #b3d9b6; }
.hero-details { max-width: 470px; padding: 0; border: 0; margin-top: 0; }
.intro { color: #f0f1e7; font-size: 16px; line-height: 2.15; letter-spacing: .025em; margin: 0; }
.opening--forest { overflow: hidden; }
.opening--forest::before { inset: 0; width: 100%; height: 100%; z-index: 0; background: url('/media/forest-5040-poster.jpg') center 45% / cover; mask-image: none; }
.opening--forest::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(90deg, #0a211ae3 0%, #10291ab8 46%, #0a211a9c 100%); }
.forest-video { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 45%; }
.opening--forest .identity, .opening--forest .hero-details { text-shadow: 0 1px 16px #0c211d45; }
.section { grid-template-columns: 220px minmax(0, 1fr); gap: 65px; padding-block: 76px 85px; }
#experience { border-top: 0; }
.section-label { position: sticky; top: 35px; }
.section-label > span { font-family: var(--serif); font-style: italic; font-size: 28px; color: #618275; margin-bottom: 15px; line-height: 1; }
.section-label h2 { font-family: var(--serif); font-weight: 500; font-size: 28px; letter-spacing: .025em; }
.section-label > p { font-size: 9px; letter-spacing: .15em; margin-top: 12px; }
.experience-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0 42px; }
.experience { grid-template-columns: 25px minmax(0, 1fr); gap: 12px; padding-block: 31px 33px; }
.experience:first-child { padding-top: 31px; border-top: 1px solid var(--line); }
.entry-index { font-size: 10px; color: #748b80; margin-top: 3px; }
.entry-type { font-size: 10px; letter-spacing: .025em; margin-bottom: 12px; color: #386c5e; }
.experience h3 { font-size: 21px; font-weight: 500; letter-spacing: -.025em; line-height: 1.6; margin-bottom: 16px; }
.experience div > p:last-child { color: #55645f; font-size: 14px; line-height: 2; }
.practice-list { background: #e7ece4; padding: 37px 35px; gap: 35px 38px; position: relative; }
.practice-list::before { content: "+"; position: absolute; right: 13px; top: 3px; color: #688a75; font: 20px var(--mono); }
.practice-key { font-size: 9px; color: #386c5e; line-height: 1.8; margin-bottom: 12px; }
.practice h3 { font-size: 18px; font-weight: 500; line-height: 1.7; margin-bottom: 13px; }
.practice > p:last-child { font-size: 13px; color: #55645f; line-height: 2; }
.publication { grid-template-columns: 97px minmax(0, 1fr); gap: 25px; padding-block: 29px; }
.pub-date time { font-size: 10px; color: #66776e; }
.pub-date > span { color: #386c5e; }
.publication h3 { font-size: 19px; line-height: 1.65; font-weight: 450; }
.publication h3 a { transition: color .18s; }
.publication h3 a > span { font-size: 20px; color: #386c5e; transition: transform .18s; }
.publication h3 a:hover { text-decoration: none; }
.publication h3 a:hover > span { transform: translate(3px, -3px); }
.publication p { font-size: 11px; color: #6b7770; margin-top: 11px; }
.publication-links { margin-top: 13px; }
.video-link { font-size: 11px; color: #386c5e; }
.contact { padding-block: 55px 60px; border-top-color: #172b35; align-items: center; }
.contact .section-label { position: static; }
.contact .section-body { display: flex; align-items: center; min-height: 100px; }
.social-links { gap: 16px; }
.social-links .social-icon { width: 62px; height: 62px; border-color: #b7c6b9; background: transparent; color: #172b35; transition: background .18s, color .18s, transform .18s; }
.social-icon svg { width: 23px; height: 23px; }
.social-links .social-icon:hover { color: #f5f4ee; background: #172b35; border-color: #172b35; transform: translateY(-3px); }
footer { padding-block: 25px 30px; }
footer > p { color: #67756e; font-size: 11px; }
footer > div { font-size: 10px; color: #67756e; }
html[lang=en] .identity h1 { font-family: var(--serif); font-size: 59px; line-height: 1.15; letter-spacing: -.035em; font-weight: 400; max-width: 450px; }
html[lang=en] .alternate-name { font-family: var(--serif); font-size: 24px; font-style: normal; letter-spacing: .16em; margin-top: 15px; }
html[lang=en] .intro { font-size: 16px; line-height: 1.95; letter-spacing: 0; }
html[lang=en] .section-label h2 { font-size: 29px; line-height: 1.15; font-weight: 400; max-width: 190px; }
@media (min-width: 1500px) { .hero { min-height: 540px; padding-block: 95px; } }
@media (max-width: 1100px) {
  .shell { width: calc(100% - 72px); }
  .hero { gap: 50px; min-height: 490px; }
  .identity h1 { font-size: 53px; }
  .alternate-name { font-size: 27px; }
  .hero-details { padding-left: 0; }
  .intro { font-size: 15px; }
  .section { grid-template-columns: 170px minmax(0, 1fr); gap: 40px; padding-block: 60px; }
  .experience-list { gap: 0 28px; }
  .experience h3 { font-size: 19px; }
  .experience div > p:last-child { font-size: 13px; }
  .practice-list { padding: 30px 25px; gap: 30px 25px; }
  .masthead nav { gap: 22px; }
}
@media (max-width: 760px) {
  .shell { width: calc(100% - 44px); }
  .masthead { height: 76px; }
  .wordmark { font-size: 16px; }
  .wordmark::before { width: 7px; height: 7px; margin-right: 10px; }
  .masthead .language { color: #d5dfdb; font-size: 12px; }
  .hero { display: block; min-height: 0; padding-block: 44px 76px; }
  .small-label { font-size: 8px; margin-bottom: 30px; letter-spacing: .11em; }
  .identity h1 { font-size: 43px; letter-spacing: .065em; }
  .alternate-name { font-size: 25px; margin-top: 12px; }
  .role { font-size: 10px; margin-top: 20px; }
  .hero-details { margin-top: 29px; padding: 0; max-width: 510px; }
  .intro { font-size: 14px; line-height: 2; margin: 0; }
  .opening::before { width: 60%; background-size: 45px 45px; }
  .opening--forest::before { width: 100%; background-size: cover; }
  .opening--forest::after { background: linear-gradient(180deg, #0a211ac9, #0a211ad4); }
  .hero::after { width: 50px; height: 3px; }
  .section { display: block; padding-block: 39px 45px; }
  .section-label { position: static; display: grid; grid-template-columns: 30px 1fr; gap: 0 12px; margin-bottom: 27px; }
  .section-label > span { font-size: 23px; grid-row: 1 / 3; margin: 0; }
  .section-label h2 { font-size: 25px; }
  .section-label > p { font-size: 8px; margin-top: 5px; }
  .experience-list { grid-template-columns: 1fr; }
  .experience, .experience:first-child { padding-block: 24px; }
  .experience h3 { font-size: 20px; margin-bottom: 11px; }
  .experience div > p:last-child { font-size: 14px; line-height: 1.95; }
  .entry-type { margin-bottom: 8px; }
  .practice-list { grid-template-columns: 1fr; padding: 28px 24px; gap: 25px; }
  .practice { border-color: #cbd5ca; padding-bottom: 24px; }
  .practice h3 { font-size: 18px; }
  .practice > p:last-child { font-size: 13px; }
  .publication { grid-template-columns: 1fr; gap: 9px; padding-block: 25px; }
  .publication h3 { font-size: 17px; }
  .publication p { font-size: 11px; }
  .pub-date { gap: 15px; }
  .contact .section-body { min-height: 0; }
  .social-links .social-icon { width: 54px; height: 54px; }
  footer > div { font-size: 9px; gap: 12px 18px; }
  footer > p { font-size: 10px; }
  html[lang=en] .identity h1 { font-size: 46px; line-height: 1.15; max-width: 330px; }
  html[lang=en] .alternate-name { font-size: 21px; margin-top: 13px; }
  html[lang=en] .intro { font-size: 14px; line-height: 1.95; }
  html[lang=en] .section-label h2 { max-width: none; font-size: 26px; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }
@media print {
  .opening { background: white; color: #172b35; }
  .opening::before { display: none; }
  .opening--forest::after, .forest-video { display: none; }
  .intro, .alternate-name, .role, .small-label { color: #172b35; }
  .hero { min-height: 0; padding-block: 35px; }
  .section-label { position: static; }
  .section { padding-block: 25px; }
  .experience-list { display: block; }
}