/* ---------- fonts (self-hosted, SIL Open Font License; see assets/fonts/LICENSE-*) ---------- */
@font-face{font-family:"Bodoni Moda";font-style:normal;font-weight:400 900;font-display:swap;src:url(../fonts/bodoni-moda-latin-opsz-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Bodoni Moda";font-style:italic;font-weight:400 900;font-display:swap;src:url(../fonts/bodoni-moda-latin-opsz-italic.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Archivo";font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/archivo-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Bodoni Moda";font-style:normal;font-weight:400 900;font-display:swap;src:url(../fonts/bodoni-moda-latin-ext-opsz-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Bodoni Moda";font-style:italic;font-weight:400 900;font-display:swap;src:url(../fonts/bodoni-moda-latin-ext-opsz-italic.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Archivo";font-style:normal;font-weight:100 900;font-display:swap;src:url(../fonts/archivo-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}


/* ---------- tokens ---------- */
:root{
  color-scheme: dark;
  --ink:#141312;
  --ink-deep:#0B0A0A;
  --ink-raise:#1C1A18;
  --paper:#EFEAE1;
  --paper-2:#E4DED2;
  --ash:#948D83;          /* secondary type on dark */
  --stone:#5B554D;        /* secondary type on paper */
  --rule-d:rgba(239,234,225,.16);
  --rule-p:rgba(20,19,18,.18);
  --focus:#C9C2B6;
  --serif:"Bodoni Moda", "Didot", "Times New Roman", serif;
  --sans:"Archivo", "Helvetica Neue", Arial, sans-serif;
  --pad:clamp(20px,5vw,72px);
  --maxw:1440px;
  --ease:cubic-bezier(.2,.7,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html:focus-within{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--ink);
  color:var(--paper);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.65;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad)}
.skip{position:absolute;left:-9999px;top:0;z-index:100;background:var(--paper);color:var(--ink);padding:12px 18px}
.skip:focus{left:12px;top:12px}

/* ---------- type ---------- */
h1,h2,h3,h4{font-family:var(--serif);font-weight:400;margin:0;letter-spacing:-.01em;line-height:1.02}
.h-sec{font-size:clamp(2.1rem,4.6vw,3.6rem);line-height:1.04}
p{margin:0 0 1.15em}
.lede{font-size:clamp(1.05rem,1.55vw,1.3rem);line-height:1.6;color:var(--paper);max-width:40ch}
.meta{font-size:.82rem;letter-spacing:.02em;color:var(--ash)}
.rule{height:1px;background:var(--rule-d);border:0;margin:0}

/* ---------- nav ---------- */
.nav{position:fixed;inset:0 0 auto 0;z-index:60;transition:background .4s var(--ease),border-color .4s var(--ease);border-bottom:1px solid transparent}
.nav.is-stuck{background:rgba(20,19,18,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom-color:var(--rule-d)}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:66px}
.brand{font-family:var(--serif);font-size:1.16rem;letter-spacing:.04em}
.brand span{color:var(--ash);font-family:var(--sans);font-size:.72rem;letter-spacing:.06em;margin-left:10px;display:none}
@media(min-width:900px){.brand span{display:inline}}
.nav-links{display:none;gap:30px;align-items:center}
@media(min-width:880px){.nav-links{display:flex}}
.nav-links a{font-size:.88rem;color:var(--ash);transition:color .25s var(--ease);position:relative;padding-block:6px}
.nav-links a:hover{color:var(--paper)}
.nav-links a.cta{color:var(--paper);border:1px solid var(--rule-d);padding:9px 18px;border-radius:2px}
.nav-links a.cta:hover{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.burger{display:flex;flex-direction:column;gap:5px;padding:12px;margin-right:-12px}
@media(min-width:880px){.burger{display:none}}
.burger i{display:block;width:22px;height:1px;background:var(--paper);transition:transform .3s var(--ease),opacity .3s var(--ease)}
body.menu-open .burger i:nth-child(1){transform:translateY(6px) rotate(45deg)}
body.menu-open .burger i:nth-child(2){opacity:0}
body.menu-open .burger i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.menu{position:fixed;inset:0;z-index:55;background:var(--ink-deep);display:flex;flex-direction:column;justify-content:center;padding:0 var(--pad);opacity:0;visibility:hidden;transition:opacity .35s var(--ease),visibility 0s linear .35s}
/* visibility switches on instantly when opening, so focus can move into the menu */
body.menu-open .menu{opacity:1;visibility:visible;transition:opacity .35s var(--ease),visibility 0s}
.menu a{font-family:var(--serif);font-size:clamp(2rem,9vw,3rem);padding:.22em 0;border-bottom:1px solid var(--rule-d)}
.menu a:last-child{border-bottom:0}

/* ---------- hero ---------- */
.hero{min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;padding-top:96px;position:relative}
.hero-top{padding-bottom:clamp(26px,4.5vh,54px)}
.hero h1{font-size:clamp(2.9rem,min(11.6vw,20vh),9.8rem);line-height:.86;letter-spacing:-.025em;margin-bottom:.14em}
.hero h1 em{font-style:italic;font-weight:400}
.hero-grid{display:grid;gap:clamp(22px,4vw,64px);grid-template-columns:1fr}
@media(min-width:900px){.hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:end}}
.role{font-family:var(--serif);font-size:clamp(1.15rem,2.1vw,1.7rem);line-height:1.25;color:var(--paper)}
.role b{font-weight:400;display:block}
.role .sub{display:block;color:var(--ash);font-family:var(--sans);font-size:.85rem;margin-top:14px;letter-spacing:.02em}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.btn{display:inline-block;padding:13px 26px;border:1px solid var(--rule-d);border-radius:2px;font-size:.9rem;transition:background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease)}
.btn:hover{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.btn-solid{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.btn-solid:hover{background:transparent;color:var(--paper);border-color:var(--rule-d)}

/* shelf */
.shelf-wrap{border-top:1px solid var(--rule-d);overflow:hidden}
.shelf{display:flex;align-items:flex-end;justify-content:center;gap:clamp(4px,.7vw,10px);padding:0 var(--pad);margin:0;list-style:none;transform:translateY(1px)}
.shelf li{flex:0 0 auto;filter:drop-shadow(0 -6px 18px rgba(0,0,0,.5))}
.shelf img{height:clamp(150px,22vh,242px);width:auto;max-width:none;display:block;border-top:1px solid rgba(255,255,255,.07);border-left:1px solid rgba(255,255,255,.06)}
@media(min-width:900px){.shelf img{height:clamp(150px,min(22vh,12.4vw),242px)}}
@media(max-width:760px){.shelf li:nth-child(n+6){display:none}}
@media(max-width:560px){.shelf li:nth-child(n+5){display:none}}
@media(max-width:400px){.shelf li:nth-child(n+4){display:none}}
.reveal-up{opacity:0;transform:translateY(26px)}
.ready .reveal-up{opacity:1;transform:none;transition:opacity .9s var(--ease),transform 1.1s var(--ease);transition-delay:var(--d,0ms)}

/* ---------- section head ---------- */
.sec{padding-block:clamp(72px,11vh,148px)}
.sec-head{display:grid;gap:18px;grid-template-columns:1fr;align-items:end;margin-bottom:clamp(36px,5vw,64px);padding-top:26px;border-top:1px solid var(--rule-d)}
@media(min-width:900px){.sec-head{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:48px}}
.sec-head p{margin:0;color:var(--ash);max-width:46ch;font-size:.98rem}

/* ---------- work grid (front covers) ---------- */
.grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(30px,4vw,56px) clamp(14px,2.4vw,34px);align-items:start}
@media(min-width:760px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1180px){.grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.tile{display:block;position:relative;container-type:inline-size;border-radius:1px}
.tile-img{display:block;position:relative;background:var(--ink-raise);box-shadow:0 18px 40px -22px rgba(0,0,0,.8);transition:transform .7s var(--ease),box-shadow .7s var(--ease)}
.tile-img::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(239,234,225,.07);pointer-events:none}
/* the artwork is never cropped: the box takes the artwork's own ratio and the image is contained */
.tile-img img,.tile-img picture{display:block;width:100%;height:100%}
.tile-img img{object-fit:contain}
.tile:hover .tile-img,.tile:focus-visible .tile-img{transform:translateY(-5px);box-shadow:0 28px 50px -24px rgba(0,0,0,.9)}
.tile-cap{display:block;padding-top:14px;margin-top:0;border-top:1px solid transparent;transition:border-color .35s var(--ease)}
.tile:hover .tile-cap,.tile:focus-visible .tile-cap{border-top-color:var(--rule-d)}
.tile-cap h3{font-size:clamp(1.02rem,1.4vw,1.3rem);line-height:1.15}
.tile-cap .a{display:block;font-family:var(--sans);font-size:.78rem;color:var(--ash);margin-top:6px;line-height:1.45}

/* ---------- case study ---------- */
.case{background:var(--ink-deep);padding-block:clamp(72px,11vh,140px);border-block:1px solid var(--rule-d)}
.case-head{display:grid;gap:26px;grid-template-columns:1fr;margin-bottom:clamp(30px,4vw,54px)}
@media(min-width:960px){.case-head{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(40px,6vw,90px);align-items:start}}
.case h2{font-size:clamp(2.2rem,5vw,4.1rem);line-height:.98;max-width:14ch}
.case h2 em{font-style:italic}
.case-fig{margin:0;margin-inline:min(calc(-1 * var(--pad)), calc((1440px - 100vw)/2));position:relative}
.case-fig img{width:100%}
.ruler{position:relative;height:104px;display:none}
@media(min-width:900px){.ruler{display:block}}
.tick{position:absolute;top:0;width:1px;background:var(--rule-d)}
.tick i{position:absolute;top:-3px;left:-2px;width:5px;height:5px;background:var(--ash);border-radius:50%}
.tick span{position:absolute;left:0;width:172px;font-size:.73rem;line-height:1.35;color:var(--ash);transform:translateX(-50%)}
.tick.l span{transform:translateX(-8%)}
.tick.r span{transform:translateX(-92%);text-align:right}
.zones{list-style:none;margin:22px 0 0;padding-inline:var(--pad);display:grid;gap:10px}
@media(min-width:900px){.zones{display:none}}
.zones li{font-size:.85rem;color:var(--ash);padding-left:14px;border-left:1px solid var(--rule-d)}
.case-open{font-size:.82rem;color:var(--ash);border-bottom:1px solid var(--rule-d);padding:0 0 3px;margin:22px var(--pad) 0;transition:color .25s var(--ease),border-color .25s var(--ease)}
.case-open:hover{color:var(--paper);border-bottom-color:var(--paper)}
.case-cols{display:grid;gap:clamp(24px,4vw,56px);grid-template-columns:1fr;margin-top:clamp(40px,6vw,76px)}
@media(min-width:820px){.case-cols{grid-template-columns:repeat(3,1fr)}}
.case-cols h3,.case-cols h4{font-family:var(--sans);font-size:.82rem;font-weight:500;color:var(--ash);margin-bottom:12px;letter-spacing:.02em}
.case-cols p{font-size:.95rem;color:#CFC9BF}
.pull{font-family:var(--serif);font-style:italic;font-size:clamp(1.3rem,2.4vw,2rem);line-height:1.35;max-width:30ch;color:var(--paper)}

/* ---------- paper pages ---------- */
.pages{background:var(--paper);color:var(--ink)}
.pages .h-sec{color:var(--ink)}
.pages .sec-head{border-top-color:var(--rule-p)}
.pages .sec-head p{color:var(--stone)}
.pages .rule{background:var(--rule-p)}
.about-grid{display:grid;gap:clamp(26px,4vw,64px);grid-template-columns:1fr}
@media(min-width:900px){.about-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}}
.about p{font-size:1.02rem;line-height:1.75;color:#2B2925;max-width:56ch}
.about .first{font-family:var(--serif);font-size:clamp(1.3rem,2.3vw,1.85rem);line-height:1.4;color:var(--ink);max-width:24ch}
.facts{display:grid;grid-template-columns:repeat(2,1fr);gap:0;border-top:1px solid var(--rule-p)}
.facts div{padding:20px 4px;border-bottom:1px solid var(--rule-p)}
.facts div:nth-child(odd){padding-right:20px}
@media(min-width:620px){.facts{grid-template-columns:repeat(4,1fr)}.facts div{border-right:1px solid var(--rule-p);padding:20px 18px}.facts div:first-child{padding-left:0}.facts div:last-child{border-right:0}}
.facts b{display:block;font-family:var(--serif);font-size:clamp(1.5rem,2.6vw,2.1rem);font-weight:400;line-height:1}
.facts span{display:block;font-size:.78rem;color:var(--stone);margin-top:9px}
.svc{display:grid;gap:0;grid-template-columns:1fr;border-top:1px solid var(--rule-p)}
@media(min-width:780px){.svc{grid-template-columns:repeat(2,1fr);column-gap:clamp(30px,5vw,80px)}}
.svc section{padding:26px 0;border-bottom:1px solid var(--rule-p)}
.svc h3{font-size:clamp(1.3rem,2vw,1.7rem);margin-bottom:12px}
.svc p{color:var(--stone);font-size:.93rem;margin-bottom:14px;max-width:44ch}
.svc ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 18px}
.svc li{font-size:.86rem;color:#37342F}
.steps{display:grid;gap:0;grid-template-columns:1fr;border-top:1px solid var(--rule-p)}
@media(min-width:760px){.steps{grid-template-columns:repeat(4,1fr)}}
.steps li{list-style:none;padding:24px 0;border-bottom:1px solid var(--rule-p)}
@media(min-width:760px){.steps li{padding:26px 22px 40px;border-right:1px solid var(--rule-p);border-bottom:0}.steps li:first-child{padding-left:0}.steps li:last-child{border-right:0}}
.steps em{font-family:var(--serif);font-style:normal;font-size:1.05rem;color:var(--stone);display:block;margin-bottom:16px}
.steps h3{font-size:1.25rem;margin-bottom:9px}
.steps p{font-size:.9rem;color:var(--stone);margin:0;max-width:34ch}

/* ---------- experience ---------- */
.xp{display:grid;gap:clamp(24px,4vw,60px);grid-template-columns:1fr}
@media(min-width:900px){.xp{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}}
.xp-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule-d)}
.xp-list li{display:flex;justify-content:space-between;gap:20px;padding:17px 0;border-bottom:1px solid var(--rule-d);font-size:.95rem}
.xp-list span{color:var(--ash);text-align:right}

/* ---------- contact ---------- */
.contact{background:var(--ink-deep);border-top:1px solid var(--rule-d)}
.form-grid{display:grid;gap:22px 26px;grid-template-columns:1fr}
@media(min-width:700px){.form-grid{grid-template-columns:1fr 1fr}.f-full{grid-column:1/-1}}
label{display:block;font-size:.8rem;color:var(--ash);margin-bottom:8px}
input,select,textarea{width:100%;background:transparent;border:0;border-bottom:1px solid var(--rule-d);color:var(--paper);font:inherit;font-size:1rem;padding:10px 0;border-radius:0;transition:border-color .3s var(--ease)}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ash) 50%),linear-gradient(135deg,var(--ash) 50%,transparent 50%);background-position:calc(100% - 11px) 50%,calc(100% - 6px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-right:24px}
select option{background:var(--ink);color:var(--paper)}
textarea{resize:vertical;min-height:120px}
input:focus,select:focus,textarea:focus{outline:0;border-bottom-color:var(--paper)}
fieldset{border:0;margin:0;padding:0;min-width:0}
legend{padding:0;font-size:.8rem;color:var(--ash);margin-bottom:8px}
.fmt{display:flex;flex-wrap:wrap;gap:9px}
.fmt label{display:inline-flex;align-items:center;gap:8px;margin:0;border:1px solid var(--rule-d);padding:8px 14px;border-radius:2px;color:var(--paper);font-size:.86rem;cursor:pointer;transition:border-color .25s var(--ease),background .25s var(--ease)}
.fmt input{width:auto;accent-color:var(--paper);margin:0}
.fmt label:has(input:focus-visible){outline:2px solid var(--focus);outline-offset:2px}
.fmt label:has(input:checked){background:rgba(239,234,225,.1);border-color:var(--paper)}
.err{color:#E9A9A0;font-size:.78rem;margin-top:6px;min-height:1em;display:block}
.form-foot{display:flex;flex-wrap:wrap;align-items:center;gap:18px;margin-top:30px}
.status{font-size:.86rem;color:var(--ash)}
.links{list-style:none;margin:26px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 26px}
.links a{font-size:.9rem;border-bottom:1px solid var(--rule-d);padding-bottom:3px}
.links a:hover{border-bottom-color:var(--paper)}
footer{border-top:1px solid var(--rule-d);padding-block:34px;font-size:.82rem;color:var(--ash)}
.foot-in{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px}

/* ---------- project overlay ---------- */
.ov{position:fixed;inset:0;z-index:80;background:var(--ink);overflow-y:auto;opacity:0;visibility:hidden;transition:opacity .35s var(--ease),visibility .35s}
.ov.open{opacity:1;visibility:visible}
.ov-bar{position:sticky;top:0;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px var(--pad);background:rgba(20,19,18,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--rule-d)}
.ov-bar .t{font-family:var(--serif);font-size:1.05rem}
.ov-nav{display:flex;gap:6px;align-items:center}
.ov-nav button{padding:9px 14px;border:1px solid var(--rule-d);border-radius:2px;font-size:.82rem;transition:background .25s var(--ease),color .25s var(--ease)}
.ov-nav button:hover{background:var(--paper);color:var(--ink)}
.ov-body{padding:clamp(24px,4vw,56px) var(--pad) clamp(60px,10vh,120px);max-width:var(--maxw);margin:0 auto}
.ov-title{font-size:clamp(2.1rem,5vw,4.2rem);line-height:.98;margin-bottom:12px}
.ov-sub{color:var(--ash);font-size:.95rem;margin-bottom:clamp(24px,4vw,44px)}
.ov-cols{display:grid;gap:clamp(26px,4vw,56px);grid-template-columns:1fr}
@media(min-width:900px){.ov-cols{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}}
.ov-cols h4{font-family:var(--sans);font-size:.8rem;font-weight:500;color:var(--ash);margin:0 0 12px}
.ov-cols p{color:#CFC9BF;font-size:1rem;line-height:1.72;max-width:58ch}
.ov-meta dl{margin:0;border-top:1px solid var(--rule-d)}
.ov-meta div{padding:15px 0;border-bottom:1px solid var(--rule-d)}
.ov-meta dt{font-size:.78rem;color:var(--ash);margin-bottom:5px}
.ov-meta dd{margin:0;font-size:.94rem}
.note{font-size:.8rem;color:var(--ash);border-left:1px solid var(--rule-d);padding-left:14px;margin-top:26px;max-width:52ch}

@media (prefers-reduced-motion: reduce){
  html:focus-within{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
  .reveal-up{opacity:1;transform:none}
}

/* =========================================================
   ADDITIONS
   ========================================================= */
.vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* hero trust line */
.trust{list-style:none;margin:18px 0 0 -25px;padding:0;display:flex;flex-wrap:wrap;gap:4px 0;font-family:var(--sans);font-size:.8rem;letter-spacing:.02em;color:var(--ash);line-height:1.5;clip-path:inset(0 0 0 25px)}
/* separators sit in the gap before each item; the one that starts a new line is clipped away */
.trust li{white-space:nowrap;position:relative;margin-left:25px}
.trust li::before{content:"";position:absolute;left:-14px;top:50%;width:3px;height:3px;margin-top:-1px;border-radius:50%;background:currentColor;opacity:.6}

/* services */
.svc-primary h3{font-size:clamp(1.35rem,2.1vw,1.8rem)}
.svc-extra{margin-top:clamp(34px,5vw,56px);display:grid;gap:12px 40px;grid-template-columns:1fr;align-items:baseline}
@media(min-width:780px){.svc-extra{grid-template-columns:minmax(0,.55fr) minmax(0,1.45fr)}}
.svc-extra h3{font-family:var(--sans);font-size:.88rem;font-weight:500;color:var(--ink);letter-spacing:.01em}
.svc-extra p{margin:0;color:var(--stone);font-size:.92rem;max-width:62ch}

/* testimonials */
.words{padding-block:clamp(72px,11vh,140px)}
.quotes{list-style:none;margin:0;padding:0;display:grid;gap:clamp(34px,4vw,60px);grid-template-columns:1fr}
@media(min-width:900px){.quotes{grid-template-columns:repeat(var(--n,3),minmax(0,1fr))}}
.quotes figure{margin:0;padding-top:22px;border-top:1px solid var(--rule-d);display:flex;flex-direction:column;height:100%}
.quotes blockquote{margin:0 0 22px;font-family:var(--serif);font-size:clamp(1.12rem,1.55vw,1.36rem);line-height:1.5;color:var(--paper)}
.quotes blockquote p{margin:0}
.quotes figcaption{margin-top:auto;font-size:.84rem;color:var(--paper)}
.quotes figcaption span{display:block;color:var(--ash);font-size:.78rem;margin-top:3px}
.case-quote{margin:clamp(40px,6vw,72px) 0 0;max-width:46ch}

/* the well: editions and recognition */
.case-more{display:grid;gap:clamp(34px,5vw,80px);grid-template-columns:1fr;margin-top:clamp(56px,8vw,110px);padding-top:clamp(28px,3vw,40px);border-top:1px solid var(--rule-d)}
@media(min-width:900px){.case-more{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:start}}
.editions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,2.4vw,30px);margin:0;padding:0;list-style:none}
.editions figure{margin:0}
.editions .ed-img{display:block;background:var(--ink-raise);box-shadow:0 18px 40px -22px rgba(0,0,0,.8)}
.editions picture{display:block;height:100%}
.editions img{width:100%;height:100%;object-fit:contain}
.editions figcaption{font-size:.78rem;color:var(--ash);margin-top:10px;line-height:1.45}
.case-more h3{font-family:var(--sans);font-size:.82rem;font-weight:500;color:var(--ash);margin:0 0 12px;letter-spacing:.02em}
.case-more p{font-size:.95rem;color:#CFC9BF;max-width:52ch}
.awards{list-style:none;margin:18px 0 0;padding:0;border-top:1px solid var(--rule-d)}
.awards li{padding:13px 0;border-bottom:1px solid var(--rule-d);font-size:.9rem;color:var(--paper)}
.case-open.inline{display:inline-block;margin:26px 0 0}

/* project article (overlay + standalone page share this) */
.proj-top{display:grid;gap:clamp(28px,5vw,80px);grid-template-columns:1fr;align-items:center;margin-bottom:clamp(48px,7vw,96px)}
@media(min-width:900px){.proj-top{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.proj-front{margin:0;display:flex;justify-content:center}
.proj-front .fig-btn{width:min(100%,calc(min(78vh,880px) * var(--r,.6667)))}
.proj-info .ov-sub{margin-bottom:22px}
.proj-info .btn{margin-top:28px}
.proj-rec-h{font-family:var(--sans);font-size:.78rem;font-weight:500;color:var(--ash);letter-spacing:.02em;margin:0 0 8px}
.proj-rec{list-style:none;margin:0 0 24px;padding:0;max-width:48ch}
.proj-rec li{font-size:.9rem;color:#CFC9BF;padding:7px 0;border-bottom:1px solid var(--rule-d)}
.proj-rec li:first-child{border-top:1px solid var(--rule-d)}
.proj-sec{margin-bottom:clamp(48px,7vw,90px)}
.proj-sec>h3,.proj-h{font-family:var(--sans);font-size:.82rem;font-weight:500;color:var(--ash);letter-spacing:.02em;padding-top:16px;border-top:1px solid var(--rule-d);margin-bottom:22px}
.proj-sec .figs{display:grid;gap:clamp(18px,3vw,40px);grid-template-columns:1fr}
.proj-sec.is-cover .figs{grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),340px));justify-content:start}
.proj-sec figure{margin:0}
.proj-sec figcaption{font-size:.8rem;color:var(--ash);margin-top:10px;max-width:70ch}
.proj-notes{display:grid;gap:clamp(26px,4vw,56px);grid-template-columns:1fr}
@media(min-width:820px){.proj-notes{grid-template-columns:repeat(var(--n,3),minmax(0,1fr))}}
.proj-notes h3,.note-h{font-family:var(--sans);font-size:.8rem;font-weight:500;color:var(--ash);margin:0 0 12px}
.proj-notes p{color:#CFC9BF;font-size:.97rem;line-height:1.72;max-width:52ch}

/* zoomable figures: never stretched; zoom shows the file at its own pixel size */
.fig-btn{display:block;width:100%;padding:0;position:relative;line-height:0;cursor:zoom-in;background:var(--ink-raise);text-align:left}
.fig-btn picture{display:block;height:100%}
.fig-btn img{width:100%;height:100%;object-fit:contain}
.fig-btn .zoom-hint{line-height:1.4}
.fig-btn .zoom-hint{position:absolute;right:10px;bottom:10px;font-size:.72rem;color:var(--paper);background:rgba(20,19,18,.72);padding:5px 9px;border-radius:2px;opacity:0;transition:opacity .3s var(--ease)}
.fig-btn:hover .zoom-hint,.fig-btn:focus-visible .zoom-hint{opacity:1}
figure.is-zoomed{overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
figure.is-zoomed .fig-btn{cursor:zoom-out;width:max-content!important;aspect-ratio:auto!important;background:none}
figure.is-zoomed .fig-btn img{width:var(--zw)!important;max-width:none;height:auto}
.proj-front.is-zoomed{justify-content:flex-start}

/* project nav on standalone pages */
.page-proj{padding-top:110px}
.proj-pager{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;border-top:1px solid var(--rule-d);padding-top:22px;margin-top:clamp(40px,6vw,80px)}
.proj-pager a{font-size:.9rem;border-bottom:1px solid var(--rule-d);padding-bottom:3px}
.proj-pager a:hover{border-bottom-color:var(--paper)}
.proj-pager small{display:block;font-size:.74rem;color:var(--ash);border:0}

/* contact */
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
input[aria-invalid="true"],textarea[aria-invalid="true"]{border-bottom-color:#E9A9A0}
.btn[disabled]{opacity:.55;cursor:progress}
.sent{padding:clamp(28px,4vw,48px) 0;border-top:1px solid var(--rule-d);max-width:52ch}
.sent h3{font-size:clamp(1.8rem,3.4vw,2.6rem);margin-bottom:16px}
.sent p{color:#CFC9BF}
.sent:focus{outline:0}

/* preview build only */
.pv-bar{position:fixed;left:0;right:0;bottom:0;z-index:90;background:#3a2f12;color:#F3E6BF;font-size:.8rem;padding:9px var(--pad);padding-bottom:calc(9px + env(safe-area-inset-bottom,0px));text-align:center}
.pv-tag{position:absolute;left:8px;top:8px;right:8px;z-index:2;background:rgba(58,47,18,.93);color:#F3E6BF;font-family:var(--sans);font-size:.68rem;line-height:1.4;padding:6px 8px;border-radius:2px;text-align:left}
.pv-tag b{font-weight:600;display:block}
.pv-media{display:inline-block;margin-top:6px;font-size:.7rem;background:#3a2f12;color:#F3E6BF;padding:3px 7px;border-radius:2px}
.menu nav{display:flex;flex-direction:column}

/* the well: other formats, shown whole at one shared height */
.case-strip{list-style:none;margin:clamp(56px,8vw,110px) 0 0;padding:0;display:flex;gap:clamp(14px,2vw,28px);align-items:flex-start}
.case-strip li{flex:var(--f) 1 0;min-width:0}
.case-strip figure{margin:0}
.case-strip .ed-img{display:block;background:var(--ink-raise);box-shadow:0 18px 40px -22px rgba(0,0,0,.8);transition:transform .7s var(--ease)}
.case-strip .ed-img:hover,.case-strip .ed-img:focus-visible{transform:translateY(-4px)}
.case-strip picture,.case-strip img{display:block;width:100%;height:100%;object-fit:contain}
.case-strip figcaption{font-size:.78rem;color:var(--ash);margin-top:10px;line-height:1.45}
@media(max-width:699px){
  .case-strip{flex-wrap:wrap}
  .case-strip li{flex:1 1 100%}
  .case-strip li[style*="--f:0."]{flex:0 1 62%}
}
.case-strip+.case-more{margin-top:clamp(40px,5vw,64px)}

/* blog (only generated once enough articles are published) */
.prose{max-width:68ch}
.prose h2{font-size:clamp(1.5rem,2.6vw,2.1rem);margin:1.6em 0 .55em}
.prose h3{font-size:1.25rem;margin:1.4em 0 .5em}
.prose p,.prose li{color:#CFC9BF;font-size:1.02rem;line-height:1.78}
.prose ul,.prose ol{padding-left:1.2em;margin:0 0 1.15em}
.prose a{border-bottom:1px solid var(--rule-d)}
.prose a:hover{border-bottom-color:var(--paper)}
.prose a.btn{border-bottom:1px solid var(--paper)}
.prose blockquote{margin:1.4em 0;padding-left:18px;border-left:1px solid var(--rule-d);font-family:var(--serif);font-size:1.2rem}
.prose code{font-size:.9em;background:var(--ink-raise);padding:1px 5px;border-radius:2px}
.post-meta{display:block;font-size:.78rem;color:var(--ash);margin-bottom:14px}
.post .ov-title{margin-bottom:28px}
.post-cta{margin-top:48px;padding-top:24px;border-top:1px solid var(--rule-d)}
.post-rel{margin-top:40px;max-width:200px}
.post-rel .h,.post-list .h{font-family:var(--serif);font-size:1.15rem;display:block;line-height:1.2}
.post-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule-d)}
.post-list a{display:block;padding:24px 0;border-bottom:1px solid var(--rule-d)}
.post-list .h{font-size:clamp(1.3rem,2.2vw,1.8rem);margin-bottom:8px}
.post-list .d{display:block;color:var(--ash);max-width:62ch;font-size:.95rem}