body:has(.compare-page) > header { background: #171717; }
.compare-page {
    --compare-ink: #1b1a18;
    --compare-muted: #716d66;
    --compare-gold: #a87b31;
    --compare-line: #e8e4dc;
    color: var(--compare-ink);
    background: linear-gradient(180deg, #f7f5ef 0, #fff 460px);
    padding: calc(120px + clamp(1.4rem, 3vw, 2.5rem)) 0 6rem;
}
.compare-page__shell { width: min(1440px, calc(100% - 2rem)); margin-inline: auto; }
.compare-page a { text-decoration: none; }
.compare-page a:focus-visible, .compare-page button:focus-visible, .compare-scroll:focus-visible { outline: 3px solid var(--compare-gold); outline-offset: 3px; }
.compare-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem; margin-bottom: 2rem; color: var(--compare-muted); font-size: .78rem; }
.compare-breadcrumb a { color: inherit; }
.compare-breadcrumb a:hover { color: var(--compare-ink); }
.compare-breadcrumb [aria-current] { color: var(--compare-ink); font-weight: 700; }
.compare-page .compare-hero { position: static; width: auto; height: auto; display: flex; justify-content: space-between; align-items: end; gap: 1.5rem; margin: 0 0 2rem; padding: 0; border: 0; background: transparent; box-shadow: none; }
.compare-hero__eyebrow { display: inline-flex; align-items: center; gap: .5rem; margin-bottom: .6rem; color: var(--compare-gold); font-size: .77rem; font-weight: 700; }
.compare-hero h1 { margin: 0 0 .6rem; color: var(--compare-ink); font-size: clamp(1.8rem, 3vw, 2.9rem); font-weight: 800; line-height: 1.4; }
.compare-hero p { margin: 0; color: var(--compare-muted); line-height: 1.9; }
.compare-hero__count { flex: none; padding: .6rem 1rem; border: 1px solid #e8deca; border-radius: 99px; background: #fffaf0; color: #715322; font-size: .82rem; font-weight: 700; }
.compare-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: .8rem; }
.compare-toolbar p { margin: 0; color: var(--compare-muted); font-size: .78rem; }
.compare-toolbar p i { margin-inline-end: .3rem; }
.compare-toolbar__actions { display: flex; align-items: center; gap: .6rem; }
.compare-toolbar__toggle, .compare-toolbar__clear { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: .5rem .85rem; border: 1px solid var(--compare-line); border-radius: 9px; background: #fff; color: var(--compare-ink); font: inherit; font-size: .78rem; font-weight: 700; white-space: nowrap; cursor: pointer; }
.compare-toolbar__toggle[aria-pressed="true"] { border-color: var(--compare-ink); background: var(--compare-ink); color: #fff; }
.compare-toolbar__clear { color: #8e3932; }
.compare-toolbar__clear:hover { background: #fff2ef; color: #8e3932; }
.compare-scroll { overflow-x: auto; overscroll-behavior-inline: contain; border: 1px solid var(--compare-line); border-radius: 20px; background: #fff; box-shadow: 0 22px 55px rgba(38, 32, 20, .055); scrollbar-color: #c5b99e #f4f1eb; }
.compare-table { width: 100%; min-width: calc(180px + var(--compare-products) * 245px); table-layout: fixed; border-collapse: separate; border-spacing: 0; text-align: right; }
.compare-table__label { position: sticky; right: 0; z-index: 1; width: 180px; min-width: 180px; padding: 1rem 1.2rem; border-inline-end: 1px solid var(--compare-line); border-bottom: 1px solid var(--compare-line); background: #fcfbf8; color: #5f5b55; font-size: .82rem; font-weight: 700; vertical-align: middle; }
.compare-table__label--top { z-index: 3; vertical-align: top; padding-top: 2rem; background: #f5f1e8; }
.compare-table__label--top > * { display: block; }
.compare-table__label-kicker { margin-bottom: .8rem; color: var(--compare-gold); font-size: .7rem; }
.compare-table__label--top strong { color: var(--compare-ink); font-size: 1.1rem; }
.compare-table__label--top small { margin-top: .5rem; color: var(--compare-muted); font-weight: 400; }
.compare-table__product { width: calc((100% - 180px) / var(--compare-products)); padding: 0; border-inline-end: 1px solid var(--compare-line); background: #fff; vertical-align: top; font-weight: inherit; }
.compare-table__product:last-child { border-inline-end: 0; }
.compare-product { position: relative; display: flex; flex-direction: column; min-height: 505px; padding: 1.2rem; text-align: right; }
.compare-product__remove { position: absolute; top: .85rem; left: .85rem; z-index: 2; display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--compare-line); border-radius: 50%; background: #fff; color: #5b5752; }
.compare-product__remove:hover { border-color: #dfb9b3; background: #fff2ef; color: #a84237; }
.compare-product__image { display: block; height: 205px; margin: -.2rem -.2rem .8rem; padding: .8rem; border-radius: 13px; background: linear-gradient(145deg, #faf9f6, #f1f0ec); }
.compare-product__image img { display: block; width: 100%; height: 100%; object-fit: contain; transition: transform .25s ease; }
.compare-product__image:hover img { transform: scale(1.045); }
.compare-product__badges { display: flex; flex-wrap: wrap; min-height: 25px; gap: .3rem; margin-bottom: .5rem; }
.compare-product__badge { padding: .14rem .48rem; border-radius: 6px; background: #f4e9d3; color: #6a4c21; font-size: .67rem; font-weight: 700; }
.compare-product__badge--sale { background: #d62939; color: #fff; }
.compare-product__brand { color: #8c816b; font-size: .7rem; }
.compare-product__name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; min-height: 3.2em; margin: .35rem 0 .6rem; color: var(--compare-ink); font-size: .88rem; font-weight: 700; line-height: 1.6; }
.compare-product__name:hover { color: var(--compare-gold); }
.compare-product__price { display: flex; flex-direction: column; gap: .15rem; margin-top: auto; }
.compare-product__price del { color: #9a948a; font-size: .72rem; }
.compare-product__price strong { color: var(--compare-ink); font-size: 1.13rem; font-weight: 800; white-space: nowrap; }
.compare-product__price small { font-size: .72rem; font-weight: 400; }
.compare-product__stock { display: inline-flex; align-items: center; gap: .4rem; margin: .55rem 0 .85rem; color: #aa5448; font-size: .75rem; font-weight: 700; }
.compare-product__stock span { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.compare-product__stock.is-available { color: #35734a; }
.compare-button { display: inline-flex; align-items: center; justify-content: center; gap: .6rem; min-height: 43px; padding: .55rem 1rem; border-radius: 10px; font-size: .79rem; font-weight: 700; transition: background-color .2s ease, color .2s ease; }
.compare-button--primary { background: var(--compare-ink); color: #fff; }
.compare-button--primary:hover { background: var(--compare-gold); color: #fff; }
.compare-table__section th { padding: .7rem 1.2rem; border-bottom: 1px solid var(--compare-line); background: #f3efe6; color: #5d4522; font-size: .81rem; font-weight: 800; }
.compare-table tbody td { padding: 1rem; border-bottom: 1px solid var(--compare-line); border-inline-end: 1px solid var(--compare-line); color: #37332e; font-size: .8rem; line-height: 1.8; vertical-align: middle; overflow-wrap: anywhere; }
.compare-table tbody td:last-child { border-inline-end: 0; }
.compare-table tbody tr:not(.compare-table__section):nth-child(odd) td { background: #fdfcf9; }
.compare-table--differences tr[data-compare-same="true"] { display: none; }
.compare-after { display: flex; justify-content: center; padding: 1.3rem; }
.compare-after a { display: inline-flex; align-items: center; gap: .5rem; color: #705326; font-size: .82rem; font-weight: 700; }
.compare-after a:hover { color: var(--compare-ink); }
.compare-empty { display: flex; flex-direction: column; align-items: center; padding: clamp(3rem, 8vw, 6rem) 1rem; border: 1px solid var(--compare-line); border-radius: 20px; background: #fff; text-align: center; }
.compare-empty__icon { display: grid; place-items: center; width: 76px; height: 76px; margin-bottom: 1.2rem; border-radius: 50%; background: #f6f0e2; color: var(--compare-gold); font-size: 1.8rem; }
.compare-empty h2 { color: var(--compare-ink); font-size: clamp(1.15rem, 2vw, 1.5rem); font-weight: 800; }
.compare-empty p { margin: .4rem 0 1.5rem; color: var(--compare-muted); }
@media (max-width: 700px) {
    .compare-page { padding-top: calc(86px + 1.4rem); padding-bottom: 8rem; }
    .compare-page__shell { width: calc(100% - 1.2rem); }
    .compare-breadcrumb { margin-bottom: 1.2rem; }
    .compare-page .compare-hero { display: block; margin-bottom: 1.3rem; }
    .compare-hero__count { display: inline-block; margin-top: .9rem; }
    .compare-toolbar { align-items: start; flex-direction: column; }
    .compare-scroll { border-radius: 13px; }
    .compare-table { min-width: calc(112px + var(--compare-products) * 205px); }
    .compare-table__label { width: 112px; min-width: 112px; padding: .75rem .55rem; font-size: .72rem; }
    .compare-table__label--top { padding-top: 1.4rem; }
    .compare-table__label--top strong { font-size: .85rem; }
    .compare-table__product { width: calc((100% - 112px) / var(--compare-products)); }
    .compare-product { min-height: 455px; padding: .65rem; }
    .compare-product__image { height: 175px; margin: 0 0 .65rem; }
    .compare-product__price strong { font-size: .94rem; }
    .compare-table tbody td { padding: .75rem .65rem; font-size: .73rem; }
}
@media (prefers-reduced-motion: reduce) { .compare-page *, .compare-page *::before, .compare-page *::after { transition: none !important; } }
