.sml-events {
  max-width: var(--max-bg-color);
  margin-inline: auto;
  padding: var(--sp4) var(--sp1-5);
}

.sml-events__tabs {
  display: flex;
  align-items: stretch;
  gap: var(--sp0-5);
  border-bottom: 2px solid var(--color-text-neutral-loud);
  margin-bottom: var(--sp3);
}

.sml-events__tab {
  position: relative;
  border: 4px solid transparent;
  border-bottom-width: 0;
  margin-bottom: -2px;
  color: var(--color-text-neutral-loud);
  font-family: var(--sml-font-jost);
  font-weight: 600;
  padding: var(--sp0-5) var(--sp0-5) var(--sp1);
  text-decoration: none;
}

.sml-events__tab:hover,
.sml-events__tab:focus-visible {
  color: var(--color-text-neutral-loud);
}

.sml-events__tab.is-active {
  border-color: var(--color-text-neutral-loud);
  border-bottom-color: var(--sml-white, #fff);
  color: var(--color-text-neutral-loud);
}

.sml-events__tab.is-active::after {
  content: "";
  position: absolute;
  inset-inline: -4px;
  bottom: -2px;
  border-bottom: 4px solid var(--color-text-neutral-loud);
}

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

.sml-events__results {
  display: grid;
  gap: var(--sp2-5);
}

.sml-event-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--sp1);
  align-items: center;
  border: 2px solid var(--color-text-neutral-loud);
  border-radius: 0.625rem;
  padding: var(--sp1);
  background: var(--sml-white, #fff);
}

.sml-event-card__dates {
  display: flex;
  align-items: center;
  gap: var(--sp);
}

.sml-event-card__date {
  display: grid;
  width: 57px;
  min-height: 6.75rem;
  align-content: center;
  justify-items: center;
  padding: var(--sp0-5) var(--sp0-25);
  border: 3px solid var(--color-text-neutral-loud);
  border-radius: 0.25rem;
  background: var(--sml-purple);
  color: var(--sml-white, #fff);
  font-family: var(--sml-font-jost);
  font-weight: 600;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
}

.sml-event-card__month,
.sml-event-card__year {
  font-size: 0.625rem;
  letter-spacing: 0.02em;
}

.sml-event-card__day {
  font-family: var(--sml-font-code-pro-bold);
  font-size: 1.75rem;
  margin-block: var(--sp0-5);
}

.sml-event-card__date-separator {
  width: var(--sp1);
  border-top: 2px solid currentColor;
}

.sml-event-card__content {
  min-width: 0;
}

.sml-event-card__eyebrow {
  margin: 0 0 var(--sp0-5);
  font-family: var(--sml-font-code-pro-bold);
  font-size: 0.875rem;
  text-transform: uppercase;
}

.node--type-grant.sml-event-card .sml-event-card__eyebrow--open {
  color: var(--sml-purple);
}

.node--type-grant.sml-event-card .sml-event-card__eyebrow--closed {
  color: var(--sml-black);
}

.sml-event-card__title {
  margin: 0 0 var(--sp1);
  font-family: var(--sml-font-code-pro-bold);
  font-size: clamp(1.125rem, 2vw, 1.5rem);
  line-height: 1.2;
}

.sml-event-card__title a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.sml-event-card__title a:hover,
.sml-event-card__title a:focus-visible,
.sml-event-card__image a:hover,
.sml-event-card__image a:focus-visible {
  color: var(--sml-purple);
}

.sml-event-card__details {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp1) var(--sp1-5);
  font-family: var(--sml-font-jost);
  font-weight: 500;
}

.sml-event-card__meta {
  display: inline-flex;
  align-items: center;
  gap: var(--sp0-5);
}

.sml-event-card__icon {
  flex-shrink: 0;
  color: var(--sml-purple);
}

.sml-event-card__image {
  grid-column: 1 / -1;
  order: 3;
}

.sml-event-card__image .field,
.sml-event-card__image .field__item,
.sml-event-card__image a {
  display: block;
  height: 100%;
}

.sml-event-card__image img {
  display: block;
  width: 100%;
  max-height: 12rem;
  object-fit: cover;
}

