:root{--accent:#ffb100;--bg:#000;--bg-panel:#111;--text:#797979;--text-strong:#fff;--muted:#a0a0a0;--side-width:280px;--font-body:"Poppins", sans-serif;--font-heading:"Montserrat", sans-serif;--font-script:"Kaushan Script", cursive}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%}body{font-family:var(--font-body);background:var(--bg);color:var(--text);margin:0;font-size:13px;font-weight:300;line-height:1.9;overflow:hidden}img{max-width:100%;display:block}a{color:inherit;text-decoration:none;transition:color .2s}a:hover{color:var(--accent)}button{font:inherit;cursor:pointer}ul{margin:0;padding-left:1.1rem}h1,h2,h3,h4,h5{font-family:var(--font-heading);color:var(--text-strong);font-weight:600;line-height:1.3}h1{font-size:2rem}h2{font-size:1.8rem}h3{font-size:1.1rem}h4{font-size:1rem}h5{color:var(--muted);font-size:.85rem;font-weight:500}.app-shell{height:100%}.page-loader{z-index:1000;background:var(--bg);place-items:center;display:grid;position:fixed;inset:0}.loader{border:3px solid #ffb10033;border-top-color:var(--accent);border-radius:50%;width:42px;height:42px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.mob-menu{z-index:40;background:#0a0a0a;border-bottom:1px solid #1f1f1f;display:none;position:fixed;top:0;left:0;right:0}.mob-menu-content{justify-content:space-between;align-items:center;padding:.85rem 1rem;display:flex}.menu-title{font-family:var(--font-heading);color:var(--text-strong);margin:0;font-weight:600}.navbar-toggle{background:0 0;border:0;gap:5px;width:28px;padding:0;display:grid}.navbar-toggle .icon-bar{background:var(--text-strong);height:2px;display:block}.mob-menu-overlay,.mob-menu-close{display:none}.side-left{width:var(--side-width);z-index:30;background:#0a0a0a;border-right:1px solid #1c1c1c;position:fixed;top:0;bottom:0;left:0;overflow-y:auto}.menu-wrapper,.intro-content{flex-direction:column;min-height:100%;display:flex}.intro-content{justify-content:space-between;padding:2rem 1.25rem 1.5rem}.profile{border:3px solid #222;border-radius:50%;width:120px;height:120px;margin:0 auto 1rem;overflow:hidden}.profile img{object-fit:cover;width:100%;height:100%}.vertical-menu h1{text-align:center;margin:0 0 .35rem;font-size:1.25rem}.get-in-touch{text-align:center;color:var(--muted);letter-spacing:.08em;text-transform:uppercase;margin-bottom:.85rem;font-size:.75rem}.menu-social-icons{justify-content:center;gap:.75rem;margin-bottom:1.5rem;display:flex}.menu-social-icons a{color:var(--muted);font-size:1rem}.menu-social-icons a:hover{color:var(--accent)}.menu_list{text-align:center;margin:0;padding:0;list-style:none}.menu_list li+li{margin-top:.55rem}.menu_list a{text-transform:uppercase;letter-spacing:.12em;color:var(--muted);font-size:.72rem;font-weight:500;display:inline-block}.menu_list a:hover,.menu_list a.active_item{color:var(--accent)}.copyright{text-align:center;color:#555;margin:2rem 0 0;font-size:.7rem}.main-content{margin-left:var(--side-width);height:100%;position:relative}.section-pane{height:100%}.section-pane[hidden]{display:none}.sec_content{height:100%}.sec__content{background:radial-gradient(at 100% 0,#ffb10014,#0000 45%),linear-gradient(#0d0d0d 0%,#111 100%);height:100%;padding:4rem 0;overflow-y:auto}.container{width:min(1100px,100% - 3rem);margin:0 auto}.sec_title{margin-bottom:2.5rem}.sec_title h2{margin:0;padding-bottom:.65rem;display:inline-block;position:relative}.sec_title h2:after{content:"";background:var(--accent);width:48px;height:3px;position:absolute;bottom:0;left:0}.subtitle{margin:0 0 1.25rem;padding-bottom:.45rem;display:inline-block;position:relative}.subtitle:after{content:"";background:var(--accent);width:28px;height:2px;position:absolute;bottom:0;left:0}.bttn{appearance:none;border:2px solid var(--accent);color:var(--text-strong);text-transform:uppercase;letter-spacing:.08em;background:0 0;padding:.85rem 1.4rem;font-size:.7rem;font-weight:600;transition:background .2s,color .2s}.bttn:hover,.bttn_bg_color{background:var(--accent);color:#111}.bttn_bg_color:hover{filter:brightness(1.05)}.home{background:linear-gradient(#000000b8,#000000d1),radial-gradient(circle at 30% 20%,#ffb1002e,#0000 40%),#050505;place-items:center;display:grid;position:relative}.home__inner{text-align:center;padding:2rem}.home__headline{margin:0 0 1.75rem;font-size:clamp(1.8rem,4vw,3rem);font-weight:700}.typed-text__accent{color:var(--text-strong)}.typed-cursor{color:var(--accent);margin-left:2px;animation:1s step-end infinite blink}@keyframes blink{50%{opacity:0}}.home_btns{flex-wrap:wrap;justify-content:center;gap:.85rem;display:flex}.about__intro{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:start;gap:2rem;margin-bottom:3rem;display:grid}.about__image img{border:1px solid #2a2a2a;width:100%}.more-about-me p,.more_info p{margin:0}.more_info{margin-top:1.25rem}.more_info a{color:var(--accent)}.services{margin-top:1rem}.services__grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem;margin-top:1rem;display:grid}.service-item{background:#ffffff05;border:1px solid #222;padding:1.25rem}.font-icon{margin-bottom:.75rem}.font-icon i{color:var(--accent);font-size:1.5rem}.service_content h3{margin:0 0 .5rem}.service_content p{margin:0;font-size:.85rem}.badges{margin-top:3rem}.codersrank-link{color:var(--accent);text-transform:uppercase;letter-spacing:.08em;margin-top:.5rem;font-size:.75rem;font-weight:600;display:inline-block}.resume__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:2.5rem;display:grid}.skills-row{margin-top:2rem}.resume .item{margin-bottom:1.75rem;padding-left:1.25rem;position:relative}.resume .item:before{content:"";background:var(--accent);border-radius:50%;width:8px;height:8px;position:absolute;top:.35rem;left:0}.resume .date{color:var(--accent);margin-bottom:.35rem;font-size:.8rem}.resume .date i{margin-right:.35rem}.resume .content h4{margin:0 0 .2rem}.resume .content h5{margin:.35rem 0}.resume .content p{margin:.35rem 0 0}.resume .content ul{margin-top:.5rem}.skills .skill{border-bottom:1px solid #222;padding:.55rem 0}.skills .skill .name{color:var(--text-strong);margin:0;font-size:.85rem;font-weight:500}.ul-filter{flex-wrap:wrap;gap:.75rem 1.25rem;margin:0 0 1.75rem;padding:0;list-style:none;display:flex}.ul-filter button{color:var(--muted);text-transform:uppercase;letter-spacing:.1em;background:0 0;border:0;padding:0;font-size:.72rem;font-weight:600}.ul-filter button:hover,.ul-filter button.active_filter{color:var(--accent)}.portfolio__grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.25rem;display:grid}.project_content{text-align:left;background:#151515;border:0;width:100%;padding:0;display:block;position:relative;overflow:hidden}.project_content .my__img img{aspect-ratio:4/3;object-fit:cover;width:100%;transition:transform .35s}.project_content .info{opacity:0;text-align:center;background:#000000b8;place-items:center;padding:1rem;transition:opacity .25s;display:grid;position:absolute;inset:0}.project_content:hover .info,.project_content:focus-visible .info{opacity:1}.project_content:hover .my__img img{transform:scale(1.05)}.project_content .info h3{margin:0 0 .35rem;font-size:1rem}.project_content .info p{color:var(--accent);margin:0;font-size:.75rem}.project-modal{z-index:80;place-items:center;padding:1.5rem;display:grid;position:fixed;inset:0}.project-modal__backdrop{background:#000c;border:0;position:absolute;inset:0}.project-modal__panel{z-index:1;background:#121212;border:1px solid #2a2a2a;width:min(960px,100%);max-height:min(90vh,900px);padding:1.5rem;position:relative;overflow:auto}.project-modal__close{color:var(--text-strong);background:0 0;border:0;font-size:1.1rem;position:absolute;top:.75rem;right:.75rem}.project-modal__grid{grid-template-columns:1fr 1fr;gap:1.5rem;display:grid}.project-modal__media{gap:.85rem;display:grid}.project-modal__info h3{margin-top:0}.project_info{margin:0 0 1rem;padding:0;list-style:none}.project_info li{margin-bottom:.35rem}.project_info span{color:var(--accent)}.project-modal__links{flex-wrap:wrap;gap:.75rem;margin-top:1rem;display:flex}.demo{border:1px solid var(--accent);color:var(--accent);text-transform:uppercase;letter-spacing:.08em;padding:.65rem 1rem;font-size:.7rem;font-weight:600;display:inline-block}.demo:hover{background:var(--accent);color:#111}.contact__grid{grid-template-columns:1fr 1fr;gap:2.5rem;display:grid}.contact .info .item{grid-template-columns:auto 1fr;align-items:start;gap:.85rem;margin-bottom:1.25rem;display:grid}.contact .info .icon{width:42px;height:42px;color:var(--accent);background:#ffb1001f;border-radius:50%;place-items:center;display:grid}.contact .info span{color:var(--text-strong);font-size:.8rem;font-weight:600;display:block}.contact .info p{margin:.15rem 0 0}.social-title{margin-top:2rem}.contact-form{align-content:start;gap:.9rem;display:grid}.contact-form__field{gap:.35rem;display:grid}.contact-form__field span{color:var(--text-strong);font-size:.8rem;font-weight:600}.contact-form input,.contact-form textarea{width:100%;color:var(--text-strong);font:inherit;background:#0a0a0a;border:1px solid #2a2a2a;padding:.8rem .9rem}.contact-form input:focus,.contact-form textarea:focus{outline:1px solid var(--accent);border-color:var(--accent)}.contact-form .bttn{justify-self:start;margin-top:.35rem}.contact-form__status{margin:.25rem 0 0;font-size:.85rem}.contact-form__status.is-success{color:#7dcea0}.contact-form__status.is-error{color:#e07474}@media (width<=992px){body{overflow:auto}.side-left{width:min(280px,85vw);transition:transform .25s;transform:translate(-105%)}.side-left.is-open{transform:translate(0)}.mob-menu,.mob-menu-overlay.is-open,.mob-menu-close.is-open{display:block}.mob-menu-overlay{z-index:25;background:#0000008c;border:0;position:fixed;inset:0}.mob-menu-close{z-index:35;color:var(--text-strong);background:0 0;border:0;font-size:1.25rem;position:fixed;top:1rem;right:1rem}.main-content{height:auto;min-height:100%;margin-left:0;padding-top:56px}.section-pane,.sec_content,.sec__content{height:auto;min-height:calc(100vh - 56px)}.about__intro,.services__grid,.resume__grid,.portfolio__grid,.project-modal__grid,.contact__grid{grid-template-columns:1fr}}@media (width<=640px){.container{width:calc(100% - 2rem)}.sec__content{padding:2.5rem 0}.portfolio__grid{grid-template-columns:1fr}}