/* ==========================================================================
   CHECKLIST — "this may be for you if…" (widget: aumtm_checklist)

   The column count is driven by --aumtm-cols, which the widget sets through a
   CSS selector rather than an inline style. An inline style would outrank the
   media queries below and leave phones showing the desktop layout.
   ========================================================================== */

.aumtm-checklist__grid {
  --aumtm-cols: 2;
  display: grid;
  grid-template-columns: repeat(var(--aumtm-cols), minmax(0, 1fr));
  gap: 0.875rem 2rem;
}

.aumtm-checklist__item {
  display: flex;
  align-items: flex-start;
  gap: 0.875rem;
  padding: 1.125rem 1.25rem;
  background: #fff;
  border: 1px solid var(--aumtm-line);
  border-radius: var(--aumtm-radius);
  font-size: var(--aumtm-fs-sm);
  line-height: 1.7;
  transition: border-color var(--aumtm-dur) var(--aumtm-ease),
              box-shadow var(--aumtm-dur) var(--aumtm-ease);
}
.aumtm-checklist__item:hover {
  border-color: var(--aumtm-cyan);
  box-shadow: var(--aumtm-shadow);
}
.aumtm-checklist__item svg {
  width: 18px; height: 18px; flex: none; margin-top: 0.3em;
  stroke: var(--aumtm-cyan); fill: none; stroke-width: 2;
}

.aumtm-checklist__note {
  margin-top: 2.25rem;
  font-size: var(--aumtm-fs-lead);
  color: var(--aumtm-heading);
}

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