/* ============================================================================
   ONTO ACADEMY — onto.css, выпуск 10 (8 октября 2026)
   Номер выпуска совпадает с числом ?v=10 в home.html, practicum.html и about.html.
   После правки этого файла увеличьте номер здесь и там.
   Общие стили страниц сайта в School Master: главная, лендинг Практикума и «О нас».

   Лежит на хостинге в папке /onto/ вместе с onto.js, fonts/ и img/.
   Страница начинается с <div id="onto" class="onto-v2 …">. Все правила
   привязаны к этому контейнеру, поэтому не задевают платформу,
   а стили платформы не задевают страницу.
   Шрифт, размеры, интерлиньяж и цвета записаны с !important: настройки дизайна
   School Master ставят свои значения для a, p, h1–h6, ul, li тоже с !important.
   Наши правила начинаются с #onto, поэтому среди важных объявлений побеждают они.
   Шкала отступов: 8 · 12 · 16 · 24 · 32 · 48 · 64.
   ============================================================================ */

/* ---------- 1. Шрифт Ubuntu (файлы в папке fonts/): 400, 500 и курсив 400 ---------- */
@font-face{font-family:'Onto Ubuntu';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/ubuntu-cyrillic-400-normal.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Onto Ubuntu';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/ubuntu-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Onto Ubuntu';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/ubuntu-cyrillic-500-normal.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Onto Ubuntu';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/ubuntu-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Onto Ubuntu';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/ubuntu-cyrillic-400-italic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Onto Ubuntu';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/ubuntu-latin-400-italic.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ---------- 2. Основа ---------- */
#onto.onto-v2{
  --ink:#191d34; --navy:#2a2f47; --accent:#ff931f; --accent-dark:#e07a00;
  --surface:#f4f6fb; --muted:#5a5e75; --line:#e3e5ee;
  box-sizing:border-box; display:block; width:100%; margin:0; padding:0;
  font-family:'Onto Ubuntu','Ubuntu',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif !important;
  font-size:18px !important; line-height:1.6 !important; font-weight:400 !important; font-style:normal !important; letter-spacing:normal !important;
  color:var(--ink) !important; background:#fff; text-align:left; overflow-wrap:break-word;
  -webkit-font-smoothing:antialiased; -webkit-text-size-adjust:100%;
}
#onto.onto-v2 *,#onto.onto-v2 *::before,#onto.onto-v2 *::after{box-sizing:border-box}
#onto.onto-v2 h1,#onto.onto-v2 h2,#onto.onto-v2 h3,#onto.onto-v2 p{
  margin:0; padding:0; border:0; background:none; float:none;
  font-family:inherit !important; font-style:normal !important; text-transform:none !important; text-shadow:none; text-indent:0;
}
#onto.onto-v2 a{color:inherit !important; text-decoration:none !important; background:none; box-shadow:none}
#onto.onto-v2 svg{display:block; flex:0 0 auto}
#onto.onto-v2 :focus-visible{outline:2px solid var(--accent); outline-offset:3px}
#onto.onto-v2 p{font-size:inherit !important; line-height:1.6 !important; font-weight:400 !important; color:inherit !important; margin:0}
#onto.onto-v2 p + p{margin-top:12px}
#onto.onto-v2 b,#onto.onto-v2 strong{font-weight:500 !important}
#onto.onto-v2 em{font-style:italic !important}
#onto.onto-v2 ul,#onto.onto-v2 ol{margin:0; padding:0; list-style:none}
#onto.onto-v2 li{margin:0; padding:0}
#onto.onto-v2 :is(h1,h2,h3,h4,h5,h6,p,ul,ol,li){font-family:inherit !important}
#onto.onto-v2 :is(ul,ol,li){font-size:inherit !important; line-height:inherit !important}
#onto.onto-v2 figure{margin:0}
#onto.onto-v2 img{display:block; max-width:100%; height:auto; border:0}
#onto.onto-v2 details,#onto.onto-v2 summary{margin:0; padding:0; border:0; background:none; color:inherit !important; font-size:inherit !important}

