:root{
  --paper:#F1EEE6;
  --sand:#E7E1D4;
  --sand-deep:#DBD3C3;
  --line:rgba(31,31,29,.14);
  --olive:#8B8C6F;
  --olive-deep:#6A6A57;
  --charcoal:#1F1F1D;
  --charcoal-2:#262624;
  --ink:#22221F;
  --ink-soft:#5E5C53;
  --on-dark:#F1EEE6;
  --on-dark-soft:rgba(241,238,230,.66);
  --on-dark-line:rgba(241,238,230,.16);
  --olive-light:#B9B79A;
  --serif:"Newsreader","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --sans:"Avenir Next","Avenir","Figtree","Helvetica Neue",Arial,sans-serif;
  --max:1240px;
  --gutter:clamp(20px,5vw,72px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,h4{margin:0;font-weight:400;text-wrap:balance}
p{margin:0}
em,.it{font-style:italic;color:var(--olive)}
.dark em,.dark .it{color:var(--olive-light)}
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}
.eyebrow{font-size:9.5px;letter-spacing:.34em;text-transform:uppercase;color:var(--ink-soft);font-weight:500;display:block}
.dark .eyebrow{color:var(--on-dark-soft)}
.serif{font-family:var(--serif)}
.h-hero{font-family:var(--serif);font-weight:300;font-size:clamp(46px,7.6vw,108px);line-height:1;letter-spacing:-.015em}
.h-xl{font-family:var(--serif);font-weight:300;font-size:clamp(34px,4.6vw,64px);line-height:1.08;letter-spacing:-.01em}
.h-l{font-family:var(--serif);font-weight:300;font-size:clamp(30px,3.8vw,52px);line-height:1.1;letter-spacing:-.01em}
.h-m{font-family:var(--serif);font-weight:400;font-size:clamp(22px,2.2vw,30px);line-height:1.2}
.body{color:var(--ink-soft);max-width:32em;font-size:15px}
.body.serif{font-family:var(--serif);font-size:clamp(17px,1.5vw,21px);line-height:1.5;color:var(--ink)}
.dark .body{color:var(--on-dark-soft)}
.dark .body.serif{color:var(--on-dark)}
.dark{background:var(--charcoal);color:var(--on-dark)}
.sand{background:var(--sand)}
.paper{background:var(--paper)}

/* wordmark */
.wordmark{display:inline-flex;flex-direction:column;align-items:flex-start;text-decoration:none;line-height:1;font-family:var(--sans)}
.wordmark .name{font-weight:300;letter-spacing:.4em;text-transform:uppercase;font-size:var(--wm,18px)}
.wordmark .sub{font-weight:400;letter-spacing:.22em;font-size:calc(var(--wm,18px)*.5);margin-top:.55em;opacity:.75}

/* links + buttons */
.arrow-link{display:inline-flex;flex-direction:column;gap:9px;text-decoration:none;font-size:9.5px;letter-spacing:.32em;text-transform:uppercase;font-weight:500;align-self:flex-start}
.arrow-link span::after{content:"\2192";margin-left:12px;letter-spacing:0;font-size:12px}
.arrow-link::after{content:"";height:1px;background:currentColor;opacity:.6;transition:opacity .25s}
.arrow-link:hover::after{opacity:1}
.btn{display:inline-flex;align-items:center;gap:14px;padding:16px 26px;border:1px solid currentColor;text-decoration:none;font-size:9.5px;letter-spacing:.32em;text-transform:uppercase;font-weight:500;background:transparent;color:inherit;cursor:pointer;font-family:inherit;transition:background .25s,color .25s,border-color .25s;white-space:nowrap}
.btn::after{content:"\2192";letter-spacing:0;font-size:12px}
.btn.plain::after{content:none}
.btn:hover,.btn:focus-visible{background:var(--charcoal);color:var(--on-dark);border-color:var(--charcoal);outline:none}
.dark .btn:hover,.dark .btn:focus-visible{background:var(--paper);color:var(--charcoal);border-color:var(--paper)}
:focus-visible{outline:2px solid var(--olive);outline-offset:3px}

/* nav */
.nav{position:fixed;left:0;right:0;top:0;z-index:30;padding-top:env(safe-area-inset-top,0px);color:var(--on-dark);transition:background .3s,color .3s,box-shadow .3s}
.nav.scrolled{background:rgba(241,238,230,.94);backdrop-filter:blur(10px);color:var(--ink);box-shadow:0 1px 0 var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:84px}
.nav-right{display:flex;align-items:center;gap:30px}
.nav ul{list-style:none;margin:0;padding:0;display:flex;gap:28px}
.nav li a{text-decoration:none;font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;font-weight:500;white-space:nowrap;opacity:.85}
.nav li a:hover{opacity:1}
.nav .sep{width:1px;height:18px;background:currentColor;opacity:.3}
.nav .cta{text-decoration:none;font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;font-weight:500;white-space:nowrap}
.nav .cta::after{content:"\2192";margin-left:12px;letter-spacing:0;font-size:12px}
.menu-btn{display:none;background:none;border:1px solid currentColor;padding:9px 14px;font:inherit;font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;cursor:pointer;color:inherit;opacity:.85}
@media (max-width:1000px){
  .nav ul,.nav .sep,.nav .cta{display:none}
  .nav.open{background:var(--paper);color:var(--ink)}
  .nav ul.show{display:flex;position:absolute;left:0;right:0;top:100%;background:var(--paper);color:var(--ink);border-block:1px solid var(--line);flex-direction:column;gap:0;padding:8px 0}
  .nav li a{display:block;padding:14px var(--gutter)}
  .menu-btn{display:inline-block}
}

/* hero */
.hero{position:relative;min-height:clamp(560px,92vh,860px);background:#5c5a50 url(../images/hero.jpg) center 40%/cover no-repeat;color:var(--on-dark);display:flex;align-items:flex-end}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,20,18,.6) 0,rgba(20,20,18,.2) 28%,rgba(20,20,18,.32) 60%,rgba(20,20,18,.78) 100%)}
.hero .h-hero{text-shadow:0 2px 24px rgba(0,0,0,.35)}
.hero .h-hero em{color:#C9C7A9}
.hero .wrap{position:relative;width:100%;padding-top:calc(84px + env(safe-area-inset-top,0px));padding-bottom:clamp(40px,6vw,72px);display:flex;flex-direction:column;gap:clamp(36px,8vh,120px)}
.hero .eyebrow{color:rgba(241,238,230,.92);font-size:10px}
.hero-bottom{display:flex;justify-content:space-between;align-items:flex-end;gap:32px}
.hero-sub{font-family:var(--sans);font-size:14px;line-height:1.7;max-width:22em;color:rgba(241,238,230,.85)}
.hero-more{width:44px;height:44px;border:1px solid rgba(241,238,230,.6);border-radius:50%;display:flex;align-items:center;justify-content:center;text-decoration:none;font-size:16px;flex:none}
@media (max-width:640px){.hero-bottom{flex-direction:column;align-items:flex-start}}

/* sections */
section{padding-block:clamp(64px,8vw,120px)}
section.tight{padding-block:0}
.split{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:40px clamp(40px,7vw,120px);align-items:end}
.split .right{display:flex;flex-direction:column;gap:28px;padding-bottom:6px}
.split .eyebrow{margin-bottom:28px}
@media (max-width:800px){.split{grid-template-columns:1fr}.split .right{padding-bottom:0}}

/* why grid */
.why{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.why > div{padding:clamp(36px,4vw,56px) clamp(20px,2.4vw,36px) clamp(40px,4vw,60px) 0;border-right:1px solid var(--line);margin-right:clamp(20px,2.4vw,36px);display:flex;flex-direction:column;gap:22px}
.why > div:last-child{border-right:0;margin-right:0}
.why .n{font-size:9.5px;letter-spacing:.3em;color:var(--ink-soft)}
.why h3{font-family:var(--serif);font-weight:400;font-size:clamp(24px,2.4vw,32px);line-height:1.15;flex:1}
.why p{color:var(--ink-soft);font-size:14px;max-width:20em}
@media (max-width:900px){.why{grid-template-columns:repeat(2,minmax(0,1fr))}.why > div:nth-child(2){border-right:0;margin-right:0}.why > div:nth-child(-n+2){border-bottom:1px solid var(--line)}}
@media (max-width:520px){.why{grid-template-columns:1fr}.why > div{border-right:0;margin-right:0;padding-right:0;border-bottom:1px solid var(--line)}.why > div:last-child{border-bottom:0}}

/* perspective band */
.persp{position:relative;min-height:clamp(380px,48vw,560px);background:#6f7f8a url(../images/perspective.jpg) center/cover no-repeat;color:var(--on-dark);display:flex;align-items:center}
.persp::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,20,18,.15),rgba(20,20,18,.65))}
.persp .wrap{position:relative;display:flex;flex-direction:column;gap:28px;padding-block:clamp(56px,8vw,96px)}
.persp .eyebrow{color:rgba(241,238,230,.8)}
.persp .q{font-family:var(--serif);font-weight:300;font-size:clamp(28px,3.8vw,52px);line-height:1.15;max-width:15em;letter-spacing:-.005em}

/* method */
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);margin-top:clamp(36px,5vw,64px)}
.steps > div{padding:clamp(32px,3.6vw,48px) clamp(20px,2.4vw,40px) clamp(32px,3.6vw,48px) 0;border-right:1px solid var(--line);margin-right:clamp(20px,2.4vw,40px);display:flex;flex-direction:column;gap:16px}
.steps > div:last-child{border-right:0;margin-right:0}
.steps .n{font-size:9.5px;letter-spacing:.3em;color:var(--ink-soft)}
.steps h3{font-family:var(--serif);font-weight:400;font-size:clamp(26px,2.6vw,34px);line-height:1.1}
.steps p{color:var(--ink-soft);font-size:14px;max-width:22em}
.after{margin-top:clamp(36px,5vw,56px)}
@media (max-width:700px){.steps{grid-template-columns:1fr}.steps > div{border-right:0;margin-right:0;padding-right:0;border-bottom:1px solid var(--line)}.steps > div:last-child{border-bottom:0}}

