/* =============================================================
   ARTICLE LAYOUT
   =============================================================
   Dropping Storefront's sidebar gave the post the full 1,280px
   column, which is the right width for the page but the wrong
   width for prose: at 15px that runs about 150 characters to the
   line, roughly double what is comfortable to read, and on a
   2,000-word buying guide it is the difference between reading and
   skimming.

   So the TEXT gets a measure and the furniture does not. Anything
   that is a paragraph, heading or list is capped near 72 characters
   and centred; the shop boxes, product-card grids and the wide spec
   tables keep their own width, because squeezing a four-across card
   row into a reading column would be worse than a long line.
   ============================================================= */

.vk-article .entry-content > * {
  max-width: 46rem;
  margin-left: auto;
  margin-right: auto;
}

/* Blocks that are furniture, not prose. */
.vk-article .entry-content > .vk-pc-box,
.vk-article .entry-content > .vk-table-scroll,
.vk-article .entry-content > .vk-hoist,
.vk-article .entry-content > figure,
.vk-article .entry-content > .wp-block-table {
  max-width: 68rem;
}

/* The byline sits with the text it introduces, not centred on the page. */
.vk-article .entry-content > .vk-article-byline {
  max-width: 46rem;
}

/* A little more air between sections than Storefront's default, now that
   headings are no longer fighting a sidebar for attention. */
.vk-article .entry-content > h2 { margin-top: 2.2em; }
.vk-article .entry-content > h3 { margin-top: 1.8em; }

/* Long guides lean on tables; let them scroll rather than push the page. */
.vk-article .entry-content .vk-table-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

@media (max-width: 782px) {
  .vk-article .entry-content > *,
  .vk-article .entry-content > .vk-pc-box,
  .vk-article .entry-content > .vk-table-scroll,
  .vk-article .entry-content > .vk-hoist {
    max-width: 100%;
  }
}