.marble-event-catalog {
  --event-ink: #082b4b;
  --event-title: #07345b;
  --event-muted: #6d8397;
  --event-line: #d7e4ed;
  --event-surface: #ffffff;
  --event-soft: #f4f9fc;
  --event-accent: #087abd;
  --event-accent-bright: #70c9ff;

  width: 100%;

  background:
    linear-gradient(
      180deg,
      #f5f9fc 0,
      #fff 520px
    );

  color: var(--event-ink);
}


/* =========================================================
 * HERO
 * ======================================================= */

.marble-event-catalog__hero {
  padding: 42px 20px 0;
}


.marble-event-catalog__hero-inner {
  position: relative;

  width: min(1180px, 100%);
  min-height: 330px;

  display: flex;
  align-items: center;

  margin: 0 auto;
  padding: 48px 54px;

  overflow: hidden;

  border-radius: 22px;

  background:
    radial-gradient(
      circle at 83% 27%,
      rgba(112, 201, 255, .28),
      transparent 23%
    ),
    linear-gradient(
      135deg,
      #08365c 0%,
      #0a527d 58%,
      #1485be 100%
    );

  box-shadow:
    0 18px 46px rgba(7, 42, 72, .14);
}


.marble-event-catalog__hero-copy {
  position: relative;
  z-index: 2;

  width: min(760px, 100%);
}


.marble-event-catalog__eyebrow {
  margin: 0 0 14px;

  color: var(--event-accent-bright);

  font-size: 12px;
  font-weight: 800;
  line-height: 1.3;

  letter-spacing: .09em;
  text-transform: uppercase;
}


.marble-event-catalog__title {
  margin: 0;

  color: #fff;

  font-size:
    clamp(37px, 4.3vw, 58px);

  font-weight: 800;
  line-height: 1.04;

  letter-spacing: -.03em;
}


.marble-event-catalog__lead {
  max-width: 720px;

  margin: 24px 0 0;

  color:
    rgba(255, 255, 255, .88);

  font-size: 17px;
  line-height: 1.6;
}


.marble-event-catalog__hero-mark {
  position: absolute;
  top: 50%;
  right: 38px;

  width: 300px;
  height: 300px;

  transform:
    translateY(-50%);

  pointer-events: none;
}


.marble-event-catalog__hero-mark span {
  position: absolute;

  border:
    1px solid
    rgba(255,255,255,.15);

  border-radius: 28px;

  transform: rotate(24deg);
}


.marble-event-catalog__hero-mark span:nth-child(1) {
  top: 25px;
  right: 15px;

  width: 180px;
  height: 180px;
}


.marble-event-catalog__hero-mark span:nth-child(2) {
  top: 83px;
  right: 82px;

  width: 126px;
  height: 126px;
}


.marble-event-catalog__hero-mark span:nth-child(3) {
  right: -32px;
  bottom: -5px;

  width: 215px;
  height: 215px;
}


/* =========================================================
 * BODY / TOOLBAR
 * ======================================================= */

.marble-event-catalog__body {
  width: min(1180px, 100%);

  margin: 0 auto;

  padding:
    34px
    20px
    90px;
}


.marble-event-catalog__filters {
  display: grid;

  grid-template-columns:
    minmax(260px, 1fr)
    minmax(150px, 190px)
    minmax(180px, 220px)
    auto;

  gap: 14px;
  align-items: end;

  padding: 20px;

  border:
    1px solid
    var(--event-line);

  border-radius: 16px;

  background:
    rgba(255,255,255,.96);

  box-shadow:
    0 10px 30px
    rgba(10,55,89,.06);
}


.marble-event-filter {
  min-width: 0;
}


.marble-event-filter label {
  display: block;

  margin: 0 0 7px;

  color: #60788c;

  font-size: 12px;
  font-weight: 750;
  line-height: 1.3;
}


.marble-event-filter input,
.marble-event-filter select {
  width: 100%;
  min-height: 45px;

  padding:
    0
    13px;

  border:
    1px solid
    #cbdce8;

  border-radius: 10px;

  outline: none;

  background: #fff;
  color: #173b57;

  font: inherit;
  font-size: 14px;

  box-sizing: border-box;

  transition:
    border-color .15s ease,
    box-shadow .15s ease;
}


