.mec-events,
.mec-events * {
  box-sizing: border-box;
}

.mec-events {
  --mec-ink: #211d19;
  --mec-muted: #655e55;
  --mec-bg: #f2f8fa;
  --mec-surface: #f7fbfc;
  --mec-paper: #ffffff;
  --mec-board: #f8fbfc;
  --mec-line: rgba(33, 29, 25, 0.16);
  --mec-line-soft: rgba(33, 29, 25, 0.09);
  --mec-cta: #0099c2;
  --mec-cta-dark: #006a89;
  --mec-link: #a7472c;
  --mec-food: #d29c27;
  --mec-music: #188bb4;
  --mec-cocktails: #4e9470;
  --mec-community: #7968a6;
  --mec-sports: #c85d3d;
  --mec-general: #987956;
  --mec-accent: var(--mec-general);
  --mec-radius: 16px;
  --mec-font-display: "Bebas Neue", "Oswald", "Arial Narrow", Arial, sans-serif;
  --mec-font-body: Georgia, "Times New Roman", serif;
  --mec-font-ui: Arial, Helvetica, sans-serif;
  --mec-button-radius: 0.55rem;
  --mec-gap: clamp(0.9rem, 2.2vw, 1.4rem);
  position: relative;
  overflow: visible;
  background: var(--mec-bg);
  color: var(--mec-ink);
  font-family: var(--mec-font-body);
  padding: clamp(0.85rem, 2.2vw, 1.55rem) 1rem;
}

.mec-events__inner {
  width: min(1360px, 100%);
  margin: 0 auto;
}

.mec-events__header {
  position: relative;
  margin: 0 0 clamp(0.65rem, 1.6vw, 0.98rem);
  padding-top: 0.38rem;
}

.mec-events__header::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 0.72rem;
  height: 0.18rem;
  background: var(--mec-food);
  box-shadow:
    0.92rem 0 0 var(--mec-music),
    1.84rem 0 0 var(--mec-cocktails),
    2.76rem 0 0 var(--mec-community);
}

.mec-events__header--full {
  display: grid;
  gap: 0.75rem;
  align-items: end;
}

.mec-events__header h2 {
  margin: 0;
  color: var(--mec-ink);
  font: inherit;
  font-size: clamp(1.7rem, 4.8vw, 2.72rem);
  font-weight: 950;
  line-height: 0.98;
  letter-spacing: -0.045em;
  text-wrap: balance;
}

.mec-events__header p {
  max-width: 38rem;
  margin: 0.28rem 0 0;
  color: var(--mec-muted);
  font-size: clamp(0.9rem, 1.8vw, 1rem);
  line-height: 1.35;
}

.mec-events__layout {
  display: grid;
  gap: var(--mec-gap);
}

.mec-events__side {
  display: grid;
  align-content: start;
  gap: 0.72rem;
}

.mec-events__artwork {
  position: relative;
  align-self: start;
}

.mec-events__poster-link,
.mec-events__poster-placeholder {
  width: 100%;
  overflow: hidden;
  background: var(--mec-paper);
  border-radius: 0.44rem;
  box-shadow: 0 0.38rem 1rem rgba(33, 29, 25, 0.12);
}

.mec-events__poster-link[hidden],
.mec-events__poster-placeholder[hidden],
.mec-events__artwork-when[hidden],
.mec-events__artwork-text[hidden],
.mec-events__artwork-location[hidden],
.mec-events__artwork-links [hidden] {
  display: none !important;
}

.mec-events__poster-link {
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

.mec-events__poster-link img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  object-fit: contain;
  background: var(--mec-paper);
}

.mec-events__poster-placeholder {
  aspect-ratio: 8.5 / 11;
  position: relative;
  display: grid;
  align-content: end;
  gap: 0.72rem;
  padding: 12%;
  color: var(--mec-ink);
  text-align: left;
}

.mec-events__artwork-info {
  margin-top: 0.62rem;
  padding: 0.78rem 0.2rem 0;
  color: var(--mec-ink);
}

.mec-events__artwork-kicker {
  margin: 0 0 0.18rem;
  color: var(--mec-muted);
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  line-height: 1.1;
  text-transform: uppercase;
}

.mec-events__artwork-info h3 {
  margin: 0;
  color: var(--mec-ink);
  font: inherit;
  font-size: clamp(1rem, 2.1vw, 1.22rem);
  font-weight: 950;
  line-height: 1.05;
  letter-spacing: -0.025em;
}

.mec-events__artwork-when,
.mec-events__artwork-text,
.mec-events__artwork-location {
  margin: 0.28rem 0 0;
  color: var(--mec-muted);
  font-size: 0.82rem;
  line-height: 1.32;
}

.mec-events__artwork-when {
  color: #763525;
  font-weight: 860;
}

.mec-events__artwork-location a {
  color: var(--mec-cta-dark) !important;
  font: inherit;
  font-weight: inherit;
  text-decoration: underline !important;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.16em;
}

.mec-events__poster-placeholder::before {
  content: "";
  position: absolute;
  left: 12%;
  right: 12%;
  top: 13%;
  height: 0.22rem;
  background: var(--mec-music);
  box-shadow:
    0 0.62rem 0 var(--mec-food),
    0 1.24rem 0 var(--mec-cocktails);
}

.mec-events__poster-placeholder::after {
  content: "";
  position: absolute;
  right: 11%;
  bottom: 13%;
  width: 3.4rem;
  height: 3.4rem;
  border: 0.42rem solid rgba(24, 139, 180, 0.22);
  border-radius: 999px;
  pointer-events: none;
}

