/* ============================================================
   ЕДС · «Управляем на каждом этапе» — залипающий сплит-экран
   Left rolls (резкая прокрутка), right — кроссфейд. Десктоп.
   ============================================================ */

@media (min-width:1074px){
  .effs-live{position:relative;height:330vh}
  .effs-live .eff-pin{position:sticky;top:0;height:100vh;display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)}

  /* ---------- левая половина: этап, резкая прокрутка ---------- */
  .eff-l{position:relative;background:var(--field-2);overflow:hidden;
    box-shadow:inset -1px 0 0 var(--rule-soft)}
  .eff-l::before,.eff-l::after{content:"";position:absolute;z-index:2;width:14px;height:14px;background:var(--ink)}
  .eff-l::before{left:26px;top:26px}
  .eff-l::after{right:26px;bottom:26px}
  .eff-roll{height:100%;display:grid;grid-auto-rows:100%;
    transform:translateY(calc(var(--i,0) * -100%));
    transition:transform .52s cubic-bezier(.4,0,.2,1)}
  .es{display:grid;place-items:center;padding:80px 72px;text-align:center}
  .es b{display:block;font-family:var(--disp);font-weight:700;text-transform:uppercase;
    font-size:40px;line-height:1.04;color:var(--ink);text-wrap:balance;max-width:460px}
  .es span{display:block;margin-top:16px;font-size:19px;line-height:1.45;color:var(--ink-mut);
    text-wrap:pretty;max-width:460px}
  .es i{display:block;margin-bottom:22px;font-family:var(--mono);font-style:normal;font-size:12px;
    letter-spacing:.2em;color:var(--ink-mut);font-variant-numeric:tabular-nums}

  /* ---------- правая половина: пункты ---------- */
  .eff-r{position:relative;background:var(--chassis);color:var(--on-chassis);
    display:flex;flex-direction:column;justify-content:center;padding:80px 88px}
  .eff-r .epw{display:grid}
  .eff-r .ep{grid-area:1 / 1;display:flex;flex-direction:column;opacity:0;
    transform:translateY(12px);pointer-events:none;
    transition:opacity .22s ease,transform .22s ease}
  .eff-r .ep.on{opacity:1;transform:none;pointer-events:auto}
  .eff-r .ep[hidden]{display:flex}
  .ep-n{font-family:var(--mono);font-size:13px;letter-spacing:.2em;color:var(--lamp);
    margin-bottom:26px;font-variant-numeric:tabular-nums}
  .eff-r .ef-s{display:flex;flex-direction:column;gap:22px;order:1}
  .eff-r .ef-s p{font-size:16px;line-height:1.55;color:rgba(237,240,234,.72);text-wrap:pretty}
  .eff-r .ef-n{font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:var(--signal);margin-right:12px}
  .eff-r .ef-b{color:var(--on-chassis);font-weight:700}
  .eff-r .ep-div{order:2;border:0;border-top:1px solid var(--rule-c);margin:30px 0 22px;width:100%}
  .eff-r .ep-lead{order:3;font-size:14.5px;line-height:1.55;color:var(--on-mut);text-wrap:pretty}

  .eff-prog{position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--rule-c);z-index:2}
  .eff-prog i{position:absolute;left:0;top:0;width:100%;height:var(--p,0%);background:var(--signal);
    transition:height .18s linear}
  .eff-ghost{position:absolute;right:88px;bottom:52px;font-family:var(--mono);font-size:13px;
    letter-spacing:.2em;color:rgba(237,240,234,.22);font-variant-numeric:tabular-nums}
}

/* ниже 1074px — без залипания: этап и его пункты идут парами обычной прокруткой */
@media (max-width:1073px){
  .effs-live{height:auto}
  .effs-live .eff-pin{display:flex;flex-direction:column;gap:2px;background:var(--rule)}
  .eff-l,.eff-roll,.eff-r,.eff-r .epw{display:contents}
  .eff-roll .es:nth-child(1){order:1}
  .eff-r .ep[data-ep="0"]{order:2}
  .eff-roll .es:nth-child(2){order:3}
  .eff-r .ep[data-ep="1"]{order:4}
  .eff-roll .es:nth-child(3){order:5}
  .eff-r .ep[data-ep="2"]{order:6}
  .es{background:var(--field-2);padding:var(--cell) var(--pad)}
  .es b{display:block;font-family:var(--disp);font-weight:700;text-transform:uppercase;font-size:26px;line-height:1.06}
  .es span{display:block;margin-top:8px;font-size:16px;color:var(--ink-mut)}
  .es i{display:block;margin-bottom:10px;font-family:var(--mono);font-style:normal;font-size:11px;
    letter-spacing:.18em;color:var(--ink-mut)}
  .eff-r .ep{display:block;background:var(--chassis);color:var(--on-chassis);padding:var(--pad)}
  .eff-r .ep-n{display:none}
  .eff-r .ef-s{display:flex;flex-direction:column;gap:16px}
  .eff-r .ef-s p{font-size:15px;line-height:1.55;color:rgba(237,240,234,.72)}
  .eff-r .ef-n{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--signal);margin-right:10px}
  .eff-r .ef-b{color:var(--on-chassis);font-weight:700}
  .eff-r .ep-div{border:0;border-top:1px solid var(--rule-c);margin:20px 0 16px}
  .eff-r .ep-lead{font-size:14.5px;line-height:1.55;color:var(--on-mut)}
  .eff-prog,.eff-ghost{display:none}
}

@media (prefers-reduced-motion:reduce){
  .eff-roll,.eff-r .ep,.eff-prog i{transition:none}
}