:root{--primary: #fafafa;--primary-foreground: #171717;--secondary: #0a0a0a;--secondary-foreground: #a3a3a3;--accent: #34d399;--navbar-height: 3rem}*{padding:0;margin:0;box-sizing:border-box;font-family:Poppins,sans-serif}html{color:var(--primary-foreground);background-color:var(--primary);scroll-behavior:smooth}ul,li{list-style-type:none}a{text-decoration:none}.animation-translate-top{animation-name:translate-top;animation-duration:.3s;animation-timing-function:ease;animation-fill-mode:both}.animation-delay-1{animation-delay:.1s}.animation-delay-2{animation-delay:.2s}.animation-delay-3{animation-delay:.3s}@keyframes translate-top{0%{opacity:0;transform:translateY(2rem)}to{opacity:1;transform:translateY(0)}}.container{max-width:100%;padding:0 1rem}@media (min-width: 576px){.container{width:540px}}@media (min-width: 768px){.container{width:720px}}@media (min-width: 992px){.container{width:960px}}@media (min-width: 1200px){.container{width:1140px}}.footer{text-align:center;margin:4rem auto;color:var(--primary-foreground)}.hero{height:100vh;display:grid;place-items:center}.hero>.container{display:flex;align-items:center;gap:2rem}.hero__content{display:flex;flex-direction:column}.hero__content h1{font-weight:600;color:var(--accent)}.hero__content h2{font-size:3.4rem;font-weight:600;color:var(--primary-foreground)}.hero__content h3{font-size:2rem;font-weight:500;color:var(--secondary-foreground)}.hero__content p{color:var(--secondary-foreground)}.hero__image{width:30rem;border-radius:50%;filter:drop-shadow(0px 0px 8px var(--accent));overflow:hidden}.hero__image img{width:100%;border-radius:inherit;filter:grayscale(.8);transition:filter .3s ease-out}.hero__image img:hover{filter:grayscale(0)}@media (max-width: 768px){.hero>.container{text-align:center;flex-direction:column-reverse}.hero__image{width:10rem}.hero__content h1{font-size:1.2rem}.hero__content h2{font-size:2rem}.hero__content h3{font-size:1.2rem}.hero__content p{font-size:.8rem}}.about{display:grid;place-items:center;padding:4rem 0;text-align:justify}.about>.container{display:flex;flex-direction:column;align-items:center;gap:1rem}.about h2{font-size:2rem;margin-bottom:1rem}.about p{color:var(--primary-foreground)}@media (max-width: 768px){.about p{font-size:.8rem}}.project{display:grid;place-items:center;padding:4rem 0}.project h2{font-size:2rem;margin-bottom:2rem;text-align:center}.project__content{display:flex;flex-direction:column;gap:6rem}.project-card{position:relative;display:flex;justify-content:space-between;gap:1rem}.project-card__image{position:relative;width:34rem;aspect-ratio:5/3;overflow:hidden;border:1px solid var(--primary-foreground);filter:grayscale(.8);transition:all .3s ease-out}.project-card__image img{width:100%;height:100%;object-fit:content}.project-card__title{font-size:1.4rem;font-weight:600;color:var(--primary-foreground);top:0;right:0;flex-grow:1;white-space:nowrap;text-align:end}.project-card__description{color:var(--secondary-foreground);border:1px solid var(--primary-foreground);padding:1rem;display:flex;flex-direction:column;gap:1rem;position:absolute;background-color:var(--primary);top:50%;right:0;transform:translateY(-50%);width:70%;transition:color .3s ease-out}.project-card:hover .project-card__image{filter:grayscale(0)}.project-card:hover .project-card__description{color:var(--primary-foreground)}.project-card--reverse{flex-direction:row-reverse}.project-card--reverse .project-card__description{left:0}.project-card--reverse .project-card__title{text-align:start}@media (max-width: 992px){.project__content{gap:2rem}.project-card{flex-direction:column-reverse}.project-card__image{width:100%}.project-card__title{font-size:1.2rem;text-align:start}.project-card__description{font-size:.8rem;width:100%;top:100%;background-color:#3f3f3fe0;transform:translateY(-100%);justify-content:space-between;color:var(--primary-foreground)}.project-card:hover .project-card__description{color:#fff}}.contact{display:grid;place-items:center;padding:4rem 0;text-align:center}.contact>.container{display:flex;flex-direction:column;align-items:center;gap:1rem}.contact h2{font-size:2rem;margin-bottom:1rem}.contact p{color:var(--primary-foreground)}.contact a{color:var(--primary-foreground);padding:.4rem 2rem;border:1px solid var(--primary-foreground);position:relative}.contact a:before{content:"";position:absolute;top:0;left:0;width:0;height:100%;background-color:var(--primary-foreground);z-index:-1;transition:all .3s ease-in-out}.contact a:hover:before{width:100%}.contact a:hover{color:#fff}@media (max-width: 768px){.contact p{font-size:.8rem}}.header{display:flex;justify-content:space-between;align-items:center;position:fixed;top:0;left:0;right:0;padding:0 2rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);height:var(--navbar-height);z-index:10}.header__logo{font-size:1.2rem;font-weight:600;color:var(--primary-foreground)}.header__nav{display:flex;flex-direction:row;gap:1rem}.header__nav a{color:var(--primary-foreground);transition:all .3s ease-out}.header__nav a:hover{color:var(--accent)}.header__toggle,.dropdown,#dropdown-toggle{display:none}.social{position:fixed;bottom:0rem;left:2rem;z-index:2;display:flex;flex-direction:column;align-items:center;gap:.5rem}.social a{transition:all .3s ease-out}.social img{width:1.4rem}.social:after,.email:after{content:"";width:2px;height:4rem;background-color:var(--secondary-foreground)}.email{position:fixed;display:flex;flex-direction:column;align-items:center;bottom:0;right:2rem;gap:.5rem}.email a{writing-mode:vertical-lr;color:var(--secondary-foreground);transition:all .3s ease-out}.email,.social{z-index:10}.email a:hover,.social a:hover{transform:translateY(-.5rem)}@media (max-width: 768px){.header{padding:0 1rem}.header__nav{display:none}.header__toggle{display:block;cursor:pointer;width:1.6rem;height:1rem;position:relative}.header__toggle div{width:100%;height:2px;background-color:var(--secondary-foreground);position:absolute;top:50%;transition:opacity .3s ease-out}.header__toggle:after,.header__toggle:before{content:"";width:100%;height:2px;background-color:var(--secondary-foreground);transition:transform .3s ease-out;position:absolute}.header__toggle:after{position:absolute;transform:translateY(1rem)}.header__toggle:before{position:absolute;transform:translateY(0)}.dropdown{position:fixed;display:flex;flex-direction:column;top:var(--navbar-height);transform:translateY(-100%);transition:all .3s ease-out;padding:1rem;width:100%;box-shadow:0 2px 4px #0000001a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);opacity:0;gap:.4rem;z-index:9}.dropdown a{color:var(--secondary-foreground);transition:color ease-out .3s}.dropdown a:hover{color:var(--accent)}#dropdown-toggle:checked~.dropdown{opacity:1;transform:translateY(0)}#dropdown-toggle:checked~.header .header__toggle div{opacity:0}#dropdown-toggle:checked~.header .header__toggle:after{background-color:#fff;transform:translateY(.5rem) rotate(180deg) rotate(45deg)}#dropdown-toggle:checked~.header .header__toggle:before{background-color:#fff;transform:translateY(.5rem) rotate(-180deg) rotate(-45deg)}#dropdown-toggle:checked~.header{background-color:var(--secondary)}#dropdown-toggle:checked~.header .header__logo{color:#fff}#dropdown-toggle:checked~.dropdown{background-color:var(--secondary)}#dropdown-toggle:checked~.dropdown li a{color:#fff}.social,.email{display:none}}