/* proto-pages-home.css: RaceQuip's home (templates/search/home.html) over cl-home.css (the hero, the support band) and the
   shared frame of proto-pages.css, on cl-site.css's --site-* tokens: the first line in the hero, the part pages' tiles (the frame's pp-tile, one
   m.tile_list a tile so each counts in its own word, the lists folded into one grid) and the links row of the lines.
   Classes are rq-*. */
@layer base, kit, site;

@layer site {

.rq-home .rq-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; padding: 32px 0 0; }
.rq-home .rq-tiles > .pp-tiles { display: contents; }
.rq-home .rq-tiles li { list-style: none; margin: 0; padding: 0; }
.rq-home .rq-tiles .pp-tile { height: 100%; }
.rq-home .rq-tiles .pp-tile__img { height: 200px; }
.rq-hero__lead { max-width: 640px; margin-top: -12px; font: 400 20px/1.4 var(--site-font-body); color: inherit; }
.rq-home__note { padding-top: 16px; font: 400 16px/1.4 var(--site-font-body); color: var(--site-fg); }
.rq-home__links .pp-links { margin-top: 40px; }

@media (max-width: 979.98px) {
  .rq-hero__lead { margin-top: -6px; font-size: 15px; }
  .rq-home .rq-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding-top: 16px; }
  .rq-home .rq-tiles .pp-tile__img { height: 110px; }
  .rq-home__links .pp-links { margin-top: 24px; }
}

}
