:root{--bg:#f4f1ea;--ink:#141412;--mute:#6b6a63;--line:#d9d5c9;--acc:#c8501e;--f-serif:'Instrument Serif',Georgia,serif;--f-sans:Inter,system-ui,sans-serif;--f-mono:'JetBrains Mono',monospace}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.6 var(--f-sans);opacity:0;animation:in .5s .05s forwards}
body.out{opacity:0;transition:opacity .25s}@keyframes in{to{opacity:1}}
a{color:inherit}img{max-width:100%}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;background:#fff;padding:.5rem;z-index:99}
:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
.wrap{max-width:1200px;margin:0 auto;padding:clamp(3rem,7vw,6rem) clamp(1.25rem,4vw,3rem);border-top:1px solid var(--line)}
.hero{border-top:0;padding-top:clamp(4rem,12vw,9rem)}.hero.sm{padding-top:clamp(3rem,8vw,6rem);padding-bottom:3rem}
h1,h2,h3,.big,.stmt{font-family:var(--f-serif);font-weight:400;line-height:1.05;margin:0}
h1{font-size:clamp(2.6rem,8vw,6.5rem);letter-spacing:-.02em;max-width:14em}
.hero.sm h1{font-size:clamp(2.2rem,5.5vw,4.5rem)}
.lead{font-size:1.25rem;max-width:36em;color:var(--mute);margin:1.5rem 0 2rem}
.kicker,.mono,.num{font:400 .8rem var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.stmt{font-size:clamp(1.6rem,3.2vw,2.4rem);margin-bottom:1.2rem}.stmt.sm{font-size:1.5rem}
.hdr{position:sticky;top:0;z-index:50;display:flex;justify-content:space-between;align-items:center;padding:1rem clamp(1.25rem,4vw,3rem);background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(8px)}
.logo{font:1.4rem var(--f-serif);text-decoration:none}.logo em{color:var(--acc)}
#nav{display:flex;gap:1.6rem;align-items:center}#nav a{text-decoration:none;font-size:.95rem;position:relative}
#nav a:not(.btn)::after{content:"";position:absolute;left:0;bottom:-3px;height:1px;width:100%;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .3s}
#nav a:hover::after,#nav a[aria-current]::after{transform:scaleX(1)}
.btn{display:inline-block;background:var(--ink);color:var(--bg);padding:.85rem 1.5rem;border-radius:99px;text-decoration:none;border:1px solid var(--ink);font:500 .95rem var(--f-sans);cursor:pointer;transition:background .25s,color .25s,transform .25s}
.btn:hover{background:var(--acc);border-color:var(--acc);transform:translateY(-2px)}.btn.sm{padding:.5rem 1rem}
.btn.ghost{background:transparent;color:var(--ink)}.btn.ghost:hover{color:#fff}
.two{display:grid;grid-template-columns:1fr 2fr;gap:2rem}
.cols{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:2rem;border-left:1px solid var(--line)}
.col{padding:0 1.5rem;border-right:1px solid var(--line)}.col h2{font-size:2.6rem;color:var(--acc)}
ul{padding:0;list-style:none}.col li,.why li{padding:.5rem 0;border-bottom:1px solid var(--line)}
.why{max-width:40em}
.proj{display:grid;grid-template-columns:3rem 1.4fr 1fr;gap:2rem;align-items:center;padding:2.5rem 0;border-bottom:1px solid var(--line);text-decoration:none}
.proj h3{font-size:clamp(2rem,4vw,3.2rem);margin-bottom:.6rem}.proj p{margin:.3rem 0}
.more{color:var(--acc);display:inline-block;margin-top:1rem;transition:transform .25s}.proj:hover .more{transform:translateX(6px)}
.shot{aspect-ratio:16/10;border:1px dashed var(--mute);display:grid;place-items:center;font:.8rem var(--f-mono);color:var(--mute);background:repeating-linear-gradient(45deg,transparent 0 12px,rgba(0,0,0,.025) 12px 24px);transition:transform .15s;will-change:transform}
.shot.big{margin-bottom:3rem}
.steps{list-style:none;counter-reset:s;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:2rem}
.steps li{background:var(--bg);padding:1.5rem;transition:background .3s}.steps li:hover{background:#fff}
.steps span{display:block;font:2.8rem var(--f-serif);color:var(--acc)}.steps b{font-weight:500}
.stack{font:clamp(1.4rem,3vw,2.2rem) var(--f-serif)}.stack i{color:var(--acc);font-style:normal;margin:0 .3em}
.svc{display:grid;grid-template-columns:3rem 1fr 1.4fr;gap:1.5rem 2rem;padding:2.5rem 0;border-bottom:1px solid var(--line)}
.svc h2{font-size:2.4rem;margin-bottom:.6rem}dt{font:.75rem var(--f-mono);text-transform:uppercase;color:var(--mute);margin-top:.8rem}dd{margin:0}
.svc .more{grid-column:2/-1;margin:0}
.filters{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:2rem}.filters button{font:.85rem var(--f-mono);background:none;border:1px solid var(--line);border-radius:99px;padding:.4rem 1rem;cursor:pointer}
.filters .on,.filters button:hover{background:var(--ink);color:var(--bg)}.note{margin-top:2rem}
.case{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;margin-bottom:3rem}.case h2{font-size:1.8rem;margin:0 0 .5rem}
.form{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;max-width:800px}.form label{display:grid;gap:.3rem;font-size:.9rem;color:var(--mute)}.form .full,.form .btn{grid-column:1/-1}.form .btn{justify-self:start}
input,select,textarea{font:inherit;color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--ink);padding:.6rem 0;border-radius:0}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--acc)}
.hp{position:absolute;left:-9999px}.notice{padding:1rem 1.2rem;border-left:3px solid;margin-bottom:2rem;max-width:800px}.ok{border-color:#2f7d4f;background:#e6f2ea}.err{border-color:#b3261e;background:#f8e6e4}
.ftr{background:var(--ink);color:var(--bg)}.ftr .wrap{border:0}.big{font-size:clamp(2.2rem,6vw,4.5rem);margin-bottom:2rem;max-width:12em}
.ftr .btn{background:var(--bg);color:var(--ink)}.ftr-row{display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;margin-top:5rem;font-size:.85rem;opacity:.7}
.burger{display:none;background:none;border:0;width:40px;height:40px;position:relative}.burger span{position:absolute;left:8px;right:8px;height:2px;background:var(--ink);transition:.3s}.burger span:first-child{top:15px}.burger span:last-child{top:23px}
.rv{opacity:0;transform:translateY(24px);transition:opacity .8s,transform .8s}.rv.vis{opacity:1;transform:none}
.split .w{display:inline-block;overflow:hidden;vertical-align:top}.split .w>span{display:inline-block;transform:translateY(105%);transition:transform .8s cubic-bezier(.2,.7,.2,1)}.split.vis .w>span{transform:none}
@media(max-width:860px){.burger{display:block}
#nav{position:fixed;inset:60px 0 auto 0;flex-direction:column;align-items:flex-start;gap:1.2rem;padding:1.5rem;background:var(--bg);border-bottom:1px solid var(--line);transform:translateY(-140%);transition:transform .35s}
#nav.open{transform:none}#nav a{font-size:1.4rem}
.two,.proj,.svc,.case,.form,.steps{grid-template-columns:1fr}.cols{grid-template-columns:1fr 1fr;row-gap:2rem}.svc .more{grid-column:1}.num{display:none}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}body{opacity:1}.rv,.split .w>span{opacity:1;transform:none}html{scroll-behavior:auto}}