html.content-lightbox-open,
body.content-lightbox-open {
  overflow: hidden !important;
  overscroll-behavior: none;
}

.content-lightbox {
  width: min(920px, calc(100% - 28px));
  max-height: 92vh;
  max-height: 92dvh;
  padding: 0;
  border: 0;
  border-radius: 20px;
  background: #fff;
  color: #334b43;
  box-shadow: 0 26px 80px rgba(0, 0, 0, .4);
  overscroll-behavior: contain;
}

.content-lightbox::backdrop {
  background: rgba(7, 20, 27, .78);
  backdrop-filter: blur(5px);
}

.content-lightbox__shell {
  position: relative;
  max-height: 92vh;
  max-height: 92dvh;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.content-lightbox__close {
  appearance: none;
  -webkit-appearance: none;
  position: sticky;
  z-index: 4;
  float: right;
  top: 12px;
  margin: 12px 12px -58px 0;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 50%;
  background: #fff;
  color: #173148;
  box-shadow: 0 4px 18px rgba(0, 0, 0, .2);
  cursor: pointer;
  font-size: 29px;
  line-height: 1;
  outline: 0;
  -webkit-tap-highlight-color: transparent;
}

.content-lightbox__close::before,
.content-lightbox__close::after {
  content: none !important;
  display: none !important;
}

.content-lightbox__close:focus-visible {
  outline: 0;
  box-shadow: 0 4px 18px rgba(0, 0, 0, .2), 0 0 0 2px rgba(35, 137, 201, .65);
}

.content-lightbox__image {
  display: block;
  width: 100%;
  max-height: 410px;
  object-fit: cover;
  background: #e5ece8;
}

.content-lightbox__body { padding: 38px 44px 46px; }
.content-lightbox__event-kicker {
  margin: 0 55px 10px 0;
  color: #2389c9;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .035em;
}
.content-lightbox__event-kicker span { padding-inline: 5px; }
.content-lightbox__body h2 {
  margin: 5px 55px 18px 0;
  color: #173148;
  font-size: clamp(30px, 4vw, 48px);
  line-height: 1.08;
  overflow-wrap: anywhere;
}
.content-lightbox__meta { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 22px; }
.content-lightbox__meta span { padding: 8px 11px; border-radius: 999px; background: #edf3ef; color: #38554c; font-size: 12px; }
.content-lightbox__summary { margin: 0 0 26px; padding-bottom: 24px; border-bottom: 1px solid rgba(23, 65, 55, .16); color: #56675f; font-size: 17px; line-height: 1.65; }
.content-lightbox .rich-content { color: #435850; font-size: 16px; line-height: 1.75; overflow-wrap: anywhere; }
.content-lightbox .rich-content p,
.content-lightbox .rich-content div { margin: 0 0 1em; }
.content-lightbox .rich-content strong { color: #233f36; font-weight: 800; }
.content-lightbox .rich-content a { color: #2374a3; text-decoration: underline; text-underline-offset: 2px; }

.legacy-event-card[data-home-event-id] {
  cursor: pointer;
  transition: transform .25s ease, box-shadow .25s ease;
}
.legacy-event-card[data-home-event-id]:hover,
.legacy-event-card[data-home-event-id]:focus-visible {
  transform: translateY(-6px);
}
.legacy-event-card[data-home-event-id]:hover {
  outline: 0;
}
.legacy-event-card[data-home-event-id]:focus-visible {
  outline: 3px solid rgba(35, 137, 201, .35);
  outline-offset: 3px;
}
.legacy-event-card__link { padding: 0; border: 0; font-family: inherit; cursor: pointer; }

@media (max-width: 620px) {
  .content-lightbox { width: calc(100% - 16px); max-height: 96dvh; border-radius: 15px; }
  .content-lightbox__shell { max-height: 96dvh; }
  .content-lightbox__image { max-height: 280px; }
  .content-lightbox__body { padding: 27px 21px 34px; }
  .content-lightbox__body h2 { margin-right: 42px; font-size: 30px; }
  .content-lightbox__summary { font-size: 15px; }
  .content-lightbox .rich-content { font-size: 15px; }
  .content-lightbox__close { top: 8px; margin: 8px 8px -52px 0; width: 40px; height: 40px; }
}
