/* окно ролика «путь товара» — общее для магазина и оптового каталога (22.10.2026, правки 25.10.2026) */
:root{--put-display:'Unbounded',system-ui,sans-serif;--put-text:'Onest',system-ui,sans-serif}
.mg-put{position:fixed;inset:0;z-index:300;pointer-events:none}
.mg-put__fon{position:absolute;inset:0;background:rgba(8,22,16,.55);opacity:0;transition:opacity .22s;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.mg-put[data-rezhim="navod"] .mg-put__fon{display:none}
.mg-put.vidno .mg-put__fon{opacity:1}
.mg-put[data-rezhim="knopka"]{pointer-events:auto}
.mg-put__ramka{position:absolute;left:50%;top:50%;width:min(92vw,560px);transform:translate(-50%,-50%) scale(.94);opacity:0;
  aspect-ratio:4/3;border-radius:22px;overflow:hidden;background:#0c241b;box-shadow:0 30px 80px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.06);
  transition:opacity .2s,transform .28s cubic-bezier(.2,.9,.3,1.2)}
.mg-put[data-rezhim="navod"] .mg-put__ramka{transform:scale(.96);transform-origin:center}
.mg-put.vidno .mg-put__ramka{opacity:1;transform:translate(-50%,-50%) scale(1)}
.mg-put.vidno[data-rezhim="navod"] .mg-put__ramka{transform:scale(1)}
.mg-put video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#0c241b}
.mg-put__ten{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to bottom,rgba(6,18,12,.62) 0%,rgba(6,18,12,0) 26%,rgba(6,18,12,0) 58%,rgba(6,18,12,.78) 100%)}
.mg-put__polosy{position:absolute;left:12px;right:12px;top:10px;display:flex;gap:4px}
.mg-put__polosy i{flex:1;height:3px;border-radius:3px;background:rgba(255,255,255,.28);overflow:hidden}
.mg-put__polosy b{display:block;height:100%;background:#fff;transform:scaleX(0);transform-origin:left}
.mg-put__verh{position:absolute;left:14px;right:52px;top:22px;color:#fff;display:flex;flex-direction:column;gap:2px}
.mg-put__verh b{font:700 17px/1.15 var(--put-display);letter-spacing:-.02em;text-shadow:0 1px 8px rgba(0,0,0,.35)}
.mg-put__verh span{font:500 12px/1.2 var(--put-text);color:rgba(255,255,255,.85);text-shadow:0 1px 6px rgba(0,0,0,.55)}
.mg-put__x{position:absolute;right:10px;top:18px;width:40px;height:40px;border-radius:50%;border:0;background:rgba(0,0,0,.4);color:#fff;
  font-size:24px;line-height:1;cursor:pointer;display:none}
.mg-put[data-rezhim="knopka"] .mg-put__x{display:block}
.mg-put__x:focus-visible,.mg-put__esche:focus-visible{outline:2px solid #ff9b45;outline-offset:2px}
.mg-put__niz{position:absolute;left:16px;right:16px;bottom:14px;color:#fff;display:flex;flex-direction:column;gap:4px}
.mg-put__nomer{font:600 11.5px/1 var(--put-text);letter-spacing:.14em;color:#ff9b45}
.mg-put__tekst{font:700 clamp(17px,4.6vw,22px)/1.18 var(--put-display);letter-spacing:-.02em;text-shadow:0 2px 14px rgba(0,0,0,.4)}
.mg-put__tekst.svezh{animation:mgPutTekst .45s cubic-bezier(.2,.8,.2,1)}
@keyframes mgPutTekst{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
/* стоковые кадры: честная пометка, мелко, под заголовком окна */
.mg-put__verh .mg-put__ill{font:500 10.5px/1.25 var(--put-text);letter-spacing:.02em;color:rgba(255,255,255,.72);margin-top:1px}
.mg-put__zagr{position:absolute;left:50%;top:50%;width:34px;height:34px;margin:-17px 0 0 -17px}
.mg-put__zagr i{display:block;width:100%;height:100%;border-radius:50%;border:3px solid rgba(255,255,255,.25);border-top-color:#ff9b45;animation:mgPutKrug .8s linear infinite}
@keyframes mgPutKrug{to{transform:rotate(360deg)}}
.mg-put__esche{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:11px 18px;border-radius:99px;border:0;background:#ff7417;color:#1d1209;font:700 13px var(--put-text);cursor:pointer}
@media (prefers-reduced-motion: reduce){.mg-put__ramka{transition:none}}
/* подсказка «наведите / удержите»: на всю ширину с полями 16 px (была left:50% — сжималась до половины экрана,
   вырастала в высоту и закрывала кнопки «+1 кг» в магазине) */
.mg-put-podskazka{position:fixed;left:16px;right:16px;bottom:calc(84px + env(safe-area-inset-bottom));z-index:250;margin:0 auto;
  transform:translateY(16px);opacity:0;display:flex;align-items:center;gap:10px;max-width:520px;padding:11px 16px;border-radius:16px;
  background:#0c241b;color:#f5efe3;font:500 14px/1.35 var(--put-text);box-shadow:0 18px 40px rgba(0,0,0,.3);
  transition:opacity .35s,transform .45s cubic-bezier(.2,.9,.3,1.2);cursor:pointer}
.mg-put-podskazka.vidno{opacity:1;transform:translateY(0)}
.mg-put-podskazka i{flex:none;width:28px;height:28px;border-radius:50%;background:#ff7417;display:grid;place-items:center}
.mg-put-podskazka i::before{content:'';border-left:8px solid #1d1209;border-top:5px solid transparent;border-bottom:5px solid transparent;margin-left:3px}