/* =================== hc-compare.css =================== */
/* v7.61.17 — Premium compare table styling. */

.page-compare {
--hc-cmp-bd: rgba(180, 151, 115, 0.18);
  --hc-cmp-bd-strong: rgba(180, 151, 115, 0.32);
  --hc-cmp-cell-pad: 14px 18px;
}

.hc-cmp-head {display: flex; justify-content: space-between; align-items: center; gap: var(--hc-sp-3); flex-wrap: wrap; margin-bottom: var(--hc-sp-5)}
.hc-cmp-head__controls {display: flex; gap: 10px; align-items: center; flex-wrap: wrap}
.hc-cmp-head__badge {margin-left: 4px; font-family: var(--hc-mono, "JetBrains Mono", monospace); font-size: 11px; color: var(--hc-muted, rgba(26, 23, 20, 0.55))}

.page-compare .hc-cmp-head {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 18px;
  align-items: end;
  margin-bottom: 24px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--hc-cmp-bd);
}
.page-compare .hc-cmp-head h1 {
  font-family: var(--hc-serif, "Playfair Display", Georgia, serif);
  font-size: 36px; font-weight: 500;
  letter-spacing: -0.015em;
  margin: 8px 0 0;
  color: var(--hc-ink, #1a1714);
}
.page-compare .hc-cmp-head__badge {
font-family: "JetBrains Mono", monospace;
  font-size: 11px;
  color: var(--hc-accent, #8b7355);
}
.page-compare .hc-cmp-head__controls {
display: flex; gap: 10px; align-items: center;
  flex-wrap: wrap;
}
.page-compare .hc-cmp-actions {
margin-top: 20px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 14px;
}
@media (max-width: 1024px) {
  .page-compare .hc-cmp-actions {grid-template-columns: 1fr}
}
.page-compare .hc-cmp-action {
background: var(--hc-paper, #ffffff);
  border: 1px solid var(--hc-cmp-bd);
  border-radius: 14px;
  padding: 18px 22px;
  position: relative;
}
.page-compare .hc-cmp-action--accent {
background: var(--hc-ink, #1a1714);
  color: var(--hc-paper, #ffffff);
  display: grid; align-items: center; justify-items: center;
  gap: 10px; text-align: center;
}
.page-compare .hc-cmp-action--accent strong {
font-family: var(--hc-serif, "Playfair Display", Georgia, serif);
  font-size: 18px; font-weight: 500; line-height: 1.2;
  color: var(--hc-paper, #ffffff); margin: 0 0 4px;
  display: block;
}
.page-compare .hc-cmp-action--accent p {
font-size: 12px; line-height: 1.5;
  color: rgba(255, 255, 255, 0.65);
  margin: 0 0 12px;
}
.page-compare .hc-cmp-action--accent .hc-btn {
background: var(--hc-gold, #d4b896); color: var(--hc-ink, #1a1714);
  padding: 10px 18px; border-radius: 8px;
  text-decoration: none; font-size: 12px; font-weight: 500;
  border: 0; display: inline-block;
}
.page-compare .hc-cmp-action__lbl {
font-size: 10px; letter-spacing: 0.10em;
  text-transform: uppercase; font-weight: 500;
  color: rgba(26, 23, 20, 0.55);
  font-family: "JetBrains Mono", monospace;
  margin-bottom: 6px;
  display: block;
}
.page-compare .hc-cmp-action__text {
font-size: 13px; line-height: 1.5;
  color: rgba(26, 23, 20, 0.62);
  margin: 0;
}
.page-compare .hc-cmp-action__title {
font-family: var(--hc-serif, "Playfair Display", Georgia, serif);
  font-size: 16px; font-weight: 500;
  margin: 0 0 6px;
  color: var(--hc-ink, #1a1714);
}

.hc-cmp-tbl {width: 100%; border-collapse: collapse; min-width: 600px}
.hc-cmp-tbl th, .hc-cmp-tbl td {padding: var(--hc-sp-3) var(--hc-sp-4); border-bottom: 1px solid var(--hc-line); vertical-align: top}
.hc-cmp-tbl__lbl {background: var(--hc-paper-2); font-weight: 500; color: var(--hc-ink-soft); font-size: var(--hc-fs-sm); min-width: 160px; text-align: left}
.hc-cmp-tbl__head {padding: var(--hc-sp-4); vertical-align: top; min-width: 200px; border-bottom: 2px solid var(--hc-line)}
.hc-cmp-tbl__prod {display: block; text-decoration: none; color: inherit}
.hc-cmp-tbl__prod img {width: 100%; aspect-ratio: 1; object-fit: contain; mix-blend-mode: multiply; background: var(--hc-paper-2); border-radius: var(--hc-r-sm); padding: var(--hc-sp-2); margin-bottom: var(--hc-sp-2)}
.hc-cmp-tbl__prod-name {font-weight: 500; font-size: var(--hc-fs-sm); line-height: 1.3}
.hc-cmp-tbl__val {font-size: var(--hc-fs-sm)}
.hc-cmp-tbl__val.is-same {color: var(--hc-muted, rgba(26, 23, 20, 0.55))}
.hc-cmp-tbl sup {display: none}

.page-compare .hc-cmp-tbl {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.page-compare .hc-cmp-tbl thead tr {
  background: linear-gradient(180deg, #fdfbf6, #fcf9f3);
  border-bottom: 1px solid var(--hc-cmp-bd-strong);
}
.page-compare .hc-cmp-tbl tbody tr {
  border-bottom: 1px solid rgba(180, 151, 115, 0.10);
  transition: background .12s;
}
.page-compare .hc-cmp-tbl tbody tr:hover { background: rgba(212, 184, 150, 0.04); }
.page-compare .hc-cmp-tbl tbody tr:last-child { border-bottom: 0; }
.page-compare .hc-cmp-tbl tbody tr[data-diff="same"] { background: rgba(180, 151, 115, 0.03); }
.page-compare .hc-cmp-tbl tbody tr[data-diff="same"] .hc-cmp-tbl__lbl::after {
  content: "·";
  display: inline-block;
  margin-left: 6px;
  color: rgba(26, 23, 20, 0.30);
}
.page-compare .hc-cmp-tbl tbody tr[data-diff="diff"] .hc-cmp-tbl__lbl::after {
  content: "⚡";
  display: inline-block;
  margin-left: 6px;
  color: var(--hc-accent, #8b7355);
  font-size: 9px;
  vertical-align: super;
}
.page-compare .hc-cmp-tbl tfoot tr {
  background: #fcf9f3;
  border-top: 1px solid var(--hc-cmp-bd-strong);
}
.page-compare .hc-cmp-tbl tfoot td {
  padding: 16px 18px;
  border-right: 1px solid var(--hc-cmp-bd);
}
.page-compare .hc-cmp-tbl tfoot td:last-child { border-right: 0; }
.page-compare .hc-cmp-tbl tfoot .hc-btn--primary {
  width: 100%; padding: 10px 16px;
  background: var(--hc-ink, #1a1714); color: var(--hc-paper, #ffffff);
  border: 0; border-radius: 8px;
  font-family: inherit; font-size: 12px; font-weight: 500;
  cursor: pointer;
  transition: background .12s;
}
.page-compare .hc-cmp-tbl tfoot .hc-btn--primary:hover {
  background: var(--hc-accent, #8b7355);
}
.page-compare .hc-cmp-tbl__best {
position: absolute;
  top: 14px; right: 14px;
  background: var(--hc-ink, #1a1714); color: var(--hc-gold, #d4b896);
  font-size: 9px; letter-spacing: 0.10em;
  text-transform: uppercase; font-weight: 500;
  font-family: "JetBrains Mono", monospace;
  padding: 3px 7px;
  border-radius: 4px;
}
.page-compare .hc-cmp-tbl__head-meta {
display: flex; justify-content: space-between; align-items: center;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--hc-cmp-bd);
}
.page-compare .hc-cmp-tbl__head {
padding: 18px 20px 16px;
  vertical-align: top;
  text-align: center;
  border-right: 1px solid var(--hc-cmp-bd);
  position: relative;
  min-width: 220px;
}
.page-compare .hc-cmp-tbl__head:last-child { border-right: 0; }
.page-compare .hc-cmp-tbl__lbl {
width: 180px;
  padding: var(--hc-cmp-cell-pad);
  vertical-align: middle;
  background: #fcf9f3;
  border-right: 1px solid var(--hc-cmp-bd);
  font-size: 11px;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: rgba(26, 23, 20, 0.55);
  font-family: "JetBrains Mono", monospace;
  font-weight: 500;
}
@media (max-width: 1024px) {
  .page-compare .hc-cmp-tbl__lbl {width: 120px}
}
.page-compare .hc-cmp-tbl__price {
font-family: var(--hc-serif, "Playfair Display", Georgia, serif);
  font-size: 20px; font-weight: 500;
  color: var(--hc-ink, #1a1714);
  letter-spacing: -0.005em;
}
.page-compare .hc-cmp-tbl__prod-eyebrow {
font-size: 10px; letter-spacing: 0.10em;
  text-transform: uppercase; font-weight: 500;
  color: var(--hc-accent, #8b7355);
  font-family: "JetBrains Mono", monospace;
  margin-bottom: 4px;
  display: block;
}
.page-compare .hc-cmp-tbl__prod-name {
font-size: 14px; font-weight: 500; line-height: 1.3;
  color: var(--hc-ink, #1a1714);
  margin: 0 0 4px;
  min-height: 36px;
}
.page-compare .hc-cmp-tbl__prod-sku {
display: block;
  font-size: 11px;
  font-family: "JetBrains Mono", monospace;
  color: rgba(26, 23, 20, 0.55);
  margin-bottom: 8px;
}
.page-compare .hc-cmp-tbl__prod-thumb {
width: 96px; height: 96px;
  margin: 0 auto 12px;
  display: block;
  border-radius: 12px;
  background: linear-gradient(135deg, #fcf9f3, #f5efe3);
  border: 1px solid var(--hc-cmp-bd);
  object-fit: cover;
}
.page-compare .hc-cmp-tbl__prod-thumb {
display: grid; place-items: center;
  color: rgba(180, 151, 115, 0.55);
}
.page-compare .hc-cmp-tbl__prod { display: block; text-decoration: none; color: inherit; }
.page-compare .hc-cmp-tbl__prod img {
width: 96px; height: 96px;
  margin: 0 auto 12px;
  display: block;
  border-radius: 12px;
  background: linear-gradient(135deg, #fcf9f3, #f5efe3);
  border: 1px solid var(--hc-cmp-bd);
  object-fit: cover;
}
.page-compare .hc-cmp-tbl__rm {
width: 28px; height: 28px;
  border: 1px solid var(--hc-cmp-bd);
  border-radius: 50%;
  background: var(--hc-paper, #ffffff);
  cursor: pointer;
  color: rgba(26, 23, 20, 0.45);
  display: grid; place-items: center;
  transition: border-color .12s, color .12s;
}
.page-compare .hc-cmp-tbl__rm:hover { border-color: #c0392b; color: #c0392b; }
.page-compare .hc-cmp-tbl__val--best {
background: rgba(76, 162, 100, 0.06);
  color: var(--hc-ink, #1a1714);
  font-weight: 500;
  position: relative;
}
.page-compare .hc-cmp-tbl__val--best::before {
content: "✓";
  position: absolute;
  left: 8px; top: 50%; transform: translateY(-50%);
  color: #4ca264;
  font-size: 12px;
  font-weight: 600;
}
.page-compare .hc-cmp-tbl__val {
padding: var(--hc-cmp-cell-pad);
  vertical-align: middle;
  text-align: center;
  border-right: 1px solid var(--hc-cmp-bd);
  font-size: 14px;
  color: var(--hc-ink, #1a1714);
  position: relative;
}
.page-compare .hc-cmp-tbl__val:last-child { border-right: 0; }
.page-compare .hc-cmp-tbl__val.is-same {
color: rgba(26, 23, 20, 0.55);
  background: rgba(180, 151, 115, 0.04);
}
.page-compare .hc-cmp-tbl-wrap {
background: var(--hc-paper, #ffffff);
  border: 1px solid var(--hc-cmp-bd);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(26,23,20,0.04), 0 12px 32px -16px rgba(26,23,20,0.10);
}

.page-compare .bc {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--hc-ink-mid, rgba(26, 23, 20, 0.5));
  margin-bottom: 20px;
}

.page-compare .t-title {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: clamp(32px, 4vw, 48px);
  font-weight: 400;
  line-height: 1.05;
  margin: 0 0 12px;
}

.page-compare .hc-chip--toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  background: var(--hc-paper, #ffffff);
  border: 1px solid var(--hc-cmp-bd-strong);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 500;
  color: var(--hc-ink, #1a1714);
  cursor: pointer;
  transition: border-color .12s, background .12s;
}

.page-compare .hc-chip--toggle:hover {
  border-color: var(--hc-accent, #8b7355);
  background: #fcf9f3;
}

.page-compare .hc-chip--toggle input {
  accent-color: var(--hc-ink, #1a1714);
  cursor: pointer;
}









/* ─── Table ──────────────────────────────────────────────────── */





/* Header row with product cards */
















/* Best-in-row badge */


/* Body rows */













/* Highlighted "best" cell (e.g. lowest price, highest stock) */



/* Footer with CTAs */






/* Bottom action band */










/* ==========================================================
   v7.61.20 · Premium polish
   ========================================================== */

/* Alternate row backgrounds */
.hc-compare-table tbody tr:nth-child(even) {
background:rgba(212,184,150,0.04);
}

/* Diff toggle smooth row transitions */
.hc-compare-table.is-diff-only tr[data-same="true"] {
display:none;
}
.hc-compare-table tr {
transition:opacity 0.22s ease;
}

/* Sticky header for long tables */
.hc-compare-table thead th {
position:sticky;
  top:0;
  background:var(--hc-paper, #ffffff);
  z-index:2;
  box-shadow:0 1px 0 rgba(180,151,115,0.18);
}

/* Border-radius on first/last cells */
.hc-compare-table td:first-child {
border-top-left-radius:6px; border-bottom-left-radius:6px;
}
.hc-compare-table td:last-child {
border-top-right-radius:6px; border-bottom-right-radius:6px;
}

/* Best-cell pulse on initial reveal */
.hc-compare-cell--best {
animation:hcCompareBestReveal 0.62s ease-out;
}
@keyframes hcCompareBestReveal{
  0%   { background:rgba(212,184,150,0.32); }
  100% { background:linear-gradient(165deg,rgba(212,184,150,0.16),rgba(212,184,150,0.04)); }
}


/* ---- folded from 079-hc-compare-bar.css ---- */
/* =================== hc-compare-bar.css =================== */
.hc-compare-bar {position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%) translateY(120%); z-index: 45; display: flex; align-items: center; gap: var(--hc-sp-3); padding: var(--hc-sp-3) var(--hc-sp-4); background: var(--hc-ink); color: var(--hc-paper, #ffffff); border-radius: var(--hc-r-pill); box-shadow: var(--hc-sh-4); transition: transform var(--hc-dur-slow) var(--hc-ease-bounce); max-width: 92vw}
.hc-compare-bar.is-visible {transform: translateX(-50%) translateY(0)}
.hc-compare-bar__count {display: inline-flex; align-items: center; justify-content: center; min-width: 24px; height: 24px; background: var(--hc-gold); color: var(--hc-ink); border-radius: 50%; font-family: var(--hc-mono); font-weight: 600; font-size: var(--hc-fs-sm); padding: 0 6px}
.hc-compare-bar__label {font-size: var(--hc-fs-sm)}
.hc-compare-bar__clear {font-size: var(--hc-fs-xs); color: rgba(255,255,255,.5); padding: 0 var(--hc-sp-2)}
.hc-compare-bar__clear:hover {color: var(--hc-paper, #ffffff)}
.hc-compare-bar[hidden] {display: none}
