.comparison-mode { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:24px; }
.comparison-mode-button { min-height:78px; padding:14px 18px; border:1px solid #dce6fa; border-radius:14px; background:#fff; color:var(--central-ink); text-align:left; font:inherit; font-size:14px; font-weight:900; cursor:pointer; transition:transform .18s ease,background .18s ease,color .18s ease,box-shadow .18s ease; }
.comparison-lead-modal { z-index: 10020; }
.comparison-lead-card { width: min(610px, 100%); }
.comparison-lead-fields { margin-top: 20px; }
.comparison-lead-card .form-actions { margin-top: 18px; }
.comparison-mode-button span { display:block; margin-top:5px; color:var(--central-muted); font-size:11px; font-weight:700; }.comparison-mode-button:hover { transform:translateY(-2px); box-shadow:0 10px 22px rgba(25,52,113,.12); }.comparison-mode-button.is-active { border-color:transparent; background:linear-gradient(135deg,#2649be,#5b7ce2); color:#fff; box-shadow:0 12px 25px rgba(38,73,190,.2); }.comparison-mode-button.is-active span { color:rgba(255,255,255,.82); }.technical-source-note { margin:12px 0 -4px; padding:11px 13px; border:1px solid #f2dca6; border-radius:12px; background:#fff9e8; color:#785516; font-size:12px; line-height:1.45; }
.comparator-selectors { position: relative; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 30px; margin-top: 24px; }
.vehicle-selector { min-width:0; padding:23px; border:1px solid rgba(117,139,193,.18); border-radius:19px; background:rgba(255,255,255,.92); box-shadow:0 15px 33px rgba(25,52,113,.08); }
.vehicle-selector .field-grid { min-width:0; grid-template-columns:minmax(0,1fr)!important; }.vehicle-selector .field { min-width:0; grid-column:1/-1!important; }.vehicle-selector .field select { width:100%; min-width:0; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.selector-title { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 18px; }
.selector-title span { color: var(--central-blue); font-size: 16px; font-weight: 950; }
.selector-title strong { color: var(--central-muted); font-size: 11px; }
.versus { position: absolute; z-index: 2; left: 50%; top: 50%; width: 42px; height: 42px; display: grid; place-items: center; transform: translate(-50%,-50%); border: 4px solid #f0f5ff; border-radius: 50%; background: var(--central-blue); color: #fff; font-size: 11px; font-weight: 950; box-shadow: 0 10px 20px rgba(23,72,189,.23); }
.comparator-banner { align-items: center; }.comparator-banner-mark { width: 150px; color:#fff; font-size: 34px; font-weight: 950; letter-spacing:.05em; text-align:center; }.comparator-banner-mark span { display:inline-grid; place-items:center; width:38px; height:38px; margin:0 5px; border-radius:50%; background:rgba(255,255,255,.18); font-size:20px; vertical-align:middle; }
.comparator-actions { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 18px; }.comparator-actions p { min-height:18px; margin:0; color:#b52442; font-size:12px; font-weight:800; }.comparator-actions p.loading { color:var(--central-blue); }
.comparison-result { margin-top: 24px; overflow: hidden; border: 1px solid rgba(117,139,193,.18); border-radius: 20px; background: rgba(255,255,255,.94); box-shadow: 0 15px 33px rgba(25,52,113,.08); }
.comparison-head { display:grid; grid-template-columns:minmax(0,1fr) 170px minmax(0,1fr); gap:16px; padding:24px 24px 18px; border-bottom:1px solid #e2eaf7; }.comparison-vehicle h2 { margin:0 0 8px; font-size:18px; line-height:1.25; }.comparison-vehicle p { margin:0; color:var(--central-muted); font-size:12px; line-height:1.45; }.comparison-center { display:grid; place-items:center; color:var(--central-muted); font-size:11px; font-weight:900; text-align:center; }.comparison-center strong { color:var(--central-blue); font-size:13px; }
.comparison-table { display:grid; }.comparison-row { display:grid; grid-template-columns:minmax(0,1fr) 170px minmax(0,1fr); gap:16px; align-items:center; padding:15px 24px; border-bottom:1px solid #edf1f8; }.comparison-row:last-child { border-bottom:0; }.comparison-row > strong { grid-column:2; grid-row:1; color:var(--central-muted); font-size:11px; text-align:center; }.comparison-row > span { color:var(--central-ink); font-size:13px; font-weight:850; }.comparison-row > span:last-child { text-align:right; }.comparison-row .winner { color:#0e8a57; }.comparison-price { color:var(--central-blue)!important; font-size:22px!important; font-weight:950!important; }
.comparison-history { display:grid; grid-template-columns:1fr 1fr; gap:16px; padding:18px 24px 24px; background:#f8fbff; }.comparison-history article { padding:17px; border-radius:15px; background:linear-gradient(145deg,#fff,#f9fbff); border:1px solid #e2eaf7; box-shadow:0 8px 18px rgba(39,72,154,.05); }.comparison-history strong { display:block; margin-bottom:7px; font-size:12px; }.comparison-history span { color:var(--central-muted); font-size:11px; }.history-head { display:flex; align-items:center; justify-content:space-between; gap:8px; }.history-head strong { margin:0; }.history-status { padding:4px 8px; border-radius:999px; font-size:10px; }.history-status.up { background:#fff0f1; color:#bb3452; }.history-status.down { background:#e9fbf2; color:#087c52; }.history-status.same { background:#eff3fa; color:#51627c; }.history-chart { display:block; width:100%; height:88px; margin:9px 0 10px; overflow:visible; }.history-chart .history-area { fill:url(#history-fill); }.history-chart .history-line { fill:none; stroke:#4364cd; stroke-width:2.5; vector-effect:non-scaling-stroke; stroke-linecap:round; stroke-linejoin:round; }.history-marker { fill:transparent; stroke:transparent; cursor:help; }.history-values { display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; padding-top:10px; border-top:1px solid #edf1f8; }.history-values span { min-width:0; display:flex; flex-direction:column; gap:2px; }.history-values span:nth-child(2) { align-items:center; text-align:center; }.history-values span:last-child { align-items:flex-end; text-align:right; }.history-values small,.history-values em { color:var(--central-muted); font-size:10px; font-style:normal; }.history-values b { color:var(--central-ink); font-size:12px; white-space:nowrap; }.history-values .history-difference.up b { color:#bb3452; }.history-values .history-difference.down b { color:#087c52; }.comparison-table.technical .comparison-row > span { line-height:1.55; }
.comparison-photos { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; padding:20px 24px 4px; background:#f8fbff; }.comparison-photo { min-height:190px; display:grid; place-items:center; overflow:hidden; border:1px solid #e2eaf7; border-radius:14px; background:linear-gradient(145deg,#eef4ff,#fff); }.comparison-photo img { width:100%; height:220px; object-fit:contain; }.comparison-photo strong { color:var(--central-muted); font-size:12px; }.technical-label { display:block; margin:2px 24px 0; padding:12px 0 7px; color:var(--central-blue); font-size:12px; font-weight:950; text-transform:uppercase; letter-spacing:.08em; }.comparison-table.technical .comparison-row { min-height:52px; }.comparison-row .not-informed { color:#8290aa; font-weight:700; }
.comparator-note { margin:16px 0 0; color:var(--central-muted); font-size:11px; line-height:1.5; }
@media(max-width:760px) { .comparison-mode { grid-template-columns:1fr; }.comparator-selectors { grid-template-columns:1fr; gap:16px; }.versus { top:50%; }.comparator-banner-mark { width:auto; font-size:26px; }.comparison-head,.comparison-row { grid-template-columns:minmax(0,1fr) 90px minmax(0,1fr); gap:8px; padding-left:14px; padding-right:14px; }.comparison-row > span { font-size:11px; }.comparison-row .comparison-price { font-size:15px!important; }.comparison-history,.comparison-photos { grid-template-columns:1fr; padding:14px; }.comparison-vehicle h2 { font-size:14px; }.comparison-center { font-size:9px; }.comparator-actions { align-items:flex-start; flex-direction:column; }.technical-label { margin-left:14px;margin-right:14px; } }