/* =============================================================================
   ROUTE: listing — archives, the blog, search, the shop (COMPONENTS.md §1).
   The listing head is an mp-section-head (level 1); items are mp-card / mp-product
   in mp-grid; pagination is mp-pager.
   ============================================================================= */
@layer layout {
  .mp-listing { padding-block: var(--mp-space-l) var(--mp-space-section); }
  .mp-listing__empty { max-inline-size: var(--mp-measure); color: var(--mp-color-text-2); }
  .mp-listing__search { max-inline-size: var(--mp-w-form); margin-block-end: var(--mp-space-l); }
  /* Search (07 §2): the query and the box on an ink head band, the results on white. */
  .mp-listing--search { padding-block-start: 0; }
  .mp-listing__head { padding-block: var(--mp-space-l) var(--mp-space-m); }
  .mp-listing__head .mp-listing__search { margin-block-end: 0; }
  .mp-listing__results { padding-block-start: var(--mp-space-l); }
}