:root{
  --night:#1B1815; --night2:#252019; --paper:#F4EEE4; --paper2:#EAE1D3; --ink:#1B1815; --muted:#665D54; --line:#D8CDBC;
  --brick:#A8432B; --brick-d:#8C3521; --glow:#F2B79F; --cream:#F4EEE4; --cream-m:#B9AE9F; --sage:#7F9670;
  --serif:"Libre Caslon Text", Georgia, serif; --sans:"Work Sans", system-ui, sans-serif; --mono:"Work Sans", system-ui, sans-serif;
  --t-ink:#1B1815; --t-muted:#665D54; --t-line:#D8CDBC; --t-accent:#A8432B; --t-accent2:#7F9670; --t-accent3:#C9A15B; --t-card:#FBF7F0; --t-bg:#F4EEE4;
  --t-display:"Libre Caslon Text", Georgia, serif; --t-body:"Work Sans", system-ui, sans-serif; --t-mono:"Work Sans", system-ui, sans-serif;
  --gut:clamp(20px,6vw,104px); --ease:cubic-bezier(.2,.7,.1,1); --spring:cubic-bezier(.34,1.56,.64,1);
}
*{box-sizing:border-box}
html{overflow-x:clip;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.6 var(--sans);-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{font-family:var(--serif);font-weight:400;margin:0;letter-spacing:-.012em;text-wrap:balance}
.wrap{max-width:1280px;margin:0 auto;padding-inline:var(--gut)}
.m{font:600 14px/1.3 var(--mono);letter-spacing:0;text-transform:none}
.eyebrow{font:600 14px/1 var(--mono);letter-spacing:0;text-transform:none;color:var(--brick)}
.btn{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 22px;font:500 15px/1 var(--sans);text-decoration:none;border:1px solid currentColor;transition:background .25s,color .25s,border-color .25s;cursor:pointer;background:transparent;color:inherit}
.btn.fill{background:var(--brick);border-color:var(--brick);color:#fff}
.btn.fill:hover{background:var(--brick-d);border-color:var(--brick-d)}
.btn .arr{transition:transform .3s var(--ease)}
.btn:hover .arr{transform:translateX(4px)}
:focus-visible{outline:2px solid var(--brick);outline-offset:3px}

/* nav */
header{position:fixed;top:0;left:0;right:0;z-index:50;color:var(--cream);transition:transform .45s var(--ease),background .3s,color .3s,box-shadow .3s}
header.solid{background:rgba(244,238,228,.94);backdrop-filter:blur(10px);color:var(--ink);box-shadow:0 1px 0 var(--line)}
header.hide{transform:translateY(-100%)}
.nav{display:flex;align-items:center;justify-content:space-between;height:76px;gap:20px}
.mark{text-decoration:none;display:inline-flex;align-items:center;gap:10px;color:inherit}
.mark .figs{height:40px;width:auto;flex:none}
.mark .wm{display:inline-flex;align-items:center;font-family:var(--serif);font-weight:700;line-height:.95}
.mark .wm b{font-size:44px;line-height:.8;font-weight:700;margin-right:1px}
.mark .wm>span{font-size:17px;letter-spacing:.01em}
@media(max-width:480px){.mark .figs{height:32px}.mark .wm b{font-size:36px}.mark .wm>span{font-size:14px}}
.nav nav{display:flex;gap:30px;align-items:center;font-size:15px}
.nav .links{display:flex;gap:30px}
.nav nav a{text-decoration:none;opacity:.85}
.nav nav a:hover{opacity:1}
@media(max-width:860px){.nav .links{display:none}}

/* hero */
.hero{background:var(--night);color:var(--cream);position:relative;overflow:hidden}
.hero .grid{position:absolute;inset:0;background-image:linear-gradient(rgba(244,238,228,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(244,238,228,.05) 1px,transparent 1px);background-size:96px 96px;pointer-events:none}
.hgrid{position:relative;display:grid;grid-template-columns:1fr 1.05fr;gap:40px;align-items:center;padding-top:clamp(120px,15vh,170px);padding-bottom:56px}
.hero h1{font-size:clamp(44px,5.6vw,88px);line-height:1.06}
.hero h1 em{font-style:normal;color:var(--glow)}
.hero p.lede{margin:28px 0 34px;font-size:clamp(17px,1.4vw,20px);max-width:36ch;color:#E4DACB}
.hero .cta{display:flex;gap:14px;flex-wrap:wrap}
.split .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.2em;margin-bottom:-.2em}
.split .w>span{display:inline-block;transform:translateY(105%);animation:wup 1s var(--ease) forwards;animation-delay:calc(var(--i) * 70ms + .15s)}
@keyframes wup{to{transform:none}}
.fade{opacity:0;animation:fin .9s var(--ease) forwards;animation-delay:var(--d,.6s)}
@keyframes fin{to{opacity:1}}
.draw{width:100%;height:auto;overflow:visible}
.draw .ln{fill:none;stroke:var(--cream);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:var(--len,1200);stroke-dashoffset:var(--len,1200);animation:dr 2.4s var(--ease) forwards;animation-delay:var(--d,0s)}
.draw .thin{stroke:rgba(244,238,228,.35);stroke-width:1}
.draw .brickfill{fill:var(--brick);opacity:0;animation:bf 1.4s ease forwards;animation-delay:2.1s}
@keyframes bf{to{opacity:.22}}
.draw .lit{fill:#F2C979;opacity:0;animation:lit .5s ease forwards}
@keyframes lit{to{opacity:.95}}
@keyframes dr{to{stroke-dashoffset:0}}
.draw text{font:600 13px var(--mono);letter-spacing:0;fill:var(--cream);opacity:0;animation:fin .6s ease forwards;animation-delay:var(--d,2.4s)}
.draw .dot{fill:var(--glow);opacity:0;animation:fin .4s ease forwards;animation-delay:var(--d,2.4s)}
.strip{position:relative;border-top:1px solid rgba(244,238,228,.14);display:grid;grid-template-columns:repeat(4,1fr)}
.strip div{padding:22px 0 26px;border-right:1px solid rgba(244,238,228,.14);padding-left:24px}
.strip div:first-child{padding-left:0}
.strip div:last-child{border-right:0}
.strip b{display:block;font:400 clamp(34px,3.6vw,52px)/1.05 var(--serif)}
.strip span{color:var(--cream-m)}
@media(max-width:900px){.hgrid{grid-template-columns:1fr;padding-top:110px}.strip{grid-template-columns:1fr 1fr}.strip div{padding-left:0;border-right:0;border-bottom:1px solid rgba(244,238,228,.14)}}

/* statement */
.statement{padding-block:clamp(88px,11vw,150px)}
.statement p{font:400 clamp(28px,3.6vw,52px)/1.2 var(--serif);margin:0;max-width:24ch}
.statement .lw{opacity:.14;transition:opacity .25s}
.statement .lw.on{opacity:1}

/* sections */
.sec{padding-block:clamp(96px,12vw,170px)}
.sec-head{display:grid;grid-template-columns:1fr 2fr;gap:32px;align-items:end;margin-bottom:clamp(44px,6vw,76px)}
.sec-head h2{font-size:clamp(30px,3.6vw,52px);line-height:1.12}
.sec-head p{margin:14px 0 0;color:var(--muted);max-width:46ch}
@media(max-width:860px){.sec-head{grid-template-columns:1fr;gap:14px}}

/* values */
.vgrid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ink)}
.vcard{padding:32px 32px 40px 0;border-right:1px solid var(--line);position:relative}
.vcard+.vcard{padding-left:32px}
.vcard:last-child{border-right:0}
.vcard svg{width:64px;height:64px;margin-bottom:26px;overflow:visible}
.vcard .n{font:600 14px/1 var(--mono);color:var(--brick);letter-spacing:0;display:block;margin-bottom:12px}
.vcard h3{font-size:clamp(26px,2.4vw,34px);line-height:1.12;margin-bottom:12px}
.vcard p{margin:0;color:var(--muted);max-width:30ch}
.vcard .tick{stroke-dasharray:60;stroke-dashoffset:60;transition:stroke-dashoffset .7s var(--ease) .4s}
.vcard.in .tick{stroke-dashoffset:0}
.vcard .bub{animation:level 3.2s ease-in-out infinite}
@keyframes level{0%,100%{transform:translateX(-7px)}50%{transform:translateX(7px)}}
.vcard .wave{animation:wv 3.4s ease-in-out infinite}
@keyframes wv{50%{transform:translateX(-10px)}}
@media(max-width:860px){.vgrid{grid-template-columns:1fr}.vcard,.vcard+.vcard{padding:28px 0 34px;border-right:0;border-bottom:1px solid var(--line)}}

/* portfolio explorer */
.port{background:var(--paper2)}
.explore{display:grid;grid-template-columns:5fr 7fr;gap:40px;align-items:start}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.chip{min-height:40px;padding:0 14px;border:1px solid var(--ink);background:transparent;font:500 14px var(--sans);cursor:pointer;color:var(--ink);white-space:nowrap}
.chip.on{background:var(--ink);color:var(--paper)}
.rows{border-top:1px solid var(--ink);max-height:560px;overflow:auto}
.row{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:15px 0;border-bottom:1px solid var(--line);cursor:pointer;opacity:.6;transition:opacity .25s,padding .25s;background:none;border-left:0;border-right:0;border-top:0;width:100%;text-align:left;font:inherit;color:inherit}
.row:hover,.row.on{opacity:1}
.row.on{padding-left:16px;box-shadow:inset 3px 0 0 var(--brick)}
.row b{font:400 26px/1.1 var(--serif)}
.row span{font:600 14px/1 var(--mono);letter-spacing:0;text-transform:none;color:var(--muted);white-space:nowrap}
.preview{position:sticky;top:96px}
.frame{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--night)}
.frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.frame img.dev{animation:develop 1.3s var(--ease) forwards}
@keyframes develop{0%{filter:grayscale(1) sepia(.35) hue-rotate(170deg) contrast(1.2) brightness(1.1);opacity:.4;transform:scale(1.05)}60%{opacity:1}100%{filter:none;transform:none;opacity:1}}
.frame .ph{position:absolute;inset:0;display:grid;place-items:center;color:var(--cream);text-align:center;padding:32px;background-image:linear-gradient(rgba(244,238,228,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(244,238,228,.06) 1px,transparent 1px);background-size:32px 32px}
.gstrip{display:grid;grid-template-columns:repeat(8,1fr);gap:6px;margin-top:8px}
.gstrip button{all:unset;cursor:pointer;aspect-ratio:1/1;overflow:hidden;opacity:.55;transition:opacity .25s;outline-offset:2px}
.gstrip button:hover,.gstrip button.on{opacity:1}
.gstrip button.on{box-shadow:0 0 0 2px var(--brick)}
.gstrip button:focus-visible{outline:2px solid var(--brick)}
.gstrip img{width:100%;height:100%;object-fit:cover}
@media(max-width:520px){.gstrip{grid-template-columns:repeat(4,1fr)}}
.cap{display:flex;justify-content:space-between;gap:24px;align-items:baseline;margin-top:18px}
.cap b{font:400 34px/1.05 var(--serif);display:block}
.cap p{margin:6px 0 0;color:var(--muted);max-width:44ch}
.more{margin-top:28px;font-size:14px;color:var(--muted)}
@media(max-width:900px){.explore{grid-template-columns:1fr}.preview{position:static;order:-1}.rows{max-height:380px}}

/* good + north star */
.good{background:var(--night);color:var(--cream)}
.good .eyebrow{color:var(--glow)}
.good .sec-head p{color:var(--cream-m)}
.ggrid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.gitem{border-top:1px solid rgba(244,238,228,.2);padding-top:24px}
.gitem svg{width:44px;height:44px;stroke:var(--glow);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;margin-bottom:20px}
.gitem svg *{stroke-dasharray:200;stroke-dashoffset:200;transition:stroke-dashoffset 1.6s var(--ease);transition-delay:var(--d,0ms)}
.gitem.in svg *{stroke-dashoffset:0}
.gitem h3{font-size:24px;line-height:1.2;margin-bottom:10px}
.gitem p{margin:0;color:var(--cream-m);font-size:16px}
@media(max-width:900px){.ggrid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.ggrid{grid-template-columns:1fr}}
.star{margin-top:clamp(80px,10vw,140px)}
.star h3{font-size:clamp(34px,4vw,60px);line-height:1.05;max-width:22ch}

/* multi-page additions */
header.light{color:var(--ink)}
.nav nav a[aria-current=page]{opacity:1;box-shadow:0 1px 0 currentColor}
.menu-btn{display:none;background:none;border:1px solid currentColor;color:inherit;min-height:40px;padding:0 14px;font:500 14px var(--sans);cursor:pointer}
@media(max-width:860px){.menu-btn{display:inline-flex;align-items:center}}
.mnav{position:fixed;inset:0;z-index:60;background:var(--night);color:var(--cream);display:flex;flex-direction:column;justify-content:center;padding-inline:var(--gut);gap:10px;transform:translateY(-100%);transition:transform .5s var(--ease)}
.mnav.on{transform:none}
.mnav a{font:400 44px/1.1 var(--serif);text-decoration:none}
.mnav button{position:absolute;top:18px;right:var(--gut);background:none;border:1px solid var(--cream);color:var(--cream);min-height:44px;padding:0 14px;font:500 14px var(--sans);cursor:pointer}
.phero{background:var(--night);color:var(--cream);position:relative;overflow:hidden;padding-top:clamp(140px,18vh,200px);padding-bottom:clamp(56px,7vw,96px)}
.phero .grid{position:absolute;inset:0;background-image:linear-gradient(rgba(244,238,228,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(244,238,228,.05) 1px,transparent 1px);background-size:96px 96px;pointer-events:none}
.phero .wrap{position:relative}
.phero h1{font-size:clamp(38px,4.8vw,74px);line-height:1.08;max-width:18ch}
.phero h1 em{font-style:normal;color:var(--glow)}
.phero p{margin:24px 0 0;max-width:46ch;color:#E4DACB;font-size:clamp(17px,1.4vw,20px)}
.crumbs{display:flex;gap:10px;color:var(--glow);margin-bottom:24px}
.phgrid{display:grid;grid-template-columns:1.35fr 1fr;gap:clamp(32px,5vw,80px);align-items:end}
.casecard{display:flex;flex-direction:column;gap:10px;text-decoration:none;color:var(--cream);border:1px solid rgba(244,238,228,.22);border-top:3px solid var(--glow);background:rgba(244,238,228,.04);padding:clamp(22px,2.4vw,32px);transition:background .3s,border-color .3s}
.casecard:hover{background:rgba(244,238,228,.08)}
.casecard .k{font:600 14px/1.2 var(--mono);color:var(--glow)}
.casecard b{font:400 clamp(26px,2.4vw,34px)/1.12 var(--serif)}
.casecard .ct{font:600 16px/1.35 var(--sans);color:#E4DACB}
.phero .casecard p{margin:0;font-size:15px;line-height:1.55;color:var(--cream-m);max-width:none}
.casecard .by{font-size:13px;color:var(--cream-m)}
.casecard .go{margin-top:6px;font:600 14px/1 var(--mono);color:var(--glow)}
.casecard:hover .go{text-decoration:underline}
@media(max-width:900px){.phgrid{grid-template-columns:1fr;align-items:start}}
/* location note */
.loc{display:grid;grid-template-columns:auto 1fr;gap:clamp(20px,4vw,48px);align-items:center;margin-top:clamp(40px,6vw,64px);padding-top:28px;border-top:1px solid var(--line);max-width:980px}
.loc svg{width:clamp(84px,10vw,120px);height:auto}
.loc svg .pulse{transform-box:fill-box;transform-origin:center;animation:pulse 2.6s ease-out infinite}
@keyframes pulse{0%{transform:scale(1);opacity:.5}100%{transform:scale(3);opacity:0}}
.loc p{margin:8px 0 0;color:var(--muted);font-size:18px;max-width:52ch}
/* compact uniques */
.ugrid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,32px)}
.ucard{position:relative}
.ucard figure{margin:0;aspect-ratio:4/5;overflow:hidden;position:relative;background:var(--paper2)}
.ucard img{width:100%;height:100%;object-fit:cover;transform:scale(1.08);transition:transform 1.4s var(--ease)}
.ucard figure::after{content:"";position:absolute;inset:0;background:var(--paper2);transform-origin:top;transition:transform 1s var(--ease);transition-delay:var(--d,0ms)}
.ucard.in figure::after{transform:scaleY(0)}
.ucard.in img{transform:scale(1)}
.ucard:hover img{transform:scale(1.04)}
.ucard .word{position:absolute;left:18px;bottom:16px;font:400 clamp(36px,3.8vw,58px)/1.05 var(--serif);color:#fff;text-shadow:0 2px 24px rgba(0,0,0,.35)}
.ucard .k{display:block;margin-top:16px}
.ucard p{margin:8px 0 0;color:var(--muted);max-width:34ch}
@media(max-width:860px){.ugrid{grid-template-columns:1fr}.ucard figure{aspect-ratio:16/10}}
/* teaser cards */
.teasers{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2.4vw,32px)}
.teaser{display:block;text-decoration:none;border-top:1px solid var(--ink);padding-top:18px}
.teaser .ph{aspect-ratio:4/3;overflow:hidden;margin-bottom:16px;background:var(--paper2)}
.teaser img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.teaser:hover img{transform:scale(1.04)}
.teaser b{font:400 23px/1.2 var(--serif);display:block}
.teaser span{color:var(--muted);font-size:15px}
.teaser .go{display:block;margin-top:12px;font:600 14px/1 var(--mono);letter-spacing:0;text-transform:none;color:var(--brick)}
@media(max-width:1100px){.teasers{grid-template-columns:1fr 1fr}}@media(max-width:600px){.teasers{grid-template-columns:1fr}}
/* news */
.news{display:grid;gap:0;border-top:1px solid var(--ink)}
.ni{display:grid;grid-template-columns:180px 1fr auto;gap:clamp(16px,3vw,40px);align-items:baseline;padding:26px 0;border-bottom:1px solid var(--line);text-decoration:none;transition:padding .3s var(--ease)}
.ni:hover{padding-left:12px}
.ni .when{color:var(--muted)}
.ni b{display:block;font:400 clamp(21px,2vw,28px)/1.2 var(--serif)}
.ni p{margin:8px 0 0;color:var(--muted);max-width:62ch}
.ni .src{font:600 14px/1 var(--mono);letter-spacing:0;text-transform:none;color:var(--brick);white-space:nowrap}
@media(max-width:760px){.ni{grid-template-columns:1fr;gap:8px}}
/* north star statement */
.nstar{display:grid;grid-template-columns:auto 1fr;gap:clamp(24px,5vw,72px);align-items:center;margin-top:clamp(72px,9vw,120px);padding-top:clamp(40px,5vw,64px);border-top:1px solid rgba(244,238,228,.2)}
.nstar svg{width:clamp(96px,12vw,160px);height:auto}
.nstar svg path{stroke-dasharray:400;stroke-dashoffset:400;transition:stroke-dashoffset 2s var(--ease)}
.nstar.in svg path{stroke-dashoffset:0}
.nstar .tw{transform-box:fill-box;transform-origin:center;animation:tw 3s ease-in-out infinite}
@keyframes tw{50%{opacity:.35}}
.nstar h3{font-size:clamp(30px,3.6vw,54px);line-height:1.1;max-width:20ch}
.nstar p{margin:16px 0 0;color:var(--cream-m);font-size:19px;max-width:44ch}
@media(max-width:700px){.nstar{grid-template-columns:1fr}}
/* team why */
.whylist{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(24px,4vw,56px);counter-reset:w}
.whylist li{padding:22px 0 22px 44px;border-top:1px solid var(--line);position:relative;font-size:18px;line-height:1.5;counter-increment:w}
.whylist li::before{content:counter(w,decimal-leading-zero);position:absolute;left:0;top:24px;font:600 14px/1 var(--mono);color:var(--brick);letter-spacing:0}
@media(max-width:760px){.whylist{grid-template-columns:1fr}}
.logorow{display:flex;flex-wrap:wrap;gap:20px 36px;align-items:center;margin-top:18px}
.logorow img{height:36px;width:auto;filter:grayscale(1);mix-blend-mode:multiply;opacity:.75;transition:opacity .3s,filter .3s}
.logorow img:hover{opacity:1;filter:none}
/* contact page */
.cols2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,96px)}
@media(max-width:860px){.cols2{grid-template-columns:1fr}}
.nextpage{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-block:clamp(48px,6vw,80px);border-top:1px solid var(--line);text-decoration:none}
.nextpage b{font:400 clamp(30px,3.8vw,56px)/1.08 var(--serif)}
.nextpage .arr{font:400 clamp(30px,3.8vw,56px)/1 var(--serif);transition:transform .4s var(--ease)}
.nextpage:hover .arr{transform:translateX(12px)}
.foot{background:var(--night);color:var(--cream-m);font-size:14px}
.foot .wrap{display:grid;grid-template-columns:2fr 1fr 1fr;gap:32px;padding-block:56px 40px}
.foot b{display:block;color:var(--cream);font:400 26px/1 var(--serif);margin-bottom:12px}
.foot a{display:block;text-decoration:none;padding:4px 0}
.foot a:hover{color:var(--cream)}
.foot .base{grid-column:1/-1;border-top:1px solid rgba(244,238,228,.14);padding-top:20px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
@media(max-width:760px){.foot .wrap{grid-template-columns:1fr 1fr}.foot .wrap>div:first-child{grid-column:1/-1}}
footer{margin:0;padding:0;border:0}
/* page transition */
body.leaving main{opacity:0;transform:translateY(-8px);transition:opacity .25s ease,transform .25s ease}
@view-transition{navigation:auto}
::view-transition-old(root){animation:.25s ease both vt-out}
::view-transition-new(root){animation:.4s cubic-bezier(.2,.7,.1,1) both vt-in}
@keyframes vt-out{to{opacity:0;transform:translateY(-8px)}}
@keyframes vt-in{from{opacity:0;transform:translateY(12px)}}
@media (prefers-reduced-motion:reduce){::view-transition-old(root),::view-transition-new(root){animation:none}.loc svg .pulse,.nstar .tw{animation:none}}

/* team */
.mural{position:relative;overflow:hidden;margin-bottom:clamp(48px,7vw,80px)}
.mural img{width:100%;transform:scale(1.06) translateY(calc(var(--p,0) * -24px))}
.mural figcaption{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:12px;color:var(--muted)}
.tags{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.nt{perspective:1000px;border:0;background:none;padding:0;cursor:pointer;font:inherit;color:inherit;text-align:left}
.nt .in{position:relative;aspect-ratio:3/4;transform-style:preserve-3d;transition:transform .8s var(--spring)}
.nt.on .in{transform:rotateY(180deg)}
.nt .f{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border:1px solid var(--line);background:#FBF7F0;display:flex;flex-direction:column;overflow:hidden}
.nt .hello{background:var(--brick);color:#fff;text-align:center;padding:10px 8px 9px}
.nt .hello b{display:block;font:400 26px/1 var(--serif);letter-spacing:.04em}
.nt .hello span{font:600 12px/1 var(--mono);letter-spacing:0;text-transform:none}
.nt .pp{flex:1;display:flex;align-items:flex-end;justify-content:center;background:var(--paper2);overflow:hidden;min-height:0}
.nt .pp img{width:80%}
.nt .pp img.ai{width:100%;height:100%;object-fit:cover}
.nt .nm{padding:12px 14px 14px;border-top:1px solid var(--line)}
.nt .nm b{font:400 24px/1.05 var(--serif);display:block}
.nt .nm span{font-size:13px;color:var(--muted)}
.nt .back{transform:rotateY(180deg);background:var(--night);color:var(--cream);padding:20px;gap:12px}
.nt .back b{font:400 26px/1.05 var(--serif)}
.nt .back dt{font:600 12px/1 var(--mono);letter-spacing:0;text-transform:none;color:var(--glow)}
.nt .back dd{margin:4px 0 0;font:400 19px/1.2 var(--serif)}
.nt:hover .f.front{border-color:var(--brick)}
@media(max-width:1000px){.tags{grid-template-columns:repeat(2,1fr);gap:14px}}
@media(max-width:480px){.nt .in{aspect-ratio:3/4.9}.nt .hello{padding:6px 6px 5px}.nt .nm{padding:9px 10px 10px}.nt .nm b{font-size:19px}.nt .nm span{font-size:12px}.nt .back{padding:14px}.nt .back dd{font-size:15px}.nt .back b{font-size:20px}.nt .hello b{font-size:20px}}

/* contact */
.contact{background:var(--brick);color:#fff}
.cgrid{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(40px,7vw,112px);align-items:end}
.contact h2{font-size:clamp(38px,5vw,76px);line-height:1.06}
.contact .eyebrow{color:#FFD9C8}
.mbx{width:180px;height:auto;margin-top:32px}
.mbx .flag{transform-box:fill-box;transform-origin:0% 100%;transform:rotate(90deg);transition:transform .8s var(--spring)}
.mbx.up .flag{transform:none}
.field{display:grid;gap:8px;margin-bottom:16px;font-size:14px;color:#FFE3D7}
.field input,.field textarea{background:transparent;border:0;border-bottom:1px solid rgba(255,255,255,.5);color:#fff;font:400 20px/1.4 var(--sans);padding:8px 0;outline:none}
.field input:focus,.field textarea:focus{border-color:#fff}
.contact .btn.fill{background:#fff;color:var(--brick);border-color:#fff}
.contact footer{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:clamp(64px,8vw,120px);padding-top:22px;border-top:1px solid rgba(255,255,255,.3);font-size:13px;color:#FFE3D7}
@media(max-width:860px){.cgrid{grid-template-columns:1fr}}

[data-r]{opacity:0;transform:translateY(22px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:var(--d,0ms)}
[data-r].in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;transition-duration:.01ms!important}
  [data-r]{opacity:1;transform:none}.split .w>span{transform:none}.fade{opacity:1}.draw .ln{stroke-dashoffset:0}
}

/* interiors filmstrip */
.film-head{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap;margin-bottom:28px}
.film-ctl{display:flex;gap:10px;align-items:center}
.film-ctl button{width:48px;height:48px;border-radius:50%;border:1px solid var(--ink);background:none;color:var(--ink);font:400 20px/1 var(--sans);cursor:pointer;transition:background .3s,color .3s}
.film-ctl button:hover{background:var(--ink);color:var(--cream)}
.film-ctl button:disabled{opacity:.3;cursor:default;background:none;color:var(--ink)}
.film{display:flex;gap:clamp(14px,2vw,24px);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-left:max(var(--gut),calc((100vw - var(--max,1280px)) / 2 + var(--gut)));padding-right:var(--gut);scroll-padding-left:max(var(--gut),calc((100vw - var(--max,1280px)) / 2 + var(--gut)));cursor:grab}
.film::-webkit-scrollbar{display:none}
.film.drag{cursor:grabbing;scroll-snap-type:none}
.film figure{margin:0;flex:0 0 min(64vw,820px);scroll-snap-align:start}
.film .fr{aspect-ratio:3/2;overflow:hidden;position:relative;background:var(--paper2)}
.film .fr img{width:100%;height:100%;object-fit:cover;transform:scale(1.1);transition:transform 1.6s var(--ease);pointer-events:none;user-select:none}
.film .fr::after{content:"";position:absolute;inset:0;background:var(--paper2);transform-origin:right;transition:transform 1.1s var(--ease);transition-delay:var(--d,0ms)}
.film figure.in .fr::after{transform:scaleX(0)}
.film figure.in .fr img{transform:scale(1)}
.film figcaption{display:grid;grid-template-columns:auto 1fr;gap:4px 16px;margin-top:14px}
.film figcaption .n{font:600 14px/1.6 var(--mono);color:var(--brick);letter-spacing:0}
.film figcaption b{font:400 24px/1.1 var(--serif)}
.film figcaption p{grid-column:2;margin:0;color:var(--muted);font-size:15px}
.film-bar{height:2px;background:var(--line);margin-top:28px;position:relative;overflow:hidden}
.film-bar i{position:absolute;inset:0;background:var(--brick);transform-origin:left;transform:scaleX(var(--f,.2));transition:transform .2s linear}
@media(max-width:760px){.film figure{flex-basis:84vw}}

/* team page */
.people{display:grid;grid-template-columns:repeat(4,1fr);gap:28px 20px}
.person{border-top:1px solid var(--line);padding-top:14px}
.person img{width:64px;height:64px;border-radius:50%;object-fit:cover;background:var(--paper2);margin-bottom:10px}
.person b{display:block;font:400 22px/1.1 var(--serif)}
.person span{color:var(--muted);font-size:14px}
@media(max-width:860px){.people{grid-template-columns:1fr 1fr}}
.careers{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;padding:32px;border:1px solid var(--line);background:#FBF7F0}
.careers b{font:400 30px/1.1 var(--serif);display:block}
.careers p{margin:6px 0 0;color:var(--muted)}

/* news page */
.news-lead{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(28px,5vw,72px);align-items:center;text-decoration:none;padding-bottom:clamp(40px,5vw,64px);border-bottom:1px solid var(--line);margin-bottom:clamp(24px,3vw,40px)}
.news-lead .ph{aspect-ratio:4/3;overflow:hidden;background:var(--paper2)}
.news-lead img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.news-lead:hover img{transform:scale(1.04)}
.news-lead h2{font-size:clamp(28px,3.2vw,46px);line-height:1.1;margin:14px 0 16px}
.news-lead p{color:var(--muted);max-width:48ch;margin:0 0 20px}
.news-lead .tag{display:inline-block;background:var(--glow);color:var(--night);padding:6px 10px;font:600 13px/1 var(--mono);letter-spacing:0;text-transform:none}
@media(max-width:860px){.news-lead{grid-template-columns:1fr}}
.vids{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.4vw,32px)}
.vid{aspect-ratio:16/9;background:var(--night);overflow:hidden}
.vid iframe{width:100%;height:100%;border:0;display:block}
@media(max-width:760px){.vids{grid-template-columns:1fr}}
.recog{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(24px,4vw,56px)}
.recog li{padding:20px 0 20px 30px;border-top:1px solid var(--line);position:relative;font:400 clamp(19px,1.6vw,22px)/1.35 var(--serif)}
.recog li::before{content:"";position:absolute;left:0;top:31px;width:16px;height:1.5px;background:var(--brick)}
@media(max-width:760px){.recog{grid-template-columns:1fr}}
.pressnote{margin-top:32px;color:var(--muted);font-size:15px}
.pressnote a{color:var(--brick)}

/* contact page */
.paths{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,32px)}
.path{border-top:1px solid var(--ink);padding-top:20px;display:flex;flex-direction:column;gap:10px}
.path .k{font:600 14px/1 var(--mono);letter-spacing:0;text-transform:none;color:var(--brick)}
.path b{font:400 30px/1.05 var(--serif)}
.path p{margin:0;color:var(--muted)}
.path a.go{margin-top:auto;padding-top:10px;font:600 14px/1 var(--mono);letter-spacing:0;text-transform:none;color:var(--ink);text-decoration:none}
.path a.go:hover{color:var(--brick)}
@media(max-width:860px){.paths{grid-template-columns:1fr}}
.criteria{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 40px}
.criteria li{padding:16px 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px}
.criteria li span{color:var(--muted)}
@media(max-width:760px){.criteria{grid-template-columns:1fr}}
.cf-note{font-size:13px;color:#FFD9C8;margin-top:14px}
.field select{background:transparent;border:0;border-bottom:1px solid rgba(255,255,255,.5);color:#fff;font:400 20px/1.4 var(--sans);padding:8px 0;outline:none;-webkit-appearance:none;appearance:none}
.field select option{color:var(--ink)}

/* impact page */
.cyc{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,96px);align-items:center}
.cyc .copy p{font-size:18px;line-height:1.6;max-width:46ch;margin:0 0 16px}
.cyc svg{width:100%;max-width:520px;height:auto;justify-self:center;overflow:visible}
.cyc .ring{fill:none;stroke:var(--line);stroke-width:1.5}
.cyc .arc{fill:none;stroke:var(--brick);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:1100;stroke-dashoffset:1100;transition:stroke-dashoffset 2.4s var(--ease)}
.cyc.in .arc{stroke-dashoffset:0}
.cyc .node circle{fill:var(--paper);stroke:var(--ink);stroke-width:1.5}
.cyc .node text{font:600 13px/1 var(--mono);letter-spacing:0;text-transform:none;fill:var(--ink)}
.cyc .node .n{fill:var(--brick)}
.cyc .node{opacity:0;transition:opacity .6s ease;transition-delay:var(--d,0ms)}
.cyc.in .node{opacity:1}
.cyc .mid{font:400 30px/1 var(--serif);fill:var(--ink)}
.cyc .mid2{font:400 30px/1 var(--serif);fill:var(--ink)}
@media(max-width:860px){.cyc{grid-template-columns:1fr}}
.imp2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,40px)}
.imp{background:#FBF7F0;border:1px solid var(--line);padding:clamp(24px,3vw,40px);display:flex;flex-direction:column;gap:12px}
.imp svg{width:56px;height:56px;fill:none;stroke:var(--brick);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.imp .k{font:600 14px/1 var(--mono);letter-spacing:0;text-transform:none;color:var(--brick)}
.imp h3{font-size:clamp(26px,2.4vw,34px);line-height:1.12;margin:0}
.imp .tag{font:400 18px/1.4 var(--serif);color:var(--muted);margin:0}
.imp ul{margin:8px 0 0;padding:0;list-style:none}
.imp li{padding:14px 0 14px 26px;border-top:1px solid var(--line);position:relative;font-size:16px;line-height:1.55}
.imp li::before{content:"";position:absolute;left:2px;top:22px;width:10px;height:2px;background:var(--brick)}
@media(max-width:860px){.imp2{grid-template-columns:1fr}}

/* community service mosaic */
.csm{display:grid;grid-template-columns:1.1fr 1fr 1fr;grid-auto-rows:clamp(180px,21vw,300px);gap:clamp(10px,1.4vw,18px)}
.csf{position:relative;overflow:hidden;margin:0;background:var(--paper2)}
.csf img{width:100%;height:100%;object-fit:cover;transform:scale(1.08);transition:transform 1.4s var(--ease)}
.csf::after{content:"";position:absolute;inset:0;background:var(--paper2);transform-origin:bottom;transition:transform 1s var(--ease);transition-delay:var(--d,0ms)}
.csf.in::after{transform:scaleY(0)}
.csf.in img{transform:scale(1)}
.csf:hover img{transform:scale(1.03)}
.csf figcaption{position:absolute;left:12px;bottom:12px;z-index:1;background:rgba(27,24,21,.72);color:var(--cream);font:600 13px/1 var(--mono);letter-spacing:0;text-transform:none;padding:7px 9px}
.csf.tall{grid-row:span 2}
.csf.wide{grid-column:span 2}
@media(max-width:760px){.csm{grid-template-columns:1fr 1fr;grid-auto-rows:44vw}.csf.wide{grid-column:span 2}.csf.tall{grid-column:span 2;grid-row:span 2}.csm .csf:last-child{grid-column:span 2}}

/* portfolio holdings (no property-level detail) */
.hold{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,32px)}
.hcard{border-top:1px solid var(--ink);padding-top:18px}
.hcard figure{margin:0 0 18px;aspect-ratio:4/3;overflow:hidden;background:var(--paper2)}
.hcard img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.hcard:hover img{transform:scale(1.04)}
.hcard .k{font:600 14px/1 var(--mono);letter-spacing:0;text-transform:none;color:var(--brick)}
.hcard b{display:block;font:400 clamp(28px,2.8vw,40px)/1.08 var(--serif);margin:10px 0 12px}
.hcard p{margin:0;color:var(--muted);font-size:16px;max-width:36ch}
@media(max-width:860px){.hold{grid-template-columns:1fr}}
.foot a.mark{display:inline-flex;padding:0;margin-bottom:18px}
.foot .mark .wm b{display:inline;font:700 44px/.8 var(--serif);margin:0 1px 0 0;color:inherit}

/* photos in place of line icons (clip reveal keeps the motion) */
.pfig{margin:0 0 22px;aspect-ratio:3/2;overflow:hidden;position:relative;background:var(--paper2)}
.pfig img{width:100%;height:100%;object-fit:cover;transform:scale(1.08);transition:transform 1.4s var(--ease)}
.pfig::after{content:"";position:absolute;inset:0;background:var(--paper2);transform-origin:bottom;transition:transform 1s var(--ease);transition-delay:var(--d,0ms)}
.in .pfig::after{transform:scaleY(0)}
.in .pfig img{transform:scale(1)}
.vcard .pfig{margin-bottom:24px}
.imp .pfig{margin:-1px -1px 6px;aspect-ratio:16/9}
.gitem .gn{display:block;font:400 44px/1 var(--serif);color:var(--glow);margin-bottom:18px;opacity:0;transform:translateY(12px);transition:opacity .8s var(--ease),transform .8s var(--ease);transition-delay:var(--d,0ms)}
.gitem.in .gn{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.pfig::after{display:none}.pfig img{transform:none}.gitem .gn{opacity:1;transform:none}}
@media(max-width:520px){#hdr nav>a.btn{display:none}}