@font-face{font-family:Fraunces Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(./fraunces-vietnamese-wght-normal.CnvboYUG.woff2)format("woff2-variations");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Fraunces Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(./fraunces-latin-ext-wght-normal.Ca2vKHc0.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,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:Fraunces Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(./fraunces-latin-wght-normal.ukD16Tqj.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}html,body,div,span,h1,h2,h3,h4,h5,h6,p,blockquote,a,em,img,ol,ul,li,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,footer,header,nav,section{font-size:100%;font:inherit;vertical-align:baseline;border:0;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}:root{--font-display:"Fraunces Variable", Georgia, serif;--c-all:#25b740;--c-web:#4390d4;--c-mobile:#d65cff;--c-logo:#f05252;--c-video:#e0ae00}html,body{width:100%;height:100%}body{background-color:#000;min-width:320px;min-height:480px;margin:0;padding:0;font-family:Helvetica,sans-serif;font-size:15px}#body-pic{opacity:.4;will-change:transform;background-color:#000;background-image:url(../../../images/face.jpg);background-position:50% 0;width:100%;height:calc(100% + 720px);position:fixed;top:0;left:0}#main-wrap{min-height:100%;margin:auto;position:relative;overflow:clip}#content-wrap{position:relative}header{opacity:0;z-index:10;background-color:#000c;border:1px solid #222;border-radius:10px;width:200px;margin:25px;transition:opacity .5s,transform .5s;position:fixed;left:0;transform:translateY(-400px);box-shadow:0 5px 20px #000}header.in{opacity:1;transform:translateY(0)}h1{z-index:5;width:125px;margin:auto;padding:20px;position:relative}h1 img{width:100%;transition:transform .5s}h1.clicked img{transform:rotate(360deg)}#content{color:#bdbdbd;padding-left:250px;display:flow-root;position:relative}.wrapped-content{max-width:1200px;margin:auto}nav{text-align:center;font-size:1.5em;position:relative}#mainNav li{display:inline-block}#mainNav a{color:#b8b8b8;border-top:1px solid #555;width:100px;margin:10px;padding:20px;transition:border .5s;display:block}#mainNav a:hover{border-top:1px solid #59d915}#mainNav .active a{color:#fff;border-top:1px solid #45a2da}h2{font-family:var(--font-display);color:#90acda;z-index:5;padding:0 0 10px;font-size:2.25em;font-weight:500;position:relative}a{color:#5d93c9;font-style:normal;text-decoration:none}a:hover{color:#54719a}.about{opacity:0;transition:opacity .5s}.about.in{opacity:1}.about.in .about-page{transform:translateY(0)}.about li{margin:2px 20px}.about-page{padding:450px 100px;line-height:2em;transition:transform .5s;position:relative;transform:translateY(10px)}#hello{letter-spacing:15px;color:#2e2e2e;background:#ffffffe0;font-size:2em;font-weight:lighter}#hello a{color:#24588c}#hello a:hover{color:#183d63}#haiku{background:#2b6b8547;font-size:1.3em;position:relative}#haiku em{font-style:italic}#infinity{text-align:center;background:#8f6b857a;font-size:2em}#infinity blockquote{color:#a38e9c;font-style:italic;font-weight:lighter}#skills{clear:both;text-align:center;background:#1f1f1fb5}.skills{color:#555;box-sizing:border-box;text-align:center;margin:10px 0 0;padding:10px;font-size:1.25em;line-height:2}.skill{cursor:pointer;color:#999;font-size:inherit;background:0 0;border:2px solid #555;border-radius:30px;margin:0 0 10px;padding:0 20px;font-family:inherit;line-height:2;display:inline-block;box-shadow:inset 0 -10px 30px #0000001a,0 0 3px #0006}.haiku{background:#00000040;border-radius:5px;margin:20px 0 0;padding:20px;font-size:1.5em;font-style:italic;line-height:2em;display:inline-block}.contact-link{margin-top:40px;display:block}.projects-wrap{max-width:1400px;margin:0 auto;padding:25px 25px 60px}.project-filters{flex-wrap:wrap;gap:8px;margin-bottom:20px;display:flex}.project-filters button{cursor:pointer;font-size:inherit;background:#00000080;border:1px solid;border-radius:5px;padding:6px 12px;font-family:inherit;transition:background .2s,color .2s}.project-filters .count{opacity:.7;margin-left:2px;font-size:.8em}.project-filters button[aria-pressed=true]{background:var(--type-color);border-color:var(--type-color);color:#111}.projects{grid-template-columns:1fr 1fr;grid-auto-flow:dense;gap:20px;display:grid}.project{display:flex}.project.wide,.project.strip,.project.solo{grid-column:1/-1}.project.tall{grid-area:span 2/2}.project a{aspect-ratio:16/10;background:radial-gradient(ellipse at 50% 40%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 65%), #080808eb;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid #222;border-radius:8px;flex:1;transition:border-color .25s,box-shadow .25s;display:block;position:relative;overflow:hidden}.project.wide a{aspect-ratio:2}.project.tall a{aspect-ratio:auto}.project a:hover,.project a:focus-visible{border-color:color-mix(in srgb, var(--accent) 70%, #000);box-shadow:0 10px 40px #0009, 0 0 0 1px color-mix(in srgb, var(--accent) 30%, transparent)}.project .thumb{justify-content:center;align-items:center;padding:24px 24px 96px;transition:transform .4s;display:flex;position:absolute;inset:0}.project.cover .thumb{padding:0}.project a:hover .thumb,.project a:focus-visible .thumb{transform:scale(1.04)}.project img{object-fit:contain;opacity:0;width:100%;height:100%;transition:opacity .6s}.project.cover img{object-fit:cover}.project.wide.cover img{object-position:50% 0}.project img.loaded{opacity:1}.project .info{background:linear-gradient(#0000,#000000eb 45%);padding:48px 24px 18px;position:absolute;bottom:0;left:0;right:0}.project .title{font-family:var(--font-display);color:#f0f0f0;margin-bottom:4px;font-size:1.6em;font-weight:500;line-height:1.15}.project.wide .title{font-size:2.2em}.project .meta{color:#c8c8c8;margin-bottom:6px;font-size:.95em}.project .meta .dot{opacity:.6;margin:0 6px}.project .type{font-size:.85em}.project .type span{margin-right:8px}.project .cta{color:#fff;opacity:0;font-size:.95em;transition:opacity .25s,transform .25s;position:absolute;bottom:18px;right:24px;transform:translate(-6px)}.project a:hover .cta,.project a:focus-visible .cta{opacity:1;transform:none}.project .badge{border:1px solid color-mix(in srgb, var(--accent) 60%, #000);color:#eee;letter-spacing:.08em;text-transform:uppercase;background:#000000bf;border-radius:20px;padding:4px 10px;font-size:.75em;position:absolute;top:14px;left:14px}.project.solo a{aspect-ratio:auto;grid-template-rows:minmax(0,1fr);grid-template-columns:1.3fr 1fr;height:360px;display:grid}.project.solo .thumb{box-sizing:border-box;min-height:0;padding:32px;position:relative}.project.solo .info{background:0 0;flex-direction:column;justify-content:center;padding:40px 32px 56px;display:flex;position:relative}.project.solo .excerpt{color:#bdbdbd;-webkit-line-clamp:4;-webkit-box-orient:vertical;margin:8px 0 12px;line-height:1.6;display:-webkit-box;overflow:hidden}.project.strip a{aspect-ratio:auto;flex-direction:column;display:flex}.project.strip .thumb{aspect-ratio:5;position:relative}.project.strip .info{background:0 0;padding:16px 24px 18px;position:relative}.project.reveal{opacity:0;transition-property:opacity,transform;transition-duration:.6s;transform:translateY(24px)}.project.reveal.revealed{opacity:1;transform:none}.project-feature{z-index:100;background:#000000e0;border:1px solid #222;border-radius:10px;margin:16px 25px 25px;padding:20px;position:relative}.project-feature .title{font-family:var(--font-display);text-align:center;color:#fff;margin-top:30px;font-size:clamp(2.25em,5vw,3.25em);font-weight:500;line-height:1.1}.project-feature .type{text-align:center;margin:10px 10px 30px}.project-feature .type span{margin:0 4px}.project-nav{z-index:110;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:#000c;border:1px solid #222;border-radius:10px;align-items:center;gap:16px;margin:25px 25px 0;padding:8px 16px;font-size:1.1em;display:flex;position:sticky;top:25px;box-shadow:0 5px 20px #000}.project-nav .back,.project-nav .launch-btn{color:#b8b8b8;white-space:nowrap;border-top:1px solid #555;padding:10px 16px;transition:border .5s,color .25s;display:block}.project-nav .back:hover,.project-nav .launch-btn:hover{color:#fff;border-top-color:#59d915}.project-nav .launch-btn{color:#fff;border-top-color:#45a2da}.project-nav .bar-title{text-align:center;color:#fff;white-space:nowrap;text-overflow:ellipsis;opacity:0;flex:1;min-width:0;transition:opacity .25s,transform .25s;overflow:hidden;transform:translateY(4px)}.project-nav.stuck .bar-title{opacity:1;transform:none}.project-nav .launch{align-items:center;gap:12px;margin-left:auto;display:flex}.project-launch-note{color:#b5bd6a;white-space:nowrap;font-size:.9em;font-style:italic}.featured-image{text-align:center;background:#00000080;border-top:1px solid #555;border-bottom:1px solid #555;margin:20px 0;padding:25px 0 50px}.featured-image img{max-width:100%;max-height:500px;margin:auto;display:block}.project-details{max-width:900px;margin:20px auto;display:flex}.project-description{flex:1;margin:20px;padding:20px;font-size:1.1em;line-height:1.6}.project-description p,.project-description ul,.project-description ol{max-width:65ch;margin-left:auto;margin-right:auto}.project-description p{margin-bottom:10px}.project-description p:last-of-type{margin-bottom:0}.project-description h4{color:#e06c6c;letter-spacing:.12em;text-transform:uppercase;text-align:center;margin-top:28px;margin-bottom:12px;font-size:.8em;font-weight:700;line-height:1em}.project-description h4:first-child{margin-top:0}.project-description ul,.project-description ol{padding:10px}.project-description li{margin:5px 0 5px 20px}.project-description ul li{list-style:outside}.project-description ol li{list-style:decimal}.project-specs{border-left:1px solid #545454;flex:0;align-items:center;min-width:200px;padding:20px;font-size:1.1em;line-height:1.5em;display:flex}.project-specs li{margin:0 0 5px}.project-specs label,.spec-label{color:#e06c6c}.case-study{grid-template-columns:1fr 1fr;grid-auto-flow:dense;display:grid}.project-image{flex-flow:column;justify-content:center;align-items:center;padding:30px;display:flex}.project-image img{max-width:100%;margin-bottom:10px}.project-image img:last-child{margin-bottom:0}.overview{grid-column:1/3}.context{grid-column:2}.results{grid-column:1/3}.all{--type-color:var(--c-all)}.mobile{--type-color:var(--c-mobile)}.logo{--type-color:var(--c-logo)}.web{--type-color:var(--c-web)}.video{--type-color:var(--c-video)}.all,.mobile,.logo,.web,.video{color:var(--type-color)}@media (height<=1200px){.about-page{padding-top:200px;padding-bottom:200px}}@media (height<=800px){.about-page{padding-top:180px;padding-bottom:180px}}@media (width<=800px){.case-study{display:block}.projects{grid-template-columns:1fr}.project.tall{grid-area:auto}.project.tall a{aspect-ratio:4/5}.project.solo a{aspect-ratio:16/10}.project.wide a{aspect-ratio:auto;flex-direction:column;display:flex}.project.wide .thumb{aspect-ratio:16/9;position:relative}.project.wide .info{background:0 0;padding:16px 24px 18px;position:relative}.project.solo a{height:auto;display:block}.project.solo .thumb{padding:24px 24px 96px;position:absolute}.project.solo .info{background:linear-gradient(#0000,#000000eb 45%);padding:48px 24px 18px;position:absolute}.project.solo .excerpt,.project .cta{display:none}.project-feature .title{margin-top:10px}.about-page{padding:150px}.project-details{flex-flow:column}}@media (width<=680px){header{width:auto;margin:25px 25px 0;position:static}h1{width:100px}#mainNav a{margin:0}#content{padding:0}.about{padding:20px 0 0}.about-page{padding:100px 50px}#hello{letter-spacing:4px;font-size:1.75em}.skills{font-size:1.1em}.project-nav{margin:16px 25px 0;padding:6px 10px;font-size:1em;top:10px}.project-nav .back,.project-nav .launch-btn{padding:8px 10px}.project-nav .bar-title{display:none}.project-nav .launch{flex-direction:column;align-items:flex-end;gap:2px}.project-launch-note{font-size:.8em}.project-feature .info{margin:10px}.projects-wrap{padding:20px 20px 40px}.project .title,.project.wide .title{font-size:1.4em}}@media (width<=321px){header{position:static}h1{width:100px}#mainNav a{margin:0}#content{padding-top:0}.about-page{padding:100px 50px}#hello{letter-spacing:4px;text-align:left;font-size:1.5em}#skills{padding:50px}.skills{font-size:1em}}::view-transition-group(*){animation-duration:.45s;animation-timing-function:cubic-bezier(.2,.8,.2,1)}::view-transition-old(*.project-image){object-fit:contain;height:100%}::view-transition-new(*.project-image){object-fit:contain;height:100%}header{view-transition-name:site-header}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