/* services */
.services{list-style:none;margin:clamp(36px,5vw,64px) 0 0;padding:0;border-top:1px solid var(--on-dark-line)}
.services li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr) auto;gap:14px clamp(24px,5vw,80px);align-items:start;padding:30px 0;border-bottom:1px solid var(--on-dark-line)}
.services h3{font-family:var(--serif);font-weight:400;font-size:clamp(22px,2.2vw,30px);line-height:1.15}
.services .who{font-size:9.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--on-dark-soft);margin-top:10px;display:block}
.services p{color:var(--on-dark-soft);font-size:14.5px;max-width:34em}
.services .tag{font-size:9px;letter-spacing:.26em;text-transform:uppercase;padding:8px 12px;border:1px solid var(--on-dark-line);white-space:nowrap;color:var(--on-dark-soft)}
.services .stack{display:flex;flex-direction:column;align-items:flex-start;gap:18px}
.services .stack p{margin:0}
.services a.tag{display:inline-block;text-decoration:none;transition:color .2s,border-color .2s}
.services a.tag:hover,.services a.tag:focus-visible{color:var(--on-dark);border-color:var(--on-dark)}
@media (max-width:800px){.services li{grid-template-columns:1fr}}

/* life, not a listing */
.life{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:520px}
.life .img{background:#7b8a96 url(../images/life.jpg) center/cover no-repeat;min-height:320px}
.life .panel{background:var(--charcoal);color:var(--on-dark);padding:clamp(48px,7vw,110px) var(--gutter);display:flex;flex-direction:column;justify-content:center;gap:30px}
@media (max-width:800px){.life{grid-template-columns:1fr}}

/* portfolio */
.stories{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,2.5vw,36px);margin-top:clamp(36px,5vw,64px)}
.story{display:flex;flex-direction:column;gap:16px;text-decoration:none;color:inherit}
.story .img{aspect-ratio:4/3;background-size:cover;background-position:center;background-color:var(--sand-deep);position:relative}
.story .img.a{background-image:url(../images/story-a.jpg)}
.story .img.b{background-image:url(../images/story-b.jpg)}
.story .img.c{background-image:url(../images/story-c.jpg)}
.story .img .ex{position:absolute;top:14px;left:14px;font-size:8.5px;letter-spacing:.26em;text-transform:uppercase;padding:6px 10px;background:rgba(241,238,230,.92);color:var(--ink)}
.story .meta{font-size:9.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--ink-soft)}
.story h3{font-family:var(--serif);font-weight:400;font-size:clamp(22px,2vw,28px);line-height:1.15}
.story p{color:var(--ink-soft);font-size:14.5px}
.story:hover .img{outline:1px solid var(--olive);outline-offset:4px}
@media (max-width:760px){.stories{grid-template-columns:1fr}}

