/* Restomod conveyor (method) and WAYMORR before/after: light theme 30.09.2026.
   Built from prototype-restomod; all classes/ids are prefixed rm-. */
.rm-conveyor,.rm-ba{--accent:var(--ink);--accent-2:#121413;--accent-ink:#ffffff;--accent-dim:#c9ccc5;--hi:#121413;--hi-light:#c5fa67;--rust:#e0714f;--rust-dim:#fbe9e3}
/* ---------- A: conveyor ---------- */
.rm-conveyor{position:relative;height:520vh;border-top:1px solid var(--line)}
.rm-stage{position:sticky;top:0;height:100vh;height:100svh;display:flex;flex-direction:column;overflow:hidden}
.rm-stage-top{width:100%;position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:48px;padding-top:40px;min-height:250px}
.rm-copy{position:relative;min-height:250px}
.rm-copy-item{position:absolute;inset:0 auto auto 0;width:100%;opacity:0;transform:translateY(14px);transition:opacity .45s,transform .45s;pointer-events:none;max-width:640px}
.rm-copy-item.on{opacity:1;transform:none;pointer-events:auto}
.rm-copy-item .eyebrow{color:var(--accent-2);margin-bottom:14px}
.rm-copy-item h2{margin-bottom:14px;font-size:clamp(34px,3.4vw,48px)}
.rm-copy-item p{color:var(--ink-2);max-width:520px;margin-bottom:12px}
.rm-out{border-left:2px solid var(--accent-2);padding-left:16px;font-size:14px}
.rm-out span{display:block;font-size:11px;letter-spacing:1px;color:var(--muted);text-transform:uppercase}
.rm-side{min-width:0;display:flex;flex-direction:column;gap:18px;align-items:flex-end;padding-top:6px}
.rm-meter{width:100%;max-width:360px}
.rm-meter-head{display:flex;justify-content:space-between;font-size:12px;letter-spacing:.5px;color:var(--muted);margin-bottom:8px}
.rm-meter-head strong{color:var(--white);font-size:22px;font-weight:500;letter-spacing:-.5px}
.rm-meter-bar{height:6px;background:var(--line);position:relative;overflow:hidden}
.rm-meter-fill{position:absolute;inset:0 auto 0 0;width:30%;background:linear-gradient(90deg,var(--rust),#d9c35b 55%,var(--accent))}
.rm-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;width:100%;max-width:360px}
.rm-steps div{font-size:11px;letter-spacing:.3px;color:var(--muted);border-top:2px solid var(--line);padding-top:8px;transition:color .3s,border-color .3s}
.rm-steps div.done{color:var(--ink-2);border-color:var(--accent-dim)}
.rm-steps div.now{color:var(--accent-2);border-color:var(--accent-2)}
.rm-metrics{display:grid;gap:10px;width:100%;max-width:360px;opacity:0;transform:translateY(10px);transition:opacity .5s,transform .5s}
.rm-metrics.on{opacity:1;transform:none}
.rm-metrics div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;border-top:1px solid var(--line);padding-top:8px;font-size:13px;color:var(--muted)}
.rm-metrics strong{color:var(--accent);font-size:20px;font-weight:500;white-space:nowrap}
.rm-scene{flex:1;min-height:0;position:relative}
.rm-scene svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.rm-hint{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);font-size:12px;letter-spacing:1px;color:var(--muted);transition:opacity .4s}

