@import"https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap";@import"https://fonts.googleapis.com/css2?family=Playwrite+IN:wght@100..400&display=swap";@import"https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap";*{margin:0;padding:0;scroll-behavior:smooth;font-family:Outfit,serif;font-optical-sizing:auto;font-style:normal;letter-spacing:1px}#root{display:flex;flex-direction:column;justify-content:center;align-items:center;max-width:80vw}a{text-decoration:none}body{background-color:#000;display:flex;justify-content:center;align-items:center}header{margin:15px 0;display:flex;flex-direction:row;width:80vw;align-items:center;justify-content:space-between;-webkit-backdrop-filter:8px;backdrop-filter:8px}.logo-name{color:#cfcfcf;font-size:2rem;font-family:Playwrite IN,serif;font-optical-sizing:auto;font-weight:400;font-style:normal}.hamburger-menu{display:none}nav ul{display:flex;flex-direction:row;gap:50px;font-size:1.2rem}nav ul li{list-style:none}nav ul li a{list-style:none;color:#fff;font-weight:600;transition:color .3s}nav ul li a:hover{color:#dcdcdc}.hero{display:flex;justify-content:center;align-items:center;flex-direction:column;height:calc(100vh - 72px);overflow:hidden}.hero h1,.hero .split-text{color:#f0f8ff;font-size:2.5rem;font-weight:800;margin:10px 0}.split-text:after{content:"👋"}.hero p{font-size:1.8rem;font-weight:800;letter-spacing:2px;white-space:wrap;overflow:hidden;display:inline-block;text-align:center}.hero .mess:after{content:"|"}.about{margin:5vh 0}.parent{display:grid;grid-template-columns:repeat(9,1fr);grid-column-gap:15px;grid-row-gap:15px;width:80vw;max-height:120vh}.div1{grid-area:1 / 1 / 6 / 4;display:flex;flex-direction:column}.about h3{color:#ede9e9;text-align:left;padding:5px;font-weight:500}.about p{color:gray;padding:5px;font-size:1rem;text-wrap:pretty}.div2{grid-area:1 / 4 / 6 / 7}.div3{grid-area:1 / 7 / 8/ 10;display:flex;flex-direction:column;justify-content:flex-start;align-items:center}.div4{grid-area:6 / 1 / 11 / 7;margin:auto}.div5{grid-area:8 / 7 / 11 / 10;display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative}.div1 img{width:100%;height:100%}.div2 img{margin:20px 0;filter:invert(100%);width:100%}.div3 img{aspect-ratio:1/1;width:80%;filter:drop-shadow(0 0 3px rgb(73,57,121));margin:20px 0}.div4 img{width:100%}.div5 img{width:100%;height:100%}.copy-container{bottom:25px;position:absolute;display:flex;flex-direction:row;cursor:pointer;justify-content:flex-end;align-items:flex-end}.copy-container p{font-size:1.5rem}@media screen and (max-width:768px){.hero h1,.hero .split-text{font-size:2rem}.parent{display:flex;flex-direction:column;justify-content:center;align-items:center;max-height:fit-content}button{margin:10px auto!important}nav{position:relative;width:20%;display:none;z-index:9999}nav ul{position:absolute;top:50px;left:0}nav ul{flex-direction:column}.hamburger-menu{display:flex;height:100%;justify-content:center;align-items:center;cursor:pointer}.hamburger-menu img{filter:invert(80%);aspect-ratio:1/1;height:30px}.project-details-container{justify-content:center;align-items:center}.project-tags{gap:25px;flex-direction:column!important}.project-details-container h2{text-align:center}}.squares-canvas{width:100%;height:100%;border:none;display:block;position:absolute;opacity:.1}.animated-gradient-text{position:relative;margin:0 auto;display:inline-block;max-width:fit-content;font-weight:500;overflow:hidden;cursor:pointer}.text-content{position:relative;z-index:2;background-image:linear-gradient(to right,var(--gradient-colors));background-size:200% 100%;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:gradient var(--animation-speed) linear infinite}@keyframes gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.card-spotlight{display:flex;flex-direction:column;position:relative;border-radius:1.2rem;border:1px solid #222;background-color:#1111119e;padding:15px;overflow:hidden;--mouse-x: 50%;--mouse-y: 50%;--spotlight-color: rgba(255, 255, 255, .05)}.card-spotlight:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at var(--mouse-x) var(--mouse-y),var(--spotlight-color),transparent 80%);opacity:0;transition:opacity .5s ease;pointer-events:none}.card-spotlight:hover:before,.card-spotlight:focus-within:before{opacity:.6}.focus-container{position:relative;display:flex;gap:1em;justify-content:center;align-items:center;flex-wrap:wrap;margin:20px 0}.focus-word{position:relative;font-size:3rem;font-weight:900;color:#fff;cursor:pointer;transition:filter .3s ease,color .3s ease}.focus-word.active{filter:blur(0)}.focus-frame{position:absolute;top:0;left:0;pointer-events:none;box-sizing:content-box;border:none}.corner{position:absolute;width:1rem;height:1rem;border:3px solid var(--border-color, #fff);filter:drop-shadow(0px 0px 4px var(--border-color, #fff));border-radius:3px;transition:none}.top-left{top:-10px;left:-10px;border-right:none;border-bottom:none}.top-right{top:-10px;right:-10px;border-left:none;border-bottom:none}.bottom-left{bottom:-10px;left:-10px;border-right:none;border-top:none}.bottom-right{bottom:-10px;right:-10px;border-left:none;border-top:none}.connect-btn{width:95%;padding:15px 0;background-color:#3d3c3c;color:#fff;border:none;font-weight:400;border-radius:5px;transition:all .3s;cursor:pointer;margin:auto}.connect-btn:hover{background-color:#000;border:1px solid rgb(217,217,217)}.connect-btn:before{content:"🟢";padding:0 10px;animation:blink 2.5s ease-in infinite}@keyframes blink{0%{opacity:1}50%{opacity:0}to{opacity:1}}.project-sec,.contact-sec{margin-top:10vh}.project-container{gap:50px;padding:25px;border:1px solid #222;background-color:#1111119e;border-radius:1.2rem;display:flex;flex-direction:row;justify-content:space-evenly;flex-wrap:nowrap}.project-details-container{display:flex;flex-direction:column;gap:20px;margin:auto}.project-details-container h2{font-size:1.5rem;color:#eefbfd}.project-details-container p{color:#929191}.project-logo{border-radius:5px;height:80px;width:80px;display:flex;justify-content:center;align-items:center;background-color:#76757524}.project-logo img{height:50px;aspect-ratio:1/1}.project-tags{margin:20px 0;display:flex;flex-direction:row;justify-content:space-between;align-items:center}.tags{display:flex;flex-direction:row;gap:10px;flex-wrap:wrap;justify-content:center}.tech-logo{border-radius:5px;border:1px solid rgba(141,140,140,.327);display:flex;justify-content:center;align-items:center;background-color:#3232325f}.tech-logo img{height:30px;padding:10px;aspect-ratio:1/1;cursor:pointer}.live-site a{transition:all .32s;display:flex;flex-direction:row;gap:10px;justify-content:center;align-items:center}.live-site img{width:20px;filter:invert(50%)}.arrow-container{display:flex;flex-direction:row;width:100%;justify-content:center;gap:25px;align-items:center}.arrow-container img{transition:all .32s;cursor:pointer;filter:invert(100%);height:25px;aspect-ratio:1/1;background-color:#ffffff5d;padding:10px;border-radius:5px;border:1px solid black}.arrow-container img:hover{filter:invert(0%)}@media screen and (max-width:1200px){.project-container{flex-wrap:wrap-reverse;gap:20px}.video-container video{width:100%!important}}.video-container{position:relative;display:flex;justify-content:center;align-items:center;width:100%;max-width:800px;margin:auto;overflow:hidden;border-radius:2px;border:2px solid white;background-color:#fff}.video-container video{width:100%;height:auto;display:block;border-radius:5px;object-fit:cover;box-shadow:0 4px 10px #2d2d2d33}.contact-container{width:100%;max-width:500px;margin:40px auto;padding:20px;background:#5a595938;color:#fff;border-radius:8px;box-shadow:0 4px 10px #ffffff1a;text-align:center;box-sizing:border-box}.contact-form{margin:20px 0;display:flex;flex-direction:column;gap:15px}.contact-container label{font-weight:700;text-align:left;display:block;margin-bottom:5px}.contact-form input,.contact-form textarea{width:100%;padding:12px;border:1px solid #444;border-radius:5px;font-size:16px;background:#2a2a2a;color:#fff;box-sizing:border-box}.contact-form textarea{height:120px;resize:none}.contact-container button{background-color:#333;color:#fff;border:none;padding:12px;cursor:pointer;border-radius:5px;font-size:16px;transition:.3s;width:100%}.contact-container button:hover{background-color:#444}.social-buttons{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:20px}.social-btn{display:flex;align-items:center;justify-content:center;text-decoration:none;padding:10px;border-radius:5px;font-size:16px;font-weight:700;transition:all .3s ease,transform .2s ease;color:#fff}.social-btn img{width:24px;height:24px;margin-right:10px}.github{background:#222}.github img{filter:invert(1)}.linkedin{background:#0a66c2}.instagram{background:#b43aac}.social-btn:hover{transform:scale(1.05);opacity:.9}footer{display:flex;justify-content:center;align-items:center;width:90%;border-top:1px solid rgba(128,128,128,.37);border-radius:1px;margin:5vh 0 0;padding:20px 0}.shiny-text{text-align:center;color:#b5b5b5a4;background:linear-gradient(120deg,#fff0 40%,#fffc,#fff0 60%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;display:inline-block;animation:shine 5s linear infinite;font-size:1.1rem}@keyframes shine{0%{background-position:100%}to{background-position:-100%}}.shiny-text.disabled{animation:none}.app-container{min-height:100vh;display:flex;flex-direction:column}.main-content{flex:1;width:100%;max-width:1200px;margin:0 auto;padding:0 1rem}
