/* Skeleton Loader Styles */
  .skeleton-item {
    pointer-events: none;
  }

  .skeleton-thumbnail,
  .skeleton-title,
  .skeleton-button {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeleton-loading 1.5s infinite;
    border-radius: 4px;
  }

  .skeleton-thumbnail {
    width: 100%;
    height: 200px;
    margin-bottom: 15px;
  }

  .skeleton-title {
    width: 70%;
    height: 24px;
    margin: 0 auto 15px;
  }

  .skeleton-button {
    width: 120px;
    height: 40px;
    margin: 0 auto;
  }

  @keyframes skeleton-loading {
    0% {
      background-position: 200% 0;
    }

    100% {
      background-position: -200% 0;
    }
  }

  /* Lazy loading image fade-in */
  .portfolio-img {
    opacity: 0;
    transition: opacity 0.3s ease-in;
  }

  .portfolio-img.loaded {
    opacity: 1;
  }

  /* Load More Button */
  .portfolio-load-more {
    text-align: center;
    width: 100%;
    margin-top: 30px;
  }

  #load-more-btn:disabled {
    background-color: #ccc;
    cursor: not-allowed;
    opacity: 0.6;
  }