/* --- секции и сетка --- */
#onto.onto-v2 .v-sec{padding:80px 24px; background:#fff}
#onto.onto-v2 .v-sec--surface{background:var(--surface)}
#onto.onto-v2 .v-sec--navy{background:var(--navy); color:#fff !important}
#onto.onto-v2 .v-wrap{max-width:1100px; margin:0 auto}
#onto.onto-v2 .v-narrow{max-width:720px}
#onto.onto-v2 .v-h2{font-size:40px !important; line-height:1.15 !important; font-weight:500 !important; letter-spacing:-.01em !important; color:inherit !important; margin:0 0 20px}
#onto.onto-v2 .v-h3{font-size:21px !important; line-height:1.3 !important; font-weight:500 !important; letter-spacing:0 !important; color:inherit !important; margin:0 0 8px}
#onto.onto-v2 .v-intro{font-size:20px !important; line-height:1.55 !important; color:var(--ink) !important; max-width:760px}
#onto.onto-v2 .v-sec--navy .v-intro{color:rgba(255,255,255,.9) !important}
#onto.onto-v2 .v-muted{color:var(--muted) !important}
#onto.onto-v2 .v-gap{margin-top:32px}

/* --- кнопки, ссылки, строка условий --- */
#onto.onto-v2 .v-actions{display:flex; flex-wrap:wrap; align-items:center; gap:12px 24px; margin-top:32px; font-size:inherit !important; line-height:inherit !important; color:inherit !important; letter-spacing:normal !important}
#onto.onto-v2 .v-btn,#onto.onto-v2 .v-btn:link,#onto.onto-v2 .v-btn:visited{
  display:inline-flex; align-items:center; justify-content:center; min-height:52px; max-width:100%;
  padding:14px 28px; border:0; border-radius:10px; background:var(--accent); color:#fff !important;
  font-family:inherit !important; font-size:18px !important; line-height:1.25 !important; font-weight:500 !important; letter-spacing:0 !important;
  text-align:center; text-decoration:none !important; cursor:pointer; transition:background-color .2s;
}
#onto.onto-v2 .v-btn:hover,#onto.onto-v2 .v-btn:focus-visible{background:var(--accent-dark); color:#fff !important; text-decoration:none !important}
#onto.onto-v2 .v-btn.v-btn--line,#onto.onto-v2 .v-btn.v-btn--line:link,#onto.onto-v2 .v-btn.v-btn--line:visited{background:transparent; color:var(--ink) !important; box-shadow:inset 0 0 0 1.5px var(--ink)}
#onto.onto-v2 .v-btn.v-btn--line:hover{background:var(--ink); color:#fff !important}
#onto.onto-v2 .v-note{font-size:15px !important; line-height:1.5 !important; color:var(--muted) !important}
#onto.onto-v2 .v-sec--navy .v-note,#onto.onto-v2 .v-hero .v-note{color:rgba(255,255,255,.78) !important}
#onto.onto-v2 .v-link,#onto.onto-v2 .v-link:link,#onto.onto-v2 .v-link:visited{color:inherit !important; text-decoration:underline !important; text-decoration-thickness:1px !important; text-underline-offset:3px !important}
#onto.onto-v2 .v-link:hover{color:var(--accent-dark) !important}
#onto.onto-v2 .v-hero .v-link:hover,#onto.onto-v2 .v-sec--navy .v-link:hover{color:#fff !important; text-decoration-thickness:2px !important}

