.card-project {
  position: relative;

  .image-container {
    overflow: hidden;
    border-radius: var(--radius-medium);
    aspect-ratio: 1;
    position: relative;

    img {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
    }
  }

  &:hover,
  &:focus,
  &:active {
    img {
      transform: scale(1.1);
    }
  }

  img {
    transition: transform 0.3s ease;
  }

  .card-content {
    margin-top: var(--spacing-4);
    margin-bottom: var(--spacing-4);
  }

  .surtitle {
    color: var(--secondary-500);
    font-size: 1rem;
    font-weight: 700;
  }

  h2, h3, h4, h5, h6 {
    a {
      position: static;
      text-decoration: none;
      color: var(--bs-body-bg);

      &:before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        cursor: pointer;
      }
    }
  }

  .tags {
    display: flex;
    gap: var(--spacing-1-2);
  }
}

.bg-primary .paragraph--type--bloc{

  .card-project .field--item:not(.surtitle .field--item) {
    color: var(--bs-white);
  }
}