/* Agenda: rustige lijst in witte kaarten op crème, in dezelfde stijl als de menukaart. */
.agenda {
  background-color: var(--secondary);
  color: var(--dark);
  padding: var(--space-xl) var(--space-m) var(--space-2xl);
}
.agenda__binnen { width: var(--max-screen-width); max-width: 100%; margin: 0 auto; }
.agenda__binnen > * { max-width: 90rem; }
.agenda__kop {
  font-family: "Bearmen";
  font-size: var(--text-xl);
  color: var(--dark);
  margin: var(--space-xl) 0 var(--space-xs);
  padding-bottom: var(--space-3xs);
  border-bottom: 1px solid var(--primary);
}
.agenda__kop:first-child { margin-top: 0; }
.agenda__melding { margin: var(--space-xs) 0 0; color: var(--dark-70); font-size: var(--text-s); }
.agenda__maand {
  font-family: "Bearmen";
  font-size: var(--text-m);
  letter-spacing: .06em;
  color: var(--primary-tekst);
  margin: var(--space-m) 0 0;
}
.agenda__lijst {
  list-style: none;
  margin: var(--space-2xs) 0 0;
  padding: 0 var(--space-m);
  background-color: #fff;
  border: 1px solid var(--dark-5);
  border-radius: var(--radius-m);
}
.agenda__lijst > .uitje:last-child { border-bottom: 0; }

.uitje {
  display: grid;
  grid-template-columns: 8.5rem 1fr auto;
  gap: var(--space-s);
  align-items: baseline;
  padding: 1.4rem 0;
  border-bottom: 1px solid var(--dark-10);
}
.uitje__datum { display: flex; flex-direction: column; line-height: 1.15; color: var(--primary-tekst); }
.uitje__groot { font-weight: 800; font-size: var(--text-m); white-space: nowrap; }
.uitje__klein { font-size: 1.3rem; color: var(--dark-60); }
.uitje__titel {
  font-family: "VintageGlamour";
  font-weight: 800;
  font-size: var(--text-m);
  color: var(--dark);
  margin: 0;
  text-decoration: none;
}
.uitje__info { margin: .2rem 0 0; font-size: 1.4rem; line-height: 1.5; color: var(--dark-60); }
.uitje__link { font-size: 1.4rem; color: var(--primary-tekst); text-decoration: none; white-space: nowrap; }
.uitje__link:hover, a.uitje__titel:hover { color: var(--primary-tekst); text-decoration: underline; }

.agenda__jaarlijks { margin: var(--space-m) 0 0; font-size: 1.4rem; line-height: 1.7; color: var(--dark-60); }
.agenda__jaarlijks span { color: var(--dark-80); }
.agenda__jaarlijks a { color: var(--primary-tekst); }
.agenda__bron { margin: var(--space-s) 0 0; font-size: 1.2rem; color: var(--dark-50); }

@media (max-width: 600px) {
  .uitje { grid-template-columns: 6.5rem 1fr; row-gap: .4rem; }
  .uitje__link { grid-column: 2; }
}
