:root{--primary: #00b29c;--navbar-height: 90px;--container-width: 1300px}*{margin:0;padding:0;box-sizing:border-box}body{background-image:linear-gradient(120deg,hsl(0deg 0% 14%) 0%,hsl(344deg 0% 13%) 11%,hsl(344deg 0% 12%) 22%,hsl(344deg 0% 11%) 33%,hsl(344deg 0% 11%) 44%,hsl(344deg 0% 10%) 56%,hsl(344deg 0% 9%) 67%,hsl(344deg 0% 8%) 78%,hsl(344deg 0% 8%) 89%,hsl(0deg 0% 7%) 100%);background-size:cover;background-color:#1b1b1b;color:#fff;font-family:Poppins,sans-serif;margin:0;overflow-x:hidden}::selection{background-color:var(--primary);color:#fff}.container{max-width:var(--container-width);margin:0 auto;padding:0 20px;height:auto;padding-top:7rem}ul{list-style:none}li{display:inline}a{text-decoration:none;color:#fff;cursor:pointer}a:hover,a:active{color:var(--primary)}img{max-width:100%;height:auto;flex-shrink:0}.title-section{display:flex;flex-grow:1;justify-content:center;font-size:2rem;font-weight:600;color:var(--primary)}.button-shadow{display:flex;flex-direction:row;align-items:center;justify-content:center;border-radius:10px;background:#00b29c;color:#fff;font-weight:700;cursor:pointer;transition:box-shadow .3s ease;border:none;white-space:nowrap;width:auto}.button-shadow:hover{box-shadow:0 0 30px #00b29c}.button-icon{margin-right:4px;font-size:1.4rem}.button-sm{padding:4px 12px;box-shadow:0 0 4px #00b29c}.button-lg{padding:14px 36px;box-shadow:0 0 18px #00b29c}@media (max-width: 768px){.container{padding:0 40px}span{text-align:justify}}@media screen and(max-width: 200px){.button-shadow,.button-lg,.button-sm{padding:.6rem 1rem}}.navbar{display:flex;height:var(--navbar-height);position:sticky;top:0;z-index:100}.navbar img{width:80px;flex-shrink:0;min-width:80px}.navbar-content{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-grow:1;max-width:var(--container-width);margin:0 auto;padding:0 20px}.navbar-opacity{background-color:#2222224d;transition:background-color .3s ease-in-out}.navbar a.active{color:var(--primary)}.navbar-center ul{display:flex;justify-content:space-around;gap:3.5rem;align-items:center}.navbar-right ul{display:flex;align-items:center;gap:1.2rem;justify-content:center}.navbar-right ul a{display:flex;text-align:center;gap:.6rem}.linkedin-icon{font-size:1.3rem}.github-icon{font-size:1.45rem}.contact-button,.home-link{display:none}@media (min-width: 600px){.home-link{display:block}}@media (max-width: 768px){.navbar-center{flex-grow:1;justify-content:space-evenly}.contact-button{display:block}.contact-link{display:none}.navbar-right ul{display:flex;flex-direction:column;position:fixed;right:0;bottom:0;margin:12px;gap:1.5em;transition:bottom .3s}.navbar-right span{display:none}}@media screen and (max-width: 768px){.navbar-center ul{display:none}}@media screen and (max-width: 200px){.navbar{flex-direction:column}.contact-button{display:none}}.footer{display:flex;flex-direction:column;gap:1rem;text-align:center;padding-top:38px;margin:2rem auto 1.5rem}.main{min-height:calc(100vh - var(--navbar-height));display:grid;grid-template-columns:50% 50%;grid-template-areas:"title image" "skills image" "text-about image" "contact image";grid-auto-rows:auto;align-items:center;align-content:center;gap:20px;padding-top:0}.title{grid-area:title;font-size:3.8rem;font-weight:700}.title .developer{color:var(--primary)}.skills{grid-area:skills;display:flex;flex:row;gap:18px;flex-wrap:wrap}.skill-icon{position:relative;display:flex;align-items:center;justify-content:center;padding:10px;border-radius:10px;background:rgba(255,255,255,.1);box-shadow:0 4px 25px #00000080}.skill-icon img{max-width:50px;max-height:50px}.text-about{grid-area:text-about;opacity:.8}.emoji{width:1.6rem;height:1.6rem;vertical-align:middle;margin:0 4px}.contact{grid-area:contact;display:flex;align-items:center;gap:24px;margin-bottom:28px;flex-wrap:wrap}.button-icon{width:1.2rem;height:1.2rem}.main-image{grid-area:image;display:flex;justify-content:center;align-items:center}.main-image img{width:70%;opacity:80%;border-radius:50%}.tooltip{visibility:hidden;width:auto;color:#fff;text-align:center;border-radius:6px;padding:10px;position:absolute;top:60px;z-index:1}.skill-icon img{width:100%;max-width:48px;max-height:48px}.skill-icon:hover .tooltip{visibility:visible}@media (max-width: 1220px){.title{font-size:3.2rem}}@media (max-width: 900px){.main{grid-template-columns:1fr;grid-template-areas:"title" "image" "skills" "other-skills" "text-about" "contact";text-align:center;justify-content:center}.title{font-size:2.6rem}.skills{justify-content:center;margin-top:1rem}.other-skills,.contact{justify-content:center}.main-image{max-width:300px}}@media screen and (max-width: 400px){.title{font-size:1.2rem}}.about{display:flex;flex-direction:column;gap:28px;justify-content:center;align-items:center}#about{padding-top:5rem}.text-about-section{text-align:start;margin:8px auto;opacity:.8;display:flex;flex-direction:column;gap:.6rem}@media (max-width: 1100px){.text-about-section{width:100%}}.portfolio-card{display:flex;flex-direction:column;align-items:center;width:100%;max-width:30%;text-align:center;gap:1rem;overflow:hidden;border-radius:12px;background:#1c1c1c;transition:transform .3s ease,box-shadow .3s ease;box-shadow:0 8px 16px #00000080;height:auto}.portfolio-card:hover{transform:translateY(-10px);box-shadow:0 12px 24px #000000b3;cursor:pointer}.project-thumbnail{width:100%;height:auto;height:240px;border-radius:12px 12px 0 0}.project-info{padding:1rem;color:#f1f1f1;display:flex;flex-direction:column;align-items:center;width:100%}.project-info .title{font-size:1.4rem;margin:.5rem 0;font-weight:700;text-align:center}.project-info .info{font-size:1rem;margin:.5rem 0}.project-info .links{display:flex;width:100%;justify-content:space-evenly}.project-info a{margin:.5rem 0;color:var(--primary);text-decoration:none;font-weight:700;transition:color .3s ease,border-color .3s ease}.project-info a:hover{transform:scale(1.1)}.technology-section{display:flex;justify-content:center;background-color:#333;padding:1rem;width:100%;border-top:1px solid #444;align-items:center;flex-wrap:wrap}.technology-item{display:flex;flex-direction:column;align-items:center;margin:0 1rem;color:#fff;flex:1}.tech-icon{max-width:32px;width:100%;max-height:32px;margin-bottom:.5rem}.tech-name{font-size:.9rem;font-weight:500}@media screen and (max-width: 1050px){.portfolio-card{max-width:90%}.technology-section{gap:1rem}}@media screen and (max-width: 420px){.project-thumbnail{width:100%}.project-info .title{font-size:1.2rem}}#portfolio{padding-top:7rem}.portfolio{display:flex;flex-wrap:wrap;gap:3rem;padding-top:48px;align-items:self-start}.portfolio img{width:400px}@media screen and (max-width: 400px){.portfolio img{width:auto}}@media screen and (max-width: 800px){.portfolio{gap:4rem}}@media screen and (max-width: 1200px){.portfolio{justify-content:center}}.contact-form{display:flex;flex-direction:column;gap:2rem;align-items:center;text-align:center;justify-content:center;margin:0 auto;width:80%;margin-top:2rem}.contact-text{opacity:.8;width:80%;margin:1rem 1rem 2rem}.contact-form input,textarea{color:#ffffffb3;background:transparent;border:none;border-bottom:1px solid gray;justify-self:center;align-self:center;padding:0 2px;font-size:1.2rem;width:100%}.contact-form label{display:flex;flex-direction:column;gap:.2rem;width:100%;max-width:900px;text-align:start}.contact-form .error{color:var(--primary);font-size:.8rem}.contact-form input{height:48px;border-bottom:1px solid gray}.contact-form textarea{resize:none;margin-top:6px;margin-bottom:8px}.contact-form input:focus,textarea:focus{outline:none;border-bottom:1px solid var(--primary)}.contact-form button{align-self:center;padding:18px 100px;font-size:1rem}@media (max-width: 900px){.contact-form{width:100%}}@media (max-width: 260px){.contact-form button{padding:1rem 2.2rem}}.project-detail{display:flex;flex-direction:column;padding:20px;gap:20px;color:#fff}.header{display:flex;align-items:center;justify-content:center;position:relative}.back-button{position:absolute;left:20px;top:-30px;font-size:1rem;cursor:pointer;padding:.4rem 0}.info-columns{display:flex;flex-wrap:wrap;margin:-10px;align-self:center;width:90%}.info-column{flex:1 0 50%;padding:10px;display:flex;flex-direction:column;gap:10px}.info-section{border-radius:8px;padding:2rem;margin:10px 0}.left .info-section:nth-child(odd){background-color:#fff;color:#000}.left .info-section:nth-child(2n){background-color:var(--primary);color:#fff}.right .info-section:nth-child(odd){background-color:var(--primary);color:#fff}.right .info-section:nth-child(2n){background-color:#fff;color:#000}@media (max-width: 768px){.info-columns{width:100%}.back-button{left:0}.info-column{flex:1 0 100%;padding-top:0}.info-section{background-color:#fff;color:#000}.info-section:nth-child(odd){background-color:var(--primary);color:#fff}.info-column:last-child .info-section:first-child{background-color:var(--primary);color:#fff}h1{font-size:1.7rem;margin-top:1rem}}.carousel-container{position:relative;width:80%;min-height:500px;height:68vh;overflow:hidden;display:flex;justify-content:center;align-items:center;flex-direction:column;align-self:center;border-radius:10px}.main-image{width:100%;max-width:1400px;object-fit:contain;height:62vh;border-radius:10px;min-height:400px}.carousel-control{position:absolute;top:50%;transform:translateY(-50%);background-color:#3b3b3b66;border:none;border-radius:50%;cursor:pointer;padding:10px;z-index:1;transition:all .3s ease;font-size:2rem;color:var(--primary)}.carousel-control:hover{background-color:#636363}.carousel-control.prev{left:10px}.carousel-control.next{right:10px}.carousel-indicators{display:flex;justify-content:center;margin-top:10px}.indicator{display:inline-block;width:10px;height:10px;background-color:#ccc;border-radius:50%;margin:0 5px;cursor:pointer;transition:background-color .3s ease}.indicator.active{background-color:#fff}.view-demo{display:flex;justify-content:center;align-items:center}.view-demo a{color:#fff;padding:10px 20px;color:var(--primary);font-weight:700;border:2px solid var(--primary);border-radius:5px;cursor:pointer;text-decoration:none;transition:background-color .3s ease,color .3s ease}.view-demo a:hover{background-color:var(--primary);color:#fff}@media (max-width: 768px){.carousel-container{width:100%;height:auto;min-height:260px}.carousel-control{padding:8px}.main-image{object-fit:cover;height:auto;max-height:100%;min-height:260px}}.technologies ul{display:flex;justify-content:space-around;flex-wrap:wrap}.technologies li{display:inline-flex;flex-direction:column;justify-content:center;align-items:center;margin:1rem}.technologies li img{width:48px;height:48px}