:root {
--sfgu-primary: #204D9A;
--sfgu-primary-hover: #1e3a8a;
--sfgu-text: #1f2937;
--sfgu-muted: #6b7280;
--sfgu-border: #e5e7eb;
--sfgu-bg: #ffffff;
--sfgu-gap: 55px;
--sfgu-max-width: 1600px;
--sfgu-transition: 0.2s ease;
} .sfgu-events {
width: 100%;
font-family: sans-serif;
}
.sfgu-events.sfgu-events--list {
display: flex;
flex-direction: column;
gap: var(--sfgu-gap);
max-width: var(--sfgu-max-width);
margin-inline: auto;
}
.sfgu-events.sfgu-events--grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
gap: var(--sfgu-gap);
} .sfgu-events .sfgu-event-card {
display: flex;
background: var(--sfgu-bg);
overflow: hidden;
} .sfgu-events .sfgu-events__month-separator {
display: flex;
align-items: center;
gap: 12px;
padding-top: 8px;
font-size: 0.9375rem;
font-weight: 600;
color: var(--sfgu-text);
letter-spacing: 0.02em;
}
.sfgu-events .sfgu-events__month-separator::after {
content: '';
flex: 1;
border-bottom: 1px solid var(--sfgu-border);
} .sfgu-events .sfgu-event-card__image {
flex: 0 0 33.333%;
max-width: 33.333%;
overflow: hidden;
}
.sfgu-events .sfgu-event-card__image img {
display: block;
width: 100%; object-fit: contain;
} .sfgu-events .sfgu-event-card__body {
flex: 1;
padding: 0 16px;
display: flex;
flex-direction: column;
gap: 8px;
min-width: 0;
}
.sfgu-events .sfgu-event-card__title {
margin: 0 !important;
font-size: 24px;
line-height: 1.42;
font-weight: 500;
color: var(--sfgu-primary);
}
.sfgu-events .sfgu-event-card__title a {
color: inherit;
text-decoration: none;
}
.sfgu-events .sfgu-event-card__title a:hover,
.sfgu-events .sfgu-event-card__title a:focus { text-decoration: underline;
}
.sfgu-events .sfgu-event-card__date {
font-size: 0.875rem;
color: var(--sfgu-muted);
}
.sfgu-events .sfgu-event-card__venue {
font-size: 0.875rem;
color: var(--sfgu-muted);
}
.sfgu-events .sfgu-event-card__description {
font-size: 0.875rem;
line-height: 1.6;
color: var(--sfgu-text); } .sfgu-events .sfgu-event-card__price {
font-size: 0.9375rem;
font-weight: 600;
color: var(--sfgu-text);
} .sfgu-events .sfgu-event-card__link {
display: inline-block;
text-align: center;
align-self: flex-start;  border: none;
background: transparent;
color: var(--sfgu-primary);
font-size: 0.8125rem;
font-weight: 600;
text-decoration: none;
cursor: pointer;
transition: color var(--sfgu-transition);
}
.sfgu-events .sfgu-event-card__link:hover,
.sfgu-events .sfgu-event-card__link:focus { text-decoration: underline;
}
.sfgu-events .sfgu-event-card__link--disabled {
color: #9ca3af;
cursor: not-allowed;
pointer-events: none;
} @media (max-width: 600px) {
.sfgu-events .sfgu-events--grid {
grid-template-columns: 1fr;
}
.sfgu-events .sfgu-event-card {
flex-direction: column;
}
.sfgu-events .sfgu-event-card__image {
flex: none;
max-width: none;
width: 100%;
aspect-ratio: 16 / 9;
}
.sfgu-events .sfgu-event-card__body {
padding: 12px;
gap: 6px;
}
.sfgu-events .sfgu-event-card__title {
font-size: 1rem;
}
}