/* Comparison pages (/pauzie-vs-*): one clear table, a short "which one" and plain answers. */
.cmp-what p { margin: 0 auto; max-width: 40ch; text-align: center; font-size: clamp(19px, 2vw, 22px); line-height: 1.45; color: #3d3d33; }
.cmp { background: #fff; border-radius: 22px; overflow: hidden; }
.cmp-row { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; padding: 14px 18px; border-top: 1px solid #ece9e0; align-items: center; font-size: clamp(16px, 1.7vw, 19px); line-height: 1.3; color: #3d3d33; }
.cmp-row > span:first-child { font-weight: 700; color: var(--i-pine); }
.cmp-row > span:nth-child(2) { color: var(--i-pine); }
.cmp-row b { color: var(--i-green); }
.cmp-head { border-top: 0; background: var(--i-pine); color: #F2F0EA; font-weight: 700; font-size: clamp(17px, 1.8vw, 20px); }
.cmp-head > span:nth-child(2) { color: #c9d98f; }
.cmp-head > span:nth-child(3) { color: #F2F0EA; }
.cmp-src { margin: 10px 4px 0; font-size: 15px; color: #777; }
.cmp-faq { background: #fff; border-radius: 22px; padding: 6px 22px 20px; }
.cmp-faq h3 { margin: 18px 0 0; font-size: clamp(20px, 2.1vw, 24px); font-weight: 600; color: var(--i-pine); }
.cmp-faq p { margin: 6px 0 0; font-size: 18px; line-height: 1.45; color: #3d3d33; }
@media (max-width: 420px) { .cmp-row { padding: 12px 12px; gap: 8px; } }

/* picture first, then a switch that highlights the rows that matter in India; rows open to explain */
.cmp-img { display: block; width: min(100%, 560px); height: auto; aspect-ratio: 4 / 3; object-fit: cover; margin: 0 auto; border-radius: 26px; }
.cmp-tg { display: flex; justify-content: center; margin: 4px 0 16px; }
.cmp-sw { display: inline-flex; align-items: center; gap: 12px; padding: 8px 8px 8px 18px; border: 0; border-radius: 99px; background: #fff; color: var(--i-pine); font: inherit; font-size: 17px; font-weight: 700; cursor: pointer; }
.cmp-sw i { position: relative; width: 52px; height: 30px; border-radius: 99px; background: #d9d5c8; transition: background .2s; }
.cmp-sw i::after { content: ""; position: absolute; left: 3px; top: 3px; width: 24px; height: 24px; border-radius: 50%; background: #fff; transition: transform .2s; }
.cmp-sw[aria-pressed="true"] i { background: var(--i-green); }
.cmp-sw[aria-pressed="true"] i::after { transform: translateX(22px); }
.cmp-row:not(.cmp-head) { cursor: pointer; transition: opacity .25s, background .25s; }
.cmp-ex { grid-column: 1 / -1; display: none; margin: 2px 0 0; font-size: 16px; line-height: 1.45; color: #575849; }
.cmp-row[aria-expanded="true"] .cmp-ex { display: block; }
.cmp.is-focus .cmp-row:not(.cmp-head):not(.cmp-in) { opacity: .3; }
.cmp.is-focus .cmp-in { background: #f1f4e4; }
@media (prefers-reduced-motion: reduce) { .cmp-sw i, .cmp-sw i::after, .cmp-row { transition: none; } }