.header{z-index:100;background-color:var(--body-color);width:100%;position:fixed;bottom:0;left:0}@media only screen and (min-width:768px){.header{top:0;bottom:initial;padding:0 1rem}}@media only screen and (min-width:1024px){.header{padding:0}}.header.scrollHeader{box-shadow:0 -1px 4px var(--shadow-color)}.header .nav{justify-content:space-between;align-items:center;max-width:968px;height:3rem;display:flex}@media only screen and (min-width:768px){.header .nav{column-gap:1rem;height:3.5rem}}.header .nav .btnGroup{align-items:center;display:flex}.header .nav .btnGroup .changeTheme{color:var(--title-color);cursor:pointer;align-items:center;margin-right:1rem;font-size:1.25rem;display:flex}.header .nav .btnGroup .changeTheme:hover{color:var(--primary-color)}.header .nav .logo,.header .nav .toggleBtn{color:var(--title-color);font-weight:500}.header .nav .logo:hover,.header .nav .toggleBtn:hover{color:var(--primary-color)}.header .nav .logo .appIcon,.header .nav .toggleBtn .appIcon{display:block}@media only screen and (min-width:768px){.header .nav .logo .appIcon,.header .nav .toggleBtn .appIcon{display:none}}.header .nav .toggleBtn{cursor:pointer;font-size:1.1rem}@media only screen and (min-width:1024px){.header .nav .toggleBtn{display:none}}.header .nav .menu{opacity:0;z-index:-2;max-height:0;transition:max-height .3s}.header .nav .menu.showMenu{opacity:1;z-index:100;max-height:500px}@media screen and (max-width:767px){.header .nav .menu{background-color:var(--body-color);width:100%;box-shadow:0 -1px 4px var(--shadow-color);border-radius:4rem 4rem 0 0;position:fixed;bottom:0;left:0}.header .nav .menu.showMenu{padding:2rem 1.5rem 4rem}}@media only screen and (min-width:768px){.header .nav .menu{opacity:1;z-index:100;max-height:500px;margin-left:auto}}.header .nav .menu .list{grid-template-columns:repeat(3,1fr);gap:2rem}@media only screen and (min-width:768px){.header .nav .menu .list{column-gap:2rem;display:flex}}.header .nav .menu .list .link{width:100%;color:var(--title-color);flex-direction:column;align-items:center;font-size:.813rem;font-weight:500;display:flex}.header .nav .menu .list .link:hover{color:var(--primary-color)}@media only screen and (min-width:768px){.header .nav .menu .list .link{font-size:.938rem}.header .nav .menu .list .link .icon{display:none}}.header .nav .menu .list .activeLink .link{color:var(--primary-color)}.header .nav .menu .close{cursor:pointer;color:var(--primary-color);font-size:1.5rem;position:absolute;bottom:.5rem;right:1.3rem}.header .nav .menu .close:hover{color:var(--primary-color-alt)}@media only screen and (min-width:768px){.header .nav .menu .close{display:none}}.header .scrollup{opacity:0;background-color:var(--primary-color);z-index:99;border-radius:.4rem;align-items:center;padding:.3rem;transition:all .4s;display:flex;position:fixed;bottom:3rem;right:1rem}.header .scrollup:hover{background-color:var(--primary-color-alt)}.header .scrollup.show{opacity:.8;bottom:5rem}.header .scrollup .icon{color:#fff}
.home .container{gap:1rem}@media only screen and (min-width:768px){.home .container{row-gap:5rem}}.home .content{grid-template-columns:.5fr 3fr;align-items:center;padding-top:3.5rem}@media only screen and (min-width:768px){.home .content{grid-template-columns:max-content 1fr 1fr;column-gap:2rem;padding-top:5.5rem}}.home .social{grid-template-columns:max-content;row-gap:1rem;display:grid}.home .social .icon{color:var(--primary-color);font-size:1.25rem}.home .social .icon:hover{color:var(--primary-color-alt)}.home .image{background:var(--primary-color);border-radius:50%;width:200px;height:210px;overflow:hidden}@media only screen and (min-width:768px){.home .image{order:1;justify-self:center;width:240px;height:250px}}@media only screen and (min-width:1024px){.home .image{width:260px;height:270px;margin-left:5rem}}.home .image img{width:100%;position:relative;top:1rem}.home .data{grid-column:1/3}@media only screen and (min-width:768px){.home .data{grid-column:initial}}.home .data .title{font-size:2rem}.home .data .subtitle{color:var(--text-color);margin-bottom:.75rem;font-size:1.125rem;font-weight:500}.home .data .description{margin-bottom:2rem}.home .scrollButton{display:none}.home .scrollButton .button{color:var(--primary-color);transition:all .3s}.home .scrollButton .button:hover{transform:translateY(.25rem)}.home .scrollButton .button span{color:var(--title-color);margin-right:.25rem;font-size:.813rem;font-weight:500}
.about .aboutContainer{max-width:680px}.about .aboutContainer .data .description{text-align:center;margin-bottom:2.5rem}.about .aboutContainer .data .info{justify-content:space-evenly;margin-bottom:2.5rem;display:flex}@media only screen and (min-width:768px){.about .aboutContainer .data .info{justify-content:space-between}}.about .aboutContainer .data .info .title{color:var(--title-color);font-size:1.25rem;font-weight:600}.about .aboutContainer .data .info .name{font-size:.75rem}.about .aboutContainer .data .info .title,.about .aboutContainer .data .info .name{text-align:center;display:block}.about .aboutContainer .data .buttonsContainer{justify-content:center;display:flex}
.skills .skillsContainer{gap:2.5rem}@media only screen and (min-width:768px){.skills .skillsContainer{grid-template-columns:repeat(2,1fr)}}.skills .content .skillsHeader{cursor:pointer;align-items:center;display:flex}.skills .content .skillsHeader .icon,.skills .content .skillsHeader .arrow{color:var(--primary-color);font-size:2rem}.skills .content .skillsHeader .icon{margin-right:.75rem}.skills .content .skillsHeader .arrow{margin-left:auto;transition:all .4s}.skills .content .skillsHeader .title{font-size:1.125rem}.skills .content .skillsHeader .subtitle{font-size:.813rem}.skills .content .list{row-gap:1.5rem;padding:1rem 0 0 2.7rem;transition:all .3s}.skills .content .list .data .title{justify-content:space-between;margin-bottom:.5rem;display:flex}.skills .content .list .data .title .name{font-size:.938rem;font-weight:500}.skills .content .list .data .bar,.skills .content .list .data .percentage{border-radius:.25rem;height:5px}.skills .content .list .data .bar{background-color:var(--primary-color-lighter)}.skills .content .list .data .bar .percentage{background-color:var(--primary-color);display:block}.skills .content.open .list{max-height:100vh;margin-bottom:2.5rem}@media only screen and (min-width:768px){.skills .content.open .list{margin-bottom:0}}.skills .content.open .arrow{transform:rotate(-180deg)}.skills .content.close .list{max-height:0;padding-top:0;overflow:hidden}
.services .servicesContainer{grid-template-columns:repeat(2,1fr);gap:1.5rem}@media only screen and (min-width:768px){.services .servicesContainer{grid-template-columns:repeat(2,230px);justify-content:center}}.services .servicesContainer .content{background-color:var(--container-color);box-shadow:0 2px 4px var(--shadow-color);border-radius:.25rem;padding:3.5rem .5rem 1.25rem 1.5rem;transition:all .3s;position:relative}.services .servicesContainer .content:hover{box-shadow:0 4px 8px var(--shadow-color)}@media only screen and (min-width:768px){.services .servicesContainer .content{padding:6rem 0 2rem 2.5rem}}.services .servicesContainer .content .serviceIcon{color:var(--primary-color);margin-bottom:1rem;font-size:1.5rem;display:block}@media only screen and (min-width:768px){.services .servicesContainer .content .serviceIcon{width:2rem;height:2rem}}.services .servicesContainer .content .title{margin-bottom:1rem;font-size:1.125rem;font-weight:500}.services .servicesContainer .content .servicesButton{cursor:pointer;font-size:.813rem}.services .servicesContainer .content .servicesButton:hover .icon{transform:translate(.25rem)}
.modal{z-index:999;opacity:0;visibility:hidden;background-color:#00000080;justify-content:center;align-items:center;padding:0 1rem;transition:all .3s;display:flex;position:fixed;inset:0}.modal.activeModal{visibility:visible;opacity:1}.modal .modalContent{background-color:var(--container-color);border-radius:.5rem;padding:1.5rem;position:relative}@media only screen and (min-width:768px){.modal .modalContent{width:450px}}.modal .modalContent .title{margin-bottom:1rem;font-size:1.125rem;font-weight:500}.modal .modalContent .modalClose{color:var(--primary-color);cursor:pointer;font-size:1.5rem;position:absolute;top:1rem;right:1rem}.modal .modalContent .modalIcon{color:var(--primary-color);margin-right:.25rem}.modal .modalContent .servicesOffered{row-gap:1rem}.modal .modalContent .servicesOffered .service{display:flex}
.contact .contactContainer{row-gap:3rem}@media only screen and (min-width:768px){.contact .contactContainer{grid-template-columns:repeat(2,1fr)}}.contact .contactContainer .contactInfo{align-items:center;margin-bottom:2rem;display:flex}.contact .contactContainer .contactInfo .icon{color:var(--primary-color);margin-right:.75rem;font-size:2rem}.contact .contactContainer .contactInfo .title{font-size:1.125rem;font-weight:500}.contact .contactContainer .contactInfo .subtitle{font-size:.813rem}@media only screen and (min-width:1024px){.contact .contactContainer .contactForm{width:540px}.contact .contactContainer .contactForm .fieldGroup{grid-template-columns:repeat(2,1fr)}}.contact .contactContainer .contactForm .honeypot{width:1px;height:1px;position:absolute;left:-9999px;overflow:hidden}.contact .contactContainer .contactForm .formStatus{margin-top:-.5rem;font-size:.813rem}.contact .contactContainer .contactForm .formStatus.success{color:#22c55e}.contact .contactContainer .contactForm .formStatus.error{color:#ef4444}.contact .contactContainer .contactForm button[disabled]{opacity:.7;cursor:not-allowed}.contact .contactContainer .contactForm .field{background-color:var(--input-color);border-radius:.5rem;padding:.75rem 1rem}.contact .contactContainer .contactForm .field .label{color:var(--title-color);font-size:.75rem}.contact .contactContainer .contactForm .field .input{background-color:var(--input-color);width:100%;color:var(--text-color);box-shadow:0 0 0px 1000px var(--input-color) inset;-webkit-text-fill-color:var(--text-color);border:none;outline:none;padding:.25rem .5rem .5rem 0;font-family:inherit;font-size:.938rem}.copyrightSection{text-align:end;font-size:.75rem}