/* value */
.value{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:40px clamp(40px,7vw,120px);align-items:center}
.value .right{display:flex;flex-direction:column;gap:28px}
@media (max-width:800px){.value{grid-template-columns:1fr}}

/* about */
.about{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:40px clamp(40px,7vw,120px);align-items:center}
.about .img{aspect-ratio:4/3.3;background:#6e6a5d url(../images/about.jpg) center/cover no-repeat;position:relative}
.about .img .ph{position:absolute;left:0;right:0;bottom:0;padding:9px 14px;font-size:8.5px;letter-spacing:.24em;text-transform:uppercase;background:rgba(31,31,29,.55);color:rgba(255,255,255,.85)}
.about .stack{display:flex;flex-direction:column;gap:24px}
.about .name{font-size:9.5px;letter-spacing:.32em;text-transform:uppercase;font-weight:500;margin-top:14px}
.about .role{font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-soft);margin-top:4px}
.about .regions{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:9.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--ink-soft);padding-top:22px;border-top:1px solid var(--line)}
@media (max-width:800px){.about{grid-template-columns:1fr}}

/* journal */
.posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,2.5vw,36px);margin-top:clamp(36px,5vw,64px)}
.post{display:flex;flex-direction:column;gap:14px;text-decoration:none;color:inherit}
.post .img{aspect-ratio:1.55;background-size:cover;background-position:center;background-color:var(--sand-deep)}
.post .img.a{background-image:url(../images/post-a.jpg)}
.post .img.b{background-image:url(../images/post-b.jpg)}
.post .img.c{background-image:url(../images/post-c.jpg)}
.post .meta{font-size:9px;letter-spacing:.28em;text-transform:uppercase;color:var(--ink-soft);display:flex;justify-content:space-between;gap:12px}
.post h3{font-family:var(--serif);font-weight:400;font-size:clamp(24px,2.2vw,30px);line-height:1.15}
.post p{color:var(--ink-soft);font-size:14.5px;max-width:24em}
.post .arrow-link{margin-top:4px}
.post:hover .img{outline:1px solid var(--olive);outline-offset:4px}
.social-row{display:flex;flex-wrap:wrap;gap:16px 40px;align-items:center;margin-top:clamp(36px,5vw,56px);padding-top:28px;border-top:1px solid var(--line)}
.social-row .note{font-size:14px;color:var(--ink-soft);margin-right:auto}
@media (max-width:760px){.posts{grid-template-columns:1fr}}

