.compare-main { padding: 65px 0 100px; }
.compare-heading { margin-bottom: 35px; }
.compare-heading h1 { margin: 8px 0 12px; font-size: clamp(42px, 6vw, 72px); }
.compare-heading p { color: var(--muted); }
.compare-empty { padding: 70px 30px; text-align: center; background: #fff; border: 1px solid var(--line); border-radius: 12px; }
.compare-empty a { display: inline-block; margin-top: 15px; padding: 12px 17px; color: #fff; background: var(--primary); border-radius: 7px; text-decoration: none; font-size: 12px; font-weight: 750; }
.compare-main, #compare-content { min-width: 0; }
#compare-content { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-gutter: stable; -webkit-overflow-scrolling: touch; }
.compare-products { position: sticky; z-index: 4; top: 76px; display: grid; background: #f6f6f8; border-bottom: 1px solid var(--line); }
.compare-product-spacer { border-right: 1px solid var(--line); }
.compare-product { position: relative; min-width: 0; overflow: hidden; padding: 15px; background: #fff; border-right: 1px solid var(--line); }
.compare-product-image { width: 100%; height: 135px; display: grid; place-items: center; overflow: hidden; }
.compare-product img { max-width: 100%; width: 100%; max-height: 135px; height: 100%; display: block; object-fit: contain; object-position: center; }
.compare-product small { display: block; margin-top: 8px; color: var(--primary); font-size: 9px; font-weight: 800; }
.compare-product h2 { margin: 4px 25px 0 0; font-size: 14px; line-height: 1.3; }
.compare-remove { position: absolute; top: 9px; right: 9px; width: 25px; height: 25px; border: 0; border-radius: 50%; cursor: pointer; }
.compare-group { display: grid; }
.compare-products.columns-2, .compare-group.columns-2 { grid-template-columns: 190px repeat(2, minmax(190px, 1fr)); }
.compare-products.columns-3, .compare-group.columns-3 { grid-template-columns: 190px repeat(3, minmax(190px, 1fr)); }
.compare-products.columns-4, .compare-group.columns-4 { grid-template-columns: 190px repeat(4, minmax(190px, 1fr)); }
.compare-group-title { grid-column: 1 / -1; padding: 14px 16px; color: #fff; background: var(--ink); font-size: 13px; font-weight: 800; }
.compare-label, .compare-value { padding: 12px 15px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); font-size: 11px; }
.compare-label { color: var(--muted); background: #eeeeF2; }
.compare-value { background: #fff; }
.compare-value.different { background: #fff6dd; font-weight: 700; }
@media (max-width: 750px) {
  .compare-heading { width: 100%; }
  .compare-product-spacer { display: none; }
  .compare-products.columns-2 { min-width: 340px; grid-template-columns: repeat(2, 170px); }
  .compare-products.columns-3 { min-width: 510px; grid-template-columns: repeat(3, 170px); }
  .compare-products.columns-4 { min-width: 680px; grid-template-columns: repeat(4, 170px); }
  .compare-group.columns-2 { min-width: 470px; grid-template-columns: 130px repeat(2, 170px); }
  .compare-group.columns-3 { min-width: 640px; grid-template-columns: 130px repeat(3, 170px); }
  .compare-group.columns-4 { min-width: 810px; grid-template-columns: 130px repeat(4, 170px); }
  .compare-product { padding: 12px; }
  .compare-product-image { height: 115px; }
  .compare-product img { max-height: 115px; }
}