/*
 * A page of reading set on the ground: the company articles, the wiki, the
 * weekly market summary and the static pages. No box — the text sits on the
 * paper at a reading width, as `.prose` inside (tasks/redesign, D11, D15).
 *
 *   .page-card--wide   the filings pages, whose tables want the width
 *   .page-card--directory  the weekly market summary and a company's two
 *                      articles: the directory pages' column
 *                      (pages/directory.css), as wide
 *   .page-meta         a quiet line above or below the text: "Covering …",
 *                      when summaries are written; in caps on a page card
 *   .page-meta--caps   the same caps line elsewhere (an article's dateline)
 */
@layer components {
  .page-card {
    max-inline-size: 52rem;
    padding-block: var(--space-md) var(--space-xl);
  }

  .page-card--wide {
    max-inline-size: 60rem;
  }

  /* The text inside keeps its own reading measure; the title, the archive and
     the signup run the column's width, as they do on /sectors. */
  .page-card--directory {
    max-inline-size: 90rem;
  }

  .page-meta {
    margin-block: var(--space-2xs) var(--space-lg);
    color: var(--color-ink-subtle);
    font-size: var(--text-meta);
    line-height: var(--leading-meta);
  }

  /* The dateline of an article — when it was updated, what it covers, its
     sources — in caps, and so is any page's meta line under its title
     (tasks/redesign, D11, D15). */
  :is(.page-meta--caps, .page-card > .page-meta) {
    color: var(--color-ink-muted);
    font-size: var(--text-meta-xs);
    letter-spacing: var(--tracking-caps);
    text-transform: uppercase;
  }

  /* A section after the main text, over a rule: the summary archive. */
  .page-section {
    margin-block-start: var(--space-2xl);
    padding-block-start: var(--space-lg);
    border-block-start: var(--rule-heavy);
  }
}