:root{--noir: #08080a;--noir-soft: #0e0e11;--bone: #e9e6df;--ash: #8a8a8f;--ghost: #7b7b81;--hair: rgba(233, 230, 223, .14);--hair-soft: rgba(233, 230, 223, .06);--serif: "Cormorant Garamond", Georgia, serif;--mono: "JetBrains Mono", ui-monospace, monospace;--pad: clamp(20px, 4.5vw, 64px)}*{margin:0;padding:0;box-sizing:border-box}html,body{height:auto}body{background:var(--noir);color:var(--bone);font-family:var(--serif);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;cursor:default}::selection{background:var(--bone);color:var(--noir)}canvas{touch-action:auto}.label{font-family:var(--mono);font-weight:400;font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--ash)}.index{font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--ghost)}.display{font-family:var(--serif);font-weight:300;line-height:.9;letter-spacing:-.01em;font-size:clamp(3.2rem,11vw,11rem)}.display em{font-style:italic;font-weight:400}.h2{font-family:var(--serif);font-weight:300;line-height:1;font-size:clamp(2.2rem,6vw,5rem)}.lede{font-family:var(--serif);font-weight:300;line-height:1.45;font-size:clamp(1.5rem,3.6vw,3rem);max-width:18ch}.body{font-family:var(--serif);font-weight:400;line-height:1.6;font-size:clamp(1rem,1.5vw,1.18rem);color:var(--ash);max-width:46ch}a{color:inherit;text-decoration:none}.reveal{opacity:0;transform:translateY(26px);transition:opacity 1.2s cubic-bezier(.16,1,.3,1),transform 1.2s cubic-bezier(.16,1,.3,1)}.reveal.in{opacity:1;transform:none}.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.3s}.grain{position:fixed;top:0;right:0;bottom:0;left:0;z-index:9;pointer-events:none;opacity:.055;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.frame{position:fixed;top:0;right:0;bottom:0;left:0;z-index:7;pointer-events:none}.frame .v{position:absolute;top:0;bottom:0;width:1px;background:var(--hair-soft)}.frame .v.l{left:var(--pad)}.frame .v.r{right:var(--pad)}.frame .mark{position:absolute;width:9px;height:9px}.frame .mark:before,.frame .mark:after{content:"";position:absolute;background:var(--hair)}.frame .mark:before{left:0;top:50%;width:100%;height:1px;transform:translateY(-50%)}.frame .mark:after{top:0;left:50%;height:100%;width:1px;transform:translate(-50%)}.frame .tl{top:var(--pad);left:var(--pad)}.frame .tr{top:var(--pad);right:var(--pad)}.frame .bl{bottom:var(--pad);left:var(--pad)}.frame .br{bottom:var(--pad);right:var(--pad)}.frame .corner{position:absolute;width:clamp(52px,7.5vw,128px);height:auto;opacity:.9;-webkit-user-select:none;user-select:none}.frame .corner-tl{top:0;left:0}.frame .corner-tr{top:0;right:0}.frame .corner-bl{bottom:0;left:0;transform:scaleY(-1)}.frame .corner-br{bottom:0;right:0;transform:scaleY(-1)}.nav{position:fixed;z-index:8;top:var(--pad);left:var(--pad);right:var(--pad);display:flex;justify-content:space-between;align-items:baseline}.nav .wordmark{font-family:var(--serif);font-weight:500;font-size:1.15rem;letter-spacing:.42em;text-transform:uppercase}.nav .menu{display:flex;gap:clamp(18px,3vw,44px)}.nav .menu a{transition:color .4s}.nav .menu a:hover{color:var(--bone)}@media (max-width: 720px){.nav .menu{display:none}}.static-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;background:radial-gradient(120% 90% at 82% 38%,rgba(154,160,181,.1),transparent 60%),radial-gradient(80% 60% at 78% 30%,rgba(233,230,223,.06),transparent 55%),var(--noir)}.content{position:relative;z-index:2}.hero{position:relative;height:100vh;padding:var(--pad);display:flex;flex-direction:column;justify-content:flex-end}.hint{position:absolute;bottom:var(--pad);left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:10px}.hint .line{width:1px;height:42px;background:var(--hair);position:relative;overflow:hidden}.hint .line:after{content:"";position:absolute;left:0;top:-50%;width:100%;height:50%;background:var(--bone);animation:drop 2.4s infinite cubic-bezier(.7,0,.3,1)}@keyframes drop{0%{top:-50%}60%,to{top:100%}}.atmo{position:relative;height:190vh;padding:0 var(--pad)}.atmo .stick{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;justify-content:center}.atmo.right .stick{align-items:flex-end;text-align:right}.atmo .stick .lede{margin-top:24px}.atmo .stick .body{margin-top:20px}.atmo.right .stick .body{margin-left:auto}.gallery{position:relative}.gallery .head{position:absolute;top:var(--pad);left:var(--pad);right:var(--pad);z-index:3;display:flex;justify-content:space-between}.gallery .pin{height:100vh;overflow:hidden;display:flex;align-items:center}.gallery .track{display:flex;gap:clamp(20px,3vw,48px);padding-left:var(--pad);padding-right:var(--pad);will-change:transform}.gallery .card{position:relative;overflow:hidden;flex:0 0 clamp(280px,42vw,560px);height:62vh;border:1px solid var(--hair);display:flex;flex-direction:column;justify-content:space-between;padding:clamp(20px,2.4vw,38px);background:linear-gradient(180deg,rgba(233,230,223,.03),transparent);transition:border-color .5s,background .5s}.gallery .card:hover{border-color:#e9e6df66;background:linear-gradient(180deg,rgba(233,230,223,.06),transparent)}.gallery .card .card-img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05);opacity:.15;z-index:0;transition:opacity .6s cubic-bezier(.16,1,.3,1)}.gallery .card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;background:linear-gradient(180deg,#08080a80,#08080adb)}.gallery .card:hover .card-img{opacity:.26}.gallery .card>*:not(.card-img){position:relative;z-index:2}.gallery .card .card-top{display:flex;justify-content:space-between;align-items:flex-start}.gallery .card .num{font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--ghost)}.gallery .card .card-go{font-family:var(--mono);font-size:13px;color:var(--ash);transition:transform .5s cubic-bezier(.16,1,.3,1),color .5s}.gallery .card:hover .card-go{transform:translate(3px,-3px);color:var(--bone)}.gallery .card .ct{font-weight:300;font-size:clamp(1.6rem,3vw,2.6rem);line-height:1.02}.gallery .card:hover .ct{font-style:italic}.gallery .card .cd{margin-top:12px;font-family:var(--serif);font-weight:400;font-size:clamp(.95rem,1.15vw,1.08rem);line-height:1.5;color:var(--ash);max-width:42ch}.gallery .card .techs{list-style:none;display:flex;flex-wrap:wrap;gap:7px}.gallery .card .tech{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ash);border:1px solid var(--hair);padding:5px 8px 4px;border-radius:2px;transition:border-color .4s,color .4s}.gallery .card:hover .tech{border-color:#e9e6df40;color:var(--bone)}.glyph{flex:none;color:inherit}.glyph-fallback{border:1px solid currentColor;transform:rotate(45deg);opacity:.55}.tech .glyph{width:13px;height:13px}.tech .glyph-fallback{width:7px;height:7px;margin:0 3px}.footer{position:relative;min-height:100vh;padding:var(--pad);display:flex;flex-direction:column;justify-content:center}.clink{font-family:var(--serif);font-weight:300;line-height:1.1;font-size:clamp(2rem,7vw,5.5rem);position:relative;display:inline-block}.clink:after{content:"";position:absolute;left:0;bottom:6px;width:0;height:1px;background:var(--bone);transition:width .6s cubic-bezier(.16,1,.3,1)}.clink:hover:after{width:100%}.meta-row{display:flex;flex-wrap:wrap;gap:clamp(20px,5vw,80px)}.nav .wordmark{cursor:pointer}.burger{display:none;flex-direction:column;gap:6px;background:none;border:0;cursor:pointer;padding:6px;z-index:11}.burger span{display:block;width:26px;height:1px;background:var(--bone);transition:transform .4s cubic-bezier(.16,1,.3,1),opacity .3s}.burger.on span:first-child{transform:translateY(3.5px) rotate(45deg)}.burger.on span:last-child{transform:translateY(-3.5px) rotate(-45deg)}.m-menu{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10;background:var(--noir);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .5s ease,visibility .5s}.m-menu.open{opacity:1;visibility:visible}.m-list{display:flex;flex-direction:column;gap:clamp(14px,3vh,28px);padding:var(--pad)}.m-list a{font-family:var(--serif);font-weight:300;font-size:clamp(2.4rem,12vw,4rem);line-height:1;display:flex;align-items:baseline;gap:18px;opacity:0;transform:translateY(20px);transition:opacity .6s cubic-bezier(.16,1,.3,1),transform .6s cubic-bezier(.16,1,.3,1)}.m-menu.open .m-list a{opacity:1;transform:none}.m-list a .index{font-size:12px}@media (max-width: 720px){.burger{display:flex}.gallery .pin{height:auto;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;padding:18vh 0 10vh}.gallery .pin::-webkit-scrollbar{display:none}.gallery .track{transform:none!important;gap:16px}.gallery .card{flex:0 0 80vw;height:56vh;scroll-snap-align:center}.gallery .head{position:absolute}.atmo{height:160vh}.hero .display{font-size:clamp(3rem,15vw,5rem)}}@media (max-height: 680px) and (min-width: 721px){.hero .display{font-size:clamp(3rem,8vw,7rem)}}.skills{position:relative;min-height:100vh;padding:var(--pad);display:flex;flex-direction:column;justify-content:center}.skills-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,4vw,72px);max-width:min(64vw,860px)}.skill-col ul{list-style:none}.skill-col li{font-family:var(--serif);font-weight:300;font-size:clamp(1.05rem,1.6vw,1.35rem);line-height:1.9;color:var(--bone);display:flex;align-items:center;gap:11px}.skill-col li .glyph{width:16px;height:16px;color:var(--ash)}.skill-col li .glyph-fallback{width:8px;height:8px;margin:0 4px}.exp{position:relative;min-height:100vh;padding:var(--pad);display:flex;flex-direction:column;justify-content:center}.exp-list{display:flex;flex-direction:column;max-width:min(72vw,980px)}.exp-row{display:grid;grid-template-columns:48px 1.4fr 1fr auto;gap:clamp(12px,3vw,40px);align-items:baseline;padding:clamp(16px,2.4vw,28px) 0;border-top:1px solid var(--hair);transition:padding-left .5s cubic-bezier(.16,1,.3,1)}.exp-row:last-child{border-bottom:1px solid var(--hair)}.exp-row:hover{padding-left:14px}.exp-row .role{font-family:var(--serif);font-weight:300;font-size:clamp(1.4rem,2.6vw,2.1rem);line-height:1}.exp-row:hover .role{font-style:italic}.exp-row .company{font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:var(--ash);text-transform:uppercase}.exp-row .period{font-family:var(--mono);font-size:12px;color:var(--ghost)}.exp-row .desc{grid-column:2 / -1;margin-top:2px;font-family:var(--serif);font-weight:400;font-size:clamp(.98rem,1.3vw,1.1rem);line-height:1.5;color:var(--ash);max-width:64ch}.foot-meta{display:flex;flex-wrap:wrap;gap:clamp(24px,5vw,72px);margin-top:clamp(40px,7vh,80px)}.foot-bottom{margin-top:clamp(32px,6vh,64px);display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:24px}.meta-col .label{display:block;margin-bottom:10px}.meta-col .val{font-family:var(--mono);font-weight:400;font-size:.95rem;letter-spacing:.02em;color:var(--bone)}@media (max-width: 720px){.skills-grid{grid-template-columns:1fr;gap:clamp(20px,5vh,36px);max-width:none}.exp-list{max-width:none}.exp-row{grid-template-columns:30px 1fr;row-gap:6px}.exp-row .company{grid-column:2}.exp-row .period{grid-column:1;grid-row:1;align-self:center;color:var(--ash)}.exp-row .desc{grid-column:1 / -1}}.foot-link{color:var(--bone);transition:opacity .4s;display:inline-flex;align-items:center;gap:8px}.foot-ico{width:15px;height:15px;flex:none}.foot-link:hover{opacity:.55}.meta-col a.val{transition:opacity .4s}.meta-col a.val:hover{opacity:.6}:focus-visible{outline:1px solid var(--bone);outline-offset:3px;border-radius:1px}@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}.reveal{opacity:1!important;transform:none!important;transition:none!important}.hint .line:after{animation:none}.m-list a{transition:none}.gallery .pin{height:auto;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;padding:12vh 0}.gallery .track{transform:none!important}.gallery .card{scroll-snap-align:center}}
