*{margin:0;padding:0;box-sizing:border-box;color:#fff}.webgl{position:fixed;top:var(--webGlMargin);right:var(--webGlMargin);z-index:7;cursor:grab}html,body{margin:0;padding:0;overflow-x:hidden}body{margin:0;max-width:100%;height:auto;background-color:#000;font-family:Roboto Mono;scrollbar-width:thin;scrollbar-color:transparent transparent}::-webkit-scrollbar{width:0px}::-webkit-scrollbar-thumb{background-color:transparent}.scrollme{position:absolute;z-index:2;font-size:1rem}.grid>div>div{margin:0;background-color:transparent;padding:30px;height:100%;width:100%}#fixedHeaderBg{position:fixed;top:0;left:0;right:0;background:#000;z-index:6}#fixedHeader{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;overflow:hidden;font:1em Sixtyfour;padding:30px 0}#fixedNavSpacer{flex-shrink:0;display:flex;align-items:center;justify-content:center}#logoLink{display:flex;cursor:pointer;text-decoration:none}#fixedHeader .navigation{padding-left:30px}#fixedMarquee{flex:1;opacity:0;overflow:hidden;position:relative}.grid{display:grid;grid-template-columns:1fr;grid-template-rows:auto auto auto auto;height:auto;margin:0;background:transparent;padding-top:var(--fixed-header-height, 0px)}.page{display:grid;min-height:100vh;max-height:auto;align-items:center;grid-template-columns:1fr 8fr 1fr;grid-template-rows:auto 1fr;row-gap:1px;column-gap:0}.page.hero{min-height:calc(100vh - var(--fixed-header-height, 0px) - var(--section-marquee-height, 0px) - 5px)}.titlebar{font:1em Sixtyfour;grid-area:1 / 1 / 1 / 4;display:grid;grid-template-columns:1fr;grid-template-rows:1fr}.about .titlebar,.portfolio .titlebar,.contact .titlebar{background-color:transparent;padding:30px 0}.hero .titlebar{display:none}.portfolio .titlebar.marquee,.about .titlebar.marquee,.contact .titlebar.marquee{visibility:hidden}.hero .content{display:inline-block;padding:150px 80px}.hero .name{position:relative;left:8%;font-size:3vw}.text{font-size:1.5vw}.hero .text{display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-end;text-align:right;height:100%;opacity:0}.hero .text span{padding:5px 0}.about .content{padding:50px}.about h2{font-size:1em;margin-bottom:10px}.about .text{display:flex;flex-direction:column}.about .text span{margin-top:10px;margin-bottom:10px}.about .toolbelt{display:flex;flex-wrap:wrap;list-style:none;justify-content:space-evenly;margin-top:50px;row-gap:40px}.about .toolbelt li{text-align:center;height:20px;flex:0 10cqw;margin:10px;font-size:1.2em}.cv-chain{text-decoration:none}.portfolio .content{display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%}.image-w-text{margin:30px auto;width:80%;position:relative}.image-w-text img{max-width:300px;border:2px solid white;border-radius:10px;margin:5px 0}#newsletter-canvas{display:block;float:left;margin-right:15px;width:300px;max-width:300px;height:195px;background:#000;border:2px solid white;border-radius:10px;margin-top:5px;margin-bottom:5px}.right-aligned img{float:left;margin-right:15px}.image-w-text a:after{content:"🔗";position:absolute;top:10px;right:10px;left:auto;background:#0009;color:#fff;padding:4px 6px;border-radius:6px;font-size:14px;opacity:0;transition:opacity .2s ease;pointer-events:none}.image-w-text a:hover:after{opacity:1}.image-w-text.right-aligned a:after{left:10px;right:auto}.image-w-text.left-aligned a:after{right:10px;left:auto}.left-aligned img{float:right;margin-left:15px}.left-aligned text-box{text-align:right}.contact .email{position:relative;top:45%}.contact .email span{font-size:3cqw}.contact .email h1{font-size:4cqw}.top-left{grid-area:1 / 1 / 1 / 1}.top-middle{grid-area:1 / 2 / 1 / 2}.top-right{grid-area:1 / 3 / 1 / 3}.content{grid-area:2 / 2 / 2 / 2;position:relative;z-index:5}.navigation{display:flex;justify-self:left;font-size:1em;width:300}button{padding-right:30px;font:1em Roboto Mono;background-color:transparent;border:none;cursor:pointer}.marquee{display:flex;overflow-x:hidden;gap:1rem;position:relative;-webkit-user-select:none;user-select:none;z-index:2;-webkit-mask-image:linear-gradient(to right,transparent 0%,black 15%,black 85%,transparent 100%);mask-image:linear-gradient(to right,transparent 0%,black 15%,black 85%,transparent 100%)}.marquee:before{left:0;right:90%}.marquee-content{flex-shrink:0;display:flex;justify-content:space-around;min-width:100%;gap:1rem}.scroll{animation:scroll 20s linear infinite}@keyframes scroll{0%{transform:translate(0)}to{transform:translate(calc(-100% - 1rem))}}.lineThroughSphere{position:absolute;z-index:6;width:100%;border-top:5px solid white}.rollingEffect{display:inline-block;animation:roll 3s infinite}@keyframes roll{0%,20%{transform:translateY(0)}40%,60%{transform:translateY(-100%)}80%,to{transform:translateY(0)}}.swipe-left-animation{opacity:0;transform:translate(-25%);transition:opacity 1s,transform 1s}.animation-visible{opacity:1;transform:translate(0);transform:translateY(0)}.card-animate{opacity:0;transform:translateY(40px);transition:opacity .6s ease,transform .6s ease}.card-visible{opacity:1;transform:translateY(0)}.contact .email-icon{vertical-align:middle;width:1em;height:1em;margin-right:.35em;fill:currentColor}.contact-distort{opacity:0;filter:blur(12px);transform:scale(.92) skew(-4deg);transition:opacity .7s ease,filter .7s ease,transform .7s ease}.contact-distort-visible{opacity:1;filter:blur(0px);transform:scale(1) skew(0)}.tool-animate{opacity:0}@keyframes tool-flicker{0%{opacity:0;text-shadow:none}8%{opacity:.9;text-shadow:0 0 10px white}13%{opacity:0;text-shadow:none}22%{opacity:1;text-shadow:0 0 14px white}28%{opacity:.3;text-shadow:none}38%{opacity:1;text-shadow:0 0 6px white}to{opacity:1;text-shadow:none}}.tool-animate.tool-visible.tool-flicker{animation:tool-flicker .9s ease forwards}@keyframes tool-chroma{0%{opacity:0;text-shadow:-7px 0 0 #ff2020,7px 0 0 #00e5ff}55%{opacity:.8;text-shadow:-4px 0 0 #ff2020,4px 0 0 #00e5ff}82%{opacity:1;text-shadow:-1px 0 0 #ff2020,1px 0 0 #00e5ff}96%{text-shadow:0px 0 0 #ff2020,0px 0 0 #00e5ff}to{opacity:1;text-shadow:none}}.tool-animate.tool-visible.tool-chroma{animation:tool-chroma .65s ease forwards}@keyframes tool-stamp{0%{opacity:0;transform:scale(1.7);text-shadow:none}65%{opacity:1;transform:scale(.92);text-shadow:0 0 28px rgba(255,255,255,.95)}80%{transform:scale(1.05);text-shadow:0 0 8px rgba(255,255,255,.3)}to{opacity:1;transform:scale(1);text-shadow:none}}.tool-animate.tool-visible.tool-stamp{animation:tool-stamp .5s cubic-bezier(.22,1,.36,1) forwards}@media (max-width: 768px){.content{min-width:0;overflow-wrap:break-word;word-break:break-word}text-box{display:block}.hero{align-items:stretch}.hero .content{display:flex;flex-direction:column;justify-content:space-between;align-self:stretch;padding:40px 20px 50px}#rollingHeroText{font-size:clamp(1rem,5vw,1.4rem);margin-bottom:8px}.hero .name{font-size:clamp(2rem,11vw,3.5rem);left:0;line-height:1.1}.hero .text{height:auto;align-items:flex-start;text-align:left;margin-top:0}.hero .text span{padding:3px 0}.text{font-size:clamp(.875rem,3.5vw,1.2rem)}button{padding-right:15px;font-size:.82em}.image-w-text{width:95%}.image-w-text img{float:none;max-width:100%;width:100%;margin:0 0 12px}#newsletter-canvas{width:100%;max-width:100%;height:220px}.left-aligned text-box{text-align:left}.about .content{padding:30px 20px}.about .toolbelt li{flex:0 0 auto}.contact .content{display:flex;flex-direction:column;justify-content:center;gap:2rem;padding:40px 20px}.contact .email{position:static;top:auto}.contact .email h1{font-size:clamp(.85rem,4vw,1.5rem);overflow-wrap:anywhere}}