.sml-events__filter {
  height: fit-content;
  border: 2px solid var(--color-text-neutral-loud);
  border-radius: 0.625rem;
  box-shadow: 0 0.25rem 1.25rem rgb(0 0 0 / 35%);
  padding: var(--sp1-5);
  background: var(--sml-white, #fff);
}

.sml-events__filter-fieldset {
  margin: 0;
  padding: 0;
  border: 0;
  min-inline-size: 0;
}

.sml-events__filter-legend {
  margin: 0 0 var(--sp1);
  padding: 0;
  font-family: var(--sml-font-jost);
  font-size: 1rem;
  font-weight: 600;
}

.sml-events__filter-options {
  display: grid;
  gap: var(--sp0-75);
}

.sml-events__filter-option {
  display: flex;
  align-items: center;
  gap: var(--sp0-75);
  margin: 0;
  font-family: var(--sml-font-jost);
  font-weight: 500;
  cursor: pointer;
}

.sml-events__filter-option input {
  flex-shrink: 0;
  margin: 0;
  accent-color: var(--sml-purple);
}

/* Select is JS-only while the filter stacks above results. Radios remain
 * the no-JS fallback, and return at the sidebar breakpoint (64rem). */
.sml-events__filter-picker {
  display: none;
}

html.js .sml-events__filter-picker {
  display: block;
}

html.js .sml-events__filter-select {
  display: block;
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  height: 60px;
  padding: 12px 52px 12px 14px;
  font-family: var(--sml-font-jost);
  font-weight: 400;
  font-size: 1rem;
  line-height: 35px;
  color: var(--sml-black);
  background-color: var(--sml-white);
  background-image: url("../../images/icons/arrow-drop-down.svg");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 29.5px 29.5px;
  border: 3px solid var(--sml-black);
  border-radius: 5px;
  appearance: none;
}

html.js .sml-events__filter-select:focus {
  border: 3px solid var(--sml-black);
  outline: 2px solid var(--sml-black);
  outline-offset: 2px;
}

html.js .sml-events__filter-options {
  display: none;
}

@media (max-width: 47.99rem) {
  .node--type-grant.sml-event-card {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: 1.25rem;
    border-width: 3px;
    padding: 2rem 2.5rem;
  }

  .node--type-grant.sml-event-card .sml-event-card__dates {
    gap: 1rem;
  }

  .node--type-grant.sml-event-card .sml-event-card__date {
    box-sizing: border-box;
    width: 57px;
    height: 148px;
    min-height: 148px;
    align-content: center;
    justify-items: center;
    padding: 12px 2px;
    row-gap: 0.35rem;
    text-align: center;
  }

  .node--type-grant.sml-event-card .sml-event-card__month,
  .node--type-grant.sml-event-card .sml-event-card__year {
    font-size: 1rem;
    letter-spacing: 0;
  }

  .node--type-grant.sml-event-card .sml-event-card__day {
    font-size: 1.75rem;
    margin-block: 0;
  }

  .node--type-grant.sml-event-card .sml-event-card__date-separator {
    width: 17px;
    border-top-width: 3px;
    border-color: var(--sml-black);
  }

  .node--type-grant.sml-event-card .sml-event-card__eyebrow {
    margin-bottom: 1rem;
  }

  .node--type-grant.sml-event-card .sml-event-card__title {
    margin-bottom: 1rem;
    font-size: 1.5rem;
    line-height: 1.75rem;
  }

  .node--type-grant.sml-event-card .sml-event-card__details {
    font-weight: 400;
    font-size: 1.125rem;
  }

  .node--type-grant.sml-event-card .sml-event-card__meta {
    gap: 0.5rem;
  }

  .node--type-grant.sml-event-card .sml-event-card__icon {
    width: 24px;
    height: 24px;
  }
}

@media (max-width: 424px) {
  .sml-event-card--range {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
  }

  .sml-event-card--range .sml-event-card__content {
    display: contents;
  }

  .sml-event-card--range .sml-event-card__eyebrow,
  .sml-event-card--range .sml-event-card__title {
    order: 1;
  }

  .sml-event-card--range .sml-event-card__title {
    margin-bottom: 0;
  }

  .sml-event-card--range .sml-event-card__dates {
    order: 2;
    justify-self: start;
  }

  .sml-event-card--range .sml-event-card__details {
    order: 3;
  }

  .sml-event-card--range .sml-event-card__image {
    order: 4;
  }
}

@media (min-width: 48rem) {
  .sml-events {
    padding-inline: var(--sp3);
  }

  .sml-event-card {
    gap: var(--sp1-5);
    min-height: 12.25rem;
    padding: var(--sp1-5);
  }
}

@media (min-width: 64rem) {
  .sml-events__layout--filtered {
    grid-template-columns: minmax(0, 1fr) minmax(16rem, 25%);
    gap: var(--sp3);
  }

  .sml-events__results {
    grid-column: 1;
  }

  .sml-events__filter {
    grid-column: 2;
    grid-row: 1;
  }

  html.js .sml-events__filter-picker {
    display: none;
  }

  html.js .sml-events__filter-options {
    display: grid;
  }

  .sml-event-card:has(.sml-event-card__image) {
    grid-template-columns: auto minmax(0, 1fr) 11rem;
  }

  .sml-event-card__image {
    grid-column: 3;
    grid-row: 1;
    align-self: stretch;
    height: calc(100% + var(--sp3));
    margin-block: calc(-1 * var(--sp1-5));
    margin-inline-end: calc(-1 * var(--sp1-5));
    overflow: hidden;
    border-inline-start: 2px solid var(--color-text-neutral-loud);
  }

  .sml-event-card__image .field,
  .sml-event-card__image .field__item,
  .sml-event-card__image a {
    height: 100%;
  }

  .sml-event-card__image img {
    width: 100%;
    height: 100%;
    max-height: none;
    object-fit: cover;
  }
}

/* ---------------------------------------------------------------------------
 * Event / campaign detail (Figma 1273:2693).
 *
 * Structured Event Details (left column + image) above Files, Location, and
 * paragraph sections. Section rules are 3px black and stay in the text column.
 * ------------------------------------------------------------------------- */
.sml-event-detail {
  max-width: var(--sml-container-max);
  margin-inline: auto;
  padding: var(--sp3) var(--sml-container-pad) var(--sp4);
}

.sml-event-detail__structured {
  display: grid;
  gap: var(--sp2);
}

.sml-event-detail__main {
  padding-bottom: var(--sp4);
  border-bottom: 3px solid #000;
}

.sml-event-detail__heading {
  margin: 0 0 var(--sp1-5);
  font-family: var(--sml-font-code-pro-black);
  font-weight: 400;
  font-size: clamp(2rem, 1.5rem + 1.5vw, 2.5rem);
  line-height: normal;
  color: var(--sml-black);
}

.sml-event-detail__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.5rem;
  margin: 0 0 var(--sp1-5);
  padding: 0;
  list-style: none;
}

