@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600&display=swap");:root{--space-xs:5px;--space-sm:10px;--space-md:20px;--space-lg:30px;--space-xl:40px;--space-2xl:50px;--switch-width:80px;--switch-height:40px;--switch-radius:20px;--flicker-size:30px;--flicker-radius:15px;--moon-size:20px;--moon-radius:10px;--wave-height-small:100px;--wave-height-medium:120px;--cube-html-left:6vw;--cube-html-bottom:6vh;--cube-css-left:10vw;--cube-css-bottom:15vh;--cube-js-left:20vw;--cube-js-bottom:11vh;--cube-react-left:18vw;--cube-react-bottom:3vh}body{transition:.3s;margin:0;padding:0;background-color:#f4f1f1;font-family:Poppins,sans-serif;font-weight:500;color:#080808;font-size:clamp(16px,2vw,26px)}h1{line-height:70px;font-weight:600;margin:var(--space-sm) 0;text-shadow:0 2px 8px rgba(0,0,0,.15)}h2{line-height:40px;font-weight:300;margin:var(--space-2xl) 0 var(--space-sm) 0}p{margin:0;text-shadow:0 1px 3px rgba(0,0,0,.08)}a{color:#a200ff;text-decoration:none;font-weight:100}.dark a{color:#f6a9f1}header{display:flex;justify-content:flex-end;padding:var(--space-lg)}.switch{width:var(--switch-width);height:var(--switch-height);border-radius:var(--switch-radius);background-color:#272626;position:relative;z-index:6}.flicker{width:var(--flicker-size);height:var(--flicker-size);border-radius:var(--flicker-radius);background-color:#fff;position:absolute;top:var(--space-xs);left:var(--space-xs);transition:.3s;box-shadow:inset 4px 4px 4px #fff,inset -4px -4px 4px hsla(264,4%,77%,.9)}.dark{background-color:#393939;transition:.3s}.moon{width:20px;height:20px;border-radius:10px;box-shadow:4px 4px 0 0 #fff;position:absolute;top:5px;left:45px}.dark .flicker{transform:translateX(40px)}.dark>*{color:#fff}.main{min-height:80vh;display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin-bottom:2rem}.main,.main-text{padding:30px;position:relative}.main-text{max-width:35rem;z-index:10;transform:translateZ(0)}.square{width:98%;margin:1%;background-color:#fff;text-align:center;display:flex;flex-direction:column;align-items:center;border-radius:15px;position:relative;box-shadow:4px 4px 5px 3px rgba(0,0,0,.58)}.square img{max-width:100%}.square p{margin-bottom:15px;padding:0 .3rem}.dark .square{background-color:#474747;box-shadow:4px 4px 5px 3px hsla(0,1%,58%,.58)}.sub-section{display:flex;flex-wrap:wrap;position:relative;z-index:5}.hero-image{position:relative;width:50%;height:350px;display:block;margin-bottom:100px;z-index:1}.cube{position:absolute;width:5vw;height:5vw;transform:rotate(-25deg) skew(25deg)}.cube:before{width:21px;height:100%;transform:skewY(-45deg);left:-20px;bottom:-10px}.cube:after,.cube:before{position:absolute;content:""}.cube:after{width:100%;height:21px;transform:skewX(-45deg);left:-10px;bottom:-20px}#html{left:93px;bottom:104px;background-image:url(/images/html-square.png);background-size:cover;background-color:#af77e3;box-shadow:-60px 60px 20px rgb(50 50 50/15%)}#html:before{background-color:#bd9add}#html:after{background-color:#cdbcdd}#css{left:166px;bottom:236px;background-image:url(/images/css-square.png);background-size:cover;background-color:#e377bf;box-shadow:-100px 100px 20px rgb(50 50 50/15%)}#css:before{background-color:#dd9acf}#css:after{background-color:#ddbcd3}#javascript{left:338px;bottom:177px;background-image:url(/images/javascript-square.png);background-size:cover;background-color:#77e3ba;box-shadow:-40px 40px 20px rgb(50 50 50/15%)}#javascript:before{background-color:#9addca}#javascript:after{background-color:#bcddd4}#react{left:295px;bottom:40px;background-image:url(/images/react-square.png);background-size:cover;background-color:#77c1e3;box-shadow:-80px 80px 20px rgb(50 50 50/15%)}#react:before{background-color:#9abddd}#react:after{background-color:#bcc8dd}footer{display:flex;justify-content:center;padding:20px 30px;background-color:#86377b;background-image:linear-gradient(0deg,#86377b 20%,#d1d1db 80%)}.dark footer{background-color:#1c1c1c;background-image:none}.contact-icons{display:flex;gap:1rem}.icon-link{transition:transform .3s ease-in-out}.icon-link:hover{transform:scale(1.2)}.icon{transition:filter .3s ease-in-out}.icon:hover{filter:brightness(1.2)}.image-container{position:relative;width:100%;height:100%;border-radius:15px}@keyframes move_wave{0%{transform:translateX(0) translateZ(0) scaleY(1)}50%{transform:translateX(-25%) translateZ(0) scaleY(.55)}to{transform:translateX(-50%) translateZ(0) scaleY(1)}}.waveWrapper{left:0;right:0;bottom:0;top:0;margin:auto;z-index:-10}.waveWrapper,.waveWrapperInner{overflow:hidden;position:absolute}.waveWrapperInner{width:100%;height:100%;bottom:-1px;background-color:#86377b;background-image:linear-gradient(0deg,#86377b 20%,#d1d1db 80%)}.bgTop{z-index:3;opacity:.5}.bgMiddle{z-index:2;opacity:.75}.bgBottom{z-index:1}.wave{position:absolute;left:0;width:200%;height:100%;background-repeat:repeat-x;background-position:0 bottom;transform-origin:center bottom}.waveTop{background-size:50% var(--wave-height-small)}.waveAnimation .waveTop{animation:move_wave 3s;-webkit-animation:move_wave 3s;animation-delay:1s}.waveMiddle{background-size:50% var(--wave-height-medium)}.waveAnimation .waveMiddle{animation:move_wave 10s linear infinite}.waveBottom{background-size:50% var(--wave-height-small)}.waveAnimation .waveBottom{animation:move_wave 15s linear infinite}.main-image{z-index:6;position:relative;flex-shrink:0}.animated-border{position:relative;background-color:#3023ae;background-image:linear-gradient(45deg,#3023ae,#f09);box-shadow:0 0 200px 0 rgba(71,75,201,.7),0 0 50px 0 rgba(48,35,174,.7);animation:morpheus 10s linear infinite}@keyframes morpheus{0%{border-radius:30% 70% 70% 30%/30% 30% 70% 70%}20%{border-radius:60% 40% 40% 60%/60% 25% 75% 40%}40%{border-radius:70% 30% 65% 35%/80% 45% 55% 20%}60%{border-radius:30% 70% 70% 30%/20% 30% 70% 80%}80%{border-radius:40% 60% 40% 60%/70% 55% 45% 30%}to{border-radius:30% 70% 70% 30%/30% 30% 70% 70%}}.project-links{right:-1.5%;top:5%;display:flex;gap:2rem;z-index:99}.project-icon{transition:transform .3s,filter .3s;filter:grayscale(100%)}.project-icon:hover{transform:scale(1.2);filter:grayscale(0)}.responsive-image{width:100%;max-width:600px}@media only screen and (max-width:550px){.main{flex-direction:column;padding:0;justify-content:flex-start}.project-links{position:relative;padding-bottom:.8rem}}@media only screen and (min-width:970px){.main-text{width:50%}.square{width:48%;margin:1%;height:600px}}@media only screen and (max-width:970px){.square{position:relative;margin:1rem}.square h2{margin:10px}.square:before{content:"";position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;background-color:#3023ae;background:linear-gradient(120deg,#3023ae,#aedcf3);z-index:-1;background-size:200%;transition:.5s;border-radius:15px;animation:animate 5s linear infinite}@keyframes animate{0%{background-position:100%}to{background-position:0}}}@media only screen and (max-width:1300px){.hero-image{display:none}}