/* ══════════════════════════════════════════════════════════════
   css/kit-cards.css — v1.45.194
   The Wainscot / Kanso kit chooser cards (inc/kit-cards.php). Moved
   verbatim from css/pages.css (Wainscot Kits template block) so the
   cards can also render inside a category's size sections — first on
   /product-category/…/tongue-groove/ as the "Kits" section (per M).
   Enqueued by functions.php on the Wainscot Kits template and on any
   category whose pd_category_product_sections_registry() entry has a
   'kits' section.
══════════════════════════════════════════════════════════════ */
.pd-kit-cards {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 22px;
}
.pd-kit-card {
  grid-column: span 2;
  border: 1px solid var(--rule);
  border-radius: 12px;
  background: #fff;
  padding: 16px 16px 20px;
  display: flex;
  flex-direction: column;
  text-align: center;
}
.pd-kit-card--featured { grid-column: span 3; }
.pd-kit-card__media img {
  width: 100%;
  height: 260px;
  object-fit: cover;
  border-radius: 8px;
  display: block;
}
.pd-kit-card--featured .pd-kit-card__media img { height: 320px; }
.pd-kit-card__title {
  font-family: 'Oswald', sans-serif;
  font-weight: 700;
  font-size: 19px;
  margin: 14px 0 10px;
}
.pd-kit-card__title a { color: #000; text-decoration: none; }
.pd-kit-card__features {
  list-style: none;
  margin: 0 0 16px;
  padding: 0;
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: #000;
}
.pd-kit-card__features li { margin-bottom: 4px; }
.pd-kit-card__features li::before { content: '\2714\00a0\00a0'; color: var(--navy-mid); }
.pd-kit-card__btn {
  margin-top: auto;
  align-self: center;
  background: #080153;
  color: #fff;
  font-family: 'Oswald', sans-serif;
  font-weight: 500;
  font-size: 17px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 12px;
  padding: 12px 34px;
  transition: background 0.2s;
}
.pd-kit-card__btn:hover { background: var(--navy-mid); }
@media (max-width: 1000px) {
  .pd-kit-cards { grid-template-columns: repeat(2, 1fr); }
  .pd-kit-card, .pd-kit-card--featured { grid-column: span 1; }
}
@media (max-width: 620px) {
  .pd-kit-cards { grid-template-columns: 1fr; }
  .pd-kit-card__media img, .pd-kit-card--featured .pd-kit-card__media img { height: 220px; }
}

/* Inside a size-separated category (.pd-product-sections__grid): the
   section spans the full row (--n4) and its two subgrid rows are head +
   cards, exactly as a product section; the card grid simply takes the
   ul.products slot. */
.pd-product-sections__grid .pd-product-section--kits .pd-kit-cards { align-self: start; }