@font-face{font-family: 'Hanken Grotesk';font-style: italic;font-weight: 500;font-display: swap;src: url(../fonts/hanken-grotesk-italic-latin-ext.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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family: 'Hanken Grotesk';font-style: italic;font-weight: 500;font-display: swap;src: url(../fonts/hanken-grotesk-italic-latin.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: 'Hanken Grotesk';font-style: normal;font-weight: 500;font-display: swap;src: url(../fonts/hanken-grotesk-normal-latin-ext.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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family: 'Hanken Grotesk';font-style: normal;font-weight: 500;font-display: swap;src: url(../fonts/hanken-grotesk-normal-latin.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: 'IBM Plex Mono';font-style: normal;font-weight: 400;font-display: swap;src: url(../fonts/ibm-plex-mono-normal-latin-ext.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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family: 'IBM Plex Mono';font-style: normal;font-weight: 400;font-display: swap;src: url(../fonts/ibm-plex-mono-normal-latin.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: 'Newsreader';font-style: italic;font-weight: 300;font-display: swap;src: url(../fonts/newsreader-italic-latin-ext.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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family: 'Newsreader';font-style: italic;font-weight: 300;font-display: swap;src: url(../fonts/newsreader-italic-latin.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: 'Newsreader';font-style: normal;font-weight: 300;font-display: swap;src: url(../fonts/newsreader-normal-latin-ext.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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family: 'Newsreader';font-style: normal;font-weight: 300;font-display: swap;src: url(../fonts/newsreader-normal-latin.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}:root{--bg: #121110;--fg: #ebe8e1;--soft: #9a958d;--dim: #5f5b55;--red: var(--lev-melt,#a8311f);--sans: "Hanken Grotesk","Helvetica Neue",Arial,sans-serif;--serif: "Newsreader","Times New Roman",Georgia,serif;--mono: "IBM Plex Mono",ui-monospace,Menlo,monospace;color-scheme: dark}*{box-sizing: border-box}html{background: var(--bg)}body{margin: 0}@media (pointer: coarse){html{scroll-snap-type: none}}body{background: var(--bg);color: var(--fg);font-family: var(--sans);font-size: calc(16px * var(--k,1));line-height:calc(1.5 * var(--lev-lh,1));-webkit-font-smoothing: antialiased}@media (prefers-reduced-motion: reduce){html{scroll-behavior: auto}}a{color: inherit;text-decoration: none}a:focus-visible,button:focus-visible{outline: calc(1px * var(--k,1)) solid var(--fg);outline-offset: calc(4px * var(--k,1))}#wall{position: fixed;inset: 0;width: 100%;height: 100%;display: block;z-index: 0}body,a,button{cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Ccircle cx='6' cy='6' r='4' fill='%23ebe8e1' stroke='%23121110' stroke-width='1'/%3E%3C/svg%3E") 6 6,default}.dock button{background: none;border: 0;padding: 0;font: inherit;letter-spacing: inherit;text-transform: inherit;color: inherit}.dock button:hover{color: var(--fg)}#replaster[hidden]{display: none !important}main{position: relative;z-index: 1}section{min-height: 100vh;min-height: 100svh;display: grid;place-items: center;text-align: center;scroll-snap-align: start;scroll-snap-stop: always;padding-left: max(calc(20px * var(--k,1)),env(safe-area-inset-left,0px));padding-right: max(calc(20px * var(--k,1)),env(safe-area-inset-right,0px));padding-block: calc(28px * var(--k,1)) calc(var(--dock-h,calc(64px * var(--k,1))) + calc(28px * var(--k,1)))}.para{max-width: 24em;margin: 0;font-size: clamp(calc(22px * var(--k,1)),2.5vw,calc(32px * var(--k,1)));line-height:calc(1.22 * var(--lev-lh,1));letter-spacing: -.005em;text-align: justify;text-align-last: center;hyphens: auto;-webkit-hyphens: auto;text-shadow: 0 0 calc(18px * var(--k,1)) rgba(10,10,9,.9),0 0 calc(3px * var(--k,1)) rgba(10,10,9,.9)}.s{font-family: var(--sans);font-weight: 500;color: var(--fg)}.r{font-family: var(--serif);font-weight: 300;color: var(--soft);font-size: 1.04em}.kicker{display: block;margin-bottom: calc(26px * var(--k,1));font-family: var(--mono);font-size: calc(10px * var(--k,1));letter-spacing: .12em;text-transform: uppercase;color: var(--soft);text-decoration: underline;text-underline-offset: calc(3px * var(--k,1))}.demo{background: none;border: 0;padding: 0;font: inherit;color: inherit}.demo .s{border-bottom: calc(1px * var(--k,1)) solid var(--dim);transition: border-color .2s}.demo:hover .s{border-color: var(--fg)}.demo i{font-style: normal;font-family: var(--mono);font-size: .45em;vertical-align: middle;margin-right: .4em;color: var(--soft)}.work a{transition: color .2s}.work a.s:hover,.work a.r:hover{color: #fff;text-decoration: underline;text-decoration-thickness: calc(1px * var(--k,1));text-underline-offset: .18em}#card{position: fixed;left: 0;top: 0;z-index: 5;pointer-events: none;opacity: 0;transition: opacity .15s;width: calc(240px * var(--k,1));padding: calc(14px * var(--k,1)) calc(16px * var(--k,1));background: #0a0a09;border: calc(1px * var(--k,1)) solid #2e2c29;font-family: var(--mono);font-size: calc(11px * var(--k,1));line-height:calc(1.6 * var(--lev-lh,1));text-align: left;color: var(--soft)}#card b{display: block;font-family: var(--sans);font-weight: 500;font-size: calc(15px * var(--k,1));color: var(--fg);margin-bottom: calc(6px * var(--k,1))}#card.on{opacity: 1}.red{color: var(--red);white-space: nowrap}.demo i{color: var(--red);font-size: .6em}.demo .s.red,.contact .para a .s.red{border-color: color-mix(in srgb,var(--red) 65%,transparent)}.demo:hover .s.red,.contact .para a:hover .s.red{border-color: var(--red)}.logos{display: grid;grid-template-columns: repeat(4,minmax(0,1fr));gap: calc(46px * var(--k,1)) calc(56px * var(--k,1));align-items: center;justify-items: center;width: min(calc(960px * var(--k,1)),100%);margin: 0 auto}.logos img{display: block;width: auto;height: calc(62px * var(--k,1));max-width: 100%;object-fit: contain;filter: invert(1);opacity: .82}@media (max-width: 640px){.logos{grid-template-columns: repeat(2,minmax(0,1fr));gap: calc(30px * var(--k,1)) calc(28px * var(--k,1))}.logos img{height: calc(40px * var(--k,1))}}#clients>div{width: 100%}section.photo{position: relative;isolation: isolate;overflow: hidden}section.photo::before{content: "";position: absolute;inset: 0;z-index: -2;background: var(--img) var(--pos,center) / cover no-repeat;filter: grayscale(var(--gray,0)) brightness(var(--bright,1)) contrast(var(--contrast,1))}section.photo::after{content: "";position: absolute;inset: 0;z-index: -1;background: radial-gradient(ellipse 62% 58% at 50% 50%,rgba(12,11,10,.74),rgba(12,11,10,.38) 75%),linear-gradient(0deg,rgba(18,17,16,.95) 0%,rgba(18,17,16,0) 22%),linear-gradient(180deg,rgba(18,17,16,.7) 0%,rgba(18,17,16,0) 18%)}.smn{border-bottom: calc(1px * var(--k,1)) solid var(--dim);transition: border-color .2s}.smn:hover{border-color: var(--fg)}.mentor-line{margin: calc(30px * var(--k,1)) 0 0;font-size: clamp(calc(20px * var(--k,1)),2.2vw,calc(28px * var(--k,1)))}.mentor{border-bottom: calc(1px * var(--k,1)) solid color-mix(in srgb,var(--red) 65%,transparent)}.mentor:hover{border-color: var(--red)}.contact .para a .s{border-bottom: calc(1px * var(--k,1)) solid var(--dim)}.contact .para a:hover .s{border-color: var(--fg)}.copy{background: none;border: 0;padding: 0 0 0 .5em;font-family: var(--mono);font-size: calc(10px * var(--k,1));letter-spacing: .1em;text-transform: uppercase;color: var(--soft);vertical-align: middle}.copy:hover{color: var(--fg)}nav.dock{position: fixed;left: 0;right: 0;bottom: 0;z-index: 6;display: flex;justify-content: center;flex-wrap: wrap;gap: calc(8px * var(--k,1)) calc(26px * var(--k,1));padding: calc(14px * var(--k,1)) max(calc(16px * var(--k,1)),env(safe-area-inset-right,0px)) calc(calc(16px * var(--k,1)) + env(safe-area-inset-bottom,0px)) max(calc(16px * var(--k,1)),env(safe-area-inset-left,0px));font-family: var(--mono);font-size: calc(10px * var(--k,1));letter-spacing: .1em;text-transform: uppercase;color: var(--soft);background: linear-gradient(0deg,rgba(18,17,16,.92),rgba(18,17,16,0))}nav.dock a:hover,nav.dock a.cur{color: var(--fg);text-decoration: underline;text-underline-offset: calc(3px * var(--k,1))}nav.dock .clock{font-variant-numeric: tabular-nums}.hint{position: fixed;top: calc(calc(18px * var(--k,1)) + env(safe-area-inset-top,0px));left: 0;right: 0;z-index: 6;text-align: center;font-family: var(--mono);font-size: calc(10px * var(--k,1));letter-spacing: .1em;text-transform: uppercase;color: var(--dim);pointer-events: none;transition: opacity .6s}section>.stack::before{display: none}.para,.body{text-shadow: none}section.photo .para{text-shadow: 0 0 calc(18px * var(--k,1)) rgba(10,10,9,.9),0 0 calc(3px * var(--k,1)) rgba(10,10,9,.9)}@media (max-width: 520px){nav.dock{gap: calc(6px * var(--k,1)) calc(16px * var(--k,1));padding-top: calc(10px * var(--k,1))}nav.dock .clock{display: none}.para{font-size: clamp(calc(19px * var(--k,1)),5.4vw,calc(24px * var(--k,1)))}#about .para{font-size: clamp(calc(17px * var(--k,1)),4.8vw,calc(21px * var(--k,1)))}}.arr{display: inline-block;width: .5em;height: .5em;margin-left: .28em;vertical-align: .14em;fill: none;stroke: currentColor;stroke-width: 1.1;stroke-linecap: square;overflow: visible}h1.para{margin: 0;font-weight: inherit}h2.kicker{margin: 0 0 calc(26px * var(--k,1));font-weight: 400;line-height:calc(1.5 * var(--lev-lh,1))}#home{grid-auto-flow: row;align-content: center}#home .scrub{display: flex;align-items: center;gap: calc(14px * var(--k,1));width: min(calc(420px * var(--k,1)),80vw);margin: calc(26px * var(--k,1)) auto 0}#home .scrub[hidden]{display: none}.scrub .bar{position: relative;flex: 1;height: calc(18px * var(--k,1));padding: 0;border: 0;background: none}.scrub .bar::before{content: "";position: absolute;left: 0;right: 0;top: calc(8px * var(--k,1));height: calc(2px * var(--k,1));background: rgba(235,232,225,.25)}.scrub .bar i{position: absolute;left: 0;top: calc(8px * var(--k,1));height: calc(2px * var(--k,1));width: 0;background: var(--red)}.scrub .time{font-family: var(--mono);font-size: calc(10px * var(--k,1));letter-spacing: .08em;color: var(--soft);font-variant-numeric: tabular-nums;white-space: nowrap}#side{padding: 0;display: grid;grid-template-columns: minmax(0,1fr) minmax(0,1fr);place-items: stretch}#side .col{display: flex;flex-direction: column;justify-content: center;align-items: center;text-align: center;padding: calc(28px * var(--k,1)) max(calc(28px * var(--k,1)),4vw) calc(var(--dock-h,calc(64px * var(--k,1))) + calc(28px * var(--k,1)));--fg: #1c1a19;--soft: rgba(28,26,25,.66);--dim: rgba(28,26,25,.38);color: var(--fg)}:root{--tl: #121110;--tr: #121110}.tint{position: fixed;inset: 0;z-index: 0;pointer-events: none;background: linear-gradient(90deg,var(--tl) 50%,var(--tr) 50%)}#side,#contact{background: transparent}@media (max-width: 700px){#side .teach{background: #F7E78A}#side .lab{background: #B9A3E3}}#side .para{font-size: clamp(calc(17px * var(--k,1)),1.55vw,calc(22px * var(--k,1)));max-width: 24em}#side .work a.s:hover,#side .work a.r:hover{color: #000}@supports (grid-template-rows: subgrid){@media (min-width: 701px){#side{grid-template-rows: 1fr auto auto auto 1fr}#side .col{grid-row: 1 / -1;display: grid;grid-template-rows: subgrid;justify-items: center;align-items: start;align-content: stretch}#side .col>.kicker{grid-row: 2}#side .col>.para{grid-row: 3}#side .col>.mentor-line{grid-row: 4}}}#side .mentor-line{font-size: clamp(calc(17px * var(--k,1)),1.6vw,calc(24px * var(--k,1)))}@media (max-width: 700px){#side{grid-template-columns: minmax(0,1fr)}#side .col{padding: calc(40px * var(--k,1)) calc(22px * var(--k,1))}#side .col.lab{padding-bottom: calc(var(--dock-h,calc(64px * var(--k,1))) + calc(32px * var(--k,1)))}}#contact{--fg: #121110;--soft: rgba(18,17,16,.62);--dim: rgba(18,17,16,.35);color: var(--fg)}#contact .copy:hover{color: #121110}html.dock-on-light nav.dock{color: rgba(18,17,16,.66);background: none}html.dock-on-light nav.dock a:hover,html.dock-on-light nav.dock a.cur{color: #121110}#home .hero-text{position: relative}#home .hero-text .scrub{position: absolute;left: 50%;top: 100%;transform: translateX(-50%);margin: calc(26px * var(--k,1)) 0 0}.demo,.nobr{white-space: nowrap}.demo-label[data-state="play"] .w-pause,.demo-label[data-state="pause"] .w-play{display: none}a.mail{position: relative}a.mail .tip{position: absolute;left: 50%;bottom: calc(100% + calc(10px * var(--k,1)));transform: translate(-50%,calc(4px * var(--k,1)));padding: calc(6px * var(--k,1)) calc(10px * var(--k,1));border-radius: calc(6px * var(--k,1));background: #121110;color: #ebe8e1;font-family: var(--mono);font-size: calc(10px * var(--k,1));letter-spacing: .1em;text-transform: uppercase;white-space: nowrap;opacity: 0;pointer-events: none;transition: opacity .18s,transform .18s}a.mail .tip::after{content: "";position: absolute;left: 50%;top: 100%;margin-left: -5px;border: calc(5px * var(--k,1)) solid transparent;border-top-color: #121110}a.mail .tip.on{opacity: 1;transform: translate(-50%,0)}.demo .demo-label,.demo .demo-label.red{border-bottom: 0}.demo-label>span{border-bottom: calc(1px * var(--k,1)) solid color-mix(in srgb,var(--red) 65%,transparent)}.demo:hover .demo-label>span{border-color: var(--red)}h1.para{text-align-last: left}@media (min-width: 768px){:root{--k: var(--lev-scale,1.2)}}.logo-w{position: relative;display: block;max-width: 100%}.logo-tint{position: absolute;inset: 0;opacity: 0;pointer-events: none;-webkit-mask: var(--src) center / contain no-repeat;mask: var(--src) center / contain no-repeat}main .w{position: relative}main section{overflow-x: clip}.ph-only{display: none}@media (max-width: 520px){.ph-only{display: inline}.desk-only{display: none}}#home.photo{--img:url(../img/dsc-2580-1333.webp)}@media (max-width:700px){#home.photo{--img:url(../img/dsc-2580-800.webp)}}