/* Homepage attention system, 2026-08.
   Trust stays cool and calm; warm color is reserved for prices and the main
   shopping action so the product grid wins the first visual scan. */
.commerce-home-shell {
  gap: 16px;
}
.commerce-home-shell .home-category-rail,
.commerce-home-shell .home-discovery-panel,
.commerce-home-shell .home-decision-panel {
  border-color: #d7cdbd;
  box-shadow: 0 12px 34px rgba(24, 48, 54, .07);
}
.commerce-home-shell .home-category-rail {
  background: #f7f1e5;
}
.commerce-home-shell .home-category-rail > header {
  border-bottom-color: #dcd0bd;
  background: #eadfca;
}
.commerce-home-shell .home-category-rail nav a:hover,
.commerce-home-shell .home-category-pc:hover {
  background: #dfeee9;
  color: #075c50;
}
.commerce-home-shell .home-category-pc {
  border-top-color: #dcd0bd;
  background: #eee4d2;
}
.commerce-home-shell .home-discovery-panel {
  min-height: 686px;
  padding: clamp(22px, 2.35vw, 30px);
  background:
    radial-gradient(circle at 93% 4%, rgba(239, 131, 77, .28), transparent 13rem),
    radial-gradient(circle at 7% 98%, rgba(24, 132, 115, .19), transparent 18rem),
    linear-gradient(145deg, #fff9ed 0%, #f6f1e7 45%, #e7f2ef 100%);
}
.commerce-home-shell .home-product-showcase > header {
  align-items: flex-start;
}
.commerce-home-shell .home-product-showcase > header .kicker {
  color: #087260;
  letter-spacing: .13em;
}
.commerce-home-shell .home-product-showcase > header .kicker span {
  background: #e26f3c;
}
.commerce-home-shell .home-product-showcase > header h1 {
  max-width: 600px;
  color: #16343a;
  font-size: clamp(34px, 3.35vw, 48px);
  line-height: 1.03;
}
.commerce-home-shell .home-product-showcase > header > a {
  padding: 8px 0;
  color: #075c50;
}
.commerce-home-shell .home-product-showcase-filters {
  display: flex;
  min-height: 38px;
  margin-top: 16px;
  align-items: center;
  gap: 6px;
  overflow-x: auto;
  scrollbar-width: thin;
}
.commerce-home-shell .home-product-showcase-filters button {
  min-height: 34px;
  padding: 0 11px;
  flex: 0 0 auto;
  border: 1px solid rgba(22, 52, 58, .2);
  border-radius: 999px;
  background: rgba(255, 255, 255, .72);
  color: #31514b;
  font-family: inherit;
  font-size: 13px;
  font-weight: 850;
  cursor: pointer;
}
.commerce-home-shell .home-product-showcase-filters button:hover {
  border-color: #0d6f61;
  background: #e0eee9;
}
.commerce-home-shell .home-product-showcase-filters button.is-active {
  border-color: #a54420;
  background: #a54420;
  color: #fff;
  box-shadow: 0 4px 10px rgba(165, 68, 32, .18);
}
.commerce-home-shell .home-product-showcase-filters button.is-spread:not(.is-active) {
  border-color: #d89b75;
  background: #fff1e7;
  color: #8d3d1d;
}
.commerce-home-shell .home-product-showcase-filters button.is-near-low:not(.is-active) {
  border-color: #79ad9f;
  background: #e4f2ed;
  color: #075c50;
}
.commerce-home-shell .home-product-showcase-filters > span {
  margin-left: auto;
  flex: 0 0 auto;
  color: #63736d;
  font-size: 13px;
  font-weight: 800;
}
.commerce-home-shell .home-product-showcase-grid {
  margin-top: 20px;
  gap: 10px;
}

.home-lifestyle-categories {
  margin: 10px 12px 14px;
  border: 1px solid #cfd9d5;
  border-radius: 15px;
  overflow: hidden;
  background: #fffdf8;
}
.home-lifestyle-categories > header {
  display: flex;
  min-height: 58px;
  padding: 10px 14px;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border-bottom: 1px solid #d8dfdc;
}
.home-lifestyle-categories > header span {
  display: block;
  color: var(--green);
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .12em;
}
.home-lifestyle-categories > header h2 {
  margin: 3px 0 0;
  font-size: clamp(17px, 1.4vw, 21px);
  letter-spacing: -.025em;
}
.home-lifestyle-categories > header > a {
  color: var(--green);
  font-size: 13px;
  font-weight: 850;
  white-space: nowrap;
}
.home-lifestyle-categories > div {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.home-lifestyle-categories > div > a {
  display: grid;
  min-height: 82px;
  padding: 11px 13px;
  align-content: center;
  gap: 3px;
  border-right: 1px solid #e0e5e2;
  border-bottom: 1px solid #e0e5e2;
  color: var(--ink);
  text-decoration: none;
}
.home-lifestyle-categories > div > a:nth-child(4n) { border-right: 0; }
.home-lifestyle-categories > div > a:nth-last-child(-n+4) { border-bottom: 0; }
.home-lifestyle-categories > div > a:hover,
.home-lifestyle-categories > div > a:focus-visible { background: #e8f5ef; }
.home-lifestyle-categories > div span {
  color: var(--green);
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .08em;
}
.home-lifestyle-categories > div strong { font-size: 14px; }
.home-lifestyle-categories > div small { color: var(--muted); font-size: 13px; }

@media (max-width: 780px) {
  .home-lifestyle-categories > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-lifestyle-categories > div > a:nth-child(2n) { border-right: 0; }
  .home-lifestyle-categories > div > a:nth-last-child(-n+4) { border-bottom: 1px solid #e0e5e2; }
  .home-lifestyle-categories > div > a:nth-last-child(-n+2) { border-bottom: 0; }
}
.commerce-home-shell .home-product-showcase-grid > a {
  min-height: 142px;
  padding: 12px;
  border-color: rgba(22, 52, 58, .15);
  border-radius: 12px;
  box-shadow: 0 3px 0 rgba(22, 52, 58, .04);
}
.commerce-home-shell .home-product-showcase-grid > a:hover {
  border-color: #1a7668;
  box-shadow: 0 12px 24px rgba(22, 52, 58, .14);
  transform: translateY(-3px);
}
.commerce-home-shell .home-product-showcase-grid > a.is-sage { background: #cfe6da; }
.commerce-home-shell .home-product-showcase-grid > a.is-peach { background: #f6d7c5; }
.commerce-home-shell .home-product-showcase-grid > a.is-sky { background: #d3e6ee; }
.commerce-home-shell .home-product-showcase-grid > a.is-lilac { background: #dfd8eb; }
.commerce-home-shell .home-product-showcase-grid > a.is-amber { background: #f2d69e; }
.commerce-home-shell .home-product-showcase-grid > a.is-rose { background: #efd0d2; }
.commerce-home-shell .home-product-showcase-grid > a.is-mint { background: #cfe9e2; }
.commerce-home-shell .home-product-showcase-grid > a.is-sand { background: #e8ddc7; }
.commerce-home-shell .home-product-showcase-grid > a.is-aqua { background: #cbe7e7; }
.commerce-home-shell .home-product-showcase-grid > a.is-citrus { background: #e8e0a8; }
.commerce-home-shell .home-product-showcase-grid > a.is-blush { background: #f1d5df; }
.commerce-home-shell .home-product-showcase-grid > a.is-indigo { background: #d5dceb; }
.commerce-home-shell .home-product-showcase-top b {
  color: #28514c;
  font-size: 13px;
}
.commerce-home-shell .home-product-showcase-grid > a > strong {
  margin-top: 12px;
  color: #172f34;
  font-size: 14px;
}
.commerce-home-shell .home-product-showcase-price b {
  color: #9b3f1f;
  font-size: 16px;
}
.commerce-home-shell .home-product-showcase-price small {
  color: #536a67;
  font-size: 13px;
}
.commerce-home-shell .home-product-showcase > footer {
  margin-top: 15px;
}
.commerce-home-shell .home-product-showcase-more {
  display: flex;
  width: 100%;
  min-height: 42px;
  margin-top: 10px;
  padding: 0 13px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border: 1px dashed #8e9d96;
  border-radius: 9px;
  background: rgba(255, 255, 255, .58);
  color: #16463f;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 900;
}
.commerce-home-shell .home-product-showcase-more span {
  color: #6a7771;
  font-weight: 750;
}
.commerce-home-shell .home-product-showcase-more:hover,
.commerce-home-shell .home-product-showcase-more:focus-visible {
  border-style: solid;
  border-color: #075c50;
  background: #e0eee9;
}
.commerce-home-shell .home-product-showcase > footer a {
  min-height: 44px;
  border-color: #1c4f4a;
  color: #16463f;
}
.commerce-home-shell .home-product-showcase > footer a.is-primary {
  border-color: #a54420;
  background: #a54420;
  box-shadow: 0 7px 16px rgba(165, 68, 32, .2);
}
.commerce-home-shell .home-product-showcase > footer a:hover {
  border-color: #075c50;
  background: #075c50;
  color: #fff;
}
.commerce-home-shell .home-decision-panel {
  background: #edf4f2;
}
.commerce-home-shell .home-decision-panel > header {
  background: linear-gradient(145deg, #18343b 0%, #0d5550 100%);
}
.commerce-home-shell .home-decision-panel > header > span {
  color: #a5e5d6;
}
.commerce-home-shell .home-decision-panel nav a:hover {
  background: #dcece7;
  color: #075c50;
}
.commerce-home-shell .home-price-workspace {
  background: #d9eae5;
  color: #075c50;
}

@media (max-width: 780px) {
  .commerce-home-shell .home-discovery-panel {
    min-height: 0;
    padding: 26px 20px;
  }
  .commerce-home-shell .home-product-showcase > header {
    gap: 10px;
    flex-direction: column;
  }
  .commerce-home-shell .home-product-showcase-filters {
    width: calc(100% + 20px);
    padding-right: 20px;
  }
  .commerce-home-shell .home-product-showcase-filters > span {
    margin-left: 4px;
  }
  .commerce-home-shell .home-product-showcase-grid > a {
    min-height: 146px;
  }
}

@media (max-width: 390px) {
  .commerce-home-shell .home-product-showcase-grid {
    grid-template-columns: 1fr;
  }
  .commerce-home-shell .home-product-showcase-grid > a {
    min-height: 132px;
  }
}

/* Product cards are decision entry points, not decorative tiles.  Price uses
   the warm action colour; evidence and compare actions stay in the cool trust
   palette so the visual hierarchy remains calm and predictable. */
.commerce-home-shell .home-product-showcase-grid > article {
  display: flex;
  min-width: 0;
  min-height: 166px;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(22, 52, 58, .15);
  border-radius: 12px;
  box-shadow: 0 3px 0 rgba(22, 52, 58, .04);
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.commerce-home-shell .home-product-showcase-grid > article:hover {
  border-color: #1a7668;
  box-shadow: 0 12px 24px rgba(22, 52, 58, .14);
  transform: translateY(-3px);
}
.commerce-home-shell .home-product-showcase-grid > article.is-sage { background: #cfe6da; }
.commerce-home-shell .home-product-showcase-grid > article.is-peach { background: #f6d7c5; }
.commerce-home-shell .home-product-showcase-grid > article.is-sky { background: #d3e6ee; }
.commerce-home-shell .home-product-showcase-grid > article.is-lilac { background: #dfd8eb; }
.commerce-home-shell .home-product-showcase-grid > article.is-amber { background: #f2d69e; }
.commerce-home-shell .home-product-showcase-grid > article.is-rose { background: #efd0d2; }
.commerce-home-shell .home-product-showcase-grid > article.is-mint { background: #cfe9e2; }
.commerce-home-shell .home-product-showcase-grid > article.is-sand { background: #e8ddc7; }
.commerce-home-shell .home-product-showcase-grid > article.is-aqua { background: #cbe7e7; }
.commerce-home-shell .home-product-showcase-grid > article.is-citrus { background: #e8e0a8; }
.commerce-home-shell .home-product-showcase-grid > article.is-blush { background: #f1d5df; }
.commerce-home-shell .home-product-showcase-grid > article.is-indigo { background: #d5dceb; }
.home-product-showcase-main {
  display: flex;
  min-width: 0;
  min-height: 116px;
  padding: 12px 12px 10px;
  flex: 1;
  flex-direction: column;
  color: #172f34;
  text-decoration: none;
}
.home-product-showcase-main > strong {
  display: -webkit-box;
  margin-top: 10px;
  overflow: hidden;
  font-size: 14px;
  line-height: 1.28;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.home-product-showcase-main .home-product-showcase-price {
  margin-top: auto;
}
.commerce-home-shell .home-product-showcase-grid > article > footer {
  display: flex;
  min-height: 44px;
  padding: 7px 9px 7px 12px;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border-top: 1px solid rgba(22, 52, 58, .13);
  background: rgba(255, 255, 255, .42);
}
.commerce-home-shell .home-product-showcase-grid > article > footer span,
.commerce-home-shell .home-product-showcase-grid > article > footer b,
.commerce-home-shell .home-product-showcase-grid > article > footer small {
  display: block;
  min-width: 0;
}
.commerce-home-shell .home-product-showcase-grid > article > footer b {
  color: #31514b;
  font-size: 13px;
  line-height: 1.3;
}
.commerce-home-shell .home-product-showcase-grid > article > footer small {
  margin-top: 1px;
  color: #66766f;
  font-size: 13px;
}
.commerce-home-shell .home-product-showcase-grid > article > footer > a {
  min-height: 30px;
  padding: 0 9px;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  border: 1px solid #166a5d;
  border-radius: 999px;
  background: rgba(255, 255, 255, .68);
  color: #075c50;
  font-size: 13px;
  font-weight: 900;
  text-decoration: none;
}
.commerce-home-shell .home-product-showcase-grid > article > footer > a:hover,
.commerce-home-shell .home-product-showcase-grid > article > footer > a:focus-visible {
  background: #075c50;
  color: #fff;
}

@media (max-width: 780px) {
  .commerce-home-shell .home-product-showcase-grid > article { min-height: 168px; }
}

@media (max-width: 390px) {
  .commerce-home-shell .home-product-showcase-grid > article { min-height: 156px; }
}

/* Product-first homepage, 2026-08.
   A cool ink/teal foundation carries navigation and trust. Warm coral is used
   only for prices and the price-comparison action, making the commercial path
   noticeable without turning every surface into a call to action. */
.home-page {
  background:
    radial-gradient(circle at 52% 280px, rgba(120, 201, 181, .24), transparent 31rem),
    radial-gradient(circle at 83% 680px, rgba(236, 130, 79, .13), transparent 25rem),
    linear-gradient(180deg, #e7efeb 0, #f7f0e5 690px, #f3ede2 100%);
  color: #17343a;
}
.commerce-home-shell {
  width: min(1440px, calc(100% - 40px));
  grid-template-columns: 205px minmax(0, 1fr) 250px;
  gap: 14px;
}
.commerce-home-shell .home-category-rail,
.commerce-home-shell .home-decision-panel {
  border-color: #cfd9d5;
  box-shadow: 0 10px 28px rgba(14, 45, 46, .06);
}
.commerce-home-shell .home-category-rail {
  background: #fffaf0;
}
.commerce-home-shell .home-category-rail > header {
  border-bottom-color: #164e48;
  background: #153d3c;
  color: #fffdf7;
}
.commerce-home-shell .home-category-rail > header a {
  color: #9ee5d4;
}
.commerce-home-shell .home-category-rail nav {
  padding: 3px 0;
}
.commerce-home-shell .home-category-groups {
  padding: 0;
}
.commerce-home-shell .home-category-group {
  border-bottom: 1px solid #dde3e0;
}
.commerce-home-shell .home-category-group > summary {
  display: grid;
  min-height: 38px;
  padding: 0 11px;
  grid-template-columns: 16px minmax(0, 1fr) auto;
  align-items: center;
  gap: 6px;
  color: #173a37;
  cursor: pointer;
  font-size: 13px;
  font-weight: 900;
  list-style: none;
}
.commerce-home-shell .home-category-group > summary::-webkit-details-marker {
  display: none;
}
.commerce-home-shell .home-category-group > summary::before {
  color: var(--green);
  content: "+";
  font-size: 16px;
  line-height: 1;
}
.commerce-home-shell .home-category-group[open] > summary {
  background: #e3eee9;
}
.commerce-home-shell .home-category-group[open] > summary::before {
  content: "−";
}
.commerce-home-shell .home-category-group > summary > span {
  overflow: hidden;
  color: inherit;
  font-family: inherit;
  font-size: inherit;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.commerce-home-shell .home-category-group > summary > b {
  color: #74837d;
  font-size: 13px;
}
.commerce-home-shell .home-category-group > div {
  max-height: 342px;
  padding: 2px 0 5px;
  overflow-y: auto;
  border-top: 1px solid #e4e9e6;
  background: #fffdf8;
}
.commerce-home-shell .home-category-group > div > a {
  min-height: 30px;
}
.commerce-home-shell .home-category-rail nav a,
.commerce-home-shell .home-category-pc {
  min-height: 32px;
  padding-inline: 11px;
  grid-template-columns: 45px minmax(0, 1fr) auto 10px;
  column-gap: 5px;
}
.commerce-home-shell .home-category-rail nav span,
.commerce-home-shell .home-category-pc > span {
  color: #71817b;
  font-size: 13px;
}
.commerce-home-shell .home-category-rail nav b,
.commerce-home-shell .home-category-pc > b {
  font-size: 13px;
}
.commerce-home-shell .home-category-group > div > a > small {
  color: #71817b;
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  white-space: nowrap;
}
.commerce-home-shell .home-category-pc {
  min-height: 42px;
  border-top-color: #d9dfdc;
  background: #e3eee9;
}
.commerce-home-shell .home-discovery-panel {
  min-height: 720px;
  padding: 0;
  border-color: #bfcfca;
  background: #fbfaf6;
  box-shadow: 0 16px 42px rgba(14, 45, 46, .1);
}
.commerce-home-shell .home-product-showcase > header {
  position: relative;
  padding: 15px 22px 14px;
  overflow: hidden;
  background:
    radial-gradient(circle at 91% 2%, rgba(91, 204, 177, .36), transparent 15rem),
    linear-gradient(132deg, #102f35 0%, #075f56 100%);
  color: #fff;
}
.commerce-home-shell .home-product-showcase > header::after {
  position: absolute;
  right: -36px;
  bottom: -74px;
  width: 210px;
  height: 210px;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 50%;
  content: "";
}
.commerce-home-shell .home-product-showcase > header > div,
.commerce-home-shell .home-product-showcase > header > a {
  position: relative;
  z-index: 1;
}
.commerce-home-shell .home-product-showcase-header-actions {
  display: flex;
  position: relative;
  z-index: 2;
  align-self: flex-start;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 7px;
}
.commerce-home-shell .home-product-showcase-header-actions > a {
  display: inline-flex;
  min-height: 38px;
  padding: 0 12px;
  align-items: center;
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 999px;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}
.commerce-home-shell .home-product-evidence-summary {
  display: inline-flex;
  min-height: 30px;
  padding: 0 9px;
  align-items: center;
  gap: 4px;
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 999px;
  background: rgba(5, 43, 40, .25);
  color: #d8ece6;
  font-size: 11px;
  font-weight: 750;
  white-space: nowrap;
}
.commerce-home-shell .home-product-evidence-summary b {
  color: #fff;
  font-size: 12px;
}
.commerce-home-shell .home-product-showcase-header-actions > a:hover,
.commerce-home-shell .home-product-showcase-header-actions > a:focus-visible {
  border-color: #f39a62;
  background: #f39a62;
  color: #17343a;
}
.commerce-home-shell .home-product-showcase-header-actions .shortlist-status-link b {
  background: rgba(255, 255, 255, .16);
  color: #fff;
}
.commerce-home-shell .home-product-showcase > header .kicker {
  color: #9ee5d4;
}
.commerce-home-shell .home-product-showcase > header .kicker span {
  background: #f39a62;
}
.commerce-home-shell .home-product-showcase > header h1 {
  max-width: 620px;
  color: #fffdf8;
  font-size: clamp(26px, 2vw, 32px);
  line-height: 1.08;
  letter-spacing: -.035em;
}
.commerce-home-shell .home-product-showcase > header p:not(.kicker) {
  max-width: 620px;
  margin: 7px 0 0;
  color: #cbe0da;
  font-size: 14px;
  line-height: 1.55;
}


/* Final home-density pass: section titles provide orientation without taking
   over the first screen. Product cards and tools should remain the focal point. */
@media (min-width: 981px) {
  .home-market-overview {
    padding-block: 10px 18px;
  }
  .home-market-overview .home-section-heading {
    min-height: 0;
    margin-bottom: 8px;
    grid-template-columns: minmax(0, 1.55fr) minmax(260px, .45fr);
    align-items: end;
  }
  .home-market-overview .home-section-heading h2 {
    max-width: none;
    font-size: clamp(21px, 1.45vw, 26px);
    line-height: 1.12;
  }
  .home-market-overview .home-section-heading > p {
    max-width: 520px;
    margin: 0 0 2px;
  }

  .home-shopping-kits {
    padding-block: 18px 22px;
  }
  .home-shopping-kits > header {
    min-height: 0;
    margin-bottom: 10px;
    grid-template-columns: minmax(0, 1.25fr) minmax(360px, .75fr);
    align-items: end;
  }
  .home-shopping-kits h2 {
    max-width: none;
    font-size: clamp(23px, 1.65vw, 29px);
    line-height: 1.08;
  }
  .home-shopping-kits > div > a {
    min-height: 150px;
    padding: 16px 18px;
  }
  .finder-copy > p:not(.kicker) {
    max-width: 620px;
    margin-block: 8px 12px;
  }
}

/* Full-width product wall: the global navigation already exposes the advisor
   and tools, so a second Quick Start rail only steals comparison space. */
.commerce-home-shell {
  grid-template-columns: 205px minmax(0, 1fr);
}
.commerce-home-shell .home-product-showcase > header {
  display: flex;
  min-height: 54px;
  padding: 8px 16px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.commerce-home-shell .home-product-showcase > header h1 {
  max-width: none;
  margin: 0;
  font-size: clamp(20px, 1.45vw, 25px);
  line-height: 1;
  letter-spacing: -.025em;
}
.commerce-home-shell .home-product-showcase-header-actions {
  align-self: center;
  flex-wrap: nowrap;
}
.commerce-home-shell .home-product-showcase-header-actions > a {
  min-height: 32px;
  padding-inline: 10px;
  font-size: 13px;
}
.commerce-home-shell .home-product-showcase-filters {
  min-height: 44px;
  padding: 6px 14px;
}
.commerce-home-shell .home-product-showcase-grid {
  padding: 10px 12px 4px;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
}
.commerce-home-shell .home-product-showcase-main {
  padding: 9px 9px 8px;
}
.commerce-home-shell .home-product-showcase-grid > article:has(.shortlist-button.is-icon-only) .home-product-showcase-main {
  padding-right: 38px;
}
.commerce-home-shell .home-product-showcase-grid .shortlist-button.is-icon-only {
  top: 7px;
  right: 7px;
  width: 28px;
  min-width: 28px;
  min-height: 28px;
}
.home-product-showcase-identity {
  margin-top: 6px;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 7px;
}
.home-product-showcase-identity .product-visual {
  width: 54px;
  height: 54px;
}
.commerce-home-shell .home-product-showcase-main > strong {
  margin-top: 0;
}

@media (max-width: 1280px) {
  .commerce-home-shell {
    grid-template-columns: 192px minmax(0, 1fr);
  }
  .commerce-home-shell .home-product-showcase-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

@media (max-width: 1120px) {
  .commerce-home-shell {
    grid-template-columns: 185px minmax(0, 1fr);
  }
  .commerce-home-shell .home-product-showcase-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 780px) {
  .commerce-home-shell {
    grid-template-columns: 1fr;
  }
  .commerce-home-shell .home-product-showcase > header {
    min-height: 50px;
    padding: 8px 12px;
    flex-direction: row;
  }
  .commerce-home-shell .home-product-showcase > header h1 {
    font-size: 21px;
  }
  .commerce-home-shell .home-product-showcase-header-actions > a:first-child {
    display: none;
  }
  .commerce-home-shell .home-product-showcase-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Product photos belong in the primary shopping card.  Exact, authorized
   images replace the model fallback automatically while keeping every card's
   footprint stable when an image is still awaiting feed approval. */
.commerce-home-shell .home-product-showcase-identity {
  grid-template-columns: 82px minmax(0, 1fr);
  align-items: center;
}
.commerce-home-shell .home-product-showcase-identity .product-visual {
  width: 82px;
  height: 82px;
  border-color: #c8dcd4;
  background: linear-gradient(145deg, #f6fbf8, #deeee8);
}
.commerce-home-shell .home-product-showcase-identity .product-visual.has-image {
  border-color: #b9d8cd;
  background: #fff;
  box-shadow: 0 3px 10px rgba(16, 63, 52, .09);
}
.commerce-home-shell .home-product-showcase-identity .product-visual > img {
  padding: 3px;
}

@media (max-width: 430px) {
  .commerce-home-shell .home-product-showcase-identity {
    grid-template-columns: 70px minmax(0, 1fr);
  }
  .commerce-home-shell .home-product-showcase-identity .product-visual {
    width: 70px;
    height: 70px;
  }
}


/* Audited homepage controls: keep the live result count outside the tablist,
   avoid horizontal page overflow, and maintain WCAG AA text contrast. */
.commerce-home-shell .home-product-showcase-filters {
  overflow: visible;
}
.commerce-home-shell .home-product-showcase-tabs {
  display: flex;
  min-width: 0;
  flex: 1 1 auto;
  align-items: center;
  gap: 6px;
  overflow-x: auto;
  scrollbar-width: thin;
}
.commerce-home-shell .home-product-showcase-filters > span {
  margin-left: auto;
  flex: 0 0 auto;
  color: #596a64;
}
.commerce-home-shell .home-product-showcase-top small {
  color: #596a64;
}
.commerce-home-shell .home-product-showcase-grid > article > footer > a.is-price {
  border-color: #b84a22;
  background: #b84a22;
}

.commerce-home-shell .home-product-showcase > footer a.is-primary {
  border-color: #b84a22;
  background: #b84a22;
  color: #fff;
}

.home-pc-workbench li b,
.home-pc-workbench li i {
  color: #596a64;
}

@media (max-width: 780px) {
  /* The desktop evidence chips are useful at a glance, but on a phone they
     compete with the page title and force every Chinese character onto its
     own line. Keep the mobile header to one clear title and one destination. */
  .commerce-home-shell .home-product-showcase > header {
    min-width: 0;
  }
  .commerce-home-shell .home-product-showcase > header h1 {
    min-width: max-content;
    flex: 0 0 auto;
    white-space: nowrap;
  }
  .commerce-home-shell .home-product-showcase-header-actions {
    min-width: 0;
    margin-left: auto;
  }
  .commerce-home-shell .home-product-evidence-summary,
  .commerce-home-shell .home-product-showcase-header-actions .shortlist-status-link {
    display: none;
  }
  .commerce-home-shell .home-product-showcase-header-actions > a {
    min-height: 32px;
    padding-inline: 9px;
    overflow: hidden;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

@media (max-width: 360px) {
  .commerce-home-shell .home-product-showcase > header h1 {
    font-size: 19px;
  }
  .commerce-home-shell .home-product-showcase-header-actions > a {
    max-width: 122px;
  }
}


/* Readable product cards: the canonical product name gets its own full-width
   line.  Fewer, wider columns keep brand + model visible without stacking the
   name beside the photo or turning every card into a tall text column. */
.commerce-home-shell .home-product-showcase-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.commerce-home-shell .home-product-showcase-main {
  min-height: 0;
  padding: 10px 11px 9px;
}

.commerce-home-shell .home-product-showcase-title,
.commerce-home-shell .home-product-showcase-main > strong.home-product-showcase-title {
  display: block;
  width: 100%;
  min-width: 0;
  margin: 8px 0 0;
  overflow: visible;
  color: #17343a;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: -.02em;
  white-space: normal;
  overflow-wrap: anywhere;
  -webkit-box-orient: initial;
  -webkit-line-clamp: initial;
}

.commerce-home-shell .home-product-showcase-title.is-long {
  font-size: 1rem;
}

.commerce-home-shell .home-product-showcase-title.is-very-long {
  font-size: 1rem;
}

.commerce-home-shell .home-product-showcase-identity {
  min-width: 0;
  margin-top: 9px;
  grid-template-columns: 104px minmax(0, 1fr);
  align-items: stretch;
  gap: 11px;
}

.commerce-home-shell .home-product-showcase-identity .product-visual {
  width: 104px;
  height: 104px;
}

.home-product-showcase-card-meta {
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: space-between;
  gap: 8px;
}

.commerce-home-shell .home-product-showcase-card-meta .home-product-showcase-price {
  display: flex;
  min-width: 0;
  margin: 0;
  flex-direction: column;
  gap: 3px;
}

.commerce-home-shell .home-product-showcase-card-meta .home-product-showcase-price b {
  font-size: 20px;
}

.commerce-home-shell .home-product-showcase-card-meta .home-product-evidence-line {
  margin-top: auto;
}

@media (max-width: 1400px) {
  .commerce-home-shell .home-product-showcase-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  .commerce-home-shell .home-product-showcase-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .commerce-home-shell .home-product-showcase-grid {
    grid-template-columns: 1fr;
  }

  .commerce-home-shell .home-product-showcase-grid > article:has(.shortlist-button.is-icon-only) .home-product-showcase-main {
    padding-right: 11px;
  }

  .commerce-home-shell .home-product-showcase-top {
    padding-right: 32px;
  }
}

@supports (content-visibility: auto) {
  .commerce-home-shell .home-product-showcase-grid > article:nth-child(n + 5) {
    content-visibility: auto;
    contain-intrinsic-size: auto 270px;
  }

  @media (max-width: 980px) {
    .commerce-home-shell .home-product-showcase-grid > article:nth-child(n + 3) {
      content-visibility: auto;
      contain-intrinsic-size: auto 270px;
    }
  }
}
.home-product-empty {
  grid-column: 1 / -1;
  padding: 1rem;
  color: var(--ink, #14251e);
}
.home-product-empty p { margin: 0 0 0.75rem; }
.home-product-empty button,
.home-product-load-error button {
  cursor: pointer;
  border: 1px solid currentColor;
  border-radius: 0.5rem;
  background: transparent;
  padding: 0.5rem 0.75rem;
  margin-right: 0.75rem;
  font: inherit;
  color: inherit;
}
.home-product-load-error { padding: 0 1rem; }