.sml-event-detail__meta-item {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--sml-font-jost);
  font-weight: 500;
  font-size: 1.125rem;
  line-height: normal;
  color: var(--sml-black);
}

.sml-event-detail__icon {
  flex-shrink: 0;
  display: block;
  width: 24px;
  height: 24px;
  overflow: hidden;
}

.sml-event-detail__body {
  font-family: var(--sml-font-jost);
  font-size: 1.125rem;
  line-height: 1.9;
  color: var(--sml-black);
}

.sml-event-detail__body p {
  margin: 0 0 1em;
}

.sml-event-detail__body p:last-child {
  margin-bottom: 0;
}

.sml-event-detail__body hr,
.sml-event-detail__layout-builder hr {
  height: 3px;
  margin: var(--sp4) 0;
  border: 0;
  background: #000;
}

.sml-event-detail__image {
  width: 100%;
  max-width: 25rem;
  border-radius: 0.625rem;
  overflow: hidden;
}

.sml-event-detail__image .field,
.sml-event-detail__image .field__item {
  margin: 0;
}

.sml-event-detail__image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 0.625rem;
}

.sml-event-detail__files {
  max-width: 51.6875rem;
  margin-inline: 0;
  padding-block: var(--sp4);
  border-bottom: 3px solid #000;
}

.sml-event-detail__file-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.sml-event-detail__file-item + .sml-event-detail__file-item {
  margin-top: var(--sp0-5);
}

.sml-event-detail__file-link {
  font-family: var(--sml-font-jost);
  font-weight: 700;
  font-size: 1rem;
  line-height: 2.1875;
  color: var(--sml-black);
  text-decoration: underline;
}

