.details{height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center}.details-title{color:#23f7dd;border-radius:6px;width:100%;padding:4px;text-align:left}.details-title p{font-size:1.5rem;font-weight:800;margin:0}.details-text{border-radius:6px;width:100%;color:#fff}.details-text p{margin-bottom:0}.more-info{border:0;padding:10px 15px;background-color:#000;color:#23f7dd;border:1px solid rgb(35,247,221);cursor:pointer;animation:glow 1s infinite alternate;margin-top:10px;font-family:Space Grotesk,sans-serif}.project-stack-highlight{color:#000;background-color:#23f7dd;font-size:.8rem;font-weight:600;padding:.1rem .2rem;border-radius:.2rem}.project-stack-list{display:flex;flex-wrap:wrap;padding:0;gap:4px;margin:.5rem 0}.project-stack-list{display:flex;width:100%}.project-stack-list p{margin:0;text-wrap:nowrap}@keyframes glow{0%{box-shadow:0 0 #23f7dd00}25%{box-shadow:0 0 3px #23f7dd4d}50%{box-shadow:0 0 6px #23f7dd80}75%{box-shadow:0 0 9px #23f7ddb3}to{box-shadow:0 0 12px #23f7dde6}}.more-info:hover{background-color:#23f7dd;color:#000;animation:none;box-shadow:0 0 12px #23f7dde6}@media (max-width: 940px){.details-title p{font-size:1.2rem}.details-text p{font-size:.8rem}.more-info{font-size:.8rem;padding:5px 10px}.project-stack-list p{font-size:.7rem;padding:1px 5px}}@media (max-width: 800px){.details-title p{font-size:1.1rem}.details-text p{font-size:.7rem}.more-info{font-size:.7rem;padding:5px 10px}.project-stack-list p{font-size:.6rem}}@media (max-width: 620px){.details{justify-content:flex-start;padding:0 10%}.project-stack-list p{font-size:.6rem}}.modal-wrapper,.overlay{width:100vw;height:100vh;position:fixed;top:0;left:0;right:0;bottom:0}.overlay{background:#31313166}.close-button{display:flex;justify-content:flex-end;position:sticky;top:0;right:0;z-index:2}.close-button button{display:flex;align-items:center;justify-content:center;width:25px;height:25px;border-radius:50%;background-color:#23f7dd;padding:0;border:none}.close-button button span{display:flex;width:100%;height:100%;align-items:center;justify-content:center}.close-button button:hover{color:#23f7dd;background-color:#000}.modal-container{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#000;padding:14px 28px 28px;border:2px solid rgb(35,247,221);border-radius:10px;box-shadow:0 0 20px #23f7dd;height:70vh;overflow:scroll;z-index:10000}@media (max-width: 620px){.modal-container{padding:.7rem}}.project-details-rationale{text-align:justify}.tech-stack-highlight{color:#000;background-color:#23f7dd;font-size:.8rem;font-weight:600;padding:.1rem .2rem;border-radius:.2rem}.tech-stack-list li{margin-bottom:.22rem}@media (max-width: 940px){.project-details-container h1{font-size:1.7rem;margin-bottom:0}.project-details-container h2{font-size:1.3rem}.project-details-container p,.project-details-container ul,.tech-stack-highlight{font-size:.8rem}.tech-stack-highlight{padding:1px 5px}}@media (max-width: 800px){.project-details-container h1{font-size:1.5rem}.project-details-container h2{font-size:1.2rem}.project-details-container p,.project-details-container ul,.tech-stack-highlight{font-size:.7rem}}@media (max-width: 620px){.project-details-container h1{font-size:1.2rem}.project-details-container h2{font-size:1rem}.project-details-container p,.project-details-container ul,.tech-stack-highlight{font-size:.7rem}}.image-slider-container{width:100%;height:320px;overflow:hidden;position:relative}.image-slider-images{width:100%;height:100%;display:flex;overflow:hidden}.image-slider-image{object-fit:contain;width:100%;height:100%;display:block;flex-shrink:0;flex-grow:0}.image-slider-btn{all:unset;display:flex;align-items:center;justify-content:center;position:absolute;top:0;bottom:0;padding:1rem;cursor:pointer;color:#000;transition:background-color .3s ease-in-out}.image-slider-btn:hover{background-color:#0003;color:#23f7dd}.image-slider-btn.left{left:0}.image-slider-btn.left.diagrams{color:#23f7dd}.image-slider-btn.right{right:0}.image-slider-btn.right.diagrams{color:#23f7dd}.image-slider-btn.diagrams:hover{color:#000;background-color:#23f7dd}.image-slider-btn:hover>*{scale:1.2}.image-slider-icon{font-size:clamp(10px,20vw,30px)}.image-slider-dots{display:flex;align-items:center;justify-content:center;position:absolute;bottom:0;left:50%;translate:-50%;gap:.25rem;background-color:#0009;width:100%;padding:.2rem}.image-slider-dots-button{all:unset;display:flex;align-items:center;justify-content:center;color:#23f7dd;background-color:transparent;cursor:pointer;border-radius:50%}@media (max-width: 1460px){.image-slider-images{min-width:670px}}@media (max-width: 1080px){.image-slider-btn{padding:.5rem}.image-slider-images{min-width:500px}.image-slider-container{height:300px}.image-slider-icon{font-size:1.5rem}.image-slider-dots-icon{font-size:.9rem}}@media (max-width: 620px){.image-slider-images{min-width:90vw}}body.modal-open{overflow:hidden}.spacer{height:30vh;width:100%}.project-wrapper{background-color:#000;color:#fff}.project-title{font-size:3rem;font-weight:600;padding-top:5rem;margin-top:0;margin-bottom:0;margin-left:5vh;text-align:center}.gallery{display:flex;justify-content:center}.details-left-section{height:10%;width:50%;max-width:500px}.details-wrapper{margin:auto;width:80%}.right-section{width:50%;max-width:500px;height:100vh;display:flex;flex-direction:column;justify-content:center;position:sticky;top:0}.photos{width:100%;height:40vh;position:relative;overflow:hidden;box-shadow:0 0 20px #23f7dd}.photo{position:absolute;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#23f7dd}@media (max-width: 1080px){.project-title{font-size:2.2rem}.gallery{margin:0 4vw}.details-wrapper{margin-left:0}}@media (max-width: 620px){.project-title{margin-left:0}.gallery{flex-direction:column-reverse;align-items:center;width:100vw;margin:0}.details-left-section{width:100%;height:auto}.details-wrapper{width:100%}.right-section{display:flex;margin-top:10vh;justify-content:flex-start;width:100%;max-width:none;z-index:0;pointer-events:none}.photos{width:100%;height:35%;z-index:2}.photo{padding-top:.6em;height:100%}}.tech-wrapper{background-color:#000;color:#000}.tech-title{font-size:3rem;font-weight:600;padding-top:5rem;margin-top:0;margin-bottom:0;margin-left:5vh;text-align:center;color:#fff}.text{margin:.8em 0 0;background:#2d4e86;border-radius:6px;height:1em;width:100%}.tech-gallery{display:flex;justify-content:center;align-items:flex-start}.tech-left-section{width:50%;max-width:500px;display:flex;flex-direction:column;justify-content:center}.tech-details-wrapper{margin:auto;width:80%}.tech-details{height:20vh;display:flex;flex-direction:column;justify-content:center}.tech-right-section{width:50%;max-width:500px;height:100vh;display:flex;align-items:center;justify-content:center;position:sticky;top:0}.tech-tiles-container{width:85%;height:75vh;position:relative;overflow:hidden;box-shadow:4px 4px 4px #0006;display:grid;grid-template-columns:repeat(4,1fr);align-items:center;justify-content:center}.tech-tile{width:80px;height:80px;background:#23f7dd;margin:auto;border-radius:20px;display:flex;align-items:center;justify-content:center}.tech-tile i{font-size:3.2rem}.tech-tile .gsap{width:80%}.tech-tile .render,.tech-tile .xampp{width:60%}@media (max-width: 800px){.tech-tiles-container{grid-template-columns:repeat(3,1fr)}}@media (max-width: 620px){.tech-title{margin-left:0}.tech-gallery{flex-direction:column-reverse;align-items:center;width:100vw;margin:0}.tech-left-section{width:100%;height:auto;pointer-events:none}.tech-details-wrapper{width:100%}.tech-right-section{width:90%;z-index:0;pointer-events:none;align-items:unset}.tech-tiles-container{position:sticky;top:0;width:100%;height:40%;grid-template-columns:repeat(5,1fr);padding-top:8vh;z-index:1;background-color:#000}.tech-tile{width:50px;height:50px;border-radius:10px}.tech-tile i{font-size:2rem}}.spacer{height:20vh;width:100%}.landing-container{height:100vh;display:flex;justify-content:center;align-items:center;background:#000;padding:0 15vw;gap:5vw;color:#fff}.about-me{display:flex;flex-direction:column;justify-content:center;width:50%}.introduction{font-size:3rem;font-weight:600;margin-bottom:0}.name{color:#000;background-color:#23f7dd}.text-wrapper{font-size:2rem;font-weight:500;position:relative;margin-bottom:3rem;color:#23f7dd}.text-wrapper p{line-height:0;position:absolute}.tagline{display:flex;font-size:1.2rem}.image-container{position:relative;width:40vh;height:40vh;overflow:hidden;border-radius:20px}.image{position:absolute;width:100%;height:100%}img{width:100%;height:auto;object-fit:cover}.grad-image{opacity:.8}.image-container .image-overlay{position:absolute;width:100%;height:100%;mix-blend-mode:screen}.image-blocks{position:absolute;width:100%;height:100%;display:flex;flex-flow:row wrap;align-content:space-between;justify-content:space-between}.block{width:20%;height:20%;opacity:0;mix-blend-mode:hard-light;background:#d7d7d7;transition:opacity .3s ease-in;border-radius:10px}.block.active{opacity:.7}@media (max-width: 1150px){.image-container{height:30vh;width:30vh}.introduction{font-size:2.5rem;margin-bottom:.2rem}.text-wrapper{font-size:1.5rem}.tagline{font-size:1rem;margin:.2rem 0}}@media (max-width: 960px){.landing-container{padding:0 5vw}}@media (max-width: 745px){.image-container{height:25vh;width:25vh}.introduction{font-size:2rem;margin-bottom:.3rem}.text-wrapper{font-size:1.2rem}.tagline{font-size:.7rem;margin:0}}@media (max-width: 600px){.image-container{display:none}.introduction{font-size:2.5rem;margin-bottom:.2rem}.text-wrapper{font-size:1.5rem}.tagline{font-size:1rem;margin:.2rem 0}.about-me{width:80%}}@media (max-width: 475px){.introduction{font-size:2rem;margin-bottom:.4rem}.text-wrapper{font-size:1.2rem}.tagline{font-size:.9rem;margin:0}}@media (max-width: 375px){.introduction{font-size:1.6rem;margin-bottom:.6rem}.text-wrapper{font-size:1rem}.tagline{font-size:.7rem;margin:-.4em 0}}.navbar-container{color:#23f7dd;background-color:#000;z-index:2}.content-overlay h1{font-size:5vw;text-transform:uppercase;font-weight:400;text-align:center;line-height:.75;pointer-events:none;color:#23f7dd}.navbar-hero.header h1{color:#23f7dd}#navbar-toggle{position:fixed;top:0;left:50%;transform:translate(-50%);display:flex;justify-content:center;align-items:center;margin:1em 0;padding:.8em 1.6em;background:#23f7dd;color:#000;border-radius:40px;cursor:pointer;z-index:4}#navbar-toggle.menu-open{color:#23f7dd;background-color:#000}.navbar-nav{position:fixed;top:0;width:100%;display:flex;justify-content:space-between;mix-blend-mode:difference;z-index:3}.navbar-nav div{display:flex;margin:.2em 4em}.navbar-nav div p{font-size:1.2em;font-weight:400}#square-container{position:fixed;top:0;width:100vw;display:flex;flex-wrap:wrap;justify-content:center;align-content:flex-start;z-index:3;pointer-events:none}.square{width:100px;height:100px;background:#23f7dd;pointer-events:none}.content-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;display:flex;justify-content:center;align-items:center;gap:5em;background:#23f7dd;color:#000;z-index:-1}.content-overlay h1{color:#000;font-size:6vw}.content-overlay .nav-link{display:flex}.content-overlay .nav-link span{position:relative;top:.3em}.content-overlay .nav-link a{padding:0 1em;font-size:2em;font-weight:300;text-decoration:none;color:#000}@media (max-width: 700px){.navbar-nav div{margin:.8em 1.5em}.navbar-nav div p{font-size:.9em}#navbar-toggle{margin-top:1.3em;padding:.6em 1.2em}.content-overlay{gap:1.5em}.content-overlay .nav-link a{font-size:1.3em;padding:0 .5em}.content-overlay .nav-link span{font-size:.8em}.square{width:50px;height:50px}}.contact-wrapper{width:100vw;height:100vh;background-color:#23f7dd;color:#000;display:flex;flex-direction:column;align-items:center;justify-content:center}.contact-header h1{font-size:3rem;text-transform:uppercase;font-weight:400;text-align:center;line-height:.75;pointer-events:none;margin-bottom:1.5rem;color:#000}.contact-form{background-color:#000;width:400px;border-radius:.5rem;padding:1rem}form{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;width:100%;color:#23f7dd;gap:1rem}form div{display:flex;flex-direction:column;justify-content:flex-start;width:90%;gap:.2rem}form div label{font-size:1rem}form div input,form div textarea{background-color:transparent;border:1px solid rgb(35,247,221);color:#fff;line-height:1.5rem;font-size:1rem;padding:.2rem .2rem .2rem 1rem;font-family:Space Grotesk,sans-serif;resize:none}form div input:focus,form div textarea:focus{outline:1px solid white;box-shadow:none;color:#fff}form div input{height:2rem}form div button{line-height:2.2rem;border:none;font-size:1rem;background-color:#23f7dd;cursor:pointer}form div button:hover{outline:1px solid rgb(35,247,221);color:#23f7dd;background-color:#000}.submitting{background-color:#000}.submitting:hover{outline:none;border:none}.toast-wrapper{background-color:#000;padding:0;padding-left:1rem;border:none}.notif-container{color:#23f7dd;width:100%;font-family:Space Grotesk,sans-serif}@media (max-width: 940px){.contact-header h1{font-size:2rem}.contact-form{width:300px}form{gap:.8rem}form div label{font-size:.8rem}form div input,form div textarea{font-size:.6}form div textarea{height:200px}form div input{height:1.8rem}form div button{line-height:2rem;font-size:.8rem}}@media (max-width: 620px){.contact-header h1{font-size:1.8rem}.contact-form{width:230px;padding:.8rem}form{gap:.7rem}form div{width:95%}form div label{font-size:.7rem}form div input,form div textarea{font-size:.8rem}form div textarea{height:150px}form div input{height:1.6rem}form div button{line-height:1.7rem;font-size:.7rem}.toast-wrapper{position:absolute;margin-bottom:80vh}}.dots-container{display:flex;flex-direction:row;align-items:center;justify-content:center;height:2.2rem;width:100%}.dot{height:.6rem;width:.6rem;margin-right:10px;border-radius:10px;background-color:#fff;animation:pulse 1.5s infinite ease-in-out}.dot:last-child{margin-right:0}.dot:nth-child(1){animation-delay:-.3s}.dot:nth-child(2){animation-delay:-.1s}.dot:nth-child(3){animation-delay:.1s}@keyframes pulse{0%{transform:scale(.8);background-color:#159485;box-shadow:0 0 #23f7ddb3}50%{transform:scale(1.2);background-color:#23f7dd;box-shadow:0 0 0 10px #23f7dd00}to{transform:scale(.8);background-color:#a4fff6;box-shadow:0 0 #23f7ddb3}}@media (max-width: 620px){.dots-container{height:1.7rem}}body,html{margin:0;padding:0;width:100vw;height:100vh;box-sizing:border-box;font-family:Space Grotesk,sans-serif;scrollbar-color:transparent transparent}body{background-color:#000}
