.comparison-section{padding:78px 0 70px;background:#f1f4f6;border-bottom:1px solid #d9dece}
.comparison-heading{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:31px}
.comparison-heading h2{max-width:660px}
.comparison-heading h2 span{color:#72814d}
.comparison-heading>p{max-width:320px;margin:0;color:#5b6453;font-size:13px;line-height:1.8}
.comparison-heading strong{color:#26311a}
.comparison-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:14px}
.comparison-picker button{display:flex;align-items:center;gap:15px;min-height:76px;padding:10px 16px;border:1px solid #ced5c3;border-radius:4px;background:#ffffff;text-align:left;color:#4f5944}
.comparison-picker button>span:first-child{font-size:10px;font-weight:700;color:#7e8c6b}
.comparison-picker strong{display:block;font-size:13px}
.comparison-picker small{display:block;margin-top:4px;font-size:10px;font-weight:400}
.comparison-picker button[aria-pressed=true]{background:#1b2416;border-color:#1b2416;color:#fff}
.comparison-picker button[aria-pressed=true]>span:first-child{color:var(--lime)}
.comparison-picker button:hover{border-color:#74895c}
.comparison-stage{--split:50%;position:relative;aspect-ratio:1672/941;background:#30352d;border:1px solid #b6c0a7;border-radius:5px;overflow:hidden;isolation:isolate}
.comparison-panel{position:absolute;inset:0;margin:0}
.comparison-panel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;user-select:none}
.comparison-panel .comparison-after{clip-path:inset(0 0 0 var(--split))}
.comparison-chip{position:absolute;top:18px;z-index:2;padding:8px 12px;background:#11190ce8;color:white;font-size:10px;font-weight:700;letter-spacing:.6px;border-radius:3px;pointer-events:none}
.comparison-chip.before{left:18px}.comparison-chip.after{right:18px;background:var(--lime);color:#1d2813}
.comparison-stage[data-position=after] .before,.comparison-stage[data-position=before] .after{visibility:hidden}
.comparison-divider{position:absolute;inset:0 auto 0 var(--split);width:2px;background:white;z-index:2;pointer-events:none;transform:translateX(-50%);box-shadow:0 0 6px #0005}
.comparison-divider span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:52px;height:52px;border:3px solid white;border-radius:50%;background:#1d2814;color:var(--lime);font-size:26px;box-shadow:0 2px 14px #0004}
.comparison-stage[data-position=before] .comparison-divider,.comparison-stage[data-position=after] .comparison-divider{opacity:0}
.comparison-range{position:absolute;inset:0;z-index:3;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;touch-action:pan-y}
.comparison-stage:focus-within{outline:3px solid #667dff;outline-offset:5px}
.comparison-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:15px}
.comparison-controls button{border:1px solid #cbd3bd;border-radius:3px;background:transparent;padding:10px 15px;min-height:42px;color:#48583a;font-size:11px}
.comparison-controls button[aria-pressed=true]{background:#dfe8d0;border-color:#93a77a;color:#233219}
.comparison-controls button:hover{background:#e5ecd9}
.comparison-controls button:nth-child(2){font-size:10px;letter-spacing:.4px}
.comparison-caption{display:flex;justify-content:space-between;gap:24px;margin-top:23px;color:#5d6952;font-size:11px;line-height:1.8}
.comparison-caption p{margin:0;max-width:770px}.comparison-caption strong{color:#28331c}
.comparison-caption a{white-space:nowrap;color:#263c11;text-decoration:underline;text-underline-offset:5px;font-weight:700}
@media(max-width:780px){.comparison-section{padding-block:50px}.comparison-heading{display:block}.comparison-heading>p{max-width:500px;margin-top:20px}.comparison-picker button{padding:11px;gap:8px}.comparison-picker strong{font-size:12px}.comparison-picker small{font-size:9px}.comparison-caption{display:block}.comparison-caption a{display:inline-block;margin-top:15px}}
@media(max-width:480px){.comparison-heading h2{font-size:38px}.comparison-picker{gap:6px}.comparison-picker button{display:block;padding:10px 8px;min-height:86px}.comparison-picker button>span:first-child{display:block;margin-bottom:5px;font-size:8px}.comparison-picker strong{font-size:10px;white-space:nowrap}.comparison-picker small{font-size:8px;line-height:1.5}.comparison-chip{top:9px;padding:5px 7px;font-size:8px;letter-spacing:0}.comparison-chip.before{left:9px}.comparison-chip.after{right:9px}.comparison-divider span{width:38px;height:38px;font-size:20px;border-width:2px}.comparison-controls{gap:6px;padding-top:10px}.comparison-controls button{padding:9px 10px;font-size:10px}.comparison-controls button:nth-child(2){font-size:9px}.comparison-caption{font-size:10px;margin-top:18px}}


.comparison-section{background:#fff;border-color:#e0e8ed;padding-block:80px}
.comparison-heading>p{color:#556f80;font-size:13px}.comparison-heading h2 span{color:#6c8493}.comparison-heading strong,.comparison-caption strong{color:#28495e}
.comparison-stage{border-color:#c4d5df;border-radius:12px;box-shadow:0 22px 50px #28475a0c;max-width:1000px;margin-inline:auto}
.comparison-chip{background:#203744eb;backdrop-filter:blur(14px);border:1px solid #eaf1f440;border-radius:4px;padding:9px 13px;font-size:9px;letter-spacing:1.2px;color:#fff}
.comparison-chip.after{background:#f5fafdf2;color:#233d4c}.comparison-divider{background:#fff}.comparison-divider span{border-color:white;background:#243f50;color:#fff;box-shadow:0 5px 20px #0003}
.comparison-controls{padding-top:19px;max-width:1000px;margin-inline:auto}.comparison-controls button{background:#fff;color:#426176;border-color:#b5cad8;border-radius:5px;font-size:11px;min-height:45px;padding-inline:20px}
.comparison-controls button[aria-pressed=true]{background:#274557;color:#fff;border-color:#274557}.comparison-controls button:hover{background:#eaf2f7;color:#274557;border-color:#7c9db3}.comparison-controls button[aria-pressed=true]:hover{background:#375c73;color:#fff}
.comparison-caption{color:#5a7485;font-size:11px;margin-top:25px}.comparison-caption a{color:#345f78}
@media(max-width:780px){.comparison-section{padding-block:65px}}
@media(max-width:480px){.comparison-stage{border-radius:8px}.comparison-controls button{padding-inline:10px;font-size:10px}.comparison-chip{padding:6px 8px;font-size:7px;letter-spacing:.5px}.comparison-caption{font-size:10px}}