.marble-event-filter input:focus,
.marble-event-filter select:focus {
  border-color: #67b6de;

  box-shadow:
    0 0 0 3px
    rgba(21,153,210,.12);
}


.marble-event-filter__actions {
  display: flex;
  align-items: center;
  gap: 10px;

  min-height: 45px;
}


.marble-event-filter__submit {
  min-height: 45px;

  padding:
    0
    20px;

  border: 0;
  border-radius: 10px;

  background:
    linear-gradient(
      135deg,
      #0b5f8f,
      #138bc4
    );

  color: #fff;

  font-size: 14px;
  font-weight: 800;

  cursor: pointer;

  transition:
    transform .15s ease,
    box-shadow .15s ease;
}


.marble-event-filter__submit:hover,
.marble-event-filter__submit:focus-visible {
  transform:
    translateY(-1px);

  box-shadow:
    0 8px 20px
    rgba(8,122,189,.22);
}


.marble-event-filter__reset {
  color:
    var(--event-accent);

  font-size: 13px;
  font-weight: 750;

  text-decoration: none;
}


.marble-event-filter__reset:hover {
  text-decoration: underline;
}


.marble-event-catalog__result-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;

  margin:
    22px
    0
    0;

  padding:
    0
    2px;

  color:
    var(--event-muted);

  font-size: 13px;
}


.marble-event-catalog__result-bar strong {
  color: #173b57;
}


.marble-event-catalog__query {
  min-width: 0;

  overflow: hidden;

  text-overflow: ellipsis;
  white-space: nowrap;
}


/* =========================================================
 * YEAR GROUPS
 * ======================================================= */

.marble-event-catalog__group {
  margin-top: 54px;
}


.marble-event-catalog__group:first-of-type {
  margin-top: 42px;
}


.marble-event-catalog__group-head {
  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 20px;

  margin: 0 0 22px;

  padding:
    0
    0
    16px;

  border-bottom:
    1px solid
    var(--event-line);
}


.marble-event-catalog__group-head h2 {
  margin: 0;

  color:
    var(--event-title);

  font-size:
    clamp(29px, 3vw, 39px);

  line-height: 1;
  letter-spacing: -.03em;
}


.marble-event-catalog__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-width: 36px;
  min-height: 30px;

  padding:
    0
    10px;

  border-radius: 999px;

  background: #eaf6fc;
  color:
    var(--event-accent);

  font-size: 13px;
  font-weight: 800;
}


/* =========================================================
 * EVENT CARDS
 * ======================================================= */

.marble-event-catalog__grid {
  display: grid;

  grid-template-columns:
    repeat(
      2,
      minmax(0, 1fr)
    );

  gap: 20px;
}


.marble-event-card {
  display: grid;

  grid-template-columns:
    205px
    minmax(0, 1fr);

  min-width: 0;
  min-height: 246px;

  overflow: hidden;

  border:
    1px solid
    var(--event-line);

  border-radius: 17px;

  background:
    var(--event-surface);

  box-shadow:
    0 8px 24px
    rgba(10,55,89,.045);

  transition:
    transform .17s ease,
    border-color .17s ease,
    box-shadow .17s ease;
}


.marble-event-card:hover {
  transform:
    translateY(-2px);

  border-color:
    #8fc8e5;

  box-shadow:
    0 15px 34px
    rgba(10,55,89,.095);
}


.marble-event-card--no-media {
  grid-template-columns:
    minmax(0, 1fr);
}


.marble-event-card__media {
  display: block;

  min-width: 0;
  min-height: 100%;

  overflow: hidden;

  background:
    linear-gradient(
      145deg,
      #eaf4fa,
      #f7fbfd
    );
}


.marble-event-card__media img {
  display: block;

  width: 100%;
  height: 100%;

  min-height: 246px;

  object-fit: cover;

  transition:
    transform .3s ease;
}


.marble-event-card:hover
.marble-event-card__media img {
  transform:
    scale(1.025);
}


.marble-event-card__content {
  display: flex;

  min-width: 0;

  flex-direction: column;

  padding:
    22px
    23px
    21px;
}


