.event-detail-head--branded {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  column-gap: clamp(1rem, 4vw, 4rem);
}

.event-detail-head--branded > :where(:not(.event-club-badge)) { grid-column: 1; }

.event-club-badge {
  grid-area: 1 / 2 / 5 / 3;
  display: block;
  width: clamp(6rem, 15vw, 12rem);
  aspect-ratio: 1;
}

.event-club-badge img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.event-club-badge:focus-visible {
  outline: 2px solid #ffdc6f;
  outline-offset: .4rem;
}

@media (max-width: 760px) {
  .event-club-badge {
    grid-row: 1 / 3;
    width: clamp(4.25rem, 19vw, 5.75rem);
  }

  .event-detail-head--branded > :is(h1, p) { grid-column: 1 / -1; }
}
