:root{--paper:#f5f3ed;--ink:#171714;--muted:#77756d;--line:#c9c6bc;--measure:1180px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Courier New",Courier,monospace;font-size:16px;line-height:1.45}
a{color:inherit;text-decoration:none}
a:hover,a:focus-visible{text-decoration:underline;text-underline-offset:.22em}
a:focus-visible{outline:1px solid currentColor;outline-offset:5px}
.shell{width:min(calc(100% - 64px),var(--measure));margin:auto}
.mast{position:sticky;top:0;z-index:10;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:2rem;padding:46px 0 28px;border-bottom:1px solid var(--ink);background:var(--paper)}
.mast-center{grid-column:2;display:flex;align-items:center;justify-content:center;gap:1.6rem}
.mast-copy{text-align:center}
.portrait{width:91.332px;height:auto;display:block;flex:0 0 auto;object-fit:contain}
.name{font-size:clamp(1.75rem,3vw,2.7rem);line-height:1;letter-spacing:.02em;margin:0;text-transform:uppercase;white-space:nowrap;font-weight:700}
.role{margin:.65rem 0 0;font-size:.92rem;letter-spacing:.065em;text-transform:uppercase;white-space:nowrap}
.external{grid-column:3;justify-self:end;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase}
.content{display:grid;grid-template-columns:minmax(250px,.78fr) minmax(420px,1.22fr);gap:10vw}
.rail{position:relative}
.rail-inner{position:sticky;top:calc(var(--mast-height, 0px) + 28px);padding:30px 0}
.rail-nav a{display:block;width:max-content;margin:0 0 .8rem;font-size:1rem;letter-spacing:.055em;text-transform:uppercase}
.projects{padding-bottom:3rem}
.section{scroll-margin-top:1px;padding:0 0 3.5rem}
.section-heading{position:sticky;top:var(--mast-height, 0px);z-index:2;display:flex;gap:1.25rem;align-items:baseline;margin:0;background:rgba(245,243,237,.96);border-bottom:1px solid var(--ink);padding:38px 0 18px;text-transform:uppercase}
.section-heading .num{font-size:.82rem;color:var(--muted)}
.section-heading h2{font-size:1.12rem;font-weight:400;letter-spacing:.09em;margin:0}
.selection{font-size:.78rem;color:var(--muted);letter-spacing:.08em}
.project{padding:.9rem 0 1rem;border-bottom:1px solid var(--line)}
.project h3{font-size:clamp(1.05rem,1.5vw,1.22rem);font-weight:400;line-height:1.25;text-transform:uppercase;margin:0 0 .3rem}
.project p{font-size:.92rem;line-height:1.4;color:var(--muted);margin:0}
.contact{padding:1rem 0 3rem}
.email{display:inline-block;font-size:clamp(1rem,2vw,1.35rem);margin:1.5rem 0}
.footer{border-top:1px solid var(--ink);display:flex;justify-content:space-between;gap:2rem;padding:28px 0 42px;font-size:.67rem;letter-spacing:.06em;text-transform:uppercase}
.footer-links{display:flex;gap:1.2rem}
.legal-header{padding:40px 0 28px;border-bottom:1px solid var(--ink);display:flex;align-items:baseline;justify-content:space-between;gap:2rem}
.legal-header a{font-size:.72rem;letter-spacing:.07em;text-transform:uppercase}
.legal{display:grid;grid-template-columns:minmax(210px,.6fr) minmax(0,1.4fr);gap:10vw;padding:9vh 0 14vh}
.legal h1{font-size:clamp(1.35rem,2.5vw,2rem);font-weight:400;text-transform:uppercase;margin:0;position:sticky;top:38px;align-self:start}
.legal-copy{max-width:72ch}
.legal-copy h2{font-size:.95rem;font-weight:400;text-transform:uppercase;margin:3.5rem 0 1rem;padding-top:1rem;border-top:1px solid var(--line)}
.legal-copy h2:first-child{margin-top:0}
.legal-copy h3{font-size:.9rem;font-weight:400;margin:2rem 0 .65rem}
.legal-copy p,.legal-copy li{font-family:Arial,Helvetica,sans-serif;font-size:.96rem;line-height:1.65}
.legal-copy ul{padding-left:1.3rem}
@media(max-width:760px){
  .shell{width:min(calc(100% - 36px),var(--measure))}
  .mast{display:flex;flex-direction:column;gap:.9rem;padding:34px 0 18px}
  .mast-center{gap:.7rem}
  .mast-copy{text-align:center}
  .portrait{width:57.276px;height:auto}
  .name{font-size:clamp(1.12rem,5.6vw,1.5rem);letter-spacing:.005em}
  .role{font-size:clamp(.56rem,2.7vw,.72rem);letter-spacing:.025em}
  .external{font-size:.72rem}
  .content{display:block}
  .rail-inner{position:static;padding:22px 0 18px;border-bottom:1px solid var(--line)}
  .rail-nav{display:grid;grid-template-columns:1fr 1fr;gap:.55rem 1rem}
  .rail-nav a{margin:0;font-size:.86rem}
  .projects{padding-bottom:1rem}
  .section{padding-bottom:2.5rem}
  .section-heading{padding:20px 0 12px}
  .project{padding:.82rem 0 .9rem}
  .project h3{font-size:1.02rem}
  .project p{font-size:.87rem}
  .footer{display:block;padding-bottom:34px}
  .footer-links{margin-bottom:1.2rem}
  .legal-header{padding:26px 0 20px}
  .legal{display:block;padding:8vh 0 12vh}
  .legal h1{position:static;margin-bottom:10vh}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