.marble-event-card__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;

  gap:
    7px
    9px;

  margin:
    0
    0
    12px;

  color:
    var(--event-muted);

  font-size: 11px;
  line-height: 1.35;
}


.marble-event-card__type {
  color:
    var(--event-accent);

  font-weight: 800;

  letter-spacing: .055em;
  text-transform: uppercase;
}


.marble-event-card__year {
  display: inline-flex;
  align-items: center;

  min-height: 23px;

  padding:
    0
    8px;

  border-radius: 999px;

  background: #eaf6fc;
  color:
    var(--event-accent);

  font-weight: 800;
}


.marble-event-card__location {
  overflow: hidden;

  max-width: 100%;

  text-overflow: ellipsis;
  white-space: nowrap;
}


.marble-event-card__title {
  margin: 0;

  color:
    var(--event-title);

  font-size:
    clamp(19px, 1.65vw, 23px);

  line-height: 1.2;

  letter-spacing: -.018em;
}


.marble-event-card__title a {
  color: inherit;

  text-decoration: none;
}


.marble-event-card__title a:hover,
.marble-event-card__title a:focus-visible {
  color:
    var(--event-accent);
}


.marble-event-card__summary {
  display: -webkit-box;

  overflow: hidden;

  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;

  margin:
    13px
    0
    0;

  color: #526d82;

  font-size: 13px;
  line-height: 1.55;
}


.marble-event-card__footer {
  margin-top: auto;

  padding-top: 18px;
}


.marble-event-card__more {
  display: inline-flex;
  align-items: center;

  gap: 8px;

  color:
    var(--event-accent);

  font-size: 13px;
  font-weight: 800;

  text-decoration: none;
}


.marble-event-card__more span {
  transition:
    transform .16s ease;
}


.marble-event-card__more:hover span,
.marble-event-card__more:focus-visible span {
  transform:
    translateX(3px);
}


/* =========================================================
 * EMPTY RESULT
 * ======================================================= */

.marble-event-catalog__empty {
  margin-top: 34px;

  padding:
    54px
    28px;

  border:
    1px solid
    var(--event-line);

  border-radius: 17px;

  background: #fff;

  text-align: center;
}


.marble-event-catalog__empty strong {
  display: block;

  margin-bottom: 8px;

  color:
    var(--event-title);

  font-size: 22px;
}


.marble-event-catalog__empty p {
  margin:
    0
    0
    16px;

  color:
    var(--event-muted);
}


.marble-event-catalog__empty a {
  color:
    var(--event-accent);

  font-weight: 800;

  text-decoration: none;
}


/* =========================================================
 * RESPONSIVE
 * ======================================================= */

@media (max-width: 1100px) {

  .marble-event-catalog__filters {
    grid-template-columns:
      minmax(240px, 1fr)
      minmax(140px, 180px)
      minmax(170px, 210px);
  }


  .marble-event-filter__actions {
    grid-column:
      1 / -1;
  }


  .marble-event-catalog__grid {
    grid-template-columns: 1fr;
  }


  .marble-event-card {
    grid-template-columns:
      minmax(210px, 31%)
      minmax(0, 1fr);
  }


  .marble-event-card--no-media {
    grid-template-columns:
      minmax(0, 1fr);
  }

}


@media (max-width: 720px) {

  .marble-event-catalog__hero {
    padding:
      24px
      14px
      0;
  }


  .marble-event-catalog__hero-inner {
    min-height: 0;

    padding:
      31px
      24px;

    border-radius: 17px;
  }


  .marble-event-catalog__hero-mark {
    display: none;
  }


  .marble-event-catalog__title {
    font-size:
      clamp(
        30px,
        9vw,
        41px
      );
  }


  .marble-event-catalog__lead {
    margin-top: 18px;

    font-size: 15px;
  }


  .marble-event-catalog__body {
    padding:
      25px
      14px
      58px;
  }


  .marble-event-catalog__filters {
    display: grid;

    grid-template-columns: 1fr;

    padding: 16px;

    border-radius: 14px;
  }


  .marble-event-filter__actions {
    grid-column: auto;
  }


  .marble-event-filter__submit {
    flex: 1;
  }


  .marble-event-catalog__result-bar {
    align-items: flex-start;

    flex-direction: column;

    gap: 6px;
  }


  .marble-event-catalog__query {
    white-space: normal;
  }


  .marble-event-catalog__group {
    margin-top: 45px;
  }


  .marble-event-card {
    display: flex;

    min-height: 0;

    flex-direction: column;

    border-radius: 15px;
  }


  .marble-event-card__media {
    min-height: 0;

    aspect-ratio:
      16 / 9;
  }


  .marble-event-card__media img {
    min-height: 0;

    aspect-ratio:
      16 / 9;
  }


  .marble-event-card__content {
    padding:
      20px
      19px;
  }


  .marble-event-card__title {
    font-size: 20px;
  }

}