/* svg bits */
.rm-arch-frame{fill:none;stroke:#c9ccc5;stroke-width:3;transition:stroke .4s}
.rm-arch.active .rm-arch-frame{stroke:var(--hi);filter:url(#rm-glow)}
.rm-arch-label{font:700 13px Manrope,Arial;letter-spacing:1.5px;fill:var(--muted);text-anchor:middle;transition:fill .4s}
.rm-arch.active .rm-arch-label{fill:var(--hi)}
.rm-arch-fx{opacity:0;transition:opacity .4s}
.rm-arch.active .rm-arch-fx{opacity:1}
.rm-drop{stroke:#5aa9e6;stroke-width:2;stroke-linecap:round;opacity:.7;animation:rm-drop .7s linear infinite}
@keyframes rm-drop{from{transform:translateY(-10px)}to{transform:translateY(90px);opacity:0}}
.rm-bubble{fill:#d4eafa;stroke:#9fcbeb;stroke-width:1;opacity:.9;animation:rm-bub 1.6s ease-in-out infinite}
@keyframes rm-bub{0%,100%{transform:scale(.8)}50%{transform:scale(1.15)}}
.rm-arm{transform-box:fill-box;transform-origin:50% 0;animation:rm-arm 1.1s ease-in-out infinite alternate}
.rm-arm.r{animation-delay:-.55s}
@keyframes rm-arm{from{transform:rotate(-16deg)}to{transform:rotate(16deg)}}
.rm-spark{fill:#e0a800;animation:rm-spark .5s steps(2) infinite}
@keyframes rm-spark{50%{opacity:0}}
.rm-smoke{fill:#9aa097;animation:rm-smoke 2.2s ease-out infinite}
@keyframes rm-smoke{from{transform:translate(0,0) scale(.4);opacity:.7}to{transform:translate(-60px,-40px) scale(1.6);opacity:0}}
.rm-tag rect{fill:#ffffff;stroke:#c9ccc5;stroke-width:1.2;transition:stroke .3s,fill .3s}
.rm-tag text{font:600 12px Manrope,Arial;fill:#3b3f3a}
.rm-tag .rm-bang{opacity:0;transition:opacity .3s}
.rm-tag.hit rect{stroke:var(--rust);fill:#fbe9e3}
.rm-tag.hit text{fill:#a8422a}
.rm-tag.hit .rm-bang{opacity:1}
.rm-chip rect{fill:#ffffff;stroke:var(--hi);stroke-width:1.2}
.rm-chip text{font:700 11px Manrope,Arial;fill:var(--hi);text-anchor:middle;letter-spacing:.5px}

/* ---------- B: before / after ---------- */
.rm-ba{margin:0 0 84px}
.rm-ba-head{display:grid;grid-template-columns:1.3fr 1fr;gap:48px;align-items:end;margin-bottom:34px}
.rm-ba-head p{color:var(--muted);max-width:460px}
.rm-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.rm-chips button{background:none;border:1px solid var(--line);color:var(--muted);padding:9px 14px;font:600 14px Manrope,Arial;cursor:pointer;transition:all .2s}
.rm-chips button:hover{color:var(--ink);border-color:#9aa097}
.rm-chips button[aria-pressed=true]{background:var(--accent-2);border-color:var(--accent-2);color:var(--accent-ink)}
.rm-compare{position:relative;height:460px;border:1px solid var(--line);overflow:hidden;--pos:50%;user-select:none;touch-action:pan-y}
.rm-layer{position:absolute;inset:0}
.rm-after{background:
  radial-gradient(ellipse at 70% 30%,#eefbd3 0,transparent 60%),
  repeating-linear-gradient(90deg,transparent 0 49px,rgba(18,20,19,.045) 50px),
  repeating-linear-gradient(0deg,#ffffff 0 49px,rgba(18,20,19,.045) 50px);}
.rm-before{clip-path:inset(0 calc(100% - var(--pos)) 0 0);background:
  radial-gradient(ellipse at 30% 60%,#f6d9cf 0,transparent 65%),#fdf3ef;}
.rm-before::after{content:"";position:absolute;inset:0;opacity:.12;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}
.rm-label{position:absolute;top:18px;font-size:12px;font-weight:700;letter-spacing:1.6px;padding:6px 10px;z-index:3}
.rm-before .rm-label{left:18px;background:var(--rust-dim);color:#a8422a}
.rm-after .rm-label{right:18px;background:var(--accent-2);color:var(--accent-ink)}
.rm-mess{position:absolute;inset:0}
.rm-mess svg{position:absolute;inset:0;width:100%;height:100%}
.rm-mess path{fill:none;stroke:#e0714f;stroke-width:1.5;stroke-dasharray:4 5}
.rm-note{position:absolute;padding:8px 12px;background:#ffffff;border:1px dashed #e0714f;color:#a8422a;font-size:14px;font-weight:600;white-space:nowrap;box-shadow:0 8px 24px rgba(18,20,19,.08)}
.rm-note:before{content:"!";display:inline-grid;place-items:center;width:18px;height:18px;margin-right:8px;background:var(--rust);color:#111;font-size:12px;font-weight:800;border-radius:50%}
.rm-flow{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding:64px 56px 40px}
.rm-flow-row{display:flex;align-items:center;gap:10px}
.rm-node{flex:1;min-width:0;background:#ffffff;border:1px solid var(--accent-dim);padding:16px 12px;text-align:center;font-weight:600;font-size:15px}
.rm-node small{display:block;color:var(--muted);font-weight:500;font-size:12px;margin-top:4px}
.rm-arrow{color:var(--accent-2);flex:0 0 auto}
.rm-result{margin-top:34px;display:flex;gap:16px;align-items:baseline;border-top:1px solid var(--line);padding-top:20px}
.rm-result strong{font-size:clamp(22px,2.4vw,34px);font-weight:500;letter-spacing:-1px;color:var(--ink);background:linear-gradient(transparent 60%,var(--lime) 60%)}
.rm-result span{color:var(--ink-2);font-size:14px}
.rm-handle{position:absolute;top:0;bottom:0;left:var(--pos);width:2px;background:var(--ink);transform:translateX(-1px);z-index:4;pointer-events:none}
.rm-handle:after{content:"‹ ›";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:46px;height:46px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-weight:800;font-size:18px;letter-spacing:2px;box-shadow:0 6px 20px rgba(18,20,19,.2)}
.rm-range{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;z-index:5}
.rm-range:focus-visible+.rm-handle:after{outline:2px solid var(--accent);outline-offset:4px}
.rm-ba-foot{display:flex;justify-content:space-between;gap:24px;margin-top:16px;font-size:13px;color:var(--muted)}


@media(max-width:900px){
  .rm-stage-top{grid-template-columns:minmax(0,1fr);gap:14px;padding-top:22px;min-height:0}
  .rm-copy{min-height:250px}
  .rm-copy-item h2{font-size:30px;letter-spacing:-1px;margin-bottom:10px}
  .rm-copy-item p{font-size:14px;margin-bottom:8px}
  .rm-side{align-items:stretch;gap:10px}
  .rm-meter,.rm-steps,.rm-metrics{max-width:none}
  .rm-metrics{display:none}.rm-metrics.on{display:grid}
  .rm-side.is-final .rm-meter,.rm-side.is-final .rm-steps{display:none}
  .rm-note{white-space:normal;max-width:42%;line-height:1.35}
  .rm-metrics div{font-size:12px}.rm-metrics strong{font-size:16px}
  .rm-ba{margin-bottom:52px}
  .rm-ba-head{grid-template-columns:1fr;gap:0}
  .rm-compare{height:560px}
  .rm-note{font-size:12px;padding:6px 9px}
  .rm-flow{padding:60px 18px 22px}
  .rm-flow-row{flex-direction:column;gap:4px}
  .rm-node{width:100%;padding:10px;font-size:14px}
  .rm-arrow{transform:rotate(90deg);line-height:1}
  .rm-result{flex-direction:column;gap:4px;margin-top:18px}
  .rm-ba-foot{flex-direction:column;gap:4px}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

.rm-conveyor .eyebrow{text-transform:uppercase}
html[lang=ka] .rm-copy-item h2,html[lang=zh-Hans] .rm-copy-item h2{letter-spacing:0;line-height:1.22}
html[lang=ka] .rm-copy-item h2{font-size:clamp(28px,2.8vw,40px)}

/* stage 0 is the "How we work" intro */
.rm-intro-item h2{font-size:clamp(44px,4.9vw,78px);line-height:1.02;letter-spacing:-3px;font-weight:500;margin:0 0 18px}
.rm-intro-item .button{width:max-content;max-width:100%;margin-top:8px}
html[lang=ka] .rm-intro-item h2,html[lang=zh-Hans] .rm-intro-item h2{letter-spacing:0;line-height:1.15}
html[lang=ka] .rm-intro-item h2{font-size:clamp(34px,3.6vw,56px)}
@media(max-width:900px){.rm-intro-item h2{font-size:44px;letter-spacing:-1.5px}.rm-intro-item .button{width:100%}html[lang=ka] .rm-intro-item h2{font-size:32px}}
@media(max-width:900px){.rm-meter,.rm-steps{display:none}}

/* performance: animate scene details only while they are on screen; no blur on phones */
.rm-arch-fx *,.rm-bubbles .rm-bubble,.rm-smoke{animation-play-state:paused}
.rm-arch.active .rm-arch-fx *,.rm-bubbles.on .rm-bubble,#rm-smokeG:not(.off) .rm-smoke{animation-play-state:running}
#rm-smokeG.off{display:none}
.rm-lite .rm-arch.active .rm-arch-frame{filter:none}
@media(max-width:900px),(pointer:coarse){.rm-before::after{display:none}}