/* Compact, progressively enhanced browsing; source articles remain intact. */
.hc-page-product #product-variants { padding-block: 24px; }
.hc-page-product #product-variants [hidden] { display: none !important; }
.hc-page-product #product-variants .hc-pdp-variant-list { gap: 0; border-top: 1px solid var(--c-line); }
.hc-page-product #product-variants .hc-pdp-variant-row { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1.8fr) minmax(245px, 1fr) 104px; align-items: center; gap: 8px 16px; padding: 10px 12px; border-radius: 0; border-bottom: 1px solid var(--c-line); background: var(--c-bg); }
.hc-page-product #product-variants .hc-pdp-variant-row.is-selected { background: var(--c-bg-soft); }
.hc-page-product #product-variants .hc-pdp-variant-row h3 { font-size: 14px; line-height: 20px; margin: 0; }
.hc-page-product #product-variants .hc-pdp-variant-row > div:first-child > small { display: none; }
.hc-page-product #product-variants .hc-pdp-variant-row dl { gap: 12px; }
.hc-page-product #product-variants .hc-pdp-variant-row dd { font-size: 13px; line-height: 18px; margin-top: 2px; overflow-wrap: anywhere; }
.hc-page-product #product-variants .hc-pdp-variant-price { flex-direction: row; align-items: center; justify-content: flex-end; gap: 12px; }
.hc-page-product #product-variants .hc-pdp-variant-price strong { font-size: 14px; white-space: normal; text-align: right; }
.hc-page-product #product-variants .hc-pdp-variant-price button { min-width: 100px; padding: 6px 10px; }
.hc-page-product #product-variants .hc-variant-details { grid-column: auto; border: 0; }
.hc-page-product #product-variants .hc-variant-details > summary { gap: 6px; font-size: 12px; }
.hc-page-product #product-variants .hc-variant-details-caption { display: none; }
.hc-page-product #product-variants .hc-variant-details[open] { grid-column: 1 / -1; border-top: 1px solid var(--c-line); }
.hc-page-product #product-variants .hc-variant-details-content { max-height: min(480px, 60vh); overflow-y: auto; scrollbar-gutter: stable; }
.hc-page-product #product-variants .hc-variant-details-content:focus-visible { outline: 2px solid var(--c-focus); outline-offset: 2px; }
.hc-page-product .hc-variants-tools { display: grid; grid-template-columns: minmax(160px, 1fr) minmax(170px, .65fr) auto; gap: 12px; align-items: end; scroll-margin-top: 100px; }
.hc-page-product .hc-variants-tools label { display: grid; gap: 6px; font-size: 12px; color: var(--c-ink-2); }
.hc-page-product .hc-variants-tools input,
.hc-page-product .hc-variants-tools select { box-sizing: border-box; width: 100%; min-width: 0; height: 44px; border: 1px solid var(--c-line); border-radius: 6px; background: var(--c-bg); padding: 8px 12px; color: var(--c-ink); font: inherit; font-size: 16px; }
.hc-page-product .hc-variants-tools button,
.hc-page-product .hc-variants-pages button,
.hc-page-product .hc-variants-empty button { min-height: 44px; padding: 8px 12px; border: 1px solid var(--c-line); border-radius: 6px; background: var(--c-bg); color: var(--c-ink); font: inherit; font-size: 13px; cursor: pointer; }
.hc-page-product .hc-variants-tools :is(input, select, button):focus-visible,
.hc-page-product .hc-variants-pages button:focus-visible,
.hc-page-product .hc-variants-empty button:focus-visible { outline: 2px solid var(--c-focus); outline-offset: 3px; }
.hc-page-product .hc-variants-count { margin: 12px 0; color: var(--c-ink-2); font-size: 12px; line-height: 18px; font-variant-numeric: tabular-nums; }
.hc-page-product .hc-variants-pages { display: flex; align-items: center; justify-content: flex-end; gap: 16px; margin-top: 14px; font-size: 13px; font-variant-numeric: tabular-nums; }
.hc-page-product .hc-variants-pages button:disabled { opacity: .45; cursor: default; }
.hc-page-product .hc-variants-empty { padding: 24px 0; color: var(--c-ink-2); font-size: 14px; }
@media (max-width: 1050px) {
  .hc-page-product #product-variants .hc-pdp-variant-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr) minmax(145px, .8fr); }
  .hc-page-product #product-variants .hc-pdp-variant-price { grid-column: auto; flex-direction: column; align-items: end; gap: 6px; }
  .hc-page-product #product-variants .hc-variant-details { grid-column: 1 / -1; }
  .hc-page-product #product-variants .hc-variant-details:not([open]) { justify-self: start; }
}
@media (max-width: 700px) {
  .hc-page-product .hc-variants-tools { grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
  .hc-page-product .hc-variants-tools > label:first-child { grid-column: 1 / -1; }
  .hc-page-product #product-variants .hc-pdp-variant-row { grid-template-columns: minmax(0, 1fr) 100px; gap: 4px 12px; padding: 12px 8px; }
  .hc-page-product #product-variants .hc-pdp-variant-row > div:first-child { grid-column: 1 / -1; }
  .hc-page-product #product-variants .hc-pdp-variant-row dl { grid-column: 1 / -1; grid-template-columns: minmax(0, .8fr) minmax(0, .9fr) minmax(0, 1.2fr); gap: 8px; margin: 4px 0; }
  .hc-page-product #product-variants .hc-pdp-variant-price { display: contents; }
  .hc-page-product #product-variants .hc-pdp-variant-price strong { grid-column: 1 / -1; text-align: left; }
  .hc-page-product #product-variants .hc-pdp-variant-price button { grid-column: 2; grid-row: 4; }
  .hc-page-product #product-variants .hc-variant-details:not([open]) { grid-column: 1; grid-row: 4; }
  .hc-page-product #product-variants .hc-variant-details > summary { min-height: 44px; }
  .hc-page-product .hc-variants-pages { justify-content: space-between; gap: 8px; }
}

/* Buyer-facing differences matrix; original offer articles are the no-JS fallback. */
.hc-page-product .hc-index-tools { display: flex; align-items: end; gap: 24px; margin-bottom: 14px; }
.hc-page-product .hc-index-tools label { display: grid; flex: 0 0 250px; gap: 6px; color: var(--c-ink-2); font-size: 13px; line-height: 20px; }
.hc-page-product .hc-index-tools select { min-height: 44px; width: 100%; padding: 9px 12px; border: 1px solid var(--c-line); border-radius: var(--r-sm); background: var(--c-bg); color: var(--c-ink); font: inherit; font-size: 16px; }
.hc-page-product .hc-index-tools p { max-width: 64ch; margin: 0 0 2px; color: var(--c-ink-2); font-size: 13px; line-height: 21px; }
.hc-page-product .hc-index-settings { border: 0; margin: 0; padding: 0; background: transparent; }
.hc-page-product .hc-index-settings > summary { display: none; }
.hc-page-product .hc-index-status,
.hc-page-product .hc-index-note { margin: 12px 0; color: var(--c-ink-2); font-size: 13px; line-height: 21px; }
.hc-page-product .hc-index-scroll { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; scroll-margin-top: 100px; }
.hc-page-product .hc-index-table { width: 100%; min-width: 1080px; margin: 0; table-layout: fixed; border-collapse: separate; border-spacing: 0; font-size: 14px; line-height: 22px; font-variant-numeric: tabular-nums; }
.hc-page-product .hc-index-table .hc-index-label-column { width: 210px; }
.hc-page-product .hc-index-table th,
.hc-page-product .hc-index-table td { padding: 12px 10px; border: 0; border-bottom: 1px solid var(--c-line); background: var(--c-bg); vertical-align: top; text-align: left; overflow-wrap: anywhere; }
.hc-page-product .hc-index-table thead th { border-top: 1px solid var(--c-line); padding-block: 16px; }
.hc-page-product .hc-index-table thead strong { display: block; font-size: 14px; line-height: 21px; font-weight: 650; }
.hc-page-product .hc-index-table thead small { display: block; margin-top: 4px; color: var(--c-ink-2); font-size: 12px; line-height: 18px; font-weight: 400; }
.hc-page-product .hc-index-table tbody th { font-weight: 400; color: var(--c-ink-2); }
.hc-page-product .hc-index-table tbody td { font-weight: 600; }
.hc-page-product .hc-index-table tr > :first-child { position: sticky; left: 0; z-index: 1; }
.hc-page-product .hc-index-table .is-current-index { background: var(--c-bg-soft); }
.hc-page-product .hc-index-table thead .is-current-index { border-top-color: var(--c-accent); }
.hc-page-product .hc-index-table .is-unconfirmed { color: var(--c-ink-3); font-weight: 400; }
.hc-page-product .hc-index-table tfoot th { font-weight: 600; }
.hc-page-product .hc-index-offer { display: block; min-height: 36px; margin-bottom: 8px; color: var(--c-ink-2); font-size: 12px; line-height: 18px; }
.hc-page-product .hc-index-price { display: block; min-height: 44px; font-size: 14px; line-height: 22px; font-weight: 650; }
.hc-page-product .hc-index-choose,
.hc-page-product .hc-index-more { min-height: 44px; padding: 9px 12px; border: 1px solid var(--c-line); border-radius: var(--r-sm); background: var(--c-bg); color: var(--c-ink); font: inherit; font-size: 13px; line-height: 20px; font-weight: 600; cursor: pointer; touch-action: manipulation; }
.hc-page-product .hc-index-choose { width: 100%; padding-inline: 6px; }
.hc-page-product .hc-index-choose:disabled { color: var(--c-ink-2); cursor: default; background: var(--c-bg-soft); }
.hc-page-product .hc-index-choose[aria-pressed="true"] { border-color: var(--c-ink); background: var(--c-ink); color: var(--c-bg); }
.hc-page-product .hc-index-more { margin-top: 14px; color: var(--c-accent); }
.hc-page-product .hc-index-scroll-hint { display: none; }
.hc-page-product .hc-index-scroll:focus-visible,
.hc-page-product .hc-index-tools select:focus-visible,
.hc-page-product .hc-index-choose:focus-visible,
.hc-page-product .hc-index-more:focus-visible { outline: 2px solid var(--c-focus); outline-offset: 3px; }
@media (hover: hover) and (pointer: fine) {
  .hc-page-product .hc-index-choose:not([aria-pressed="true"]):not(:disabled):hover,
  .hc-page-product .hc-index-more:hover { border-color: var(--c-accent); color: var(--c-accent-hover); }
}
@media (max-width: 900px) {
  .hc-page-product .hc-index-tools { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .hc-page-product .hc-index-tools label { min-width: 0; }
  .hc-page-product .hc-index-tools p { grid-column: 1 / -1; }
  .hc-page-product #product-variants.hc-index-comparison .hc-pdp-section-head { margin-bottom: 12px; }
  .hc-page-product #product-variants.hc-index-comparison .hc-pdp-section-head > p { display: none; }
  .hc-page-product .hc-index-pair-intro { margin: 0 0 16px; color: var(--c-ink-2); font-size: 16px; line-height: 24px; }
  .hc-page-product .hc-index-pair-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding-block: 8px 12px; background: var(--c-bg); border-bottom: 1px solid var(--c-line); }
  .hc-page-product .hc-index-pair-controls label { display: grid; min-width: 0; align-content: start; gap: 6px; color: var(--c-ink-2); font-size: 14px; line-height: 20px; }
  .hc-page-product .hc-index-pair-controls select { box-sizing: border-box; min-width: 0; width: 100%; min-height: 48px; padding: 10px 12px; border: 1px solid var(--c-line); border-radius: var(--r-sm); background: var(--c-bg); color: var(--c-ink); font: inherit; font-size: 16px; font-weight: 600; touch-action: manipulation; }
  .hc-page-product .hc-index-pair-name { display: block; min-width: 0; color: var(--c-ink); font-size: 14px; line-height: 21px; font-weight: 600; overflow-wrap: anywhere; }
  .hc-page-product .hc-index-settings { border-bottom: 1px solid var(--c-line); margin-block: 0 12px; }
  .hc-page-product .hc-index-settings > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; list-style: none; color: var(--c-ink-2); font-size: 14px; line-height: 22px; cursor: pointer; touch-action: manipulation; }
  .hc-page-product .hc-index-settings > summary::-webkit-details-marker { display: none; }
  .hc-page-product .hc-index-settings-arrow { flex: 0 0 auto; color: var(--c-ink); }
  .hc-page-product .hc-index-settings[open] .hc-index-settings-arrow { transform: rotate(180deg); }
  .hc-page-product .hc-index-settings .hc-index-tools { margin-top: 8px; }
  .hc-page-product .hc-index-settings select,
  .hc-page-product .hc-index-more,
  .hc-page-product .hc-index-choose { min-height: 48px; font-size: 16px; }
  .hc-page-product .hc-index-pair-scope { margin: 0 0 8px; color: var(--c-ink-2); font-size: 14px; line-height: 21px; }
  .hc-page-product .hc-index-pair-values { margin: 0; }
  .hc-page-product .hc-index-pair-row { padding-block: 16px; border-bottom: 1px solid var(--c-line); }
  .hc-page-product .hc-index-pair-row dt { margin: 0 0 8px; color: var(--c-ink-2); font-size: 14px; line-height: 21px; }
  .hc-page-product .hc-index-pair-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0; }
  .hc-page-product .hc-index-pair-columns > div { min-width: 0; padding: 10px 8px; }
  .hc-page-product .hc-index-pair-columns .is-current-index { background: var(--c-bg-soft); border-radius: var(--r-sm); }
  .hc-page-product .hc-index-pair-columns strong:not(.hc-index-pair-name) { color: var(--c-ink); font-size: 16px; line-height: 24px; font-weight: 600; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
  .hc-page-product .hc-index-pair-offers { margin-top: 16px; align-items: stretch; }
  .hc-page-product .hc-index-pair-offers > div { display: flex; flex-direction: column; gap: 8px; }
  .hc-page-product .hc-index-pair-offers .hc-index-offer,
  .hc-page-product .hc-index-pair-offers .hc-index-price { min-height: 0; margin: 0; }
  .hc-page-product .hc-index-pair-offers .hc-index-offer { font-size: 14px; line-height: 21px; overflow-wrap: anywhere; }
  .hc-page-product .hc-index-pair-offers .hc-index-choose { margin-top: auto; padding-inline: 6px; font-size: 14px; }
  .hc-page-product .hc-index-pair-empty { margin: 16px 0; color: var(--c-ink-2); font-size: 16px; line-height: 24px; }
  .hc-page-product .hc-index-pair-controls select:focus-visible,
  .hc-page-product .hc-index-settings summary:focus-visible { outline: 2px solid var(--c-focus); outline-offset: 3px; }
  .hc-page-product .hc-index-settings summary:active,
  .hc-page-product .hc-index-choose:not(:disabled):not([aria-pressed="true"]):active { background: var(--c-bg-soft); }
  .hc-page-product .hc-index-choose,
  .hc-page-product .hc-index-more { transition: background-color 150ms ease, color 150ms ease, border-color 150ms ease; }
}
@media (max-width: 900px) and (min-height: 600px) {
  .hc-page-product .hc-index-pair-controls { position: sticky; top: var(--index-header-height, 72px); z-index: 2; }
}
@media (prefers-reduced-motion: reduce) {
  .hc-page-product .hc-index-choose,
  .hc-page-product .hc-index-more { transition: none; }
}