@media (prefers-reduced-motion: reduce) {

  .marble-event-card,
  .marble-event-card__media img,
  .marble-event-card__more span,
  .marble-event-filter__submit {
    transition: none;
  }

}


/* =========================================================
 * BR-041.7
 * Event catalog card proportion refinement.
 *
 * Keep the editorial three-column catalogue, but give
 * the text column more room than the imported image.
 * ======================================================= */

@media (min-width: 1181px) {

  .marble-event-catalog__hero-inner,
  .marble-event-catalog__body {
    width: min(1240px, 100%);
  }

  .marble-event-catalog__grid {
    grid-template-columns:
      repeat(3, minmax(0, 1fr));

    gap: 22px;
  }

  .marble-event-card {
    grid-template-columns:
      minmax(0, 43%)
      minmax(0, 57%);

    min-height: 258px;
  }

  .marble-event-card__media img {
    min-height: 258px;
  }

  .marble-event-card__content {
    padding:
      20px
      20px
      19px;
  }

  .marble-event-card__meta {
    margin-bottom: 10px;
  }

  .marble-event-card__title {
    font-size: 19px;
    line-height: 1.13;
    letter-spacing: -.015em;
  }

  .marble-event-card__summary {
    -webkit-line-clamp: 3;

    margin-top: 11px;

    font-size: 13px;
    line-height: 1.5;
  }

  .marble-event-card__footer {
    padding-top: 15px;
  }

}


/*
 * Mid-size desktop:
 * retain two columns and give text a little more room.
 */

@media (
  min-width: 721px
)
and (
  max-width: 1180px
) {

  .marble-event-card {
    grid-template-columns:
      minmax(180px, 40%)
      minmax(0, 60%);
  }

  .marble-event-card__title {
    font-size: 20px;
    line-height: 1.15;
  }

}


/* =========================================================
 * BR-041.7A
 * Wider event cards for long Russian event titles.
 * ======================================================= */

@media (min-width: 1200px) {

  .marble-event-catalog__hero-inner,
  .marble-event-catalog__body {
    width: min(1280px, 100%);
  }

  .marble-event-catalog__grid {
    grid-template-columns:
      repeat(3, minmax(0, 1fr));

    gap: 24px;
  }

  .marble-event-card {
    grid-template-columns:
      minmax(0, 40%)
      minmax(0, 60%);

    min-height: 270px;
  }

  .marble-event-card__media img {
    min-height: 270px;
  }

  .marble-event-card__content {
    padding:
      22px
      22px
      20px;
  }

  .marble-event-card__title {
    font-size: 20px;
    line-height: 1.14;

    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
  }

  .marble-event-card__summary {
    -webkit-line-clamp: 3;

    font-size: 13px;
    line-height: 1.5;
  }

}


/*
 * Medium desktop:
 * two cards per row instead of squeezing three.
 */

@media (
  min-width: 900px
)
and (
  max-width: 1199px
) {

  .marble-event-catalog__grid {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));

    gap: 22px;
  }

  .marble-event-card {
    grid-template-columns:
      minmax(0, 38%)
      minmax(0, 62%);
  }

}


/*
 * Long titles must wrap naturally,
 * not break aggressively inside words.
 */

.marble-event-card__title,
.marble-event-card__title a {
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}

/*
 * BR-041.4G
 * Event catalog card width correction.
 *
 * Previous cards were too narrow for real event titles.
 * Desktop intentionally uses three columns so the textual
 * half of every card has enough horizontal space.
 */