.mec-events__poster-placeholder small {
  position: relative;
  z-index: 1;
  color: var(--mec-muted);
  font-size: 0.73rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.mec-events__poster-placeholder span {
  position: relative;
  z-index: 1;
  max-width: 12rem;
  color: var(--mec-ink);
  font-size: clamp(1.78rem, 6vw, 2.55rem);
  font-weight: 950;
  line-height: 0.92;
  letter-spacing: -0.045em;
}

.mec-events__list-card {
  position: relative;
  background: var(--mec-board);
  border-radius: var(--mec-radius);
  padding: clamp(0.82rem, 1.9vw, 1.1rem);
  box-shadow: 0 0.45rem 1.2rem rgba(33, 29, 25, 0.07);
}

.mec-events__list-scroll {
  min-height: 0;
}

.mec-events__list-card::before {
  content: "";
  display: block;
  width: 3.6rem;
  height: 0.22rem;
  margin-bottom: 0.62rem;
  background: var(--mec-link);
}

.mec-events__list-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  margin: 0 0 0.18rem;
  padding: 0 0 0.2rem;
}

.mec-events__list-head h3 {
  margin: 0;
  color: var(--mec-ink);
  font: inherit;
  font-size: 1.04rem;
  font-weight: 950;
  line-height: 1.1;
  letter-spacing: -0.012em;
}

.mec-events__list-context {
  color: var(--mec-muted);
  font-family: var(--mec-font-ui);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.mec-events__list,
.mec-events__list--full {
  list-style: none;
  padding: 0;
  margin: 0;
}

.mec-event {
  --mec-accent: var(--mec-general);
  display: grid;
  grid-template-columns: minmax(5.85rem, 6.25rem) minmax(0, 1fr);
  gap: 1rem;
  position: relative;
  margin: 0.18rem 0;
  padding: 0.68rem 0;
}

.mec-event[hidden] {
  display: none !important;
}

.mec-event + .mec-event {
  box-shadow: 0 -1px 0 var(--mec-line-soft);
}

.mec-event--type-food { --mec-accent: var(--mec-food); }
.mec-event--type-music { --mec-accent: var(--mec-music); }
.mec-event--type-cocktails { --mec-accent: var(--mec-cocktails); }
.mec-event--type-community { --mec-accent: var(--mec-community); }
.mec-event--type-sports { --mec-accent: var(--mec-sports); }
.mec-event--type-general { --mec-accent: var(--mec-general); }

.mec-event::before {
  content: "";
  position: absolute;
  left: -0.82rem;
  top: 0.78rem;
  bottom: 0.78rem;
  width: 0.25rem;
  border-radius: 999px;
  background: var(--mec-accent);
}

.mec-event__select {
  display: none;
}

.mec-events.is-selecting-events .mec-event__select {
  display: inline-flex;
  grid-column: 1 / -1;
  align-items: center;
  gap: 0.45rem;
  margin: 0 0 -0.08rem;
  color: var(--mec-ink);
  font-size: 0.82rem;
  font-weight: 900;
}

.mec-event__select[hidden] {
  display: none !important;
}

.mec-event__select input {
  width: 1.05rem;
  height: 1.05rem;
  accent-color: var(--mec-cta);
}

.mec-event__date {
  align-self: start;
  display: grid;
  align-content: start;
  justify-items: start;
  row-gap: 0.14rem;
  color: var(--mec-ink);
  line-height: 1.08;
  text-align: left;
}

.mec-event__weekday {
  display: block;
  color: var(--mec-ink);
  font-size: 0.66rem;
  font-weight: 950;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.mec-event__month {
  display: block;
  color: var(--mec-muted);
  font-size: 0.63rem;
  font-weight: 950;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.mec-event__day {
  display: block;
  color: var(--mec-ink);
  font-size: 1.46rem;
  font-weight: 950;
}

.mec-event__type {
  display: block;
  width: 100%;
  margin-top: 0.28rem;
  color: var(--mec-accent);
  font-size: 0.66rem;
  font-weight: 950;
  letter-spacing: 0.07em;
  line-height: 1.22;
  overflow-wrap: anywhere;
  text-transform: uppercase;
}

.mec-event__body {
  min-width: 0;
}

.mec-event__title {
  margin: 0;
  color: var(--mec-ink);
  font: inherit;
  font-size: clamp(1rem, 2.7vw, 1.08rem);
  font-weight: 950;
  line-height: 1.15;
  letter-spacing: -0.014em;
}

.mec-event__time {
  display: block;
  margin: 0.15rem 0 0;
  color: #763525;
  font-size: 0.9rem;
  font-weight: 920;
  line-height: 1.2;
}

.mec-event__text,
.mec-event__when {
  margin: 0;
  color: var(--mec-muted);
  font-size: 0.91rem;
  line-height: 1.32;
}

.mec-event__text {
  margin-top: 0.18rem;
}

.mec-event__links,
.mec-events__artwork-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.32rem 0.78rem;
  margin-top: 0.24rem;
  min-height: 28px;
}

.mec-event__details-toggle,
.mec-event__add-calendar {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  font: inherit;
  font-size: 0.79rem;
  font-weight: 850;
  line-height: 1.2;
  text-decoration: underline !important;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.16em;
  list-style: none;
  appearance: none;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: transparent;
}

.mec-event__details-toggle,
.mec-event__details-toggle:active,
.mec-event__details-toggle:focus,
.mec-event__details-toggle:focus-visible,
.mec-event__details-toggle[aria-expanded="true"] {
  color: var(--mec-link) !important;
}

.mec-event__add-calendar,
.mec-event__add-calendar:active,
.mec-event__add-calendar:focus,
.mec-event__add-calendar:focus-visible,
.mec-event__add-calendar:visited {
  color: var(--mec-cta-dark) !important;
}

.mec-event__add-calendar::before {
  content: "+ ";
  text-decoration: none;
}

.mec-event__panel-wrap {
  width: 100%;
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition: max-height 260ms cubic-bezier(0.22, 0.75, 0.28, 1), opacity 200ms ease;
}

.mec-event__panel-wrap[aria-hidden="true"] {
  visibility: hidden;
}

.mec-event.is-details-open .mec-event__panel-wrap {
  opacity: 1;
}

.mec-event__panel {
  margin-top: 0.42rem;
  padding: 0.08rem 0 0;
  color: var(--mec-muted);
}

.mec-event__panel p {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.4;
}

.mec-events__controls {
  display: grid;
  gap: 0.6rem;
  padding: 0.72rem;
  background: rgba(255, 255, 255, 0.78);
  border-radius: 0.52rem;
  box-shadow: inset 0 0 0 1px var(--mec-line-soft);
}

.mec-events__select-row,
.mec-events__bulk-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 0.48rem;
}

.mec-events__field {
  display: grid;
  gap: 0.24rem;
  flex: 1 1 12rem;
  min-width: min(100%, 12rem);
}

.mec-events__field span {
  color: var(--mec-muted);
  font-size: 0.66rem;
  font-weight: 950;
  letter-spacing: 0.1em;
  line-height: 1.1;
  text-transform: uppercase;
}

.mec-events__select,
.mec-events__select-mode,
.mec-events__subscribe-toggle,
.mec-events__add-all {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0.62rem 0.9rem;
  border: 1px solid var(--mec-line);
  border-radius: var(--mec-button-radius);
  background: var(--mec-paper);
  color: var(--mec-ink) !important;
  cursor: pointer;
  font: inherit;
  font-size: 0.84rem;
  font-weight: 850;
  line-height: 1.1;
  text-decoration: none !important;
  box-shadow: 0 1px 2px rgba(44, 26, 18, 0.10);
  -webkit-tap-highlight-color: transparent;
}

.mec-events__select {
  width: 100%;
  justify-content: start;
  appearance: auto;
}

.mec-events__mode-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0.48rem;
  flex: 1 1 15rem;
  max-width: 22rem;
}

