/* Text pages (Despre Faberpet, Cum comand?, the policies…): one 1024px column, as on faberpet.ro.
   Running text sits 40px in from the panels and tables and spans 90% of the column. */
.pbly .text-page .section { padding-block: var(--pbly-space-20); }
.pbly .text-page + .site-footer { margin-top: 0; }

.pbly .text-page__inner {
  color: var(--pbly-color-text-muted);
  font-weight: var(--pbly-font-weight-medium);
}

.pbly .text-page__inner > :where(h1, h2, h3, p, ul, ol) { padding-left: var(--pbly-space-10); }

.pbly .text-page__inner > :where(h2, h3, p, ul, ol) { max-width: 90%; }

.pbly .text-page__inner > :where(ul, ol) { padding-left: calc(2 * var(--pbly-space-10)); }
.pbly .text-page__inner > ul { list-style: disc; }
.pbly .text-page__inner > ol { list-style: decimal; }

.pbly .text-page__inner > * + * { margin-top: var(--pbly-space-3-5); }

.pbly .text-page__title,
.pbly .text-page__heading {
  color: var(--pbly-color-text-primary);
  font-size: var(--pbly-font-size-2xl);
  font-weight: var(--pbly-font-weight-bold);
  line-height: var(--pbly-font-line-height-tight);
}

.pbly .text-page__inner > .text-page__heading { margin-top: var(--pbly-space-20); }

.pbly .text-page__inner > :where(.text-page__title, .text-page__heading) + * { margin-top: var(--pbly-space-8); }

.pbly .text-page__lead,
.pbly .text-page__subtitle {
  font-size: var(--pbly-font-size-md-plus);
  font-weight: var(--pbly-font-weight-semibold);
}

.pbly .text-page__subtitle--strong {
  font-weight: var(--pbly-font-weight-extrabold);
  text-transform: uppercase;
}

.pbly .text-page__subtitle--accent { color: var(--pbly-color-action-hover); }

/* Spacing between blocks: 14px between paragraphs (above), 20px under the opening paragraph and the
   sub-headings, 40px around panels and tables, 48px above a sub-heading and 80px when it follows a panel or table. */
.pbly .text-page__inner > .text-page__lead + *,
.pbly .text-page__inner > .text-page__subtitle + * { margin-top: var(--pbly-space-5); }

.pbly .text-page__inner > :is(.info-panel, .discount-table),
.pbly .text-page__inner > :is(.info-panel, .discount-table) + * { margin-top: var(--pbly-space-10); }

.pbly .text-page__inner > .info-panel + .info-panel { margin-top: var(--pbly-space-5); }
.pbly .text-page__inner > * + .text-page__subtitle { margin-top: var(--pbly-space-12); }
.pbly .text-page__inner > :is(.info-panel, .discount-table) + .text-page__subtitle { margin-top: var(--pbly-space-20); }
.pbly .text-page__inner > :is(.text-page__title, .text-page__heading) + .text-page__subtitle { margin-top: var(--pbly-space-8); }

.pbly .text-page__inner li a { color: var(--pbly-color-palette-green-link); }

/* Phones: the text sits 10px in, and the opening paragraph and sub-headings are a little smaller. */
@media (max-width: 47.9375rem) {
  .pbly .text-page .section { padding-block: var(--pbly-space-15); }
  .pbly .text-page__inner > :where(h1, h2, h3, p) { padding-inline: var(--pbly-space-2-5); }
  .pbly .text-page__inner > :where(h2, h3, p, ul, ol) { max-width: none; }
  .pbly .text-page__inner > :where(ul, ol) { padding-left: var(--pbly-space-10); }
  .pbly .text-page__lead,
  .pbly .text-page__subtitle { font-size: var(--pbly-font-size-md); }
}

/* 404 page: the product search under the heading (not in the prototype; same field and button as the contact form). */
.pbly .text-page__search {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  max-width: 90%;
  padding-left: var(--pbly-space-10);
}

/* Sitemap page: Rank Math's HTML sitemap (headings and link lists) set like the text pages' own. */
.pbly .text-page__sitemap { padding-left: var(--pbly-space-10); }
.pbly .text-page__sitemap :where(h2, h3) {
  margin-top: var(--pbly-space-10);
  color: var(--pbly-color-text-muted);
  font-size: var(--pbly-font-size-md-plus);
  font-weight: var(--pbly-font-weight-semibold);
}
.pbly .text-page__sitemap ul { margin-top: var(--pbly-space-3-5); padding-left: var(--pbly-space-10); list-style: disc; }
.pbly .text-page__sitemap li + li { margin-top: var(--pbly-space-2); }

@media (max-width: 47.9375rem) {
  .pbly .text-page__search { grid-template-columns: minmax(0, 1fr); max-width: none; padding-left: 0; }
  .pbly .text-page__sitemap { padding-left: 0; }
}