:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body,#root{height:100%;width:100%}body{background-color:#242424;margin:0;min-height:100vh;display:flex;justify-content:center;align-items:center;font-family:Inter,sans-serif;zoom:82.5%;width:100%}@layer reset{*,*:before,*:after{box-sizing:border-box}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}[role=list]{list-style:none;margin:0;padding:0}body{min-block-size:100vh;line-height:1.6}h1,h2,h3,button,input,label{line-height:1.1}h1,h2,h3,h4{text-wrap:balance}p,li{text-wrap:pretty}img,picture{max-inline-size:100%;display:block}input,button,textarea,select{font:inherit}}@layer variables{:root{--big-stone-50: #f5f7fa;--big-stone-100: #eaeef4;--big-stone-200: #d0dbe7;--big-stone-300: #a6bcd3;--big-stone-400: #7799b9;--big-stone-500: #557ca2;--big-stone-600: #426287;--big-stone-700: #37506d;--big-stone-800: #30455c;--big-stone-900: #2c3c4e;--big-stone-950: #1f2937;--mirage-50: #f0f7fe;--mirage-100: #deecfb;--mirage-200: #c4e0f9;--mirage-300: #9cccf4;--mirage-400: #6dafed;--mirage-500: #4b90e6;--mirage-600: #3674da;--mirage-700: #2d60c8;--mirage-800: #2a4fa3;--mirage-900: #274481;--mirage-950: #0f172a;--mountain-meadow-50: #ecfdf7;--mountain-meadow-100: #d1faec;--mountain-meadow-200: #a7f3da;--mountain-meadow-300: #6ee7bf;--mountain-meadow-400: #34d39e;--mountain-meadow-500: #10b981;--mountain-meadow-600: #059666;--mountain-meadow-700: #047852;--mountain-meadow-800: #065f42;--mountain-meadow-900: #064e36;--mountain-meadow-950: #022c1e;--white-50: #ffffff;--white-100: #efefef;--white-200: #dcdcdc;--white-300: #bdbdbd;--white-400: #989898;--white-500: #7c7c7c;--white-600: #656565;--white-700: #525252;--white-800: #464646;--white-900: #3d3d3d;--white-950: #292929}}@layer layout{.app-container{display:flex;flex-direction:column;gap:100px;background-color:var(--big-stone-950);color:var(--white-50);padding:35px 45px 45px}.app-container>.navigation{margin:0 0 0 -25px}.footer{background-color:var(--mirage-950)}}@layer conner{.rounded-accents{position:relative;left:50%;transform:translate(-50%);background:#fff0;display:flex;justify-content:center;align-items:center;width:fit-content;height:fit-content;color:#fff;padding:40px;margin:50px;text-shadow:0px 100px 80px rgba(0,0,0,.36),0px 50.049px 40.039px rgba(0,0,0,.27),0px 30.147px 24.118px rgba(0,0,0,.23),0px 19.32px 15.456px rgba(0,0,0,.21),0px 12.522px 10.017px rgba(0,0,0,.18),0px 7.882px 6.306px rgba(0,0,0,.15),0px 4.529px 3.623px rgba(0,0,0,.13),0px 1.993px 1.595px rgba(0,0,0,.09);font-family:Inter;font-size:55px;font-style:normal;font-weight:600;line-height:normal}.rounded-accents:before,.rounded-accents:after{content:"";position:absolute;width:40px;height:40px}.rounded-accents:before{top:15px;left:15px;border-top:4px solid #ff6b6b;border-left:4px solid #4ecdc4;border-top-left-radius:8px}.rounded-accents:after{bottom:15px;right:15px;border-bottom:4px solid #45b7d1;border-right:4px solid #f9ca24;border-bottom-right-radius:8px}}@layer component{.main-hero{display:flex;gap:59px;align-items:flex-start;justify-content:center}.profile-card{position:relative;display:flex;flex-direction:column;align-items:self-start;gap:16px;flex-shrink:0;border-radius:50px;padding:32px;margin-top:120px;border-bottom:2px solid rgba(255,255,255,.14);background:#ffffff0d;box-shadow:0 18px 22px -6px #00000040;-webkit-backdrop-filter:blur(110.4000015258789px);backdrop-filter:blur(110.4000015258789px);font:100}.profile-card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:transparent;clip-path:ellipse(20% 100px at 50% 0%);z-index:-1;background-color:var(--big-stone-950)}.profile-card h3{color:#ffffffbf;font-family:Inter,sans-serif;font-size:23px;font-style:normal;font-weight:400;line-height:normal}.profile-card h2{color:#ffffffbf;font-family:Inter,sans-serif;font-size:38px;font-style:normal;font-weight:400;line-height:normal}.profile-card button{width:35%;height:50px;border:var(--big-stone-200) solid .125px;font:rgba(255,255,255,.75) 400 16px "Inter",sans-serif;background-color:transparent;border-radius:20px;color:var(--white-50);font-family:Inter,sans-serif;font-size:16px;font-style:normal;font-weight:600;line-height:normal;cursor:pointer}.profile-card img{position:relative;width:400px;top:-200px;border-bottom-left-radius:100px;border-bottom-right-radius:100px;margin-bottom:-150px}.profile-card button:hover{background-color:#ffffff1a;transition:background-color .3s ease;border:var(--mountain-meadow-800) solid .5px}.main-hero-content h1{font-family:Inter;font-size:118px;font-style:normal;font-weight:600;line-height:normal;padding-bottom:10px}.main-hero-content p{width:893px;font-family:Inter;color:#ffffffbf;font-size:20px;font-style:normal;font-weight:50;line-height:normal}.main-hero-content button:hover{background-color:#ffffff1a;transition:background-color .3s ease;border:var(--mountain-meadow-800) solid .5px;border-radius:20px;cursor:pointer}.main-hero-buttons{display:flex;gap:200px;margin:50px}.main-hero-resume-btn{background-color:transparent;border-radius:12px;border:2px solid #fff;width:217px;height:64px;flex-shrink:0;color:#fff;font-family:Inter;font-size:20px;font-style:normal;font-weight:400;line-height:normal}.main-hero-live-demo-btn{display:flex;align-items:center;gap:12px;background-color:transparent;border:none;color:#fff;font-family:Inter;font-size:20px;font-style:normal;font-weight:400;line-height:normal}.main-hero-live-demo-btn img{width:50px;height:50px}.main-hero-description{display:flex;flex-direction:column;align-items:center;gap:20px;width:732px;height:260px;flex-shrink:0;padding:20px;border-radius:20px;border:2px solid rgba(255,255,255,.14);background:#ffffff0d;box-shadow:0 18px 22px -6px #00000040;-webkit-backdrop-filter:blur(110.4000015258789px);backdrop-filter:blur(110.4000015258789px)}.main-hero-description h4{position:relative;color:#fff;right:200px;font-family:Inter;font-size:22px;font-style:normal;font-weight:400;line-height:normal}.main-hero-description p{width:654px;height:261px;flex-shrink:0;color:#fff;font-family:Inter;font-size:17px;font-style:normal;font-weight:400;line-height:normal}}@layer component{.navigation-component{display:flex;flex-direction:row;gap:var(--nav-gap, 1026px);align-items:center;padding:.125rem 0rem .125rem 2.5rem;border-radius:20px;border:2px solid rgba(255,255,255,.14);background:#ffffff0d;box-shadow:0 18px 22px -6px #00000040;-webkit-backdrop-filter:blur(110.4000015258789px);backdrop-filter:blur(110.4000015258789px)}.navigation-component ul{display:flex;flex-direction:row;list-style:none;gap:var(--nav-ul-gap, 2.5rem);font-size:18px;font-family:var(--font-family, "Inter", sans-serif);font-weight:500}.navigation-component img{width:42px;height:42px;object-fit:contain}}@layer components{.skills-card{display:flex;flex-direction:row;gap:160px;align-items:center;justify-content:center;width:100%;height:526px;flex-shrink:0;border-radius:151px;border:2px solid rgba(255,255,255,.27);background:#ffffff0d;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.skills-card p{width:732px;color:#fff;font-family:Inter;font-size:20px;font-style:normal;font-weight:300;line-height:normal}.skills-card p html,.skills-card p body,.skills-card p #root{height:100%;width:100%}.skills-card img{position:relative;width:500px;height:500px;flex-shrink:0;border-radius:20px;margin-top:0;bottom:160px}.skills-container{display:flex;flex-direction:column;gap:100px;align-items:center;justify-content:center;width:100%;height:100%;padding:20px;background-color:var(--big-stone-950)}.skills-card-text{display:flex;flex-direction:column;gap:20px;width:100%;height:100%}.skills-card-content{display:flex;flex-direction:column;gap:80px}.skills-card-content h3{color:#fff;text-shadow:0px -9px 80px rgba(0,0,0,.26),0px -4.504px 40.039px rgba(0,0,0,.2),0px -2.713px 24.118px rgba(0,0,0,.17),0px -1.739px 15.456px rgba(0,0,0,.15),0px -1.127px 10.017px rgba(0,0,0,.13),0px -.709px 6.306px rgba(0,0,0,.11),0px -.408px 3.623px rgba(0,0,0,.09),0px -.179px 1.595px rgba(0,0,0,.06);font-family:Inter;font-size:38px;font-style:normal;font-weight:600;line-height:normal}.skills-card-content p{width:732px;color:var(--white-200);font-family:Inter;font-size:20px;font-style:normal;font-weight:200;line-height:normal}.skills-card-content button{width:182px;height:64px;flex-shrink:0;border-radius:12px;border:2px solid #fff;background-color:transparent;color:#fff;font-family:Inter;font-size:20px;font-style:normal;font-weight:100;line-height:normal}.skills-card-content button:hover{background-color:#ffffff1a;transition:background-color .3s ease;border:var(--mountain-meadow-800) solid .5px;border-radius:20px;cursor:pointer}}@layer component{.error-message{color:#ff6b6b!important;font-weight:500}.project-card{background:var(--white-50);border-radius:12px;padding:1.5rem;box-shadow:0 4px 20px #0003;transition:transform .3s ease,box-shadow .3s ease;position:relative;overflow:hidden;border:1px solid var(--big-stone-200)}.project-card:before{font-family:Inter;content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--mountain-meadow-500),var(--mirage-600),var(--big-stone-600))}.project-card:hover{transform:translateY(-5px);box-shadow:0 8px 30px #00000040;border-color:var(--mountain-meadow-300)}.project-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.project-title{font-size:2rem;font-weight:600;color:var(--big-stone-900);text-decoration:none;transition:color .3s ease}.project-title:hover{color:var(--mountain-meadow-500)}.github-link{color:var(--big-stone-600);transition:color .3s ease;text-decoration:none}.github-link:hover{color:var(--mountain-meadow-500)}.project-description{color:var(--big-stone-700);line-height:1.6;margin-bottom:1.5rem;font-size:1.5rem}.project-meta{display:flex;align-items:center;gap:1rem;margin-bottom:1rem;font-size:1rem;color:var(--big-stone-600)}.meta-item{display:flex;align-items:center;gap:.3rem}.language-tag{display:inline-flex;align-items:center;gap:.5rem;padding:.25rem .75rem;border-radius:20px;font-size:.8rem;font-weight:500;margin-bottom:1rem}.language-dot{width:8px;height:8px;border-radius:50%}.lang-javascript{background:var(--mirage-100);color:var(--mirage-700)}.lang-javascript .language-dot{background:var(--mirage-600)}.lang-python{background:var(--big-stone-100);color:var(--big-stone-700)}.lang-python .language-dot{background:var(--big-stone-600)}.lang-html{background:var(--mountain-meadow-100);color:var(--mountain-meadow-700)}.lang-html .language-dot{background:var(--mountain-meadow-500)}.lang-css{background:var(--mirage-100);color:var(--mirage-700)}.lang-css .language-dot{background:var(--mirage-500)}.lang-react{background:var(--mountain-meadow-100);color:var(--mountain-meadow-800)}.lang-react .language-dot{background:var(--mountain-meadow-500)}.lang-typescript{background:var(--mirage-100);color:var(--mirage-700)}.lang-typescript .language-dot{background:var(--mirage-600)}.lang-java{background:var(--big-stone-100);color:var(--big-stone-700)}.lang-java .language-dot{background:var(--big-stone-600)}.lang-cpp,.lang-c{background:var(--big-stone-100);color:var(--big-stone-700)}.lang-cpp .language-dot,.lang-c .language-dot{background:var(--big-stone-600)}.lang-unknown{background:var(--white-200);color:var(--white-700)}.lang-unknown .language-dot{background:var(--white-500)}.project-links{display:flex;gap:.75rem}.btn{padding:.6rem 1.2rem;border:none;border-radius:6px;text-decoration:none;font-weight:500;font-size:.9rem;transition:all .3s ease;cursor:pointer;text-align:center}.btn-primary{background:var(--mountain-meadow-500);color:var(--white-50)}.btn-primary:hover{background:var(--mountain-meadow-600);transform:translateY(-1px)}.btn-secondary{background:transparent;color:var(--big-stone-600);border:1.5px solid var(--big-stone-300)}.btn-secondary:hover{border-color:var(--mountain-meadow-500);color:var(--mountain-meadow-500)}.loading-spinner{display:flex;justify-content:center;align-items:center;min-height:200px}.spinner{width:40px;height:40px;border:4px solid var(--big-stone-300);border-top:4px solid var(--mountain-meadow-500);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}}.projects-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:30px;padding:20px}.tech-tag{transition:transform .2s}@keyframes shake-scale{0%{transform:scale(1.05) translate(0)}20%{transform:scale(1.05) translate(-3px)}40%{transform:scale(1.05) translate(3px)}60%{transform:scale(1.05) translate(-2px)}80%{transform:scale(1.05) translate(2px)}to{transform:scale(1.05) translate(0)}}.tech-tag{display:inline-flex;padding:.25rem .75rem;background-color:#f0f0f0;justify-content:center;align-items:center;color:#333;font-size:.875rem;border-radius:10px;white-space:nowrap;transition:transform .2s ease-in-out}.tech-tag:hover{animation:shake-scale .4s ease-in-out}.tech-tag{display:flex;flex-wrap:wrap;padding:.25rem .75rem;background-color:#f0f0f0;justify-content:center;align-items:center;color:#333;font-size:.875rem;border-radius:10px;width:fit-content;height:fit-content;font-size:16px}.techs{display:grid;grid-template-columns:repeat(6,max-content);gap:5px;padding:3rem;justify-content:center;width:100%;height:fit-content;border-radius:92px;border:3px solid rgba(255,255,255,.44);background:#ffffff0d}@layer components{.footer-container{display:flex;flex-direction:column;align-items:center;padding:20px}.footer-content{display:flex;flex-direction:row;align-items:center;gap:200px;padding:50px}.footer-content h1{color:#fff;font-family:Inter;font-size:58px;font-style:normal;font-weight:900;line-height:normal}.socials-footer{display:flex;flex-direction:row;align-items:center;gap:20px}.socials-footer a svg{transition:transform .3s ease,color .3s ease;color:#fff}.socials-footer a:hover svg{transform:scale(1.2);color:#1da1f2}.socials-footer a:hover:nth-child(1) svg{color:#6e5494}.socials-footer a:hover:nth-child(2) svg{color:#0077b5}.socials-footer a:hover:nth-child(3) svg{color:#1da1f2}.footer-links{color:#fff;font-size:18px;text-decoration:none}.footer-links ul{list-style:none;padding:0}.footer-links ul li{padding:12px;margin:0}.footer-links ul li:hover{color:#ccc}.footer-contact{display:flex;flex-direction:column;color:#fff;gap:10px;font-family:Inter;font-size:28px;font-style:normal;font-weight:800;line-height:normal}.footer-contact a{color:#ffffffbf;font-family:Inter;font-size:24px;font-style:normal;font-weight:200;line-height:normal;text-decoration:none;padding:18px;border:#ccc 1px solid;border-radius:8px}.footer-contact a:hover{color:#fff;background-color:#ffffff1a}}.socials-top{position:fixed;top:24px;left:50%;transform:translate(-50%);display:flex;justify-content:center;gap:50px;z-index:9999;padding:25px;background:#ffffff0d;box-shadow:0 18px 22px -6px #00000040;-webkit-backdrop-filter:blur(110.4px);backdrop-filter:blur(110.4px);border-radius:20px;transition:opacity .3s ease}.socials-side{position:fixed;bottom:50%;left:3%;transform:translate(-50%,50%);display:flex;flex-direction:column;justify-content:center;gap:50px;z-index:9999;padding:25px;background:#ffffff0d;box-shadow:0 18px 22px -6px #00000040;-webkit-backdrop-filter:blur(110.4px);backdrop-filter:blur(110.4px);border-radius:20px;transition:opacity .3s ease}.socials-top a svg,.socials-side a svg{transition:transform .3s ease,color .3s ease;color:#fff}.socials-top a:hover svg,.socials-side a:hover svg{transform:scale(1.2);color:#1da1f2}.socials-top a:hover:nth-child(1) svg,.socials-side a:hover:nth-child(1) svg{color:#6e5494}.socials-top a:hover:nth-child(2) svg,.socials-side a:hover:nth-child(2) svg{color:#0077b5}.socials-top a:hover:nth-child(3) svg,.socials-side a:hover:nth-child(3) svg{color:#1da1f2}