.mec-events__select-mode,
.mec-events__subscribe-toggle {
  width: 100%;
}

.mec-events__add-all {
  border-color: var(--mec-cta);
  background: var(--mec-cta);
  color: #ffffff !important;
  box-shadow: 0 2px 6px rgba(0, 106, 137, 0.24);
}

.mec-events__add-all {
  flex: 1 1 15rem;
  max-width: 22rem;
}

.mec-events__bulk-actions {
  justify-content: center;
}

.mec-events__select-mode[aria-pressed="true"],
.mec-events__subscribe-toggle[aria-expanded="true"] {
  border-color: rgba(0, 153, 194, 0.28);
  background: rgba(0, 153, 194, 0.12);
  color: var(--mec-cta-dark) !important;
}

.mec-events__subscribe-popover[hidden] {
  display: none !important;
}

.mec-events__subscribe-popover {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 1rem;
}

.mec-events__subscribe-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(23, 15, 11, 0.42);
}

.mec-events__subscribe-panel {
  position: relative;
  z-index: 1;
  width: min(100%, 24rem);
  padding: 1rem;
  border-radius: 0.75rem;
  background: var(--mec-paper);
  color: var(--mec-ink);
  box-shadow: 0 1rem 2.25rem rgba(44, 26, 18, 0.24);
}

.mec-events__subscribe-panel h3 {
  margin: 0 2rem 0.3rem 0;
  color: var(--mec-ink);
  font-size: 1.15rem;
  font-weight: 950;
}

.mec-events__subscribe-panel p {
  margin: 0 0 0.75rem;
  color: var(--mec-muted);
  font-size: 0.92rem;
  line-height: 1.35;
}

.mec-events__subscribe-close {
  position: absolute;
  top: 0.58rem;
  right: 0.58rem;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  min-width: 2.35rem;
  height: 2.35rem;
  min-height: 2.35rem;
  margin: 0;
  padding: 0 !important;
  text-align: center;
  border: 1px solid var(--mec-line);
  border-radius: 0.55rem;
  background: var(--mec-bg);
  color: var(--mec-ink);
  cursor: pointer;
  font: inherit;
  font-size: 1.2rem;
  line-height: 1;
}

.mec-events__subscribe-options {
  display: grid;
  gap: 0.5rem;
}

.mec-events__subscribe-options a,
.mec-events__subscribe-options button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 44px;
  margin: 0 !important;
  padding: 0.66rem 0.9rem;
  border: 1px solid var(--mec-line);
  border-radius: var(--mec-button-radius);
  background: var(--mec-bg);
  color: var(--mec-ink) !important;
  font-size: 0.9rem;
  font-weight: 850;
  text-align: center;
  text-decoration: none !important;
  box-shadow: 0 1px 2px rgba(44, 26, 18, 0.08);
  cursor: pointer;
  font-family: inherit;
  line-height: 1.2;
}

.mec-events__bulk-provider-panel[hidden] {
  display: none !important;
}

.mec-events__bulk-provider-panel {
  margin-top: 0.8rem;
  padding-top: 0.8rem;
  border-top: 1px solid var(--mec-line-soft);
}

.mec-events__bulk-provider-panel h4 {
  margin: 0 0 0.3rem;
  color: var(--mec-ink);
  font-size: 0.98rem;
  font-weight: 950;
}

.mec-events__bulk-direct-links {
  display: grid;
  gap: 0.45rem;
  max-height: min(42vh, 18rem);
  overflow: auto;
  padding-right: 0.15rem;
}

.mec-events__bulk-direct-links a {
  display: flex;
  align-items: center;
  min-height: 42px;
  padding: 0.58rem 0.72rem;
  border: 1px solid var(--mec-line);
  border-radius: var(--mec-button-radius);
  background: var(--mec-bg);
  color: var(--mec-ink) !important;
  font-size: 0.86rem;
  font-weight: 850;
  line-height: 1.25;
  text-decoration: none !important;
}

.mec-events__add-all[aria-disabled="true"] {
  opacity: 0.58;
  cursor: not-allowed;
}

.mec-events__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.58rem;
  margin-top: 0.68rem;
  padding-top: 0.64rem;
  box-shadow: 0 -1px 0 var(--mec-line-soft);
}

