.events-list-wrapper { display: flex; flex-direction: column; gap: 20px; }
.event-item { display: flex; align-items: center; border: 1px solid #fff; padding: 20px; background-color: #333; color: #fff; }
.event-date { display: flex; flex-direction: column; align-items: center; justify-content: center; padding-right: 20px; border-right: 1px solid currentColor; min-width: 100px; text-align: center; }
.day-num { font-size: 32px; font-weight: bold; }
.event-details { flex-grow: 1; padding: 0 20px; display: flex; flex-direction: column; justify-content: center; }
.event-title { margin: 0; font-size: 24px; color: currentColor; }
.event-location { margin: 0 0 10px; }
.event-excerpt { margin: 0; }
.event-action { display: flex; align-items: center; justify-content: center; }
.event-btn { padding: 10px 20px; background-color: #fff; color: #333; text-decoration: none; border: 1px solid currentColor; display: inline-block; }

@media (max-width: 768px) {
    .event-item { flex-direction: column; align-items: stretch; text-align: left; }
    .event-date { border-right: none; border-bottom: 1px solid currentColor; padding-right: 0; padding-bottom: 20px; margin-bottom: 20px; width: 100%; align-items: center; }
    .event-details { padding: 0; margin-bottom: 20px; align-items: flex-start; }
    .event-action { justify-content: stretch; width: 100%; }
    .event-btn { width: 100%; text-align: center; }
}