/* Supplier index.html comparison carousel, scoped and recoloured with AOG tokens. */
.aog-rc { width:100%; min-width:0; color:var(--ink); font-family:var(--face); font-size:14px; line-height:1.45; text-align:left; color-scheme:light; }
.aog-rc, .aog-rc * { box-sizing:border-box; }
.aog-rc h3, .aog-rc p, .aog-rc figure, .aog-rc dl, .aog-rc dd { margin:0; }
.aog-rc button { font:inherit; color:inherit; cursor:pointer; }
.aog-rc a { color:var(--green-text); text-decoration:underline; text-underline-offset:3px; }
.aog-rc :is(button,a,summary):focus-visible { outline:2px solid var(--green-text); outline-offset:2px; }
.aog-rc .cf { --sw:min(17.5rem,74vw); min-width:0; display:flex; flex-direction:column; align-items:center; gap:.5rem; }
.aog-rc .cf-track { position:relative; align-self:stretch; display:flex; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; perspective:1100px; padding-block:.9rem 2.2rem; scrollbar-width:none; cursor:grab; -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 10%,#000 90%,transparent 100%); mask-image:linear-gradient(90deg,transparent 0,#000 10%,#000 90%,transparent 100%); }
.aog-rc .cf-track::-webkit-scrollbar { display:none; }
.aog-rc .cf-track::before, .aog-rc .cf-track::after { content:''; flex:0 0 calc(50% - var(--sw) / 2); }
.aog-rc .cf-track.drag { scroll-snap-type:none; cursor:grabbing; user-select:none; }
.aog-rc .cf-track:focus-visible { outline:2px solid var(--green-text); outline-offset:2px; border-radius:20px; }
.aog-rc .cf-item { flex:0 0 var(--sw); scroll-snap-align:center; transform-style:preserve-3d; min-width:0; }
.aog-rc .compare { background:var(--paper); border:1px solid var(--rule); border-radius:20px; display:flex; flex-direction:column; min-width:0; }
.aog-rc .cf-slide { height:100%; box-shadow:0 1px 2px rgba(16,42,67,.05),0 10px 24px rgba(16,42,67,.1); }
.aog-rc .stage { margin:.75rem .75rem 0; border-radius:13px; background:linear-gradient(180deg,#f8fbfd 0%,#e0f0fb 100%); display:flex; justify-content:center; height:9.5rem; padding:1.1rem 1rem .9rem; gap:2%; align-items:flex-end; }
.aog-rc .stage .car { display:block; width:100%; height:100%; object-fit:contain; object-position:center bottom; }
.aog-rc .fit { padding:1rem 1.1rem 1.15rem; display:flex; flex-direction:column; gap:.6rem; }
.aog-rc .what { display:flex; flex-direction:column; align-items:flex-start; gap:.15rem; }
.aog-rc__route { font-size:1.05rem; font-weight:800; line-height:1.22; letter-spacing:-.01em; text-wrap:initial; min-height:2.56rem; }
.aog-rc__distance { color:var(--quiet); font-size:.8125rem; }
.aog-rc__component { font-size:.8125rem; line-height:1.3; min-height:2.1rem; }
.aog-rc__prices { display:flex; flex-direction:column; gap:.6rem; }
.aog-rc .row { display:flex; align-items:center; justify-content:space-between; gap:.6rem; border-radius:12px; padding:.7rem .9rem .62rem; font-variant-numeric:tabular-nums; }
.aog-rc .row dt { display:flex; flex-direction:column; gap:.1rem; font-weight:600; font-size:.9375rem; line-height:1.2; }
.aog-rc .row dt small { font-weight:400; font-size:.7rem; }
.aog-rc .row dd { font-size:1.65rem; line-height:1; white-space:nowrap; }
.aog-rc .row.them { background:var(--mist); color:var(--quiet); }
.aog-rc .row.them dd { font-weight:400; font-size:.875rem; white-space:normal; max-width:5rem; }
.aog-rc .row.us { background:var(--green); color:var(--on-green); }
.aog-rc .row.us dd { font-weight:800; }
.aog-rc .cf-dots { display:flex; justify-content:center; margin-top:-1.2rem; }
.aog-rc .cf-dots button { appearance:none; border:0; background:none; width:1.75rem; height:2rem; padding:0; display:grid; place-items:center; }
.aog-rc .cf-dots button::after { content:''; width:.4rem; height:.4rem; border-radius:999px; background:#839db0; transition:width .2s,background-color .2s; }
.aog-rc .cf-dots button[aria-current=true]::after { width:.85rem; background:var(--ink); }
.aog-rc .cf-dots button:focus-visible { outline-offset:-2px; border-radius:8px; }
.aog-rc__caveat { text-align:center; color:var(--quiet); font-size:.75rem; }
.aog-rc__sources { width:min(100%,24rem); margin:.25rem auto 0; font-size:.75rem; line-height:1.5; color:var(--quiet); }
.aog-rc__sources summary { padding:.5rem 0; min-height:36px; cursor:pointer; color:var(--green-text); text-align:center; }
.aog-rc__sources p { margin-bottom:.6rem; }
.aog-rc__formula { font-weight:600; color:var(--ink); font-variant-numeric:tabular-nums; }
.aog-rc__endpoints { display:grid; gap:.3rem; margin-bottom:.6rem!important; }
.aog-rc__endpoints > div { display:grid; grid-template-columns:4.5rem minmax(0,1fr); gap:.5rem; }
.aog-rc__source-links { display:flex; flex-wrap:wrap; gap:.25rem .75rem; }
.aog-rc__source-links a { padding-block:.25rem; }
.aog-rc__status { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.aog-rc__message { padding:24px 22px; color:var(--quiet); }
.aog-rc__retry { margin:0 22px 22px; padding:10px 14px; min-height:44px; border:1px solid var(--rule); border-radius:8px; background:var(--mist); }
@media (prefers-reduced-motion:reduce) { .aog-rc .cf-track { scroll-behavior:auto; } .aog-rc .cf-dots button::after { transition:none; } }