.mec-events__actions--final {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0.58rem;
}

.mec-events__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  width: 100%;
  padding: 0.72rem 1rem;
  border: 0;
  border-radius: var(--mec-button-radius);
  background: var(--mec-cta);
  color: #ffffff !important;
  cursor: pointer;
  font: inherit;
  font-weight: 950;
  line-height: 1.1;
  text-decoration: none !important;
  box-shadow: 0 2px 6px rgba(0, 106, 137, 0.24);
  -webkit-tap-highlight-color: transparent;
}

.mec-events__button--secondary {
  background: var(--mec-paper);
  color: var(--mec-ink) !important;
  border: 1px solid var(--mec-line);
  box-shadow: 0 1px 2px rgba(44, 26, 18, 0.08);
}

.mec-events__full-link {
  margin: 0.54rem 0 0;
  text-align: center;
  font-size: 0.82rem;
  line-height: 1.25;
}

.mec-events__full-link a {
  color: var(--mec-cta-dark) !important;
  font: inherit;
  text-decoration: underline !important;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.16em;
}

.mec-events__empty,
.mec-events__no-results {
  margin: 0.72rem 0 0;
  color: var(--mec-muted);
  font-size: 1rem;
  line-height: 1.4;
}


.mec-events__select-mode:active,
.mec-events__subscribe-toggle:active,
.mec-events__add-all:active,
.mec-events__button:active,
.mec-events__subscribe-options a:active,
.mec-events__subscribe-options button:active {
  transform: translateY(1px);
}

.mec-events a:focus-visible,
.mec-events summary:focus-visible,
.mec-events button:focus-visible,
.mec-events select:focus-visible,
.mec-events input:focus-visible {
  outline: 3px solid var(--mec-cta);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .mec-event__panel-wrap {
    transition: none;
  }
}

@media (min-width: 680px) {
  .mec-events {
    padding-inline: clamp(1.15rem, 2vw, 1.75rem);
  }

  .mec-events__header--full {
    grid-template-columns: minmax(0, 1fr);
  }

  .mec-events__layout {
    grid-template-columns: minmax(14.75rem, 17rem) minmax(0, 1fr);
    align-items: start;
  }

  .mec-events__layout--full {
    grid-template-columns: minmax(14.75rem, 17rem) minmax(0, 1fr);
  }

  .mec-events__side {
    position: sticky;
    top: 1rem;
    align-self: start;
    max-height: var(--mec-viewport-panel-height, calc(100svh - 2rem));
    overflow: visible;
    padding-right: 0;
    gap: 0.56rem;
  }

  .mec-events__artwork {
    height: auto;
  }

  .mec-events__poster-link {
    min-height: 0;
  }

  .mec-events__poster-link img {
    width: auto;
    max-width: 100%;
    max-height: min(28svh, 17rem);
  }

  .mec-events__poster-placeholder {
    min-height: 8.5rem;
    max-height: min(28svh, 17rem);
  }

  .mec-events__artwork-info {
    margin-top: 0.48rem;
    padding-top: 0.58rem;
  }

  .mec-events__artwork-when,
  .mec-events__artwork-text,
  .mec-events__artwork-location {
    margin-top: 0.22rem;
  }

  .mec-events__controls {
    gap: 0.46rem;
    padding: 0.56rem;
  }

  .mec-events__side .mec-events__field {
    flex-basis: 100%;
    min-width: 0;
  }

  .mec-events__side .mec-events__select-row,
  .mec-events__side .mec-events__bulk-actions {
    gap: 0.4rem;
  }

  .mec-events__side .mec-events__select,
  .mec-events__side .mec-events__select-mode,
  .mec-events__side .mec-events__subscribe-toggle,
  .mec-events__side .mec-events__add-all {
    min-height: 40px;
    padding-block: 0.52rem;
  }

  .mec-events__list-card {
    display: flex;
    flex-direction: column;
    height: auto;
    max-height: var(--mec-viewport-panel-height, calc(100svh - 2rem));
    overflow: hidden;
  }

  .mec-events__list-head,
  .mec-events__actions--final,
  .mec-events__full-link {
    flex: 0 0 auto;
  }

  .mec-events__list-scroll {
    flex: 0 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior-y: auto;
    scrollbar-gutter: stable;
    padding-right: 0.34rem;
  }

  .mec-events--home .mec-events__list-scroll {
    max-height: calc(var(--mec-viewport-panel-height, 42rem) - 9rem);
  }

  .mec-events--full .mec-events__list-scroll {
    max-height: calc(var(--mec-viewport-panel-height, 42rem) - 5.6rem);
  }

  .mec-event {
    grid-template-columns: minmax(6.2rem, 7rem) minmax(0, 1fr);
    gap: 1.05rem;
  }
}

@media (min-width: 980px) {
  .mec-events__layout,
  .mec-events__layout--full {
    grid-template-columns: minmax(16rem, 18rem) minmax(0, 1fr);
    gap: clamp(1rem, 1.7vw, 1.45rem);
  }

  .mec-events__list-card {
    padding: 1rem 1.1rem 1.04rem;
  }

  .mec-event {
    padding-block: 0.66rem;
  }

  .mec-events__list--full .mec-event {
    grid-template-columns: minmax(7rem, 7.8rem) minmax(0, 1fr);
    padding-block: 0.76rem;
  }
}

@media (max-width: 420px) {
  .mec-events {
    padding-left: 0.85rem;
    padding-right: 0.85rem;
  }

  .mec-events__header h2 {
    font-size: clamp(1.62rem, 7.8vw, 2rem);
  }

  .mec-events__header p {
    font-size: 0.9rem;
  }

  .mec-events__list-card {
    padding: 0.76rem 0.82rem;
  }

  .mec-event {
    grid-template-columns: minmax(5.95rem, 6.2rem) minmax(0, 1fr);
    gap: 0.82rem;
    padding-block: 0.62rem;
  }

  .mec-event::before {
    left: -0.82rem;
  }

  .mec-event__title {
    font-size: 0.98rem;
  }

  .mec-event__time {
    font-size: 0.86rem;
  }

  .mec-event__text {
    font-size: 0.88rem;
  }

  .mec-event__type {
    font-size: 0.62rem;
    letter-spacing: 0.055em;
  }

  .mec-events__bulk-actions,
  .mec-events__select-row {
    align-items: stretch;
  }

  .mec-events__add-all,
  .mec-events__mode-row {
    width: 100%;
    max-width: none;
  }
}

