/* Comparison page only.
   Split from the former site.css; rules keep their original order. Page types and files: Base.astro. */
.cmp-vs { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; max-width: 1180px; margin: 64px auto 0; padding: 0 var(--gutter); text-align: left; }
.cmp-card { position: relative; overflow: hidden; padding: 44px 44px 40px; border-radius: 28px; opacity: 0; transition: opacity .9s var(--ease-out), translate 1.2s var(--ease-out); }
.cmp-card--ours { background: var(--surface-ink-card); color: #fff; translate: -30px 0; }
.cmp-card--theirs { background: #fff; border: 1px solid var(--line-100); box-shadow: var(--shadow-soft); translate: 30px 0; transition-delay: .15s; }
.cmp-vs.is-in .cmp-card { opacity: 1; translate: 0 0; }
.cmp-card__mark { width: 48px; height: 48px; border-radius: 12px; display: flex; align-items: center; justify-content: center; }
.cmp-card__mark--generic { background: var(--surface-1); color: var(--ink-400); }
.cmp-card__title { margin-top: 28px; font-size: 32px; line-height: 1.12; font-weight: 400; letter-spacing: -0.03em; }
.cmp-card__text { margin-top: 12px; max-width: 440px; font-size: 16px; line-height: 1.5; color: var(--ink-500); }
.cmp-card--ours .cmp-card__text { color: var(--ink-300); }
.cmp-card__list { margin-top: 30px; display: flex; flex-direction: column; gap: 14px; font-size: 16px; }
.cmp-card__list li { display: flex; align-items: center; gap: 12px; opacity: 0; translate: 0 8px; transition: opacity .5s var(--ease-out), translate .6s var(--ease-out); transition-delay: calc(.6s + var(--k) * .09s); }
.cmp-card--theirs .cmp-card__list li { color: var(--ink-450); transition-delay: calc(.75s + var(--k) * .09s); }
.cmp-vs.is-in .cmp-card__list li { opacity: 1; translate: 0 0; }
.cmp-no { background: var(--surface-1); color: var(--ink-350); }
.cmp-vs__badge { position: absolute; left: 50%; top: 50%; z-index: 2; width: 68px; height: 68px; margin: -34px 0 0 -34px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 17px; font-weight: 500; letter-spacing: .02em; color: var(--ink-900); background: rgba(255, 255, 255, .62); border: 1px solid rgba(255, 255, 255, .8); -webkit-backdrop-filter: blur(16px) saturate(1.6); backdrop-filter: blur(16px) saturate(1.6); box-shadow: var(--shadow-float); opacity: 0; scale: .6; transition: opacity .6s var(--ease-out) .5s, scale .8s var(--ease-out) .5s; }
.cmp-vs.is-in .cmp-vs__badge { opacity: 1; scale: 1; }
.reduce-motion .cmp-card, .reduce-motion .cmp-card__list li, .reduce-motion .cmp-vs__badge { opacity: 1; translate: none; scale: none; transition: none; }
.rv-head { max-width: 760px; }
.rv-head .t-body-lg { margin-top: 18px; }
.rv-note { max-width: 760px; margin-top: 24px; font-size: 13px; line-height: 1.5; color: var(--ink-500); }
.rvx-scroll { margin-top: 36px; padding: 10px; overflow-x: auto; border-radius: 30px; background: #fff; border: 1px solid var(--line-100); box-shadow: var(--shadow-soft); }
.rvx-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1.6fr) repeat(4, minmax(0, 1fr)); min-width: 760px; }
.rvx-hl { grid-column: 2; z-index: 0; border-radius: 24px; background: var(--surface-ink-card); box-shadow: 0 22px 44px -22px rgba(16, 16, 42, .6); }
.rvx-row--head img { margin-bottom: 4px; border-radius: 9px; box-shadow: 0 0 0 1px rgba(255, 255, 255, .12); }
.rvx-name { font-size: 18px; font-weight: 400; letter-spacing: -0.02em; color: var(--ink-900); }
.rvx-score { font-size: 12.5px; white-space: nowrap; color: var(--ink-500); }
.rvx-yes { display: inline-flex; color: var(--ink-900); }
.rvx-yes--ours { width: 22px; height: 22px; align-items: center; justify-content: center; border-radius: 50%; background: var(--blue-500); color: #fff; }
.rvx-partial { font-size: 13px; color: var(--ink-500); }
.rvx-no { display: inline-block; width: 12px; height: 1.5px; border-radius: 2px; background: var(--ink-300); }
.rvx-cta { height: 44px; padding: 0 20px; font-size: 14.5px; }
.rvx-row [data-col="edeso"] .rvx-score { color: var(--ink-300); }
@media (max-width: 1100px) {
  .cmp-card { padding: 36px 32px 32px; }
  .cmp-card__title { font-size: 28px; }
}
@media (max-width: 720px) {
  .rvx-grid { grid-template-columns: 168px repeat(4, 104px); min-width: 584px; }
  .rvx-row--group > * { padding-top: 28px; }
  .cmp-hero { padding-bottom: 40px; }
  .cmp-vs { grid-template-columns: minmax(0, 1fr); gap: 16px; margin-top: 40px; padding: 0 16px; }
  .cmp-card { padding: 30px 24px 28px; border-radius: 24px; }
  .cmp-card__title { margin-top: 22px; font-size: 26px; }
  .cmp-card__list { font-size: 15px; gap: 12px; }
  .cmp-vs__badge { width: 54px; height: 54px; margin: -27px 0 0 -27px; font-size: 14px; }
}