.fab-filters {
        position: sticky;
        top: var(--header-height);
        display: grid;
        gap: 1rem;
        background-color: var(--color-white);
        z-index: 10;
      }
      @media (min-width: 768px) {
        .fab-filters {
          position: static;
          grid-template-columns: repeat(2, 1fr);
          gap: 1.5rem;
        }
      }
      @media (min-width: 992px) {
        .fab-filters {
          grid-template-columns: repeat(4, 1fr);
          gap: 2rem;
        }
      }
      .fab-portfolio-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: var(--global-gap);
      }
      @media (min-width: 992px) {
        .fab-portfolio-grid {
          grid-template-columns: repeat(3, 1fr);
        }
      }
      @media (min-width: 1200px) {
        .fab-portfolio-grid {
          grid-template-columns: repeat(12, 1fr);
        }
        .fab-portfolio-grid > :is(a, div) {
          grid-area: auto/span var(--desktop-columns);
        }
      }
      .fab-portfolio-grid > :is(a, div) {
        border: 1px solid var(--color-gray-1);
        overflow: hidden;
      }
      .fab-portfolio-grid a {
        display: block;
      }
      .fab-portfolio-grid div {
        display: flex;
        clip-path: polygon(
          100% 0,
          100% calc(100% - 30px),
          calc(100% - 30px) 100%,
          0 100%,
          0 0
        );
      }
  .fab-portfolio-grid img {
  object-fit: cover;
  }
      .fab-portfolio-grid img:hover {
        transform: scale(1.15);
      }
      .portfolio-box-text {
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: clamp(0.5rem, -0.3803rem + 3.7559vw, 3rem);
        background-color: var(--color-orange);
        color: var(--color-white);
        row-gap: 0.75rem;
      }
      .portfolio-box-text h3 {
        font-size: 1.5rem;
      }