@layer component.base {
  .pennant {
    display: grid;
    grid-template-areas: "main";
  }

  .pennant__image,
  .pennant__content {
    grid-area: main;
  }

  .pennant__content {
    display: grid;
    align-items: center;
    width: 100%;
    box-sizing: border-box;
  }

  .pennant__link {
    margin-left: auto;
  }
}

.pennant__image {
  position: relative;
  overflow: hidden;
  img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}

.pennant__content {
  position: relative;
}