/* --- первый экран --- */
#onto.onto-v2 .v-hero{position:relative; isolation:isolate; overflow:hidden; padding:96px 24px; background:var(--navy); color:#fff !important}
#onto.onto-v2 .v-hero--photo::before{
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:url(img/hero.jpg) 70% 30% / cover no-repeat; opacity:.42;
  -webkit-mask-image:linear-gradient(90deg,transparent 25%,#000 85%); mask-image:linear-gradient(90deg,transparent 25%,#000 85%);
}
#onto.onto-v2 .v-over{font-size:14px !important; line-height:1.4 !important; font-weight:500 !important; letter-spacing:.12em !important; text-transform:uppercase !important; color:rgba(255,255,255,.72) !important; margin:0 0 16px}
#onto.onto-v2 .v-h1{font-size:clamp(30px,4.6vw,52px) !important; line-height:1.12 !important; font-weight:500 !important; letter-spacing:-.01em !important; color:#fff !important; margin:0 0 24px; max-width:820px}
#onto.onto-v2 .v-lead{font-size:20px !important; line-height:1.55 !important; color:rgba(255,255,255,.92) !important; max-width:640px}
#onto.onto-v2 .v-hero .v-actions{margin-top:32px}
#onto.onto-v2 .v-hero__alt{margin-top:24px; font-size:16px !important; color:rgba(255,255,255,.85) !important}

/* --- ситуации («С чем к нам приходят?»): карточки; к самодиагностике ведёт стрелка --- */
#onto.onto-v2 .v-cards{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin-top:40px}
#onto.onto-v2 .v-card{display:flex; flex-direction:column; padding:24px 24px 20px; background:#fff; border:1px solid var(--line); border-radius:14px}
#onto.onto-v2 .v-card__n{display:block; font-size:14px !important; line-height:1 !important; font-weight:500 !important; letter-spacing:.08em !important; color:var(--muted) !important; margin-bottom:20px}
#onto.onto-v2 .v-card__n::after{content:""; display:block; width:28px; height:2px; margin-top:12px; background:var(--accent)}
#onto.onto-v2 .v-card__t{font-size:21px !important; line-height:1.3 !important; font-weight:500 !important; color:var(--ink) !important; margin:0 0 10px}
#onto.onto-v2 .v-card__d{font-size:17px !important; line-height:1.55 !important; color:var(--muted) !important}
#onto.onto-v2 .v-card__go,#onto.onto-v2 .v-card__go:link,#onto.onto-v2 .v-card__go:visited{
  display:flex; align-items:center; justify-content:center; align-self:flex-end; flex:0 0 auto;
  width:48px; height:48px; margin-top:auto; border-radius:50%;
  border:1.5px solid var(--line); background:#fff; color:var(--ink) !important; transition:background-color .2s, border-color .2s, color .2s;
}
#onto.onto-v2 .v-card__d + .v-card__go{margin-top:16px}
#onto.onto-v2 .v-card__d{flex:1 1 auto}
#onto.onto-v2 .v-card__go svg{width:20px; height:20px; transition:transform .2s}
#onto.onto-v2 .v-card__go:hover,#onto.onto-v2 .v-card__go:focus-visible{background:var(--accent); border-color:var(--accent); color:#fff !important}
#onto.onto-v2 .v-card__go:hover svg,#onto.onto-v2 .v-card__go:focus-visible svg{transform:translateX(2px)}
#onto.onto-v2 .v-card__go:focus-visible{border-radius:50%}
#onto.onto-v2 .v-after{margin-top:32px; max-width:760px}

/* --- пронумерованные пункты («Что здесь происходит?») --- */
#onto.onto-v2 .v-steps{counter-reset:v-step; max-width:820px; margin-top:40px}
#onto.onto-v2 .v-steps > li{counter-increment:v-step; display:grid; grid-template-columns:40px minmax(0,1fr); column-gap:16px; padding-top:20px; border-top:2px solid var(--ink)}
#onto.onto-v2 .v-steps > li + li{margin-top:28px}
#onto.onto-v2 .v-steps > li::before{content:counter(v-step); grid-row:1 / span 2; font-size:28px !important; line-height:1 !important; font-weight:500 !important; color:var(--accent-dark) !important; font-variant-numeric:tabular-nums}
#onto.onto-v2 .v-steps > li > .v-h3{margin-bottom:6px}
#onto.onto-v2 .v-steps > li > p{color:var(--muted) !important}

