.hero{justify-content:center;align-items:center;gap:var(--sp-md);width:100%;margin-top:80px;display:flex}.heroContent{flex-direction:column;width:65%;height:100%;display:flex}.heroBtns{width:fit-content;margin:var(--sp-sm)0;justify-content:center;align-items:center;gap:.5rem;display:flex}.heroImage{border-radius:20px;width:35%;height:100%;position:relative}.heroImageOverlay{width:350px;height:400px;margin-top:var(--sp-md);transition:all .5s;position:relative}@property --angle{syntax:"<angle>";inherits:false;initial-value:0deg}.heroImageOverlay:hover:before{filter:blur(2.5rem);opacity:.9}.heroImageOverlay:after,.heroImageOverlay:before{content:"";box-sizing:content-box;background-image:conic-gradient(from var(--angle),var(--color-mainConic));z-index:-1;border-radius:20px;width:100%;height:100%;padding:5px;animation:3s linear infinite spin;position:absolute;top:50%;left:50%;translate:-50% -50%}@keyframes spin{0%{--angle:0}to{--angle:360}}.heroImageOverlay:before{filter:blur(1.5rem);opacity:.7}.heroImageOverlay{animation:3s linear infinite alternate oscillation}@keyframes oscillation{to{transform:translateY(0)}0%{transform:translateY(-30px)}}@media (max-width:1100px){.hero{text-align:center;gap:calc(var(--sp-sm)-5px);flex-wrap:wrap}.heroContent{gap:var(--sp-sm);width:100%;margin-top:var(--sp-sm)}.heroBtns{margin:var(--sp-sm)auto}.heroImage{justify-content:center;align-items:center;width:100%;display:flex}.heroImageOverlay{width:250px;height:300px}}
.marquee{width:100%;padding:20px 0;display:flex;overflow-x:auto}.marquee::-webkit-scrollbar{display:none}.marquee__track{justify-content:center;align-items:center;animation:15s linear infinite scroll;display:flex}.icon{margin:0 var(--sp-sm);color:#fff}@keyframes scroll{0%{translate:0}to{translate:-100%}}
.navbar{justify-content:center;align-items:center;gap:var(--sp-sm);width:fit-content;max-width:100%;height:50px;padding:0 calc(var(--sp-sm)*2);z-index:1000;margin-left:auto;margin-right:auto;transition:all .3s;display:flex;position:fixed;top:20px;left:50%;transform:translate(-50%)}.navbarScrolled{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0009;box-shadow:0 10px 30px #0000004d}.navlink{font-size:var(--fs-text);font-weight:var(--fw-bold);transition:all .4s}.navlink:hover{background:var(--color-main);color:#0000;-webkit-background-clip:text;background-clip:text;transform:translateY(-3px)}
.skillsBlocks{justify-content:center;gap:var(--sp-sm);flex-wrap:wrap;display:flex}.skillsBlock{width:350px;padding:var(--sp-sm);flex-direction:column;display:flex}.skillsBlock:hover{transform:translateY(-8px)}.skillType{margin-bottom:var(--sp-sm);text-align:center}@media (max-width:800px){.skillsBlock{width:100%}}
.skillBar{flex-direction:column;margin:1rem 0;display:flex}.skillName{margin-bottom:.4rem;position:relative}.skillNameHover{border-radius:2px;width:fit-content;height:fit-content;padding:3px 5px;font-size:.8rem;font-weight:500;display:none;position:absolute;top:-30px;left:0}.skillName:hover .skillNameHover{display:block}.skillMainHealth{background-color:#000;border-radius:5px;width:100%;height:5px;overflow:hidden}.skillHealth{background:var(--color-main);max-width:100%;height:100%}
.projects{justify-content:center;gap:var(--sp-sm);padding:var(--sp-sm);display:flex}.projectBox{justify-content:center;gap:var(--sp-sm);flex-wrap:wrap;display:flex}.projects:hover{transform:scale(1.01)}.projectContent,.projectImage{width:50%;height:100%}.projectContent{flex-direction:column;gap:.9rem;display:flex}.projectLinks{gap:.5rem;display:flex}.projectLink{cursor:pointer;border-radius:50%;justify-content:center;align-items:center;width:30px;height:30px;transition:all 3s;display:flex}.projectLink:hover{background:var(--color-main);border:none;transform:scale(1.01)}.projectImage{border:1px solid #fff;justify-content:center;align-items:center;display:flex;overflow:hidden}.projectImageWrapper{aspect-ratio:16/9;background-size:cover;width:100%;height:300px;position:relative}hr{background-color:#fff;height:1px}@media (max-width:800px){.projects{flex-flow:column-reverse wrap}.projectContent,.projectImage{width:100%}.projectImageWrapper{width:100%;height:auto}.projectContent{gap:.8rem}.projectDesc{font-size:1rem;font-weight:400}}@media (max-width:1100px){.projectImageWrapper{width:100%;height:auto}}
.projectCard{border-radius:18px;flex-direction:column;gap:16px;width:100%;max-width:400px;padding:20px;transition:transform .3s;display:flex;overflow:hidden}.projectCard:hover{transform:translateY(-6px)}.projectCardImgWrapper{justify-content:center;align-items:center;width:100%;height:200px;display:flex;position:relative}.projectCardImg{object-fit:cover;border-radius:12px}.projectCardContent{flex-direction:column;gap:12px;display:flex}.projectCardDesc{opacity:.9;-webkit-line-clamp:3;-webkit-box-orient:vertical;font-size:.9rem;line-height:1.5;display:-webkit-box;overflow:hidden}@media (max-width:600px){.projectCard{max-width:100%}.projectCardImgWrapper{height:160px}}
