:root{
--ink:#171715;
--night:#11110f;
--paper:#f2f0eb;
--white:#fbfaf7;
--muted:#65625c;
--line:#d0cdc6;
--line-light:#45453f;
--accent:#965039;
--pad:clamp(22px,5.3vw,84px);
--sans:"Helvetica Neue",Helvetica,Arial,sans-serif;
--serif:"Iowan Old Style",Baskerville,Georgia,serif}
*{
box-sizing:border-box}
html{
scroll-behavior:smooth;
scroll-padding-top:92px}
body{
margin:0;
background:var(--paper);
color:var(--ink);
font-family:var(--sans);
-webkit-font-smoothing:antialiased}
body.menu-open{
overflow:hidden}
a{
color:inherit;
text-decoration:none}
img{
display:block;
max-width:100%}
button{
font:inherit;
cursor:pointer}
button,a,summary{
-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,summary:focus-visible{
outline:2px solid var(--accent);
outline-offset:5px}
.hero a:focus-visible,.contact a:focus-visible,.talent-section a:focus-visible{
outline-color:#e1b9a7}
::selection{
background:#d7b29f;
color:var(--ink)}
.skip{
position:fixed;
z-index:100;
top:12px;
left:12px;
transform:translateY(-180%);
background:var(--white);
padding:14px 18px}
.skip:focus{
transform:none}
/* The shared editorial frame. */
.site-header{
position:sticky;
top:0;
z-index:50;
height:76px;
display:grid;
grid-template-columns:1fr auto 1fr;
gap:30px;
align-items:center;
padding:0 var(--pad);
background:var(--paper);
border-bottom:1px solid var(--line)}
.brand{
width:max-content;
font-size:15px;
font-weight:750;
letter-spacing:-.035em}
.site-nav{
display:flex;
align-items:center;
gap:30px}
.site-nav a{
min-height:44px;
display:grid;
place-items:center;
position:relative;
font-size:12px}
.site-nav a::after{
content:"";
position:absolute;
bottom:9px;
left:0;
right:100%;
height:1px;
background:currentColor;
transition:right .16s ease}
.site-nav a:hover::after,.site-nav a[aria-current="page"]::after{
right:0}
.header-cta{
justify-self:end;
min-height:44px;
display:flex;
align-items:center;
gap:22px;
font-size:12px}
.header-cta:hover{
color:var(--accent)}
.menu-button{
display:none}
.eyebrow{
margin:0 0 20px;
font-size:10px;
line-height:1.5;
letter-spacing:.13em;
font-weight:600;
text-transform:uppercase}
.section{
padding:clamp(55px,7.3vw,108px) var(--pad)}
.section-title{
margin:0;
font-size:clamp(35px,4.7vw,68px);
line-height:1.02;
font-weight:500;
letter-spacing:-.055em}
.section-title em{
font-family:var(--serif);
font-weight:400;
color:var(--accent)}
.section-topline{
display:flex;
justify-content:space-between;
gap:24px;
align-items:end;
margin-bottom:32px}
.section-topline .eyebrow{
margin-bottom:10px}
.section-caption{
margin:0 0 5px;
color:var(--muted);
font-size:12px}
.section-note{
max-width:420px;
color:var(--muted);
font-size:14px;
line-height:1.65}
.text-link{
display:inline-flex;
align-items:center;
justify-content:space-between;
gap:28px;
min-height:44px;
border-bottom:1px solid currentColor;
font-size:12px;
line-height:1.4}
.text-link:hover{
color:var(--accent)}
/* Cover: supplied portrait with an unobstructed face and quiet nameplate. */
.hero{
display:grid;
grid-template-columns:.94fr 1.06fr;
min-height:min(760px,calc(100svh - 76px));
background:var(--night);
color:var(--white)}
.hero-copy{
grid-column:1;
grid-row:1;
align-self:center;
padding:52px 38px 54px var(--pad)}
.hero-copy .eyebrow{
color:#c2beb5}
.hero-title{
margin:25px 0 32px;
font-size:clamp(72px,8.3vw,132px);
line-height:.86;
font-weight:600;
letter-spacing:-.075em}
.hero-title>span,.hero-title>em{
display:block}
.hero-title>em{
font-family:var(--serif);
font-weight:400;
font-size:1.03em;
letter-spacing:-.075em;
line-height:1.02;
margin-left:-.035em}
.hero-title .hero-surname{
margin-top:14px;
font-size:.35em;
font-weight:400;
letter-spacing:.04em;
line-height:1}
.hero-descriptor{
max-width:370px;
margin:0;
font-size:clamp(17px,1.7vw,22px);
line-height:1.4;
letter-spacing:-.025em}
.hero-support{
max-width:365px;
margin:16px 0 0;
color:#b5b2aa;
font-size:14px;
line-height:1.65}
.hero-actions{
display:flex;
gap:24px;
flex-wrap:wrap;
margin-top:28px}
.button{
display:inline-flex;
align-items:center;
justify-content:space-between;
gap:24px;
min-height:46px;
padding:0 17px;
font-size:12px}
.button-light{
background:var(--paper);
color:var(--ink)}
.button-light:hover{
background:#d8bbaa}
.button-text{
padding:0;
border-bottom:1px solid #64625b}
.button-text:hover{
border-color:var(--white)}
.hero-visual{
grid-column:2;
grid-row:1;
position:relative;
min-height:640px;
overflow:hidden;
background:#292621}
.hero-visual img{
position:absolute;
inset:0;
height:100%;
width:100%;
object-fit:cover;
object-position:52% 35%;
filter:grayscale(.88) contrast(1.04)}
.recognition-strip{
display:grid;
grid-template-columns:1fr 2.3fr;
align-items:center;
gap:24px;
padding:27px var(--pad);
border-bottom:1px solid var(--line)}
.recognition-strip .eyebrow{
margin:0;
color:var(--muted)}
.recognition-strip a{
display:flex;
align-items:center;
gap:23px;
font-family:var(--serif);
font-size:27px;
letter-spacing:-.04em}
.recognition-strip a>span:first-child{
margin-right:auto;
font-family:var(--sans);
font-size:12px;
letter-spacing:0;
line-height:1.5}
.recognition-strip a:hover{
color:var(--accent)}
.recognition-strip p{
margin:7px 0 0;
color:var(--muted);
font-size:11px;
line-height:1.5}
.home-work-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:26px}
.work-card{
min-width:0}
.work-media{
aspect-ratio:1.3;
overflow:hidden;
background:#dedbd5}
.work-media img{
width:100%;
height:100%;
object-fit:cover;
transition:transform .3s ease}
.work-card:hover img{
transform:scale(1.025)}
.work-meta{
padding-top:18px}
.work-role{
margin:0 0 9px;
font-size:10px;
color:var(--muted)}
.work-meta h3{
display:flex;
align-items:baseline;
justify-content:space-between;
margin:0;
font-size:clamp(19px,2.2vw,29px);
letter-spacing:-.045em;
font-weight:500}
.work-meta h3 span{
font-size:17px}
.work-category{
margin:10px 0 0;
font-size:11px;
color:var(--muted)}
.wordmark-media{
background:#000}
.wordmark-media img{
object-fit:contain}
/* Contact is useful information, not another oversized headline. */
.contact{
background:var(--night);
color:var(--white);
padding:52px var(--pad) 24px}
.contact-inner{
display:grid;
grid-template-columns:1fr 1.3fr;
align-items:center;
gap:40px}
.contact .eyebrow{
color:#bab6ad;
margin-bottom:12px}
.contact h2{
margin:0;
font-family:var(--serif);
font-size:clamp(40px,5.5vw,75px);
font-weight:400;
letter-spacing:-.055em;
line-height:1}
.contact-details p{
margin:0 0 13px;
color:#bbb7ae;
font-size:13px;
line-height:1.7}
.contact-link{
display:flex;
align-items:center;
justify-content:space-between;
gap:14px;
min-height:46px;
padding:9px 0;
border-bottom:1px solid var(--line-light);
font-size:clamp(16px,1.9vw,25px);
letter-spacing:-.025em;
overflow-wrap:anywhere}
.contact-link:hover{
color:#dfb6a2}
.site-footer{
display:flex;
justify-content:space-between;
gap:24px;
border-top:1px solid var(--line-light);
margin-top:48px;
padding-top:21px;
color:#b4b0a6;
font-size:10px;
line-height:1.5}
.footer-links{
display:flex;
flex-wrap:wrap;
gap:24px}
.footer-links a{
display:inline-flex;
gap:6px}
.footer-links a:hover{
color:var(--white)}
/* Interior pages carry the detail without turning the homepage into a pitch. */
.page-hero{
padding:clamp(55px,7vw,100px) var(--pad) 44px;
display:grid;
grid-template-columns:1.25fr 1fr;
gap:18px 45px;
align-items:end;
border-bottom:1px solid var(--line)}
.page-hero .eyebrow{
grid-column:1/-1;
margin-bottom:8px;
color:var(--muted)}
.page-title{
margin:0;
font-size:clamp(56px,7.9vw,118px);
font-weight:500;
line-height:.95;
letter-spacing:-.067em}
.page-title em{
font-family:var(--serif);
font-weight:400;
color:var(--accent)}
.page-deck{
max-width:420px;
justify-self:end;
margin:0 0 5px;
font-size:clamp(18px,2vw,25px);
line-height:1.4;
letter-spacing:-.025em}
.biography{
display:grid;
grid-template-columns:4fr 6fr;
gap:clamp(35px,7vw,110px);
align-items:start}
.bio-portrait{
position:sticky;
top:108px;
margin:0}
.bio-portrait img{
width:100%;
aspect-ratio:.8;
object-fit:cover;
object-position:50% 35%;
filter:grayscale(.9)}
.bio-portrait figcaption{
margin-top:13px;
color:var(--muted);
font-size:11px}
.bio-copy{
max-width:660px}
.bio-copy p{
margin:0 0 24px;
font-size:17px;
line-height:1.7;
letter-spacing:-.01em}
.bio-copy .bio-lede{
font-size:clamp(23px,2.5vw,33px);
line-height:1.3;
letter-spacing:-.035em}
.bio-copy strong{
font-weight:500}
.bio-copy p a,.career-notes p a{
text-decoration:underline;
text-underline-offset:4px;
text-decoration-color:#aaa397}
.bio-copy p a:hover,.career-notes p a:hover{
color:var(--accent)}
.career-context{
display:grid;
grid-template-columns:1fr 1fr;
gap:70px;
border-top:1px solid var(--line)}
.career-notes{
display:grid;
gap:27px}
.career-notes h3{
margin:0 0 12px;
font-size:20px;
font-weight:500;
letter-spacing:-.025em}
.career-notes p{
max-width:500px;
margin:0;
color:var(--muted);
font-size:16px;
line-height:1.65}
.recognition-detail{
display:grid;
grid-template-columns:1fr 1.35fr;
gap:70px;
background:#e8e5de}
.recognition-records{
display:grid;
gap:28px}
.recognition-records article+article{
padding-top:25px;
border-top:1px solid #c8c3b9}
.recognition-records .eyebrow{
margin-bottom:10px;
color:var(--muted)}
.recognition-records h3{
margin:0 0 12px;
font-family:var(--serif);
font-size:28px;
font-weight:400;
letter-spacing:-.025em}
.recognition-records p:not(.eyebrow){
margin:0;
color:#54514b;
font-size:14px;
line-height:1.65}
.section-nav{
display:flex;
gap:38px;
padding:10px var(--pad);
border-bottom:1px solid var(--line)}
.section-nav a{
display:flex;
gap:17px;
align-items:center;
min-height:44px;
font-size:12px}
.section-nav a:hover{
color:var(--accent)}
.section-nav span{
color:var(--muted);
font-size:10px}
.ventures-section{
padding-bottom:80px}
.venture-detail{
display:grid;
grid-template-columns:1fr 1fr;
align-items:center;
gap:clamp(35px,6vw,90px);
padding:45px 0;
border-top:1px solid var(--line)}
.venture-detail:last-child{
padding-bottom:0}
.venture-image{
aspect-ratio:1.25;
overflow:hidden}
.venture-image img{
width:100%;
height:100%;
object-fit:cover}
.venture-image.wordmark-media img{
object-fit:contain}
.venture-copy{
max-width:500px}
.venture-copy .eyebrow{
color:var(--muted)}
.venture-copy h3{
margin:0;
font-size:clamp(38px,5vw,67px);
font-weight:500;
letter-spacing:-.055em;
line-height:1}
.project-role{
margin:15px 0 22px;
color:var(--accent);
font-size:13px}
.project-description{
font-size:21px;
line-height:1.4;
letter-spacing:-.025em;
margin:0 0 16px}
.project-contribution{
color:var(--muted);
font-size:15px;
line-height:1.6;
margin:0 0 15px}
.talent-section,.creative-section{
display:grid;
grid-template-columns:1fr 1.15fr;
gap:70px}
.talent-section{
background:var(--night);
color:var(--white)}
.talent-section .section-title em{
color:#d6ac96}
.talent-section .text-link{
margin-top:27px}
.talent-section .text-link:hover{
color:#dfb6a2}
.talent-copy>p{
max-width:550px;
font-size:16px;
line-height:1.65;
color:#c4c0b7}
.talent-copy .large-copy{
font-size:clamp(23px,3vw,37px);
line-height:1.25;
letter-spacing:-.035em;
margin:0 0 26px;
color:var(--white)}
.talent-copy .section-note{
font-size:12px;
color:#aaa69d;
margin-bottom:0}
.media-clips{
display:grid;
gap:30px;
margin-top:35px}
.media-clip img{
aspect-ratio:16/9;
object-fit:cover;
width:100%}
.media-clip h3{
font-size:19px}
.creative-copy>p{
margin-top:0;
font-size:19px;
line-height:1.6;
letter-spacing:-.02em}
.portfolio-records{
margin-top:40px;
border-top:1px solid var(--line);
border-bottom:1px solid var(--line)}
.portfolio-records summary{
min-height:60px;
display:flex;
align-items:center;
justify-content:space-between;
gap:25px;
font-size:14px;
cursor:pointer;
list-style:none}
.portfolio-records summary::-webkit-details-marker{
display:none}
.portfolio-records[open] summary span{
transform:rotate(45deg)}
.portfolio-records dl{
margin:20px 0 28px}
.portfolio-records dl>div{
display:flex;
gap:20px;
justify-content:space-between;
padding:13px 0;
border-top:1px solid var(--line);
font-size:12px;
line-height:1.5}
.portfolio-records dd{
margin:0;
color:var(--muted);
text-align:right}
/* Real reading destinations are separate from the archive index. */
.writing-section{
padding-bottom:50px}
.writing-feature{
display:flex;
justify-content:space-between;
gap:35px;
padding:28px 0;
border-top:1px solid var(--line)}
.writing-feature>div{
max-width:780px}
.writing-feature h2,.writing-feature h3{
max-width:720px;
margin:0;
font-size:clamp(30px,4vw,52px);
line-height:1.08;
font-weight:500;
letter-spacing:-.05em}
.writing-feature h3 span{
white-space:nowrap}
.writing-feature p:not(.eyebrow){
margin:20px 0 8px;
color:var(--muted);
font-size:16px;
line-height:1.5}
.writing-feature .eyebrow{
color:var(--accent);
margin-bottom:18px}
.writing-feature time{
flex-shrink:0;
color:var(--muted);
font-size:12px;
padding-top:3px}
.writing-feature:hover h2,.writing-feature:hover h3{
color:var(--accent)}
.archive-section{
padding-top:25px}
.archive-heading{
display:grid;
grid-template-columns:1fr 1fr;
gap:40px;
align-items:end;
margin-bottom:36px}
.archive-heading .section-note{
justify-self:end;
margin-bottom:0}
.archive-list{
list-style:none;
padding:0;
margin:0;
border-top:1px solid var(--line)}
.archive-item{
display:grid;
grid-template-columns:140px 1fr 120px;
gap:30px;
align-items:baseline;
padding:24px 0;
border-bottom:1px solid var(--line)}
.archive-item time,.archive-item span{
color:var(--muted);
font-size:11px;
line-height:1.4}
.archive-item span{
text-align:right}
.archive-item h3{
margin:0;
font-weight:400;
letter-spacing:-.025em;
font-size:21px;
line-height:1.3}
.article-header{
max-width:1000px;
margin:0 auto;
padding:60px var(--pad) 45px}
.article-header .text-link{
margin-bottom:40px}
.article-header h1{
font-size:clamp(40px,5vw,72px);
font-weight:500;
letter-spacing:-.055em;
line-height:1.04;
margin:15px 0 25px}
.article-deck{
max-width:700px;
font-size:23px;
line-height:1.4}
.article-byline{
display:flex;
flex-wrap:wrap;
gap:12px 24px;
font-size:12px;
color:var(--muted);
margin-top:30px}
.article-image{
max-width:1100px;
margin:0 auto 50px;
padding:0 var(--pad)}
.article-image img{
width:100%;
height:auto}
.article-body{
max-width:720px;
padding:0 24px;
margin:0 auto;
font-family:var(--serif);
font-size:21px;
line-height:1.8}
.article-body h2{
margin:2em 0 .7em;
font-family:var(--sans);
font-size:30px;
line-height:1.25;
font-weight:500;
letter-spacing:-.035em}
.article-body p{
margin:0 0 1.3em}
.article-body blockquote{
margin:2em 0;
padding-left:24px;
border-left:2px solid var(--accent);
font-size:26px;
line-height:1.5;
font-style:italic}
.article-sharing{
display:flex;
align-items:center;
flex-wrap:wrap;
gap:16px;
max-width:720px;
padding:35px 24px 65px;
margin:0 auto}
.article-sharing button{
min-height:44px;
border:0;
border-bottom:1px solid var(--ink);
background:none;
color:var(--ink);
padding:8px 0;
font-size:12px}
.article-sharing [role="status"]{
flex-basis:100%;
font-size:12px;
color:var(--muted);
overflow-wrap:anywhere}
.related-writing{
border-top:1px solid var(--line)}
.related-writing .text-link{
margin-right:30px}
.not-found{
min-height:55svh}
.not-found .text-link{
justify-self:start}
@media(min-width:1600px){
.hero-copy{
padding-left:max(var(--pad),calc((100vw - 1440px)/2))}
.section,.recognition-strip,.site-header,.page-hero,.section-nav,.contact{
padding-left:max(var(--pad),calc((100vw - 1440px)/2));
padding-right:max(var(--pad),calc((100vw - 1440px)/2))}
}
@media(max-width:900px){
.hero{
grid-template-columns:1fr 1fr;
min-height:610px}
.hero-visual{
min-height:610px}
.hero-copy{
padding-right:24px}
.hero-title{
font-size:78px}
.hero-descriptor{
font-size:18px}
.hero-support{
font-size:13px}
.hero-actions{
gap:15px}
.button{
gap:16px}
.recognition-strip{
grid-template-columns:1fr 2.5fr}
.recognition-strip a{
gap:16px}
.page-hero{
gap:20px}
.page-deck{
font-size:20px}
.biography,.career-context,.recognition-detail,.talent-section,.creative-section{
gap:38px}
.venture-detail{
gap:35px}
.venture-copy h3{
font-size:42px}
.project-description{
font-size:18px}
.project-contribution{
font-size:14px}
}
@media(max-width:700px){
html{
scroll-padding-top:82px}
.site-header{
height:64px;
grid-template-columns:1fr auto;
gap:18px}
.brand{
font-size:14px}
.header-cta{
display:none}
.menu-button{
display:flex;
align-items:center;
gap:14px;
justify-content:end;
min-width:70px;
min-height:44px;
border:0;
background:none;
color:var(--ink);
padding:0;
font-size:12px}
.menu-icon{
width:19px;
height:10px;
display:block;
border-top:1px solid currentColor;
border-bottom:1px solid currentColor}
.menu-open .menu-icon{
border-bottom:0;
height:0}
.site-nav{
display:none;
position:fixed;
inset:64px 0 0;
padding:24px var(--pad);
background:var(--paper);
flex-direction:column;
align-items:stretch;
justify-content:start;
gap:0;
overflow:auto}
.site-nav.open{
display:flex}
.site-nav a{
place-items:start;
padding:24px 0;
font-size:35px;
letter-spacing:-.04em;
border-bottom:1px solid var(--line)}
.site-nav a::after{
display:none}
.site-nav a[aria-current="page"]{
color:var(--accent)}
.hero{
grid-template-columns:1fr;
min-height:0}
.hero-visual{
grid-column:1;
grid-row:1;
min-height:0;
height:clamp(250px,67vw,390px)}
.hero-visual img{
object-position:50% 29%}
.hero-copy{
grid-column:1;
grid-row:2;
padding:27px var(--pad) 30px;
display:grid;
grid-template-columns:1fr}
.hero-copy .eyebrow{
margin:0 0 17px;
font-size:9px}
.hero-title{
font-size:clamp(58px,15.6vw,90px);
margin:0 0 23px}
.hero-title>span:first-child,.hero-title>em{
display:inline}
.hero-title>em{
margin-left:0}
.hero-title .hero-surname{
font-size:.34em;
margin-top:11px}
.hero-descriptor{
font-size:18px;
max-width:370px}
.hero-support{
font-size:13px;
line-height:1.6;
max-width:340px;
margin-top:10px}
.hero-actions{
margin-top:23px;
gap:24px}
.hero-actions .button{
font-size:11px}
.recognition-strip{
grid-template-columns:1fr;
gap:14px;
padding-top:24px;
padding-bottom:25px}
.recognition-strip a{
font-size:26px;
gap:20px}
.recognition-strip a>span:first-child{
font-size:11px}
.recognition-strip p{
font-size:10px}
.section{
padding-top:52px;
padding-bottom:52px}
.section-title{
font-size:clamp(34px,8.6vw,48px)}
.eyebrow{
font-size:9px;
margin-bottom:16px}
.section-topline{
margin-bottom:25px;
gap:16px}
.section-topline .text-link{
font-size:10px;
gap:12px}
.section-caption{
font-size:10px}
.home-work-grid{
grid-template-columns:1fr;
gap:0}
.work-card{
display:grid;
grid-template-columns:116px 1fr;
align-items:center;
gap:21px;
padding:17px 0;
border-top:1px solid var(--line)}
.work-card:last-child{
padding-bottom:0}
.work-media{
aspect-ratio:1.08}
.work-meta{
padding:0}
.work-role{
font-size:10px;
margin-bottom:10px}
.work-meta h3{
font-size:21px}
.work-meta h3 span{
font-size:14px}
.work-category{
font-size:10px;
margin-top:9px}
.contact{
padding-top:37px;
padding-bottom:24px}
.contact-inner{
grid-template-columns:1fr;
gap:25px}
.contact h2{
font-size:48px}
.contact-details p{
font-size:12px;
max-width:360px}
.contact-link{
font-size:17px}
.site-footer{
flex-direction:column;
gap:13px;
margin-top:32px;
padding-top:18px;
font-size:10px}
.footer-links{
gap:25px}
.footer-links a{
min-height:32px;
align-items:center}
.page-hero{
grid-template-columns:1fr;
padding-top:48px;
padding-bottom:32px;
gap:19px}
.page-hero .eyebrow{
margin-bottom:7px}
.page-title{
font-size:clamp(51px,12.8vw,85px)}
.page-deck{
justify-self:start;
margin-top:6px;
font-size:18px;
max-width:350px}
.biography{
grid-template-columns:1fr;
gap:30px}
.bio-portrait{
position:static}
.bio-portrait img{
aspect-ratio:1.15;
object-position:50% 25%}
.bio-copy .bio-lede{
font-size:24px}
.bio-copy p{
font-size:16px;
line-height:1.7;
margin-bottom:22px}
.career-context,.recognition-detail,.talent-section,.creative-section{
grid-template-columns:1fr;
gap:30px}
.career-context .section-title br:first-of-type{
display:none}
.career-notes{
gap:26px}
.career-notes p{
font-size:15px}
.recognition-records h3{
font-size:25px}
.section-nav{
justify-content:space-between;
gap:12px;
padding-top:7px;
padding-bottom:7px}
.section-nav a{
font-size:11px;
gap:8px}
.section-nav span{
display:none}
.venture-detail{
grid-template-columns:1fr;
gap:25px;
padding:30px 0}
.venture-image{
aspect-ratio:1.4}
.venture-copy .eyebrow{
margin-bottom:14px}
.venture-copy h3{
font-size:clamp(37px,10.5vw,52px)}
.project-role{
margin:12px 0 18px}
.project-description{
font-size:20px}
.project-contribution{
font-size:14px}
.talent-copy .large-copy{
font-size:27px}
.talent-copy>p{
font-size:15px}
.creative-copy>p{
font-size:17px}
.portfolio-records{
margin-top:30px}
.writing-section{
padding-bottom:30px}
.writing-feature{
flex-direction:column;
gap:22px;
padding:24px 0}
.writing-feature h2,.writing-feature h3{
font-size:34px}
.writing-feature p:not(.eyebrow){
font-size:15px}
.writing-feature time{
font-size:11px}
.archive-section{
padding-top:25px}
.archive-heading{
grid-template-columns:1fr;
gap:15px;
margin-bottom:27px}
.archive-heading .section-note{
justify-self:start;
margin:0;
font-size:13px}
.archive-item{
grid-template-columns:1fr auto;
gap:10px 20px;
padding:20px 0}
.archive-item time{
grid-column:1}
.archive-item h3{
grid-row:2;
grid-column:1/-1;
font-size:20px}
.archive-item span{
grid-column:2;
grid-row:1;
font-size:10px}
.article-header{
padding-top:35px}
.article-header .text-link{
margin-bottom:30px}
.article-deck{
font-size:20px}
.article-body{
font-size:20px}
.desktop-break{
display:none}
}
@media(max-width:360px){
:root{
--pad:18px}
.hero-title{
font-size:52px}
.hero-descriptor{
font-size:17px}
.hero-support{
font-size:12px}
.work-card{
grid-template-columns:94px 1fr;
gap:16px}
.work-meta h3{
font-size:18px}
.section-topline .text-link{
gap:7px;
font-size:9px}
.contact-link{
font-size:15px}
.recognition-strip a{
gap:13px}
}
.writing-feature h2 > span,.writing-feature h3 > span{
display:none}
@media(max-width:700px){
.career-context .section-title br:first-of-type{
display:initial}
.footer-links a{
min-height:44px}
}
@media(prefers-reduced-motion:reduce){
html{
scroll-behavior:auto}
*,*::before,*::after{
transition:none!important;
animation:none!important}
}

.contact-page-content{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,7vw,112px);align-items:start;padding-top:clamp(56px,9vw,128px);padding-bottom:clamp(72px,12vw,160px)}
.contact-page-content .contact-link{display:inline-flex;margin-top:24px}
.bio-download{border-top:1px solid var(--line,#444);padding-top:20px}
.bio-download h2{font-size:clamp(28px,3vw,40px);margin:12px 0}
.bio-download>p:not(.eyebrow){font-size:14px;line-height:1.7;max-width:58ch;color:var(--muted,#999)}
@media(max-width:700px){.contact-page-content{grid-template-columns:1fr;gap:52px}}