/* --- две колонки: текст и изображение --- */
#onto.onto-v2 .v-split{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:48px; align-items:start}
#onto.onto-v2 .v-split.is-single{grid-template-columns:minmax(0,1fr)}
#onto.onto-v2 .v-fig img{width:100%; border-radius:12px}
#onto.onto-v2 .v-fig--frame img{border:1px solid var(--line)}
/* снимок экрана из нескольких частей: одна рамка, части друг под другом */
#onto.onto-v2 .v-shot{border:1px solid var(--line); border-radius:12px; overflow:hidden; background:#fff}
#onto.onto-v2 .v-shot__part img{width:100%; border:0; border-radius:0}
#onto.onto-v2 .v-shot__part + .v-shot__part{border-top:1px solid var(--line)}
#onto.onto-v2 .v-fig figcaption{margin-top:8px; font-size:15px !important; line-height:1.5 !important; color:var(--muted) !important}
#onto.onto-v2 [hidden]{display:none !important}

/* --- списки --- */
#onto.onto-v2 .v-list{margin-top:16px}
#onto.onto-v2 .v-list > li{position:relative; padding-left:24px}
#onto.onto-v2 .v-list > li + li{margin-top:8px}
#onto.onto-v2 .v-list > li::before{content:""; position:absolute; left:4px; top:.72em; width:8px; height:2px; background:var(--muted)}
#onto.onto-v2 .v-ol{counter-reset:v-ol; margin-top:16px}
#onto.onto-v2 .v-ol.v-ol--from5{counter-reset:v-ol 4}
#onto.onto-v2 .v-ol > li{counter-increment:v-ol; position:relative; padding-left:40px}
#onto.onto-v2 .v-ol > li + li{margin-top:12px}
#onto.onto-v2 .v-ol > li::before{content:counter(v-ol); position:absolute; left:0; top:0; width:28px; font-weight:500 !important; color:var(--accent-dark) !important; font-variant-numeric:tabular-nums}
#onto.onto-v2 .v-ol b{display:inline}

/* --- каталог «4 составляющие + 3 качества» под снимком результата ---
   в каждой группе показано одно описание; без скрипта видны все семь */
#onto.onto-v2 .v-cat{margin-top:56px}
#onto.onto-v2 .v-cat__group + .v-cat__group{margin-top:40px}
#onto.onto-v2 .v-cat__label{font-size:14px !important; line-height:1.4 !important; font-weight:500 !important; letter-spacing:.08em !important; text-transform:uppercase !important; color:var(--muted) !important; margin:0 0 14px}
#onto.onto-v2 .v-cat__grid{display:grid; gap:12px}
#onto.onto-v2 .v-cat__grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
#onto.onto-v2 .v-cat__grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
#onto.onto-v2 .v-cat__card{
  position:relative; display:flex; flex-direction:column; align-items:flex-start; gap:4px; width:100%; min-height:76px;
  margin:0; padding:14px 44px 14px 18px; text-align:left; cursor:pointer;
  background:#fff; border:1.5px solid var(--line); border-radius:12px; color:var(--ink) !important;
  font-family:inherit !important; font-size:16px !important; line-height:1.25 !important; letter-spacing:normal !important; text-transform:none !important;
  -webkit-tap-highlight-color:transparent; transition:border-color .2s, background-color .2s;
}
#onto.onto-v2 .v-cat__card:hover{border-color:#b9bccb}
#onto.onto-v2 .v-cat__card[aria-expanded="true"]{border-color:var(--accent); background:#fff4e8}
#onto.onto-v2 .v-cat__card:focus-visible{outline:2px solid var(--accent); outline-offset:3px}
#onto.onto-v2 .v-cat__name{font-size:19px !important; line-height:1.25 !important; font-weight:500 !important; color:var(--ink) !important}
#onto.onto-v2 .v-cat__teaser{font-size:15px !important; line-height:1.35 !important; color:var(--muted) !important}
#onto.onto-v2 .v-cat__icon{position:absolute; right:16px; top:18px; width:14px; height:14px; color:var(--muted) !important; transition:transform .2s}
/* у выбранной карточки значка нет: её описание уже показано, закрыть его нельзя */
#onto.onto-v2 .v-cat__card[aria-expanded="true"] .v-cat__icon{opacity:0}

