/* The two plans on the home page, 2026-10-10.
   The free trial runs everything. After it there are two prices, and what each
   one runs stands side by side under the trial: Basic and Full. The lines come
   from api/app/plans.py (what Basic does not run), and
   tools/build_site_languages.py carries them in Portuguese and Polish. */

/* The last child of the pricing grid, as wide as the whole grid. */
.plans { grid-column: 1 / -1; }
.plans > .eyebrow { margin-bottom: 18px; }
.plans-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.plan {
  padding: 30px 32px 32px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--raised);
}
/* The one that runs everything wears the line of the trial panel above it. */
.plan-full { border-color: #777a48; }
.plan h3 {
  margin: 0;
  font-family: var(--display);
  font-size: 30px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
}
.plan-price {
  margin: 12px 0 0;
  color: var(--vellum-2);
  font-size: 15px;
}
.plan-price b {
  margin-right: 6px;
  color: var(--vellum);
  font-family: var(--display);
  font-size: 44px;
  font-weight: 700;
  line-height: 1;
}
.plan .check-list { margin: 24px 0 0; }
/* A line that wraps keeps its tick beside its first row. */
.plan .check-list li { align-items: baseline; line-height: 1.45; }

@media (max-width: 680px) {
  .plans-row { grid-template-columns: 1fr; gap: 16px; }
  .plan { padding: 24px 22px 26px; }
  .plan-price b { font-size: 38px; }
}