/* 1.2.11 layout correction: controls above the list, restored category bars, larger flyer. */
.mec-events__header--with-controls {
  display: grid;
  gap: 0.85rem;
  align-items: end;
}

.mec-events__header-copy {
  min-width: 0;
}

.mec-events__header-controls {
  min-width: 0;
}

.mec-events__header-controls .mec-events__controls {
  padding: 0;
  background: transparent;
  border-radius: 0;
  box-shadow: none;
}

.mec-events__header-controls .mec-events__mode-row--single {
  grid-template-columns: minmax(0, 1fr);
}

/* Keep the event-type cue inside the scroll/card boundary so it cannot be clipped. */
.mec-event {
  padding-left: 0.72rem;
  padding-right: 0.3rem;
}

.mec-event::before {
  left: 0;
}

.mec-event__body {
  padding-right: 0.45rem;
}

@media (min-width: 680px) {
  .mec-events__layout,
  .mec-events__layout--full {
    grid-template-columns: minmax(17rem, 19.5rem) minmax(0, 1fr);
    column-gap: clamp(1rem, 1.7vw, 1.45rem);
  }

  .mec-events__header-controls .mec-events__controls {
    grid-template-columns: minmax(0, 1.45fr) minmax(17rem, 0.9fr);
    align-items: end;
    gap: 0.58rem;
  }

  .mec-events__header-controls .mec-events__select-row,
  .mec-events__header-controls .mec-events__bulk-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: end;
    gap: 0.48rem;
  }

  .mec-events__header-controls .mec-events__field,
  .mec-events__header-controls .mec-events__add-all,
  .mec-events__header-controls .mec-events__mode-row {
    width: 100%;
    min-width: 0;
    max-width: none;
    flex: none;
  }

  .mec-events__header-controls .mec-events__select,
  .mec-events__header-controls .mec-events__select-mode,
  .mec-events__header-controls .mec-events__add-all {
    min-height: 42px;
  }

  .mec-events__side {
    max-height: none;
    overflow: visible;
  }

  .mec-events__poster-link img {
    max-height: min(38svh, 23rem);
  }

  .mec-events__poster-placeholder {
    max-height: min(38svh, 23rem);
  }

  .mec-events__list-scroll {
    padding-right: clamp(0.9rem, 1.5vw, 1.4rem);
  }

  .mec-event__body {
    padding-right: clamp(0.4rem, 0.9vw, 0.85rem);
  }
}

@media (min-width: 900px) {
  .mec-events__header--with-controls {
    grid-template-columns: minmax(20rem, 23rem) minmax(0, 1fr);
    column-gap: clamp(1rem, 1.7vw, 1.45rem);
    align-items: end;
  }
}

@media (min-width: 980px) {
  .mec-events__layout,
  .mec-events__layout--full {
    grid-template-columns: minmax(20rem, 23rem) minmax(0, 1fr);
  }

  .mec-events__poster-link img,
  .mec-events__poster-placeholder {
    max-height: min(42svh, 26rem);
  }
}

@media (max-width: 679px) {
  .mec-events__header-controls .mec-events__controls {
    padding: 0.62rem;
    background: rgba(255, 255, 255, 0.78);
    border-radius: 0.52rem;
    box-shadow: inset 0 0 0 1px var(--mec-line-soft);
  }

  .mec-events__header-controls .mec-events__mode-row--single,
  .mec-events__header-controls .mec-events__add-all {
    width: 100%;
    max-width: none;
  }
}

/* Dashboard-controlled behavior retained from 1.3.0; 1.3.4 uses native filter selects. */
.mec-events {
  --mec-button-radius: 0.55rem;
}

.mec-events__select-mode,
.mec-events__subscribe-toggle,
.mec-events__add-all,
.mec-events__button,
.mec-events__subscribe-options a,
.mec-events__subscribe-options button,
.mec-events__subscribe-close {
  border-radius: var(--mec-button-radius);
}

.mec-events__actions--single {
  grid-template-columns: minmax(0, 1fr);
}

.mec-events__list-scroll {
  scrollbar-width: none;
  scrollbar-gutter: auto;
  -ms-overflow-style: none;
}

.mec-events__list-scroll::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

.mec-event--filter-enter {
  animation: mec-filter-fade-down var(--mec-filter-duration, 280ms) cubic-bezier(0.22, 0.75, 0.28, 1) both;
  animation-delay: var(--mec-filter-delay, 0ms);
}

