:root{--ink:#17202a;--muted:#617080;--canvas:#f5f7fa;--surface:#fff;--primary:#12579a;--primary-dark:#0d477f;--primary-soft:#e2edf9;--line:#d7dee7;--mint:#e5f5ef;--gold:#f4df9c;--danger:#a63b30;--danger-soft:#f9e8e5;--shadow:0 24px 70px rgba(22,66,108,.12)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--canvas);font-family:Roboto,"Segoe UI Variable","Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}.skip-link{position:fixed;z-index:100;top:8px;left:8px;padding:12px 16px;color:#fff;background:var(--primary);border-radius:10px;transform:translateY(-150%)}.skip-link:focus{transform:none}
.site-header{width:min(1180px,calc(100% - 40px));min-height:80px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{min-height:48px;display:inline-flex;align-items:center;gap:12px;font-size:1.08rem;font-weight:760;letter-spacing:-.02em}.brand img{display:block}.header-action{min-height:48px;padding:0 18px;display:inline-flex;align-items:center;gap:10px;color:var(--primary);background:var(--primary-soft);border-radius:14px;font-size:.82rem;font-weight:780}.header-action:focus-visible,.primary-action:focus-visible,.brand:focus-visible{outline:3px solid rgba(18,87,154,.28);outline-offset:3px}
.hero{width:min(1180px,calc(100% - 40px));min-height:calc(100vh - 80px);margin:auto;padding:64px 0 110px;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr);align-items:center;gap:70px}.kicker,.step-number{margin:0 0 20px;color:var(--primary);font-size:.7rem;font-weight:850;letter-spacing:.14em;text-transform:uppercase}.hero h1{max-width:720px;margin:0;font-size:clamp(3.8rem,6.7vw,7rem);line-height:.9;letter-spacing:-.068em}.hero h1 em{display:block;color:var(--primary);font-style:normal}.hero-lead{max-width:660px;margin:30px 0 0;color:var(--muted);font-size:clamp(1rem,1.5vw,1.18rem);line-height:1.7}.primary-action{width:max-content;min-height:54px;margin-top:34px;padding:0 22px;display:inline-flex;align-items:center;gap:20px;color:#fff;background:var(--primary);border-radius:16px;font-size:.84rem;font-weight:800;box-shadow:0 12px 28px rgba(18,87,154,.23);transition:transform .18s,background .18s}.primary-action:hover{background:var(--primary-dark);transform:translateY(-2px)}
.hero-visual{position:relative;min-height:560px;display:grid;place-items:center;isolation:isolate}.glow{position:absolute;z-index:-2;width:490px;height:490px;background:linear-gradient(145deg,#0a4887,#2479bb);border-radius:44% 56% 49% 51%/50% 43% 57% 50%;transform:rotate(-8deg);box-shadow:var(--shadow)}.glow::before,.glow::after{content:"";position:absolute;border:1px solid rgba(255,255,255,.24);border-radius:50%}.glow::before{inset:45px}.glow::after{inset:105px}.hero-card{position:absolute;width:290px;padding:22px;color:var(--ink);background:rgba(255,255,255,.97);border:1px solid rgba(255,255,255,.8);border-radius:23px;box-shadow:0 22px 55px rgba(4,37,74,.22)}.teacher-card{top:80px;left:25px;transform:rotate(-4deg)}.student-card{right:10px;bottom:64px;transform:rotate(4deg)}.card-label{display:flex;align-items:center;gap:9px;color:var(--muted);font-size:.67rem;font-weight:760}.avatar{width:28px;height:28px;display:grid;place-items:center;color:#fff;background:var(--primary);border-radius:9px}.avatar.student{color:#654e07;background:var(--gold)}.hero-card>p{margin:24px 0 20px;font-size:1.08rem;font-weight:800;letter-spacing:-.02em}.hero-card-row{display:flex;align-items:center;justify-content:space-between}.hero-card-row strong{font-size:1.4rem}.hero-card-row span{padding:6px 8px;color:var(--muted);background:#edf1f5;border-radius:9px;font-size:.66rem;font-weight:750}.change-pill,.notice{width:max-content;margin-top:18px;padding:7px 10px;color:var(--primary);background:var(--primary-soft);border-radius:999px;font-size:.64rem;font-weight:800}.notice{margin:17px 0 -6px}.sync-mark{z-index:4;width:52px;height:52px;display:grid;place-items:center;color:var(--primary);background:#fff;border:6px solid var(--canvas);border-radius:50%;font-size:1.15rem;font-weight:800;box-shadow:0 8px 20px rgba(12,62,110,.14)}
.story{padding:130px 0}.section-heading{width:min(1180px,calc(100% - 40px));margin:0 auto 110px}.section-heading h2,.summary h2,.closing h2{margin:0;font-size:clamp(3rem,6vw,6.2rem);line-height:.92;letter-spacing:-.065em}.story-step{width:min(1180px,calc(100% - 40px));margin:0 auto;padding:110px 0;display:grid;grid-template-columns:minmax(280px,.68fr) minmax(0,1.32fr);gap:76px;align-items:center;border-top:1px solid var(--line)}.step-copy{align-self:start;position:sticky;top:36px}.step-copy h3{max-width:500px;margin:0;font-size:clamp(2rem,3.8vw,3.8rem);line-height:1;letter-spacing:-.052em}.step-copy>p:last-child,.summary-copy>p:last-child{max-width:510px;margin:24px 0 0;color:var(--muted);font-size:.94rem;line-height:1.7}
.comparison{min-width:0;display:grid;grid-template-columns:1.15fr auto .85fr;align-items:center;gap:18px}.phone{min-height:330px;padding:23px;background:#fff;border:1px solid var(--line);border-radius:28px;box-shadow:0 18px 50px rgba(25,62,99,.09)}.student-phone{min-height:270px}.phone-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}.phone-title span{font-weight:820}.phone-title small,.role{color:var(--muted);font-size:.65rem;font-weight:760}.lesson{padding:18px 0;display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:12px;border-top:1px solid #edf1f5}.lesson:first-of-type{border-top:0}.lesson.muted{opacity:.62}.subject-mark{width:42px;height:42px;display:grid;place-items:center;color:#fff;background:var(--primary);border-radius:13px;font-size:.66rem;font-weight:820}.subject-mark.pale{color:var(--primary);background:var(--primary-soft)}.lesson div{min-width:0}.lesson strong,.lesson small{display:block}.lesson strong{font-size:.76rem}.lesson small{margin-top:5px;color:var(--muted);font-size:.61rem}.lesson b{font-size:.82rem}.direction,.flow-arrow{width:46px;height:46px;display:grid;place-items:center;color:var(--primary);background:var(--primary-soft);border-radius:50%;font-weight:850}
.action-flow{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px}.action-card{min-height:350px;padding:26px;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:27px;box-shadow:0 18px 50px rgba(25,62,99,.08)}.action-card>.role{margin-bottom:38px;text-transform:uppercase;letter-spacing:.08em}.action-card>strong{font-size:1.12rem;letter-spacing:-.02em}.facts{margin:22px 0;display:flex;align-items:center;gap:9px;flex-wrap:wrap}.facts span{padding:7px 9px;color:var(--muted);background:#eff3f7;border-radius:9px;font-size:.66rem;font-weight:750}.facts b{font-size:1.2rem}.fake-button{min-height:48px;margin-top:auto;display:grid;place-items:center;color:#fff;background:var(--primary);border-radius:14px;font-size:.72rem;font-weight:800}.action-card>small{margin-top:10px;color:var(--muted);text-align:center}.status-banner{width:max-content;padding:8px 11px;color:var(--primary);background:var(--primary-soft);border-radius:999px;font-size:.68rem;font-weight:820}.result-card>p,.cancelled-card>p{margin:18px 0;color:var(--muted);font-size:.72rem}.danger{background:var(--danger)}.danger-status{color:var(--danger);background:var(--danger-soft)}.crossed{text-decoration:line-through;opacity:.55}.outline{color:var(--primary);background:#fff;border:1px solid #a9bfd4}.attendance-card{justify-content:flex-start}.stats{margin-top:34px;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.stats div{padding:14px 8px;text-align:center;background:#f0f4f8;border-radius:15px}.stats b,.stats small{display:block}.stats b{font-size:1.5rem}.stats small{margin-top:5px;color:var(--muted);font-size:.54rem}.feedback{border-bottom:1px solid var(--line)}
.summary{width:min(1180px,calc(100% - 40px));margin:0 auto 140px;padding:90px;display:grid;grid-template-columns:.9fr 1.1fr;gap:90px;color:#fff;background:var(--primary);border-radius:42px;box-shadow:var(--shadow)}.summary .step-number{color:#cbe4fb}.summary-copy>p:last-child{color:rgba(255,255,255,.7)}.summary-list{display:grid}.summary-list article{padding:24px 0;display:grid;grid-template-columns:44px 1fr;gap:18px;border-top:1px solid rgba(255,255,255,.18)}.summary-list article:first-child{border-top:0}.summary-list>article>span{width:36px;height:36px;display:grid;place-items:center;color:var(--primary);background:#fff;border-radius:12px;font-size:.65rem;font-weight:850}.summary-list h3,.summary-list p{margin:0}.summary-list h3{font-size:1rem}.summary-list p{margin-top:7px;color:rgba(255,255,255,.68);font-size:.74rem;line-height:1.55}
.closing{width:min(980px,calc(100% - 40px));margin:0 auto;padding:40px 0 150px;text-align:center}.closing>img{margin-bottom:25px}.closing .kicker{margin-bottom:22px}.closing h2{max-width:900px;margin:auto}.closing>p:not(.kicker){max-width:670px;margin:28px auto 0;color:var(--muted);line-height:1.7}.closing .primary-action{margin-right:auto;margin-left:auto}.light{color:var(--primary);background:var(--primary-soft);box-shadow:none}.light:hover{color:#fff}footer{width:min(1180px,calc(100% - 40px));min-height:100px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:24px;color:var(--muted);border-top:1px solid var(--line);font-size:.72rem}.footer-brand{color:var(--ink)}
@media(max-width:920px){.hero{padding-top:44px;grid-template-columns:1fr;gap:30px}.hero h1{font-size:clamp(3.2rem,10vw,5.5rem)}.hero-visual{min-height:530px}.story-step{grid-template-columns:1fr;gap:48px}.step-copy{position:static}.summary{padding:64px;grid-template-columns:1fr;gap:50px}.comparison,.action-flow{max-width:760px}.teacher-card{left:12%}.student-card{right:10%}}
@media(max-width:620px){.site-header{width:calc(100% - 28px)}.header-action{width:48px;padding:0;justify-content:center;font-size:0}.header-action span{font-size:1rem}.hero{width:calc(100% - 28px);padding:38px 0 78px}.hero h1{font-size:clamp(2.8rem,14vw,4rem)}.hero-lead{font-size:.92rem}.primary-action{width:100%;justify-content:space-between}.hero-visual{min-height:470px}.glow{width:350px;height:390px}.hero-card{width:245px;padding:18px}.teacher-card{top:52px;left:0}.student-card{right:0;bottom:40px}.section-heading,.story-step,.summary,.closing,footer{width:calc(100% - 28px)}.story{padding:85px 0}.section-heading{margin-bottom:70px}.story-step{padding:78px 0}.section-heading h2,.summary h2,.closing h2{font-size:clamp(2.6rem,13vw,4.2rem)}.step-copy h3{font-size:clamp(2rem,10vw,3rem)}.comparison,.action-flow{grid-template-columns:1fr}.direction,.flow-arrow{margin:auto;transform:rotate(90deg)}.reverse-flow .flow-arrow{transform:rotate(-90deg)}.phone{min-height:0}.action-card{min-height:310px}.summary{margin-bottom:100px;padding:48px 24px;border-radius:30px}.closing{padding-bottom:100px}footer{padding:26px 0;align-items:flex-start;flex-direction:column}}
@media(max-width:390px){.hero-visual{min-height:430px}.glow{width:310px;height:350px}.hero-card{width:220px}.teacher-card{top:44px}.student-card{bottom:35px}.sync-mark{width:46px;height:46px}.lesson{grid-template-columns:38px minmax(0,1fr) auto}.subject-mark{width:38px;height:38px}.stats{grid-template-columns:1fr}.action-card{min-height:0}.fake-button{margin-top:28px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.primary-action{transition:none}}

/* Иллюстрации повторяют структуру реальных мобильных экранов Tutor Pack. */
.device{position:relative;overflow:hidden;border:7px solid #26313c!important;border-radius:38px!important;box-shadow:0 24px 58px rgba(20,45,70,.17)!important}.device::after{content:"";position:absolute;inset:0;pointer-events:none;border:1px solid rgba(255,255,255,.35);border-radius:30px}.device-speaker{position:absolute;z-index:5;top:7px;left:50%;width:62px;height:5px;background:#26313c;border-radius:99px;transform:translateX(-50%)}.app-bar{flex:0 0 48px;height:48px;margin:-5px -5px 20px;display:grid;grid-template-columns:32px 1fr 32px;align-items:center;text-align:center;border-bottom:1px solid #e7ecf2}.app-bar img{width:28px;height:28px}.app-bar strong{font-size:.72rem}.app-bar>span{width:29px;height:29px;display:grid;place-items:center;color:var(--primary);background:var(--primary-soft);border-radius:50%;font-size:.65rem;font-weight:800}.phone.device{min-height:390px;padding:16px 17px 24px}.student-phone.device{min-height:340px}.action-card.device{min-height:430px;padding:16px 20px 22px;background:#fff}.action-card.device>.role{margin-bottom:28px}
@media(max-width:620px){.action-card.device{min-height:390px}.phone.device{min-height:0}}

/* Скорректированный масштаб бренда, текста и мобильных демонстраций. */
.site-header{min-height:94px}.brand{gap:15px;font-size:1.28rem}.brand>img{width:58px;height:58px}.hero{min-height:calc(100vh - 94px);padding-top:54px}.hero h1{max-width:680px;font-size:clamp(3.25rem,5.15vw,5.35rem);line-height:.96;letter-spacing:-.056em}.hero-lead{max-width:690px;font-size:1.06rem}.section-heading h2,.summary h2,.closing h2{font-size:clamp(2.8rem,4.7vw,4.9rem);line-height:.98}.step-copy h3{font-size:clamp(1.85rem,3vw,3rem);line-height:1.06}.step-copy>p:last-child,.summary-copy>p:last-child{font-size:1rem;line-height:1.75}
.hero-visual{min-height:650px}.glow{width:520px;height:540px}.hero-card{width:226px;min-height:470px;padding:58px 18px 72px;border:7px solid #26313c;border-radius:38px;display:flex;flex-direction:column;justify-content:flex-start}.hero-card::before{content:"";position:absolute;top:14px;left:50%;width:62px;height:6px;background:#26313c;border-radius:99px;transform:translateX(-50%)}.hero-card::after{content:"Главная     Занятия     События";position:absolute;right:0;bottom:0;left:0;height:54px;padding-top:16px;color:#667483;background:#fff;border-top:1px solid #e4eaf1;text-align:center;font-size:.48rem;font-weight:700;word-spacing:7px}.teacher-card{top:52px;left:34px;transform:rotate(-3deg)}.student-card{right:20px;bottom:32px;transform:rotate(3deg)}.hero-card>p{margin-top:44px}.hero-card-row{margin-top:10px}.change-pill,.notice{margin-top:28px}.sync-mark{width:58px;height:58px}
.comparison{grid-template-columns:minmax(260px,1fr) auto minmax(260px,1fr);gap:22px}.phone.device,.student-phone.device{width:100%;min-height:600px;padding:24px 22px 76px;border-width:8px!important;border-radius:44px!important}.phone.device .app-bar{height:58px;margin:-5px -5px 30px}.phone-title span{font-size:1.05rem}.phone-title small{font-size:.72rem}.lesson{padding:24px 0;grid-template-columns:50px minmax(0,1fr) auto;gap:14px}.subject-mark{width:50px;height:50px;border-radius:16px}.lesson strong{font-size:.84rem}.lesson small{font-size:.67rem}.lesson b{font-size:.92rem}
.action-flow{grid-template-columns:minmax(260px,1fr) auto minmax(260px,1fr);gap:22px}.action-card.device{width:100%;min-height:610px;padding:24px 22px 30px;border-width:8px!important;border-radius:44px!important}.action-card.device .app-bar{height:58px;flex-basis:58px;margin:-5px -5px 38px}.action-card>.role{margin-bottom:40px}.action-card>strong{font-size:1.2rem}.facts{margin-top:30px}.fake-button{margin-bottom:6px}.stats{margin-top:48px;grid-template-columns:1fr}.stats div{padding:18px}.stats b{font-size:1.7rem}.stats small{font-size:.65rem}
.closing>img{width:94px;height:94px}.footer-brand>img{width:50px;height:50px}
@media(max-width:920px){.hero h1{font-size:clamp(3rem,8vw,4.7rem)}.hero-visual{min-height:620px}.comparison,.action-flow{max-width:none}.phone.device,.student-phone.device,.action-card.device{min-height:570px}.summary h2{font-size:clamp(2.8rem,7vw,4.5rem)}}
@media(max-width:700px){.comparison,.action-flow{grid-template-columns:minmax(0,1fr)}.phone.device,.student-phone.device,.action-card.device{width:min(100%,360px);min-height:680px;margin:auto}.direction,.flow-arrow{transform:rotate(90deg)}.reverse-flow .flow-arrow{transform:rotate(-90deg)}}
@media(max-width:620px){.site-header{min-height:82px}.brand>img{width:52px;height:52px}.hero{min-height:auto;padding-top:32px}.hero h1{font-size:clamp(2.65rem,12vw,3.65rem);line-height:.98}.hero-lead{font-size:.98rem}.hero-visual{min-height:600px}.glow{width:340px;height:470px}.hero-card{width:205px;min-height:430px}.teacher-card{top:36px;left:0}.student-card{right:0;bottom:26px}.section-heading h2,.summary h2,.closing h2{font-size:clamp(2.45rem,11vw,3.55rem)}.phone.device,.student-phone.device,.action-card.device{min-height:640px}.step-copy>p:last-child,.summary-copy>p:last-child{font-size:.94rem}}
@media(max-width:390px){.hero-visual{min-height:560px}.glow{width:300px;height:430px}.hero-card{width:184px;min-height:405px;padding-right:14px;padding-left:14px}.hero-card>p{font-size:.92rem}.phone.device,.student-phone.device,.action-card.device{min-height:610px}}

/* Разные реальные состояния PWA вместо повторяющихся карточек. */
.detail-grid{margin:26px 0;display:grid;gap:14px}.detail-grid>span{padding-bottom:12px;display:grid;gap:4px;border-bottom:1px solid #e9eef3}.detail-grid small,.field small{color:var(--muted);font-size:.58rem}.detail-grid b,.field b{font-size:.72rem;line-height:1.35}.segmented{margin:2px 0 16px;padding:3px;display:grid;grid-template-columns:1fr 1fr;background:#edf2f7;border-radius:12px}.segmented span{padding:8px 5px;color:var(--muted);text-align:center;border-radius:9px;font-size:.56rem;font-weight:750}.segmented .selected{color:var(--primary);background:#fff;box-shadow:0 2px 8px rgba(20,50,80,.09)}.field{min-height:52px;margin:8px 0;padding:9px 12px;display:grid;align-content:center;gap:4px;border:1px solid #aeb9c6;border-radius:12px}.field.textarea{min-height:86px;align-content:start}.push-demo{padding:13px;display:grid;gap:4px;color:#245d4d;background:var(--mint);border-radius:14px}.push-demo b{font-size:.68rem}.push-demo small{font-size:.54rem}.feed-heading,.screen-day{margin:24px 2px 12px;display:flex;align-items:center;justify-content:space-between}.feed-heading strong,.screen-day strong{font-size:.84rem}.feed-heading small,.screen-day small{color:var(--primary);font-size:.56rem}.notification-demo{position:relative;margin-top:10px;padding:13px;display:grid;grid-template-columns:34px 1fr;gap:10px;background:#f5f7fa;border-radius:15px}.notification-demo.unread{background:var(--primary-soft)}.notification-demo>span{width:34px;height:34px;display:grid;place-items:center;color:#fff;background:var(--primary);border-radius:11px;font-size:.6rem}.notification-demo .system{color:var(--primary);background:#fff}.notification-demo div{min-width:0;display:grid;gap:5px}.notification-demo b{font-size:.65rem}.notification-demo small{color:var(--muted);font-size:.54rem;line-height:1.4}.notification-demo time{color:var(--muted);font-size:.48rem}.mini-calendar{display:grid;grid-template-columns:repeat(5,1fr);gap:4px}.mini-calendar span{padding:7px 3px;color:var(--muted);text-align:center;border-radius:11px;font-size:.5rem;line-height:1.8}.mini-calendar b{font-size:.72rem}.mini-calendar .selected{color:var(--primary);background:var(--primary-soft)}.schedule-lesson-demo{padding:16px;display:grid;grid-template-columns:48px 1fr;gap:13px;background:#f7f2f1;border-left:4px solid var(--danger);border-radius:15px}.schedule-lesson-demo time{font-size:.72rem;font-weight:800}.schedule-lesson-demo time small{color:var(--muted);font-size:.52rem}.schedule-lesson-demo div{display:grid;gap:8px}.schedule-lesson-demo div>b{font-size:.7rem}.schedule-lesson-demo div>small{color:var(--muted);font-size:.54rem}.cancel-reason{margin-top:14px;padding:13px;display:grid;gap:5px;background:var(--danger-soft);border-radius:13px}.cancel-reason b{color:var(--danger);font-size:.6rem}.cancel-reason small{font-size:.56rem;line-height:1.4}.roster-screen .stats{margin:22px 0;grid-template-columns:repeat(3,1fr)}.roster-screen .stats div{padding:10px 4px}.roster-screen .stats b{font-size:1.1rem}.student-row{padding:12px 0;display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:10px;border-top:1px solid #e8edf2}.student-row>span{width:34px;height:34px;display:grid;place-items:center;color:var(--primary);background:var(--primary-soft);border-radius:50%;font-size:.55rem;font-weight:800}.student-row div{display:grid;gap:3px}.student-row b{font-size:.62rem}.student-row small{color:var(--muted);font-size:.5rem}.student-row em{color:var(--muted);font-size:.5rem;font-style:normal}.student-row .ok{color:#26745d}.student-row .away{padding:5px 7px;color:var(--danger);background:var(--danger-soft);border-radius:8px}.move .action-flow{align-items:start}.move .event-screen{margin-top:90px}.cancel .action-flow{align-items:start}.cancel .schedule-screen{margin-top:55px}.feedback .action-flow{grid-template-columns:minmax(250px,.85fr) auto minmax(300px,1.15fr);align-items:start}.feedback .roster-screen{margin-top:70px}.summary{align-items:start}.summary-list article{padding:19px 0}
@media(max-width:700px){.move .event-screen,.cancel .schedule-screen,.feedback .roster-screen{margin-top:0}.feedback .action-flow{grid-template-columns:1fr}}

/* В лендинге показываются реальные снимки интерфейса, предоставленные пользователем. */
.comparison .device,.action-flow .device{background-color:#f5f7fa;background-position:center;background-repeat:no-repeat;background-size:100% 100%}.comparison .device>*,.action-flow .device>*{visibility:hidden}.teacher-phone{background-image:url("screenshots/home.png")!important}.move .action-card:first-child{background-image:url("screenshots/reschedule.png")!important}.cancel .action-card:first-child{background-image:url("screenshots/cancel.png")!important}.feedback .action-card:first-child{background-image:url("screenshots/absence.png")!important}.attendance .attendance-device{background-image:url("screenshots/roster.png")!important}
.hero-card{background-position:center;background-repeat:no-repeat;background-size:cover}.teacher-card{background-image:url("screenshots/home.png")}.student-card{background-image:url("screenshots/events.png")}.hero-card>*{visibility:hidden}.hero-card::after{display:none}

/* Все снимки сняты при 390×844 и показываются без растяжения. */
.comparison,.action-flow,.feedback .action-flow{grid-template-columns:minmax(0,340px) 46px minmax(0,340px);justify-content:center;align-items:start;column-gap:24px}.comparison .device,.action-flow .device,.phone.device,.student-phone.device,.action-card.device{width:100%;max-width:340px;height:auto!important;min-height:0!important;aspect-ratio:390/844;padding:0!important;background-size:100% auto;border-width:7px!important;border-radius:38px!important}.comparison .device::after,.action-flow .device::after{border-radius:30px}.comparison .device-speaker,.action-flow .device-speaker{display:none}.direction,.flow-arrow{align-self:center}.move .event-screen,.cancel .schedule-screen,.feedback .roster-screen{margin-top:64px}.hero-card{width:218px;height:auto;min-height:0;aspect-ratio:390/844;padding:0;background-size:100% auto}.teacher-card{top:42px}.student-card{bottom:28px}
@media(max-width:920px){.comparison,.action-flow,.feedback .action-flow{grid-template-columns:minmax(0,320px) 46px minmax(0,320px)}.comparison .device,.action-flow .device,.phone.device,.student-phone.device,.action-card.device{max-width:320px}}
@media(max-width:700px){.comparison,.action-flow,.feedback .action-flow{grid-template-columns:minmax(0,360px)}.comparison .device,.action-flow .device,.phone.device,.student-phone.device,.action-card.device{max-width:360px}.move .event-screen,.cancel .schedule-screen,.feedback .roster-screen{margin-top:0}}
@media(max-width:390px){.hero-card{width:180px}}
.comparison .device,.action-flow .device,.phone.device,.student-phone.device,.action-card.device{border:0!important;border-radius:31px!important;box-shadow:0 0 0 7px #26313c,0 24px 58px rgba(20,45,70,.17)!important}.hero-card{border:0;box-shadow:0 0 0 7px #26313c,0 22px 55px rgba(4,37,74,.22)}

/* Реальные пользовательские снимки: единый масштаб, без растяжения и ступенчатого смещения. */
.comparison .device,.action-flow .device,.phone.device,.student-phone.device,.action-card.device{aspect-ratio:1/1.925;background-color:#fff;background-position:center top;background-size:100% auto}.move .event-screen,.cancel .schedule-screen,.feedback .roster-screen{margin-top:0}.hero-card{aspect-ratio:1/1.925;background-color:#fff;background-position:center top;background-size:100% auto}.teacher-card{top:52px}.student-card{bottom:36px}

/* Редакционная композиция: у каждого сценария свой ритм и направление. */
@media(min-width:701px){
  .story-step .comparison,.story-step .action-flow{position:relative;display:block;width:100%;max-width:720px;min-height:735px;margin-left:auto}
  .story-step .direction,.story-step .flow-arrow{position:absolute;z-index:5;left:50%;top:46%;transform:translate(-50%,-50%);box-shadow:0 10px 24px rgba(18,87,154,.16)}
  .foundation .teacher-phone{position:absolute;z-index:2;left:2%;top:0;width:330px;transform:rotate(-2deg)}
  .foundation .student-phone{position:absolute;z-index:3;right:2%;top:130px;width:285px;transform:rotate(3deg)}
  .foundation .direction{left:52%;top:48%}
  .move .action-card:first-child{position:absolute;z-index:3;left:0;top:0;width:340px;transform:rotate(-1deg)}
  .move .event-screen{position:absolute;z-index:2;right:0;top:105px;width:275px;transform:rotate(2.5deg)}
  .move .flow-arrow{left:54%;top:53%}
  .cancel .action-card:first-child{position:absolute;z-index:2;left:7%;top:125px;width:275px;transform:rotate(-2.5deg)}
  .cancel .schedule-screen{position:absolute;z-index:3;right:0;top:0;width:340px;transform:rotate(1.5deg)}
  .cancel .flow-arrow{left:49%;top:51%}
  .feedback .action-card:first-child{position:absolute;z-index:3;left:50%;top:0;width:305px;transform:translateX(-50%) rotate(-1deg)}
  .feedback .roster-screen{position:absolute;z-index:2;right:0;top:115px;width:350px;transform:rotate(2deg)}
  .feedback .flow-arrow{left:49%;top:52%}
  .attendance .single-flow .attendance-device{position:absolute;z-index:2;left:50%;top:0;width:340px;transform:translateX(-50%) rotate(1deg)}
}
@media(min-width:701px) and (max-width:1050px){
  .story-step .comparison,.story-step .action-flow{max-width:650px;min-height:690px}
  .foundation .teacher-phone,.move .action-card:first-child,.cancel .schedule-screen{width:305px}
  .foundation .student-phone,.move .event-screen,.cancel .action-card:first-child{width:255px}
  .feedback .action-card:first-child{width:275px}.feedback .roster-screen{width:315px}
}
@media(max-width:700px){
  .story-step .comparison,.story-step .action-flow{display:grid;min-height:0}
  .story-step .device{position:relative;inset:auto;width:100%;transform:none}
  .story-step .direction,.story-step .flow-arrow{position:static;transform:rotate(90deg)}
  .story-step .reverse-flow .flow-arrow{transform:rotate(-90deg)}
}

.attendance{border-bottom:1px solid var(--line)}.attendance .single-flow{min-height:735px}.attendance .attendance-device{margin:0 auto}
@media(max-width:700px){.attendance .single-flow{min-height:0}.attendance .attendance-device{transform:none}}

/* Системная строка устройства располагается над снимком и не перекрывает приложение. */
.comparison .device,.action-flow .device,.phone.device,.student-phone.device,.action-card.device{aspect-ratio:1/2.035;background-position:center 27px;background-size:100% auto}
.comparison .device::before,.action-flow .device::before,.phone.device::before,.student-phone.device::before,.action-card.device::before{content:"9:41";position:absolute;z-index:8;inset:0 0 auto;height:27px;padding:0 13px;display:flex;align-items:center;color:#17202a;background:#fff;font-size:9px;font-weight:800;letter-spacing:.01em}
.comparison .device::after,.action-flow .device::after,.phone.device::after,.student-phone.device::after,.action-card.device::after{content:"●  ᯤ  ▰";position:absolute;z-index:9;top:0;right:0;left:auto;width:auto;height:27px;padding:0 12px;display:flex;align-items:center;color:#17202a;border:0;border-radius:0;background:transparent;font-size:8px;font-weight:800;letter-spacing:.04em}
.hero-card{aspect-ratio:1/2.035;background-position:center 18px;background-size:100% auto}
.hero-card::before{content:"9:41";position:absolute;z-index:8;inset:0 0 auto;height:18px;padding:0 9px;display:flex;align-items:center;color:#17202a;background:#fff;border-radius:0;transform:none;font-size:6px;font-weight:800}
.hero-card::after{content:"●  ᯤ  ▰";position:absolute;z-index:9;top:0;right:0;left:auto;width:auto;height:18px;padding:0 8px;display:flex;color:#17202a;background:transparent;border:0;align-items:center;font-size:5px;font-weight:800}

/* Текст и визуал чередуются по сторонам, сохраняя широкий столбец для снимков. */
@media(min-width:921px){
  .story-step.move,.story-step.feedback{grid-template-columns:minmax(0,1.32fr) minmax(280px,.68fr)}
  .story-step.move .step-copy,.story-step.feedback .step-copy{grid-column:2;grid-row:1}
  .story-step.move .action-flow,.story-step.feedback .action-flow{grid-column:1;grid-row:1;margin-right:auto;margin-left:0}
}
@media(max-width:920px){
  .story-step.move,.story-step.feedback{grid-template-columns:1fr}
  .story-step.move .step-copy,.story-step.feedback .step-copy,.story-step.move .action-flow,.story-step.feedback .action-flow{grid-column:1;grid-row:auto}
  .story-step.move .step-copy,.story-step.feedback .step-copy{order:1}
  .story-step.move .action-flow,.story-step.feedback .action-flow{order:2}
}

/* Цельная верхняя область устройства: safe area, камера и системные индикаторы. */
.comparison .device,.action-flow .device,.phone.device,.student-phone.device,.action-card.device{overflow:hidden;isolation:isolate;border-radius:38px!important;background-position:center 34px;aspect-ratio:1/2.055;background-clip:padding-box}
.comparison .device::before,.action-flow .device::before,.phone.device::before,.student-phone.device::before,.action-card.device::before{content:"9:41";inset:0 0 auto;height:34px;padding:0 16px;align-items:center;background:#fff;color:#101820;font-size:9px;font-weight:800;border-radius:31px 31px 0 0}
.comparison .device::after,.action-flow .device::after,.phone.device::after,.student-phone.device::after,.action-card.device::after{content:"▮▮  5G  ▰";top:0;right:0;height:34px;padding:0 15px;color:#101820;font-family:"Segoe UI Symbol","Segoe UI",sans-serif;font-size:7px;letter-spacing:0;line-height:34px}
.comparison .device .device-speaker,.action-flow .device .device-speaker,.phone.device .device-speaker,.student-phone.device .device-speaker,.action-card.device .device-speaker{visibility:visible!important;display:block!important;z-index:12;top:7px;left:50%;width:50px;height:18px;background:#101820;border:2px solid #202a33;border-radius:12px;transform:translateX(-50%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.hero-card{overflow:hidden;isolation:isolate;border-radius:28px;background-position:center 23px;aspect-ratio:1/2.065}
.hero-card::before{content:"9:41";inset:0 0 auto;height:23px;padding:0 10px;align-items:center;background:#fff;color:#101820;border-radius:22px 22px 0 0;font-size:6px;transform:none}
.hero-card::after{content:"▮▮ 5G ▰";top:0;right:0;height:23px;padding:0 9px;align-items:center;color:#101820;font-family:"Segoe UI Symbol","Segoe UI",sans-serif;font-size:4.5px;line-height:23px}
.hero-card .card-label:first-child::before{content:"";position:absolute;z-index:14;top:5px;left:50%;width:34px;height:12px;background:#101820;border-radius:8px;transform:translateX(-50%);visibility:visible}

/* Штриховая связь идёт неровным маршрутом, а не прямой линией. */
.dashed-arrow i{left:8px;right:8px;top:50%;height:24px;background:none;transform:translateY(-50%);opacity:.68}
.dashed-arrow i::before,.dashed-arrow i::after{content:"";position:absolute;height:15px;border-color:currentColor;border-style:dashed;border-width:2px 0 0;transform-origin:center}
.dashed-arrow i::before{left:0;top:7px;width:56%;border-radius:50% 35% 0 0;transform:rotate(-10deg)}
.dashed-arrow i::after{right:0;top:2px;width:58%;border-radius:35% 50% 0 0;transform:rotate(11deg)}
.dashed-arrow.right::after,.dashed-arrow.both::after{right:1px;top:62%}.dashed-arrow.left::before,.dashed-arrow.both::before{left:1px;top:58%}

/* По одному уникальному снимку на сценарий. */
@media(min-width:701px){
  .foundation .teacher-phone,.move .action-card:first-child,.cancel .action-card:first-child,.feedback .action-card:first-child,.attendance .attendance-device{left:50%;right:auto;top:0;width:330px;transform:translateX(-50%) rotate(-1deg)}
  .cancel .action-card:first-child,.attendance .attendance-device{transform:translateX(-50%) rotate(1deg)}
}
.hero-card.teacher-card{left:50%;right:auto;top:50%;bottom:auto;width:250px;transform:translate(-50%,-50%) rotate(-2deg)}

/* Финал страницы — один ясный call to action вместо нумерованного резюме. */
.summary.cta-section{position:relative;overflow:hidden;padding:105px 80px;display:block;text-align:center;background:linear-gradient(135deg,#0a4278,#1767a8 62%,#2480bd);isolation:isolate}.cta-section::before,.cta-section::after{content:"";position:absolute;z-index:-1;border:1px solid rgba(255,255,255,.16);border-radius:50%}.cta-section::before{width:620px;height:620px;right:-260px;top:-330px;box-shadow:0 0 0 85px rgba(255,255,255,.03),0 0 0 170px rgba(255,255,255,.02)}.cta-section::after{width:280px;height:280px;left:-145px;bottom:-185px;box-shadow:0 0 0 60px rgba(255,255,255,.025)}.cta-section .summary-copy{position:relative;z-index:1;max-width:880px;margin:auto}.cta-section .summary-copy h2{font-size:clamp(3.2rem,5.6vw,5.7rem);line-height:.92;text-wrap:balance}.cta-section .summary-copy>p:last-of-type{max-width:650px;margin:27px auto 0;color:rgba(255,255,255,.75);font-size:1.05rem;line-height:1.7}.cta-action{margin:35px auto 0;color:var(--primary);background:#fff;box-shadow:0 14px 34px rgba(4,38,75,.22)}.cta-action:hover{color:#fff;background:#0b3f72}
@media(max-width:620px){.summary.cta-section{padding:70px 24px;border-radius:28px}.cta-section .summary-copy h2{font-size:clamp(2.65rem,12vw,3.8rem)}.cta-section .summary-copy>p:last-of-type{font-size:.94rem}.cta-action{width:100%;justify-content:center}}

/* Платформенность и направления дальнейшего развития. */
.platform-section,.next-section{width:min(1180px,calc(100% - 40px));margin:0 auto 140px}.platform-heading,.next-heading{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);column-gap:70px;align-items:end}.platform-heading .kicker,.next-heading .kicker{grid-column:1/-1}.platform-heading h2,.next-heading h2{margin:0;font-size:clamp(2.8rem,5vw,5.1rem);line-height:.96;letter-spacing:-.06em}.platform-heading>p:last-child,.next-heading>p:last-child{margin:0;color:var(--muted);font-size:1rem;line-height:1.75}.platform-grid{margin-top:62px;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.platform-grid article{min-height:260px;padding:25px;display:flex;flex-direction:column;justify-content:space-between;gap:38px;background:#fff;border:1px solid var(--line);border-radius:26px;box-shadow:0 16px 42px rgba(25,62,99,.07)}.platform-icon{width:52px;height:52px;display:grid;place-items:center;color:var(--primary);background:var(--primary-soft);border-radius:17px;font-size:1.35rem;font-weight:850}.platform-grid h3,.platform-grid p{margin:0}.platform-grid h3{font-size:1.1rem;letter-spacing:-.025em}.platform-grid p{margin-top:10px;color:var(--muted);font-size:.76rem;line-height:1.6}
.next-section{padding:90px;background:#edf3f9;border:1px solid #dce6f0;border-radius:42px}.next-grid{margin-top:65px;display:grid;grid-template-columns:1fr 1fr;gap:18px}.next-card{min-height:490px;padding:28px;display:flex;flex-direction:column;justify-content:space-between;gap:42px;background:#fff;border:1px solid #dae3ec;border-radius:29px;box-shadow:0 18px 50px rgba(25,62,99,.08)}.next-visual{height:210px;position:relative;overflow:hidden;background:linear-gradient(145deg,#0e4d8d,#2577b9);border-radius:22px}.next-label{margin:0 0 13px;color:var(--primary);font-size:.65rem;font-weight:850;letter-spacing:.12em;text-transform:uppercase}.next-card h3,.next-card>div>p:last-child{margin:0}.next-card h3{font-size:1.65rem;line-height:1.05;letter-spacing:-.04em}.next-card>div>p:last-child{margin-top:15px;color:var(--muted);font-size:.78rem;line-height:1.65}.qr-visual{display:grid;place-items:center}.qr-visual::before{content:"";width:124px;height:124px;background:repeating-conic-gradient(#fff 0 25%,transparent 0 50%) 0 0/24px 24px;border:15px solid #fff;border-radius:13px;box-shadow:0 16px 35px rgba(1,29,61,.25)}.qr-visual span{position:absolute;width:31px;height:31px;border:7px solid var(--primary);background:#fff}.qr-visual span:nth-child(1){left:calc(50% - 46px);top:43px}.qr-visual span:nth-child(2){right:calc(50% - 46px);top:43px}.qr-visual span:nth-child(3){left:calc(50% - 46px);bottom:43px}.qr-visual i{position:absolute;left:18%;right:18%;top:50%;height:2px;background:#71c2ff;box-shadow:0 0 12px #7bc8ff}.tasks-visual{padding:35px;display:grid;align-content:center;gap:13px;background:linear-gradient(145deg,#e3eef9,#f8fbfe)}.tasks-visual span{height:39px;padding:0 14px;display:flex;align-items:center;color:var(--primary);background:#fff;border:1px solid #d6e1ec;border-radius:12px;font-size:.72rem;font-weight:850;box-shadow:0 8px 18px rgba(28,66,104,.07)}.tasks-visual span::after{content:"Задание";margin-left:13px;color:#344454}.tasks-visual span:nth-child(2)::after{content:"Отчёт по практике"}.tasks-visual span:nth-child(3)::after{content:"Лабораторная работа"}
@media(max-width:900px){.platform-heading,.next-heading{grid-template-columns:1fr;gap:22px}.platform-grid{grid-template-columns:1fr}.platform-grid article{min-height:190px}.next-section{padding:64px 36px}.next-grid{grid-template-columns:1fr}.next-card{min-height:450px}}
@media(max-width:620px){.platform-section,.next-section{width:calc(100% - 28px);margin-bottom:100px}.platform-heading h2,.next-heading h2{font-size:clamp(2.45rem,11vw,3.55rem)}.next-section{padding:48px 18px;border-radius:30px}.next-grid{margin-top:45px}.next-card{min-height:420px;padding:20px;border-radius:23px}.next-visual{height:190px}.next-card h3{font-size:1.45rem}}

/* Карточки преимуществ не смещаются между строками и сохраняют безопасный зазор. */
.summary-proof{row-gap:18px}.push-proof,.read-proof,.push-proof:hover,.read-proof:hover{transform:none}

/* Широкий заголовок и предметные иллюстрации платформенности. */
.platform-heading{display:block}.platform-heading h2{max-width:980px;font-size:clamp(2.7rem,4.25vw,3.7rem);line-height:1.02;letter-spacing:-.05em;text-wrap:balance}.platform-heading>p:last-child{max-width:690px;margin:24px 0 0;font-size:.95rem;line-height:1.7}.platform-grid article{padding:0;overflow:hidden}.platform-grid article>div:last-child{padding:0 25px 25px}.platform-visual{position:relative;height:215px;overflow:hidden;background:linear-gradient(145deg,#e6f0fa,#f9fbfe);border-bottom:1px solid #dce6f0}.devices-visual{isolation:isolate}.devices-visual::before{content:"";position:absolute;width:210px;height:210px;right:-50px;top:-70px;background:#cfe2f5;border-radius:50%}.mini-phone,.mini-tablet,.mini-desktop{position:absolute;display:block;background-color:#fff;background-image:url("screenshots/home.png");background-position:center top;background-repeat:no-repeat;background-size:cover;border:4px solid #26313c;box-shadow:0 14px 28px rgba(21,52,82,.18)}.mini-phone{z-index:3;width:66px;height:142px;left:28px;bottom:-10px;border-radius:14px;transform:rotate(-4deg)}.mini-tablet{z-index:2;width:105px;height:145px;left:84px;bottom:18px;border-radius:13px;background-size:auto 100%}.mini-desktop{z-index:1;width:155px;height:102px;right:22px;bottom:35px;border-width:5px 5px 12px;border-radius:9px;background-size:100% auto}.login-visual,.install-visual{display:grid;place-items:center}.login-window,.install-window{width:78%;min-height:160px;padding:16px;display:grid;grid-template-columns:36px 1fr;align-items:center;gap:9px;background:#fff;border:1px solid #d8e2ed;border-radius:17px;box-shadow:0 15px 32px rgba(21,52,82,.12)}.login-window i,.install-window i{width:36px;height:36px;display:grid;place-items:center;color:#fff;background:var(--primary);border-radius:11px;font-size:.62rem;font-style:normal;font-weight:850}.login-window b,.install-window b{font-size:.72rem}.login-window em{height:38px;display:grid;place-items:center;border-radius:11px;font-size:.68rem;font-style:normal;font-weight:850}.yandex-login{grid-column:1/-1;color:#111;background:#f2f3f5}.vk-login{grid-column:1/-1;color:#fff;background:#2787f5}.install-window small{grid-column:1/-1;color:var(--muted);font-size:.56rem}.install-window em{grid-column:1/-1;padding:10px;color:#fff;text-align:center;background:var(--primary);border-radius:10px;font-size:.62rem;font-style:normal;font-weight:800}

/* Platform illustrations */
.mini-tablet{width:142px;height:102px;left:78px;bottom:38px;border-width:5px;border-radius:13px;background-size:cover;background-position:center top}
.mini-desktop{right:18px;bottom:25px;background-size:cover}
.login-window{width:78%;min-height:160px;padding:16px;display:grid;grid-template-columns:36px 1fr;align-items:center;gap:9px;background:#fff;border:1px solid #d8e2ed;border-radius:17px;box-shadow:0 15px 32px rgba(21,52,82,.12)}
.login-window>i{width:36px;height:36px;display:grid;place-items:center;color:#fff;background:var(--primary);border-radius:11px;font-size:.62rem;font-style:normal;font-weight:850}
.login-window>b{font-size:.72rem}
.identity-button{grid-column:1/-1;height:38px;padding:0 14px;display:flex!important;align-items:center;justify-content:center;gap:9px;border-radius:11px;font-size:.68rem;font-style:normal;font-weight:850}
.identity-button img{display:block;width:22px;height:22px;object-fit:contain}
.yandex-login img{width:20px;height:20px}
.browser-window{position:relative;width:84%;height:158px;background:#fff;border:1px solid #d8e2ed;border-radius:15px;box-shadow:0 15px 32px rgba(21,52,82,.12);overflow:visible}
.browser-toolbar{height:38px;padding:0 9px;display:flex;align-items:center;gap:7px;background:#eef3f8;border-radius:15px 15px 0 0;border-bottom:1px solid #d8e2ed}
.browser-toolbar>i{width:7px;height:7px;background:#9aabba;border-radius:50%;box-shadow:11px 0 #9aabba}
.browser-address{margin-left:12px;flex:1;padding:5px 8px;color:#52697f;background:#fff;border-radius:7px;font-size:.49rem}
.browser-install-icon{width:24px;height:24px;display:grid;place-items:center;color:#fff;background:var(--primary);border-radius:7px;font-size:.9rem;font-weight:900;box-shadow:0 0 0 4px rgba(25,99,164,.16)}
.browser-menu{color:#52697f;font-weight:900}
.install-hint{position:absolute;z-index:2;right:8px;top:48px;width:126px;padding:9px 11px;color:#fff;background:#1e2935;border-radius:10px;box-shadow:0 9px 20px rgba(21,52,82,.2)}
.install-hint::before{content:"";position:absolute;right:24px;top:-6px;width:12px;height:12px;background:#1e2935;transform:rotate(45deg)}
.install-hint b,.install-hint small{position:relative;display:block}.install-hint b{font-size:.61rem}.install-hint small{margin-top:2px;color:#cbd8e4;font-size:.46rem;line-height:1.35}
.browser-page{position:absolute;left:16px;bottom:14px;display:grid;grid-template-columns:30px 1fr;gap:2px 8px;align-items:center}
.browser-page>i{grid-row:1/3;width:30px;height:30px;display:grid;place-items:center;color:#fff;background:var(--primary);border-radius:9px;font-size:.52rem;font-style:normal;font-weight:850}.browser-page>b{font-size:.62rem}.browser-page>small{color:var(--muted);font-size:.47rem}
.identity-logos{display:flex;align-items:center;justify-content:center;gap:24px}.identity-logos>span{width:1px;height:64px;background:#cfdbe7}.identity-logo{width:92px;height:92px;display:grid;place-items:center;background:#fff;border:1px solid #d8e2ed;border-radius:25px;box-shadow:0 15px 30px rgba(21,52,82,.11);font-style:normal}.identity-logo img{display:block;max-width:66px;max-height:55px;object-fit:contain}.yandex-logo img{max-width:72px}.vk-logo{background:#2787f5}.vk-logo img{width:58px;height:58px}.active-menu{width:27px;height:27px;display:grid;place-items:center;color:#fff;background:var(--primary);border-radius:8px;box-shadow:0 0 0 4px rgba(25,99,164,.15)}.browser-menu-panel{position:absolute;z-index:3;right:8px;top:43px;width:166px;padding:7px;background:#fff;border:1px solid #d5e0ea;border-radius:10px;box-shadow:0 14px 28px rgba(21,52,82,.2)}.browser-menu-panel>span,.browser-menu-panel>strong{padding:7px 9px;display:flex;align-items:center;gap:7px;border-radius:6px;font-size:.5rem;font-weight:650}.browser-menu-panel>span{color:#607388}.browser-menu-panel>strong{color:#fff;background:var(--primary);font-weight:850}.browser-menu-panel>strong i{font-size:.75rem;font-style:normal}.browser-page{bottom:12px}
.install-guide{margin-top:24px;padding:54px;background:#fff;border:1px solid var(--line);border-radius:30px;box-shadow:0 18px 50px rgba(25,62,99,.07)}.install-guide-heading{display:grid;grid-template-columns:.8fr 1.2fr;gap:12px 55px;align-items:end}.install-guide-heading .kicker{grid-column:1/-1;margin-bottom:5px}.install-guide-heading h3,.install-guide-heading>p:last-child{margin:0}.install-guide-heading h3{font-size:2.25rem;line-height:1;letter-spacing:-.045em}.install-guide-heading>p:last-child{color:var(--muted);font-size:.85rem;line-height:1.65}.install-platforms{margin-top:43px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.install-platforms article{min-height:230px;padding:22px;display:flex;flex-direction:column;justify-content:space-between;gap:24px;background:#f3f6f9;border-radius:20px}.install-number{width:36px;height:36px;display:grid;place-items:center;color:var(--primary);background:var(--primary-soft);border-radius:12px;font-size:.6rem;font-weight:850}.install-platforms h4,.install-platforms p{margin:0}.install-platforms h4{font-size:1rem}.install-platforms p{margin-top:9px;color:var(--muted);font-size:.7rem;line-height:1.6}.install-note{margin:18px 0 0;padding:16px 18px;color:#245d4d;background:var(--mint);border-radius:15px;font-size:.72rem;line-height:1.55}
.install-platforms article{min-height:430px;padding:14px 14px 23px;justify-content:flex-start;gap:23px}.install-demo{position:relative;height:205px;overflow:hidden;background:#fff;border:1px solid #d7e1ea;border-radius:15px;box-shadow:0 12px 24px rgba(25,62,99,.08)}.install-copy{padding:0 8px}.install-number{width:auto;height:auto;display:inline-flex;padding:7px 10px;border-radius:999px}.install-copy h4{margin-top:14px;font-size:1.12rem}.demo-browser-bar,.desktop-address{height:38px;padding:0 10px;display:flex;align-items:center;gap:8px;background:#e8eef4;border-bottom:1px solid #d7e1ea}.demo-browser-bar i,.desktop-address i{flex:1;padding:6px 8px;color:#5c7083;background:#fff;border-radius:7px;font-size:.49rem;font-style:normal}.demo-browser-bar>b{width:24px;height:24px;display:grid;place-items:center;color:#fff;background:var(--primary);border-radius:7px}.demo-menu{position:absolute;right:9px;top:45px;width:174px;padding:7px;background:#fff;border:1px solid #d4dfe9;border-radius:10px;box-shadow:0 12px 24px rgba(25,62,99,.16)}.demo-menu i,.demo-menu strong{padding:8px;display:flex;align-items:center;gap:7px;border-radius:6px;font-size:.52rem;font-style:normal}.demo-menu i{color:#647789}.demo-menu strong{color:#fff;background:var(--primary)}.demo-menu strong b{font-size:.75rem}.ios-page{height:126px;display:grid;place-items:center;align-content:center;gap:8px}.ios-page i{width:42px;height:42px;display:grid;place-items:center;color:#fff;background:var(--primary);border-radius:12px;font-size:.65rem;font-style:normal;font-weight:850}.ios-page b{font-size:.57rem}.ios-toolbar{height:38px;padding:0 18px;display:flex;justify-content:space-between;align-items:center;color:var(--primary);background:#edf3f8;border-top:1px solid #d4dfe9}.ios-toolbar i{font-style:normal}.ios-toolbar strong{width:28px;height:28px;display:grid;place-items:center;background:#dbeaf8;border-radius:8px;font-size:1.1rem}.ios-action{position:absolute;left:12px;right:12px;bottom:12px;padding:11px 12px;display:grid;grid-template-columns:22px 1fr 12px;align-items:center;gap:7px;background:#fff;border:1px solid #d4dfe9;border-radius:10px;box-shadow:0 10px 22px rgba(25,62,99,.18);font-size:.55rem;font-weight:800}.ios-action>b{width:22px;height:22px;display:grid;place-items:center;color:#fff;background:var(--primary);border-radius:6px}.ios-action i{color:#7b8c9b;font-style:normal}.desktop-address>b{width:25px;height:25px;display:grid;place-items:center;color:#fff;background:var(--primary);border-radius:7px;box-shadow:0 0 0 4px rgba(25,99,164,.13)}.desktop-dialog{position:absolute;left:18px;right:18px;top:62px;padding:14px;display:grid;grid-template-columns:34px 1fr auto auto;align-items:center;gap:8px;background:#fff;border:1px solid #d2dde7;border-radius:12px;box-shadow:0 13px 27px rgba(25,62,99,.16)}.desktop-dialog>i{width:34px;height:34px;display:grid;place-items:center;color:#fff;background:var(--primary);border-radius:9px;font-size:.52rem;font-style:normal;font-weight:850}.desktop-dialog>strong{grid-column:2/-1;font-size:.58rem}.desktop-dialog>span,.desktop-dialog>b{grid-row:2;padding:7px 9px;border-radius:7px;font-size:.48rem}.desktop-dialog>span{grid-column:3;color:#65788b;background:#edf2f6}.desktop-dialog>b{grid-column:4;color:#fff;background:var(--primary)}
.platform-heading h2{max-width:1080px;font-size:clamp(3.2rem,4.9vw,4.45rem)}.platform-grid{margin-top:42px}.platform-grid article{min-height:0;justify-content:flex-start;gap:0}.platform-visual{height:190px}.platform-grid article>div:last-child{padding:24px 25px 27px}.platform-grid h3{font-size:1.28rem;line-height:1.15}.platform-grid p{margin-top:12px;font-size:.84rem;line-height:1.62}.real-install-preview{background:#eef2f6}.real-install-preview img{width:100%;height:100%;display:block;object-fit:cover;object-position:center 51%}
.install-guide{margin-top:18px;padding:44px}.install-guide-heading h3{font-size:2.55rem}.install-guide-heading>p:last-child{font-size:.92rem}.install-platforms{margin-top:34px;gap:15px}.install-platforms article{min-height:0;padding:13px 13px 25px;gap:22px}.install-shot{height:240px;margin:0;overflow:hidden;display:grid;place-items:center;background:#e9eef3;border:1px solid #d5e0e9;border-radius:16px}.install-shot img{width:100%;height:100%;display:block;object-fit:cover}.android-shot img{object-position:85% center}.ios-shot{background:#f5f5f7}.ios-shot img{width:auto;max-width:100%;object-fit:contain}.desktop-shot img{object-position:center center}.install-copy h4{font-size:1.18rem}.install-platforms p{font-size:.8rem;line-height:1.62}.install-source{margin:20px 4px 0;color:#7a8b9b;font-size:.62rem;line-height:1.5}.install-source a{color:var(--primary);text-decoration:underline;text-underline-offset:3px}
@media(max-width:900px){.platform-heading h2,.platform-heading>p:last-child{grid-column:1}.install-guide-heading{grid-template-columns:1fr}.install-platforms{grid-template-columns:1fr}.install-platforms article{min-height:170px}.install-shot{height:300px}.android-shot img{object-position:center center}.platform-grid h3{font-size:1.35rem}.platform-grid p{font-size:.9rem}}
@media(max-width:620px){.platform-heading h2{font-size:clamp(2.3rem,10.5vw,3rem)}.platform-heading>p:last-child{font-size:.84rem}.platform-visual{height:195px}.install-guide{padding:30px 18px;border-radius:24px}.install-guide-heading h3{font-size:1.8rem}.install-platforms{margin-top:32px}.install-platforms article{min-height:0}.mini-desktop{right:10px}}

/* Roadmap: ближайший релиз и следующий продуктовый контур. */
.roadmap{margin-top:70px;display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);gap:18px;align-items:stretch}.roadmap-release{position:relative;min-height:610px;padding:32px;overflow:hidden;display:flex;flex-direction:column;color:#fff;background:linear-gradient(145deg,#0b447b 0%,#1767a8 62%,#237bb8 100%);border-radius:31px;box-shadow:0 24px 55px rgba(11,68,123,.22)}.roadmap-release::before{content:"";position:absolute;width:390px;height:390px;right:-195px;top:95px;border:1px solid rgba(255,255,255,.18);border-radius:50%;box-shadow:0 0 0 62px rgba(255,255,255,.035),0 0 0 126px rgba(255,255,255,.025)}.release-topline{position:relative;z-index:1;display:flex;justify-content:space-between;gap:15px;align-items:center;color:#c9e4fa;font-size:.65rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.release-topline i{padding:9px 12px;color:#164e7d;background:#dff4eb;border-radius:999px;font-size:.55rem;font-style:normal;letter-spacing:.04em}.release-copy{position:relative;z-index:2;margin-top:auto;max-width:380px}.release-copy .next-label{color:#a9d9ff}.release-copy h3{margin:0;font-size:clamp(2.3rem,4vw,4.1rem);line-height:.9;letter-spacing:-.06em}.release-copy>p:last-child{margin:23px 0 0;color:rgba(255,255,255,.72);font-size:.78rem;line-height:1.7}.release-qr{position:absolute;z-index:1;right:38px;top:95px;width:190px;height:190px;background:repeating-conic-gradient(#0b477f 0 25%,transparent 0 50%) 0 0/34px 34px;border:20px solid #fff;border-radius:22px;box-shadow:0 24px 50px rgba(2,34,66,.3);transform:rotate(4deg)}.release-qr>span{position:absolute;width:45px;height:45px;background:#fff;border:10px solid #0b477f}.release-qr>span:nth-child(1){left:13px;top:13px}.release-qr>span:nth-child(2){right:13px;top:13px}.release-qr>span:nth-child(3){left:13px;bottom:13px}.release-qr>i{position:absolute;left:-35px;right:-35px;top:50%;height:3px;background:#66c9ff;box-shadow:0 0 14px #66c9ff}
.learning-roadmap{position:relative;padding:31px 28px 26px;background:#fff;border:1px solid #d8e3ed;border-radius:31px;box-shadow:0 18px 48px rgba(25,62,99,.08)}.learning-roadmap-heading{padding:0 0 26px 54px;display:grid;gap:7px}.learning-roadmap-heading span{color:var(--primary);font-size:.61rem;font-weight:850;letter-spacing:.12em;text-transform:uppercase}.learning-roadmap-heading strong{font-size:1.15rem;letter-spacing:-.025em}.learning-track{position:absolute;left:46px;top:101px;bottom:74px;width:2px;background:repeating-linear-gradient(180deg,#8db4d7 0 8px,transparent 8px 15px)}.learning-step{position:relative;min-height:148px;padding:22px 18px 22px 54px;display:grid;grid-template-columns:minmax(0,1fr) 112px;gap:18px;align-items:center;border-top:1px solid #e1e9f0}.learning-step:first-of-type{border-top:0}.step-node{position:absolute;z-index:2;left:7px;top:50%;width:23px;height:23px;display:grid;place-items:center;background:#fff;border:5px solid var(--primary);border-radius:50%;box-shadow:0 0 0 7px #fff;transform:translateY(-50%)}.variants-step .step-node{border-color:#6b5a9b}.grade-step .step-node{border-color:#24745c}.step-copy .next-label{margin-bottom:7px}.step-copy h3,.step-copy>p:last-child{margin:0}.step-copy h3{font-size:1.25rem;line-height:1.08;letter-spacing:-.035em}.step-copy>p:last-child{margin-top:9px;color:var(--muted);font-size:.67rem;line-height:1.55}.step-visual{height:100px;position:relative;display:grid;place-items:center;background:#edf4fa;border-radius:18px}.document-visual::before{content:"";position:absolute;width:57px;height:72px;background:#fff;border:1px solid #cbd9e6;border-radius:8px;box-shadow:0 9px 20px rgba(25,62,99,.1)}.document-visual i{position:relative;z-index:1;width:34px;height:5px;background:#cbd9e6;border-radius:4px}.document-visual i:first-child{background:var(--primary)}.variants-visual{grid-template-columns:repeat(3,27px);gap:5px;background:#f1eef8}.variants-visual i{width:27px;height:44px;display:grid;place-items:center;color:#6b5a9b;background:#fff;border-radius:7px;font-size:.59rem;font-style:normal;font-weight:850;box-shadow:0 7px 15px rgba(67,46,105,.08)}.variants-visual i:nth-child(2){color:#fff;background:#6b5a9b;transform:translateY(-6px)}.grade-visual{align-content:center;gap:5px;background:#e6f4ef}.grade-visual strong{width:51px;height:51px;display:grid;place-items:center;color:#fff;background:#24745c;border-radius:50%;font-size:1.3rem}.grade-visual span{color:#24745c;font-size:.53rem;font-weight:850}
@media(max-width:980px){.roadmap{grid-template-columns:1fr}.roadmap-release{min-height:520px}.learning-step{grid-template-columns:minmax(0,1fr) 130px}}
@media(max-width:620px){.roadmap{margin-top:48px}.roadmap-release{min-height:530px;padding:24px;border-radius:24px}.release-topline{align-items:flex-start}.release-qr{right:50%;top:105px;width:150px;height:150px;border-width:16px;transform:translateX(50%) rotate(3deg)}.release-copy h3{font-size:2.55rem}.learning-roadmap{padding:25px 17px 15px;border-radius:24px}.learning-roadmap-heading{padding-left:42px}.learning-track{left:31px}.learning-step{min-height:0;padding:24px 4px 24px 42px;grid-template-columns:1fr}.step-node{left:2px}.step-visual{height:115px}}

/* Тонкие штриховые связи между состояниями вместо тяжёлых круглых указателей. */
.direction.dashed-arrow,.flow-arrow.dashed-arrow{width:92px;height:34px;padding:0;display:block;color:var(--primary);background:transparent;border-radius:0;box-shadow:none;font-size:0}
.dashed-arrow i{position:absolute;left:9px;right:9px;top:50%;height:2px;background:repeating-linear-gradient(90deg,currentColor 0 7px,transparent 7px 13px);transform:translateY(-50%);opacity:.62}
.dashed-arrow::before,.dashed-arrow::after{content:"";position:absolute;top:50%;width:9px;height:9px;border-top:2px solid currentColor;border-right:2px solid currentColor;opacity:.78}
.dashed-arrow.right::before,.dashed-arrow.left::after{display:none}.dashed-arrow.right::after,.dashed-arrow.both::after{right:3px;transform:translateY(-50%) rotate(45deg)}.dashed-arrow.left::before,.dashed-arrow.both::before{left:3px;transform:translateY(-50%) rotate(-135deg)}
@media(max-width:700px){.direction.dashed-arrow,.flow-arrow.dashed-arrow{position:relative!important;width:76px;height:42px}.story-step .direction.dashed-arrow,.story-step .flow-arrow.dashed-arrow{transform:rotate(90deg)}.story-step .reverse-flow .flow-arrow.dashed-arrow{transform:rotate(-90deg)}}