@font-face{font-family:Inter;src:url('assets/smol-inter.woff2');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:Fragment Mono;src:url('assets/fragmentmono.ttf');font-display:swap}
@font-face{font-family:Instrument Serif;src:url('assets/instrumentserif.ttf');font-display:swap}
:root{--ink:#22211e;--soft:#62605b;--line:#e3e1dc;--rust:#935332;--mono:'Fragment Mono',monospace;scroll-behavior:smooth}
*{box-sizing:border-box}body{margin:0;background:white;color:var(--ink);font:400 18px/26px Inter,Arial,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a,summary{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--rust);outline-offset:5px}.skip{position:fixed;top:-80px;left:10px;z-index:20;background:white;padding:10px}.skip:focus{top:6px}.wrap{width:min(1280px,calc(100% - 11.1vw));margin-inline:auto}header{position:sticky;z-index:8;top:0;background:rgb(255 255 255 / .94);backdrop-filter:blur(10px)}.head{display:flex;justify-content:space-between;align-items:center;height:62px}.wordmark{display:inline-flex;align-items:center;flex:none}.wordmark img{display:block;width:112px;height:auto}.head nav,.actions{display:flex;align-items:center;gap:12px}.navlink,.button,.textlink,.location,.micro,figcaption{font:400 14px/14px var(--mono);letter-spacing:.02em}.navlink,.button,.micro,.location{text-transform:uppercase}.navlink{margin-right:10px}.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:1px solid #c9c7c1;padding:13px 21px;border-radius:30px;background:#fff}.dark{background:var(--ink);color:white;border-color:var(--ink)}.button:hover{border-color:var(--rust);color:var(--rust)}.dark:hover{color:#fff;background:#66432f}.head .button{padding:10px 15px}.navlink:hover,.textlink:hover{color:var(--rust)}
.hero{min-height:clamp(480px,64svh,730px);display:grid;grid-template-columns:1.2fr 1fr;gap:6%;align-items:center;padding:54px 0 26px}.location{display:inline-flex;align-items:center;gap:7px;background:#f6f2ed;color:#694c39;border-radius:18px;padding:6px 11px;letter-spacing:.05em}.location span{font-family:Arial,sans-serif}.hero h1{font-size:53px;font-weight:400;line-height:64px;letter-spacing:-.04em;margin:24px 0 17px}.hero p,.chapter-head p:not(.micro),.other-tool p,.service-list p,.case-copy>p:not(.micro){max-width:640px;color:var(--soft);margin:0}.hero .actions{margin-top:34px}.hero-art{width:100%;margin:0;justify-self:end}.hero-art canvas{display:block;width:100%;height:auto}.client-strip{padding:34px 0 45px;text-align:center}.micro{font-size:11px;line-height:14px;letter-spacing:.1em;color:#706b64;margin:0 0 16px}.names{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:clamp(18px,4.3vw,70px)}.names button{border:0;background:none;padding:4px 0;color:#474440}.names button:hover{color:var(--rust)}.arketa,.bounce{font:650 27px/1 Inter,sans-serif;letter-spacing:-1.9px}.binti{font:30px/1 Georgia,serif;letter-spacing:-1.8px}.wise{font:700 18px/1 Georgia,serif;letter-spacing:-.7px}.f45{font:italic 900 27px/1 Arial,sans-serif;letter-spacing:-1.8px}.shield{font:600 16px/1.1 Inter,sans-serif;letter-spacing:-.7px}
.chapter{margin-top:clamp(100px,12vw,190px);scroll-margin-top:90px}.client-strip+.chapter{margin-top:58px}.chapter-head{display:flex;align-items:end;justify-content:space-between;gap:28px;margin-bottom:34px}.chapter h2,dialog h2{font-size:30px;line-height:34.7px;letter-spacing:-.02em;font-weight:400;margin:0 0 13px}.chapter-head>div{max-width:690px}.chapter .micro{margin-bottom:12px}.textlink{border:0;border-bottom:1px solid #b8b1a8;padding:4px 0 5px;line-height:18px;background:none;display:inline-flex;align-items:center;gap:8px;white-space:nowrap}.landscape{margin:0}.picture{isolation:isolate;position:relative;overflow:hidden;border-radius:6px;aspect-ratio:2.14;background:#efe9e1}.picture img{display:block;width:100%;height:100%;object-fit:cover;animation:drift 24s ease-in-out infinite alternate}.afternoon .picture img{animation-direction:alternate-reverse;transform-origin:20% 55%}.evening .picture img{transform-origin:76% 35%}@keyframes drift{from{transform:scale(1.027) translate(-.7%,.3%)}to{transform:scale(1.095) translate(.9%,-.55%)}}.weather{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.motion{position:absolute;bottom:14px;right:14px;width:34px;height:34px;border:1px solid #ffffff80;border-radius:50%;background:#27221b78;color:#fff;display:grid;place-items:center;font:15px/1 Arial}.paused img,.offscreen img{animation-play-state:paused}.landscape figcaption{display:flex;justify-content:space-between;color:#766e64;font-size:11px;line-height:16px;letter-spacing:.04em;margin-top:10px}.other-tool{border-block:1px solid var(--line);margin-top:32px;padding:24px 0;display:grid;grid-template-columns:1fr 3fr auto;gap:18px;align-items:baseline}.other-tool h3{margin:0 0 5px;font-size:20px;font-weight:450;letter-spacing:-.04em}.other-tool p{font-size:15px;line-height:22px}.services{display:grid;grid-template-columns:1fr 1.3fr;gap:7vw}.service-list details{border-top:1px solid var(--line);padding:20px 0}.service-list details:last-child{border-bottom:1px solid var(--line)}summary{cursor:pointer;display:flex;align-items:center;justify-content:space-between;font-size:22px;letter-spacing:-.04em;list-style:none}summary::-webkit-details-marker{display:none}summary:after{content:'+';font:19px/1 var(--mono)}details[open] summary:after{content:'−'}.service-list p{margin:14px 0}.closing{text-align:center;padding:clamp(100px,15vw,220px) 0}.closing h2{font:400 104px/.95 'Instrument Serif',Georgia,serif;letter-spacing:-.02em;margin:0 0 32px}footer{display:flex;align-items:center;gap:20px;border-top:1px solid var(--line);padding-block:32px}footer p{color:var(--soft);font-size:14px;margin:0 auto 0 0}dialog{border:1px solid var(--line);color:inherit;border-radius:12px;padding:0;width:min(510px,calc(100% - 32px));max-height:88svh;box-shadow:0 25px 100px #271c1726}dialog::backdrop{background:#31282065;backdrop-filter:blur(5px)}dialog img{width:100%;height:clamp(130px,24vh,225px);object-fit:contain;display:block;background:#f3f1eb}.close{position:absolute;right:12px;top:12px;background:white;border:1px solid var(--line);border-radius:50%;width:36px;height:36px;font-size:24px}.case-copy{padding:26px}.case-copy .button{margin-top:22px}
@media(max-width:760px){.wrap{width:calc(100% - 40px)}body{font-size:16px;line-height:24px}.head{height:54px}.navlink{display:none}.head .button{padding:9px 13px}.wordmark img{width:98px}.hero{display:flex;flex-direction:column;gap:0;align-items:stretch;min-height:0;padding:14px 0 42px}.hero-art{order:-1;align-self:center;width:min(380px,87%);height:190px}.hero-art canvas{height:100%;object-fit:contain}.hero h1{font-size:34px;line-height:46px;margin:18px 0 12px}.hero .actions{margin-top:24px;gap:8px}.button{padding:12px 15px}.location{font-size:12px}.client-strip{padding:28px 0 26px}.names{gap:14px 24px}.arketa,.bounce,.f45{font-size:22px}.binti{font-size:25px}.wise,.shield{font-size:14px}.client-strip+.chapter{margin-top:58px}.chapter{margin-top:90px;scroll-margin-top:70px}.chapter h2,dialog h2{font-size:26px;line-height:30px;letter-spacing:-.03em}.chapter-head{display:block;margin-bottom:22px}.chapter-head .textlink{margin-top:15px}.picture{aspect-ratio:1.2}.morning img{object-position:27% center}.afternoon img{object-position:39% center}.evening img{object-position:63% center}.other-tool,.services{display:block}.other-tool .micro{display:block}.other-tool .textlink{margin-top:14px}.services h2{margin-bottom:26px}.closing h2{font-size:52px}.closing{padding:100px 0}footer{flex-wrap:wrap;gap:12px}footer p{font-size:12px}footer .textlink{font-size:12px}.motion{bottom:9px;right:9px}.case-copy{padding:20px}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}.picture img{animation:none}}
[hidden]{display:none!important}
@media(prefers-reduced-motion:reduce){.motion{display:none}}

/* The painting stays visible around an interactive example of the work. */
.landscape .picture{width:100%;display:grid;place-items:center;aspect-ratio:1.9;min-height:470px;padding:48px 22px}
.picture>img{position:absolute;inset:0;z-index:-2}
.picture>.weather{z-index:-1}
.service-window{position:relative;width:min(70%,760px);border-radius:12px;overflow:hidden;background:#fcfbf9;box-shadow:0 20px 75px #29191040,0 1px 5px #29191033;color:#292520;transition:opacity .7s,transform .85s cubic-bezier(.2,.8,.2,1)}
.will-reveal:not(.in-view):not(:focus-within) .service-window{opacity:0;transform:translateY(40px)}
.window-bar{display:flex;gap:9px;align-items:center;padding:12px 18px;background:#f1eee8;border-bottom:1px solid #dedbd4;font:12px/1.4 var(--mono)}
.window-dot{width:8px;height:8px;background:#a87251;border-radius:50%;box-shadow:0 0 0 3px #dfc6ad70}
.window-bar small{margin-left:auto;color:#655f56;font:10px/1.4 var(--mono)}
.service-window h3{margin:0;padding:20px 22px 16px;font:400 24px/1.2 Inter,sans-serif;letter-spacing:-.045em}
.window-layout{display:grid;grid-template-columns:minmax(142px,.76fr) minmax(0,1.6fr);border-top:1px solid var(--line)}
.window-controls{background:#f6f4ef;border-right:1px solid var(--line);padding:16px 10px}
.mini-label,.outcome small,.roster-count{font:10px/1.4 var(--mono);letter-spacing:.045em;text-transform:uppercase;color:#70685e}
.window-controls>.mini-label{display:block;padding:0 9px 8px}
.window-controls button{width:100%;text-align:left;display:flex;gap:5px;align-items:center;justify-content:space-between;border:0;border-radius:5px;background:transparent;padding:10px;font:13px/1.3 Inter,sans-serif}
.window-controls button:hover{background:#ece8e1}
.window-controls button[aria-pressed=true]{background:#e8dfd3;color:#503721}
.window-controls button span{font-size:16px}
.readout{padding:18px 22px;min-height:205px;display:flex;align-items:center}
.sample-detail{width:100%}.query{border:1px solid #d8d4cc;background:white;border-radius:20px;color:#50493e;padding:6px 11px;display:flex;gap:8px;align-items:center;font-size:13px;line-height:18px;margin:0 0 12px}.query b{font-size:17px}
.sample-detail h4{margin:5px 0 6px;font-size:20px;line-height:1.25;letter-spacing:-.035em;font-weight:500}
.sample-detail p{margin:0;font-size:14px;line-height:1.5;color:#5c564e}
.outcome{display:flex;align-items:baseline;gap:9px;border-top:1px solid #e6e1d8;margin-top:15px;padding-top:9px;font:12px/1.5 var(--mono)}
.evening .window-bar{background:#efedf2}.evening .window-dot{background:#777588;box-shadow:0 0 0 3px #cfccd7}.evening .window-controls button[aria-pressed=true]{background:#e4e1ea;color:#484054}
.client-wall .chapter-head{align-items:baseline;margin-bottom:24px}
.featured-clients,.quote-grid{display:grid;gap:8px}.featured-clients{grid-template-columns:repeat(4,minmax(0,1fr))}
.client-tile{min-height:175px;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;padding:22px 10px;border:0;border-radius:9px;background:#f5f3ef;color:#35312d}
.client-tile:nth-child(even){background:#f1efed}.client-tile:hover{background:#eae5dd}.client-tile span{font:550 clamp(18px,2.1vw,30px)/1.15 Inter,sans-serif;letter-spacing:-.065em}.client-tile:nth-child(2) span{font-family:Georgia,serif;font-variant:small-caps}.client-tile:nth-child(3) span{font-style:italic;font-weight:800}
.client-tile small{font:11px/1.4 var(--mono);color:#6d675e}
.client-tile i{position:absolute;bottom:12px;right:12px;display:grid;place-items:center;background:#e3dfd8;border-radius:50%;height:24px;width:24px;font:17px/1 Inter,sans-serif}
.quote-grid{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:8px}.quote-card{margin:0;padding:22px 24px;border-radius:9px;background:#f4f1eb;display:flex;flex-direction:column;align-items:start}.quote-card:nth-child(2){background:#f5f0ec}.quote-card:nth-child(3){background:#f0eff2}.quote-mark{font:44px/.85 'Instrument Serif',serif;color:#8a7566}.quote-card blockquote{margin:5px 0 24px;font-size:18px;line-height:1.5;letter-spacing:-.025em}.quote-card figcaption{margin-top:auto;font:13px/1.5 Inter,sans-serif}.quote-card figcaption small{display:block;font:10px/1.5 var(--mono);color:#6b6258}
.roster{margin-top:18px;border-block:1px solid var(--line);padding:17px 0}.roster summary{font-size:17px;justify-content:start;gap:9px}.roster summary span{font:11px var(--mono);color:var(--soft)}.roster summary:after{margin-left:auto}.roster ul{list-style:none;padding:0;margin:22px 0 8px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px 20px;font-size:14px;line-height:1.45}.roster a:hover{text-decoration:underline}
@media(max-width:880px){.service-window{width:min(89%,650px)}}
@media(max-width:760px){.landscape .picture{padding:44px 12px 53px;aspect-ratio:auto;min-height:430px}.service-window{width:min(100%,480px)}.window-bar{padding:8px 10px;gap:6px;font-size:10px;flex-wrap:wrap}.window-bar small{font-size:9px}.service-window h3{font-size:19px;padding:14px 12px 12px}.window-layout{display:block}.window-controls{display:flex;flex-wrap:wrap;gap:3px;padding:7px;border:0;border-bottom:1px solid var(--line)}.window-controls>.mini-label,.window-controls button span{display:none}.window-controls button{width:auto;padding:7px 6px;font-size:11px}.readout{padding:12px;min-height:174px}.sample-detail h4{font-size:18px}.sample-detail p{font-size:13px}.outcome{font-size:11px}.featured-clients{grid-template-columns:repeat(2,minmax(0,1fr))}.client-tile{min-height:130px}.quote-grid{grid-template-columns:1fr}.quote-card{padding:20px}.quote-card blockquote{margin-bottom:16px}.roster ul{grid-template-columns:repeat(2,minmax(0,1fr))}.client-wall .chapter-head{display:flex}}
@media(prefers-reduced-motion:reduce){.service-window,.will-reveal:not(.in-view):not(:focus-within) .service-window{opacity:1;transform:none;transition:none}}

/* A single crop of the entire 1600 × 900 illustration. */
.street-intro{display:grid;grid-template-columns:1.08fr .92fr;align-items:end;gap:6%;padding:clamp(50px,6.2vw,92px) 0 clamp(34px,4vw,60px)}
.street-intro h1{font-size:53px;line-height:64px;letter-spacing:-.04em;font-weight:400;margin:16px 0 -5px}
.street-intro>p{max-width:530px;margin:0;color:var(--soft)}
.street-tour{border:1px solid var(--line);border-radius:8px;overflow:hidden;background:#fff}
.tour-bar{display:flex;align-items:center;gap:20px;padding:14px 20px}
.tour-bar h2{font-size:16px;line-height:22px;letter-spacing:-.025em;font-weight:500;margin:0}
.tour-bar p{font-size:14px;line-height:20px;color:var(--soft);margin:0 auto 0 0}
.picker{display:none}.street-pan{overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#aba297 #eee9e3}
.street-stage{width:100%;min-width:800px;aspect-ratio:1600/555;position:relative;isolation:isolate;touch-action:pan-x pan-y}
.street-art{width:100%;height:100%;display:block}
.street-art #sky-dusk,.street-art .dusk-grade,.lit-buildings image{opacity:0;transition:opacity .42s ease}
.street-stage.chosen #sky-dusk{opacity:.76}.street-stage.chosen .dusk-grade,.lit-buildings image.lit{opacity:1}
.building{position:absolute;border:0;background:transparent;padding:0;cursor:pointer;color:#302b24;display:flex;align-items:flex-end;justify-content:center;outline-offset:-3px}
.building span{display:block;background:#fffaf3ef;color:#382f26;border:1px solid #fff9;box-shadow:0 2px 9px #271b1530;border-radius:20px;padding:5px 9px;font:12px/16px var(--mono);white-space:nowrap}
.building[aria-pressed=true] span{background:#28241f;color:white;border-color:#c6ac8c}
.street-detail{display:flex;justify-content:space-between;align-items:center;gap:28px;padding:18px 22px;min-height:112px}
.street-detail .micro{margin:0 0 5px;color:var(--rust)}.street-detail h3{display:inline;font-size:18px;font-weight:500;letter-spacing:-.035em;margin:0}.street-detail #street-work{display:inline;color:var(--soft);font-size:15px;line-height:22px;margin:0 0 0 9px}.street-detail .textlink{flex:none}#room-viewer{scroll-margin-top:82px}
@media(max-width:960px){.picker{display:block;margin-left:auto;position:relative}.picker span{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden}.picker select{font:12px/18px var(--mono);border:1px solid var(--line);border-radius:18px;background:white;color:var(--ink);padding:8px 6px;max-width:165px}.tour-bar p{max-width:250px}.street-detail{min-height:128px}}
@media(max-width:760px){.street-intro{display:block;padding:40px 0 26px}.street-intro h1{font-size:34px;line-height:46px;margin:13px 0 8px}.street-intro>p{max-width:550px}.tour-bar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 8px;padding:12px}.tour-bar h2{font-size:15px}.tour-bar p{grid-column:1/-1;grid-row:2;max-width:none;font-size:13px}.picker{grid-column:2;grid-row:1}.picker select{max-width:137px}.building span{font-size:10px;padding:4px 6px}.street-detail{display:block;padding:15px;min-height:168px}.street-detail #street-work{display:block;margin:3px 0 6px;font-size:14px;line-height:20px}.street-detail .textlink{font-size:12px}.street-stage{min-width:810px}.client-strip{padding-top:34px}}
@media(prefers-reduced-motion:reduce){.street-art #sky-dusk,.street-art .dusk-grade,.lit-buildings image{transition:none}}

/* Sky-card variation. The caption and its pointer follow the same building. */
.sky-stage{min-width:900px}
.sky-stage .street-detail{position:absolute;z-index:2;display:block;width:clamp(218px,20vw,276px);min-height:0;padding:15px 17px 13px;background:#fff;border:1px solid #e8e3db;border-radius:10px;box-shadow:0 6px 26px #35291d28}
.sky-stage .street-detail::after{content:'';position:absolute;bottom:-6px;left:var(--tip);width:11px;height:11px;background:white;border:solid #e8e3db;border-width:0 1px 1px 0;transform:translateX(-50%) rotate(45deg)}
.sky-stage .street-detail .micro{font-size:10px;line-height:14px;margin:0 0 4px}.sky-stage .street-detail h3{display:block;font-size:20px;line-height:25px}
.sky-stage .street-detail #street-work{display:block;margin:4px 0 8px;font-size:14px;line-height:20px}
.sky-stage .street-detail .textlink{font-size:11px;line-height:16px;padding:2px 0}
@media(max-width:760px){.sky-stage .street-detail{padding:12px 14px}.sky-stage .street-detail h3{font-size:18px;line-height:22px}}
footer nav{font-size:13px;line-height:20px;color:var(--soft)}footer nav a:hover{text-decoration:underline}
