/* t-qr.ru — информационные страницы (whyneed.html, safety.html): инфографика без картинок */
.ip{width:321px;margin:0 auto;text-align:left;color:#111;font-family:Arial,sans-serif}
.ip h1{width:auto;display:block;margin:14px 0 8px}
.ip h2{font-size:19px;font-weight:500;margin:34px 0 12px;padding-bottom:6px;border-bottom:1px solid #ededed}
.ip p{font-size:15px;line-height:1.5;margin:0 0 20px;color:#222}
.ip .lead{font-size:16px;color:#333}
.ip .muted{color:#777}
.ip .sm{font-size:13px;line-height:1.45}
.ip a{color:#1a5fb4}
.ip svg.i{width:22px;height:22px;flex:0 0 22px;fill:none;stroke:#111;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

/* кнопка */
.ip .cta{display:block;text-align:center;background:#ececec;color:#000;text-decoration:none;border-radius:12px;padding:14px 10px;font-size:16px;margin:18px 0 6px}
.ip .cta:hover{background:#e2e2e2}
.ip .cta2{display:block;text-align:center;border:1px solid #d6d6d6;color:#000;text-decoration:none;border-radius:12px;padding:12px 10px;font-size:15px;margin:10px 0}
.ip .cta+p,.ip .cta2+p{margin-top:16px}   /* [ui] «↑ Все варианты» и пояснения не прижаты к кнопке */

/* сравнение «вручную / по ссылке» */
.cmp{display:flex;gap:8px;margin:6px 0 4px}
.cmp>div{flex:1;border-radius:14px;padding:12px 10px 10px}
.cmp .bad{background:#f4f4f4}
.cmp .good{background:#f5f5f5}
.cmp b{display:block;font-size:13px;margin-bottom:8px}
.cmp ol{margin:0;padding:0;list-style:none;counter-reset:s}
.cmp li{counter-increment:s;position:relative;padding-left:24px;font-size:12.5px;line-height:1.3;margin:0 0 7px;min-height:18px}
.cmp li:before{content:counter(s);position:absolute;left:0;top:-1px;width:18px;height:18px;border-radius:50%;background:#fff;font-size:11px;line-height:18px;text-align:center;font-weight:700}
.cmp .bad li:before{color:#999}
.cmp .good li:before{background:#fff;color:#000;box-shadow:inset 0 0 0 1.5px #000}
.cmp li.err{color:#b3261e}
.cmp .tot{font-size:12px;border-top:1px dashed #ccc;padding-top:7px;margin-top:4px;color:#555}

/* шаги со стрелками */
.flow{margin:6px 0}
.flow .st{display:flex;gap:12px;align-items:flex-start;background:#f6f6f6;border-radius:14px;padding:12px}
.flow .n{flex:0 0 30px;height:30px;border-radius:50%;background:#ececec;font-weight:700;font-size:15px;line-height:30px;text-align:center}
.flow .st b{display:block;font-size:15px;margin:4px 0 3px}
.flow .st span{font-size:13px;line-height:1.4;color:#444;display:block}
.flow .ar{height:22px;position:relative}
.flow .ar:before{content:"";position:absolute;left:26px;top:2px;bottom:6px;border-left:2px dashed #c9c9c9}
.flow .ar:after{content:"";position:absolute;left:21px;bottom:2px;border:6px solid transparent;border-top-color:#c9c9c9}
.note{display:flex;gap:10px;align-items:flex-start;border-radius:12px;padding:11px 12px;margin:12px 0;font-size:13px;line-height:1.45}
.note.y{background:#f5f5f5}
.note.g{background:#e9f6ec}
.note.r{background:#fdeceb}
.note.b{background:#eaf1fb}

/* плитки */
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:6px 0}
.tile{background:#f6f6f6;border-radius:14px;padding:12px 10px}
.tile svg.i{display:block;margin-bottom:8px;width:26px;height:26px}
.tile b{display:block;font-size:13.5px;line-height:1.25;margin-bottom:4px}
.tile span{display:block;font-size:12px;line-height:1.35;color:#555}
.tile.x{background:#fdeceb}
.tile.x svg.i{stroke:#b3261e}

/* «анатомия» страницы оплаты */
.anat{display:flex;gap:12px;align-items:flex-start;margin:8px 0}
.phone{flex:0 0 150px;border:2px solid #111;border-radius:22px;padding:14px 9px 12px;position:relative;background:#fff}
.phone:before{content:"";position:absolute;top:6px;left:50%;width:36px;height:4px;margin-left:-18px;border-radius:2px;background:#111}
.phone .ph{height:58px;border-radius:9px;background:linear-gradient(135deg,#f4f4f4,#d9d9d9);margin:6px 0 7px}
.phone .ln{height:7px;border-radius:4px;background:#e4e4e4;margin:5px 0}
.phone .t1{font-size:10px;font-weight:700;margin:4px 0 1px}
.phone .t2{font-size:9.5px;color:#555}
.phone .bk{font-size:9px;border-radius:7px;padding:5px 6px;margin:4px 0;background:#f2f2f2}
.phone .pay{font-size:9.5px;text-align:center;border-radius:7px;padding:6px;margin-top:7px;background:#ececec}
.mk{display:inline-block;width:15px;height:15px;border-radius:50%;background:#fff;color:#000;box-shadow:inset 0 0 0 1.5px #000;font-size:9.5px;font-weight:700;line-height:15px;text-align:center;vertical-align:middle;margin-right:3px}
.phone .mk{position:absolute;right:-8px}
.legend{flex:1;margin:0;padding:0;list-style:none}
.legend li{font-size:12.5px;line-height:1.35;margin:0 0 9px;padding-left:20px;position:relative}
.legend li .mk{position:absolute;left:0;top:0}

/* строки-возможности */
.rows .r{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-bottom:1px solid #efefef}
.rows .r:last-child{border-bottom:0}
.rows .r b{display:block;font-size:15px;margin-bottom:3px}
.rows .r span{display:block;font-size:13px;line-height:1.45;color:#444}
.rows code{white-space:nowrap;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;background:#f2f2f2;border-radius:5px;padding:1px 5px}
.mini{display:flex;align-items:center;gap:4px;margin-top:8px;flex-wrap:wrap}
.mini i{font-style:normal;font-size:11px;background:#f2f2f2;border-radius:8px;padding:4px 7px}
.mini em{font-style:normal;color:#aaa;font-size:11px}

/* путь денег */
.money{display:flex;gap:10px;margin:8px 0}
.money .chain{flex:1}
.money .nd{border:1.5px solid #111;border-radius:12px;padding:8px 10px;background:#fff}
.money .nd b{display:block;font-size:13px}
.money .nd span{display:block;font-size:11.5px;line-height:1.35;color:#555;margin-top:2px}
.money .nd.bank{background:#e9f6ec;border-color:#2e7d4f}
.money .dn{height:20px;position:relative}
.money .dn:before{content:"";position:absolute;left:22px;top:0;bottom:5px;border-left:2px solid #2e7d4f}
.money .dn:after{content:"₽";position:absolute;left:30px;top:2px;font-size:11px;font-weight:700;color:#2e7d4f}
.money .side{flex:0 0 112px;display:flex;flex-direction:column}
.money .tq{border:1.5px dashed #999;border-radius:12px;padding:8px;font-size:11.5px;line-height:1.35;color:#444;background:#fafafa}
.money .tq b{display:block;font-size:12.5px;color:#111;margin-bottom:3px}
.money .tq .no{color:#b3261e;display:block;margin-top:5px}
.money .lk{flex:0 0 18px;border-left:2px dashed #bbb;margin-left:20px}

/* данные: где что хранится */
.data .col{border-radius:14px;padding:12px;margin:8px 0}
.data .dev{background:#eaf1fb}
.data .srv{background:#f6f6f6}
.data .col>b{display:flex;gap:8px;align-items:center;font-size:14px;margin-bottom:8px}
.data .it{display:flex;justify-content:space-between;gap:8px;font-size:12.5px;line-height:1.35;padding:6px 0;border-top:1px solid rgba(0,0,0,.07)}
.data .it span:last-child{flex:0 0 auto;font-size:11px;background:#fff;border-radius:8px;padding:2px 7px;align-self:flex-start;color:#333;white-space:nowrap}

/* чек-лист */
.chk{margin:6px 0;padding:0;list-style:none;counter-reset:c}
.chk li{counter-increment:c;position:relative;padding:0 0 12px 40px;font-size:14px;line-height:1.45}
.chk li:before{content:counter(c);position:absolute;left:0;top:0;width:28px;height:28px;border-radius:50%;border:2px solid #111;font-weight:700;font-size:13px;line-height:28px;text-align:center}
.chk li b{display:block;font-size:15px}

/* вопросы */
.faq details{border-bottom:1px solid #efefef;padding:12px 0}
.faq summary{cursor:pointer;font-size:15px;list-style:none;position:relative;padding-right:22px}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";position:absolute;right:2px;top:-2px;font-size:20px;color:#999}
.faq details[open] summary:after{content:"–"}
.faq details p{margin:9px 0 0;font-size:14px}

.rel{margin:26px 0 6px}
.rel a{display:block;color:#555;text-decoration:none;border-bottom:1px solid #efefef;padding:10px 0;font-size:14px}
.rel a:hover{color:#000}
.tips{margin:6px 0;padding:0;list-style:none}
.tips li{position:relative;padding:0 0 12px 34px;font-size:14px;line-height:1.45}
.tips li:before{content:"";position:absolute;left:0;top:1px;width:22px;height:22px;border-radius:50%;background:#e9f6ec url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232e7d4f' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4L18 8'/%3E%3C/svg%3E") center/14px no-repeat}
.tips li b{display:block;font-size:15px}

/* ===== [typo] единая типографика текста: все абзацы одного размера и межстрочного интервала ===== */
.ip{white-space:normal;letter-spacing:0}
.ip p,.ip li,.ip .lead,.ip dd{font-size:15.5px!important;line-height:1.6!important;letter-spacing:0!important;color:#222}
.ip .lead{color:#333}
.ip p.sm,.ip .sm,.ip p.muted.sm{font-size:13.5px!important;line-height:1.55!important}
.ip h1{font-size:22px!important;line-height:1.3!important;font-weight:600!important;letter-spacing:0!important}
.ip h1 b{font-weight:inherit}
.ip h2{font-size:18px;line-height:1.35;letter-spacing:0}
.ip ul,.ip ol{padding-left:20px;margin:0 0 12px}
.ip-doc p{margin:0 0 10px}
.ip-doc h2{margin-top:30px}
.ip-doc{padding-bottom:20px}

/* ===== [desk] версия для компьютера: шире колонка, крупнее текст, меню у правого края ===== */
@media (min-width:1024px){
  body:has(main.ip){width:760px!important;max-width:760px!important}
  body:has(main.ip) .toggler{left:calc(100% - 68px)!important}
  body:has(main.ip) .hamburger{left:calc(100% - 51px)!important}
  .menu{right:calc(50% - 380px)!important}
  .ip{width:auto!important;max-width:760px;margin:0 auto;padding:0 0 30px}
  .ip h1{font-size:24px!important;line-height:1.2!important;margin:22px 0 14px!important}
  .ip h2{font-size:22px;margin:44px 0 14px}
  .ip p,.ip li,.ip .lead,.ip dd{font-size:17px!important;line-height:1.65!important}
  .ip .lead{font-size:17px!important;line-height:1.55!important;color:#333}
  .ip p.sm,.ip .sm{font-size:14.5px!important}
  .tiles{gap:12px}
  .tile{padding:16px 14px}.tile b{font-size:15px}.tile span{font-size:13.5px}
  .cmp{gap:14px}.cmp>div{padding:16px 14px}.cmp b{font-size:15px}.cmp li{font-size:14px;line-height:1.4}
  .flow .st{padding:16px 18px}.flow .st b{font-size:16.5px}.flow .st span{font-size:14.5px}
  .note{font-size:14.5px;padding:14px 16px}
  .rows .r b{font-size:16.5px}.rows .r span{font-size:14.5px}
  .anat{gap:28px}.legend li{font-size:14.5px}
  .ip .cta,.ip .cta2{display:inline-block;min-width:320px;padding:14px 28px;margin:18px 12px 6px 0;vertical-align:top;box-sizing:border-box}   /* [ui] кнопки рядом — с промежутком */
  #pageBottom{width:760px!important;max-width:760px}
}