.project-card__links{display:flex;position:absolute;bottom:.25rem;right:.25rem}.project-card__links .project-card__link{width:40px;height:40px;color:var(--gray-500);background-color:#0000;justify-content:center;align-items:center;gap:.25rem;transition:all .3s ease-in-out;display:flex}.project-card__links .project-card__link span{opacity:0;white-space:nowrap;font-size:0;transition:all .3s ease-in-out;transform:translate(-10px)}.project-card__links .project-card__link:hover,.project-card__links .project-card__link:active{color:var(--gray-800);width:80px}.project-card__links .project-card__link:hover span,.project-card__links .project-card__link:active span{opacity:1;text-transform:capitalize;font-size:clamp(.75rem,1vw,.875rem);font-weight:600;transform:translate(0)}.project-card__links .project-card__link:hover svg,.project-card__links .project-card__link:active svg{width:clamp(14px,1vw,18px)}
.project-card{--height:380px;width:100%;max-width:370px;height:var(--height);z-index:15;background:var(--white);box-shadow:0 0 .25rem var(--gray-300);border-radius:.5rem;flex-direction:column;padding:clamp(.5rem,1vw,1rem);transition:all .3s;display:flex;position:relative;overflow:hidden}.project-card:before{content:"";background:linear-gradient(175deg,var(--project-color)0%,var(--white)30%);z-index:0;width:100%;height:0;transition:all .2s ease-in-out;position:absolute;top:0;left:0}.project-card:hover:before{height:100%}.project-card .project-card__media{width:100%;height:calc(var(--height)/2 - 20px);background-color:var(--gray-100);border-radius:.5rem;transition:all .3s;overflow:hidden}@media (max-width:778px){.project-card .project-card__media{height:calc(var(--height)/2)}}.project-card .project-card__media .project-card__mediaImg{object-fit:cover;object-position:top;width:100%;height:100%}.project-card:hover .project-card__media{scale:1.02}.project-card .project-card__details{padding:clamp(.5rem,1vw,1rem) 0}.project-card .project-card__details .project-card__title{color:var(--gray-600);width:fit-content;justify-content:flex-start;align-items:center;gap:clamp(.25rem,1.5vw,.5rem);margin-bottom:.5rem;font-size:.875rem;font-weight:600;transition:all .3s ease-in-out;display:flex;position:relative}.project-card .project-card__details .project-card__title:after{content:"";background-color:var(--gray-600);transform-origin:100%;width:100%;height:1px;transition:transform .3s ease-in-out;position:absolute;bottom:clamp(-3px,1.5vw,-2px);left:0;transform:scaleX(0)}.project-card .project-card__details .project-card__title svg{all:unset;transition:all .3s ease-in-out}@media (max-width:778px){.project-card .project-card__details .project-card__title svg{scale:.8}}.project-card .project-card__details .project-card__title:hover{color:var(--gray-700)}.project-card .project-card__details .project-card__title:hover:after{transform-origin:0;transform:scaleX(1)}.project-card .project-card__details .project-card__title:hover svg{transform:translate(clamp(-3px,1.5vw,-2px))rotate(45deg);color:inherit!important}@media (max-width:778px){.project-card .project-card__details .project-card__title{font-size:.75rempx}}.project-card .project-card__details .project-card__content{z-index:10;flex-direction:column;gap:.75rem;display:flex;position:relative}.project-card .project-card__details .project-card__content .project-card__description{word-spacing:-1px;color:var(--gray-500);-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;font-size:.875rem;line-height:1.5;display:-webkit-box;overflow:hidden}@media (max-width:778px){.project-card .project-card__details .project-card__content .project-card__description{word-spacing:1px;font-size:.75rem}}.project-card .project-card__details .project-card__content .project-card__technologies{gap:.25rem;display:flex}.project-card .project-card__details .project-card__content .project-card__technologies .project-card__tech-item,.project-card .project-card__details .project-card__content .project-card__technologies .project-card__tech-more{color:var(--gray-500);background-color:var(--gray-100);border-radius:.25rem;justify-content:center;align-items:center;gap:.25rem;padding:.25rem .5rem;transition:all .3s;display:flex}.project-card .project-card__details .project-card__content .project-card__technologies .project-card__tech-item:hover,.project-card .project-card__details .project-card__content .project-card__technologies .project-card__tech-more:hover{color:var(--white);background-color:var(--colorTech)}.project-card .project-card__details .project-card__content .project-card__technologies .project-card__tech-item svg,.project-card .project-card__details .project-card__content .project-card__technologies .project-card__tech-more svg{width:12px;color:inherit!important}.project-card .project-card__details .project-card__content .project-card__technologies .project-card__tech-item span,.project-card .project-card__details .project-card__content .project-card__technologies .project-card__tech-more span{color:inherit;text-transform:capitalize;font-size:.75rem;font-weight:500}@media (max-width:778px){.project-card .project-card__details .project-card__content .project-card__technologies .project-card__tech-item,.project-card .project-card__details .project-card__content .project-card__technologies .project-card__tech-more{padding:.25rem}.project-card .project-card__details .project-card__content .project-card__technologies .project-card__tech-item span,.project-card .project-card__details .project-card__content .project-card__technologies .project-card__tech-more span{font-size:.625rem}}.project-card .project-card__details .project-card__content .project-card__technologies .project-card__tech-more{cursor:pointer;font-size:.875rem;font:inherit;border:none}.project-card .project-card__details .project-card__content .project-card__technologies .project-card__tech-more:hover{color:var(--white);background-color:var(--gray-700)}@media (max-width:778px){.project-card .project-card__details .project-card__content .project-card__technologies .project-card__tech-more{font-size:.75rem}}.project-card:hover .project-card__details .project-card__title{color:var(--gray-700)}.project-card:hover .project-card__details .project-card__title:after{display:none}.project-card:hover .project-card__details .project-card__title svg{transform:translate(-3px)rotate(45deg);color:inherit!important}
