*{margin:0;padding:0;box-sizing:border-box;font-family:Poppins,sans-serif;list-style:none;text-decoration:none;background:0 0}html{scroll-behavior:smooth}:root{--bg-dark:#121212;--white:#fafafa;--old-white:#d6d6d6;--shadow-1:-4px 8px 24px hsla(0, 0%, 0%, 0.125);--shadow-2:0 16px 30px hsla(0, 0%, 0%, 0.125);--shadow-3:0 16px 40px hsla(0, 0%, 0%, 0.125)}.badge{padding:4px 8px;border-radius:8px;font-size:12px;color:#fff;background-color:#383838;font-weight:600;display:flex;align-items:center;gap:2px}.badge img{width:16px;height:16px}body{margin-top:100px;background-color:var(--bg-dark);color:var(--white)}nav{white-space:nowrap;background-color:var(--bg-dark);z-index:999;position:fixed;top:0;width:100%;border-bottom:1px solid #383838;display:flex;justify-content:center}nav>div{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:860px;padding:20px}nav ul{display:flex;gap:16px}nav .nav-item a{color:var(--old-white);padding:8px 12px;border-radius:12px}.nav-item a.active,.nav-item a:hover{color:#ffdb70;background-color:#252525}.body{width:100%;max-width:860px;margin:auto;overflow:hidden}.container{padding:30px;margin:0 16px;margin-bottom:30px;border:1px solid #383838;background-color:#1e1e1f;border-radius:20px;box-shadow:var(--shadow-1)}section#hero{display:flex;gap:20px}#hero .content{flex:1;display:flex;flex-direction:column;justify-content:center}#hero .content #name{font-size:48px;font-weight:700;color:var(--white);white-space:nowrap}#hero .content .sub-title{margin-top:10px;display:flex;align-items:center;gap:16px}.ping{width:10px;aspect-ratio:1;background-color:#43ff62;border-radius:50%;position:relative;flex-shrink:0}.ping::before{content:'';flex-shrink:0;position:absolute;width:100%;height:100%;background-color:#43ff62;border-radius:50%;animation:ping 1.2s ease-out infinite}@keyframes ping{0%{transform:scale(1);opacity:100%}100%{transform:scale(3);opacity:0}}#hero .content h2{font-family:Orbitron,sans-serif;color:#ffdb70;font-size:20px;font-weight:600;letter-spacing:2px;margin-top:10px}#hero .content .description{margin-top:20px;display:flex;gap:4px;flex-wrap:wrap;align-items:center}#hero .content p{font-size:16px}#hero .content .cta-wrapper{gap:16px;margin-top:42px;margin-bottom:20px}#hero .content .cta-wrapper .cta,#hero .content .cta-wrapper button{margin-right:8px;color:#fff;padding:12px 20px;font-weight:600;background:linear-gradient(135deg,#f8a552,#e03f04);border-radius:16px;text-transform:capitalize;position:relative;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease;box-shadow:0 6px 12px rgba(0,0,0,.2);z-index:1}#hero .content .cta-wrapper a::before,#hero .content .cta-wrapper button::before{content:"";position:absolute;inset:1px;border-radius:inherit;background:linear-gradient(to bottom right,hsla(240,1%,18%,.25) 0,hsla(240,2%,11%,0) 100%),#202021;transition:.25s ease;z-index:-1}#hero .content .cta-wrapper a:hover,#hero .content .cta-wrapper button:hover{transform:translateY(-3px);box-shadow:0 12px 20px rgba(0,0,0,.3);background:linear-gradient(135deg,#f9b26b,#f94605)}#hero .content .cta-wrapper a:hover::before,#hero .content .cta-wrapper button:hover::before{background:linear-gradient(135deg,hsla(45,100%,71%,.25) 0,hsla(35,100%,68%,0) 60%),#202021}#hero .content .social-links{display:flex;margin-top:32px;margin-left:4px;gap:20px;width:max-content}#hero .profile-photo{flex:1;position:relative;border-radius:50%;height:300px;overflow:hidden}#hero .profile-photo img{width:100%;height:100%;object-fit:cover}#hero .profile-photo .status{width:100%;height:100%;object-fit:contain;position:absolute;left:0;transform:rotate(0);z-index:100}section>h2{padding:20px 24px;margin:0 -24px 16px;padding-top:0}#about h3{font-size:16px;margin-top:30px;margin-bottom:12px}#about .content{display:flex;gap:20px;align-items:start;justify-content:space-between}#about .content .avatar{flex-shrink:0;width:174px;aspect-ratio:1;overflow:hidden;border-radius:18px;position:relative}#about .content .avatar img{width:100%;height:100%;object-fit:cover}#about p:not(:last-child){margin-bottom:16px}#about .technologies .badge{gap:4px;font-size:13px}#about .technologies .badges img{width:18px;height:18px}#about .technologies .badges{display:flex;flex-wrap:wrap;gap:8px}#education li strong{font-weight:700}section#projects{background-color:transparent;box-shadow:none;border:none;padding:0}section#projects .card-wrapper .btn-wrapper{margin-top:32px}section#projects .card-wrapper{display:grid;grid-template-columns:1fr 1fr;gap:20px}section#projects .card h3{margin-bottom:8px}section#projects .card p{font-size:16px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}section#projects .technologies{margin-top:10px}section#projects .technologies .icons{margin-top:4px;display:flex;gap:10px}section#projects .technologies img{width:24px;aspect-ratio:1}.card{height:max-content;border-radius:14px;font-size:15px;box-shadow:0 16px 30px hsla(0,0%,0%,.25);background:linear-gradient(to bottom right,#3f3f3f 0,hsla(0,0%,25%,0) 50%);position:relative;z-index:1;color:#fafafa;overflow:hidden}.card::before{content:"";position:absolute;inset:1px;overflow:hidden;background:linear-gradient(to bottom right,hsla(240,1%,18%,.251) 0,hsla(240,2%,11%,0) 100%),#202021;border-radius:inherit;z-index:-1}.preview{flex-shrink:0;overflow:hidden;height:200px}.preview img{width:100%;height:100%;object-fit:cover;transition:.3s ease}.card .content{margin:16px}.card:hover .preview img{transform:scale(1.1)}.lists li{margin-bottom:30px;position:relative;padding-left:30px}.lists li::before{content:"";position:absolute;top:7px;left:4px;border-radius:50%;aspect-ratio:1;width:8px;box-shadow:0 0 0 4px #363636;background-color:#feca66;z-index:1}.lists li::after{content:"";background-color:#363636;height:calc(100% + 30px);top:7px;left:8px;width:1px;position:absolute;z-index:0}.lists li:last-child::after{display:none}section#expertise .lists li{margin-bottom:16px;font-size:14px}section#expertise .lists li::after{height:calc(100% + 16px)}.card .content h3{text-transform:capitalize;transition:.3s ease}.card:hover h3{color:#e4c466}#toggle-all-projects{margin-top:30px;height:44px;align-items:center;width:max-content;margin-left:auto;margin-right:auto}h5{font-size:14px;letter-spacing:.5px}.skill{display:block}.skill li .skill-label{display:flex;gap:8px}.skill li{padding:0;margin-bottom:25px}.skill strong{white-space:nowrap;font-size:15px;color:#fafafa;display:inline;margin-right:8px}.skill data{color:var(--old-white);font-size:15px}.skill-progress{width:100%;height:8px;border-radius:10px;background-color:#383838}.skill-progress .bar{margin-top:8px;background:linear-gradient(to right,#ffdb70,#ffbb5b);height:100%;border-radius:inherit;transition:.3s ease-in-out}#skills h2{margin:16px;margin-top:46px;padding:0}#skills .statistics{display:grid;grid-template-columns:1fr 1fr;grid-gap:6px;max-width:100%}.statistics .chart{display:flex;align-items:center;justify-content:center;overflow:hidden}#contact-form{display:grid;grid-template-columns:1fr 1fr;grid-gap:16px;margin-bottom:20px}.valid:focus{outline:3px solid #bca358}.invalid:focus{outline:3px solid #b84c4c}input,textarea{padding:15px 20px;color:#fafafa;font-weight:400;font-size:15px;border:1px solid #383838;border-radius:14px;outline:0;width:100%}textarea{resize:none;height:120px;grid-column:1/-1}.circle-gradient{position:relative}.circle-gradient::before{position:absolute;content:"";top:50%;left:50%;transform:translate(-50%,-50%);background:linear-gradient(135deg,#d1a854,#d13c0a);height:100%;aspect-ratio:1;border-radius:50%}#message-btn{display:flex;align-items:center;gap:8px;font-size:15px;outline:0;border:none;cursor:pointer;margin-left:auto;padding:16px 20px}button:disabled{filter:grayscale(100%);cursor:not-allowed!important}input::placeholder{color:#757575}@media screen and (max-width:770px){#about .content{flex-direction:column}#hero .content #name{font-size:40px}.card{padding:0}.preview{aspect-ratio:1/.5;border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom:1px solid #383838;margin:1px;height:auto}}@media screen and (max-width:680px){body{margin-top:60px}section#projects .card-wrapper{display:grid;grid-template-columns:1fr;gap:20px}#contact-form{grid-template-columns:1fr}.container{padding:24px 15px;margin:12px;margin-bottom:20px}nav>div{padding:0 16px;height:60px;font-size:15px}nav .nav-item a{padding:0}nav .nav-item a.active,nav .nav-item a:hover{background-color:transparent}nav ul{gap:20px}section#hero{display:flex;flex-direction:column-reverse}#hero .content #name{font-size:36px}#hero .content h2{font-size:18px}#hero .content{padding:0}#hero .profile-photo{flex:1;width:200px;height:200px}.skill li{margin-bottom:15px}.skill strong{font-weight:500;font-size:13px}.skill data{font-size:13px}#skills .statistics{display:flex;flex-direction:column-reverse;gap:20px}.statistics .chart{align-self:center;width:250px;height:250px}}@media screen and (max-width:550px){.card .content h3{color:#e4c466;font-size:18px;margin-bottom:8px}#message-btn{width:100%;justify-content:center}.card{padding:0}.preview{aspect-ratio:1/.5;border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom:1px solid #383838;margin:1px;height:auto}#skills .btn-wrapper{margin-top:10px;gap:8px;display:grid;grid-template-columns:repeat(3,1fr)}#skills .btn-wrapper .btn{padding:2.5px 9px;text-align:center}}@media (pointer:coarse){html{touch-action:pan-x pan-y}}