/* Valor 2026-09-25: страница «Напоминания в Telegram» (telegram.html). Блок-приглашение .v2-tgcta — в v2-pages.css. */
.ptg-main{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:44px;align-items:start;margin:30px 0 10px}
.ptg-pick{padding:28px 30px 24px}
.ptg-step{display:flex;align-items:center;gap:14px;margin:0 0 16px}
.ptg-step+.ptg-topics{margin-bottom:28px}
.ptg-step h2{margin:0;font-size:28px}
.ptg-step__n{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;font:700 20px/1 'Philosopher',serif;color:#ffd24a;
  background:radial-gradient(circle at 40% 35%,#4a3218,#140d07 75%);box-shadow:0 0 0 1px #000,0 0 0 3px #8a6a3a,0 0 0 4px #000,0 0 14px rgba(241,194,45,.25)}

/* темы — плитки-переключатели */
.ptg-topics{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ptg-topic{position:relative;display:flex;align-items:center;gap:14px;padding:14px 46px 14px 14px;text-align:left;cursor:pointer;color:var(--text);
  font:inherit;border:0;background:linear-gradient(180deg,#1b1411,#0f0b09);box-shadow:0 0 0 1px #000,0 0 0 3px #3e3934,0 0 0 4px #000;
  transition:box-shadow .2s,transform .15s,filter .2s,opacity .2s}
.ptg-topic img{flex:none;width:46px;height:46px;border-radius:3px;box-shadow:0 0 0 1px #000,0 0 0 2px #8a8279,0 0 0 3px #000;transition:filter .2s}
.ptg-topic b{display:block;font:700 18px/1.2 'Philosopher',serif;color:#f1dfbd}
.ptg-topic small{display:block;margin-top:3px;font-size:14px;line-height:1.35;color:var(--muted)}
.ptg-topic:hover{transform:translateY(-1px)}
.ptg-topic:focus-visible{outline:2px solid #ffd24a;outline-offset:4px}
.ptg-topic.on{box-shadow:0 0 0 1px #000,0 0 0 3px #b08a45,0 0 0 4px #000,0 0 18px rgba(241,194,45,.18);background:linear-gradient(180deg,#261b12,#130d09)}
.ptg-topic.on b{color:#ffe08a}
.ptg-topic:not(.on){opacity:.62}
.ptg-topic:not(.on) img{filter:grayscale(1) brightness(.75)}
.ptg-check{position:absolute;right:14px;top:50%;width:22px;height:22px;margin-top:-11px;background:#0b0806;box-shadow:0 0 0 1px #000,0 0 0 2px #6f6862}
.ptg-topic.on .ptg-check{background:linear-gradient(#3f6d1c,#1f3c0d);box-shadow:0 0 0 1px #000,0 0 0 2px #8ed14f,0 0 10px rgba(142,209,79,.45)}
.ptg-topic.on .ptg-check::after{content:"";position:absolute;left:7px;top:3px;width:6px;height:11px;border:solid #eaffc8;border-width:0 3px 3px 0;transform:rotate(45deg)}

/* кнопка + QR */
.ptg-go{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.ptg-go__btn{display:flex;flex-direction:column;align-items:flex-start;gap:10px;min-width:0}
.ptg-go__btn .wb{margin:0 20px}
.ptg-go__btn small{padding-left:6px}
.ptg-btn svg,.v2-tgcta .wb svg{width:24px;height:24px;flex:none}
.ptg-btn[aria-disabled="true"]{filter:grayscale(1) brightness(.6);pointer-events:none}
.ptg-qr{margin:0;display:flex;flex-direction:column;align-items:center;gap:8px;width:170px}
.ptg-qr img{display:block;width:132px;height:132px;padding:6px;background:#f4ead8;box-shadow:0 0 0 1px #000,0 0 0 3px #8a6a3a,0 0 0 4px #000,0 8px 20px rgba(0,0,0,.6);image-rendering:pixelated}
.ptg-qr figcaption{font-size:13px;line-height:1.3;color:var(--muted);text-align:center}
.ptg-fine{margin:22px 0 0;font-size:14px}

/* «телефон» с примером чата */
.ptg-demo{position:sticky;top:90px}
.ptg-phone{position:relative;width:100%;max-width:360px;margin:0 auto;border-radius:30px;padding:12px;background:linear-gradient(160deg,#2c2724,#0c0a09 60%);
  box-shadow:0 0 0 1px #000,0 0 0 3px #57514b,0 0 0 4px #000,0 0 0 6px #837c75,0 0 0 7px #000,0 24px 50px rgba(0,0,0,.7)}
.ptg-phone__top{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:20px 20px 0 0;background:#17212b;color:#f5f7fa}
.ptg-phone__top img{border-radius:50%;background:#0e1621;box-shadow:0 0 0 2px #2b5278}
.ptg-phone__top b{display:block;font-size:15px;line-height:1.2}
.ptg-phone__top small{display:block;font-size:12px;color:#7f91a4}
.ptg-chat{display:flex;flex-direction:column;gap:8px;height:520px;overflow:hidden;justify-content:flex-end;padding:12px 10px;
  background:radial-gradient(circle at 20% 10%,rgba(80,120,160,.14),transparent 45%),radial-gradient(circle at 90% 80%,rgba(40,90,140,.16),transparent 40%),#0e1621;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 60px);mask-image:linear-gradient(180deg,transparent 0,#000 60px)}
.ptg-msg{max-width:92%;align-self:flex-start}
.ptg-msg--me{align-self:flex-end}
.ptg-msg__b{position:relative;padding:8px 11px 18px;border-radius:12px 12px 12px 4px;background:#182533;color:#e9eef3;font:13.5px/1.42 -apple-system,'Segoe UI',Roboto,sans-serif;box-shadow:0 1px 1px rgba(0,0,0,.35)}
.ptg-msg--me .ptg-msg__b{border-radius:12px 12px 4px 12px;background:#2b5278;padding-right:44px}
.ptg-msg__b b{color:#fff}
.ptg-msg__b time{position:absolute;right:9px;bottom:4px;font-size:11px;color:#7f91a4}
.ptg-msg--me .ptg-msg__b time{color:#9fc0e0}
.ptg-me{color:#8cc8ff}
.ptg-kb{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-top:4px}
.ptg-kb span{padding:6px 8px;border-radius:8px;background:rgba(24,37,51,.9);color:#e9eef3;font:12.5px/1.25 -apple-system,'Segoe UI',Roboto,sans-serif;text-align:center}
.ptg-kb__w{grid-column:1/-1}
.ptg-phone__bar{display:flex;gap:6px;padding:10px 12px;border-radius:0 0 20px 20px;background:#17212b}
.ptg-phone__bar span{padding:5px 10px;border-radius:14px;background:#0e1621;color:#6ab3f3;font:600 12.5px/1 -apple-system,'Segoe UI',Roboto,sans-serif}
/* сообщения появляются по очереди, когда телефон попадает в экран */
.fx-js:not(.fx-reduce) .ptg-demo .ptg-msg{opacity:0;transform:translateY(14px) scale(.98);transition:opacity .45s ease,transform .45s cubic-bezier(.2,.7,.2,1)}
.fx-js .ptg-demo.fx-in .ptg-msg{opacity:1;transform:none}
.ptg-demo.fx-in .ptg-msg:nth-child(2){transition-delay:.35s}
.ptg-demo.fx-in .ptg-msg:nth-child(3){transition-delay:.9s}
.ptg-demo.fx-in .ptg-msg:nth-child(4){transition-delay:1.4s}
.ptg-demo.fx-in .ptg-msg:nth-child(5){transition-delay:1.9s}

/* когда что приходит */
.ptg-when{padding:8px 26px}
.ptg-when__row{display:flex;gap:16px;align-items:flex-start;padding:16px 0}
.ptg-when__row+.ptg-when__row{border-top:1px solid rgba(255,255,255,.06)}
.ptg-when__row img{flex:none;border-radius:3px;box-shadow:0 0 0 1px #000,0 0 0 2px #8a8279,0 0 0 3px #000}
.ptg-when__row b{font:700 18px 'Philosopher',serif;color:#f1dfbd}
.ptg-when__row p{margin:2px 0 0;color:var(--text)}
.ptg-when__tz{margin:0;padding:14px 0 16px;border-top:1px solid rgba(255,255,255,.06);font-size:14px}

/* команды */
.ptg-cmds{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.ptg-cmd{padding:18px 20px}
.ptg-cmd code{font:700 22px 'Philosopher',serif;color:#ffd24a}
.ptg-cmd p{margin:6px 0 0;color:var(--muted)}
.ptg-faq .ans p{margin:0}

@media (max-width:1100px){ .ptg-main{grid-template-columns:minmax(0,1fr) 320px;gap:32px} }
@media (max-width:980px){
  .ptg-main{grid-template-columns:1fr}
  .ptg-demo{position:static}
  .ptg-chat{height:470px}
}
@media (max-width:720px){
  .ptg-topics{grid-template-columns:1fr}
  .ptg-cmds{grid-template-columns:1fr;gap:16px}
  .ptg-qr{display:none}
  .ptg-go__btn{width:100%;align-items:stretch}
  .ptg-go__btn .wb{margin:0 14px;font-size:16px;padding:0 14px;letter-spacing:.2px}
}
@media (max-width:520px){
  .ptg-pick{padding:22px 16px 20px}
  .ptg-step h2{font-size:23px}
  .ptg-when{padding:4px 16px}
  .ptg-chat{height:430px}
}

/* Valor 2026-09-26: кнопки бота и «Персонаж застрял» */
.ptg-btns{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.ptg-btn{display:flex;gap:12px;align-items:flex-start;padding:14px 16px}
.ptg-btn img{flex:none;border-radius:3px;box-shadow:0 0 0 1px #000,0 0 0 2px #8a8279,0 0 0 3px #000}
.ptg-btn b{display:block;font:700 16px 'Philosopher',serif;color:#f1dfbd}
.ptg-btn p{margin:4px 0 0;font-size:14px;color:var(--muted);line-height:1.35}
.ptg-stuck{display:flex;gap:22px;align-items:flex-start;padding:24px 26px}
.ptg-stuck__ic{flex:none;border-radius:4px;box-shadow:0 0 0 1px #000,0 0 0 3px #8a6a3a,0 0 0 4px #000,0 0 18px rgba(90,160,255,.25)}
.ptg-stuck__b p{margin:0 0 12px}
.ptg-stuck__b b{color:#ffe08a}
.ptg-stuck__steps{margin:0 0 12px;padding-left:22px}
.ptg-stuck__steps li{margin-bottom:8px}
.ptg-stuck__steps code,.ptg-faq code{padding:1px 6px;color:#ffe9b0;background:#070504;box-shadow:0 0 0 1px #3e3934}
.ptg-stuck__note{font-size:14px;margin:0}
.ptg-phone__kb{display:grid;grid-template-columns:1fr 1fr;gap:5px;padding:8px 8px 10px;border-radius:0 0 20px 20px;background:#17212b}
.ptg-phone__kb span{padding:7px 6px;border-radius:7px;background:#2b3a4a;color:#e9eef3;text-align:center;font:600 12.5px/1.2 -apple-system,'Segoe UI',Roboto,sans-serif}
@media (max-width:1100px){ .ptg-btns{grid-template-columns:repeat(2,1fr)} }
@media (max-width:640px){ .ptg-btns{grid-template-columns:1fr} .ptg-stuck{flex-direction:column;padding:18px 16px} }
