.figure-wrapper{padding:1rem;text-align:center}@media (min-width:768px){.figure-wrapper{padding:2rem}}.figure-wrapper img{max-width:100%;height:auto;display:block;margin:0 auto}.portfolio__categories{display:flex;justify-content:center;gap:1.5rem;flex-wrap:wrap}.btn.cat__btn{text-transform:capitalize;transition:var(--bg-primary)}.btn.cat__btn:hover{transform:translateY(0)}.portfolio__projects{margin-top:3rem;display:grid;grid-template-columns:repeat(3,1fr);gap:3rem;align-items:stretch}.card.portfolio__project{animation:animateProject .8s ease-in forwards;display:flex;flex-direction:column;justify-content:space-between;height:100%;min-height:500px;background:var(--color-bg-variant);padding:1.5rem;border-radius:16px;box-shadow:var(--shadow);border:2px solid var(--color-border);transition:border-color .3s ease}:root[data-theme=dark]{--color-border:#ffffff}:root[data-theme=light]{--color-border:#000000}@keyframes animateProject{0%{opacity:0}to{opacity:1}}.portfolio__project-image{width:100%;max-height:15rem;overflow:hidden;position:relative}.portfolio__project-image img{width:100%;height:auto;transition:transform 10s ease}.portfolio__project:hover .portfolio__project-image img{transform:translateY(-100%)}.portfolio__project p{margin:.5rem 0 2rem}.portfolio__project-cta{width:100%;margin-top:1rem}.portfolio__project-cta,.portfolio__project-cta .btn{display:flex;justify-content:center;align-items:center}.portfolio__project-cta .btn{width:80%;max-width:200px;padding:.7rem 1rem;text-align:center}.portfolio__project:hover .btn.sm.primary{background:transparent;color:var(--color-primary);border-color:var(--color-primary)}.border-gradient{border:2px solid transparent;background-image:linear-gradient(var(--color-bg-variant),var(--color-bg-variant)),linear-gradient(to right,#3490dc,#f472b6,#38b2ac);background-origin:border-box;background-clip:padding-box,border-box;animation:gradient-border 3s linear infinite}@media screen and (max-width:1024px){.portfolio__projects{grid-template-columns:1fr 1fr;gap:2rem}}@media screen and (max-width:600px){.portfolio__projects{display:flex!important;flex-direction:row;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;gap:1.5rem;padding:0 1rem 1rem}.portfolio__project{flex:0 0 85%;min-width:280px;scroll-snap-align:start;border-radius:16px}.portfolio__projects::-webkit-scrollbar{height:5px}.portfolio__projects::-webkit-scrollbar-thumb{background:var(--color-primary);border-radius:10px}}.scroll-buttons{display:none;justify-content:space-between;margin:1rem 0}@media screen and (max-width:600px){.scroll-buttons{display:flex}.scroll-btn{background:var(--color-primary);color:white;border:none;padding:.5rem 1rem;border-radius:6px;font-size:1.5rem;cursor:pointer}}.card:hover{background:transparent;transform:translateY(-.5rem)}.card{height:500px;position:relative;background:var(--bg-primary);padding:1.5rem;border-radius:var(--border-radius-1);transition:var(--transition);backdrop-filter:blur(4px);box-shadow:var(--box-shadow);border:2px solid transparent;z-index:0}.card:before{content:"";position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;border-radius:inherit;background:linear-gradient(270deg,#3490dc,#f472b6,#38b2ac);background-size:600% 600%;z-index:-1;animation:gradient-border 6s linear infinite;opacity:0;transition:opacity .3s ease;padding:2px;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;-webkit-mask-composite:destination-out}.card:hover:before{opacity:1}@keyframes gradient-border{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}@media screen and (max-width:600px){.card{padding:1.2rem}}.click-counter,.toggle-text{text-align:center;padding:1rem}.color-changer{text-align:center;padding:2rem;transition:background-color .3s ease}