@media (min-width: 1180px) {

  .marble-event-catalog__grid,
  .marble-event-catalog__items {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
  }

  .marble-event-card {
    width: 100%;
    min-width: 0;
  }

  .marble-event-card__media {
    width: 42%;
    flex: 0 0 42%;
  }

  .marble-event-card__content {
    width: 58%;
    flex: 1 1 58%;
    min-width: 0;
    padding-left: 22px;
    padding-right: 22px;
  }

  .marble-event-card__title {
    word-break: normal;
    overflow-wrap: normal;
    hyphens: none;
  }
}


/*
 * Intermediate desktop / notebook viewport.
 * Keep three cards where there is enough room.
 */
@media (min-width: 960px) and (max-width: 1179px) {

  .marble-event-catalog__grid,
  .marble-event-catalog__items {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
  }

  .marble-event-card__media {
    width: 40%;
    flex-basis: 40%;
  }

  .marble-event-card__content {
    width: 60%;
    flex-basis: 60%;
    min-width: 0;
  }

  .marble-event-card__title {
    word-break: normal;
    overflow-wrap: normal;
    hyphens: none;
  }
}


/*
 * Tablet: two genuinely wide cards.
 */
@media (min-width: 680px) and (max-width: 959px) {

  .marble-event-catalog__grid,
  .marble-event-catalog__items {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
  }
}



/* =========================================================
 * BR-041.7B
 * FINAL DESKTOP CARD WIDTH AUTHORITY
 *
 * Real catalogue titles require substantially wider cards.
 * Three cards per row is the desktop authority.
 * Height is not intentionally increased.
 * ======================================================= */

@media (min-width: 1100px) {

  .marble-event-catalog__hero-inner,
  .marble-event-catalog__body {
    width: min(1280px, calc(100% - 40px));
  }

  .marble-event-catalog__grid {
    display: grid !important;

    grid-template-columns:
      repeat(3, minmax(0, 1fr)) !important;

    gap: 24px !important;
  }

  .marble-event-card {
    display: grid !important;

    grid-template-columns:
      minmax(0, 38%)
      minmax(0, 62%) !important;

    width: 100% !important;
    min-width: 0 !important;

    /*
     * Do not artificially stretch cards vertically.
     */
    min-height: 0 !important;
  }

  .marble-event-card__media {
    width: auto !important;
    min-width: 0 !important;
    height: 100%;
  }

  .marble-event-card__media img {
    width: 100% !important;
    height: 100% !important;

    min-height: 245px !important;

    object-fit: cover;
  }

  .marble-event-card__content {
    width: auto !important;
    min-width: 0 !important;

    padding:
      20px
      22px
      19px !important;
  }

  .marble-event-card__title {
    font-size: 20px !important;
    line-height: 1.15 !important;

    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
  }

  .marble-event-card__summary {
    margin-top: 12px;

    -webkit-line-clamp: 3;

    font-size: 13px;
    line-height: 1.5;
  }

  .marble-event-card__footer {
    padding-top: 16px;
  }

}


/*
 * Notebook / narrower desktop:
 * still prefer two genuinely readable cards
 * instead of squeezing titles.
 */

@media
  (min-width: 760px)
  and (max-width: 1099px) {

  .marble-event-catalog__grid {
    grid-template-columns:
      repeat(2, minmax(0, 1fr)) !important;
  }

  .marble-event-card {
    grid-template-columns:
      minmax(0, 36%)
      minmax(0, 64%) !important;
  }

}


/* =========================================================
 * BR-041.7C
 * MARBLE PLACEHOLDER FOR EVENTS WITHOUT AN IMAGE
 *
 * Missing media must not collapse the card into a different
 * one-column layout. Keep exactly the same visual geometry
 * as photographed event cards.
 * ======================================================= */

.marble-event-card--no-media {
  position: relative;
}


/*
 * Desktop / notebook.
 *
 * Restore the same media/text proportions as normal cards.
 * The generated pseudo-element occupies the media column.
 */

