/* Shared base for the layout skins: on wide screens the homepage becomes one
   grid, and each skin arranges these named areas its own way through
   grid-template-areas. .q-content-wrap dissolves (display: contents) so the
   article list and the sidebar sit in that same grid. Below 1025px the page
   keeps the normal single-column flow. */
@media (min-width: 1025px) {
  .home main.q-content { display: grid; column-gap: 32px; row-gap: 0; align-items: start; }
  .home main.q-content > * { min-width: 0; }
  .home .q-content-wrap { display: contents; }
  .home .q-gallery-section { grid-area: gal; }
  .home .q-hot-topics      { grid-area: hot; }
  .home .q-hero            { grid-area: hero; }
  .home .q-radio           { grid-area: radio; }
  .home .q-bulletin        { grid-area: bul; }
  .home .q-app-download    { grid-area: app; }
  .home .q-main            { grid-area: main; }
  .home .q-sidebar         { grid-area: side; }
  /* Sections that start a grid row line up at the top. */
  .home .q-gallery-section, .home .q-hot-topics, .home .q-hero { margin-top: 24px; }
  .home .q-section-head:first-child { margin-top: 0; }
}