/* ==========================================================================
   CLASSES — group session schedule (widget: aumtm_classes)

   One card per class rather than a timetable grid: a practice running two or
   three sessions a week would leave most of a week grid empty, and each session
   carries more than a time — venue, price, level and who it suits.

   The column count comes from --aumtm-cols, set through a CSS selector rather
   than an inline style, which would outrank the media queries below.
   ========================================================================== */

.aumtm-classes__grid {
  --aumtm-cols: 2;
  display: grid;
  grid-template-columns: repeat(var(--aumtm-cols), minmax(0, 1fr));
  gap: clamp(1.5rem, 2.5vw, 2rem);
}

.aumtm-class {
  display: flex;
  flex-direction: column;
  padding: clamp(1.5rem, 2.5vw, 2rem);
  background: #fff;
  border: 1px solid var(--aumtm-line);
  border-top: 3px solid var(--aumtm-blue);
  border-radius: var(--aumtm-radius);
  transition: box-shadow var(--aumtm-dur) var(--aumtm-ease),
              transform var(--aumtm-dur) var(--aumtm-ease);
}
.aumtm-class:hover {
  transform: translateY(-3px);
  box-shadow: var(--aumtm-shadow-lg);
}

.aumtm-class__title { font-size: var(--aumtm-fs-h3); }

/* The day and time carry the most weight on the card — it is what a visitor
   scans for — so they are set in the display face rather than the body face. */
.aumtm-class__when {
  margin-top: 0.5rem;
  font-family: var(--aumtm-font-display);
  font-size: 1.375rem;
  line-height: 1.3;
  color: var(--aumtm-blue);
}

.aumtm-class__meta {
  display: grid;
  gap: 0.75rem;
  margin-top: 1.375rem;
  padding-top: 1.375rem;
  border-top: 1px solid var(--aumtm-line-soft);
}
.aumtm-class__meta li {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  font-size: var(--aumtm-fs-sm);
  line-height: 1.6;
}
.aumtm-class__meta svg {
  width: 16px; height: 16px; flex: none; margin-top: 0.3em;
  stroke: var(--aumtm-cyan); fill: none; stroke-width: 1.8;
}
.aumtm-class__meta b {
  color: var(--aumtm-heading);
  font-weight: 700;
}

.aumtm-class__note {
  margin-top: 1.25rem;
  font-size: var(--aumtm-fs-sm);
  line-height: 1.8;
}

/* Pushes the button to the bottom so cards of unequal length still line up. */
.aumtm-class__foot { margin-top: auto; padding-top: 1.5rem; }
.aumtm-class__foot .aumtm-btn { width: 100%; }

/* ---------- Coming soon ---------- */
.aumtm-classes__soon {
  margin-top: clamp(2rem, 4vw, 3rem);
  padding: 1.75rem;
  background: var(--aumtm-blue-tint);
  border-radius: var(--aumtm-radius);
}
.aumtm-classes__soon-title {
  font-size: var(--aumtm-fs-2xs);
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--aumtm-text-dim);
  margin-bottom: 1rem;
}
.aumtm-classes__soon ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0.625rem 1.75rem;
}
.aumtm-classes__soon li {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  font-size: var(--aumtm-fs-sm);
  color: var(--aumtm-heading);
}
.aumtm-classes__soon svg {
  width: 16px; height: 16px; flex: none;
  stroke: var(--aumtm-cyan); fill: none; stroke-width: 1.8;
}

@media (max-width: 820px) { .aumtm-classes__grid { --aumtm-cols: 1; } }