@media (min-width: 760px) {

  .marble-event-card--no-media {
    display: grid !important;

    grid-template-columns:
      minmax(0, 38%)
      minmax(0, 62%) !important;
  }

  .marble-event-card--no-media::before {
    content: "РФРИТ";

    position: relative;

    display: flex;
    align-items: flex-end;

    min-width: 0;
    min-height: 245px;

    padding:
      22px
      18px;

    box-sizing: border-box;

    overflow: hidden;

    background:
      radial-gradient(
        circle at 74% 27%,
        rgba(112, 201, 255, .38),
        transparent 28%
      ),
      radial-gradient(
        circle at 14% 90%,
        rgba(23, 150, 207, .25),
        transparent 35%
      ),
      linear-gradient(
        145deg,
        #07345b 0%,
        #09517c 58%,
        #1284bd 100%
      );

    color:
      rgba(255, 255, 255, .88);

    font-size: 20px;
    font-weight: 800;

    letter-spacing: .055em;
  }


  /*
   * Decorative Marble geometry.
   *
   * box-shadow creates the secondary outline without
   * introducing another DOM element.
   */

  .marble-event-card--no-media::after {
    content: "";

    position: absolute;

    left: calc(38% - 118px);
    bottom: -62px;

    width: 178px;
    height: 178px;

    border:
      1px solid
      rgba(255, 255, 255, .16);

    border-radius: 50%;

    box-shadow:
      0 0 0 38px
      rgba(255, 255, 255, .045);

    pointer-events: none;
  }


  .marble-event-card--no-media
  .marble-event-card__content {
    grid-column: 2;
    min-width: 0;
  }

}


/*
 * Mobile:
 * placeholder becomes the same 16:9 upper media block
 * as a real event image.
 */

@media (max-width: 759px) {

  .marble-event-card--no-media {
    display: flex !important;
    flex-direction: column;
  }

  .marble-event-card--no-media::before {
    content: "РФРИТ";

    display: flex;
    align-items: flex-end;

    width: 100%;
    min-height: 0;

    aspect-ratio: 16 / 9;

    padding:
      20px;

    box-sizing: border-box;

    background:
      radial-gradient(
        circle at 75% 25%,
        rgba(112, 201, 255, .38),
        transparent 28%
      ),
      linear-gradient(
        145deg,
        #07345b,
        #1184bd
      );

    color:
      rgba(255,255,255,.88);

    font-size: 20px;
    font-weight: 800;

    letter-spacing: .055em;
  }

  .marble-event-card--no-media::after {
    display: none;
  }

}


/*
 * Archive cards without photographs must remain visually
 * equivalent to ordinary event cards.
 */

.marble-event-card--no-media
.marble-event-card__title {
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
}


/* =========================================================
 * BR-041.7D
 * TWO-COLUMN EVENT CATALOG + PHOTO PRESERVATION
 *
 * Real event photography has mixed aspect ratios.
 * Three cards per row forced destructive cropping.
 *
 * Desktop authority:
 *   - two cards per row;
 *   - wider media area;
 *   - contain instead of cover;
 *   - full image remains visible.
 * ======================================================= */


/* ---------------------------------------------------------
 * Wide desktop
 * ------------------------------------------------------ */

@media (min-width: 1100px) {

  .marble-event-catalog__hero-inner,
  .marble-event-catalog__body {
    width: min(
      1280px,
      calc(100% - 40px)
    );
  }


  .marble-event-catalog__grid {
    display: grid !important;

    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      ) !important;

    gap: 26px !important;
  }


  .marble-event-card {
    display: grid !important;

    grid-template-columns:
      minmax(0, 44%)
      minmax(0, 56%) !important;

    width: 100% !important;
    min-width: 0 !important;

    min-height: 300px !important;
  }


  /*
   * Media itself becomes a neutral presentation frame.
   * Different source aspect ratios are allowed.
   */
  .marble-event-card__media {
    display: flex !important;

    align-items: center;
    justify-content: center;

    width: auto !important;
    min-width: 0 !important;
    height: 100%;

    padding: 0;

    overflow: hidden;

    background:
      linear-gradient(
        145deg,
        #edf5fa,
        #f8fbfd
      );
  }


  /*
   * Critical BR-041.7D change:
   * do not crop real event photography.
   */
  .marble-event-card__media img {
    display: block;

    width: 100% !important;
    height: 100% !important;

    min-height: 300px !important;
    max-height: 360px;

    object-fit: contain !important;
    object-position: center center !important;

    background:
      linear-gradient(
        145deg,
        #edf5fa,
        #f8fbfd
      );
  }


  .marble-event-card__content {
    width: auto !important;
    min-width: 0 !important;

    padding:
      24px
      26px
      22px !important;
  }


  .marble-event-card__title {
    font-size: 22px !important;
    line-height: 1.15 !important;

    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
  }


  .marble-event-card__summary {
    margin-top: 14px;

    -webkit-line-clamp: 4;

    font-size: 14px;
    line-height: 1.55;
  }


  .marble-event-card__footer {
    padding-top: 20px;
  }


  /*
   * Placeholder cards must use the same geometry
   * as cards with a real photograph.
   */
  .marble-event-card--no-media {
    grid-template-columns:
      minmax(0, 44%)
      minmax(0, 56%) !important;
  }


  .marble-event-card--no-media::before {
    min-height: 300px !important;
  }


  .marble-event-card--no-media::after {
    left:
      calc(
        44% - 118px
      );
  }


  .marble-event-card--no-media
  .marble-event-card__content {
    grid-column: 2;
  }

}


