/* ==========================================================================
   RG Garden — Events & Celebrations Specific Stylesheet
   Source of Truth: RG Garden.html Reference
   ========================================================================== */

/* Event Category Articles */
.evx {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: clamp(20px, 3vw, 48px);
  row-gap: 32px;
  align-items: center;
  margin-bottom: clamp(72px, 10vw, 150px);
}

.evx:last-child {
  margin-bottom: 0;
}

.evx .im {
  grid-column: 1 / 7;
}

.evx .tx {
  grid-column: 8 / 13;
  display: flex;
  flex-direction: column;
  gap: 22px;
  align-items: flex-start;
}

.evx.rev .im {
  grid-column: 7 / 13;
  grid-row: 1;
}

.evx.rev .tx {
  grid-column: 1 / 6;
  grid-row: 1;
}

.evx.low {
  align-items: end;
}

.evx h2 {
  font-size: clamp(2.4rem, 4.6vw, 4.2rem);
}

.evx .note {
  font-size: .85rem;
  color: var(--terra);
  font-style: italic;
}

.dark .evx .note {
  color: var(--gold);
}

.ev-intro {
  max-width: 26ch;
  font: 400 clamp(1.8rem, 3.4vw, 3rem)/1.2 var(--f-display);
  margin-bottom: clamp(56px, 8vw, 110px);
}

/* Events Responsive */
@media (max-width: 900px) {
  .evx .im, .evx .tx, .evx.rev .im, .evx.rev .tx {
    grid-column: 1 / -1;
    grid-row: auto;
  }
  .evx.rev .tx {
    order: 2;
  }
}

/* Events Page Image Stacking */
.phero .arch {
  z-index: 3;
  pointer-events: none;
}