:root{--bg:#1b1917;--ink:#f4efe7;--muted:#a79e92;--line:#f4efe724;--accent:#f98307;--font-display:"Fraunces Variable",Georgia,serif;--font-serif:"Fraunces Variable",Georgia,serif;--font-body:"Manrope Variable",system-ui,sans-serif}.hero{background:#3a3937;height:100svh;min-height:560px;position:relative;overflow:hidden}.layer{will-change:transform;position:absolute;inset:7svh 0 -7svh}.layer.sky{top:0;bottom:-14svh}.layer img{object-fit:cover;object-position:62% 30%;filter:sepia(.14)contrast(1.02);width:100%;height:100%;position:absolute;inset:0}.layer.sky img{object-position:center 62%;filter:grayscale(.25)contrast(1.04);transform:scale(1.14)}.shade{pointer-events:none;background:radial-gradient(55% 40% at 88% 0%,#1b19178c 0%,#1b191747 45%,#1b191700 100%), radial-gradient(70% 75% at 12% 92%,#1b1917eb 0%,#1b191799 45%,#1b191700 100%), linear-gradient(90deg,#1b1917d1 0%,#1b191780 38%,#1b19170d 68%), linear-gradient(180deg,#1b19178c 0%,#1b191700 22%,#1b191700 70%,var(--bg) 100%);position:absolute;inset:0}.copy{left:var(--pad);right:var(--pad);z-index:3;will-change:transform;max-width:1100px;position:absolute;bottom:clamp(40px,9vh,96px)}.hello{font-family:var(--font-body);letter-spacing:0;color:var(--ink);opacity:.92;margin-bottom:8px;font-size:clamp(18px,1.35vw,23px);display:block}.hello .nm{color:var(--accent)}.h1{font-family:var(--font-display);letter-spacing:-.02em;color:var(--ink);font-size:clamp(34px,3.6vw,64px);font-weight:500;line-height:1.1}.h1 .line{margin:0 -.06em -.14em -.04em;padding:0 .06em .14em .04em;display:block;overflow:hidden}.h1 .line>span{white-space:nowrap;display:block}.h1 i{font-family:var(--font-serif);letter-spacing:-.02em;color:var(--accent);font-style:italic;font-weight:400}.bio{color:var(--ink);opacity:.86;max-width:46ch;margin-top:24px;font-size:clamp(16px,1.25vw,19px);line-height:1.5}.side{flex-direction:column;gap:12px;margin-top:40px;font-size:clamp(17px,1.25vw,21px);display:flex}.side a{width:max-content;color:var(--ink);opacity:.9;border-bottom:1px solid #f4efe766;padding-bottom:2px;transition:color .3s,border-color .3s}.side a:hover{color:var(--accent);border-color:var(--accent)}.hero-foot .cap{opacity:.75;margin-right:18px}.hero-foot{right:var(--pad);z-index:3;font-family:var(--font-body);letter-spacing:0;color:var(--muted);align-items:center;gap:10px;font-size:13px;display:flex;position:absolute;bottom:28px}.hero-foot i{background:currentColor;width:1px;height:34px;animation:1.8s cubic-bezier(.77,0,.18,1) infinite scrollline;display:block}.dev{z-index:2;background:var(--bg);padding:clamp(56px,9vh,110px) 0 0;position:relative}.dev.built{padding-top:clamp(64px,10vh,120px);padding-bottom:clamp(64px,10vh,120px)}.dev-head{padding:0 var(--pad) 28px;font-family:var(--font-body);letter-spacing:0;color:var(--ink);justify-content:space-between;align-items:baseline;font-size:15px;display:flex}.dev-head h2{font:inherit;font-weight:400}.dev-head .dim{color:var(--muted)}.tiles{padding:0 var(--pad);grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;display:grid}.tile{border:1px solid var(--line);min-height:300px;color:var(--ink);background:#f4efe705;border-radius:16px;padding:26px 24px;text-decoration:none;transition:background .5s,border-color .5s,transform .7s cubic-bezier(.22,1,.36,1);display:flex;position:relative;overflow:hidden}.tile:hover{background:#f4efe70d;border-color:#f9830773;transform:translateY(-4px)}.t-tag{text-align:center;font-family:var(--font-display);letter-spacing:-.01em;color:var(--muted);opacity:1;pointer-events:none;font-size:16px;font-weight:500;transition:opacity .35s;position:absolute;bottom:22px;left:24px;right:24px}.tile:hover .t-tag,.tile:focus-visible .t-tag{opacity:0}@media (hover:none),(width<=640px){.t-tag{display:none}}.t-num{font-family:var(--font-body);letter-spacing:.08em;color:var(--muted);z-index:1;font-size:12px;font-weight:600;position:absolute;top:16px;left:20px}.t-inner{flex-direction:column;flex:1;justify-content:center;align-items:flex-start;gap:0;display:flex}.t-mark{min-height:52px;transform:translate3d(var(--cx,0px),0,0);will-change:transform;align-items:center;gap:10px;transition:transform .85s cubic-bezier(.22,1,.36,1),filter .5s;display:flex}.t-logo{opacity:.92;filter:brightness(0)invert(.94);width:auto;max-width:100%;transition:filter .5s,opacity .5s;display:block}.tile:hover .t-logo,.tile:focus-visible .t-logo{opacity:1}.tile.amazon:hover .t-logo,.tile.meta:hover .t-logo.sym,.tile.belkin:hover .t-logo,.tile.mcafee:hover .t-logo{filter:none}.t-wm{font-family:"Space Grotesk Variable",var(--font-display);letter-spacing:-.03em;color:var(--ink);opacity:.92;font-size:27px;font-weight:600;transition:color .5s}.tile.knobsnob:hover .t-logo{filter:none}.tile.knobsnob .t-wm,.tile.knobsnob:hover .t-wm,.tile.knobsnob:focus-visible .t-wm{color:var(--ink)}.t-reveal{grid-template-rows:0fr;width:100%;transition:grid-template-rows .85s cubic-bezier(.22,1,.36,1);display:grid}.t-reveal-in{opacity:0;flex-direction:column;gap:8px;transition:opacity .55s,transform .85s cubic-bezier(.22,1,.36,1);display:flex;overflow:hidden;transform:translateY(8px)}.tile:hover .t-mark,.tile:focus-visible .t-mark{transform:translate(0,0)}.tile:hover .t-reveal,.tile:focus-visible .t-reveal{grid-template-rows:1fr}.tile:hover .t-reveal-in,.tile:focus-visible .t-reveal-in{opacity:1;transition-delay:.12s;transform:none}.t-proj{font-family:var(--font-display);letter-spacing:-.02em;color:var(--ink);margin-top:16px;font-size:23px;font-weight:500;line-height:1.14}.t-role{color:var(--muted);font-size:13px}.t-cta{color:var(--ink);align-items:center;gap:8px;margin-top:10px;font-size:14.5px;font-weight:600;transition:color .4s;display:inline-flex}.tile:hover .t-cta,.tile:focus-visible .t-cta{color:var(--accent)}.t-cta i{font-style:normal;transition:transform .5s cubic-bezier(.77,0,.18,1)}.tile:hover .t-cta i{transform:translate(3px,-3px)}.resizing .t-mark{transition:none}@media (hover:none),(width<=640px){.t-reveal{grid-template-rows:1fr}.t-reveal-in{opacity:1;transform:none}.t-mark{--cx:0px}}@media (width<=1180px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}}@media (width<=640px){.tiles{grid-template-columns:1fr}.tile{min-height:0;padding-top:58px}.t-mark{min-height:44px}}@media (width<=900px){.hero{height:calc(100svh + 220px);min-height:780px;margin-top:-220px}.h1 .line,.h1 .line>span{white-space:normal;display:inline}.h1 .line:not(:last-child)>span:after{content:" "}.layer img{object-position:14% 50%}.dev-head{flex-direction:column;align-items:flex-start;gap:8px;padding-bottom:20px}}