/* onb.css — надстройка над deck.css для страниц онбординга и аттестации
   (/onbording/ — версия-колода, /onbording-2/ — версия-лендинг).
   Палитра и переменные — из .dk-page (канон ДС): акцент #EE6A1F, графит #1B2230, бумага #F2EFEA.
   Градиентов и тяжёлых теней нет, радиусы ≤10px. */

/* --- липкая шапка (версия-лендинг) --- */
.dk-top.is-sticky{position:sticky;top:0;z-index:50}

/* --- маршрут адаптации: 5 этапов в ряд --- */
.ob-route{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.ob-route .dk-card{padding:20px}
.ob-route .dk-card h4{font-size:17px;margin:0 0 8px}
.ob-route .dk-card p{font-size:14.5px}
.ob-route__n{display:block;font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--dk-accent);font-weight:700;margin-bottom:10px}
.ob-route .is-last{border-color:rgba(238,106,31,.4);background:rgba(238,106,31,.06)}
@media(max-width:1000px){.ob-route{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.ob-route{grid-template-columns:1fr}}

/* --- строка кейса: описание слева, результат справа --- */
.ob-case{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}
.ob-case__res{text-align:right;min-width:150px;flex:0 0 auto}
.ob-case__res b{display:block;font-family:'Manrope','Inter',sans-serif;font-size:22px;font-weight:700;
  letter-spacing:-.02em;color:var(--dk-accent-ink);line-height:1.1}
.ob-case__res span{display:block;margin-top:7px;font-family:'JetBrains Mono',monospace;font-size:11px;
  letter-spacing:.08em;text-transform:uppercase;color:var(--dk-muted)}
@media(max-width:560px){.ob-case{flex-direction:column}.ob-case__res{text-align:left;min-width:0}}

/* --- «кто и что делает»: иконка + текст в строку --- */
.ob-role{display:grid;grid-template-columns:46px 1fr;gap:16px;align-items:start}
.ob-role+.ob-role{margin-top:18px;padding-top:18px;border-top:1px solid var(--dk-line)}
.dk-slide--dark .ob-role+.ob-role{border-top-color:rgba(255,255,255,.14)}
.ob-role .dk-ic{width:46px;height:46px;margin:0}
.ob-role p{margin:0;font-size:15.5px;line-height:1.5;color:var(--dk-ink-2)}
.dk-slide--dark .ob-role p{color:var(--dk-on-2)}
.ob-role b{color:var(--dk-ink);font-weight:700}
.dk-slide--dark .ob-role b{color:#fff}

/* --- калькулятор потерь --- */
.ob-calc{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:start}
@media(max-width:900px){.ob-calc{grid-template-columns:1fr}}
.ob-field+.ob-field{margin-top:20px}
.ob-field label{display:flex;justify-content:space-between;align-items:baseline;gap:14px;
  font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--dk-muted);font-weight:600;margin-bottom:9px}
.ob-field output{font-size:15px;letter-spacing:0;text-transform:none;color:var(--dk-accent-ink);font-weight:700;white-space:nowrap}
.ob-field input[type=range]{width:100%;accent-color:var(--dk-accent);height:22px;cursor:pointer}
.ob-field input[type=range]:focus-visible{outline:2px solid var(--dk-accent);outline-offset:3px}
.ob-out{background:var(--dk-ink);border-radius:10px;padding:26px;color:#fff}
.ob-out__lbl{display:block;font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.12em;
  text-transform:uppercase;color:rgba(255,255,255,.55);margin-bottom:10px}
.ob-out__v{display:block;font-family:'Manrope','Inter',sans-serif;font-size:clamp(28px,4vw,40px);
  font-weight:700;letter-spacing:-.02em;line-height:1.05;color:#fff}
.ob-out__after{margin-top:22px;padding-top:20px;border-top:1px solid rgba(255,255,255,.16)}
.ob-out__after .ob-out__v{font-size:clamp(22px,3vw,30px);color:var(--dk-accent)}
.ob-out__note{margin:10px 0 0;font-size:13.5px;line-height:1.5;color:rgba(255,255,255,.6)}

/* --- FAQ --- */
.ob-faq{max-width:900px}
.ob-faq details{background:#fff;border:1px solid var(--dk-line);border-radius:10px;padding:18px 22px}
.ob-faq details+details{margin-top:12px}
.ob-faq summary{font-family:'Manrope','Inter',sans-serif;font-size:17px;font-weight:600;letter-spacing:-.01em;
  cursor:pointer;list-style:none;position:relative;padding-right:34px;color:var(--dk-ink)}
.ob-faq summary::-webkit-details-marker{display:none}
.ob-faq summary::after{content:"+";position:absolute;right:0;top:-3px;font-size:22px;font-weight:400;
  color:var(--dk-accent);line-height:1}
.ob-faq details[open] summary::after{content:"–"}
.ob-faq details p{margin:12px 0 0;font-size:15.5px;line-height:1.55;color:var(--dk-ink-2)}
.ob-faq summary:focus-visible{outline:2px solid var(--dk-accent);outline-offset:3px;border-radius:4px}

/* подпись под списком внутри карточки — отделяем линией */
.dk-card .dk-check+.dk-hint{margin-top:18px;padding-top:14px;border-top:1px solid var(--dk-line)}
.dk-slide--dark .dk-card .dk-check+.dk-hint{border-top-color:rgba(255,255,255,.14)}

/* --- гарантии первого шага --- */
.ob-guard{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 0}
.ob-guard span{font-family:'JetBrains Mono',monospace;font-size:11.5px;letter-spacing:.08em;
  text-transform:uppercase;border:1px solid var(--dk-line);border-radius:999px;padding:8px 15px;color:var(--dk-ink-2)}
.dk-slide--dark .ob-guard span{border-color:rgba(255,255,255,.22);color:var(--dk-on)}

/* --- форма внутри тёмной секции --- */
.dk-slide--dark .dk-form label{color:rgba(255,255,255,.55)}
.dk-slide--dark .dk-form input[type=text],
.dk-slide--dark .dk-form textarea{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.2);color:#fff}
.dk-slide--dark .dk-form input[type=text]::placeholder,
.dk-slide--dark .dk-form textarea::placeholder{color:rgba(255,255,255,.4)}
.dk-slide--dark .dk-form__consent{color:var(--dk-on-2)}
.dk-slide--dark .dk-form__consent a{color:var(--dk-accent)}
.dk-slide--dark .dk-form__ok{color:var(--dk-accent)}

/* --- полосы показателей на тёмном --- */
.dk-slide--dark .dk-bar__t{background:rgba(255,255,255,.1)}
.dk-slide--dark .dk-bar__v{color:#fff}

/* --- переключатель версий (пока Олеся выбирает) --- */
.ob-switch{background:var(--dk-paper-2);border-top:1px solid var(--dk-line);padding:16px 0;font-size:14px;color:var(--dk-ink-2)}
.ob-switch__in{max-width:1160px;margin:0 auto;padding:0 24px;display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center}
.ob-switch a{color:var(--dk-accent-ink);font-weight:600}