  /* Portfolio Filter Menu */
    .portfolio-filter-menu ul { display: flex; justify-content: center; gap: 15px; list-style: none; padding: 0; margin: 0 0 40px; flex-wrap: wrap; }
    .portfolio-filter-menu li { cursor: pointer; padding: 10px 25px; background: #f4f4f4; border-radius: 30px; transition: all 0.3s ease; font-family: var(--priFont, sans-serif); font-weight: 500; text-transform: capitalize; font-size: 16px; color: #333; }
    .portfolio-filter-menu li.active, .portfolio-filter-menu li:hover { background: var(--priColor, #000); color: #fff; }

.portfolio-item {position: relative;width: 32%;backdrop-filter: blur(40px);border-radius: .5rem;overflow: hidden;} 
  .portfolio-posts-container { display: flex; flex-wrap: wrap; gap: 1rem;}
   .portfolio-item {  }
   .portfolio-item figure { width: 100%; height: 20rem; overflow: hidden;  }
   .portfolio-item img { object-fit: cover; height: 100%; width: 100%; }
   .portfolio-content h4 { margin: 0; color: var(--whiteColor);}
   .portfolio-cat { background-image: linear-gradient(90deg, #00000080 50%, var(--priColor) 50%); border: none; color: #FFF; background-size: 300%; transition: all 0.5s; background-origin: border-box; position: absolute; top: 5%; left: 5%; padding: .5rem 1rem; border-radius: .5rem; }
   .portfolio-cat:hover { background-position: -53%; }
   .portfolio-content { position: absolute; bottom: 0; left: 0; backdrop-filter: blur(15px);-webkit-backdrop-filter: blur(40px);mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgb(0, 0, 0) 13%, #000000f5 20%);-webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgb(0, 0, 0) 13%, #000000f5 20%);padding: 1rem;background-color: transparent;--background-overlay: '';background-image: linear-gradient(360deg, #0009 0%, #0000 100%);display: flex;flex-direction: column;gap: 0rem;width: 100%;height: 27%;justify-content: center;}