/* forms */
.field{display:flex;flex-direction:column;gap:8px}
.field label{font-size:9px;letter-spacing:.3em;text-transform:uppercase;font-weight:500}
.field input,.field select,.field textarea{font:inherit;font-size:15px;padding:13px 0;border:0;border-bottom:1px solid currentColor;background:transparent;color:inherit;border-radius:0;width:100%}
.field select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 14px) 50%,calc(100% - 8px) 50%;background-size:6px 6px;background-repeat:no-repeat;padding-right:32px}
.field select option{color:#222}
.field input::placeholder,.field textarea::placeholder{color:inherit;opacity:.45}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-bottom-color:var(--olive)}
.ok{font-size:15px;padding:18px 0;border-top:1px solid currentColor;margin-top:8px;font-family:var(--serif);font-size:18px}

/* update */
.news{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:40px clamp(40px,7vw,120px);align-items:center}
.news .left{display:flex;flex-direction:column;gap:22px}
.news form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:24px;align-items:end}
@media (max-width:960px){.news{grid-template-columns:1fr}}
@media (max-width:640px){.news form{grid-template-columns:1fr}}

/* close + contact */
.close .lead{display:flex;flex-direction:column;gap:30px}
.close .lead h2{max-width:9em}
.close .lead .body{max-width:30em}
.contact{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:48px clamp(40px,7vw,120px);margin-top:clamp(56px,8vw,110px);padding-top:clamp(40px,6vw,72px);border-top:1px solid var(--on-dark-line)}
.contact form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}
.contact form .full{grid-column:1/-1}
.direct{display:flex;flex-direction:column;gap:22px}
.direct .k{font-size:9px;letter-spacing:.3em;text-transform:uppercase;color:var(--on-dark-soft);display:block;margin-bottom:6px}
.direct .v{font-family:var(--serif);font-size:20px;text-decoration:none}
@media (max-width:800px){.contact{grid-template-columns:1fr}}
@media (max-width:560px){.contact form{grid-template-columns:1fr}}

/* footer */
footer{background:var(--charcoal);color:var(--on-dark);border-top:1px solid var(--on-dark-line)}
footer .row{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:32px clamp(32px,5vw,80px);align-items:start;padding-block:clamp(40px,5vw,64px)}
footer .wordmark{--wm:16px}
footer .col{font-size:9px;letter-spacing:.28em;text-transform:uppercase;color:var(--on-dark-soft);line-height:2.2}
footer .col a{text-decoration:none}
footer .col .icons{display:flex;gap:14px;margin-top:8px}
footer .col .icons svg{width:15px;height:15px;fill:var(--on-dark-soft)}
footer .col .icons a:hover svg{fill:var(--on-dark)}
@media (max-width:860px){footer .row{grid-template-columns:1fr 1fr}}
@media (max-width:520px){footer .row{grid-template-columns:1fr}}

/* pages without a hero */
.nav.static{background:rgba(241,238,230,.94);backdrop-filter:blur(10px);color:var(--ink);box-shadow:0 1px 0 var(--line)}
.page{padding-top:calc(84px + clamp(56px,9vw,120px))}
.page .prose{max-width:38em;color:var(--ink-soft)}
.page .prose h2{font-family:var(--serif);font-weight:400;font-size:clamp(22px,2.2vw,28px);line-height:1.2;color:var(--ink);margin:clamp(36px,5vw,56px) 0 14px}
.page .prose p{margin:0 0 16px}
.page .prose ul{padding-left:1.2em;margin:0 0 16px}
.page .prose li{margin-bottom:6px}
.page .prose a{color:var(--ink)}
.page .updated{font-size:9.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--ink-soft);margin-top:32px;display:block}
.notfound{min-height:70vh;display:flex;align-items:center}
