.hero{align-items:center;display:flex;height:100vh;justify-content:center;position:relative;width:100%}.hero h1{font-size:18vw}.hero .images{height:100%;left:0;overflow:hidden;position:absolute;top:0;width:100%}.hero .images img{height:100%;max-height:30vh;width:auto}.filter{padding:2rem}.filter ul{display:flex;flex-wrap:wrap;gap:1rem;justify-content:flex-end;list-style:none;margin:0;padding:0}.filter a{border:1px solid #000;border-radius:3rem;color:#000;display:block;font-size:var(--font-size-sm);padding:.5rem 1rem;text-decoration:none;transition:all .3s ease}.filter a.active,.filter a:hover{background:#000;color:#fff}.projects{display:grid;gap:1rem;grid-template-columns:repeat(3,1fr);padding:2rem}@media screen and (max-width:1000px){.projects{grid-template-columns:repeat(2,1fr)}}@media screen and (max-width:700px){.projects{gap:1rem 0;grid-template-columns:1fr}.project{width:100%}}.project{display:block;height:400px;position:relative}.project.span-2{grid-column:span 2}.project img{height:100%;left:0;object-fit:cover;overflow:hidden;position:absolute;top:0;width:100%;z-index:10}.project h3{bottom:2rem;left:2rem;max-width:calc(100% - 4rem)}.project h3,.project ul{margin:0;position:absolute;z-index:20}.project ul{display:flex;flex-direction:row-reverse;gap:.5rem;justify-content:center;list-style:none;opacity:1;padding:0;right:2rem;top:2rem}.project ul li{border:1px solid #fff;border-radius:1rem;font-size:var(--font-size-xs);padding:.3rem .8rem}.project:hover:after{opacity:1}