@layer components{.tg-compare{display: grid;gap: 1rem}.tg-compare + .tg-btn-row{margin-top: clamp(1.75rem, 4vw, 2.5rem)}.tg-compare__warn{margin: 0 0 1rem;padding: 0.6rem 0.9rem;border-left: 4px solid #b32d2e;background: #fcf0f1;color: #1d2327;font-size: var(--text-sm, 0.875rem)}.tg-compare__scroll{overflow-x: auto;border-radius: var(--tg-card-radius, 1rem);border: 1px solid color-mix(in oklab, currentColor 14%, transparent);scrollbar-width: thin;--tg-cmp-paint: var(--tg-body-bg, var(--color-brand-4, #fff))}.tg-page--dark .tg-compare__scroll{--tg-cmp-paint: var(--color-brand-5)}.tg-section--bg-light .tg-compare__scroll{--tg-cmp-paint: var(--color-brand-4)}.tg-section--bg-dark .tg-compare__scroll{--tg-cmp-paint: var(--color-brand-5)}.tg-section--bg-primary .tg-compare__scroll{--tg-cmp-paint: var(--color-brand-1)}.tg-section--bg-secondary .tg-compare__scroll{--tg-cmp-paint: var(--color-brand-2)}.tg-section--bg-accent .tg-compare__scroll{--tg-cmp-paint: var(--color-brand-3)}.tg-section--bg-primary-soft .tg-compare__scroll{--tg-cmp-paint: color-mix(in oklab, var(--color-brand-1) 12%, var(--color-brand-4))}.tg-section--bg-secondary-soft .tg-compare__scroll{--tg-cmp-paint: color-mix(in oklab, var(--color-brand-2) 12%, var(--color-brand-4))}.tg-section--bg-accent-soft .tg-compare__scroll{--tg-cmp-paint: color-mix(in oklab, var(--color-brand-3) 12%, var(--color-brand-4))}.tg-section--bg-custom .tg-compare__scroll{--tg-cmp-paint: var(--tg-sec-bg)}.tg-section--bg-is-dark:not(.tg-section--bg-custom) .tg-compare__scroll{--tg-cmp-paint: var(--color-brand-5)}.tg-section--bg-is-light:not(.tg-section--bg-custom) .tg-compare__scroll{--tg-cmp-paint: var(--color-brand-4)}.tg-compare__scroll:focus-visible{outline: 3px solid currentColor;outline-offset: 3px}.tg-compare__table{width: 100%;min-width: 36rem;border-collapse: separate;border-spacing: 0;font-size: 0.9375rem}.tg-compare--wide .tg-compare__table{min-width: 44rem}.tg-compare__table :is(th, td){padding: 0.8rem 1rem;border-bottom: 1px solid color-mix(in oklab, currentColor 10%, transparent);text-align: center;vertical-align: middle}.tg-compare__table tbody tr:last-child :is(th, td){border-bottom: 0}.tg-compare__table :is(.tg-compare__corner, .tg-compare__feature){position: sticky;left: 0;z-index: 1;width: 34%;min-width: 10rem;text-align: start;background: var(--tg-cmp-paint)}.tg-compare__feature{font-weight: 600}.tg-compare__corner{font-size: var(--text-sm, 0.875rem);font-weight: 800;letter-spacing: 0.06em;text-transform: uppercase}.tg-compare__table thead th{padding-block: 1.1rem;border-bottom: 2px solid color-mix(in oklab, currentColor 18%, transparent)}.tg-compare__col{min-width: 7rem}.tg-compare__name{display: block;font-family: var(--font-primary, inherit);font-size: 1.0625rem;font-weight: 700}.tg-compare__sub{display: block;margin-top: 0.15rem;font-size: 0.8125rem;font-weight: 500}.tg-compare__logo{display: block;width: 2.25rem;height: 2.25rem;margin: 0 auto 0.5rem;object-fit: contain;border-radius: 0.4rem}.tg-compare__col.is-on{background: var(--tg-cmp-bg, #111);color: var(--tg-cmp-fg, #fff)}.tg-compare__cell.is-on{background: color-mix(in oklab, var(--tg-cmp-bg, #111) 9%, transparent)}.tg-compare--stripes tbody tr:nth-child(even) :is(td:not(.is-on)){background: color-mix(in oklab, currentColor 3.5%, transparent)}.tg-compare--stripes tbody tr:nth-child(even) .tg-compare__feature{background: color-mix(in oklab, currentColor 3.5%, var(--tg-cmp-paint))}.tg-compare__group th{padding-top: 1.4rem;font-size: var(--text-sm, 0.875rem);font-weight: 800;letter-spacing: 0.06em;text-align: start;text-transform: uppercase;background: var(--tg-cmp-paint)}.tg-compare__mark{display: inline-block;width: 1.25rem;height: 1.25rem;fill: currentColor;vertical-align: middle}.tg-compare__cell > .tg-compare__mark{display: block;margin-inline: auto}.tg-compare__cell--no .tg-compare__mark{width: 1rem;height: 1rem}.tg-compare__foot{display: flex;flex-wrap: wrap;align-items: center;justify-content: space-between;gap: 0.75rem 2rem;font-size: var(--text-sm, 0.875rem)}.tg-compare__legend{display: flex;flex-wrap: wrap;gap: 0.5rem 1.5rem;margin: 0;padding: 0;list-style: none}.tg-compare__legend li{display: inline-flex;align-items: center;gap: 0.45rem}.tg-compare__legend .tg-compare__mark{width: 1.05rem;height: 1.05rem}.tg-compare__note{margin: 0;max-width: 60ch}}