.section{padding:2rem}.project-page-list{color:#000;flex-direction:column;display:flex}.project-page-item{justify-content:space-between;align-items:center;padding:20px 0;display:flex}.project-page-item:not(:last-child){border-bottom:2px solid #e6e6e6}.projects__title-wrapper{flex-direction:column;gap:15px;display:flex}.projects__title{font-size:clamp(1.5rem,4vw,3rem);font-weight:500}.projects__secondary-title{margin-bottom:15px;font-size:1.25rem}.projects-page-item__link{z-index:1;color:#000;background:#000;border-radius:5px;align-self:flex-start;padding:10px 15px;font-weight:500;position:relative}.projects-page-item__link:after{content:"";z-index:-1;background:#fff;border-radius:2.5px;position:absolute;inset:2px}.projects-page-item__link:before{content:"";aspect-ratio:1;z-index:10;transform-origin:100% 0;height:calc(100% - 10px);transition:transform .5s;transition-timing-function:var(--cstm-cubic-bezier);border-top:2px solid #000;border-right:2px solid #000;position:absolute;top:5px;right:5px;transform:scale(.5)}.projects-page-item__link:hover:before{transform:scale(.75)}.projects-page__filter{flex-wrap:wrap;gap:.25rem;display:flex}.projects-page__filter-btn{z-index:1;color:#000;background:#000;border-radius:5px;align-self:flex-start;padding:10px 15px;font-weight:500;position:relative}.projects-page__filter-btn:after{content:"";z-index:-1;background:#fff;border-radius:2.5px;position:absolute;inset:2px}.projects-page__filter-btn:before{content:"";aspect-ratio:1;z-index:10;transform-origin:100% 0;height:calc(100% - 10px);transition:transform .5s;transition-timing-function:var(--cstm-cubic-bezier);border-top:2px solid #000;border-right:2px solid #000;position:absolute;top:5px;right:5px;transform:scale(.5)}.projects-page__filter-btn:hover:before{transform:scale(.75)}.projects-page__filter-btn--active{color:#fff}.projects-page__filter-btn--active:before{border-top:2px solid #fff;border-right:2px solid #fff;transform:scale(.75)}.projects-page__filter-btn--active:after{background:#000}.filter__btn{padding:15px}.filter__list{z-index:1;pointer-events:none;opacity:0;white-space:nowrap;background:#000;border:1px solid #fff;position:absolute}.filter:hover .filter__list{pointer-events:all;opacity:1}.filter__option{cursor:pointer;padding:15px}.filter__option:hover,.filter__option--active{color:#000;background:#fff}.projects-grid{grid-template-columns:repeat(3,1fr);gap:30px;display:grid}.project-card-wrapper{flex-direction:column;align-items:flex-start;gap:15px;display:flex}.projects-page-item__title{font-size:clamp(1.25rem,2vw,2.25rem);font-weight:500}.project-card__desc{color:gray;transition:color .3s}.project-card__desc:hover{color:#000}.projects-page-item__img-wrapper{width:100%;padding:10px;position:relative}.projects-page-item__img-wrapper:before{content:"";aspect-ratio:1;z-index:10;transform-origin:100% 0;border-top:2px solid #000;border-right:2px solid #000;height:25%;position:absolute;top:0;right:0;transform:scale(.5)}.projects-page-item__img-wrapper:after{content:"";aspect-ratio:1;z-index:10;transform-origin:0 100%;border-bottom:2px solid #000;border-left:2px solid #000;height:25%;position:absolute;bottom:0;left:0;transform:scale(.5)}.projects-page-item__img-wrapper--active:before,.projects-page-item__img-wrapper--active:after{animation:1.5s cubic-bezier(.75,.5,.25,1) forwards animateFrame}@keyframes animateFrame{to{transform:scale(1)}}.projects-page-item__img{object-fit:cover;object-position:center;clip-path:inset(0 0 100% 100%);width:100%;transition:transform .6s}.projects-page-item__img--active{animation:1.5s cubic-bezier(.75,.5,.25,1) forwards animateImg}@keyframes animateImg{to{clip-path:inset(0)}}.img-inset{background:#fff;position:absolute;inset:-10px}@media (hover:hover){.project-card:hover img{transform:scale(1.1)}.project-card:hover .project-card__link{opacity:1}}@media (max-width:900px){.projects{padding:1rem 1rem 30px}.projects-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:700px){.section{padding:1rem}.project-page-item{flex-direction:column-reverse}}@media (max-width:600px){.projects-grid{grid-template-columns:repeat(1,1fr)}}