@keyframes mec-filter-fade-down {
  from {
    opacity: 0;
    transform: translateY(-0.55rem);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .mec-event--filter-enter {
    transition: none;
    animation: none;
  }
}

@media (min-width: 680px) {
  .mec-events__header-controls .mec-events__controls {
    grid-template-columns: minmax(0, 1.55fr) minmax(17rem, 0.82fr);
  }

  .mec-events__header-controls .mec-events__bulk-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mec-events__header-controls .mec-events__add-all,
  .mec-events__header-controls .mec-events__select-mode {
    width: 100%;
    max-width: none;
    min-width: 0;
  }

  .mec-events__layout--no-artwork {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .mec-events:not(.mec-events--sticky-artwork) .mec-events__side {
    position: static;
    top: auto;
    max-height: none;
  }

  .mec-events:not(.mec-events--scroll-list) .mec-events__list-card {
    max-height: none;
    overflow: visible;
  }

  .mec-events:not(.mec-events--scroll-list) .mec-events__list-scroll {
    max-height: none;
    overflow: visible;
  }
}

@media (max-width: 679px) {
  .mec-events__header-controls .mec-events__controls {
    border-radius: 0.55rem;
  }

  .mec-events__bulk-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }
}

/* 1.3.5 desktop/tablet control-row sizing and alignment correction. */
@media (min-width: 680px) {
  .mec-events__header-controls .mec-events__controls {
    grid-template-columns: max-content max-content;
    justify-content: start;
    align-items: end;
    gap: 0.72rem;
  }

  .mec-events__header-controls .mec-events__select-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    justify-content: start;
    width: auto;
  }

  .mec-events__header-controls .mec-events__field {
    width: clamp(10.5rem, 17vw, 13rem);
  }

  .mec-events__header-controls .mec-events__bulk-actions {
    grid-template-columns: repeat(2, max-content);
    justify-content: start;
    align-items: end;
    align-self: end;
    width: auto;
    padding-top: 0;
  }

  .mec-events__header-controls .mec-events__select,
  .mec-events__header-controls .mec-events__add-all,
  .mec-events__header-controls .mec-events__select-mode {
    height: 42px;
    min-height: 42px;
  }

  .mec-events__header-controls .mec-events__add-all,
  .mec-events__header-controls .mec-events__select-mode {
    width: auto;
    min-width: 8.75rem;
    max-width: none;
    white-space: nowrap;
  }
}