.sml-event-detail__file-link:hover,
.sml-event-detail__file-link:focus {
  color: var(--sml-purple);
}

.sml-event-detail__location {
  max-width: 51.6875rem;
  margin-inline: 0;
  padding-block: var(--sp4);
  border-bottom: 3px solid #000;
}

.sml-event-detail__subheading {
  margin: 0 0 var(--sp1-5);
  font-family: var(--sml-font-code-pro-bold);
  font-weight: 400;
  font-size: clamp(1.75rem, 1.4rem + 1vw, 2rem);
  line-height: 1.3125;
  color: var(--sml-black);
}

.sml-event-detail__map {
  display: block;
  width: 100%;
  height: 21.875rem;
  margin-bottom: var(--sp1-5);
  border: 0;
  border-radius: 0.625rem;
}

.sml-event-detail__address {
  margin: 0 0 var(--sp1);
  font-family: var(--sml-font-jost);
  font-weight: 500;
  font-size: 1rem;
  line-height: 2.1875;
  color: var(--sml-black);
}

.sml-event-detail__directions {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  font-family: var(--sml-font-jost);
  font-weight: 700;
  font-size: 1rem;
  line-height: 2.1875;
  color: var(--sml-black);
  text-decoration: underline;
}

.sml-event-detail__directions:hover,
.sml-event-detail__directions:focus {
  color: var(--sml-purple);
}

.sml-event-detail__layout-builder {
  max-width: 51.6875rem;
  margin-inline: 0;
  margin-top: 0;
  padding-top: var(--sp4);
}

.sml-event-detail__layout-builder .layout__region:empty {
  display: none;
}

.sml-event-detail__layout-builder:not(:has(.block, .field, p, img, ul, ol, h2, h3)) {
  display: none;
  margin-top: 0;
  padding-top: 0;
}

.sml-event-detail .component-header {
  margin: 0 0 var(--sp1-5);
  padding: 0;
  border-bottom: 0;
  font-family: var(--sml-font-code-pro-bold);
  font-weight: 400;
  font-size: clamp(1.75rem, 1.4rem + 1vw, 2rem);
  line-height: 1.3125;
  color: var(--sml-black);
  text-transform: none;
}

.sml-event-detail .component-header-icon {
  display: none;
}

/* Icon + link rows in sections such as Get Involved (Figma 1273:2770). */
.sml-event-detail:not(.sml-event-detail--grant) .sml-event-detail__layout-builder .sml-element-text__body .text-content p:has(i[class*="fa-"]),
.sml-event-detail:not(.sml-event-detail--grant) .sml-event-detail__layout-builder .sml-element-text__body .text-content p:has(.svg-inline--fa) {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
  font-size: 0;
  line-height: 0;
}

.sml-event-detail:not(.sml-event-detail--grant) .sml-event-detail__layout-builder .sml-element-text__body .text-content p:has(i[class*="fa-"]) + p:has(i[class*="fa-"]),
.sml-event-detail:not(.sml-event-detail--grant) .sml-event-detail__layout-builder .sml-element-text__body .text-content p:has(.svg-inline--fa) + p:has(.svg-inline--fa) {
  margin-top: 1.5rem;
}

.sml-event-detail:not(.sml-event-detail--grant) .sml-event-detail__layout-builder .sml-element-text__body .text-content p:has(i[class*="fa-"]) a:where(:not(.button, .btn)),
.sml-event-detail:not(.sml-event-detail--grant) .sml-event-detail__layout-builder .sml-element-text__body .text-content p:has(.svg-inline--fa) a:where(:not(.button, .btn)) {
  font-family: var(--sml-font-jost);
  font-weight: 700;
  font-size: 1.125rem;
  line-height: normal;
  color: var(--sml-black);
  text-decoration: underline;
  text-underline-offset: 0.12em;
  box-shadow: none;
  -webkit-text-decoration: underline;
}

