/* platform.gadilovtech.com: сине-белая гамма. Страница и квиз: синий для действий, тёмные чернила для текста; платформа лида красится в его цвет (--brand). */
  :root { --ink:#0b1533; --mist:#f3f6fc; --hair:#e3e8f2; --mute:#66718a; --spark:#1557e8; --pri:#1557e8; --ok:#0f9f69; --warn:#b7791f; --bad:#d14343; --disp:Unbounded,Onest,Arial,sans-serif; }
  * { box-sizing:border-box; }
  html, body { height:100%; }
  body { margin:0; background:#fff; color:var(--ink); font:16px/1.45 Onest,Arial,sans-serif; -webkit-font-smoothing:antialiased; }
  button { font:inherit; color:inherit; cursor:pointer; -webkit-tap-highlight-color:transparent; }
  h1,h2,h3,h4,h5,p { margin:0; }
  svg.ic { flex:none; width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
  /* Названия у проекта пока нет: в шапке сборщика стоит только знак, он же кнопка «в начало». */
  .logo { display:block; width:14px; height:14px; border-radius:4px; background:var(--pri); }

  /* Ленты (скриншоты, логотипы): два одинаковых набора подряд и сдвиг ровно на половину ширины, поэтому шва не видно. */
  .rail { overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent); mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent); }
  .rail-in { display:flex; align-items:center; width:max-content; animation:drift var(--t,60s) linear infinite; }
  .rail:hover .rail-in { animation-play-state:paused; }
  @keyframes drift { to { transform:translateX(-50%); } }
  .cases { margin-top:34px; }
  .scard { flex:none; width:clamp(264px,72vw,372px); margin:4px 14px 28px 0; border-radius:16px; overflow:hidden; background:#fff; text-align:left; box-shadow:0 0 0 1px var(--hair), 0 20px 30px -24px rgba(11,21,51,.55); }
  .scard figcaption, .wshot span { display:flex; align-items:center; gap:7px; color:var(--mute); white-space:nowrap; overflow:hidden; }
  .scard figcaption { height:38px; padding:0 13px; font-size:12.5px; }
  .scard figcaption img, .wshot span img { flex:none; width:auto; height:calc(var(--h) * 1px); }
  .scard figcaption b, .wshot span b { font-weight:700; color:var(--ink); }
  .scard > img { display:block; width:100%; height:auto; aspect-ratio:16/10; object-fit:cover; object-position:top left; border-top:1px solid var(--hair); }
  .founder { width:100%; max-width:720px; margin:10px auto 0; padding:0 20px; }
  .f-card { display:grid; grid-template-columns:auto minmax(0,1fr); gap:14px; align-items:center; padding:18px; border-radius:24px; background:var(--mist); }
  .f-card img { width:68px; height:68px; border-radius:22px; object-fit:cover; background:#fff; }
  .f-card div b { display:block; font:700 17px/1.15 var(--disp); letter-spacing:-.02em; }
  .f-card p b { font-weight:600; color:var(--ink); }
  .f-card div span { display:block; margin-top:6px; color:var(--mute); font-size:13.5px; line-height:1.35; }
  .f-card p { grid-column:1/-1; color:#2b3550; font-size:14.5px; line-height:1.55; }
  .proof { margin-top:30px; text-align:center; }
  .proof > p { margin-bottom:18px; color:var(--mute); font-size:13.5px; }
  .proof .rail-in img { flex:none; width:auto; height:calc(var(--h) * 1px); margin-right:44px; }
  .faq, .last { width:100%; max-width:720px; margin:56px auto 0; padding:0 20px; }
  .faq h2, .last h2 { font:800 clamp(22px,4.6vw,34px)/1.1 var(--disp); letter-spacing:-.035em; text-wrap:balance; }
  .faq > p { margin:10px 0 22px; color:var(--mute); font-size:14.5px; }
  .faq details { border-bottom:1px solid var(--hair); }
  .faq details:first-of-type { border-top:1px solid var(--hair); }
  .faq summary { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:17px 0; font-size:15.5px; font-weight:600; line-height:1.35; cursor:pointer; list-style:none; }
  .faq summary::-webkit-details-marker { display:none; }
  .faq summary::after { content:""; flex:none; width:26px; height:26px; border-radius:50%; transition:transform .2s;
    background:linear-gradient(var(--pri),var(--pri)) center / 10px 1.6px no-repeat, linear-gradient(var(--pri),var(--pri)) center / 1.6px 10px no-repeat, var(--mist); }
  .faq details[open] summary::after { transform:rotate(45deg); background:linear-gradient(#fff,#fff) center / 10px 1.6px no-repeat, linear-gradient(#fff,#fff) center / 1.6px 10px no-repeat, var(--pri); }
  .faq summary:focus-visible { outline:2px solid var(--pri); outline-offset:2px; border-radius:6px; }
  .faq details p { padding:0 40px 18px 0; color:#3d4660; font-size:14.5px; line-height:1.6; }
  .last { margin-top:48px; }
  .last-in { padding:28px 22px 24px; border-radius:26px; background:linear-gradient(165deg,#e9f0ff,#f4f6fc 62%); text-align:center; }
  .last small { display:block; color:var(--mute); font-size:13px; }
  .wa-link { display:inline-flex; align-items:center; gap:8px; margin-top:18px; padding:10px 16px; border-radius:999px; background:#fff; box-shadow:0 0 0 1px var(--hair); color:var(--ink); font-size:14.5px; font-weight:600; text-decoration:none; }
  .wa-link svg { width:18px; height:18px; color:#1faa59; }
  .cta { display:flex; align-items:center; justify-content:center; gap:10px; width:100%; max-width:380px; min-height:54px; margin:20px auto 12px; border:0; border-radius:16px; background:var(--pri); color:#fff; font-size:16px; font-weight:700; box-shadow:0 18px 30px -18px rgba(21,87,232,.75); transition:transform .15s; }
  .cta:active { transform:scale(.98); }
  .cta svg { width:18px; height:18px; }
  .sticky { position:fixed; left:0; right:0; bottom:0; z-index:30; padding:22px 16px calc(12px + env(safe-area-inset-bottom)); background:linear-gradient(to top, #fff 62%, rgba(255,255,255,0)); transform:translateY(110%); transition:transform .28s cubic-bezier(.2,.8,.2,1); pointer-events:none; }
  .sticky.on { transform:none; pointer-events:auto; } .sticky .cta { margin:0 auto; }
  @media (prefers-reduced-motion: reduce) { .sticky { transition:none; } }

/* ---------- платформа (превью): перенос из сборщика ---------- */
  .p-app { display:grid; grid-template-columns:224px minmax(0,1fr); height:100%; --brand:#1557e8; background:#fff; font-size:14px; }
  .p-side { display:flex; flex-direction:column; gap:3px; padding:16px 12px; background:var(--mist); overflow-y:auto; scrollbar-width:none; }
  .p-brand { display:flex; align-items:center; gap:10px; padding:2px 6px 16px; }
  .p-logo { display:grid; place-items:center; flex:none; width:34px; height:34px; border-radius:11px; background:var(--brand); color:#fff; font:800 14px var(--disp); transition:background .4s; }
  .p-logo.img { background:#fff; box-shadow:0 0 0 1px var(--hair); overflow:hidden; }
  .p-logo.img img { width:100%; height:100%; object-fit:cover; }
  .step .dot { display:inline-block; width:11px; height:11px; margin-left:6px; border-radius:50%; vertical-align:-1px; box-shadow:0 0 0 1px rgba(11,21,51,.12); }
  .p-brand b { font:700 13px/1.2 var(--disp); letter-spacing:-.01em; overflow:hidden; text-overflow:ellipsis; }
  .p-roles { display:none; }
  .p-nav { display:flex; align-items:center; gap:10px; width:100%; padding:9px 10px; border:0; border-radius:11px; background:none; font-size:14px; font-weight:600; color:#3d4660; text-align:left; white-space:nowrap; transition:background .15s; }
  .p-nav:hover { background:#e9ebf0; }
  .p-nav.on { background:var(--brand); color:#fff; }
  .p-nav.enter { animation:navin .45s cubic-bezier(.2,.8,.2,1) both; }
  .p-nav em { margin-left:auto; padding:2px 7px; border-radius:6px; background:var(--ink); color:#fff; font-size:10px; font-weight:700; font-style:normal; }
  .p-nav.on em { background:#fff; color:var(--brand); }
  .p-nav .pt { margin-left:auto; padding:2px 6px; border-radius:6px; background:#eceef3; color:var(--mute); font-size:10px; font-weight:700; font-style:normal; }
  .p-nav em + .pt { margin-left:4px; } .p-nav.on .pt { background:rgba(255,255,255,.22); color:#fff; }
  .p-host { margin-top:auto; padding:14px 6px 2px; color:var(--mute); font-size:12px; }
  .p-main { display:flex; flex-direction:column; min-width:0; min-height:0; }
  .p-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:18px 24px 6px; }
  .p-head h4 .p-tag { margin-left:8px; vertical-align:middle; font-family:Onest,Arial,sans-serif; letter-spacing:0; }
  .p-head h4 .p-tag:not(.b) { background:#eceef3; }
  .p-head h4 { font:700 20px/1.2 var(--disp); letter-spacing:-.03em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .p-me { display:flex; align-items:center; gap:8px; color:var(--mute); font-size:13px; white-space:nowrap; }
  .av { display:inline-grid; place-items:center; flex:none; width:30px; height:30px; margin-right:9px; border-radius:50%; background:color-mix(in srgb,var(--brand) 14%,#fff); color:var(--brand); font-size:11.5px; font-weight:700; }
  .p-me .av { margin:0; }
  .p-body { flex:1; display:grid; gap:18px; align-content:start; min-height:0; padding:14px 24px 28px; overflow-y:auto; scrollbar-width:thin; }
  .p-body > * { animation:rise .5s cubic-bezier(.2,.8,.2,1) both; }
  .p-body > :nth-child(2) { animation-delay:.08s; } .p-body > :nth-child(3) { animation-delay:.16s; } .p-body > :nth-child(4) { animation-delay:.24s; }
  .sk { height:74px; border-radius:16px; background:linear-gradient(90deg,#f1f3f6 25%,#e7eaef 37%,#f1f3f6 63%); background-size:400% 100%; animation:shimmer 1.1s ease infinite; }
  .sk.tall { height:170px; }
  .empty { display:grid; place-items:center; height:100%; padding:24px; }
  .empty p { margin-top:16px; color:var(--mute); font-size:14px; text-align:center; }
  .blk { min-width:0; padding:16px; border-radius:16px; background:var(--mist); }
  .grid2, .grid3 { display:grid; gap:16px; }
  .grid2 { grid-template-columns:repeat(2,minmax(0,1fr)); } .grid2.wide { grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); } .grid3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .lbl { display:block; margin-bottom:8px; color:var(--mute); font-size:12.5px; font-weight:600; }
  .lbl em { padding:1px 7px; border-radius:6px; background:#fff; font-style:normal; }
  h5 { font-size:16px; font-weight:700; letter-spacing:-.01em; }
  .blk p, .course p { margin-top:3px; color:var(--mute); font-size:13.5px; }
  /* Вместо стоковых фотографий — фигуры в цвете бренда: так выглядит платформа, куда школа ещё не загрузила свои снимки.
     Настоящая фотография ставится, только если она пришла со страницы самого лида (класс pic). */
  .photo { position:relative; display:flex; flex-direction:column; justify-content:flex-end; min-height:184px; padding:18px; border-radius:18px; overflow:hidden; background:var(--brand); color:#fff; }
  .photo::before, .photo::after { content:""; position:absolute; border-radius:50%; }
  .photo::before { right:-64px; top:-96px; width:250px; height:250px; background:color-mix(in srgb,var(--brand) 78%,#fff); }
  .photo::after { right:78px; bottom:-136px; width:210px; height:210px; background:color-mix(in srgb,var(--brand) 82%,#000); }
  .photo.pic { background:#1b2540 center/cover; }
  .photo.pic::before { inset:0; width:auto; height:auto; border-radius:0; background:linear-gradient(120deg,color-mix(in srgb,var(--brand) 92%,#000) 30%,color-mix(in srgb,var(--brand) 30%,transparent)); }
  .photo.pic::after { display:none; }
  .photo.tall { min-height:240px; }
  .photo > * { position:relative; z-index:1; }
  .photo small { font-size:12.5px; font-weight:600; opacity:.85; }
  .photo h3 { max-width:15em; font:800 clamp(20px,2.4vw,28px)/1.1 var(--disp); letter-spacing:-.03em; }
  .photo h5 { margin-top:4px; font-size:19px; }
  .photo p { max-width:28em; margin-top:8px; font-size:14px; opacity:.9; }
  .pbtn { display:inline-block; align-self:flex-start; margin-top:14px; padding:9px 14px; border-radius:11px; background:var(--brand); color:#fff; font-size:13px; font-weight:600; }
  .photo .pbtn { background:#fff; color:var(--ink); }
  .pbtn.sm { margin:0; padding:6px 11px; } .pbtn.ghost { background:color-mix(in srgb,var(--brand) 12%,#fff); color:var(--brand); }
  .prog { height:6px; margin-top:12px; border-radius:6px; background:rgba(255,255,255,.3); overflow:hidden; }
  .prog.d { background:#e3e6ec; }
  .prog u { display:block; height:100%; border-radius:6px; background:#fff; } .prog.d u { background:var(--brand); }
  .stats { display:grid; grid-template-columns:repeat(var(--n,3),minmax(0,1fr)); }
  .stats > div { padding:2px 18px; border-left:1px solid var(--hair); }
  .stats > div:first-child { padding-left:2px; border-left:0; }
  .stats b { display:block; font:800 clamp(22px,2.6vw,32px)/1.05 var(--disp); letter-spacing:-.04em; }
  .stats small { display:block; margin-top:6px; color:var(--mute); font-size:13px; }
  .stats em { color:var(--ok); font-size:12px; font-style:normal; font-weight:600; }
  .tl { display:grid; grid-template-columns:62px minmax(0,1fr) auto; align-items:center; gap:10px; padding:9px 0; border-top:1px solid #e3e6ec; }
  .tl:first-of-type { border-top:0; } .tl > span:first-child { color:var(--mute); font-size:13px; } .tl b { font-weight:600; }
  .barx { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,2fr) 38px; align-items:center; gap:10px; padding:6px 0; font-size:13.5px; }
  .p-draft { margin:2px 0 10px; padding:5px 9px; border-radius:9px; background:#fff6dc; color:#6b4a00; font-size:11.5px; font-weight:600; line-height:1.3; }
  .p-app.m .p-draft { margin:0 14px 8px; display:inline-block; }
  .ph-or { margin:10px 0 8px; text-align:center; color:var(--mute); font-size:12.5px; }
  .btn.ph-wa { display:flex; width:100%; min-height:48px; justify-content:center; gap:8px; border-radius:13px; font-size:15.5px; font-weight:700; }
  .q > small.ph-note { margin:8px 0 6px; font-size:12.5px; }
  .q-skip { display:flex; gap:16px; flex-wrap:wrap; margin-top:10px; }
  .barx span { min-width:0; overflow-wrap:anywhere; line-height:1.25; }   /* длинная подпись («Самостоятельность») переносится, а не наезжает на шкалу */
  .barx i { height:7px; border-radius:7px; background:#e3e6ec; overflow:hidden; }
  .barx u { display:block; height:100%; border-radius:7px; background:var(--brand); }
  .barx em { color:var(--mute); font-size:12.5px; font-style:normal; text-align:right; }
  .ring { display:flex; align-items:center; gap:16px; }
  .ring svg { width:84px; height:84px; transform:rotate(-90deg); }
  .ring circle { fill:none; stroke-width:4; } .ring .t { stroke:#e3e6ec; } .ring .v { stroke:var(--brand); stroke-linecap:round; }
  .ring b { display:block; font:800 26px/1 var(--disp); letter-spacing:-.04em; } .ring small { display:block; margin-top:6px; color:var(--mute); font-size:13px; }
  .tr { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1.3fr) auto; align-items:center; gap:10px; padding:10px 0; border-top:1px solid #e3e6ec; }
  .tr:first-child { border-top:0; } .tr.two { grid-template-columns:minmax(0,1fr) auto; } .tbl { padding:4px 16px; }
  .tr .sub { display:block; margin-top:2px; font-size:12.5px; font-weight:400; color:var(--mute); }
  .tr > span { display:flex; align-items:center; min-width:0; } .tr > span:nth-child(2) { color:var(--mute); }
  .pill { display:inline-block; padding:4px 9px; border-radius:999px; background:#fff; color:var(--mute); font-size:12px; font-weight:600; white-space:nowrap; }
  .pill.g { background:#e2f4ec; color:var(--ok); } .pill.w { background:#fbf0dc; color:var(--warn); } .pill.r { background:#fbe6e6; color:var(--bad); } .pill.b { background:color-mix(in srgb,var(--brand) 12%,#fff); color:var(--brand); }
  .chartx { display:block; width:100%; height:120px; color:var(--brand); }
  .quote { margin:0 !important; font-size:15px !important; color:var(--ink) !important; }
  .week { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:8px; }
  .week > div { min-height:150px; padding:8px 6px; border-radius:12px; background:var(--mist); }
  .week > div > span { display:block; margin-bottom:6px; color:var(--mute); font-size:12px; font-weight:600; text-align:center; }
  .week i { display:block; margin-bottom:6px; padding:7px; border-radius:9px; background:var(--brand); color:#fff; font-size:11px; font-style:normal; font-weight:600; overflow:hidden; }
  .week i b { display:block; font-size:11.5px; font-weight:500; opacity:.9; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .week i.alt { background:#e2f4ec; color:var(--ok); } .week i.alt2 { background:#fbf0dc; color:var(--warn); }
  .att > div { display:flex; align-items:center; justify-content:space-between; padding:9px 0; border-top:1px solid #e3e6ec; }
  .att > div:first-child { border-top:0; } .att span { display:flex; align-items:center; }
  .att .d i { width:14px; height:14px; margin-left:5px; border-radius:5px; } .att .y { background:#a9dfc6; } .att .n { background:#f2b9b9; }
  .kan { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
  .kan > div { padding:12px; border-radius:16px; background:var(--mist); }
  .kan i { display:block; margin-top:8px; padding:11px; border-radius:11px; background:#fff; font-size:13.5px; font-style:normal; font-weight:600; }
  .course { min-width:0; } .course h5 { margin-top:10px; font-size:15px; }
  /* Обложки курсов: три рисунка из простых фигур в цвете бренда. */
  .cv { position:relative; height:112px; border-radius:16px; overflow:hidden; background:color-mix(in srgb,var(--brand) 12%,#fff); }
  .cv::before, .cv::after { content:""; position:absolute; }
  .cv.k0::before { right:-14%; top:-46%; width:62%; aspect-ratio:1; border-radius:50%; background:var(--brand); }
  .cv.k0::after { left:9%; bottom:-52%; width:44%; aspect-ratio:1; border-radius:50%; background:color-mix(in srgb,var(--brand) 36%,#fff); }
  .cv.k1 { background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--brand) 10%,#fff) 0 16px,color-mix(in srgb,var(--brand) 24%,#fff) 16px 32px); }
  .cv.k1::before { left:14px; top:14px; width:40%; max-width:52px; aspect-ratio:1; border-radius:28%; background:var(--brand); }
  .cv.k2 { background:radial-gradient(color-mix(in srgb,var(--brand) 46%,#fff) 2px,transparent 2.6px) 0 0 / 15px 15px,color-mix(in srgb,var(--brand) 9%,#fff); }
  .cv.k2::before { right:12%; bottom:-28%; width:46%; aspect-ratio:1; border-radius:24%; background:var(--brand); transform:rotate(18deg); }
  /* Своя картинка на обложке курса (у платформы по ссылке): узор и фигуры уступают ей место. */
  .cv.pic { background-color:#10162b; background-size:cover; background-position:center; background-repeat:no-repeat; }
  .cv.pic::before, .cv.pic::after { display:none; }
  .cert { display:grid; align-content:center; gap:7px; min-height:184px; padding:20px; border-radius:18px; background:color-mix(in srgb,var(--brand) 8%,#fff); box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--brand) 35%,#fff); text-align:center; }
  .cert small { color:var(--brand); font:700 10.5px var(--disp); letter-spacing:.12em; } .cert span { color:var(--mute); font-size:12.5px; }
  /* Напоминания в WhatsApp: рамка телефона с перепиской и пояснение рядом (на телефоне — под рамкой) */
  .rm { display:grid; grid-template-columns:minmax(0,330px) minmax(0,1fr); gap:28px; align-items:start; }
  .p-app.m .rm { grid-template-columns:minmax(0,1fr); gap:18px; }
  .ph { position:relative; width:100%; max-width:330px; margin-top:12px; padding:9px; border-radius:38px; background:var(--ink); box-shadow:0 18px 38px -24px rgba(11,21,51,.5); }
  .p-app.m .ph { margin:12px auto 0; }
  .ph::before { content:""; position:absolute; top:16px; left:50%; z-index:2; width:62px; height:16px; margin-left:-31px; border-radius:10px; background:var(--ink); }
  .ph-tag { position:absolute; top:-12px; right:24px; z-index:3; box-shadow:0 0 0 3px #fff; }
  .ph-scr { overflow:hidden; border-radius:30px; background:#f1efe9; }
  .wa-top { display:flex; align-items:center; gap:10px; padding:34px 14px 11px; background:#f8f7f3; box-shadow:0 1px 0 rgba(11,21,51,.08); }
  .wa-av { display:grid; place-items:center; flex:none; width:36px; height:36px; border-radius:50%; background:var(--brand); color:#fff; font:800 14px var(--disp); overflow:hidden; }
  .wa-av.img { background:#fff; box-shadow:0 0 0 1px var(--hair); } .wa-av img { width:100%; height:100%; object-fit:cover; }
  .wa-top div { min-width:0; } .wa-top b { display:block; font-size:14.5px; font-weight:700; line-height:1.25; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .wa-top small { display:block; color:var(--mute); font-size:11.5px; }
  .wa-chat { display:grid; gap:15px; padding:16px 12px 26px; }
  .wa-m { display:grid; justify-items:start; gap:4px; min-width:0; }
  .wa-m small { margin-left:3px; color:#5d6a7c; font-size:11px; font-weight:700; }
  .wa-b { max-width:93%; padding:8px 11px 9px; border-radius:4px 13px 13px 13px; background:#dcf5c8; color:#16231a; font-size:13.5px; line-height:1.42; box-shadow:0 1px 1px rgba(11,21,51,.1); overflow-wrap:anywhere; }
  .wa-l { color:#0b72b5; text-decoration:underline; text-underline-offset:2px; }
  .rm-how { margin-top:12px; padding:18px; }
  .rm-r { padding:14px 0 2px; } .rm-r + .rm-r { margin-top:14px; border-top:1px solid #e3e8f2; }
  .rm-h { display:flex; flex-wrap:wrap; align-items:center; gap:4px 9px; }
  .rm-h b { font-size:14.5px; font-weight:700; }
  .rm-how .rm-r p { margin-top:6px; color:var(--ink); font-size:14px; line-height:1.5; }
  /* Помощник участника: правило, две вкладки, переписка */
  .ai-rule { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
  .ai-rule p { margin:0 !important; color:var(--ink) !important; font-size:14px !important; line-height:1.5; }
  .ai-rule .pill { flex:none; }
  .p-app.m .ai-rule { flex-direction:column-reverse; align-items:flex-start; gap:8px; }   /* на телефоне метка стоит над строкой, а не отнимает у неё ширину */
  .ai-tabs { display:flex; gap:3px; width:min(100%,430px); padding:3px; border-radius:13px; background:var(--mist); }
  .ai-tab { flex:1; min-height:38px; padding:0 8px; border:0; border-radius:10px; background:none; font:inherit; font-size:14px; font-weight:600; color:var(--mute); cursor:pointer; }
  .ai-tab.on { background:#fff; color:var(--ink); box-shadow:0 1px 3px rgba(11,21,51,.16); }
  .ai-tab:focus-visible, .ai-src:focus-visible { outline:2px solid var(--brand); outline-offset:2px; }
  .ai-chat { display:grid; gap:12px; }
  .ai-m { display:grid; gap:5px; min-width:0; justify-items:start; }
  .ai-m.me { justify-items:end; }
  .ai-n { display:flex; align-items:center; gap:5px; color:var(--mute); font-size:12px; font-weight:600; } .ai-n .ic { width:14px; height:14px; color:var(--brand); }
  .ai-b { max-width:90%; padding:10px 13px; border-radius:15px 15px 15px 4px; background:#fff; color:var(--ink); font-size:14px; line-height:1.5; overflow-wrap:anywhere; }
  .ai-m.me .ai-b { border-radius:15px 15px 4px 15px; background:color-mix(in srgb,var(--brand) 13%,#fff); }
  .ai-ol { margin:6px 0 0; padding-left:20px; } .ai-ol li + li { margin-top:6px; }
  .ai-src { display:flex; align-items:center; gap:9px; max-width:90%; padding:8px 12px; border:0; border-radius:12px; background:#fff; box-shadow:inset 0 0 0 1px var(--hair); font:inherit; font-size:13px; font-weight:600; color:var(--ink); text-align:left; }
  .ai-src .ic { flex:none; width:18px; height:18px; color:var(--brand); }
  .ai-src small { display:block; color:var(--mute); font-size:11.5px; font-weight:600; }
  .ai-card { padding:14px 15px; border-radius:14px; background:#fff; }
  .ai-card .lbl { margin-bottom:6px; } .ai-card h5 { font-size:15.5px; }
  .blk .ai-card p { margin-top:6px; color:var(--ink); font-size:14px; line-height:1.5; }
  .ai-state { display:flex; align-items:flex-start; gap:9px; padding:11px 13px; border-radius:12px; background:#e2f4ec; color:var(--ink); font-size:13.5px; line-height:1.45; }
  .ai-state .ic { flex:none; width:18px; height:18px; margin-top:1px; color:var(--ok); }
  .inp { margin-top:4px; padding:11px 13px; border-radius:12px; background:#fff; color:var(--mute); }
  .pchips { display:flex; flex-wrap:wrap; gap:6px; }
  .tip { padding:9px 12px; border-radius:12px; background:color-mix(in srgb,var(--brand) 10%,#fff); color:var(--brand); font-size:13px; font-weight:600; }
  .see { display:none; margin-right:18px; } @media (max-width:860px) { .see { display:inline-block; } }
  /* второй уровень экранов: то, что открывается по нажатию на урок, тест, ученика, заявку, работу, оплату, отчёт */
  button.pbtn { border:0; font:inherit; font-size:13px; font-weight:600; cursor:pointer; } button.pbtn:disabled { opacity:.45; cursor:default; }
  .pbtn.sent, .photo .pbtn.sent { background:#e2f4ec; color:var(--ok); cursor:default; }
  .pchips .pbtn { margin-top:0; }
  .tap { position:relative; cursor:pointer; }
  .tr.tap, .att > .tap { padding-right:20px; } .kan i.tap { padding-right:26px; }
  .tap::after { content:''; position:absolute; right:4px; top:50%; width:6px; height:6px; border-top:2px solid #b3b9c7; border-right:2px solid #b3b9c7; transform:translateY(-50%) rotate(45deg); }
  .kan i.tap::after { right:12px; }
  .tap:focus-visible, .opt:focus-visible, .dots button:focus-visible, .dt-back:focus-visible { outline:2px solid var(--brand); outline-offset:2px; }
  /* Настоящее видео в уроке (у платформы по ссылке): плеер YouTube вместо условного. */
  /* Высота задана отступом, а не aspect-ratio: экран второго уровня — сетка, и строка под блок с aspect-ratio схлопывалась, следующий блок наезжал на видео. */
  .vid.yt { display:block; height:0; min-height:0; padding:56.25% 0 0; background:#000; cursor:default; }
  .vid.yt::before, .vid.yt::after { display:none; }
  .vid.yt iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
  .dt-head { display:flex; align-items:center; gap:10px; min-width:0; }
  .dt-back { display:grid; place-items:center; flex:none; width:36px; height:36px; border:0; border-radius:12px; background:var(--mist); color:var(--ink); }
  .dt-back svg { width:18px; height:18px; transform:rotate(-90deg); }
  .p-body.dt > * { animation:dtin .34s cubic-bezier(.2,.8,.2,1) both; animation-delay:0s !important; }
  .p-body.still > * { animation:none; }
  @keyframes dtin { from { opacity:0; transform:translateX(22px); } to { opacity:1; transform:none; } }
  .who { display:flex; align-items:center; min-width:0; } .who h5 { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .who small, .mut { color:var(--mute); font-size:13px; }
  .vid { justify-content:center; align-items:center; min-height:196px; cursor:pointer; }
  .vid .play { display:grid; place-items:center; width:58px; height:58px; border-radius:50%; background:#fff; color:var(--brand); }
  .vid .play::before { content:''; margin-left:4px; border-left:16px solid currentColor; border-top:10px solid transparent; border-bottom:10px solid transparent; }
  .vid.on .play::before { margin:0; width:14px; height:18px; border:0; border-left:5px solid currentColor; border-right:5px solid currentColor; }
  .vid small { position:absolute; left:16px; bottom:14px; } .vid .line { position:absolute; left:0; right:0; bottom:0; height:4px; background:rgba(255,255,255,.3); }
  .vid .line u { display:block; width:0; height:100%; background:#fff; } .vid.on .line u { animation:vplay 40s linear forwards; }
  @keyframes vplay { to { width:100%; } }
  .qq { margin:14px 0 4px; font-size:18px; line-height:1.3; }
  .opt { display:flex; align-items:center; gap:11px; width:100%; margin-top:8px; padding:12px 13px; border:2px solid transparent; border-radius:13px; background:#fff; font:inherit; font-size:15px; font-weight:600; color:var(--ink); text-align:left; }
  .opt i { display:grid; place-items:center; flex:none; width:26px; height:26px; border-radius:8px; background:var(--mist); color:var(--mute); font-size:12.5px; font-style:normal; font-weight:700; }
  .opt.on { border-color:var(--brand); } .opt.on i { background:var(--brand); color:#fff; }
  .crit { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:9px 0; border-top:1px solid #e3e6ec; font-size:14.5px; }
  .dots { display:flex; gap:6px; } .dots button { width:26px; height:26px; padding:0; border:0; border-radius:8px; background:#dfe3ea; }
  .dots button.on { background:var(--brand); }
  .ans { padding:12px 13px; border-radius:12px; background:#fff; line-height:1.55 !important; } .ans mark { padding:0 2px; border-radius:4px; background:#fbe6e6; color:var(--bad); }
  @media (prefers-reduced-motion: reduce) { .p-body.dt > * { animation:none; } .vid.on .line u { animation:none; width:35%; } }
  .rowb { display:flex; align-items:center; justify-content:space-between; gap:12px; }

  .p-app.m { grid-template-columns:minmax(0,1fr); grid-template-rows:auto minmax(0,1fr); }
  .p-app.m .p-side { flex-direction:row; flex-wrap:wrap; align-items:center; gap:6px; padding:10px 14px 10px; background:#fff; box-shadow:0 1px 0 var(--hair); overflow:visible; }
  .p-app.m .p-brand { flex:1 1 100%; padding:0 0 4px; } .p-app.m .p-host { display:none; }
  .p-app.m .p-roles { display:flex; flex:1 1 100%; gap:4px; margin:0 -14px; padding:0 14px 6px; overflow-x:auto; scrollbar-width:none; }
  .p-app.m .p-roles::-webkit-scrollbar, .p-app.m .p-navs::-webkit-scrollbar { display:none; }
  .p-app.m .p-roles button { flex:none; padding:6px 11px; border:0; border-radius:999px; background:var(--mist); font-size:13px; font-weight:600; color:var(--mute); }
  .p-app.m .p-roles button.on { background:var(--ink); color:#fff; }
  .p-navs { display:contents; }
  /* Разделы кабинета на телефоне — нижняя панель, как в мобильном приложении. */
  .p-app.m { position:relative; }
  .p-app.m .p-navs { position:absolute; left:0; right:0; bottom:0; z-index:3; display:flex; gap:2px; padding:6px 8px calc(6px + env(safe-area-inset-bottom)); background:#fff; box-shadow:0 -1px 0 var(--hair); overflow-x:auto; scrollbar-width:none; }
  .p-app.m .p-nav { position:relative; flex:1 0 auto; flex-direction:column; gap:3px; width:auto; min-width:62px; padding:6px 4px; border-radius:10px; background:none; font-size:10.5px; color:var(--mute); }
  .p-app.m .p-nav svg { width:22px; height:22px; }
  .p-app.m .p-nav.on { background:none; color:var(--brand); }
  .p-app.m .p-nav .pt { margin:0; padding:0; background:none; font-size:8.5px; line-height:1; font-weight:600; } .p-app.m .p-nav.on .pt { background:none; color:var(--brand); }
  .p-app.m .p-nav em { position:absolute; top:1px; left:calc(50% + 6px); margin:0; padding:1px 5px; font-size:8.5px; }
  .p-app.m .p-nav.on em { background:var(--brand); color:#fff; }
  .p-app.m .p-head { padding:14px 16px 2px; } .p-app.m .p-head h4 { font-size:18px; }   /* Длинное название экрана («Напоминания в WhatsApp») переносится на вторую строку, а не обрезается многоточием */
  .p-app.m .p-head h4 { white-space:normal; line-height:1.18; }
  .p-app.m .p-body { gap:14px; padding:12px 16px calc(84px + env(safe-area-inset-bottom)); }
  .p-app.m .grid2, .p-app.m .grid3 { grid-template-columns:minmax(0,1fr); }
  .p-app.m .grid3.keep { grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; } .p-app.m .grid3.keep .cv { height:76px; border-radius:12px; } .p-app.m .grid3.keep p { display:none; } .p-app.m .grid3.keep h5 { font-size:13px; }
  .p-app.m .stats { --n:2 !important; row-gap:16px; } .p-app.m .stats > div:nth-child(odd) { padding-left:2px; border-left:0; }
  .p-app.m .week { grid-template-columns:repeat(3,minmax(0,1fr)); } .p-app.m .week > div { min-height:96px; }
  .p-app.m .kan { grid-template-columns:minmax(0,1fr); }
  .p-app.m .tr { grid-template-columns:minmax(0,1fr) auto; } .p-app.m .tr > span:nth-child(2) { display:none; } .p-app.m .tr.two > span:nth-child(2) { display:flex; }
  .p-app.m .tl { grid-template-columns:54px minmax(0,1fr) auto; }


/* ======================================================================
   Страница: первый экран с экраном 1 квиза, секции, финал
   ====================================================================== */
a { color:inherit; }
.home { display:flex; flex-direction:column; min-height:100%; padding-bottom:64px; overflow-x:clip; }
.h-top { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; max-width:760px; margin:0 auto; padding:14px 20px 0; }
.brand { display:flex; align-items:center; gap:9px; font:700 15px var(--disp); letter-spacing:-.02em; text-decoration:none; }
.brand .logo { width:22px; height:22px; border-radius:7px; background:linear-gradient(135deg,#1557e8,#5b8cff); }
.hero { width:100%; max-width:760px; margin:0 auto; padding:clamp(18px,4vh,44px) 20px 0; text-align:center; }
.eyebrow { display:inline-block; padding:6px 13px; border-radius:999px; background:#e6edff; color:var(--pri); font-size:13px; font-weight:600; }
.hero h1 { margin-top:16px; font:800 clamp(25px,6vw,50px)/1.1 var(--disp); letter-spacing:-.035em; text-wrap:balance; }
.hero h1 span { color:var(--pri); }
.hero .sub { margin-top:12px; color:var(--mute); font-size:clamp(15px,1.8vw,18px); text-wrap:balance; }

.card { margin-top:22px; padding:20px 18px 18px; border-radius:24px; background:#fff; text-align:left; box-shadow:0 0 0 1.5px var(--pri), 0 26px 50px -28px rgba(21,87,232,.55); }
.card h2 { font:800 20px/1.2 var(--disp); letter-spacing:-.03em; }
.card .cap { margin-top:6px; color:var(--mute); font-size:14.5px; }
.lrows { display:grid; gap:8px; margin-top:16px; }
.lrow { border-radius:16px; background:var(--mist); overflow:hidden; transition:background .15s, box-shadow .15s; }
.lrow.open { background:#fff; box-shadow:0 0 0 1.5px var(--pri); }
.lrow.done:not(.open) { background:#eaf7f1; }
.lrow > button { display:flex; align-items:center; gap:12px; width:100%; min-height:56px; padding:0 16px 0 14px; border:0; background:none; font-size:16px; font-weight:700; text-align:left; }
.lrow > button .ico { display:grid; place-items:center; flex:none; width:34px; height:34px; border-radius:11px; background:#fff; color:var(--pri); box-shadow:0 0 0 1px var(--hair); }
.lrow.done .ico { background:var(--ok); color:#fff; box-shadow:none; }
.lrow > button small { display:block; margin-top:1px; color:var(--mute); font-size:12.5px; font-weight:500; }
.lrow > button > svg:last-child { margin-left:auto; color:var(--mute); transform:rotate(90deg); transition:transform .2s; }
.lrow.open > button > svg:last-child { transform:rotate(180deg); }
.lrow .fld { display:none; padding:0 14px 14px; }
.lrow.open .fld { display:block; }
.inp-w { position:relative; display:flex; }
.inp-w i { position:absolute; left:14px; top:0; font-style:normal; font-weight:600; line-height:48px; color:var(--mute); pointer-events:none; }
.inp-w.at input { padding-left:32px; }
input.fi, textarea.fi { width:100%; height:48px; padding:0 14px; border:0; border-radius:13px; background:var(--mist); font:inherit; font-size:16px; font-weight:500; color:var(--ink); }
.lrow.open input.fi { background:var(--mist); }
textarea.fi { height:auto; min-height:84px; padding:12px 14px; resize:vertical; line-height:1.4; }
input.fi:focus, textarea.fi:focus { outline:2px solid var(--pri); outline-offset:1px; background:#fff; }
.found { display:flex; align-items:center; gap:10px; margin-top:10px; padding:10px 12px; border-radius:13px; background:#eaf7f1; color:#0b5d3f; font-size:14px; line-height:1.3; animation:rise .3s ease both; }
.found img { flex:none; width:30px; height:30px; border-radius:8px; object-fit:cover; background:#fff; }
.found .dot { flex:none; width:14px; height:14px; border-radius:50%; box-shadow:0 0 0 1px rgba(11,21,51,.15); }
.found.wait { background:var(--mist); color:var(--mute); }
.fl { display:block; margin:16px 0 6px; color:var(--mute); font-size:13px; font-weight:600; }
.skip { display:block; width:100%; margin-top:6px; padding:10px; border:0; border-radius:13px; background:none; color:var(--pri); font-size:15px; font-weight:600; text-decoration:underline; text-underline-offset:3px; }
.btn-main { display:flex; align-items:center; justify-content:center; gap:10px; width:100%; min-height:54px; margin-top:16px; border:0; border-radius:16px; background:var(--pri); color:#fff; font-size:16.5px; font-weight:700; box-shadow:0 18px 30px -18px rgba(21,87,232,.8); transition:transform .15s, background .15s; }
.btn-main:active { transform:scale(.98); }
.btn-main:disabled { background:#c9cdd8; box-shadow:none; cursor:not-allowed; }
.btn-main svg { width:18px; height:18px; }
.btn-ghost { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:0 16px; border:0; border-radius:13px; background:var(--mist); font-size:14.5px; font-weight:600; text-decoration:none; }
.hint { margin-top:10px; color:var(--mute); font-size:13px; text-align:center; }

.cases { margin-top:34px; }
.sec { width:100%; max-width:760px; margin:60px auto 0; padding:0 20px; }
.sec h2 { font:800 clamp(22px,4.6vw,34px)/1.1 var(--disp); letter-spacing:-.035em; text-wrap:balance; }
.sec > p.lead { margin-top:10px; color:var(--mute); font-size:15px; }
.feats { display:grid; grid-template-columns:1fr; gap:12px; margin-top:22px; }
.feat { position:relative; padding:18px 18px 16px; border-radius:22px; background:var(--mist); overflow:hidden; }
.feat .fi-ic { display:grid; place-items:center; width:42px; height:42px; border-radius:14px; background:#fff; color:var(--pri); box-shadow:0 0 0 1px var(--hair); }
.feat .fi-ic svg { width:22px; height:22px; }
.feat h3 { margin-top:14px; font:700 18px/1.2 var(--disp); letter-spacing:-.02em; }
.feat p { margin-top:6px; color:#3d4660; font-size:14.5px; line-height:1.5; }
.roles-strip { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; padding:16px; border-radius:20px; background:linear-gradient(135deg,#1557e8,#4c82ff); color:#fff; align-items:center; }
.roles-strip b { flex:1 1 100%; font:700 17px var(--disp); letter-spacing:-.02em; }
.roles-strip span { padding:7px 13px; border-radius:999px; background:rgba(255,255,255,.18); font-size:13.5px; font-weight:600; }
.how { display:grid; gap:0; margin-top:22px; counter-reset:how; }
.how > div { position:relative; padding:0 0 22px 52px; counter-increment:how; }
.how > div::before { content:counter(how); position:absolute; left:0; top:0; display:grid; place-items:center; width:36px; height:36px; border-radius:50%; background:var(--pri); color:#fff; font:800 15px var(--disp); }
.how > div::after { content:""; position:absolute; left:17px; top:40px; bottom:4px; width:2px; background:var(--hair); }
.how > div:last-child::after { display:none; }
.how b { display:block; font-size:16.5px; }
.how p { margin-top:4px; color:#3d4660; font-size:14.5px; line-height:1.5; }
.last-in { padding:30px 22px 26px; border-radius:26px; background:linear-gradient(165deg,#e9f0ff,#f4f6fc 62%); text-align:center; }
.last-in h2 { margin-top:8px; }
.last-in h2 span { color:var(--pri); }
.last-in p { margin-top:12px; color:#3d4660; font-size:15px; line-height:1.55; }
.slots { display:inline-block; margin-top:14px; padding:8px 14px; border-radius:999px; background:#fff; box-shadow:0 0 0 1px var(--hair); font-size:14px; font-weight:700; }
.slots b { color:var(--pri); }
.last-in .cta { margin-top:18px; }

/* ======================================================================
   Квиз: экраны 2-4
   ====================================================================== */
.qz { min-height:100dvh; background:#fff; animation:rise .3s ease; }
.qz-top { position:sticky; top:0; z-index:20; background:rgba(255,255,255,.94); backdrop-filter:blur(10px); }
.qz-bar { display:flex; align-items:center; gap:10px; max-width:760px; margin:0 auto; padding:10px 14px 8px; }
.qz-back { display:grid; place-items:center; flex:none; width:38px; height:38px; border:0; border-radius:12px; background:var(--mist); }
.qz-back svg { transform:rotate(-90deg); }
.qz-step { flex:1; min-width:0; }
.qz-step small { display:block; margin-bottom:5px; color:var(--mute); font-size:12.5px; font-weight:600; }
.qz-prog { height:5px; border-radius:5px; background:var(--hair); overflow:hidden; }
.qz-prog u { display:block; height:100%; border-radius:5px; background:var(--pri); transition:width .35s cubic-bezier(.2,.8,.2,1); }
.qz-wa { display:inline-flex; align-items:center; gap:7px; flex:none; min-height:38px; padding:0 13px; border-radius:12px; background:#e8f7ee; color:#11703c; font-size:13.5px; font-weight:700; text-decoration:none; }
.qz-wa svg { width:17px; height:17px; }
.qz-body { max-width:760px; margin:0 auto; padding:18px 20px 200px; }
.qz-body h1 { font:800 clamp(23px,5.4vw,34px)/1.12 var(--disp); letter-spacing:-.035em; text-wrap:balance; }
.qz-body .cap { margin-top:8px; color:var(--mute); font-size:15px; }
.grp { margin-top:24px; }
.grp > h3 { font-size:13.5px; font-weight:700; color:var(--mute); letter-spacing:.01em; }
.tiles { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.tile { min-height:48px; padding:11px 16px; border:0; border-radius:14px; background:var(--mist); font-size:15px; font-weight:600; line-height:1.2; text-align:left; transition:background .15s, color .15s, box-shadow .15s, transform .1s; }
.tile:hover { background:#e9ecf4; }
.tile:active { transform:scale(.98); }
.tile.on { background:var(--pri); color:#fff; box-shadow:0 10px 20px -12px rgba(21,87,232,.9); }
.tiles.g2 .tile { flex:1 1 calc(50% - 8px); min-width:0; }
.tiles.g3 .tile { flex:1 1 0; min-width:0; text-align:center; padding-left:8px; padding-right:8px; }
.tile.hot { box-shadow:inset 0 0 0 1.5px var(--pri); }
.tile.hot.on { box-shadow:0 10px 20px -12px rgba(21,87,232,.9); }
.other-in { margin-top:10px; }
.proc { margin-top:26px; padding:16px 14px 14px; border-radius:20px; background:#fff; box-shadow:0 0 0 1px var(--hair); }
.proc h3 { font:700 16.5px/1.25 var(--disp); letter-spacing:-.02em; }
.pain { display:flex; align-items:center; gap:12px; margin-top:12px; padding:11px 12px; border-radius:14px; background:#f3f4f8; color:#5b6478; animation:rise .3s ease both; }
.pain p { flex:1; font-size:14px; line-height:1.4; }
.sw2 { display:inline-flex; align-items:center; gap:8px; flex:none; min-height:36px; padding:0 12px; border:0; border-radius:999px; background:#fff; box-shadow:0 0 0 1px var(--hair); font-size:13px; font-weight:700; color:var(--mute); }
.sw2 i { position:relative; width:30px; height:18px; border-radius:18px; background:#d5d9e2; transition:background .2s; }
.sw2 i::after { content:""; position:absolute; left:2px; top:2px; width:14px; height:14px; border-radius:50%; background:#fff; transition:transform .2s; }
.sw2.on { background:#fff1ef; color:#c2381b; box-shadow:0 0 0 1.5px #f3b3a6; }
.sw2.on i { background:#e4572e; } .sw2.on i::after { transform:translateX(12px); }
.pain.on { background:#fff7f5; color:#7a2a17; }
.res { display:grid; gap:10px; margin-top:20px; }
.rcard { display:flex; align-items:center; gap:14px; width:100%; padding:14px 14px; border:0; border-radius:18px; background:#fff; box-shadow:0 0 0 1px var(--hair); text-align:left; transition:box-shadow .15s, background .15s, opacity .2s, transform .1s; }
.rcard:active { transform:scale(.99); }
.rcard .ri { display:grid; place-items:center; flex:none; width:46px; height:46px; border-radius:15px; background:#e6edff; color:var(--pri); }
.rcard .ri svg { width:24px; height:24px; }
.rcard b { display:block; font-size:16px; line-height:1.25; }
.rcard small { display:block; margin-top:3px; color:var(--mute); font-size:13.5px; line-height:1.3; }
.rcard .rk { margin-left:auto; display:grid; place-items:center; flex:none; width:28px; height:28px; border-radius:50%; background:var(--mist); color:#fff; font-size:13px; font-weight:800; }
.rcard.hot .rk { box-shadow:inset 0 0 0 2px #f6c4b8; }
.rcard.on { background:#f2f6ff; box-shadow:0 0 0 2px var(--pri); }
.rcard.on .rk { background:var(--pri); }
.rcard.dim { opacity:.45; }
.rcard .why { display:inline-block; margin-top:5px; padding:2px 8px; border-radius:7px; background:#fff1ef; color:#c2381b; font-size:12px; font-weight:700; }
.qz-foot { position:fixed; left:0; right:0; bottom:0; z-index:25; padding:22px 20px calc(14px + env(safe-area-inset-bottom)); background:linear-gradient(to top,#fff 66%,rgba(255,255,255,0)); pointer-events:none; }
.qz-foot > * { pointer-events:auto; }
.qz-foot .in { max-width:720px; margin:0 auto; }
.qz-foot .btn-main { margin-top:0; }
.qz-foot .cnt { margin-bottom:8px; color:var(--mute); font-size:13px; font-weight:600; text-align:center; }

/* Сборка платформы: короткая заставка */
.build { display:grid; place-items:center; min-height:100dvh; padding:24px; background:linear-gradient(165deg,#f3f7ff,#fff 60%); animation:rise .3s ease; }
.build > div { width:min(420px,100%); text-align:center; }
.build .bl { display:grid; place-items:center; width:72px; height:72px; margin:0 auto 20px; border-radius:22px; background:var(--brand,#1557e8); color:#fff; font:800 30px var(--disp); box-shadow:0 22px 40px -20px var(--brand,#1557e8); animation:pop .5s ease; overflow:hidden; }
.build .bl img { width:100%; height:100%; object-fit:cover; background:#fff; }
.build h2 { font:800 22px/1.2 var(--disp); letter-spacing:-.03em; }
.build ul { display:grid; gap:10px; margin:22px 0 0; padding:0; list-style:none; text-align:left; }
.build li { display:flex; align-items:center; gap:11px; padding:11px 14px; border-radius:14px; background:#fff; box-shadow:0 0 0 1px var(--hair); color:var(--mute); font-size:14.5px; opacity:.4; transition:opacity .3s, color .3s; }
.build li.on { opacity:1; color:var(--ink); }
.build li i { display:grid; place-items:center; width:20px; height:20px; border-radius:50%; background:var(--mist); color:#fff; flex:none; }
.build li.on i { background:var(--ok); }
.build li i svg { width:12px; height:12px; stroke-width:3; }

/* ======================================================================
   Экран 5: платформа под ответы и контакт
   ====================================================================== */
.pv { min-height:100dvh; background:linear-gradient(180deg,#f3f7ff,#fff 420px); animation:rise .35s ease; overflow-x:clip; }
.pv-top { display:flex; align-items:center; justify-content:space-between; gap:10px; max-width:1180px; margin:0 auto; padding:12px 18px 0; }
.pv-head { max-width:1180px; margin:0 auto; padding:18px 18px 0; }
.pv-head small { display:inline-block; padding:5px 12px; border-radius:999px; background:#fff; box-shadow:0 0 0 1px var(--hair); color:var(--pri); font-size:12.5px; font-weight:700; }
.pv-head h1 { margin-top:12px; font:800 clamp(24px,5.4vw,40px)/1.1 var(--disp); letter-spacing:-.035em; text-wrap:balance; }
.pv-head h1 em { font-style:normal; color:var(--bc,#1557e8); }
.pv-head p { margin-top:8px; color:var(--mute); font-size:15px; max-width:640px; }
.namer { display:inline-flex; align-items:center; gap:8px; margin-top:12px; }
.namer input { height:44px; padding:0 14px; border:0; border-radius:12px; background:#fff; box-shadow:0 0 0 1.5px var(--pri); font:inherit; font-size:16px; width:min(260px,60vw); }
.namer button, .name-btn { min-height:40px; padding:0 14px; border:0; border-radius:12px; background:var(--pri); color:#fff; font-size:14px; font-weight:700; }
.name-btn.soft { background:#fff; color:var(--pri); box-shadow:0 0 0 1px var(--hair); }
.ba { display:grid; gap:10px; max-width:1180px; margin:20px auto 0; padding:0 18px; }
.ba-c { display:grid; grid-template-columns:minmax(0,1fr) 28px minmax(0,1.15fr); align-items:stretch; gap:8px; }
.ba-c > div { padding:13px 14px; border-radius:16px; }
.ba-was { background:#f1f2f6; color:#5b6478; }
.ba-now { background:var(--bc,#1557e8); color:#fff; box-shadow:0 16px 28px -20px var(--bc,#1557e8); }
.ba-c small { display:block; margin-bottom:4px; font-size:11.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; opacity:.75; }
.ba-c p { font-size:14.5px; font-weight:600; line-height:1.3; }
.ba-arrow { display:grid; place-items:center; color:var(--bc,#1557e8); }
.ba-arrow svg { width:22px; height:22px; stroke-width:2.4; }
.pf { max-width:1180px; margin:22px auto 0; padding:0 18px; }
.pf-bar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; }
.pf-bar h2 { font:700 17px var(--disp); letter-spacing:-.02em; }
.seg { display:flex; flex:none; padding:3px; border-radius:11px; background:#e9ecf4; }
.seg button { display:grid; place-items:center; padding:6px 12px; border:0; border-radius:8px; background:none; font-size:13px; font-weight:600; color:var(--mute); white-space:nowrap; }
.seg button.on { background:#fff; color:var(--ink); box-shadow:0 1px 3px rgba(11,21,51,.16); }
.seg.roles { max-width:100%; overflow-x:auto; scrollbar-width:none; }
.seg.roles::-webkit-scrollbar { display:none; }
.seg.dev button { padding:6px 10px; }
.frame { margin:0 auto; border-radius:18px; background:#fff; overflow:hidden; box-shadow:0 0 0 1px var(--hair), 0 40px 80px -50px rgba(11,21,51,.55); transition:max-width .4s cubic-bezier(.2,.8,.2,1); }
.frame.mobile { max-width:400px; }
.fbar { display:flex; align-items:center; gap:10px; padding:9px 12px; box-shadow:0 1px 0 var(--hair); }
.fdots { display:flex; gap:5px; } .fdots i { width:9px; height:9px; border-radius:50%; background:#dde0e8; }
.furl { flex:1; min-width:60px; padding:6px 12px; border-radius:9px; background:var(--mist); color:var(--mute); font-size:12.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.plat { position:relative; height:640px; overflow:hidden; }
.p-app { height:100%; }
.ct { max-width:760px; margin:36px auto 0; padding:0 18px 40px; }
.ct-in { padding:24px 20px 22px; border-radius:26px; background:#fff; box-shadow:0 0 0 1.5px var(--pri), 0 26px 50px -28px rgba(21,87,232,.55); }
.ct-in h2 { font:800 clamp(21px,4.6vw,28px)/1.15 var(--disp); letter-spacing:-.03em; text-wrap:balance; }
.ct-in > p { margin-top:8px; color:#3d4660; font-size:15px; line-height:1.5; }
.facts { display:grid; gap:8px; margin:16px 0 0; padding:0; list-style:none; }
.facts li { display:flex; gap:10px; align-items:flex-start; font-size:14.5px; line-height:1.4; }
.facts li svg { flex:none; margin-top:1px; color:var(--ok); }
.facts b { font-weight:700; }
.ct-in .slots { display:block; width:max-content; max-width:100%; margin:16px 0 0; background:#f3f7ff; box-shadow:none; }
.cta-wa { display:flex; align-items:center; justify-content:center; gap:10px; width:100%; min-height:56px; margin-top:16px; border:0; border-radius:16px; background:#1faa59; color:#fff; font-size:16.5px; font-weight:700; text-decoration:none; box-shadow:0 18px 30px -18px rgba(31,170,89,.85); }
.cta-wa svg { width:20px; height:20px; }
.phone-f { margin-top:18px; padding-top:16px; border-top:1px solid var(--hair); }
.phone-f label { display:block; margin-bottom:8px; color:var(--mute); font-size:14px; font-weight:600; }
.phone-f .r { display:flex; gap:8px; }
.phone-f input { flex:1; min-width:0; }
.phone-f button { flex:none; min-height:48px; padding:0 18px; border:0; border-radius:13px; background:var(--ink); color:#fff; font-size:15px; font-weight:700; }
.phone-f button:disabled { opacity:.4; }
.err { margin-top:8px; color:#b42318; font-size:13px; }
.thanks { max-width:620px; margin:0 auto; padding:30px 20px 60px; animation:rise .35s ease; }
.thanks .ok { display:grid; place-items:center; width:64px; height:64px; margin-bottom:18px; border-radius:50%; background:#e2f4ec; color:var(--ok); }
.thanks .ok svg { width:32px; height:32px; stroke-width:2.6; }
.thanks h1 { font:800 clamp(25px,6vw,34px)/1.12 var(--disp); letter-spacing:-.035em; }
.thanks > p { margin-top:10px; color:#3d4660; font-size:16px; line-height:1.5; }
.thanks .facts { margin-top:18px; padding:16px; border-radius:18px; background:var(--mist); }
.thanks .q2 { margin-top:24px; }
.thanks .q2 h3 { font-size:15px; }
.thanks .lnk { display:flex; align-items:center; gap:8px; margin-top:22px; padding:12px 14px; border-radius:14px; background:#f3f7ff; font-size:14px; word-break:break-all; }
.toast { position:fixed; left:50%; bottom:90px; z-index:50; transform:translateX(-50%); padding:11px 16px; border-radius:13px; background:var(--ink); color:#fff; font-size:14px; font-weight:600; box-shadow:0 18px 34px -18px rgba(11,21,51,.75); animation:rise .25s ease both; }
.shared-note { max-width:1180px; margin:14px auto 0; padding:0 18px; }
.shared-note div { padding:11px 14px; border-radius:13px; background:#fff6dc; color:#6b4a00; font-size:13.5px; font-weight:600; }

/* ======================================================================
   Экраны платформы: дополнения к переносу из сборщика
   ====================================================================== */
.p-app { --brand:#1557e8; }
.p-brand b { min-width:0; }
.p-brand .nm { display:grid; min-width:0; }
.p-brand .nm button { justify-self:start; margin-top:3px; padding:0; border:0; background:none; color:var(--brand); font-size:11.5px; font-weight:700; text-decoration:underline; text-underline-offset:2px; }
.p-nav em.go { background:var(--ink); }
.cv { position:relative; }
.cv > img { position:absolute; inset:0; z-index:2; width:100%; height:100%; object-fit:cover; }
.photo > img.bgimg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.photo.hasimg::before { inset:0; width:auto; height:auto; border-radius:0; background:linear-gradient(120deg,color-mix(in srgb,var(--brand) 94%,#000) 24%,color-mix(in srgb,var(--brand) 38%,transparent)); z-index:1; }
.photo.hasimg::after { display:none; }
.photo.hasimg > *:not(img) { z-index:2; }
.sw-btn { display:inline-block; margin-top:14px; padding:10px 16px; border:0; border-radius:12px; background:#fff; color:var(--ink); font-size:14px; font-weight:700; }
.sw-btn.sent { background:#e2f4ec; color:var(--ok); }
.src { display:inline-block; padding:2px 8px; border-radius:7px; font-size:11.5px; font-weight:700; background:#fff; color:var(--mute); }
.src.s0 { background:#fde8f1; color:#c2185b; } .src.s1 { background:#e2f4ec; color:#0f7a52; } .src.s2 { background:#e6edff; color:#1557e8; }
.kan i.card2 { display:flex; flex-wrap:wrap; align-items:center; gap:4px 8px; }
.kan i button.mv { margin-left:auto; padding:4px 9px; border:0; border-radius:8px; background:var(--mist); color:var(--brand); font-size:12px; font-weight:700; }
.att .d i { cursor:pointer; }
.att .d i:hover { outline:2px solid var(--brand); outline-offset:1px; }
.pay-btn { padding:5px 10px; border:0; border-radius:9px; background:color-mix(in srgb,var(--brand) 12%,#fff); color:var(--brand); font-size:12px; font-weight:700; }
.pay-btn.sent { background:#e2f4ec; color:var(--ok); cursor:default; }
.tr .acts { display:flex; align-items:center; justify-content:flex-end; gap:8px; }
.phone-m { width:min(240px,100%); margin:0 auto; padding:8px; border-radius:34px; background:var(--ink); box-shadow:0 22px 40px -26px rgba(11,21,51,.6); }
.phone-m .scr { overflow:hidden; border-radius:27px; background:#fff; }
.phone-m .st { height:30px; }
.phone-m .app { padding:6px 14px 14px; }
.phone-m .app-h { display:flex; align-items:center; gap:9px; }
.phone-m .app-h .p-logo { width:30px; height:30px; border-radius:10px; font-size:13px; }
.phone-m .app-c { margin-top:12px; padding:12px; border-radius:16px; background:var(--brand); color:#fff; }
.phone-m .app-c small { opacity:.8; font-size:11px; } .phone-m .app-c b { display:block; margin-top:3px; font-size:14px; }
.phone-m .app-l { margin-top:10px; display:grid; gap:7px; }
.phone-m .app-l div { display:flex; justify-content:space-between; gap:6px; padding:9px 10px; border-radius:11px; background:var(--mist); font-size:12px; font-weight:600; }
.phone-m .app-n { display:flex; justify-content:space-around; padding:9px 4px 11px; border-top:1px solid var(--hair); color:var(--mute); font-size:10px; font-weight:600; }
.phone-m .app-n span.on { color:var(--brand); }
.two { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; align-items:start; }
.p-app.m .two { grid-template-columns:minmax(0,1fr); }
.demo-tag { margin:0 0 0 auto; padding:3px 8px; border-radius:7px; background:#fff6dc; color:#6b4a00; font-size:11px; font-weight:700; white-space:nowrap; }
.sample { margin:2px 0 8px; }

@media (min-width:760px) {
  .feats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .tile.big { flex:0 1 auto; }
  .ba { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .ba-c { grid-template-columns:1fr; gap:6px; }
  .ba-arrow svg { transform:rotate(90deg); }
  .ba-arrow { height:18px; }
  .card { padding:26px 26px 22px; }
  .qz-body { padding-top:30px; }
  .f-card { gap:8px 22px; padding:24px 28px; }
  .f-card img { grid-row:1/3; align-self:start; width:96px; height:96px; border-radius:28px; }
  .f-card div { align-self:end; } .f-card p { grid-column:2; align-self:start; }
  .proof .rail-in img { height:calc(var(--h) * 1.15px); margin-right:60px; }
}
@media (max-width:860px) {
  .plat { height:620px; }
  .frame, .frame.mobile { max-width:none; }
  .fbar { display:none; }
}
@media (prefers-reduced-motion:reduce) { *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition:none !important; } .rail-in { animation:none; } .rail { overflow-x:auto; } }
@keyframes rise { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }
@keyframes pop { from { transform:scale(.3); } 70% { transform:scale(1.15); } to { transform:scale(1); } }
@keyframes shimmer { from { background-position:100% 0; } to { background-position:0 0; } }
@keyframes navin { from { opacity:0; transform:translateX(-16px) scale(.96); } to { opacity:1; transform:none; } }
@keyframes pulse { 50% { box-shadow:0 0 0 5px rgba(21,87,232,.2); } }

/* Телефон: «было → стало» компактнее, чтобы платформа была видна без долгой прокрутки; заголовок экрана платформы переносится */
@media (max-width:759px) {
  .ba { gap:8px; margin-top:16px; }
  .ba-c { grid-template-columns:minmax(0,1fr) 20px minmax(0,1.15fr); gap:6px; }
  .ba-c > div { padding:9px 11px; border-radius:13px; }
  .ba-c small { margin-bottom:2px; font-size:10.5px; }
  .ba-c p { font-size:13px; line-height:1.25; }
  .ba-arrow svg { width:18px; height:18px; }
  .pv-head h1 { font-size:clamp(23px,6.4vw,30px); }
}
.p-app.m .p-head { flex-wrap:wrap; gap:6px 10px; align-items:flex-start; }
.p-app.m .p-head h4 { flex:1 1 100%; }
.p-app.m .p-head .demo-tag { margin-left:0; }
.p-app.m .p-me { display:none; }
.p-app.m .p-brand { padding-bottom:2px; }

/* Вкладки ролей: на телефоне во всю ширину, устройство не выбирается (платформа всегда в телефонном виде), справа градиент-подсказка прокрутки */
.roles-wrap { position:relative; min-width:0; max-width:100%; }
@media (max-width:860px) {
  .pf-bar > div { width:100%; }
  .roles-wrap { flex:1; }
  .roles-wrap::after { content:""; position:absolute; right:0; top:0; bottom:0; width:26px; border-radius:0 11px 11px 0; background:linear-gradient(90deg,rgba(233,236,244,0),#e9ecf4 85%); pointer-events:none; }
  .seg.roles button { padding:6px 9px; font-size:12.5px; }
  .seg.dev { display:none; }
}
.thanks .lnk { flex-wrap:wrap; }
.thanks .lnk > span { flex:1 1 100% !important; }


/* ======================================================================
   Главная как у сборщика: наклонная лента кейсов, hero с одной кнопкой и плитками ниш, блоки ниже
   ====================================================================== */
/* Лента скриншотов действующих платформ: разметка и стили из funnel/prototype/index.html без изменений. */
  .wall { position:relative; height:218px; overflow:hidden; -webkit-mask-image:linear-gradient(#000 78%,transparent); mask-image:linear-gradient(#000 78%,transparent); }
  /* Точка поворота — левый верхний угол: положение видимой части не зависит от длины лент. */
  .wall-in { position:absolute; top:-16px; left:-70px; display:grid; gap:12px; transform:perspective(900px) rotateX(20deg) rotateZ(-6deg) scale(.8); transform-origin:0 0; }
  .wrow { display:flex; width:max-content; animation:drift 40s linear infinite; }
  .wrow.rev { animation-direction:reverse; animation-duration:48s; }
  .wshot { position:relative; flex:none; width:272px; height:170px; margin-right:12px; border-radius:12px; overflow:hidden; background:#fff; box-shadow:0 0 0 1px var(--hair), 0 14px 28px -18px rgba(11,21,51,.55); }
  .wshot > img { display:block; width:100%; height:100%; object-fit:cover; object-position:top left; }
  .wrow.rev .wshot span { top:7px; bottom:auto; }
  .wshot span { position:absolute; left:7px; bottom:7px; max-width:calc(100% - 14px); height:27px; padding:0 9px 0 7px; border-radius:8px; background:#fff; font-size:10.5px; font-weight:500; box-shadow:0 0 0 1px var(--hair), 0 8px 16px -8px rgba(11,21,51,.55); }
.wall + .hero { padding-top:0; }
  .or { margin-top:12px; color:var(--mute); font-size:13.5px; }
  .chips { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:10px; }
  .chip { min-height:42px; padding:10px 14px; border:0; border-radius:999px; background:var(--mist); font-size:14px; font-weight:600; transition:background .15s, color .15s; }
  .chip:hover, .chip:focus-visible { background:#e9ebf0; outline:none; }
  .chip.on { background:var(--pri); color:#fff; }
.hero-cta { margin:22px auto 0; max-width:none; }
.hero .or { margin-top:14px; }
.chips { margin-top:12px; }
.chip.hot { box-shadow:inset 0 0 0 1.5px var(--pri); }
.h-top.over { position:absolute; left:0; right:0; top:0; z-index:5; }
  .stats3 { display:grid; gap:8px; margin-top:20px; text-align:left; }
  .stats3 div { display:grid; grid-template-columns:82px minmax(0,1fr); align-items:center; gap:12px; padding:13px 16px; border-radius:16px; background:#fff; box-shadow:0 0 0 1px var(--hair); }
  .stats3 strong { font:800 27px/1 var(--disp); letter-spacing:-.04em; }
  .stats3 span { color:#3d4660; font-size:13.5px; line-height:1.4; }
  .stats3 span b { color:var(--ink); font-weight:600; }
.stats3 span b { color:var(--ink); font-weight:600; }
.src-note { margin-top:10px; color:var(--mute); font-size:12px; line-height:1.4; text-align:left; }
/* Блоки «Что будет на платформе» и «Как работаем» компактнее, в духе старой страницы */
.sec.compact { margin-top:44px; }
.sec.compact h2 { font-size:clamp(20px,4.2vw,28px); }
.sec.compact .feats { gap:8px; margin-top:16px; }
.sec.compact .feat { padding:14px 14px 12px; border-radius:18px; }
.sec.compact .feat .fi-ic { width:34px; height:34px; border-radius:11px; }
.sec.compact .feat .fi-ic svg { width:18px; height:18px; }
.sec.compact .feat h3 { margin-top:10px; font-size:16px; }
.sec.compact .feat p { margin-top:4px; font-size:13.5px; line-height:1.4; }
.sec.compact .roles-strip { margin-top:10px; padding:12px 14px; border-radius:16px; }
.sec.compact .roles-strip b { font-size:15px; }
.sec.compact .roles-strip span { padding:5px 11px; font-size:12.5px; }
.sec.compact .how > div { padding-bottom:16px; }
.sec.compact .how b { font-size:15.5px; }
.sec.compact .how p { font-size:13.5px; }
.feats.f4 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.last small.k { display:block; color:var(--mute); font-size:13px; }
.s1-wrap { padding-top:8px; }
.s1-wrap .card { margin-top:8px; }
@media (min-width:760px) { .feats.f4 { grid-template-columns:repeat(4,minmax(0,1fr)); } }
.last-in p.src-note { margin-top:10px; color:var(--mute); font-size:12px; line-height:1.4; text-align:center; }

/* Блок «Не шаблон…»: настоящие платформы из кейсов и три строки «что собираю под тебя» */
.sec.wide { max-width:980px; }
.sec.wide > h2, .sec.wide > p.lead { max-width:760px; }
.sub-h { margin:22px 0 10px; font:700 15px var(--disp); letter-spacing:-.02em; }
.pcards { display:flex; gap:12px; margin:0 -20px; padding:2px 20px 10px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.pcards::-webkit-scrollbar { display:none; }
.pcard { flex:0 0 78%; max-width:320px; margin:0; border-radius:16px; overflow:hidden; background:#fff; scroll-snap-align:start; box-shadow:0 0 0 1px var(--hair), 0 20px 30px -24px rgba(11,21,51,.55); }
.pcard img { display:block; width:100%; aspect-ratio:16/10; object-fit:cover; object-position:top left; background:var(--mist); }
.pcard figcaption { display:flex; flex-wrap:wrap; align-items:center; gap:4px 7px; padding:10px 12px; border-top:1px solid var(--hair); color:var(--mute); font-size:12.5px; line-height:1.3; }
.pcard figcaption img { width:auto; height:calc(var(--h) * 1px); aspect-ratio:auto; object-fit:contain; background:none; }
.pcard figcaption b { color:var(--ink); font-weight:700; }
@media (min-width:760px) { .pcards { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin:0; padding:2px 0 8px; overflow:visible; } .pcard { max-width:none; } }
.mine { display:grid; gap:8px; }
.mine > div { padding:13px 14px; border-radius:16px; background:var(--mist); }
.mine b { display:block; font-size:15px; }
.mine p { margin-top:3px; color:#3d4660; font-size:13.5px; line-height:1.45; }
.mine .roles-strip { margin-top:10px; padding:10px 12px; background:linear-gradient(135deg,#1557e8,#4c82ff); }
.mine .roles-strip b { color:#fff; font-size:13.5px; }
@media (min-width:760px) { .mine { grid-template-columns:repeat(3,minmax(0,1fr)); } }

/* ---------- правки 20.10: «Другое» на экране 1, экраны 3-4 и игровая полоска ---------- */
.lk-chips { display:flex; flex-wrap:wrap; gap:6px; }
.lk { display:inline-flex; align-items:center; gap:6px; min-height:38px; padding:0 13px; border:0; border-radius:999px; background:var(--mist); font-size:14px; font-weight:600; color:var(--ink); }
.lk .ic { width:15px; height:15px; }
.lk.on { background:var(--pri); color:#fff; }
.lk-row { display:block; margin-top:10px; }
.lk-row > span { display:block; margin:0 0 5px 2px; color:var(--mute); font-size:12.5px; font-weight:600; }
.free-top { margin-top:18px; padding:14px; border-radius:18px; background:#f5f8ff; box-shadow:inset 0 0 0 1px #dbe5fb; }
.free-top label { display:block; margin-bottom:8px; font-size:14.5px; font-weight:700; }
.free-top textarea.fi { min-height:64px; background:#fff; }
.proc h3 .mtag { display:inline-block; margin-left:8px; padding:2px 8px; border-radius:999px; background:var(--mist); color:var(--mute); font:600 11.5px/1.5 Onest,Arial,sans-serif; letter-spacing:0; vertical-align:2px; }
.proc.child { margin-top:10px; margin-left:14px; box-shadow:0 0 0 1px var(--hair), -6px 0 0 -3px #dbe5fb; }
.rcat { margin-top:22px; }
.rcat h3 { margin-bottom:10px; color:var(--mute); font-size:12.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.rchips { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
@media (max-width:420px) { .rchips { grid-template-columns:1fr; } }
.rchip { position:relative; display:flex; align-items:center; gap:10px; min-height:56px; padding:9px 12px; border:0; border-radius:15px; background:var(--mist); text-align:left; color:var(--ink); transition:background .15s, box-shadow .15s, transform .1s; }
.rchip:active { transform:scale(.98); }
.rchip .ri { display:grid; place-items:center; flex:none; width:32px; height:32px; border-radius:10px; background:#fff; color:var(--pri); }
.rchip .ri .ic { width:17px; height:17px; }
.rchip .rt { min-width:0; } .rchip b { display:block; font-size:14.5px; font-weight:700; line-height:1.2; } .rchip small { display:block; margin-top:2px; color:var(--mute); font-size:12px; line-height:1.25; }
.rchip em { position:absolute; top:-7px; right:8px; padding:1px 7px; border-radius:6px; background:var(--ink); color:#fff; font-size:10.5px; font-weight:700; font-style:normal; }
.rchip em.h { background:#fff; color:var(--pri); box-shadow:0 0 0 1px #c8d6f8; }
.rchip.hot { box-shadow:inset 0 0 0 1.5px #c8d6f8; }
.rchip.on { background:var(--pri); color:#fff; box-shadow:0 10px 20px -12px rgba(21,87,232,.9); }
.rchip.on small { color:rgba(255,255,255,.8); } .rchip.on .ri { background:rgba(255,255,255,.18); color:#fff; }
.rchip.slim { min-height:48px; }
.tray { display:flex; align-items:center; gap:10px; min-height:40px; margin:0 0 8px; padding:6px 12px; border-radius:12px; background:#f5f8ff; color:var(--mute); font-size:13px; }
.tray b { color:var(--pri); }
.tray .tr-ic { display:flex; gap:4px; } .tray .tr-ic:empty { display:none; }
.tray .tr-ic i { display:grid; place-items:center; width:26px; height:26px; border-radius:8px; background:var(--pri); color:#fff; }
.tray .tr-ic i .ic { width:14px; height:14px; }
.tray .tr-ic i.pop { animation:pop .45s cubic-bezier(.2,1.4,.4,1) both; }
@keyframes pop { from { transform:scale(.2) rotate(-20deg); opacity:0; } to { transform:none; opacity:1; } }
@media (prefers-reduced-motion:reduce) { .tray .tr-ic i.pop { animation:none; } }
.qz-prog u { transition:width .35s ease; }

/* ---------- экран 5: концепт, тур, доверие, готовые продукты, липкая кнопка (20.10) ---------- */
.concept { display:flex; flex-wrap:wrap; align-items:center; gap:10px 12px; margin-top:14px; padding:12px 14px; border-radius:16px; background:#fffaf0; box-shadow:inset 0 0 0 1px #f2dfb5; color:#5d4a1d; font-size:14px; line-height:1.45; }
.concept .ci { display:grid; place-items:center; flex:none; width:30px; height:30px; border-radius:10px; background:#fff; color:#b7791f; }
.concept > div { flex:1 1 220px; } .concept b { color:#3f2f0a; }
.concept .btn-ghost { background:#fff; box-shadow:0 0 0 1px #ead39f; color:var(--ink); }
.tour-btn { display:inline-flex; align-items:center; gap:7px; min-height:40px; padding:0 14px; border:0; border-radius:999px; background:var(--ink); color:#fff; font-size:14px; font-weight:700; }
.tour-btn .ic { width:16px; height:16px; fill:currentColor; stroke:none; }
.tour-btn.on { background:#e4572e; }
.frame { position:relative; }
.tour-cap { position:absolute; left:0; right:0; bottom:14px; z-index:6; width:max-content; max-width:calc(100% - 24px); margin:0 auto; padding:7px 14px; border-radius:999px; background:rgba(11,21,51,.88); color:#fff; font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; pointer-events:none; }
.tour-cap.in { animation:rise .35s ease both; }
.trust { max-width:760px; margin:36px auto 0; padding:0 18px; }
.trust h2 { font:800 clamp(21px,4.6vw,28px)/1.15 var(--disp); letter-spacing:-.03em; }
.tr-me { display:flex; align-items:center; gap:12px; margin-top:16px; }
.tr-me img { width:56px; height:56px; border-radius:16px; object-fit:cover; }
.tr-me b { display:block; font-size:16px; } .tr-me span { color:var(--mute); font-size:14px; }
.tr-list { display:grid; gap:10px; margin:16px 0 0; padding:0; list-style:none; }
.tr-list li { display:flex; gap:10px; font-size:15px; line-height:1.45; } .tr-list li .ic { flex:none; width:20px; height:20px; margin-top:1px; color:var(--ok); }
.tr-rail { margin:20px -18px 0; }
.tr-shot { flex:none; width:230px; margin:0 12px 0 0; }
.tr-shot img { display:block; width:100%; height:144px; border-radius:12px; object-fit:cover; object-position:top left; box-shadow:0 0 0 1px var(--hair), 0 14px 26px -18px rgba(11,21,51,.5); }
.tr-shot figcaption { margin-top:7px; color:var(--mute); font-size:12.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .tr-shot figcaption b { color:var(--ink); }
.tr-more { margin-top:16px; width:100%; }
.cases-ov { position:fixed; inset:0; z-index:60; display:grid; place-items:end center; background:rgba(11,21,51,.45); animation:fadein .2s ease both; }
@keyframes fadein { from { opacity:0; } }
.cases-in { width:min(980px,100%); max-height:88vh; overflow:auto; padding:20px 18px 28px; border-radius:24px 24px 0 0; background:#fff; }
@media (min-width:768px) { .cases-ov { place-items:center; } .cases-in { border-radius:24px; } }
.cases-top { display:flex; align-items:center; gap:12px; } .cases-top h2 { flex:1; font:800 21px/1.2 var(--disp); letter-spacing:-.03em; }
.cases-top .x { width:40px; height:40px; border:0; border-radius:12px; background:var(--mist); font-size:24px; line-height:1; color:var(--ink); }
.cases-in > p { margin-top:6px; color:var(--mute); font-size:14.5px; }
.cases-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px; margin-top:16px; }
.cases-grid figure { margin:0; } .cases-grid img { display:block; width:100%; aspect-ratio:16/10; height:auto; border-radius:14px; object-fit:cover; object-position:top left; box-shadow:0 0 0 1px var(--hair); }
.cases-grid figcaption { margin-top:8px; font-size:14px; } .cases-grid figcaption span { display:block; color:var(--mute); font-size:13px; }
.pv-sticky { position:fixed; left:0; right:0; bottom:0; z-index:30; display:flex; gap:8px; padding:10px 14px calc(10px + env(safe-area-inset-bottom)); background:rgba(255,255,255,.96); box-shadow:0 -1px 0 var(--hair), 0 -14px 30px -20px rgba(11,21,51,.35); transform:translateY(110%); transition:transform .25s ease; }
.pv-sticky.on { transform:none; }
.pv-sticky .cta-wa { flex:1 1 auto; margin:0; min-height:50px; padding:0 12px; font-size:15px; white-space:nowrap; }
.pv-sticky button { flex:none; width:96px; min-height:50px; padding:0 8px; border:0; border-radius:14px; background:var(--mist); font-size:12.5px; font-weight:700; line-height:1.2; color:var(--ink); }
@media (min-width:768px) { .pv-sticky { left:50%; right:auto; bottom:16px; width:520px; margin-left:-260px; border-radius:18px; box-shadow:0 0 0 1px var(--hair), 0 18px 40px -20px rgba(11,21,51,.45); } }
.pv { padding-bottom:84px; }
/* Меню платформы на телефоне: сверху лентой крупных кнопок, а не мелкой полоской внизу рамки. */
.p-app.m .p-navs { position:static; order:2; flex:1 1 100%; display:flex; gap:6px; margin:4px -14px 0; padding:2px 14px 6px; background:none; box-shadow:none; overflow-x:auto; scroll-snap-type:x proximity; -webkit-mask-image:linear-gradient(90deg,#000 88%,transparent); mask-image:linear-gradient(90deg,#000 88%,transparent); }
.p-app.m .p-nav { flex:none; flex-direction:row; gap:7px; min-width:0; min-height:42px; padding:0 14px; border-radius:999px; background:var(--mist); font-size:13.5px; font-weight:600; color:var(--ink); scroll-snap-align:start; }
.p-app.m .p-nav svg { width:17px; height:17px; }
.p-app.m .p-nav.on { background:var(--brand); color:#fff; }
.p-app.m .p-nav em { position:static; margin-left:2px; padding:1px 6px; font-size:9.5px; }
.p-app.m .p-nav.on em { background:#fff; color:var(--brand); }
.p-app.m .p-body { padding-bottom:20px; }
/* Карточки-доказательства: все видны сразу. На телефоне строками (превью слева), на компьютере тремя колонками. Нажатие открывает крупно. */
.proofs { display:grid; gap:10px; margin-top:18px; }
.pf-card { display:grid; grid-template-columns:42% minmax(0,1fr); align-items:center; gap:12px; width:100%; padding:8px; border:0; border-radius:16px; background:#fff; box-shadow:0 0 0 1px var(--hair), 0 14px 26px -20px rgba(11,21,51,.45); text-align:left; color:var(--ink); cursor:zoom-in; }
.pf-img { display:block; aspect-ratio:16/10; border-radius:10px; overflow:hidden; background:var(--mist); box-shadow:0 0 0 1px var(--hair); }
.pf-img img { display:block; width:100%; height:100%; object-fit:cover; object-position:top left; }
.pf-t { display:flex; flex-direction:column; gap:3px; min-width:0; }
.pf-card b { font-size:15px; font-weight:700; line-height:1.25; }
.pf-card small { color:var(--mute); font-size:12.5px; line-height:1.35; }
@media (min-width:760px) { .proofs { grid-template-columns:repeat(3,minmax(0,1fr)); } .pf-card { grid-template-columns:1fr; align-items:start; gap:10px; padding:8px 8px 14px; } .pf-t { padding:0 4px; } }
.home .trust { margin-top:56px; }
.img-in { max-width:900px; }

/* Контакт: главное действие — номер, WhatsApp вторым (решение Ильяса 20.10) */
.phone-f.main { margin-top:18px; padding-top:0; border-top:0; }
.phone-f.main label { color:var(--ink); font-size:15px; font-weight:700; }
.phone-f.main input { width:100%; height:54px; font-size:17px; }
.phone-f.main .btn-main { width:100%; min-height:56px; margin-top:10px; background:var(--pri); box-shadow:0 14px 26px -14px rgba(21,87,232,.8); }
.ct-or { display:flex; align-items:center; gap:12px; margin:16px 0 0; color:var(--mute); font-size:13px; } .ct-or::before, .ct-or::after { content:""; flex:1; height:1px; background:var(--hair); }
.cta-wa.soft { margin-top:12px; background:#fff; color:#128c4a; box-shadow:inset 0 0 0 1.5px #9edbb8; }
.pv-sticky .st-main { flex:1 1 auto; display:flex; align-items:center; justify-content:center; gap:8px; width:auto; min-height:52px; border:0; border-radius:14px; background:var(--pri); color:#fff; font-size:16px; font-weight:700; line-height:1; box-shadow:0 12px 24px -14px rgba(21,87,232,.8); }
.pv-sticky .st-main .ic { width:18px; height:18px; }
.pv-sticky .st-wa { flex:none; display:grid; place-items:center; width:52px; min-height:52px; border-radius:14px; background:#fff; color:#128c4a; box-shadow:inset 0 0 0 1.5px #9edbb8; }
.pv-sticky .st-wa .ic { width:22px; height:22px; }

/* Блок доверия на фото Ильяса: тёмный, фото уходит в чёрный, оранжевый акцент (#f2a13d, как в каруселях) */
.trust.dark { --or:#f2a13d; max-width:none; margin:44px 0 0; padding:0; background:#06070a; color:#fff; overflow:hidden; }
.trust.dark .tr-photo { position:relative; height:min(165vw,700px); background-size:cover; background-position:center 40%; }
.trust.dark .tr-photo::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(6,7,10,.25) 0%,rgba(6,7,10,.05) 30%,rgba(6,7,10,.2) 62%,rgba(6,7,10,.88) 86%,#06070a 100%); }
.trust.dark .tr-body { position:relative; z-index:1; max-width:760px; margin:-130px auto 0; padding:0 18px 34px; }
.trust.dark .tr-eyebrow { display:block; color:var(--or); font:700 12px/1.3 Onest,Arial,sans-serif; letter-spacing:.14em; text-transform:uppercase; }
.trust.dark h2 { margin-top:8px; color:#fff; font:800 clamp(28px,7.4vw,46px)/1.05 var(--disp); letter-spacing:-.035em; text-transform:uppercase; text-wrap:balance; }
.trust.dark .tr-kpi { margin-top:12px; color:var(--or); font-size:15px; font-weight:800; letter-spacing:.02em; text-transform:uppercase; }
.trust.dark .tr-lead { margin-top:6px; color:rgba(255,255,255,.72); font-size:15px; }
.trust.dark .tr-list li { color:rgba(255,255,255,.82); } .trust.dark .tr-list li b { color:#fff; } .trust.dark .tr-list li .ic { color:var(--or); }
.trust.dark .pf-card { background:rgba(255,255,255,.06); box-shadow:inset 0 0 0 1px rgba(255,255,255,.12); color:#fff; }
.trust.dark .pf-card b { color:#fff; } .trust.dark .pf-card small { color:rgba(255,255,255,.62); }
.trust.dark .pf-img { background:#111; box-shadow:0 0 0 1px rgba(255,255,255,.1); }
.trust.dark .tr-rail { margin-top:24px; } .trust.dark .tr-shot figcaption { color:rgba(255,255,255,.55); } .trust.dark .tr-shot figcaption b { color:#fff; }
.trust.dark .tr-shot img { box-shadow:0 0 0 1px rgba(255,255,255,.1); }
@media (min-width:900px) {
  .trust.dark { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); max-width:1180px; margin:56px auto 0; border-radius:28px; }
  .trust.dark .tr-photo { order:2; height:auto; min-height:680px; background-position:center 30%; }
  .trust.dark .tr-photo::after { background:linear-gradient(90deg,#06070a 0%,rgba(6,7,10,.55) 22%,rgba(6,7,10,.05) 60%); }
  .trust.dark .tr-body { order:1; margin:0; max-width:none; padding:48px 40px 40px; }
  .trust.dark .tr-rail { margin-right:-40px; margin-left:-40px; }
}
.home .trust.dark { margin-top:56px; }

/* ===== Платформа в превью: вид рабочего продукта (эталон Ильяса — макет Umtyl, 19.10.2026) =====
   Светло-серая подложка, белые карточки с тонкой рамкой и мягкой тенью, активный пункт меню мягкой заливкой цвета школы,
   цветные плитки иконок, заголовки Onest. Цвет школы приходит в --brand. */
.p-app, .p-site { --pbg:#F6F7FB; --pline:#E9EBF2; --psoft:#5B6275; --pfaint:#8A90A2; --bsoft:color-mix(in srgb,var(--brand) 11%,#fff); --psh:0 1px 2px rgba(20,24,40,.04),0 4px 16px rgba(20,24,40,.05); font-family:Onest,Arial,sans-serif; }
.p-app { background:var(--pbg); }
.p-app .p-side { background:#fff; border-right:1px solid var(--pline); padding:18px 12px; gap:2px; }
.p-app .p-brand { padding:2px 6px 18px; }
.p-app .p-brand b { font:700 15px/1.2 Onest,Arial,sans-serif; letter-spacing:-.01em; }
.p-app .p-logo { border-radius:12px; font-family:Onest,Arial,sans-serif; }
.p-app .p-nav { padding:10px 12px; border-radius:12px; color:var(--psoft); font-weight:500; }
.p-app .p-nav:hover { background:#F3F4F8; color:var(--ink); }
.p-app .p-nav.on { background:var(--bsoft); color:var(--brand); font-weight:650; }
.p-app .p-nav em { background:var(--bsoft); color:var(--brand); border-radius:999px; padding:2px 8px; }
.p-app .p-nav.on em { background:var(--brand); color:#fff; }
.p-app .p-main { background:var(--pbg); }
.p-app .p-head { padding:22px 28px 6px; }
.p-app .p-head h4 { font:800 23px/1.2 Onest,Arial,sans-serif; letter-spacing:-.025em; }
.p-app .p-body { gap:16px; padding:12px 28px 28px; }
.p-app .blk { background:#fff; border:1px solid var(--pline); border-radius:18px; box-shadow:var(--psh); padding:18px 20px; }
.p-app .blk .blk { box-shadow:none; background:var(--pbg); border-color:transparent; }
.p-app .lbl { color:var(--pfaint); font-weight:600; }
.p-app h5 { font-family:Onest,Arial,sans-serif; }
.p-app .stats { gap:12px; }
.p-app .stats > div, .p-app .stats > div:first-child { padding:16px 18px; border:1px solid var(--pline); border-radius:18px; background:#fff; box-shadow:var(--psh); }
.p-app .stats b { font:800 28px/1.1 Onest,Arial,sans-serif; letter-spacing:-.025em; }
.p-app .week > div { background:#fff; border:1px solid var(--pline); }
.av { line-height:1; }
.demo-tag { display:inline-block; padding:3px 10px; border-radius:999px; background:#F1F2F6; color:var(--pfaint,#8A90A2); font-size:11.5px; font-weight:600; white-space:nowrap; }
/* Обзор владельца */
.ki { display:grid; place-items:center; flex:none; width:40px; height:40px; border-radius:12px; font-style:normal; }
.ki .ic { width:19px; height:19px; }
.t-brand { background:var(--bsoft); color:var(--brand); } .t-info { background:#E8EDFD; color:#3554D1; } .t-violet { background:#EFEAFD; color:#6B4FD8; }
.t-warn { background:#FFF2DC; color:#A8650A; } .t-bad { background:#FDE7E5; color:#C2413A; } .t-ok { background:#E3F5EC; color:#1F8A5B; }
.kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.kp { display:flex; gap:12px; align-items:flex-start; min-width:0; padding:16px 16px 14px; border:1px solid var(--pline); border-radius:18px; background:#fff; box-shadow:var(--psh); }
.kp > div { min-width:0; } .kp span { display:block; color:var(--psoft); font-size:13px; }
.kp b { display:block; margin-top:2px; font:800 27px/1.15 Onest,Arial,sans-serif; letter-spacing:-.025em; }
.kp small { display:block; margin-top:2px; color:var(--pfaint); font-size:12.5px; font-weight:600; }
.kp small.pos, .gt .pos, em.t-ok { color:#1F8A5B; } .kp small.neg, .gt .neg { color:#C2413A; } .kp small.warn { color:#A8650A; }
.home2 { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(0,1fr); gap:16px; align-items:start; }
.bh { display:flex; align-items:center; gap:8px; margin-bottom:12px; color:var(--brand); } .bh .ic { width:18px; height:18px; } .bh h5 { color:var(--ink); font-size:16px; }
.gt { display:grid; } .gt-r { display:grid; grid-template-columns:minmax(0,1.8fr) minmax(0,1fr) 66px minmax(0,1.25fr) 46px; align-items:center; gap:10px; padding:11px 8px; border-top:1px solid var(--pline); font-size:13.5px; }
.gt-r b { font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .gt-r span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.gt-h { border-top:0; padding-top:0; color:var(--pfaint); font-size:11.5px; font-weight:700; letter-spacing:.02em; }
.gt-r:nth-child(2) { background:var(--bsoft); border-radius:10px; border-top-color:transparent; }
.mini { display:inline-block; width:44px; height:6px; margin-right:8px; border-radius:6px; background:#E9EBF2; vertical-align:middle; overflow:hidden; } .mini u { display:block; height:100%; background:var(--brand); border-radius:6px; }
.at-r { display:flex; align-items:center; gap:12px; padding:11px 2px; border-top:1px solid var(--pline); } .bh + .at-r { border-top:0; }
.at-r > div { flex:1; min-width:0; } .at-r b { display:block; font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .at-r small { display:block; color:var(--psoft); font-size:12.5px; line-height:1.35; }
.at-r em { font-style:normal; font-weight:800; font-size:13px; background:none !important; white-space:nowrap; }
.p-app.m .kpis { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } .p-app.m .kp { flex-direction:column; gap:8px; padding:14px; } .p-app.m .kp b { font-size:23px; }
.p-app.m .home2 { grid-template-columns:minmax(0,1fr); }
.p-app.m .gt-r { grid-template-columns:minmax(0,1.4fr) 54px minmax(0,1fr); } .p-app.m .gt-r > :nth-child(2), .p-app.m .gt-r > :nth-child(5) { display:none; } .p-app.m .mini { display:none; }
@media (max-width:1100px) { .kpis { grid-template-columns:repeat(2,minmax(0,1fr)); } .home2 { grid-template-columns:minmax(0,1fr); } }
/* Сайт школы: шапка сайта, первый экран с фото справа, карточки программ, полоса записи */
.p-site { height:100%; display:flex; flex-direction:column; background:#fff; }
.ps-top { display:flex; align-items:center; gap:12px; padding:14px 28px; border-bottom:1px solid var(--pline); background:#fff; }
.ps-top > b { font:800 16px/1.2 Onest,Arial,sans-serif; letter-spacing:-.01em; white-space:nowrap; }
.ps-top .p-logo { border-radius:12px; }
.ps-top nav { display:flex; gap:4px; margin-left:auto; } .ps-top nav > * { padding:8px 12px; border:0; border-radius:10px; background:none; color:var(--psoft); font-size:14px; font-weight:500; white-space:nowrap; }
.ps-top nav button.on { background:var(--bsoft); color:var(--brand); font-weight:650; } .ps-top nav button:not(.on):hover { background:#F3F4F8; }
.ps-in { padding:9px 16px; border-radius:11px; background:var(--brand); color:#fff; font-size:14px; font-weight:650; white-space:nowrap; }
.ps-body { padding:24px 28px 30px; gap:28px; background:#fff; }
.ps-hero { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:28px; align-items:center; }
.ps-ht small { display:block; margin-top:12px; color:var(--brand); font-size:13px; font-weight:700; }
.ps-ht h3 { margin-top:6px; font:800 clamp(28px,3.6vw,44px)/1.04 Onest,Arial,sans-serif; letter-spacing:-.035em; text-wrap:balance; }
.ps-ht p { margin-top:12px; max-width:30em; color:var(--psoft); font-size:15.5px; line-height:1.5; }
.ps-btns { margin-top:20px; } .ps-btns .sw-btn { width:auto; margin:0; padding:13px 20px; border-radius:13px; background:var(--brand); color:#fff; font-size:15px; font-weight:700; }
.ps-facts { display:flex; gap:26px; margin-top:24px; padding-top:18px; border-top:1px solid var(--pline); }
.ps-facts b { display:block; font:800 22px/1.1 Onest,Arial,sans-serif; letter-spacing:-.02em; } .ps-facts small { color:var(--pfaint); font-size:12.5px; }
.ps-hp { position:relative; aspect-ratio:4/3.4; border-radius:24px; overflow:hidden; background:var(--bsoft); }
.ps-hp img { width:100%; height:100%; object-fit:cover; display:block; }
.ps-badge { position:absolute; left:14px; bottom:14px; display:flex; align-items:center; gap:10px; padding:10px 14px 10px 12px; border-radius:14px; background:#fff; box-shadow:0 12px 30px -12px rgba(20,24,40,.35); color:var(--brand); }
.ps-badge .ic { width:18px; height:18px; } .ps-badge b { display:block; color:var(--ink); font-size:13.5px; } .ps-badge small { display:block; color:var(--pfaint); font-size:12px; }
.ps-h { font:800 21px/1.2 Onest,Arial,sans-serif; letter-spacing:-.02em; margin-bottom:14px; }
.ps-cards .cv { height:150px; border-radius:18px; } .ps-cards h5 { margin-top:12px; font-size:16px; } .ps-cards p { color:var(--psoft); font-size:13.5px; }
.ps-band { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:20px 22px; border-radius:20px; background:var(--bsoft); }
.ps-band p { margin-top:3px; color:var(--psoft); font-size:14px; } .ps-band .pbtn { margin:0; padding:12px 18px; font-size:14.5px; white-space:nowrap; }
/* сайт на телефоне */
.p-site.m .ps-top { flex-wrap:wrap; padding:12px 14px; gap:10px; } .p-site.m .ps-top nav { order:3; flex:1 1 100%; margin:0 -14px; padding:0 14px; overflow-x:auto; scrollbar-width:none; } .p-site.m .ps-top nav::-webkit-scrollbar { display:none; }
.p-site.m .ps-in { margin-left:auto; padding:8px 13px; font-size:13px; }
.p-site.m .ps-body { padding:16px 14px 24px; gap:22px; }
.p-site.m .ps-hero { grid-template-columns:minmax(0,1fr); gap:16px; } .p-site.m .ps-hp { order:-1; aspect-ratio:4/3; border-radius:18px; }
.p-site.m .ps-facts { gap:18px; } .p-site.m .ps-facts b { font-size:18px; }
.p-site.m .ps-btns .sw-btn { width:100%; }
.p-site.m .ps-cards { grid-template-columns:minmax(0,1fr); gap:14px; } .p-site.m .ps-cards .cv { height:150px; } .p-site.m .ps-cards p { display:block; }
.p-site.m .ps-band { flex-direction:column; align-items:stretch; } .p-site.m .ps-band .pbtn { text-align:center; }
@media (max-width:1100px) { .ps-top nav > span { display:none; } }
/* телефон: плитки обзора строкой (иконка слева), таблица групп без шапки, у сайта нет строки меню из одного пункта */
.p-app.m .kp { flex-direction:row; align-items:center; gap:10px; padding:12px; } .p-app.m .kp .ki { width:34px; height:34px; border-radius:10px; } .p-app.m .kp span { font-size:12px; } .p-app.m .kp b { font-size:21px; } .p-app.m .kp small { font-size:11.5px; }
.p-app.m .gt-h { display:none; } .p-app.m .gt-r { grid-template-columns:minmax(0,1fr) auto auto; gap:12px; } .p-app.m .gt-r > :nth-child(3)::after { content:" уч."; color:var(--pfaint); }
.p-site.m .ps-top nav:not(:has(button + button)) { display:none; }