/* EU-MIC follows the existing engagement section's typography and colours. */
.eu-mic-story {
  display: block;
  margin-top: 65px;
  padding-top: 53px;
  border-top: 1px solid #ffc9a880;
}
.eu-mic-header {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  align-items: center;
  gap: 40px;
  margin-bottom: 40px;
}
.eu-mic-header .story-heading { margin: 0; grid-column: auto; grid-row: auto; }
.eu-mic-header h3 { max-width: 20ch; }
.eu-mic-logo {
  justify-self: end;
  width: min(100%, 370px);
  padding: 8px;
  border-radius: 16px;
  background: #fff;
}
.eu-mic-logo img { width: 100%; height: auto; }
.eu-mic-intro {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  align-items: start;
  gap: 56px;
}
.eu-mic-story .eu-mic-copy { max-width: 60ch; grid-column: auto; grid-row: auto; }
.eu-mic-copy h4 { color: var(--paper); margin: 30px 0 18px; }
.eu-mic-copy strong { color: var(--paper); font-weight: 650; }
.eu-mic-statement-photo { margin-top: 6px; }
.eu-mic-gallery {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 5fr);
  align-items: start;
  gap: 32px;
  margin-top: 48px;
}
.eu-mic-story figcaption { color: #c7d7e1; }
.photo-credit { display: block; margin-top: 3px; }
.eu-mic-story .event-photo > a { display: block; border-radius: 24px; }
.eu-mic-story .event-photo > a:hover img { opacity: .94; }
@media (max-width: 1000px) {
  .eu-mic-header, .eu-mic-intro { gap: 32px; }
}
@media (max-width: 760px) {
  .eu-mic-story { margin-top: 48px; padding-top: 43px; }
  .eu-mic-header, .eu-mic-intro, .eu-mic-gallery { grid-template-columns: minmax(0, 1fr); }
  .eu-mic-header { gap: 28px; margin-bottom: 30px; }
  .eu-mic-logo { justify-self: start; width: min(100%, 370px); border-radius: 12px; }
  .eu-mic-intro { gap: 30px; }
  .eu-mic-statement-photo { max-width: 520px; margin-top: 6px; }
  .eu-mic-gallery { gap: 32px; margin-top: 32px; }
  .eu-mic-panel-photo { max-width: 520px; }
  .eu-mic-story .event-photo > a { border-radius: 20px; }
}