:root{
--paper:#faf9f5;
--ink:#252720;
--muted:#66675f;
--rule:#cfcec5;
--olive:#383735
}
*{
box-sizing:border-box
}
html{
scroll-behavior:smooth;
scroll-padding-top:30px
}
body{
margin:0;
background:var(--paper);
color:var(--ink);
font-family:Georgia,'Times New Roman',serif;
-webkit-font-smoothing:antialiased
}
a{
color:inherit;
text-decoration:none
}
a:hover{
text-decoration:underline;
text-underline-offset:6px
}
button,a{
-webkit-tap-highlight-color:transparent
}
a:focus-visible,button:focus-visible{
outline:2px solid #7c5535;
outline-offset:6px
}
.skip{
position:absolute;
left:16px;
top:-100px;
background:var(--paper);
padding:15px;
z-index:5
}
.skip:focus{
top:10px
}
.masthead,.section,.opening{
max-width:1280px;
margin-left:auto;
margin-right:auto
}
.masthead{
padding:27px 0 0
}
.topline{
display:flex;
justify-content:space-between;
font-family:Arial,sans-serif;
font-size:12px;
color:var(--muted)
}
.name{
display:block;
text-align:center;
font-size:clamp(64px,8.4vw,124px);
letter-spacing:-5px;
line-height:1.2;
margin:25px 0 22px
}
.name:hover{
text-decoration:none
}
nav{
border-top:1px solid var(--ink);
border-bottom:1px solid var(--ink);
display:flex;
justify-content:center;
gap:58px;
padding:16px;
font-size:14px;
font-family:Arial,sans-serif
}
figure{
margin:0
}
img{
display:block;
max-width:100%
}
.opening{
margin-top:26px
}
.opening>img{
width:100%;
height:450px;
object-fit:cover;
object-position:center 19%
}
.opening figcaption{
display:flex;
justify-content:space-between
}
figcaption{
font-size:13px;
line-height:1.5;
color:var(--muted);
padding-top:12px;
font-style:italic
}
.section{
scroll-margin-top:35px
}
.eyebrow{
font-family:Arial,sans-serif;
font-size:12px;
letter-spacing:1.7px;
text-transform:uppercase;
font-weight:400;
margin:0 0 22px
}
h1,h2,h3{
font-weight:400
}
h1{
font-size:clamp(42px,4.2vw,62px);
line-height:1.08;
letter-spacing:-1.7px;
margin:0 0 25px
}
h1 em{
font-weight:400
}
p{
font-size:18px;
line-height:1.65;
margin:0 0 20px
}
.work{
display:grid;
grid-template-columns:.92fr 1.25fr;
gap:80px;
align-items:center;
padding:78px 0 65px
}
.work-copy{
padding-left:28px
}
.work-copy p:not(.eyebrow){
max-width:450px
}
.work-copy>p:not(.eyebrow):not(.lede){
font-family:Arial,sans-serif;
font-size:16px;
line-height:1.75;
color:var(--muted)
}
.lede{
font-size:21px;
line-height:1.5
}
.tractors img{
width:100%;
aspect-ratio: 1/1;
object-fit:contain;
height:auto
}
.text-link{
font-family:Arial,sans-serif;
font-size:14px;
border-bottom:1px solid #8e8e80;
padding-bottom:7px;
display:inline-block;
margin-top:12px
}
.text-link:hover{
text-decoration:none;
border-color:var(--ink)
}
.text-link span{
padding-left:15px
}
.experience{
border-top:1px solid var(--rule);
border-bottom:1px solid var(--rule);
padding:30px 0 26px;
text-align:center
}
.experience .eyebrow{
margin-bottom:26px
}
.company-list{
display:flex;
justify-content:space-around;
gap:24px;
font-size:25px
}
.experience>p{
font-family:Arial,sans-serif;
font-size:13px;
color:var(--muted);
margin:25px 0 0
}
.perspective{
display:grid;
grid-template-columns:1fr 1fr;
gap:100px;
padding:86px 28px 80px
}
.perspective h2{
font-size:48px;
line-height:1.17;
letter-spacing:-1px;
margin:0
}
.essay>p{
font-size:19px;
line-height:1.7
}
.dropcap:first-letter{
float:left;
font-size:67px;
line-height:.85;
padding:9px 8px 0 0
}
.current{
border-top:1px solid var(--rule);
margin-top:30px;
padding-top:26px
}
.current .eyebrow{
margin-bottom:12px
}
.current h3{
font-size:28px;
margin:0 0 8px
}
.current>p:not(.eyebrow){
font-family:Arial,sans-serif;
font-size:15px;
color:var(--muted);
margin-bottom:5px
}
.photography{
border-top:1px solid var(--ink);
padding:60px 0 74px
}
.gallery-heading{
text-align:center;
margin-bottom:48px
}
.gallery-heading h2{
font-size:50px;
letter-spacing:-1.2px;
margin:0 0 18px
}
.gallery-heading>p:last-child{
font-size:18px;
color:var(--muted)
}
.photo-grid{
display:grid;
grid-template-columns:1.12fr .84fr 1.12fr;
gap:30px
}
.photo-column{
display:flex;
flex-direction:column;
gap:34px
}
.middle{
padding-top:44px
}
.photo{
display:block;
padding:0;
border:0;
background:none;
width:100%;
cursor:zoom-in
}
.photo img{
width:100%;
height:auto
}
.photo:hover{
opacity:.94
}
.photo-grid figcaption{
text-align:left
}
footer{
background:var(--olive);
color:var(--paper)
}
.footer-inner{
max-width:1280px;
margin:auto;
padding:60px 28px 25px;
text-align:center
}
footer h2{
font-size:48px;
line-height:1.12;
margin:0 0 22px
}
footer p:not(.eyebrow){
font-size:17px;
color:#e3e0da
}
footer .text-link{
border-color:#9a9690
}
.colophon{
margin-top:55px;
padding-top:25px;
border-top:1px solid #77736e;
display:flex;
justify-content:space-between;
font:12px Arial,sans-serif;
color:#e3e0da
}
.colophon>span:first-child{
font:21px Georgia,serif
}
dialog{
padding:55px 25px 20px;
border:none;
background:var(--paper);
max-width:92vw;
max-height:94vh
}
dialog::backdrop{
background:#171615e6
}
dialog>img{
max-height:76vh;
width:auto;
max-width:85vw;
object-fit:contain;
margin:auto
}
dialog p{
font-size:16px;
margin:16px 0 0;
text-align:center
}
.close{
position:absolute;
top:16px;
right:22px;
border:0;
background:none;
font-size:15px;
cursor:pointer;
color:var(--ink)
}

