/* Pricing grid with two contrasting cards */
.pricing-grid {
  display: grid;
  gap: 20px;
  grid-template-columns: 1fr; /* mobile */
  align-items: stretch;
}

@media (min-width: 900px) {
  .pricing-grid { grid-template-columns: repeat(2, 1fr); }
}

.pricing-card {
  border-radius: var(--radius-md, 20px);
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  height: 100%;
}

/* Align price headings across cards by normalising space above them on desktop */
@media (min-width: 900px) {
  .pricing-card > h3 { min-height: 32px; }
  .pricing-card > h3 + p { min-height: 100px; }
}

.pricing-card.variant-a {
  background: #F1F1EC;
}

.pricing-card.variant-b {
  background: #003f33;
}

/* Ensure good contrast on the dark card */
.pricing-card.variant-b h3,
.pricing-card.variant-b p,
.pricing-card.variant-b li { color: #f0f0f0; }
.pricing-card.variant-b .price-heading { color: var(--primary-color, #6fffe6); }

.pricing-card h3 {
  margin: 0 0 8px;
}

.pricing-card p {
  margin: 0 0 12px;
}

.pricing-card h3 + p { /* tighten gap before price heading */
  margin-bottom: 2px;
}

.pricing-card .price-heading {
  margin: 2px 0 6px; /* further reduced top margin */
  font-size: 1.25rem;
  color: #004B40;
}

.pricing-card ul {
  margin: 0 0 12px; /* align with text */
  padding-left: 18px; /* consistent bullet indent */
  list-style-position: outside;
}
.pricing-card li { margin: 4px 0; }

/* Ensure the call-to-action aligns consistently */
.pricing-card .button-wrapper {
  display: flex;
  justify-content: flex-start; /* align with headings and paragraphs */
  margin-top: auto !important; /* push buttons to the bottom; override inline styles */
}
