/* „Szereld fel a motorost” főoldali blokk (jaszmotor téma változóival) */
.rl__sub { margin: 4px 0 0; color: var(--jm-muted); }
.rl__grid { display: grid; gap: 18px; }
@media (min-width: 992px) { .rl__grid { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 28px; align-items: start; } }
.rl__stage { position: relative; border-radius: 20px; overflow: hidden; background: var(--jm-surface); }
.rl__stage img { display: block; width: 100%; height: auto; }
.rl__dot {
    position: absolute; width: 34px; height: 34px; margin: -17px 0 0 -17px; padding: 0; border: 0; border-radius: 50%; cursor: pointer;
    background: var(--jm-accent); color: #0a0a0b; font: 800 14px/1 var(--jm-font); box-shadow: 0 0 0 3px rgba(10, 10, 11, .85), 0 6px 16px rgba(0, 0, 0, .45);
    transition: transform .15s var(--jm-ease);
}
.rl__dot span { position: relative; z-index: 1; }
.rl__dot::before { content: ""; position: absolute; inset: -6px; border-radius: 50%; border: 2px solid var(--jm-accent); animation: rl-pulse 2s ease-out infinite; }
.rl__dot:hover, .rl__dot.is-active { transform: scale(1.18); }
.rl__dot.is-active { box-shadow: 0 0 0 3px #fff, 0 6px 16px rgba(0, 0, 0, .45); }
@keyframes rl-pulse { 0% { transform: scale(.8); opacity: .9; } 100% { transform: scale(1.7); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .rl__dot::before { animation: none; opacity: 0; } }

.rl__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.rl__item { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 10px; align-items: center; padding: 8px; border-radius: 14px; border: 1px solid var(--jm-line); background: var(--jm-surface); transition: border-color .2s, background .2s; scroll-margin: 120px; }
.rl__item.is-active { border-color: var(--jm-accent); background: rgba(var(--jm-accent-rgb), .1); }
.rl__num { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: var(--jm-accent); color: #0a0a0b; font-weight: 800; font-size: 13px; }
.rl__link { display: grid; grid-template-columns: 54px minmax(0, 1fr) auto; gap: 10px; align-items: center; color: var(--jm-text); }
.rl__link:hover { color: var(--jm-text); }
.rl__img { width: 54px; height: 54px; border-radius: 10px; background: #fff; overflow: hidden; }
.rl__img img { width: 100%; height: 100%; object-fit: contain; padding: 3px; }
.rl__name { font-size: 14px; font-weight: 600; line-height: 1.3; display: flex; flex-direction: column; min-width: 0; }
.rl__name small { color: var(--jm-muted); font-weight: 500; font-size: 12px; }
.rl__price { font-family: var(--jm-font-display); font-weight: 400; font-size: 20px; white-space: nowrap; }
.rl__foot { margin-top: 14px; display: grid; gap: 10px; }
.rl__total { margin: 0; display: flex; justify-content: space-between; align-items: baseline; font-size: 15px; color: var(--jm-muted); }
.rl__total b { font-family: var(--jm-font-display); font-weight: 400; font-size: 28px; color: var(--jm-text); }
.rl__all { width: 100%; min-height: 52px; }
.rl__all svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; }
.rl__msg { margin: 0; font-size: 14px; color: var(--jm-text-soft); }
@media (max-width: 575px) {
    .rl__dot { width: 26px; height: 26px; margin: -13px 0 0 -13px; font-size: 12px; box-shadow: 0 0 0 2px rgba(10, 10, 11, .85), 0 4px 10px rgba(0, 0, 0, .45); }
    .rl__dot::before { inset: -4px; }
}