@media(min-width:1500px){
.masthead,.section,.opening,.footer-inner{
max-width:1320px
}

}
@media(max-width:1350px){
.masthead,.section,.opening{
margin-left:40px;
margin-right:40px
}
.work{
gap:48px
}
.work-copy{
padding-left:0
}
.perspective{
padding-left:0;
padding-right:0;
gap:65px
}

}
@media(max-width:760px){
.masthead,.section,.opening{
margin-left:22px;
margin-right:22px
}
.masthead{
padding-top:20px
}
.topline{
justify-content:center;
font-size:11px
}
.topline span:last-child{
display:none
}
.name{
font-size:clamp(48px,12vw,88px);
letter-spacing:-2px;
margin:20px 0
}
nav{
gap:0;
justify-content:space-between;
padding:15px 0;
font-size:13px
}
.opening{
margin-top:20px
}
.opening>img{
height:auto;
object-fit:contain
}
.opening figcaption{
font-size:12px
}
.opening figcaption span:first-child{
display:none
}
.work{
grid-template-columns:1fr;
gap:30px;
padding:48px 0
}
.work h1{
font-size:47px
}
.work-copy p:not(.eyebrow){
max-width:none
}
.tractors img{
aspect-ratio:1.5
}
.company-list{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:23px 10px;
font-size:20px
}
.experience>p{
font-size:12px;
line-height:1.9
}
.perspective{
grid-template-columns:1fr;
gap:30px;
padding:52px 0
}
.perspective h2{
font-size:39px
}
.essay>p{
font-size:18px
}
.photography{
padding:42px 0 50px
}
.gallery-heading h2{
font-size:39px;
line-height:1.1
}
.gallery-heading>p:last-child{
font-size:16px
}
.photo-grid{
grid-template-columns:1fr 1fr;
gap:20px
}
.photo-column{
gap:25px
}
.middle{
padding-top:30px
}
.photo-column:last-child{
grid-column:1/-1;
display:grid;
grid-template-columns:1fr 1fr;
gap:20px
}
.photo-grid figcaption{
font-size:12px
}
.footer-inner{
padding:45px 22px 24px
}
footer h2{
font-size:38px
}
.colophon{
flex-wrap:wrap;
gap:20px;
align-items:center
}
.colophon>span:nth-child(2){
display:none
}

}
@media(prefers-reduced-motion:reduce){
html{
scroll-behavior:auto
}

}

@media(max-width:760px){
.name{
font-size:clamp(30px,10vw,76px);
letter-spacing:-1px;
white-space:nowrap
}
nav{
gap:12px;
flex-wrap:wrap;
justify-content:center
}

}
@media(max-width:340px){
nav{
font-size:12px;
gap:10px
}
.work h1{
font-size:39px
}
.lede{
font-size:19px
}
.company-list{
grid-template-columns:repeat(2,1fr)
}
.photo-grid{
display:block
}
.photo-column,.middle{
padding:0;
margin-bottom:25px
}
.photo-column:last-child{
display:flex
}
.gallery-heading h2{
font-size:34px
}

}