.sml-event-detail:not(.sml-event-detail--grant) .sml-event-detail__layout-builder .sml-element-text__body .text-content p:has(i[class*="fa-"]) a:where(:not(.button, .btn)):hover,
.sml-event-detail:not(.sml-event-detail--grant) .sml-event-detail__layout-builder .sml-element-text__body .text-content p:has(i[class*="fa-"]) a:where(:not(.button, .btn)):focus,
.sml-event-detail:not(.sml-event-detail--grant) .sml-event-detail__layout-builder .sml-element-text__body .text-content p:has(.svg-inline--fa) a:where(:not(.button, .btn)):hover,
.sml-event-detail:not(.sml-event-detail--grant) .sml-event-detail__layout-builder .sml-element-text__body .text-content p:has(.svg-inline--fa) a:where(:not(.button, .btn)):focus {
  color: var(--sml-purple);
  text-decoration: underline;
  box-shadow: none;
}

.sml-event-detail:not(.sml-event-detail--grant) .sml-event-detail__layout-builder .sml-element-text__body .text-content p :is(i[class*="fa-"], .svg-inline--fa) {
  flex-shrink: 0;
  display: block;
  width: 24px;
  height: 24px;
  overflow: hidden;
  color: var(--sml-purple);
}

.sml-event-detail__layout-builder .savemolives-section,
.sml-event-detail__layout-builder .elemental-section,
.sml-event-detail__layout-builder .sml-row {
  margin-block-end: 0;
}

.sml-event-detail__layout-builder .sml-row > .sml-col {
  padding-right: 0;
  padding-left: 0;
  margin-bottom: 0;
}

.sml-event-detail__layout-builder .field--name-field-section-rows > .field__item + .field__item,
.sml-event-detail__layout-builder .field--name-field-p-section > .field__item + .field__item {
  margin-top: var(--sp4);
  padding-top: var(--sp4);
  border-top: 3px solid #000;
}

@media (max-width: 767px) {
  .sml-event-detail__layout-builder .sml-row > .sml-col + .sml-col {
    margin-top: var(--sp4);
    padding-top: var(--sp4);
    border-top: 3px solid #000;
  }
}

@media (min-width: 48rem) {
  .sml-event-detail__structured {
    grid-template-columns: minmax(0, 51.6875rem) minmax(16rem, 25rem);
    gap: var(--sp3);
    align-items: start;
    justify-content: start;
  }

  .sml-event-detail__image {
    max-width: none;
    width: 100%;
  }

  .sml-event-detail__image img {
    height: 18.75rem;
    aspect-ratio: auto;
  }
}

/* ---------------------------------------------------------------------------
 * Grant detail (Figma 1273:2693, no map/image).
 *
 * Grants reuse the event shell with a single-column layout and accessible
 * purple body/extra-section links. Hover uses orange to match interior text.
 * ------------------------------------------------------------------------- */
.sml-event-detail--grant .sml-event-detail__structured {
  grid-template-columns: minmax(0, 1fr);
  justify-content: start;
}

.sml-event-detail--grant .sml-event-detail__layout-builder {
  max-width: none;
}

.sml-event-detail--grant .sml-event-detail__body a:where(:not(.button, .btn)),
.sml-event-detail--grant .sml-event-detail__layout-builder a:where(:not(.button, .btn, .sml-link-group__card)) {
  color: var(--sml-purple);
  font-family: var(--sml-font-jost);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 0.12em;
  box-shadow: none;
  -webkit-text-decoration: underline;
}

.sml-event-detail--grant .sml-event-detail__body a:where(:not(.button, .btn)):hover,
.sml-event-detail--grant .sml-event-detail__layout-builder a:where(:not(.button, .btn, .sml-link-group__card)):hover {
  color: var(--sml-purple);
  text-decoration: underline;
  box-shadow: none;
}

.sml-event-detail--grant .sml-event-detail__body a:where(:not(.button, .btn)):focus,
.sml-event-detail--grant .sml-event-detail__layout-builder a:where(:not(.button, .btn, .sml-link-group__card)):focus {
  color: var(--sml-purple);
  text-decoration: underline;
  box-shadow: none;
}

.sml-event-detail--grant .sml-event-detail__layout-builder h2,
.sml-event-detail--grant .sml-event-detail__layout-builder h3 {
  margin: 0 0 var(--sp1-5);
  font-family: var(--sml-font-code-pro-bold);
  font-weight: 400;
  font-size: clamp(1.75rem, 1.4rem + 1vw, 2rem);
  line-height: 1.3125;
  color: var(--sml-black);
}

.sml-event-detail--grant .form-item__description {
  max-width: none;
}