/* описания: без скрипта — все, со скриптом — одно выбранное в группе */
#onto.onto-v2 .v-cat__panels{margin-top:12px}
#onto.onto-v2 .v-cat__panel{padding:20px 24px; background:var(--surface); border-radius:12px; color:var(--muted) !important}
#onto.onto-v2 .v-cat__panel + .v-cat__panel{margin-top:8px}
#onto.onto-v2 .v-cat__pname{font-size:19px !important; line-height:1.3 !important; font-weight:500 !important; color:var(--ink) !important; margin:0 0 6px}
#onto.onto-v2 .v-cat__panel p{max-width:760px}
#onto.onto-v2 .v-cat.is-live .v-cat__panel{display:none}
#onto.onto-v2 .v-cat.is-live .v-cat__panel.is-on{display:block}
#onto.onto-v2 .v-cat:not(.is-live) .v-cat__icon{display:none}

/* --- организатор --- */
#onto.onto-v2 .v-person{display:flex; gap:40px; align-items:flex-start}
#onto.onto-v2 .v-person .v-fig{flex:0 0 220px}
#onto.onto-v2 .v-person__text{flex:1 1 auto; max-width:720px}
#onto.onto-v2 .v-person__name{font-size:22px !important; line-height:1.3 !important; font-weight:500 !important}
#onto.onto-v2 .v-person__role{font-style:italic !important; color:var(--muted) !important; margin:4px 0 16px !important}
#onto.onto-v2 .v-person--big{gap:56px}
#onto.onto-v2 .v-person--big .v-fig{flex:0 0 300px}
#onto.onto-v2 .v-person--big .v-fig img{width:100%; aspect-ratio:4 / 5; object-fit:cover; object-position:42% 50%; border-radius:14px}
#onto.onto-v2 .v-person--big .v-person__name{font-size:26px !important; line-height:1.25 !important}
#onto.onto-v2 .v-pull{margin:24px 0 !important; padding-left:20px; border-left:3px solid var(--accent); font-size:21px !important; line-height:1.5 !important; color:var(--ink) !important}

/* --- строки с выделенным началом («Чего здесь нет», «Чего Практикум не делает») --- */
#onto.onto-v2 .v-rows{margin-top:24px; max-width:820px}
#onto.onto-v2 .v-rows > li{padding:16px 0; border-top:1px solid var(--line)}
#onto.onto-v2 .v-rows > li:last-child{border-bottom:1px solid var(--line)}
#onto.onto-v2 .v-rows--cols{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; max-width:none; margin-top:32px}
#onto.onto-v2 .v-rows--cols > li{padding:20px 0 0; border-top:2px solid var(--ink); color:var(--muted) !important}
#onto.onto-v2 .v-rows--cols > li:last-child{border-bottom:0}
#onto.onto-v2 .v-rows--2{grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px 48px}
#onto.onto-v2 .v-rows--cols > li b{display:block; margin-bottom:8px; font-size:20px !important; line-height:1.3 !important; color:var(--ink) !important}

/* --- вопросы --- */
#onto.onto-v2 .v-faq{margin-top:24px; max-width:820px}
#onto.onto-v2 .v-q{border-top:1px solid var(--line)}
#onto.onto-v2 .v-q:last-child{border-bottom:1px solid var(--line)}
#onto.onto-v2 .v-q > summary{display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 0; cursor:pointer; list-style:none; font-size:19px !important; line-height:1.35 !important; font-weight:500 !important; color:var(--ink) !important}
#onto.onto-v2 .v-q > summary::-webkit-details-marker{display:none}
#onto.onto-v2 .v-q > summary::marker{content:""}
#onto.onto-v2 .v-q > summary svg{flex:0 0 14px; width:14px; height:14px; color:var(--muted) !important; transition:transform .2s}
#onto.onto-v2 .v-q[open] > summary svg{transform:rotate(45deg)}
#onto.onto-v2 .v-q__a{padding:0 0 20px; color:var(--muted) !important; max-width:720px}

