/* Compact homepage and shop cards: four desktop, two tablet, one phone. */
.ss-site .product-grid,
.ss-featured-grid,
.ss-site .woocommerce ul.products {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
}
.ss-site .product-grid > .product-card,
.ss-featured-grid > .product-card,
.ss-site .woocommerce ul.products li.product {
  min-width: 0;
}
.ss-site .product-grid .product-face,
.ss-featured-grid .product-face {
  padding: 20px 18px 24px;
  min-height: 185px;
}
.ss-site .product-grid .product-face h3,
.ss-featured-grid .product-face h3 {
  font-size: clamp(24px, 2.2vw, 30px);
  line-height: 1.15;
  margin-top: 18px;
  overflow-wrap: break-word;
}
.ss-site .product-grid .card-bottom,
.ss-featured-grid .card-bottom {
  padding: 16px 18px;
  gap: 10px;
  flex-wrap: wrap;
  font-size: 13px;
}
.ss-site .woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-size: clamp(24px, 2.2vw, 30px);
  padding: 10px 18px;
  overflow-wrap: break-word;
}
.ss-site .woocommerce ul.products li.product .price { padding: 0 18px; }
.ss-site .woocommerce ul.products li.product .button { margin-left: 18px; margin-right: 18px; }
/* Compact current-lot line immediately above the product name. */
.ss-card-purity {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 2px 4px;
  min-width: 0;
  max-width: 100%;
  color: #355b75;
  text-align: left;
  font-size: 12px;
  line-height: 1.5;
}
.ss-site .woocommerce ul.products li.product > .ss-card-purity { margin: 0 18px 2px; }
.ss-card-purity-label { font-size: inherit; font-weight: 400; }
.ss-card-purity-result {
  display: inline-flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 4px;
  max-width: 100%;
  color: #355b75;
  border-bottom: 1px solid #a9c2d4;
  line-height: inherit;
  overflow-wrap: anywhere;
}
.ss-card-purity-result strong { font-size: inherit; font-weight: 600; }
.ss-card-purity-size { font-size: inherit; }
.ss-card-purity-result:hover { color: #17242c; border-color: currentColor; }
.ss-card-purity-result:focus-visible { outline: 2px solid #355b75; outline-offset: 4px; }
/* Product and report links stay separate on featured homepage cards, too. */
.ss-featured-grid > .product-card { display: flex; flex-direction: column; }
.ss-featured-product-link { display: block; }
.ss-featured-grid > .product-card > .product-face { flex: 1; container-type: inline-size; }
.ss-featured-heading { margin-top: 14px; }
.ss-site .ss-featured-grid .ss-featured-heading h3,
.ss-featured-grid .ss-featured-heading h3 { margin-top: 4px; }
.ss-featured-grid .card-bottom { margin-top: auto; }
.ss-featured-explore { white-space: nowrap; }
/* Fit the complete research-use notice on a single line at each card width. */
.ss-featured-grid .product-face .ss-featured-use-note {
  margin: 12px 0 0;
  color: #526370;
  font-size: 11px;
  font-size: min(12px, 4.3cqi);
  font-weight: 400;
  letter-spacing: normal;
  line-height: 1.5;
  white-space: nowrap;
}

/* Keep the same notice directly beneath each catalog card's action button. */
.ss-site .woocommerce ul.products li.product .ss-catalog-use-note {
  margin: 12px 18px 0;
  clear: both;
  container-type: inline-size;
}
.ss-site .woocommerce ul.products li.product .ss-catalog-use-note p {
  margin: 0;
  color: #526370;
  font-size: 11px;
  font-size: min(12px, 4.3cqi);
  font-weight: 400;
  letter-spacing: normal;
  line-height: 1.5;
  white-space: nowrap;
}

@media (max-width: 1000px) {
  .ss-site .product-grid,
  .ss-featured-grid,
  .ss-site .woocommerce ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .ss-site .product-grid,
  .ss-featured-grid,
  .ss-site .woocommerce ul.products { grid-template-columns: minmax(0, 1fr); }
}

/* Homepage report guide and clearly labeled sample report. */
.ss-lot-guide dl > div { display: grid; grid-template-columns: 105px minmax(0, 1fr); gap: 16px; }
.ss-lot-guide dd { text-align: right; overflow-wrap: anywhere; }
.ss-lot-guide .sheet-head strong { font-size: 18px; line-height: 1.4; }
.report-feature .ss-lot-guide p { max-width: none; }
.ss-lot-guide .ss-lot-guide-intro { font-size: 14px; line-height: 1.6; margin: 22px 0 16px; }
.ss-lot-guide .ss-lot-guide-link { white-space: normal; }
.ss-demo-notice { border-left: 3px solid #679dc7; padding: 14px 18px; background: #f2f7fa; color: #17242c; font-size: 14px; }
@media (max-width: 480px) {
  .ss-lot-guide dl > div { grid-template-columns: 1fr; gap: 4px; }
  .ss-lot-guide dd { text-align: left; }
}

/* Only the research-use statement sits beneath the product photo. */
.ss-site .woocommerce div.product .ss-product-photo-column { min-width: 0; }
.ss-site .woocommerce div.product .ss-product-photo-column > .woocommerce-product-gallery {
  float: none;
  width: 100%;
  margin: 0;
}
.ss-site .woocommerce div.product .ss-product-photo-notice {
  clear: both;
  margin: 12px 0 0;
  color: #526370;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.5;
  white-space: normal;
  overflow-wrap: break-word;
}