:root{--black: #09090B;--white: #FFFFFF;--green: #6EE7B7;--gray: #d4d4d8;--violet: #C4B5FD;--pink: #FDA4AF;--bg-color: var(--black);--text-color: var(--white);--text-muted-color: var(--gray);--border-color: var(--white);--button-bg: #99999b;--button-text: var(--white);--button-hover-bg: #99999b;--button-hover-text: var(--white);--button-icon-bg: var(--black);--button-icon-text: var(--white);background:var(--bg-color);font-size:16px;font-family:Poppins,sans-serif;color-scheme:dark}html[data-theme=light]{--black: #09090B;--white: #FFFFFF;--gray: #52525b;--bg-color: #FAFAFA;--text-color: #18181b;--text-muted-color: var(--gray);--border-color: #18181b;--button-bg: #e4e4e7;--button-text: var(--black);--button-hover-bg: #e4e4e7;--button-hover-text: var(--black);--button-icon-bg: var(--white);--button-icon-text: var(--black);color-scheme:light}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--bg-color);color:var(--text-muted-color)}main{max-width:1140px;width:90%;margin:auto}a{text-decoration:none;color:var(--text-color)}button,input{font-family:Poppins,sans-serif;outline:none;background-color:var(--button-bg);color:var(--button-text);border-color:var(--border-color)}img{max-width:100%}ul{list-style:none}.heading-1,.heading-2,.heading-3{color:var(--text-color);font-weight:600;text-wrap:balance}.heading-1{font-size:3rem}.heading-2{font-size:2.25rem}.heading-3{font-size:1.5rem}.text-normal,.text-small,.text-smaller{font-weight:500;color:var(--text-muted-color)}.text-normal{font-size:1rem}.text-small{font-size:.875rem}.text-smaller{font-size:.75rem}.heading-1>.green,.heading-2>.green,.heading-3 .green{color:var(--green)}.heading-1>.violet,.heading-2>.violet,.heading-3 .violet{color:var(--violet)}.heading-1>.pink,.heading-2>.pink,.heading-3 .pink{color:var(--pink)}.button{padding:.3125rem;display:inline-flex;justify-content:space-between;align-items:center;gap:1rem;font-size:.875rem;font-weight:500;color:var(--button-text);background:transparent;border:1px solid var(--border-color);border-radius:2.5rem;transition:.2s all ease;cursor:pointer}.button-text{margin-left:1rem}.button-box-icon{width:3rem;height:3rem;display:inline-flex;justify-content:center;align-items:center;border-radius:100%;background:var(--button-bg);color:var(--button-text);font-size:1.5rem;transition:.2s all ease}.button:hover{background:var(--button-hover-bg);color:var(--button-hover-text);border-color:var(--button-hover-bg)}.button:hover .button-box-icon{background:var(--button-icon-bg);color:var(--button-icon-text)}.navbar{margin:1.75rem 0;display:flex;justify-content:space-between;align-items:center}.navbar .text-normal{text-decoration:underline;color:var(--text-muted-color)}.navbar-logo{cursor:pointer;border-radius:50%;padding:5px;display:inline-block;transition:background-color .2s ease;background-color:var(--black)}.navbar-logo:focus-visible{outline:2px solid var(--green);outline-offset:2px}.navbar-logo img{animation:rotate-center 1s infinite;animation-delay:1s;display:block}@keyframes rotate-center{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.hero{min-height:calc(100vh - 8rem);display:flex;align-items:center}.hero .button{transform:translate(2.375rem,-.5rem)}.about{margin:12.5rem 0;display:flex;flex-direction:column;align-items:center;gap:2.375rem}.about-picture img{border-radius:100%}.about-bio{max-width:40.625rem;display:grid;grid-template-columns:1fr;gap:1.5rem}.projects{margin-top:3.75rem;display:grid;grid-template-columns:repeat(2,1fr);gap:2rem 2.5rem}.card-picture img{border-radius:.5rem}.card .heading-3{margin-top:.5rem}.card .heading-3 a{color:var(--text-color)}.card-skills{margin-top:.375rem;display:flex;gap:.625rem}.card-tag{padding:.375rem 1rem;font-size:.75rem;color:var(--text-color);border:1px solid var(--border-color);border-radius:1rem}.contact{margin:6.25rem 0}.social{margin-top:3.75rem;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:1.5rem}.contact-footer{margin-top:12.5rem;text-align:center;color:var(--text-muted-color)}@media screen and (max-width: 768px){:root,html[data-theme=light]{font-size:14px}}@media screen and (max-width: 568px){.heading-2,.text-normal{text-align:center}.projects{grid-template-columns:1fr}}@media screen and (max-width: 430px){:root,html[data-theme=light]{font-size:12px}.heading-1{font-size:2.25rem}.heading-2{font-size:1.5rem}.heading-3{font-size:1.125rem}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}