@media (min-width: 900px) and (max-width: 1199px) {
  .mec-events__header--with-controls {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* 1.3.6 approved typography and homepage list-context corrections. */
.mec-events__header h2,
.mec-events__list-head h3 {
  font-family: var(--mec-font-display);
}

.mec-events__controls,
.mec-events__field,
.mec-events__select,
.mec-events__select-mode,
.mec-events__add-all,
.mec-events__button,
.mec-events__subscribe-panel,
.mec-events__subscribe-options,
.mec-events__subscribe-options button,
.mec-events__bulk-provider-panel,
.mec-events__bulk-direct-links,
.mec-events__subscribe-close,
.mec-events__full-link,
.mec-event__date,
.mec-event__select,
.mec-event__time,
.mec-event__links,
.mec-events__artwork-kicker {
  font-family: var(--mec-font-ui);
}

.mec-event__title,
.mec-event__text,
.mec-event__panel,
.mec-events__artwork-info h3,
.mec-events__artwork-when,
.mec-events__artwork-text,
.mec-events__artwork-location {
  font-family: var(--mec-font-body);
}

@media (min-width: 680px) {
  .mec-events--home .mec-events__layout {
    align-items: stretch;
  }

  .mec-events--home .mec-events__list-card {
    align-self: stretch;
  }

  .mec-events--home .mec-events__list-scroll {
    flex: 1 1 auto;
  }
}


/* 1.3.12/1.3.13 content-aware event windows and shared proportional scroll indicator. */
.mec-events__scroll-shell {
  min-width: 0;
  min-height: 0;
}

.mec-events__scroll-affordance[hidden] {
  display: none !important;
}

@media (min-width: 680px) {
  .mec-events--home,
  .mec-events--full {
    --mec-section-catch-offset: 88px;
  }

  .mec-events--home .mec-events__list-card {
    max-height: none;
  }

  .mec-events--home .mec-events__scroll-shell,
  .mec-events--full .mec-events__scroll-shell {
    position: relative;
    min-height: 0;
  }

  .mec-events--home .mec-events__scroll-shell {
    flex: 0 0 auto;
  }

  .mec-events--full .mec-events__scroll-shell {
    flex: 0 1 auto;
  }

  .mec-events--home .mec-events__list-scroll {
    flex: 0 0 auto;
    height: var(--mec-home-event-window-height, auto);
    max-height: var(--mec-home-event-window-height, none);
  }

  .mec-events--home .mec-events__list-scroll,
  .mec-events--full .mec-events__list-scroll {
    padding-right: 0.88rem;
    outline: none;
  }

  .mec-events--home .mec-events__list-scroll:focus-visible,
  .mec-events--full .mec-events__list-scroll:focus-visible {
    box-shadow: inset 0 0 0 2px rgba(0, 106, 137, 0.55);
  }

  .mec-events--home .mec-events__scroll-affordance,
  .mec-events--full .mec-events__scroll-affordance {
    position: absolute;
    top: 0.18rem;
    right: 0.08rem;
    bottom: 0.1rem;
    display: flex;
    width: 4.8rem;
    flex-direction: column;
    align-items: flex-end;
    pointer-events: none;
    opacity: 0.62;
    transition: opacity 180ms ease;
  }

  .mec-events--home .mec-events__scroll-track,
  .mec-events--full .mec-events__scroll-track {
    position: relative;
    display: block;
    width: 1px;
    min-height: 2.75rem;
    flex: 1 1 auto;
    margin-right: 0.2rem;
    background: rgba(33, 29, 25, 0.18);
  }

  .mec-events--home .mec-events__scroll-thumb,
  .mec-events--full .mec-events__scroll-thumb {
    position: absolute;
    top: 0;
    right: -0.5px;
    display: block;
    width: 2px;
    min-height: 14px;
    background: rgba(0, 106, 137, 0.72);
    transform: translateY(0);
    transform-origin: top right;
    transition:
      height 200ms cubic-bezier(0.22, 0.75, 0.28, 1),
      transform 120ms linear,
      background-color 180ms ease;
  }

  .mec-events--home .mec-events__scroll-hint,
  .mec-events--full .mec-events__scroll-hint {
    display: block;
    margin-top: 0.26rem;
    color: var(--mec-muted);
    font-family: var(--mec-font-ui);
    font-size: 0.57rem;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: 0.045em;
    text-align: right;
    white-space: nowrap;
    opacity: 0;
    transform: translateY(-0.08rem);
    transition: opacity 220ms ease, transform 220ms ease;
  }

  .mec-events__scroll-affordance.is-hint-visible .mec-events__scroll-hint {
    opacity: 0.78;
    transform: translateY(0);
  }

  .mec-events__scroll-affordance.is-scrolling {
    opacity: 0.92;
  }

  .mec-events__scroll-affordance.is-scrolling .mec-events__scroll-thumb {
    background: rgba(0, 106, 137, 0.92);
  }
}

@media (max-width: 679px) {
  .mec-events--home .mec-events__scroll-affordance,
  .mec-events--full .mec-events__scroll-affordance {
    display: none !important;
  }

  .mec-events--home .mec-events__list-scroll,
  .mec-events--full .mec-events__list-scroll {
    height: auto !important;
    max-height: none !important;
    overflow: visible;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mec-events__scroll-affordance,
  .mec-events__scroll-thumb,
  .mec-events__scroll-hint {
    transition: none;
  }
}


/* 1.3.14 narrow regression repair: aligned controls, bounded full-list viewport, contained list scrolling. */
@media (min-width: 680px) {
  .mec-events__header-controls .mec-events__controls {
    align-items: end !important;
  }

  .mec-events__header-controls .mec-events__select-row,
  .mec-events__header-controls .mec-events__bulk-actions {
    align-self: end !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .mec-events__header-controls .mec-events__add-all,
  .mec-events__header-controls .mec-events__select-mode {
    align-self: end !important;
    box-sizing: border-box;
    margin: 0 !important;
  }

  .mec-events--full.mec-events--has-overflow .mec-events__list-card {
    height: var(--mec-viewport-panel-height, calc(100svh - 2rem));
    max-height: var(--mec-viewport-panel-height, calc(100svh - 2rem));
    overflow: hidden;
  }

  .mec-events--full.mec-events--has-overflow .mec-events__scroll-shell {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
  }

  .mec-events--full.mec-events--has-overflow .mec-events__list-scroll {
    box-sizing: border-box;
    height: 100%;
    max-height: none;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-y: contain;
  }

  .mec-events--full .mec-events__actions--final {
    position: relative;
    z-index: 2;
    background: var(--mec-board);
  }

  .mec-events--home .mec-events__list-scroll {
    overscroll-behavior-y: contain;
  }
}


/* 1.3.15 live-theme control alignment correction.
 * The action group is measured against the first native select at runtime so
 * Enfold or page-builder button rules cannot push the buttons off the select line. */
@media (min-width: 680px) {
  .mec-events__header-controls .mec-events__bulk-actions {
    position: relative;
    top: var(--mec-control-row-offset, 0px);
  }
}

/* 1.3.17 full-calendar section-height correction.
 * When artwork is present, let the event board stretch to the full grid-row
 * height established by the flyer/information column. The internal event
 * viewport consumes only the space above the final CTA row, preserving the
 * card's existing padding and masking behavior. No-artwork calendars retain
 * the viewport-based height used by the prior release. */
@media (min-width: 680px) {
  .mec-events--full .mec-events__layout--full:not(.mec-events__layout--no-artwork) {
    align-items: stretch;
  }

  .mec-events--full .mec-events__layout--full:not(.mec-events__layout--no-artwork) > .mec-events__list-card {
    align-self: stretch;
    height: auto;
    min-height: 0;
    max-height: none;
  }

  .mec-events--full .mec-events__layout--full:not(.mec-events__layout--no-artwork) > .mec-events__list-card .mec-events__scroll-shell {
    flex: 1 1 0;
    min-height: 0;
    overflow: hidden;
  }

  .mec-events--full .mec-events__layout--full:not(.mec-events__layout--no-artwork) > .mec-events__list-card .mec-events__list-scroll {
    box-sizing: border-box;
    height: 100%;
    min-height: 0;
    max-height: none;
    overflow-x: hidden;
    overflow-y: auto;
  }
}


/* 1.3.18 concurrent-event and time-label safety.
 * Simultaneous/overlapping calendar events remain independent list rows. The
 * time line is never height-clamped or hidden by theme paragraph rules. */
.mec-event {
  align-items: start;
  min-height: max-content;
  overflow: visible;
}

.mec-event__date,
.mec-event__body {
  align-self: start;
  min-height: min-content;
  overflow: visible;
}

.mec-event__time {
  height: auto !important;
  min-height: 1.2em;
  max-height: none !important;
  overflow: visible !important;
  white-space: normal;
  text-overflow: clip;
}

/* 1.3.19 progressive event-list pagination.
 * The control lives at the end of the currently revealed event rows, so it
 * naturally enters view only when the visitor reaches the list bottom. */
.mec-events__load-more-wrap {
  display: flex;
  justify-content: center;
  padding: 0.72rem 0 0.18rem;
}

.mec-events__load-more-wrap[hidden] {
  display: none !important;
}

.mec-events__load-more {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0.58rem 1rem;
  border: 1px solid var(--mec-line);
  border-radius: var(--mec-button-radius);
  background: var(--mec-paper);
  color: var(--mec-cta-dark);
  cursor: pointer;
  font-family: var(--mec-font-ui);
  font-size: 0.82rem;
  font-weight: 800;
  line-height: 1;
  text-decoration: none;
  box-shadow: 0 1px 2px rgba(33, 29, 25, 0.08);
  -webkit-tap-highlight-color: transparent;
}

.mec-events__load-more:active {
  transform: translateY(1px);
}

.mec-events__load-more:disabled {
  cursor: default;
  opacity: 0.55;
}

/* 1.3.20 progressive server loading and stable flyer stage.
 * Only the initial event batch is present in the page HTML. Additional rows
 * are requested near the end of the loaded list. The flyer media frame uses a
 * portrait-safe fixed ratio so portrait and landscape artwork cannot resize
 * the calendar section when the active flyer changes. */
.mec-events__poster-stage {
  position: relative;
  width: 100%;
  aspect-ratio: 8.5 / 11;
  overflow: hidden;
  border-radius: 0.44rem;
  background: var(--mec-paper);
  box-shadow: 0 0.38rem 1rem rgba(33, 29, 25, 0.12);
  transition: opacity 180ms ease, transform 220ms cubic-bezier(0.22, 0.75, 0.28, 1);
}

.mec-events__poster-stage .mec-events__poster-link,
.mec-events__poster-stage .mec-events__poster-placeholder {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 0;
  max-height: none;
  aspect-ratio: auto;
  border-radius: 0;
  box-shadow: none;
}

.mec-events__poster-stage .mec-events__poster-link {
  align-items: center;
}

.mec-events__poster-stage .mec-events__poster-link img {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: none;
  object-fit: contain;
  object-position: center;
}

.mec-events__artwork-info {
  min-height: 9.75rem;
  transition: opacity 160ms ease, transform 200ms cubic-bezier(0.22, 0.75, 0.28, 1);
}

.mec-events__artwork.is-flyer-changing .mec-events__poster-stage,
.mec-events__artwork.is-flyer-changing .mec-events__artwork-info {
  opacity: 0.18;
  transform: translateY(0.12rem) scale(0.996);
}

.mec-events.is-loading-events .mec-events__load-more {
  cursor: progress;
}

@media (min-width: 680px) {
  .mec-events__artwork {
    width: 100%;
  }

  .mec-events__poster-stage {
    min-height: 0;
  }

  .mec-events__artwork-info {
    min-height: 10.5rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mec-events__poster-stage,
  .mec-events__artwork-info {
    transition: none;
  }
}


/* 1.3.24 stable viewport section sizing.
 * Reserve the two 60px site-header rows and four percent of the viewport above
 * and below the panel. The panel height is independent of its document position,
 * preventing the homepage calendar from collapsing when it appears below hero
 * content or when the page is already scrolled. */
.mec-events__poster-stage {
  height: var(--mec-poster-stage-height, min(28svh, 17rem));
  aspect-ratio: auto;
  transition: height 680ms cubic-bezier(0.22, 0.75, 0.28, 1);
  will-change: height;
}

.mec-events__artwork-info {
  transition: none;
}

.mec-events__artwork.is-flyer-changing .mec-events__poster-stage,
.mec-events__artwork.is-flyer-changing .mec-events__artwork-info {
  opacity: 1;
  transform: none;
}

@media (min-width: 680px) {
  .mec-events--home,
  .mec-events--full {
    --mec-site-chrome-height: 120px;
    --mec-section-catch-offset: calc(var(--mec-site-chrome-height) + 4vh);
    box-sizing: border-box;
    margin-top: var(--mec-calendar-section-margin, 4vh);
    margin-bottom: var(--mec-calendar-section-margin, 4vh);
    height: var(--mec-calendar-section-height, calc(100svh - var(--mec-site-chrome-height) - 8vh));
    min-height: 0;
    max-height: var(--mec-calendar-section-height, calc(100svh - var(--mec-site-chrome-height) - 8vh));
    overflow: hidden;
  }

  .mec-events--home .mec-events__inner,
  .mec-events--full .mec-events__inner {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
  }

  .mec-events--home .mec-events__header,
  .mec-events--full .mec-events__header {
    flex: 0 0 auto;
  }

  .mec-events--home .mec-events__layout,
  .mec-events--full .mec-events__layout {
    flex: 1 1 auto;
    min-height: 0;
    height: auto;
    align-items: stretch;
    overflow: hidden;
  }

  .mec-events--home .mec-events__side,
  .mec-events--full .mec-events__side {
    position: static;
    top: auto;
    align-self: stretch;
    height: 100%;
    min-height: 0;
    max-height: none;
    overflow: hidden;
  }

  .mec-events--home .mec-events__list-card,
  .mec-events--full .mec-events__list-card,
  .mec-events--full.mec-events--has-overflow .mec-events__list-card,
  .mec-events--full .mec-events__layout--full:not(.mec-events__layout--no-artwork) > .mec-events__list-card {
    align-self: stretch;
    box-sizing: border-box;
    height: 100%;
    min-height: 0;
    max-height: none;
    overflow: hidden;
  }

  .mec-events--home .mec-events__scroll-shell,
  .mec-events--full .mec-events__scroll-shell,
  .mec-events--full.mec-events--has-overflow .mec-events__scroll-shell,
  .mec-events--full .mec-events__layout--full:not(.mec-events__layout--no-artwork) > .mec-events__list-card .mec-events__scroll-shell {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
  }

  .mec-events--home .mec-events__list-scroll,
  .mec-events--full .mec-events__list-scroll,
  .mec-events--full.mec-events--has-overflow .mec-events__list-scroll,
  .mec-events--full .mec-events__layout--full:not(.mec-events__layout--no-artwork) > .mec-events__list-card .mec-events__list-scroll {
    box-sizing: border-box;
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    max-height: none;
    overflow-x: hidden;
    overflow-y: auto;
  }

  .mec-events--home .mec-events__artwork,
  .mec-events--full .mec-events__artwork {
    min-height: 0;
    max-height: 100%;
    overflow: hidden;
  }
}

@media (max-width: 679px) {
  .mec-events__poster-stage {
    height: var(--mec-poster-stage-height, min(105vw, 32rem));
    max-height: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mec-events__poster-stage {
    transition: none;
  }
}


/* 1.3.25 individual-calendar-only controls.
 * Bulk add and selection mode are retired. Keep the two native filters in the
 * established header-control position without reserving an empty action column. */
@media (min-width: 680px) {
  .mec-events__header-controls .mec-events__controls {
    grid-template-columns: max-content;
    justify-content: start;
  }

  .mec-events__header-controls .mec-events__select-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.mec-events__calendar-copy-note {
  margin: 0.35rem 0 0.85rem;
  color: var(--mec-muted);
  font-size: 0.88rem;
  line-height: 1.45;
}