:root{--bg-color:#081729;--bg-white:white;--text-primary:#d2cece;--text-secondary:#d2d2ce;--border-color:gray;--border-secondary:#f5e2e2;--skills-side-blur:#0817293f;--nav-links-bg:#1e2834;--btn-bg:#dee5e5}body{background-color:var(--bg-color);color:var(--text-primary);letter-spacing:.5px;margin:0;font-family:Roboto,sans-serif;line-height:24px}html{scroll-behavior:smooth}.header-cont{justify-content:space-between;align-items:center;margin-bottom:24px;padding:4px 16px;display:flex}.header-cont .nav-links{gap:24px;display:none}.header-cont .nav-links a{color:var(--text-primary);text-decoration:none}@media (width>=768px){.header-cont .nav-links{display:flex}.header-cont .hamburger-menu{display:none}}.visible{flex-direction:column;display:flex}.hidden{display:none}.medium-links{gap:26px;animation:1s ease-in-out circleShow}@keyframes circleShow{0%{clip-path:circle(0)}to{clip-path:circle(100px)}}.medium-links a{color:var(--text-primary);background-color:var(--nav-links-bg);border-radius:4px;padding:12px 24px;text-decoration:none}.navs-cont{z-index:50;flex-direction:column;gap:5px;display:flex;position:fixed;bottom:4vh;right:5vw}.theme-toggle{background-color:var(--bg-color);cursor:pointer;border-radius:50%;justify-content:center;align-self:end;align-items:center;width:36px;height:36px;margin:3px 0;display:flex}.theme-toggle img{object-fit:contain;width:50%;height:50%}.hamburger-menu{cursor:pointer;background-color:var(--bg-color);border:1px solid var(--border-color);border-radius:50%;flex-direction:column;align-self:end;align-items:center;row-gap:3px;width:36px;height:36px;display:flex;position:relative}.hamburger-menu span{background-color:var(--text-primary);width:20px;height:2px;transition:all .4s;position:absolute}.hamburger-menu .top{top:10px}.hamburger-menu .middle{top:16px}.hamburger-menu .bottom{top:22px}.hamburger-menu.exe .top{animation:.15s linear forwards exeMakeOne;top:16px}.hamburger-menu.exe .bottom{animation:.3s linear forwards exeMakeTwo;top:16px}.hamburger-menu.exe .middle{opacity:0}@keyframes exeMakeOne{to{transform:rotate(225deg)}}@keyframes exeMakeTwo{to{transform:rotate(-45deg)}}.hero{flex-direction:column;align-items:center;min-height:55vh;margin-bottom:10px;padding:0 24px;display:flex}@media (width>=768px){.hero{flex-direction:row;min-height:70vh;padding:0 40px}.hero .image{display:inline-block}}@media (width<=767px){.hero .image{display:none}}.hero p{margin:0}.hero-txt .level{margin-top:2px;font-weight:600}.hero-txt p:first-child{line-height:normal}.hero-txt p .intro{font-size:small}.hero-txt p .name{font-size:45px;font-weight:bolder}.hero-txt .primary{margin-top:14px;font-size:medium;font-weight:300}.hero .quick-links{gap:12px;margin-top:33px;display:flex}.hero .quick-links a{border-radius:50%;width:24px;height:24px;padding:0}.hero .quick-links a img{object-fit:contain;border-radius:50%;width:100%;height:100%}.hero .rsm-btn-cont{margin-top:24px}.hero .download-rsm-btn{background-color:var(--btn-bg);color:var(--bg-color);cursor:pointer;border-radius:6px;padding:4px 6px;text-decoration:none}.hero .download-rsm-btn:hover{background-color:var(--text-primary)}.hero .image{border:3px solid var(--border-secondary);width:250px;height:240px;box-shadow:0 0 4px var(--bg-white);background-color:var(--bg-color);border-radius:50%;margin-left:180px;padding:2px;position:relative}.hero .image:before,.hero .image:after{content:"";z-index:-1;border:1px solid var(--border-color);border-radius:40px;width:120px;height:80px;position:absolute;top:50px}.hero .image:before{right:-40px;transform:rotate(-45deg)}.hero .image:after{left:-40px;transform:rotate(45deg)}.hero .image img{object-fit:cover;border-radius:50%;width:100%;height:100%}.hero .code-snapshot{border-top-left-radius:5px;border-top-right-radius:5px;width:90%;height:250px;margin:60px 0;box-shadow:0 0 0 4px gray}.about{margin-top:100px;padding:0 40px}@media (width<=648px){.about{padding:0 24px}}.about .title{margin:52px 0;font-size:x-large;font-weight:700}.about .image{border:3px solid var(--border-secondary);border-radius:20px;width:215px;height:240px;padding:2px;display:inline-block}@media (width>=768px){.about .image{display:none}}.about .image img{object-fit:cover;border-radius:inherit;width:100%;max-width:250px;height:100%}.snapshot{margin-top:40px;padding:0 40px}@media (width<=648px){.snapshot{padding:0 24px}}.snapshot .title{margin:52px 0;padding:0 0 4px;font-size:x-large;font-weight:700}.snapshot .cards-cont{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:48px 34px;display:grid}.snapshot .cards-cont .card{box-shadow:0 0 20px var(--border-color);border-radius:10px;padding:28px 12px}.cards-cont .card .icon-cont{justify-content:center;align-items:center;margin:5px 0 50px;display:flex}.cards-cont .card .icon-cont .bg-white{background-color:#fff}.cards-cont .card .icon{border-radius:4px;justify-content:center;align-items:center;width:43px;height:43px;display:flex}.crds-cont .card .icon img{width:100%}.cards-cont .card .card-title{margin:18px 0;font-weight:700}.cards-cont .card .card-txt{font-size:medium}.skills{margin-top:100px;padding:0 40px}@media (width<=648px){.skills{padding:0 24px}}.skills .title{margin:52px 0;font-size:x-large;font-weight:700}.skills .skills-track{display:flex;position:relative;overflow:hidden}.skills .skills-cards-cont{gap:60px;width:100%;display:flex}.skills .skills-card{justify-content:center;gap:50px;display:flex}.skills .skills-track:before,.skills .skills-track:after{content:"";z-index:10;filter:blur(2px);border-radius:10px;width:20px;height:200px;position:absolute}.skills .skills-track:before{background:linear-gradient(to right, var(--bg-color), var(--bg-color), var(--skills-side-blur));filter:blur(3px);left:-5px}.skills .skills-track:after{background:linear-gradient(to left, var(--bg-color), var(--bg-color), var(--skills-side-blur));filter:blur(3px);right:-5px}@keyframes scroll-left{0%{transform:translate(105%)}to{transform:translate(-3250px)}}@media (width<=1800px){.skills .skills-track{width:85vw}.skills .skills-cards-cont{animation:36s linear infinite scroll-left}}.skills .skills-track:hover .skills-cards-cont{cursor:pointer;animation-play-state:paused}.skills .skills-track:focus .skills-cards-cont{animation-play-state:paused}.skills .card .card-title{text-align:center;white-space:nowrap;margin:18px 0;font-size:small;font-weight:700}.skills .skills-cont{justify-content:center;gap:68px;display:flex}.skills .skill-cont{width:40px}.skills .skill-cont .icon{width:50px;height:50px;padding:2px}.skills .skill-cont .icon img{object-fit:contain;width:100%}.skills .skill-cont .icon .image{border-radius:50%}.skills .skill-cont .icon .react{animation:8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.skills .skill-cont .tag{color:var(--text-secondary);text-align:center;font-size:small}.skills .skill-cont .level{color:#b0aaaa;font-size:12px}.projects{margin-top:100px;margin-bottom:24px;padding:0 40px}@media (width<=648px){.projects{padding:0 24px}}.projects .title{margin:52px 0;font-size:x-large;font-weight:700}.projects .projects-cont{grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:52px 28px;display:grid}.projects-cont .project{border:1px solid var(--border-secondary);border-radius:6px;position:relative}.projects-cont .project .stack{flex-wrap:wrap;gap:4px;display:flex;position:absolute;top:0;right:2px}.projects-cont .project .stack div{background-color:var(--nav-links-bg);color:var(--text-secondary);opacity:.9;border-radius:8px;padding:0 4px;font-size:x-small}.video .project .details,.projects-cont .project .details{margin:16px 0;padding:2px 12px}.video .project .description,.projects-cont .project .details .description{font-size:16px}.video .project .project-title,.projects-cont .project .project-title{font-weight:600}.projects-cont .project .links{gap:20px;margin:34px 0;display:flex}.projects-cont .project .links .demo-link{background-color:var(--btn-bg);color:var(--bg-color);border-radius:4px;padding:1px 5px;text-decoration:none}.projects-cont .project .links .demo-link:hover{background-color:var(--text-primary)}.projects-cont .project .links .code-link{border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;padding:0;display:flex}.projects-cont .project .links .code-link:hover{transition:all .1s;transform:translateY(-4px)}.projects-cont .project .image{height:156px}.projects-cont .project .image img{object-fit:cover;border-top-left-radius:6px;border-top-right-radius:6px;width:100%;height:100%}.projects .my-own{margin:16px 0}.projects .tutorials{margin-top:50px}.projects .tutorials .type,.projects .my-own .type{text-align:center;color:var(--text-secondary);margin-bottom:24px;font-size:small}.view-more-btn-cont{justify-content:center;margin-top:36px;display:flex}.view-more-btn-cont a{text-align:center;background-color:var(--bg-color);cursor:pointer;width:200px;color:var(--text-primary);cursor:pointer;border-radius:12px;padding:6px;text-decoration:none;transition:all .5s}.view-more-btn-cont a:hover{transform:scale(1.05)}.toggle-btn-cont{justify-content:end;margin:10px 0;display:flex}.toggle-btn-cont button{border:1px solid var(--border-color);cursor:pointer;border-radius:4px;padding:3px 6px}.toggle-btn-cont button:hover{background-color:#dcdcdc;transition:all .5s}.video{margin:56px 0}.video .project{border:1px solid var(--border-secondary);border-radius:6px;width:100%;max-width:360px}.video .project iframe{border-radius:6px;width:100%;height:158px}@media (width>=767px){.get-in-touch form .input-cont{flex-direction:row;gap:56px}.get-in-touch .head-txt{text-align:center;padding:0 100px}.get-in-touch .input-cont .textarea{height:auto}}.get-in-touch{margin-top:100px;padding:0 40px}@media (width<=648px){.get-in-touch{padding:0 24px}}.get-in-touch .title{margin:52px 0;font-size:x-large;font-weight:700}.get-in-touch form{flex-direction:column;margin:24px 0;display:flex}.get-in-touch .input-cont{flex-direction:column;gap:20px;display:flex}.get-in-touch form .input-cont div{flex:1}.get-in-touch form .input-cont .msg-cont,.get-in-touch form .input-cont .name-cont,.get-in-touch form .input-cont .email-cont{flex-direction:column;gap:6px;margin:10px 0;display:flex}.get-in-touch form .input-cont input{border:1px solid var(--border-color);border-radius:4px;padding:14px 10px}.get-in-touch form .input-cont input:focus,.get-in-touch form .input-cont .textarea:focus{border:1px solid #00f;outline:none}.get-in-touch .input-cont .textarea{border:1px solid var(--border-color);border-radius:4px;height:100px;padding:12px}.get-in-touch form button{background-color:var(--btn-bg);color:var(--bg-color);border:1px solid var(--border-color);cursor:pointer;border-radius:4px;align-self:end;align-items:center;gap:3px;margin-top:12px;padding:3px 12px;display:flex}.get-in-touch form label{margin-bottom:4px;font-size:13px}.get-in-touch form button img{width:12px}.get-in-touch form button:hover{background-color:var(--text-primary)}.footer{background-color:var(--nav-links-bg);border-radius:6px;margin-top:78px;margin-left:40px;margin-right:40px;padding:16px}@media (width<=648px){.footer{margin-left:12px;margin-right:12px}}.footer .heading{color:var(--text-secondary);font-weight:600}.footer .contacts{border:1px solid var(--skills-side-blur);border-radius:20px;justify-content:space-between;align-items:center;max-width:600px;padding:4px;display:flex}@media (width<=648px){.footer .contacts{flex-direction:column;align-items:start;gap:16px}}.footer .contacts div{align-items:center;gap:10px;display:flex}.footer .contacts div img{width:18px}.footer .contacts span{color:var(--text-secondary);font-size:14px}hr{margin-top:25px}.footer .copyright{text-align:center}