/* --- лендинг: сцены, недели, треки, неделя, сообщество, участие --- */
#onto.onto-v2 .v-scenes{display:grid; grid-template-columns:1fr 1fr; gap:32px; margin-top:40px}
/* сцены трека — карточки; иллюстрация во всю ширину карточки в исходной пропорции, без обрезки */
#onto.onto-v2 .v-scene{display:flex; flex-direction:column; padding:0 0 24px; background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden}
#onto.onto-v2 .v-scene .v-fig{margin:0 0 20px}
#onto.onto-v2 .v-scene .v-fig img{width:100%; height:auto; border-radius:0}
#onto.onto-v2 .v-scene > .v-h3,#onto.onto-v2 .v-scene > p{padding:0 24px}
#onto.onto-v2 .v-scene__aim{margin-top:12px !important; color:var(--muted) !important}
#onto.onto-v2 .v-scene__aim b{color:var(--ink) !important}
#onto.onto-v2 .v-weeks{display:grid; grid-template-columns:1fr 1fr; gap:32px 48px; margin-top:48px}
#onto.onto-v2 .v-weeks .v-ol li{color:var(--muted) !important}
#onto.onto-v2 .v-weeks .v-ol li b{color:var(--ink) !important}
/* шесть треков — те же карточки, что ситуации на главной; открытый трек — с оранжевой рамкой */
#onto.onto-v2 .v-card.is-open{border-color:var(--accent)}
#onto.onto-v2 .v-tag{display:inline-block; align-self:flex-start; margin:16px 0 0; padding:1px 8px; border-radius:6px; background:var(--ink); color:#fff !important; font-size:13px !important; line-height:1.6 !important; font-weight:500 !important; vertical-align:2px}
/* неделя — три карточки с иллюстрациями в исходной пропорции */
#onto.onto-v2 .v-days{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin-top:40px}
#onto.onto-v2 .v-day{display:flex; flex-direction:column; padding:0 0 24px; background:#fff; border-radius:16px; overflow:hidden}
#onto.onto-v2 .v-day .v-fig{margin:0 0 20px}
#onto.onto-v2 .v-day .v-fig img{width:100%; height:auto; border-radius:0}
#onto.onto-v2 .v-day > .v-h3,#onto.onto-v2 .v-day > p{padding:0 22px}
#onto.onto-v2 .v-day > p{color:var(--muted) !important}
#onto.onto-v2 .v-day > p + p{margin-top:8px}
#onto.onto-v2 .v-quote{font-size:22px !important; line-height:1.4 !important; font-weight:500 !important; max-width:720px; margin-bottom:8px !important}
#onto.onto-v2 .v-quote.v-pull{margin:8px 0 0 !important}
#onto.onto-v2 .v-stack p{color:var(--muted) !important}
#onto.onto-v2 .v-stack p + p{margin-top:16px}
#onto.onto-v2 .v-stack p b{color:var(--ink) !important}
#onto.onto-v2 .v-pricebox{max-width:820px; margin-top:24px; padding:32px; border:1px solid var(--line); border-radius:12px; background:#fff}
#onto.onto-v2 .v-price{font-size:40px !important; line-height:1.1 !important; font-weight:500 !important; margin:0 0 24px}
/* участие: условия и иллюстрация рядом (на компьютере) */
#onto.onto-v2 .v-price-split{display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:32px; align-items:start; margin-top:24px}
#onto.onto-v2 .v-price-split .v-pricebox{max-width:none; margin-top:0}
#onto.onto-v2 .v-price-split__fig{margin:0}
#onto.onto-v2 .v-price-split__fig img{width:100%; height:auto; border-radius:16px}
#onto.onto-v2 .v-price small{font-size:20px !important; font-weight:400 !important; color:var(--muted) !important}