/* ---------------------------------------------------------
 * Notebook / smaller desktop
 *
 * Still two cards. Once there is not enough room,
 * mobile/tablet rules below take authority.
 * ------------------------------------------------------ */

@media
  (min-width: 820px)
  and (max-width: 1099px) {

  .marble-event-catalog__grid {
    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      ) !important;

    gap: 20px !important;
  }


  .marble-event-card {
    grid-template-columns:
      minmax(0, 42%)
      minmax(0, 58%) !important;

    min-height: 280px !important;
  }


  .marble-event-card__media {
    display: flex !important;

    align-items: center;
    justify-content: center;

    background:
      linear-gradient(
        145deg,
        #edf5fa,
        #f8fbfd
      );
  }


  .marble-event-card__media img {
    width: 100% !important;
    height: 100% !important;

    min-height: 280px !important;

    object-fit: contain !important;
    object-position: center center !important;
  }


  .marble-event-card--no-media {
    grid-template-columns:
      minmax(0, 42%)
      minmax(0, 58%) !important;
  }


  .marble-event-card--no-media::before {
    min-height: 280px !important;
  }

}


/* ---------------------------------------------------------
 * Tablet / mobile
 *
 * One event per row.
 * Preserve source photograph here as well.
 * ------------------------------------------------------ */

@media (max-width: 819px) {

  .marble-event-catalog__grid {
    grid-template-columns:
      minmax(0, 1fr) !important;
  }


  .marble-event-card {
    display: flex !important;
    flex-direction: column;

    min-height: 0 !important;
  }


  .marble-event-card__media {
    display: flex !important;

    align-items: center;
    justify-content: center;

    width: 100% !important;

    min-height: 230px;

    aspect-ratio: auto !important;

    background:
      linear-gradient(
        145deg,
        #edf5fa,
        #f8fbfd
      );
  }


  .marble-event-card__media img {
    width: 100% !important;
    height: auto !important;

    min-height: 0 !important;
    max-height: 420px;

    aspect-ratio: auto !important;

    object-fit: contain !important;
    object-position: center center !important;
  }


  .marble-event-card--no-media::before {
    width: 100%;

    min-height: 230px;

    aspect-ratio: auto;
  }

}


/* =========================================================
 * BR-041.7E
 * FULL-BLEED EVENT MEDIA
 *
 * Images must fill the complete media panel.
 * Two-column layout remains authoritative.
 * ======================================================= */

@media (min-width: 1100px) {

  .marble-event-card {
    grid-template-columns:
      minmax(0, 46%)
      minmax(0, 54%) !important;

    min-height: 310px !important;
  }


  .marble-event-card__media {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    min-width: 0 !important;

    padding: 0 !important;

    overflow: hidden !important;

    background:
      #eaf3f8 !important;
  }


  .marble-event-card__media img {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    min-width: 100% !important;
    min-height: 310px !important;

    max-height: none !important;

    object-fit: cover !important;

    /*
     * Slight upward bias protects faces and speakers
     * better than strict centre-centre cropping.
     */
    object-position:
      center 38% !important;
  }


  .marble-event-card--no-media {
    grid-template-columns:
      minmax(0, 46%)
      minmax(0, 54%) !important;
  }


  .marble-event-card--no-media::before {
    min-height: 310px !important;
  }


  .marble-event-card--no-media::after {
    left:
      calc(
        46% - 118px
      );
  }

}


