@font-face{font-family:OpenSans;src:url(/_next/static/media/OpenSans-VariableFont_wdth,wght.abb0f3a0.ttf) format("truetype");font-display:swap}@font-face{font-family:PlayfairDisplay;src:url(/_next/static/media/PlayfairDisplay-VariableFont_wght.c0f850b7.ttf) format("truetype");font-display:swap}@font-face{font-family:Kalam;src:url(/_next/static/media/Kalam-Regular.a6865ae4.ttf) format("truetype");font-display:swap}*{scroll-behavior:smooth;box-sizing:border-box;margin:0;padding:0;font-family:PlayfairDisplay,sans-serif}body{background-color:#f8f8f8;color:#333;font-size:16px;line-height:1.5}a{text-decoration:none;color:inherit}#root{display:flex;flex-direction:column;align-items:center;max-width:1200px;min-width:390px;margin:0 auto;padding:0 20px}.particles{width:100%;position:absolute;top:0;left:0;z-index:-1}h1,h2,h3{margin-bottom:20px;font-weight:semi-bold}h1{font-size:2.5em;font-weight:800}h2{font-size:2em}h3{font-size:1.5em}h4{font-size:1.2em}button{display:flex;align-items:center;height:100%;gap:4px;background-color:#007bff;color:#fff;border:none;border-radius:5px;padding:6px 10px;cursor:pointer;transition:background-color .3s ease}button:hover{background-color:#0056b3}img{border-radius:8px}.header{justify-content:space-between;color:#fff;background-color:#6b394e;width:100%;padding:20px;border-radius:0 0 10px 10px;box-shadow:0 5px 6px rgba(0,0,0,.2)}.header,.header__id{display:flex;align-items:center}.header__id{justify-content:center;gap:10px}.header__name{font-family:Kalam,cursive}.header__links{display:flex;align-items:center}.header__icon,.header__links a{margin:0 15px;text-decoration:none;color:inherit;transition:text-shadow .3s ease;text-shadow:2px 2px 2px rgba(0,0,0,.5)}.header__icon:hover,.header__links a:hover{text-shadow:6px 6px 6px hsla(0,0%,77%,.8)}.header__icon{display:flex;align-items:center}.about-me,.experiences,.hero,.projects{display:flex;flex-direction:column;align-items:center;justify-content:center;max-width:900px;background-color:hsla(0,0%,97%,.9);border-radius:10px;box-shadow:0 5px 15px rgba(0,0,0,.1)}.hero__resume--link a{color:#007bff}.hero__gh-li--links{display:flex;align-items:center;gap:10px}.hero__resume--link a:hover{text-decoration:underline}.hero{margin:50px;padding:50px}.hero,.hero__info{display:flex;flex-direction:column;align-items:center}.hero__info{gap:12px}.hero__bio,.hero__name,.hero__title{text-align:center}.about-me__content{margin-bottom:20px}.about-me{padding:30px;margin-bottom:50px}.about-me__bullets{width:90%;margin-bottom:20px}.skills{display:flex;justify-content:space-between;margin-bottom:50px}.skills__container{display:flex;flex-direction:column;align-items:flex-start;margin-bottom:20px}.skills__list h4,.skills__title{font-weight:700;margin-bottom:10px}.skills__area{display:flex;justify-content:space-between;flex-wrap:wrap}.skills__area--container{display:inline-block;padding:5px 15px;margin-right:10px;margin-bottom:16px}.skills__area-item,.skills__item-backend,.skills__item-frontend{display:inline-block;background-color:#0070f3;color:#fff;border-radius:20px;padding:5px 15px;margin-right:10px;margin-bottom:5px;text-align:center;cursor:pointer;box-shadow:0 5px 10px rgba(0,0,0,.2);transition:all .3s ease}.skills__area-item:hover,.skills__item-backend:hover,.skills__item-frontend:hover{transform:translate(-1px,-3px);box-shadow:0 10px 20px rgba(0,0,0,.2)}.skills__list--backend,.skills__list--frontend{margin-left:20px}.skills__area--container .skills__area:hover,.skills__item-backend:hover,.skills__item-frontend:hover{background-color:#005bb5}.time{font-style:italic}.experience__container,.project__container,.skills__area{display:flex;flex-direction:column;align-items:flex-start}.experiences,.projects{padding:30px;margin-bottom:50px}.experience,.project{display:flex;justify-content:space-between;margin-bottom:50px;width:90%}.experience__container,.project__container{display:flex;align-items:center;border:1px solid #e0e0e0;margin-bottom:20px;padding:15px;background-color:hsla(0,0%,97%,.9);border-radius:10px}.experience__container--content{flex-direction:column}.experience__container--content,.project__container--content{display:flex;align-items:center;margin:12px}.experience__container--title,.project__container--title{width:80%;background-color:#6b394e;border-radius:5px;color:#fff;padding:10px;text-align:center}.experience__container--title h3,.project__container--title h3{margin-bottom:6px}.experience__container--info,.project__container--info{display:flex;flex-direction:column;margin:12px}.experience__container--bullets,.project__container--bullets{padding:8px 0 8px 16px}.experience__container,.project__container--links{display:flex;align-items:center;margin-top:10px;gap:10px}.tech-stack__item{font-style:italic}.separator{font-style:normal}.contact{display:flex;flex-direction:column;justify-content:flex-start;padding:40px;background-color:hsla(0,0%,97%,.9);border-radius:10px;box-shadow:0 5px 15px rgba(0,0,0,.1);width:50%;margin:20px 0 60px}.contact__title{align-self:center;font-size:2em;margin-bottom:25px;color:#333;font-weight:800}.contact label{font-size:1em;margin-bottom:8px;margin-top:15px;font-weight:semi-bold}.contact input,.contact textarea{width:100%;padding:10px;border:1px solid #ddd;border-radius:5px;margin-bottom:20px;font-size:.9em;font-family:OpenSans,sans-serif}.contact textarea{height:150px;resize:vertical}.contact button{align-self:center;gap:8px}.contact div{margin-top:10px}.contact p{color:green;font-weight:semi-bold}.contact span{color:red}.buttonMessage{align-self:flex-end;gap:10px;font-size:small}.buttonMessage,.footer{display:flex;align-items:center}.footer{justify-content:center;gap:30px;color:#fff;background-color:#6b394e;width:100%;height:100px;padding:20px;border-radius:10px 10px 0 0;box-shadow:0 -5px 6px rgba(0,0,0,.2)}@media (max-width:768px){.header{flex-direction:column;padding:15px}.header,.header__icon,.header__links{gap:10px}.header__links a{margin:0 2px;text-align:center}.hero__name{margin-top:20px;font-size:30px}.experiences,.projects{padding:10px}.experience,.project{width:100%}.experience__container,.experience__container--content,.project__container,.project__container--content{flex-direction:column;padding:10px 5px;margin:0}.experience__container--image img,.project__container--image img{max-width:100%;height:auto}.contact{width:90%}}