/* proto-pages-act.css: ACT's rules on top of the shared frame (proto-pages.css), on every landing page: the first line
   and the notes, the shopper's vehicle block, a group's own line, the "All N" link, the pair button under a card's Add,
   and the lead card of a vehicle panel (two columns wide on a wide screen). Colour and type from cl-site.css's tokens. */
@layer base, kit, site;

@layer site {

.act-page .pp-h1 { font-size: 40px; }
.act-partial, .act-none, .act-who { margin-top: 12px; font: 400 17px/1.4 var(--site-font-body); color: var(--site-fg); }
.act-none a { text-decoration: underline; }
.act-who { margin-top: 0; margin-bottom: 16px; }
.pp-shead + .act-who { margin-top: 12px; }
.act-more { margin-top: 16px; }
.act-pages { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.act-mine { margin-bottom: 8px; }
.act-mine .pp-nofit__go:empty { display: none; }
.act-mine .pp-shead { border-bottom-color: var(--site-accent-ink); }
.act-which .pp-which { margin-top: 0; }
.act-group .pp-shead, .act-gen .pp-shead { margin-top: 56px; }

/* the pair, a card's second button: its words and its price on two lines when the card is narrow, 40px and up */
.pp-card__buy .act-pair { flex-wrap: wrap; gap: 0 6px; height: auto; min-height: 40px; padding: 8px 12px; line-height: 1.2; text-align: center; white-space: normal; }

/* the lead card of a vehicle panel: two columns wide, a taller photo */
.act-grid--lead > .pp-card:first-child { grid-column: span 2; }
.act-grid--lead > .pp-card:first-child .pp-card__img img { height: 260px; }
.act-grid--lead > .pp-card:first-child .pp-card__name { font-size: 22px; }

@media (max-width: 979.98px) {
  .pp-card__buy .act-pair { padding: 6px 8px; font-size: 14px; }
  .act-page .pp-h1 { font-size: 34px; }
  .act-partial, .act-none, .act-who { font-size: 14px; }
  .act-who { margin-bottom: 12px; }
  .pp-shead + .act-who { margin-top: 8px; }
  .act-group .pp-shead, .act-gen .pp-shead { margin-top: 32px; }
  .act-grid--lead > .pp-card:first-child .pp-card__img img { height: 180px; }
  .act-grid--lead > .pp-card:first-child .pp-card__name { font-size: 17px; }
}

}
