:root{--bg:#0f0e24;--text:#e8f0ff;--font-body:"Outfit", sans-serif;--font-hand:"Caveat", cursive;--font-display:"Bricolage Grotesque", sans-serif;--font-title:var(--font-display);--blue:#6aa9ff;--section-pad:clamp(32px, 6vh, 64px);--section-gap:clamp(24px, 4vh, 40px)}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:var(--font-body)}.page{min-height:100vh}html{scroll-behavior:smooth}.reveal{opacity:0;filter:blur(6px);transition:opacity .9s cubic-bezier(.22,1,.36,1),transform .9s cubic-bezier(.22,1,.36,1),filter .9s cubic-bezier(.22,1,.36,1);transition-delay:var(--d,0s);transform:translateY(32px)}.reveal.in{opacity:1;filter:none;transform:none}@media (prefers-reduced-motion:reduce){.reveal{opacity:1;filter:none;transition:none;transform:none}}.page-section{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:24px;min-height:100vh;padding:0 5vw;display:flex}.topbar{z-index:100;border-bottom:1px solid #ffffff38;justify-content:space-between;align-items:center;padding:12px 5vw;transition:background .3s;display:flex;position:fixed;top:0;left:0;right:0}.topbar.scrolled{-webkit-backdrop-filter:blur(12px);background:#0f0e2499}.topbar-left{align-items:center;gap:18px;display:flex}.topbar-mascot{all:unset;box-sizing:border-box;cursor:pointer;color:#e8f0ffb3;font-family:var(--font-body);background:#ffffff0a;border:1px solid #ffffff1f;border-radius:999px;align-items:center;gap:10px;padding:8px 14px;font-size:13px;display:flex}.topbar-switch{background:#ffffff2e;border-radius:999px;width:30px;height:16px;transition:background .25s;position:relative}.topbar-switch-knob{background:#fff;border-radius:50%;width:12px;height:12px;transition:transform .25s;position:absolute;top:2px;left:2px}.topbar-mascot.on .topbar-switch{background:var(--blue)}.topbar-mascot.on .topbar-switch-knob{transform:translate(14px)}.topbar-socials{align-items:center;gap:16px;display:flex}.topbar-socials a{color:#e8f0ffd9;font-size:22px;transition:color .25s,transform .25s;display:flex}.topbar-socials a:hover{color:var(--blue);transform:translateY(-2px)}.topbar-socials a:focus-visible,.topbar-mascot:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:4px}.navbar{-webkit-backdrop-filter:blur(12px);background:#ffffff0a;border:1px solid #ffffff14;border-radius:10px;gap:4px;padding:6px;transition:background .3s;display:flex}.navbar.scrolled{background:#ffffff12}.navbar a{color:#ffffffa6;letter-spacing:.3px;border-radius:6px;padding:8px 16px;font-size:15px;text-decoration:none;transition:color .25s}.navbar a.active{color:var(--blue)}.navbar a:hover{color:#fff}.navbar a:focus-visible{outline-offset:2px;outline:2px solid #fff9}@media (width<=700px){.topbar{flex-direction:column;gap:8px;padding:10px 4vw}}@media (width<=500px){.navbar a{padding:8px;font-size:13px}}.hero{justify-content:center;align-items:center;min-height:100vh;padding:0 5vw;display:flex}.hero-content{text-align:center;flex-direction:column;align-items:center;gap:24px;width:min(620px,100%);display:flex}.hero-title{font-family:var(--font-title);letter-spacing:-.03em;font-size:clamp(40px,5vw,68px);font-weight:500;line-height:1.05}.flip-button{perspective:500px;width:140px;height:44px;color:var(--text);border-radius:10px;text-decoration:none;display:block}.flip-face{backface-visibility:hidden;font-family:var(--font-body);border-radius:10px;justify-content:center;align-items:center;gap:6px;font-size:15px;font-weight:500;display:flex;position:absolute;inset:0}.flip-front{background:#07061a;border:1px solid #6aa9ff59;transform:translateZ(22px)}.flip-back{background:var(--blue);color:#07061a;transform:rotateX(-90deg)translateZ(22px);box-shadow:0 0 20px #6aa9ff80}.flip-inner{width:100%;height:100%;transform-style:preserve-3d;transition:transform .65s cubic-bezier(.34,1.56,.64,1);display:block;position:relative}.flip-button:hover .flip-inner,.flip-button:focus-visible .flip-inner{transform:rotateX(90deg)}.flip-button:focus-visible{outline:2px solid var(--blue);outline-offset:4px}@media (hover:none){.flip-button:hover .flip-inner{transform:none}}@media (prefers-reduced-motion:reduce){.flip-inner,.flip-button:hover .flip-inner,.flip-button:focus-visible .flip-inner{transition:none;transform:none}.flip-front,.flip-back{backface-visibility:visible;transition:opacity .15s;transform:none}.flip-back{opacity:0}.flip-button:hover .flip-back,.flip-button:focus-visible .flip-back{opacity:1}.flip-button:hover .flip-front,.flip-button:focus-visible .flip-front{opacity:0}}.hero-name{color:var(--blue);animation:4s ease-in-out 1.6s infinite namePulse}.hero-letter{opacity:0;animation:.7s cubic-bezier(.22,1,.36,1) both letterIn;animation-delay:calc(.25s + var(--i) * 45ms);display:inline-block}.hero-rise{animation:.9s cubic-bezier(.22,1,.36,1) both riseIn;animation-delay:var(--d,0s)}@keyframes letterIn{0%{opacity:0;filter:blur(8px);transform:translateY(.55em)}to{opacity:1;filter:blur();transform:none}}@keyframes riseIn{0%{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}@keyframes namePulse{0%,to{text-shadow:0 0 #6aa9ff00}50%{text-shadow:0 0 28px #6aa9ff8c}}@media (prefers-reduced-motion:reduce){.hero-letter,.hero-rise,.hero-name{opacity:1;animation:none}}.hero-text{color:#e8f0ffb3;font-size:18px;font-weight:300;line-height:1.7}.hero-button{font-family:var(--font-hand);color:var(--text);background:#6aa9ff1f;border:1px solid #6aa9ff59;border-radius:10px;padding:12px 28px;font-size:24px;text-decoration:none;transition:background .25s,box-shadow .25s}.hero-button:hover{background:#6aa9ff38;box-shadow:0 0 24px #6aa9ff59}.hero-button:focus-visible{outline:2px solid var(--blue);outline-offset:3px}.hero-scene{pointer-events:none;width:min(46vw,620px);position:absolute;top:50%;left:5vw;transform:translateY(-50%)}@media (width<=700px){.hero-scene{opacity:.25;z-index:-1;width:100%;left:0}}.bg{z-index:0;pointer-events:none;position:fixed;inset:0;overflow:hidden}.glow{will-change:transform;border-radius:50%;position:absolute}.glow-a{background:radial-gradient(circle,#2f5bff57,#0000 65%);width:70vw;height:70vw;animation:32s ease-in-out infinite alternate driftA;top:-25vw;left:-20vw}.glow-b{background:radial-gradient(circle,#6aa9ff3d,#0000 65%);width:60vw;height:60vw;animation:38s ease-in-out infinite alternate driftB;bottom:-25vw;right:-20vw}.glow-c{background:radial-gradient(circle,#5b3df533,#0000 65%);width:45vw;height:45vw;animation:44s ease-in-out infinite alternate driftC;top:30vh;left:25vw}@keyframes driftA{to{transform:translate(8vw,6vh)scale(1.1)}}@keyframes driftB{to{transform:translate(-7vw,-8vh)scale(1.08)}}@keyframes driftC{to{transform:translate(6vw,-6vh)scale(1.15)}}.bg-stars{width:100%;height:100%;position:absolute;inset:0}.grain{opacity:.07;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");position:absolute;inset:0}@media (prefers-reduced-motion:reduce){.glow{animation:none}}.about{align-items:center;gap:var(--section-gap);padding:var(--section-pad) 8vw;flex-direction:column;display:flex}.about-title{font-family:var(--font-title);letter-spacing:-.03em;text-align:center;font-size:clamp(36px,5vw,72px);font-weight:500}.about-title span{color:var(--blue)}.about-layout{grid-template-columns:1fr 1fr;align-items:start;gap:56px;width:100%;max-width:1100px;display:grid}.about-text{flex-direction:column;gap:20px;display:flex}.about-text p{color:#e8f0ffb3;max-width:520px;font-size:18px;font-weight:300;line-height:1.7}.about-stack{flex-direction:column;gap:20px;display:flex}.about-stack-label{color:#e8f0ffb3;font-size:18px;font-weight:300;line-height:1.7}.stack-grid{grid-template-columns:repeat(2,minmax(140px,1fr));gap:10px 24px;list-style:none;display:grid}.stack-item{color:#e8f0ffb3;padding-left:20px;font-size:15px;position:relative}.stack-item:before{content:"▹";color:var(--blue);position:absolute;left:0}@media (width<=800px){.about-layout{grid-template-columns:1fr;gap:40px}}.projects{position:relative}.projects-sticky{justify-content:space-between;align-items:center;gap:40px;height:100vh;padding:0 8vw;display:flex;position:sticky;top:0;overflow:hidden}.projects-info{flex-direction:column;gap:12px;display:flex}.projects-label{font-family:var(--font-title);letter-spacing:-.03em;color:var(--text);margin-bottom:28px;font-size:clamp(32px,4.5vw,60px);font-weight:500;line-height:1.05}.projects-label span{color:var(--blue)}.projects-count{letter-spacing:.12em;color:var(--blue);font-size:14px}.projects-name{font-family:var(--font-title);letter-spacing:-.02em;font-size:clamp(24px,2.8vw,38px);font-weight:500;line-height:1.1}.projects-desc{color:#e8f0ffbf;max-width:420px;font-size:17px;font-weight:300;line-height:1.6}.projects-points{flex-direction:column;gap:8px;max-width:440px;list-style:none;display:flex}.projects-points li{color:#e8f0ffa6;padding-left:20px;font-size:15px;font-weight:300;line-height:1.55;position:relative}.projects-points li:before{content:"▹";color:var(--blue);position:absolute;left:0}.projects-stack{color:#e8f0ff8c;font-size:18px}.projects-links{gap:16px;margin-top:4px;display:flex}.projects-links a{color:#e8f0ffb3;font-size:22px;transition:color .25s,transform .25s;display:flex}.projects-links a:hover{color:var(--blue);transform:translateY(-2px)}.wheel{aspect-ratio:16/10;flex-shrink:0;width:min(560px,48vw,88vh);position:relative}.wheel-card{border:1px solid #ffffff1a;border-radius:18px;transition:transform .6s cubic-bezier(.22,1,.36,1),opacity .6s;position:absolute;inset:0;overflow:hidden;box-shadow:0 20px 50px #00000059}.wheel-card img{object-fit:cover;width:100%;height:100%}.wheel-card:after{content:"";pointer-events:none;background:linear-gradient(#0000 55%,#050a19bf);position:absolute;inset:0}.wheel-card-title{z-index:1;font-family:var(--font-title);font-size:20px;position:absolute;bottom:24px;left:28px}.wheel-dots{flex-direction:column;gap:10px;display:flex;position:absolute;top:50%;right:2.5vw;transform:translateY(-50%)}.dot{background:#ffffff40;border-radius:50%;width:5px;height:5px;transition:background .3s,transform .3s}.dot.on{background:var(--blue);transform:scale(1.5)}@media (width<=700px){.projects-sticky{flex-direction:column;justify-content:center;gap:24px;padding:80px 6vw 32px}.projects-label{margin-bottom:8px}.projects-desc{font-size:16px}.wheel{width:min(100%,60vh)}.wheel-dots{display:none}}@media (prefers-reduced-motion:reduce){.wheel-card{transition:none}}.creative{padding:var(--section-pad) 8vw;align-items:center;gap:var(--section-gap);flex-direction:column;display:flex}.creative-title{font-family:var(--font-title);letter-spacing:-.03em;text-align:center;font-size:clamp(32px,4.5vw,60px);font-weight:500}.creative-title span{color:var(--blue)}.creative-layout{grid-template-columns:1.3fr 1fr;align-items:center;gap:48px;width:100%;max-width:1100px;display:grid}.blog-box{-webkit-backdrop-filter:blur(12px);background:#ffffff08;border:1px solid #ffffff14;border-radius:18px;padding:8px 28px}.blog-head{font-family:var(--font-title);justify-content:space-between;align-items:center;padding:18px 0;font-size:18px;font-weight:600;display:flex}.blog-head a{font-family:var(--font-body);color:var(--blue);align-items:center;gap:6px;font-size:14px;font-weight:400;text-decoration:none;display:flex}.blog-head a:hover{text-decoration:underline}.blog-list{margin:0;padding:0;list-style:none}.blog-list li{border-top:1px solid #ffffff14}.blog-list a{color:var(--text);grid-template-columns:auto auto 1fr auto;align-items:center;gap:14px;padding:20px 0;text-decoration:none;display:grid}.blog-icon{color:#e8f0ff66}.blog-date{color:#e8f0ff73;white-space:nowrap;font-size:14px}.blog-name{font-size:17px;transition:color .25s}.blog-arrow{color:#e8f0ff66;transition:transform .25s,color .25s}.blog-list a:hover .blog-name,.blog-list a:focus-visible .blog-name{color:var(--blue)}.blog-list a:hover .blog-arrow,.blog-list a:focus-visible .blog-arrow{color:var(--blue);transform:translate(3px,-3px)}.blog-list a:focus-visible{outline:2px solid var(--blue);outline-offset:2px}.creative-text{flex-direction:column;gap:18px;display:flex}.creative-text p{color:#e8f0ffb3;font-size:18px;font-weight:300;line-height:1.7}.creative-text a{color:#e8f0ff;text-underline-offset:4px;text-decoration:underline}@media (width<=800px){.creative-layout{grid-template-columns:1fr}.blog-list a{grid-template-columns:auto 1fr auto;row-gap:4px}.blog-date{grid-area:1/2}.blog-name{grid-area:2/2}.blog-icon{grid-row:1/span 2}.blog-arrow{grid-area:1/3/span 2}}@media (prefers-reduced-motion:reduce){.blog-arrow,.blog-name{transition:none}}.contact{padding:var(--section-pad) 8vw;grid-template-columns:1.2fr 1fr;align-items:center;gap:56px;max-width:1200px;margin:0 auto;display:grid}.contact-left{flex-direction:column;align-items:flex-start;gap:18px;min-width:0;display:flex}.contact-title{font-family:var(--font-display);letter-spacing:-.03em;font-size:clamp(36px,5vw,68px);font-weight:600}.contact-title span{color:var(--blue)}.contact-text{color:#e8f0ffb3;max-width:420px;font-size:18px;font-weight:300;line-height:1.7}.contact-label{color:#e8f0ff8c;align-items:center;gap:14px;margin-top:18px;font-size:16px;font-weight:300;display:flex}.contact-dash{background:linear-gradient(90deg, var(--blue), transparent);transform-origin:0;width:48px;height:1px;animation:2.4s ease-in-out infinite dash;display:inline-block}@keyframes dash{0%{opacity:.4;transform:scaleX(.15)}60%{opacity:1;transform:scaleX(1)}to{opacity:.4;transform:scaleX(.15)}}.contact-email{all:unset;box-sizing:border-box;cursor:pointer;max-width:100%;font-family:var(--font-body);letter-spacing:.01em;overflow-wrap:anywhere;background:#ffffff0a;border:1px solid #ffffff1a;border-radius:12px;padding:12px 20px;font-size:clamp(15px,1.5vw,19px);font-weight:500;line-height:1.3;transition:border-color .25s,background .25s;display:inline-block}.contact-email:hover{background:#6aa9ff12;border-color:#6aa9ff73}.contact-email:focus-visible{outline:2px solid var(--blue);outline-offset:6px;border-radius:10px}.contact-letter{--p:0;white-space:pre;color:color-mix(in srgb, var(--blue) calc(var(--p) * 100%), var(--text));transform:translateY(calc(var(--p) * -4px)) scale(calc(1 + var(--p) * .12));text-shadow:0 0 calc(var(--p) * 14px) var(--blue);transition:color .15s,transform .15s,text-shadow .15s;display:inline-block}.contact-hint{color:#e8f0ff80;min-height:1.5em;font-size:14px}.contact-hint a{color:var(--blue);text-decoration:none}.contact-hint a:hover{text-decoration:underline}.contact-copied{color:var(--blue)}.contact-sky{width:100%;height:auto;overflow:visible}.contact-line{fill:none;stroke:#a0beff4d;stroke-width:1px;stroke-dasharray:3 6}.dust{fill:#c8dcff99;animation:4s ease-in-out infinite twinkle}.contact-star{cursor:pointer;outline:none}.contact-star .halo{fill:var(--blue);opacity:0;transition:opacity .3s}.contact-star .core{fill:#fff;animation:3s ease-in-out infinite twinkle}.contact-star text{fill:#e8f0ff99;font-size:15px;font-family:var(--font-body);transition:fill .25s}.contact-star:hover .halo,.contact-star:focus-visible .halo{opacity:.35}.contact-star:hover text,.contact-star:focus-visible text{fill:var(--blue)}@keyframes twinkle{0%,to{opacity:1}50%{opacity:.3}}@media (width<=800px){.contact{grid-template-columns:1fr;gap:40px}.contact-sky{max-width:380px;margin:0 auto}}@media (prefers-reduced-motion:reduce){.contact-dash,.contact-star .core,.dust{animation:none}.contact-letter{transition:none}}.footer{text-align:center;color:#e8f0ff73;border-top:1px solid #ffffff14;flex-direction:column;align-items:center;gap:6px;max-width:1200px;margin:0 auto;padding:28px 8vw 36px;font-size:14px;display:flex}.footer p{margin:0}.footer a{color:#e8f0ff8c;text-decoration:none;transition:color .25s}.footer a:hover,.footer a:focus-visible{color:var(--blue)}@media (width<=600px){.footer{text-align:center;flex-direction:column}}@media (prefers-reduced-motion:reduce){.footer a{transition:none}}.blip{z-index:50;cursor:pointer;will-change:transform;background:0 0;border:0;width:64px;height:64px;padding:0;position:absolute;top:0;left:0}.blip-sprite{width:100%;height:100%;image-rendering:pixelated;-webkit-user-select:none;user-select:none;pointer-events:none;background-repeat:no-repeat;background-size:256px 384px;display:block}