/* --- «О нас»: первый экран с иллюстрацией, эпиграф, низ карточки с меткой и стрелкой --- */
#onto.onto-v2 .v-hero .v-split{align-items:center}
#onto.onto-v2 .v-hero .v-fig img{border-radius:14px}
#onto.onto-v2 .v-epi{max-width:820px; margin:0 0 48px}
#onto.onto-v2 .v-epi .v-quote{font-size:28px !important; line-height:1.35 !important; margin:0 !important}
#onto.onto-v2 .v-epi__by{margin-top:12px !important; padding-left:23px; font-size:16px !important; line-height:1.5 !important; color:var(--muted) !important}
#onto.onto-v2 .v-card__foot{display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:48px; margin-top:16px}
#onto.onto-v2 .v-card__foot .v-tag{margin:0}
#onto.onto-v2 .v-card__foot .v-card__go{margin:0 0 0 auto}

/* --- лендинг: состояния по метке трека (класс ставит скрипт; без скрипта — «без результата») --- */
#onto.onto-v2 [data-show]{display:none}
#onto.onto-v2.is-plain [data-show~="plain"],
#onto.onto-v2.is-open [data-show~="open"],#onto.onto-v2.is-open [data-show~="result"],
#onto.onto-v2.is-soon [data-show~="soon"],#onto.onto-v2.is-soon [data-show~="result"]{display:block}
#onto.onto-v2 .v-when-base{display:none}
#onto.onto-v2 .is-base .v-when-base{display:inline}
#onto.onto-v2 .is-base .v-when-open{display:none}

/* --- пустой блок платформы под страницей (около 175 px пустого места перед подвалом) ---
   скрывается, только если в нём ничего нет */