/* ---------------------------------------------------------
 * Notebook
 * ------------------------------------------------------ */

@media
  (min-width: 820px)
  and (max-width: 1099px) {

  .marble-event-card {
    grid-template-columns:
      minmax(0, 44%)
      minmax(0, 56%) !important;

    min-height: 290px !important;
  }


  .marble-event-card__media {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    padding: 0 !important;

    overflow: hidden !important;
  }


  .marble-event-card__media img {
    width: 100% !important;
    height: 100% !important;

    min-height: 290px !important;

    max-height: none !important;

    object-fit: cover !important;

    object-position:
      center 38% !important;
  }


  .marble-event-card--no-media {
    grid-template-columns:
      minmax(0, 44%)
      minmax(0, 56%) !important;
  }


  .marble-event-card--no-media::before {
    min-height: 290px !important;
  }

}


/* ---------------------------------------------------------
 * Mobile
 *
 * Full-width image remains full bleed.
 * ------------------------------------------------------ */

@media (max-width: 819px) {

  .marble-event-card__media {
    display: block !important;

    width: 100% !important;

    aspect-ratio:
      16 / 10 !important;

    min-height: 0 !important;

    padding: 0 !important;

    overflow: hidden !important;
  }


  .marble-event-card__media img {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    min-height: 0 !important;
    max-height: none !important;

    aspect-ratio:
      16 / 10 !important;

    object-fit: cover !important;

    object-position:
      center 38% !important;
  }


  .marble-event-card--no-media::before {
    aspect-ratio:
      16 / 10 !important;
  }

}


/* BR-042.3B-R2 — public registration metadata. */

.marble-event-card__organizer {
  margin: 0 0 7px;
  color: #607c92;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;
}

.marble-event-card__registration {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  margin: 0 0 9px;
  padding: 5px 9px;
  border: 1px solid #b8dfd0;
  border-radius: 999px;
  background: #edf8f4;
  color: #21694f;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.25;
}

.marble-event-card__registration-dot {
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
}


/* BR-042.3E — compact registration chip. */

.marble-event-card__registration {
  max-width: 100%;
  white-space: nowrap;
}



.marble-event-catalog__hero
.marble-event-catalog__eyebrow {
  color: #79d2f6;
}


.marble-event-card__year {
  display: inline !important;

  min-width: 0 !important;
  min-height: 0 !important;

  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;
  border-radius: 0 !important;

  background: transparent !important;

  box-shadow: none !important;
}





/* ==========================================================
   DEFAULT / NARROW
   ========================================================== */

.marble-event-card {
  overflow: hidden !important;
  border-radius: 17px 17px 0 0 !important;
}

.marble-event-card__media {
  overflow: hidden !important;
  border-radius: 17px 17px 0 0 !important;
}

.marble-event-card__media img,
.marble-event-card__media picture {
  border-radius: 17px 17px 0 0 !important;
}

.marble-event-card__content,
.marble-event-card__body,
.marble-event-card__footer {
  border-radius: 0 !important;
}


/* ==========================================================
   DESKTOP / WIDE
   ========================================================== */

@media (min-width: 64rem) {
  .marble-event-card {
    border-radius: 17px 0 0 17px !important;
  }

  .marble-event-card__media {
    border-radius: 17px 0 0 17px !important;
  }

  .marble-event-card__media img,
  .marble-event-card__media picture {
    border-radius: 17px 0 0 17px !important;
  }

  .marble-event-card__content,
  .marble-event-card__body,
  .marble-event-card__footer {
    border-radius: 0 !important;
  }
}



@media (max-width: 720px) {
  .marble-event-catalog {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  .marble-event-catalog__hero,
  .marble-event-catalog__hero-inner,
  .marble-event-catalog__body,
  .marble-event-catalog__filters,
  .marble-event-catalog__result-bar,
  .marble-event-catalog__group,
  .marble-event-catalog__grid,
  .marble-event-card {
    box-sizing: border-box;
    min-width: 0;
    max-width: 100%;
  }
}