.card-component--item {
  color: var(--c-brand-umber);

  .card-component--tag {
    position: absolute;
    top: 1rem;
    left: 1rem;
    border-radius: 0.5rem;
    padding-inline: 0.5rem;
    padding-block: 0.3125rem;
  }

  .card-component--external {
    position: absolute;
    top: 1rem;
    right: 1rem;
  }

  .card-component--image {
    aspect-ratio: var(--theme-aspect-ratio);
  }

  image-element {
    display: block;
    width: 100%;
    height: 100%;
  }

  img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .card-component--eyebrow {
    margin-bottom: 0.25rem;
  }

  .card-component--title {
    text-wrap: pretty;
    margin-bottom: 0.5rem;
  }

  .card-component--content {
    margin-top: 1rem;

    p {
      color: rgb(from var(--c-brand-umber) r g b / .75);
    }
  }

  .card-component--button {
    margin-top: 1rem;

    .theme-button[theme-button-size="normal"] {
      padding: 0.33rem 0.75rem;
    }
  }
}