body:has(#onto.onto-v2) #content:has(> #main .maincol):not(:has(.maincol *)){display:none}
/* --- статичная страница (лендинг): платформа даёт по 40 px пустого места сверху и снизу --- */
body:has(#onto.onto-v2) .content-wrap:has(#onto.onto-v2),
body:has(#onto.onto-v2) .maincol-inner:has(> #onto.onto-v2){padding-top:0 !important; padding-bottom:0 !important}

/* --- появление блоков при прокрутке: только со скриптом и без «уменьшения движения» --- */
#onto.onto-v2.v-js-reveal .v-reveal{opacity:0; transform:translateY(16px); transition:opacity .5s ease, transform .5s ease}
#onto.onto-v2.v-js-reveal .v-reveal.is-in{opacity:1; transform:none}

/* --- клавиатура и движение --- */
#onto.onto-v2 a:focus-visible,#onto.onto-v2 summary:focus-visible{outline:2px solid var(--accent); outline-offset:3px; border-radius:4px}

/* --- планшет и телефон --- */
@media (max-width:900px){
  #onto.onto-v2 .v-price-split{grid-template-columns:minmax(0,1fr)}
  /* на планшете и телефоне иллюстрация у цены не нужна: похожая стоит экраном выше */
  #onto.onto-v2 .v-price-split__fig{display:none}
  #onto.onto-v2 .v-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  #onto.onto-v2 .v-split,#onto.onto-v2 .v-scenes{grid-template-columns:minmax(0,1fr); gap:32px}
  #onto.onto-v2 .v-hero{padding:64px 24px}
}
@media (max-width:700px){
  #onto.onto-v2{font-size:17px !important}
  #onto.onto-v2 .v-sec{padding:48px 16px}
  #onto.onto-v2 .v-hero{padding:40px 16px 48px}
  #onto.onto-v2 .v-hero--photo::before{opacity:.25; -webkit-mask-image:linear-gradient(180deg,transparent 35%,#000 100%); mask-image:linear-gradient(180deg,transparent 35%,#000 100%)}
  #onto.onto-v2 .v-lead{font-size:18px !important}
  #onto.onto-v2 .v-h2{font-size:30px !important}
  #onto.onto-v2 .v-intro{font-size:18px !important}
  #onto.onto-v2 .v-h3,#onto.onto-v2 .v-card__t{font-size:19px !important}
  #onto.onto-v2 .v-weeks,#onto.onto-v2 .v-days{grid-template-columns:minmax(0,1fr); gap:24px}
  #onto.onto-v2 .v-scene > .v-h3,#onto.onto-v2 .v-scene > p,#onto.onto-v2 .v-day > .v-h3,#onto.onto-v2 .v-day > p{padding:0 18px}
  #onto.onto-v2 .v-rows--2{grid-template-columns:minmax(0,1fr); gap:24px}
  #onto.onto-v2 .v-cards{grid-template-columns:minmax(0,1fr); gap:12px; margin-top:28px}
  #onto.onto-v2 .v-card{padding:20px}
  #onto.onto-v2 .v-card__n{margin-bottom:14px}
  #onto.onto-v2 .v-card__n::after{margin-top:10px}
  #onto.onto-v2 .v-card__d{font-size:16px !important}
  #onto.onto-v2 .v-steps{margin-top:28px}

  #onto.onto-v2 .v-cat{margin-top:40px}
  #onto.onto-v2 .v-cat__grid--4{grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px}
  #onto.onto-v2 .v-cat__grid--3{grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px}
  #onto.onto-v2 .v-cat__card{min-height:56px; padding:12px 30px 12px 12px; justify-content:center}
  #onto.onto-v2 .v-cat__name{font-size:16px !important}
  #onto.onto-v2 .v-cat__teaser{display:none}
  #onto.onto-v2 .v-cat__icon{right:10px; top:50%; margin-top:-6px; width:12px; height:12px}
  #onto.onto-v2 .v-cat__panel{padding:16px 18px}
  #onto.onto-v2 .v-cat__pname{font-size:18px !important}
  /* три качества в ряд: названия по центру, без значка */
  #onto.onto-v2 .v-cat__grid--3 .v-cat__card{padding:12px 8px; align-items:center; text-align:center}
  #onto.onto-v2 .v-cat__grid--3 .v-cat__icon{display:none}
  #onto.onto-v2 .v-person{flex-direction:column; gap:24px}
  #onto.onto-v2 .v-person .v-fig{flex:none; width:160px}
  #onto.onto-v2 .v-person--big .v-fig{width:100%; max-width:360px}
  #onto.onto-v2 .v-person--big .v-fig img{aspect-ratio:4 / 3}
  #onto.onto-v2 .v-pull{font-size:19px !important}
  #onto.onto-v2 .v-epi{margin-bottom:32px}
  #onto.onto-v2 .v-epi .v-quote{font-size:22px !important}
  #onto.onto-v2 .v-rows--cols{grid-template-columns:minmax(0,1fr); gap:24px}
  #onto.onto-v2 .v-pricebox{padding:24px 20px}
  #onto.onto-v2 .v-price{font-size:34px !important}
  #onto.onto-v2 .v-btn{width:100%}
  #onto.onto-v2 .v-actions{gap:12px}
  #onto.onto-v2 .v-q > summary{font-size:18px !important}
}
@media (max-width:380px){
  /* небольшие телефоны: кнопка первого экрана остаётся в пределах экрана и при длинном вступлении */
  #onto.onto-v2 .v-hero{padding-top:28px}
  #onto.onto-v2 .v-over{margin-bottom:12px}
  #onto.onto-v2 .v-h1{font-size:28px !important; margin-bottom:16px}
  #onto.onto-v2 .v-lead{font-size:17px !important; line-height:1.5 !important}
  #onto.onto-v2 .v-hero .v-actions{margin-top:24px}
}
@media (max-width:340px){
  /* самые узкие телефоны (320 px): кнопка первого экрана остаётся видна и при самом длинном вступлении («трек готовится») */
  #onto.onto-v2 .v-hero{padding-top:20px; padding-bottom:36px}
  #onto.onto-v2 .v-over{margin-bottom:8px}
  #onto.onto-v2 .v-h1{font-size:24px !important; margin-bottom:12px}
  #onto.onto-v2 .v-lead{font-size:16px !important; line-height:1.45 !important}
  #onto.onto-v2 .v-hero .v-actions{margin-top:18px}
}
@media (max-width:360px){
  #onto.onto-v2 .v-cat__grid--3{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){
  #onto.onto-v2 *{transition:none !important}
  #onto.onto-v2.v-js-reveal .v-reveal{opacity:1; transform:none}
}