.m8-compare{display:grid;gap:1px;overflow:auto;border-radius:var(--radius-24);background-color:var(--gray-100);font-family:var(--font-sans);font-size:clamp(.875rem,.787rem + .3756vw,1.125rem);color:var(--gray-600)}
.m8-compare__line{display:grid;gap:1px}
.m8-compare__title{display:grid;place-items:center;padding:1rem;background-color:var(--gray-200);color:var(--gray-700);text-align:center;font-weight:600}
.m8-compare__topic{display:grid;place-items:center;padding:.75rem;background-color:var(--gray-50);outline:1px solid var(--gray-50);text-transform:capitalize;text-align:center}
.m8-compare__cell{display:grid;justify-items:center;align-content:start;gap:clamp(.75rem,.662rem + .3756vw,1rem);padding:clamp(.875rem,.4789rem + 1.6901vw,2rem) .75rem;background-color:var(--white);text-align:center}
.m8-compare__circle{width:clamp(1.375rem,1.1549rem + .939vw,2rem);aspect-ratio:1;border-radius:50%;background:url("../../assets/icons/ui/circle-true.svg") 50%/cover no-repeat}
.m8-compare__circle--false{background-image:url("../../assets/icons/ui/circle-false.svg")}
.m8-compare__circle--muted{background-image:url("../../assets/icons/ui/circle-muted.svg")}
.m8-compare{grid-template-columns:min-content 1fr 1fr}
.m8-compare__line{grid-template-columns:subgrid;grid-column:1/-1}
.m8-compare--wide{grid-template-columns:none;grid-auto-flow:column;grid-template-rows:auto auto auto}
.m8-compare--wide .m8-compare__line{grid-template-columns:none;grid-column:auto;grid-template-rows:subgrid;grid-row:1/-1}
.m8-compare--wide .m8-compare__title{writing-mode:sideways-lr}
@supports not (writing-mode:sideways-lr){.m8-compare--wide .m8-compare__title{writing-mode:vertical-rl;transform:rotate(180deg)}}

.m8-diff-card{overflow:hidden;border:1px solid var(--gray-200);border-radius:var(--radius-16);background-color:var(--white);box-shadow:var(--shadow-lg);font-family:var(--font-sans);color:var(--gray-600)}
.m8-diff-card__header{position:relative;isolation:isolate;display:flex;align-items:flex-end;aspect-ratio:2.79;box-sizing:border-box;padding:clamp(1.125rem,.9049rem + .939vw,1.75rem) clamp(1rem,.912rem + .3756vw,1.25rem)}
.m8-diff-card__image{position:absolute;inset:0;z-index:-1;width:100%;height:100%;object-fit:cover;user-select:none}
.m8-diff-card__heading{color:var(--white);font-weight:600;font-size:var(--font-size-display-xs);line-height:var(--line-height-display-xs)}
.m8-diff-card__body{padding:clamp(1.25rem,.9859rem + 1.1268vw,2rem) clamp(1.25rem,.9859rem + 1.1268vw,2rem) clamp(1.625rem,1.3169rem + 1.3146vw,2.5rem)}
.m8-diff-card__subtitle{margin-bottom:.5rem;color:var(--gray-500);font-weight:600;font-size:var(--font-size-text-lg);line-height:var(--line-height-text-lg)}
.m8-diff-card--primary .m8-diff-card__subtitle{color:var(--blue-500)}
.m8-diff-card__list{margin:0;padding:0;list-style:none}
.m8-diff-card__list li{margin-top:clamp(.75rem,.662rem + .3756vw,1rem);padding-bottom:2px;background-repeat:no-repeat}
.m8-diff-card--secondary .m8-diff-card__list li{padding-left:1.5rem;background-image:url("../../assets/icons/ui/dot.svg");background-size:.75rem;background-position:0 .375rem}
.m8-diff-card--primary .m8-diff-card__list li{padding-left:2.25rem;background-image:url("../../assets/icons/ui/check.svg");background-size:1.5rem;background-position:0 0}
.m8-diff-indicator{position:relative;isolation:isolate;display:grid;place-items:center;width:4rem;aspect-ratio:1;border-radius:50%;background-image:var(--gradient-indicator);user-select:none}
.m8-diff-indicator__shadow{position:absolute;z-index:-1;width:125%;aspect-ratio:1;border-radius:inherit;background-image:inherit;opacity:.5;filter:blur(1.5rem)}
.m8-diff-indicator__arrow{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:1;border-radius:inherit}
.m8-diff-indicator__arrow svg{width:32px;height:32px;animation:1.4s var(--ease-out-expo) infinite m8-indicate}
.m8-diff-indicator--down .m8-diff-indicator__arrow{transform:rotate(90deg)}
