.event-head {
  --head-pad: var(--sp-12);

  position: relative;
  isolation: isolate;
  display: flex;
  align-items: flex-end;
  min-height: clamp(26rem, 64vh, 40rem);
  padding-block: var(--head-pad);
  overflow: hidden;
}

.event-head::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(
    180deg,
    rgba(10, 22, 40, 0.4) 0%,
    rgba(10, 22, 40, 0.12) 28%,
    rgba(10, 22, 40, 0.62) 60%,
    rgba(10, 22, 40, 0.97) 100%
  );
}

.event-head__img {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 20%;
}

.event-head__eyebrow {
  margin: 0 0 var(--sp-3);
  font-family: var(--font-display);
  font-size: var(--fs-tiny);
  font-weight: 600;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--c-accent);
}

.event-head__eyebrow a { border-bottom: 1px solid transparent; }
.event-head__eyebrow a:hover { border-bottom-color: currentColor; }

.event-head__title {
  max-width: 48rem;
  margin: 0;
  font-size: min(clamp(2.25rem, 5vw, 3.75rem), 10vw);
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.event-head .scoreboard { margin-top: var(--sp-8); }

.event-head--plain {
  min-height: 0;
  padding-block: var(--head-pad) var(--sp-8);
}

.event-head--plain::after {
  background-image: radial-gradient(circle, var(--c-grid-strong) 1.3px, transparent 1.9px);
  background-size: 14px 14px;
  -webkit-mask-image: radial-gradient(60% 110% at 85% 35%, #000, transparent 75%);
  mask-image: radial-gradient(60% 110% at 85% 35%, #000, transparent 75%);
}

.event-head--plain .scoreboard { box-shadow: none; }

.event-nav__date {
  font-family: var(--font-display);
  font-size: var(--fs-tiny);
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--c-accent);
}

@media (max-width: 1080px) {
  .event-head .scoreboard {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: var(--sp-4);
    width: 100%;
    padding: var(--sp-4);
  }

  .event-head .scoreboard__cell,
  .event-head .scoreboard__cell + .scoreboard__cell {
    padding: 0;
    border: 0;
  }

  .event-head .scoreboard__cell:nth-child(1),
  .event-head .scoreboard__cell:nth-child(4) { grid-column: 1 / -1; }

  .event-head .scoreboard__cell:nth-child(n+2) {
    padding-top: var(--sp-4);
    border-top: 1px solid var(--c-line);
  }

  .event-head .scoreboard__cell:nth-child(3) {
    padding-left: var(--sp-4);
    border-left: 1px solid var(--c-line);
  }
}

@media (max-width: 700px) {
  .event-head {
    --head-pad: var(--sp-8);

    min-height: clamp(22rem, 70vh, 30rem);
  }

  .event-head .scoreboard__value { font-size: clamp(0.875rem, 4vw, 1.125rem); }
}

@media (max-width: 359px) {
  .event-head .scoreboard { grid-template-columns: minmax(0, 1fr); }

  .event-head .scoreboard__cell:nth-child(3) {
    padding-left: 0;
    border-left: 0;
  }
}