/* /stranovedenie — один гайд из /materials отдельной страницей (база — olimp-v2.css + materials.css, свои классы sv-) */

/* первый экран: обложка по центру, два разворота за ней */
.sv-stack{position:absolute;inset:0}
.sv-stack img{position:absolute;top:50%;height:auto;border-radius:8px;background:#fff;box-shadow:0 18px 40px -16px rgba(0,30,50,.55),0 0 0 1px var(--mt-page-line)}
.sv-stack .pc{left:50%;width:46%;transform:translate(-50%,-50%) rotate(-2deg);z-index:3}
.sv-stack .pl{left:9%;width:36%;transform:translateY(-44%) rotate(-9deg);z-index:1}
.sv-stack .pr{right:9%;width:36%;transform:translateY(-56%) rotate(8deg);z-index:2}

/* что внутри: одна широкая карточка — развороты + оглавление */
.sv-guide{margin-top:22px}
.sv-toc{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:12px}
.sv-toc li{display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;align-items:baseline}
.sv-toc b{font-size:15px;font-weight:800;color:var(--accent);font-variant-numeric:tabular-nums}
.sv-toc p{margin:0;font-size:15px;line-height:1.4;font-weight:600;text-wrap:pretty}

/* форма: на ноутбуке под текстом — три страницы гайда */
.sv-row{display:none}
.sv-form-slot{display:grid;place-items:center;min-height:300px;border:2px dashed var(--card-line);border-radius:24px;color:var(--muted);font-size:15px;font-weight:600}
.sv-form-slot p{margin:0}

@media (min-width:640px){
  .sv-toc{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px 28px}
}

@media (min-width:1000px){
  .sv-stack .pc{width:44%}
  .sv-stack .pl,.sv-stack .pr{width:34%}

  .sv-guide{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:44px;align-items:center;margin-top:36px;padding:22px 40px 22px 22px}
  .sv-guide .mt-pages{margin:0}
  .sv-toc{grid-template-columns:minmax(0,1fr);gap:16px;margin:0}
  .sv-toc li{grid-template-columns:42px minmax(0,1fr)}
  .sv-toc b{font-size:17px}
  .sv-toc p{font-size:17px}

  .sv-row{display:flex;gap:16px;margin-top:40px;max-width:480px}
  .sv-row img{flex:1;min-width:0;height:auto;border-radius:8px;background:#fff;box-shadow:0 18px 36px -18px rgba(0,30,50,.55),0 0 0 1px var(--mt-page-line)}
  .sv-row img:nth-child(1){transform:rotate(-4deg)}
  .sv-row img:nth-child(2){transform:translateY(-10px)}
  .sv-row img:nth-child(3){transform:rotate(4deg)}
  .sv-form-slot{min-height:420px}
}