.project-card{background-color:hsl(var(--accent));cursor:pointer;z-index:1;border-radius:.75em;position:relative;overflow:hidden}.project-card:hover:before,.project-card:hover .image-overlay,.project-card:hover .project-card-content{opacity:1}.project-card:before{pointer-events:none;border-radius:inherit;content:"";background:linear-gradient(45deg,transparent 5%,hsl(var(--primary))50%,transparent 98%);opacity:0;z-index:1;width:100%;height:100%;transition:opacity .4s ease-in-out;position:absolute;top:0;left:0}.project-card-content{color:#fff;opacity:0;border-radius:inherit;z-index:2;flex-direction:column;justify-content:start;align-items:start;gap:25%;padding:10px;transition:opacity .4s ease-in-out;display:flex;position:absolute;inset:1px}.project-date{opacity:.8;font-size:.875rem;position:absolute;bottom:5px;right:5px}.image-wrapper{border-radius:inherit;z-index:2;width:calc(100% - 1px);height:calc(100% - 1px);position:absolute;top:50%;left:50%;transform:translate(-50%)translateY(-50%)}.image-overlay{border-radius:inherit;z-index:2;background:linear-gradient(to top left,#0000001a,#0000001a);transition:opacity .4s;position:absolute;inset:0}.project-image{border-radius:inherit;object-fit:cover;width:100%;height:100%;padding:1px;transition:transform .4s,opacity .4s;position:absolute;top:0;left:100%}.project-image.active{opacity:1;left:0;transform:translate(0)}.project-image.inactive{opacity:0;left:-100%;transform:translate(-100%)}
.projects-grid{grid-row-gap:40px;grid-template-columns:1fr;grid-auto-flow:row;align-content:stretch;width:100%;display:grid;position:relative}@media screen and (min-width:768px){.projects-grid{grid-column-gap:40px;grid-row-gap:40px;grid-template-columns:1fr 1fr 1fr;grid-auto-columns:1fr;grid-auto-flow:row;justify-content:center;display:grid;position:relative}}.scroll-to-top-button{opacity:0;transition:opacity .3s,transform .3s;transform:translateY(20px)}.scroll-to-top-button.visible{opacity:1;transform:translateY(0)}@keyframes subtleRotate{0%{transform:rotate(30deg)}50%{transform:rotate(35deg)}to{transform:rotate(30deg)}}@keyframes subtleYMovement{0%{translate:2px 3px}50%{translate:0}to{translate:2px 3px}}@keyframes subtleXMovement{0%{translate:10px -2px}50%{translate:0 2px}to{translate:10px -2px}}@keyframes cogAnimation{0%{transform:rotate(0)}50%{transform:rotate(20deg)}to{transform:rotate(0)}}.cog-animation{animation:60s linear infinite cogAnimation}.noodle-animation{animation:10s ease-in-out infinite subtleRotate,5s ease-in-out infinite subtleYMovement}.cylinder-animation{animation:10s ease-in-out infinite subtleXMovement}
.nav__link{letter-spacing:-.5px;font-size:1.2rem;transition:color .3s}.test{background-color:#fffc;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a}