.performance{
border-top:1px solid var(--rule);
display:grid;
grid-template-columns:1.16fr 1fr;
gap:65px;
align-items:start;
padding:70px 0 80px
}
.performance figure{
margin-top:6px
}
.performance img{
width:100%;
height:auto
}
.performance h2{
font-size:46px;
line-height:1.12;
letter-spacing:-1px;
margin:0 0 24px
}
.performance-copy>p:not(.eyebrow):not(.lede){
font-size:17px;
line-height:1.75
}
.performance .lede{
font-size:22px
}
.performance figcaption{
font-size:13px
}
@media(max-width:760px){
.performance{
grid-template-columns:1fr;
gap:32px;
padding:42px 0 50px
}
.performance h2{
font-size:39px
}
.performance .lede{
font-size:21px
}

}


.gallery-group+ .gallery-group{
margin-top:58px;
padding-top:30px;
border-top:1px solid var(--rule)
}
.gallery-group h3{
font-size:26px;
font-weight:400;
margin:0 0 26px
}
.group-mono{
display:grid;
grid-template-columns:1.2fr .9fr .9fr;
gap:30px;
align-items:start
}
.group-stack{
display:grid;
gap:28px
}
.group-landscape{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:26px;
align-items:start
}
.group-color{
display:grid;
grid-template-columns:.8fr 1fr 1fr 1fr;
gap:26px;
align-items:start
}
.gallery-group figcaption{
font-size:13px
}
.group-mono>.group-stack:nth-child(2){
padding-top:40px
}
.group-color>figure:nth-child(even){
padding-top:34px
}
@media(max-width:760px){
.group-mono{
grid-template-columns:1fr 1fr;
gap:20px
}
.group-mono>.group-stack:first-child{
grid-column:1/-1;
grid-template-columns:1fr 1fr;
align-items:start;
gap:20px
}
.group-mono>.group-stack:nth-child(2){
padding-top:0
}
.group-landscape{
grid-template-columns:1fr;
gap:28px
}
.group-color{
grid-template-columns:1fr 1fr;
gap:24px 20px
}
.gallery-group+ .gallery-group{
margin-top:40px
}
.gallery-group h3{
font-size:24px
}

}
@media(max-width:340px){
.group-mono,.group-color,.group-mono>.group-stack:first-child{
grid-template-columns:1fr
}
.group-color>figure:nth-child(even){
padding-top:0
}

}


.consulting-experience{
border-top:1px solid var(--rule);
margin-top:28px;
padding:26px 20px 4px
}
.consulting-experience h3{
font:400 12px Arial,sans-serif;
letter-spacing:1.7px;
text-transform:uppercase;
margin:0 0 22px
}
.consulting-experience p{
max-width:850px;
margin:0 auto;
font:16px/1.75 Arial,sans-serif;
color:var(--muted)
}


.bookshelf{
border-top:1px solid var(--rule);
padding:52px 28px 64px
}
.bookshelf h2{
font-size:40px;
font-weight:400;
letter-spacing:-.7px;
margin:0 0 36px
}
.book-list{
display:grid;
grid-template-columns:1fr 1fr;
gap:38px 60px
}
.book{
display:grid;
grid-template-columns:96px minmax(0,1fr);
gap:24px;
align-items:start
}
.book>img{
width:96px;
height:auto
}
.book h3{
font-size:23px;
line-height:1.2;
margin:0 0 8px
}
.book-author{
font:13px/1.5 Arial,sans-serif;
color:var(--muted);
margin:0 0 13px
}
.book-note{
font-size:17px;
line-height:1.6;
margin:0
}
.book:last-child{
grid-column:1/-1;
max-width:590px
}
@media(max-width:760px){
.bookshelf{
padding:42px 0 48px
}
.bookshelf h2{
font-size:35px
}
.book-list{
grid-template-columns:1fr;
gap:32px
}
.book{
grid-template-columns:80px minmax(0,1fr);
gap:20px
}
.book>img{
width:80px
}
.book h3{
font-size:22px
}
.book-note{
font-size:16px
}
.book:last-child{
max-width:none
}

}


.group-color{
grid-template-columns:repeat(3,minmax(0,1fr))
}
.group-color>figure:nth-child(even){
padding-top:0
}
@media(max-width:760px){
.group-color{
grid-template-columns:1fr;
gap:28px
}

}


.contact-links{
display:flex;
justify-content:center;
align-items:center;
flex-wrap:wrap;
gap:18px 32px
}
.contact-primary{
font-weight:600
}
.contact-secondary{
color:#d0ccc6
}


.group-mono>.mono-wide{
grid-column:1/-1;
margin:8px auto 0;
width:100%;
max-width:900px
}
.mono-wide .photo img{
width:100%;
height:auto;
aspect-ratio:auto;
object-fit:contain
}


.group-mono{
grid-template-columns:repeat(3,minmax(0,1fr))
}
.group-mono>figure{
min-width:0
}
@media(max-width:760px){
.group-mono{
grid-template-columns:1fr
}
.group-mono>.mono-wide{
grid-column:1/-1
}

}
.tractors {
  width: 100%;
  max-width: 385px;
  justify-self: center;
}

.name {
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
}

@font-face {
  font-family: "Libre Caslon Text";
  src: url("assets/fonts/libre-caslon-text-regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
.book-list > .book:last-child {
  grid-column: auto;
  max-width: none;
}