.cta {
  @apply block w-fit my-2 text-base font-bold;
  &--button {
    @apply rounded-full px-8 py-4 focus:rounded-full font-bold;
  }
  &--primary {
    @apply bg-primary text-white;
  }
  &--shadowed {
    @apply shadowed;
  }
  &--streched {
    @apply after:absolute after:inset-0;
  }
  &--outline {
    @apply border-2 bg-transparent;
  }

  &.cta--button.cta--outline {
    @apply border-black text-primary;
  }

  &--read-more {
    @apply flex  text-primary hover:text-secondary w-full justify-between items-center mt-auto;
    .icon {
      transition: transform 0.3s ease-in-out;
    }
    &:hover .icon {
      filter: invert(27%) sepia(69%) saturate(6074%)
        hue-rotate(348deg) brightness(87%) contrast(100%);
      transform: translateX(3px);
    }
  }
}

.external-link {
  @apply font-semibold hover:text-secondary flex w-fit items-center;
  &:after {
    @apply ml-2 block;
    content: url('../resources/img/graphic-assets/icone-external-link.svg');
    transform: translateY(1px);
  }
}