/* Checklist Component — two-column intro + list, or list-only */

.doghouse-checklist {
  padding: var(--site-space-3xl) var(--site-container-padding);
}

.doghouse-checklist__container {
  max-width: var(--site-container-max-width);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: var(--site-space-2xl);
}

/* Two-column layout on md+: intro left, items right */
@media (min-width: 768px) {
  .doghouse-checklist--with-intro .doghouse-checklist__container {
    flex-direction: row;
    align-items: flex-start;
    gap: var(--site-space-3xl);
  }

  .doghouse-checklist--with-intro .doghouse-checklist__intro {
    flex: 0 1 50%;
  }

  .doghouse-checklist--with-intro .doghouse-checklist__items {
    flex: 1 1 50%;
  }
}

/* Intro column */
.doghouse-checklist__intro {
  display: flex;
  flex-direction: column;
  gap: var(--site-space-base);
}

.doghouse-checklist__eyebrow {
  display: block;
  margin-bottom: var(--site-space-sm);
}

.doghouse-checklist__body {
  color: var(--site-color-text-lead);
  font-size: var(--site-body-font-size);
  line-height: var(--site-body-line-height);
  margin-top: var(--site-space-md);
}

.doghouse-checklist__body p {
  margin: 0 0 var(--site-space-base);
}

.doghouse-checklist__body p:last-child {
  margin-bottom: 0;
}

/* Items column — Drupal wraps rendered field items in a div */
.doghouse-checklist__items > div {
  display: flex;
  flex-direction: column;
  gap: var(--site-space-base);
}

/* Light variant — elevated surface on dark theme */
.doghouse-checklist--light {
  background: var(--site-color-bg-surface);
}