:root{--bg:#f4f3ec;--surface:#fff;--ink:#1c1a1a;--ink2:#555349;--ink3:#8f8c7e;
--line:#e4e2d5;--line-soft:#eeecdf;--pine:#0e4a38;--pine-2:#13624b;--pine-soft:#e2efe7;
--emerald:#06d6a0;--emerald-deep:#0aa87e;--lime:#e9ff96;
--r:20px;--r-sm:14px;--shadow:0 1px 2px rgba(28,26,26,.04),0 16px 40px -18px rgba(28,26,26,.16);
--ease:cubic-bezier(.22,.8,.28,1)}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Onest',-apple-system,'Segoe UI',Roboto,sans-serif;background:var(--bg);color:var(--ink);line-height:1.55;
background-image:radial-gradient(820px 440px at 88% -120px,rgba(6,214,160,.12),transparent 62%),
                 radial-gradient(620px 380px at -12% 22%,rgba(233,255,150,.16),transparent 58%);
background-attachment:fixed}
a{color:var(--pine);text-decoration:none}
.wrap{max-width:1000px;margin:0 auto;padding:0 20px}

/* ---------- шапка ---------- */
.topbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;row-gap:10px;padding:16px 0;border-bottom:1px solid var(--line)}
.logo{font-family:'Unbounded',sans-serif;font-size:19px;font-weight:700;color:var(--ink)}
.logo i{color:var(--emerald-deep);font-style:normal}
.topbar .btn{margin-left:auto}
.btn{display:inline-block;padding:13px 22px;border-radius:14px;font-weight:600;font-size:15px;transition:transform .15s,box-shadow .15s,border-color .15s}
.btn-brand{background:var(--pine);color:#fff!important}
.btn-brand:hover{transform:translateY(-1px);box-shadow:0 10px 24px -10px rgba(14,74,56,.5)}
.btn-ghost{border:1.5px solid var(--line);color:var(--ink)!important;background:var(--surface)}
.btn-ghost:hover{border-color:var(--pine)}
.btn:focus-visible{outline:2px solid var(--emerald-deep);outline-offset:2px}

/* ---------- герой ---------- */
.hero{padding:52px 0 26px}
.badge{display:inline-flex;align-items:center;gap:8px;font-family:'JetBrains Mono',monospace;font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--pine);background:var(--lime);border-radius:99px;padding:8px 15px;margin-bottom:20px}
.badge::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--pine)}
h1{font-family:'Unbounded',sans-serif;font-size:clamp(26px,4.4vw,42px);line-height:1.16;margin-bottom:18px;max-width:780px}
h1 .hl{background:linear-gradient(0deg,var(--lime),var(--lime)) 0 84%/100% .34em no-repeat;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.lead{font-size:17px;color:var(--ink2);max-width:720px;margin-bottom:26px}
.cta{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:24px}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{font-size:12.5px;color:var(--pine);background:var(--pine-soft);border-radius:99px;padding:6px 12px;font-weight:600}

section{padding:28px 0}
h2{font-family:'Unbounded',sans-serif;font-size:clamp(20px,2.6vw,25px);line-height:1.25;margin-bottom:14px}
.sec-lead{font-size:15px;color:var(--ink2);max-width:760px;margin:-6px 0 20px}

/* ---------- карточки направлений ---------- */
.dirs{display:grid;gap:14px}
.dir{position:relative;display:grid;grid-template-columns:56px 1fr;gap:16px;padding:20px 22px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden;transition:transform .22s var(--ease),border-color .22s}
.dir::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:linear-gradient(180deg,var(--pine),var(--emerald))}
.dir:hover{transform:translateY(-2px);border-color:var(--emerald)}
.dir-num{font-family:'Unbounded',sans-serif;font-size:22px;font-weight:700;color:var(--pine);opacity:.32;line-height:1.1}
.dir-name{font-family:'Unbounded',sans-serif;font-size:17px;font-weight:700;line-height:1.3}
.dir-code{font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--emerald-deep);margin-bottom:6px;display:block}
.dir-q{font-size:14.5px;color:var(--ink2);margin:8px 0 12px;max-width:640px}
.dir-facts{list-style:none;display:grid;gap:6px;margin-bottom:14px}
.dir-facts li{position:relative;padding-left:18px;font-size:13.5px;color:var(--ink2);line-height:1.5}
.dir-facts li::before{content:"";position:absolute;left:2px;top:8px;width:6px;height:6px;border-radius:50%;background:var(--emerald-deep)}
.dir-foot{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding-top:13px;border-top:1px dashed var(--line)}
.dir-price{font-family:'JetBrains Mono',monospace;font-size:13px;font-weight:700;color:var(--pine)}
.dir-ladder{font-size:12px;color:var(--ink3)}
.dir-link{margin-left:auto;font-size:13.5px;font-weight:700;color:var(--pine);white-space:nowrap}
.dir-link:hover{color:var(--emerald-deep)}
.dir-note{margin-top:10px;font-size:12.5px;color:var(--ink2);background:var(--pine-soft);border-radius:12px;padding:9px 13px}

/* ---------- «что получает каждый» ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:22px;box-shadow:var(--shadow)}
.panel-b2b{border-color:color-mix(in srgb,var(--emerald) 45%,var(--line))}
.panel-tag{font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3);display:block;margin-bottom:8px}
.panel h3{font-family:'Unbounded',sans-serif;font-size:16.5px;margin-bottom:12px}
.panel ul{list-style:none;display:grid;gap:9px}
.panel li{position:relative;padding-left:20px;font-size:14px;color:var(--ink2);line-height:1.5}
.panel li::before{content:"";position:absolute;left:3px;top:8px;width:7px;height:7px;border-radius:2px;background:var(--pine);transform:rotate(45deg)}
.anon{margin-top:14px;display:flex;gap:12px;align-items:flex-start;background:var(--lime);border-radius:var(--r-sm);padding:14px 16px}
.anon b{font-size:13.5px;display:block;margin-bottom:3px;color:var(--pine)}
.anon p{font-size:13px;color:var(--ink2);line-height:1.5}
.anon-ico{flex:none;font-size:18px;line-height:1}

/* ---------- шаги ---------- */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.step{display:flex;gap:14px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);padding:18px;box-shadow:var(--shadow)}
.step-num{flex:none;width:34px;height:34px;border-radius:11px;background:var(--pine);color:#fff;display:grid;place-items:center;font-family:'Unbounded',sans-serif;font-weight:700;font-size:14px}
.step b{display:block;font-size:14.5px;margin-bottom:5px}
.step p{font-size:13px;color:var(--ink2)}

/* ---------- примеры ---------- */
.samples{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.sample{display:block;background:var(--surface);border:1.5px solid var(--pine-soft);border-radius:var(--r-sm);padding:16px 18px;box-shadow:var(--shadow);transition:border-color .15s,transform .15s}
.sample:hover{border-color:var(--pine);transform:translateY(-2px)}
.sample b{display:block;color:var(--pine);font-size:14.5px;margin-bottom:4px}
.sample i{font-style:normal;font-size:12.5px;color:var(--ink3)}

/* ---------- FAQ ---------- */
.faq details{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);padding:16px 19px;margin-bottom:10px;box-shadow:var(--shadow)}
.faq summary{cursor:pointer;font-weight:600;font-size:15px;list-style:none}
.faq summary::before{content:"+";color:var(--pine);font-weight:700;margin-right:10px}
.faq details[open] summary::before{content:"–"}
.faq details p{margin-top:10px;font-size:14px;color:var(--ink2);line-height:1.6}

/* ---------- переход к другой аудитории ---------- */
.cross{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--surface);border:1.5px dashed var(--line);border-radius:var(--r);padding:20px 22px;margin:6px 0 4px}
.cross b{font-family:'Unbounded',sans-serif;font-size:15.5px;display:block;margin-bottom:4px}
.cross p{font-size:13.5px;color:var(--ink2)}
.cross-btn{flex:none}

/* ---------- подпись методолога и подвал ---------- */
.expert{display:flex;gap:16px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px;box-shadow:var(--shadow);margin:24px 0}
.expert img{width:76px;height:76px;border-radius:50%;object-fit:cover;flex:none}
.expert p{font-size:14px;color:var(--ink2);margin:0}
footer{border-top:1px solid var(--line);margin-top:30px;padding:26px 0 44px;font-size:13.5px;color:var(--ink2)}
footer .cols{display:flex;gap:26px;flex-wrap:wrap;align-items:center;justify-content:space-between}
footer .note{font-size:12px;color:var(--ink3);margin-top:14px}

@media (max-width:760px){
  .split{grid-template-columns:1fr}
  .dir{grid-template-columns:1fr;gap:8px;padding:18px}
  .dir-num{font-size:17px}
}
@media (max-width:640px){
  .hero{padding:34px 0 20px}
  .cta .btn{flex:1;text-align:center}
  .cta{flex-direction:column}
  .topbar .btn{margin-left:0;width:100%;text-align:center}
  .cross-btn{width:100%;text-align:center}
}

/* ============================================================
   Кнопка видео на плашке направления (public/video-cta.js)
   ------------------------------------------------------------
   Место — свободный верхний угол плашки: слева стоит номер направления
   01–05, и его колонка занята. Кнопка настоящая, <button type="button">,
   с текстовой подписью и aria-label: берётся с клавиатуры и читается
   скринридером. Переливается мягким бегущим бликом в брендовой палитре;
   при prefers-reduced-motion движение выключается, остаётся статичный
   градиент. Кнопка есть у каждого направления: если ключа ролика нет, кнопки не будет.
   ============================================================ */
.dir-video{
  position:absolute;top:14px;right:16px;z-index:2;
  display:inline-flex;align-items:center;gap:7px;
  padding:7px 13px 7px 11px;border:0;border-radius:99px;cursor:pointer;
  font-family:'Onest',-apple-system,'Segoe UI',Roboto,sans-serif;
  font-size:12.5px;font-weight:600;line-height:1;letter-spacing:.01em;color:#fff;
  background:linear-gradient(100deg,#0e4a38 0%,#13624b 34%,#0aa87e 62%,#0e4a38 100%);
  background-size:230% 100%;background-position:0% 50%;
  box-shadow:0 8px 20px -12px rgba(14,74,56,.7);
  overflow:hidden;isolation:isolate;
  transition:transform .18s var(--ease),box-shadow .18s var(--ease);
}
.dir-video::after{                      /* бегущий блик */
  content:"";position:absolute;inset:-60% -40%;
  background:linear-gradient(105deg,transparent 36%,rgba(233,255,150,.85) 50%,transparent 64%);
  transform:translateX(-130%);pointer-events:none;
}
.dir-video-ico{flex:none;margin-left:1px}
.dir-video:hover{transform:translateY(-1px);box-shadow:0 12px 26px -12px rgba(14,74,56,.85)}
.dir-video:focus-visible{outline:2px solid var(--emerald-deep);outline-offset:3px}
@media (prefers-reduced-motion:no-preference){
  .dir-video{animation:dir-video-sheen 6s cubic-bezier(.45,0,.25,1) infinite}
  .dir-video::after{animation:dir-video-glint 6s cubic-bezier(.45,0,.25,1) infinite}
}
@keyframes dir-video-sheen{
  0%,8%{background-position:0% 50%}
  46%,100%{background-position:100% 50%}
}
@keyframes dir-video-glint{
  0%,10%{transform:translateX(-130%)}
  34%,100%{transform:translateX(130%)}
}

/* ---------- плеер: создаётся по клику; до него на странице только кнопка ---------- */
.vid-modal{position:fixed;inset:0;z-index:200;display:none}
.vid-modal.on{display:block}
.vid-backdrop{position:absolute;inset:0;background:rgba(12,20,16,.78)}
.vid-box{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(1080px,92vw);background:#0e1412;border-radius:18px;overflow:hidden;box-shadow:0 40px 100px -30px rgba(0,0,0,.7)}
.vid-box video{display:block;width:100%;height:auto;background:#000}
.vid-x{position:absolute;right:10px;top:10px;z-index:2;width:38px;height:38px;border-radius:50%;border:0;cursor:pointer;background:rgba(255,255,255,.9);color:#16321f;font-size:17px;line-height:1}
.vid-x:hover{background:#fff}
.vid-x:focus-visible{outline:2px solid var(--emerald);outline-offset:2px}

/* телефон: плашка одноколоночная, номер направления стоит сверху —
   поэтому его строке оставляем место под кнопку, чтобы они не наехали */
@media (max-width:760px){
  .dir-video{top:12px;right:14px;padding:6px 11px 6px 9px;font-size:11.5px}
  .dir-num{padding-right:134px}
}
@media (max-width:640px){
  .vid-box{width:94vw}
}
@media print{
  .dir-video,.vid-modal{display:none!important}
}

/* ============================================================
   Блок «Живой срез» (/dlya-kompanii.html, public/k-anon.js)
   ------------------------------------------------------------
   Место: плашка «Руководителю» вместо абзаца про анонимность. Смысл тот же,
   но его можно проверить руками: группа 1–8 анонимных силуэтов и карточка
   группового отчёта. Меньше порога (5 человек) — карточка запечатана, с порога
   печать рассыпается и отчёт проявляется.

   Состояние переключает скрипт: [data-count] — сколько человек, [data-state] —
   sealed|open. Всё рисование — CSS: ни одной инлайн-стилизации, чтобы политика
   (style-src 'unsafe-inline' разрешён, но в проекте принято классы) не нарушалась.
   Силуэты — один <symbol> в разметке и восемь <use> на него: восемь фигурок
   стоят одного узла в DOM.

   Печатается без блока: обещание анонимности в печатной версии дублирует текст
   FAQ, а интерактив на бумаге бессмыслен.
   ============================================================ */
.k-anon{display:block;margin-top:14px;background:var(--lime);border-radius:var(--r-sm);padding:14px 16px}
.k-anon .kan-head{display:flex;gap:12px;align-items:flex-start}
.kan{margin-top:14px}

/* ---------- управление: ползунок и счётчик ---------- */
.kan-ctl{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.kan-ctl-label{font-size:13px;font-weight:600;color:var(--pine)}
.kan-count{font-family:'JetBrains Mono',monospace;font-size:12.5px;font-weight:700;color:var(--pine);margin-left:auto}
.kan-range{-webkit-appearance:none;appearance:none;display:block;width:100%;height:24px;margin:4px 0 0;background:transparent;cursor:pointer;touch-action:pan-y}
/* заливка трека до бегунка: долю считает скрипт и кладёт в --kan-p (CSSOM, не инлайн-стиль) */
.kan-range::-webkit-slider-runnable-track{height:6px;border-radius:99px;background:linear-gradient(90deg,var(--pine) var(--kan-p,0%),rgba(14,74,56,.2) var(--kan-p,0%))}
.kan-range::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;margin-top:-7px;border:2px solid var(--lime);border-radius:50%;background:var(--pine)}
.kan-range::-moz-range-track{height:6px;border-radius:99px;background:linear-gradient(90deg,var(--pine) var(--kan-p,0%),rgba(14,74,56,.2) var(--kan-p,0%))}
.kan-range::-moz-range-thumb{width:20px;height:20px;border:2px solid var(--lime);border-radius:50%;background:var(--pine)}
.kan-range:focus-visible{outline:2px solid var(--emerald-deep);outline-offset:3px;border-radius:99px}

/* ---------- силуэты: «сколько человек в группе» ---------- */
.kan-people{display:flex;flex-wrap:wrap;gap:5px;margin-top:2px}
.kan-person{width:34px;height:38px;padding:3px;border:0;border-radius:9px;background:none;cursor:pointer;color:var(--ink3);opacity:.4;transition:opacity .3s var(--ease),color .3s var(--ease),transform .3s var(--ease)}
.kan-person svg{display:block;width:100%;height:100%;fill:currentColor}
.kan-person.is-on{color:var(--pine);opacity:1}
.kan-person:hover{color:var(--pine-2);opacity:.95;transform:translateY(-2px)}
.kan-person:focus-visible{outline:2px solid var(--emerald-deep);outline-offset:1px;opacity:1}
.kan-hint{font-size:12px;color:var(--ink3);min-height:17px;margin-top:1px;opacity:0;transition:opacity .18s var(--ease)}
.kan-people:hover + .kan-hint,
.kan-people:focus-within + .kan-hint,
.kan-people.is-hint + .kan-hint{opacity:1}

/* ---------- карточка группового отчёта ---------- */
.kan-stage{margin-top:10px}
.kan-card{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);padding:14px;overflow:hidden}
.kan-report{transition:filter .4s var(--ease),opacity .4s var(--ease),transform .4s var(--ease)}
[data-state="sealed"] .kan-report{filter:blur(3.4px) saturate(.55);opacity:.55;transform:scale(.99)}
[data-state="open"] .kan-report{filter:none;opacity:1;transform:none}
.kan-rep-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.kan-rep-head b{font-size:13px;color:var(--ink)}
.kan-chip{font-size:11px;font-weight:600;color:var(--pine);background:var(--pine-soft);border-radius:99px;padding:3px 9px}
.kan-rep-grid{display:grid;grid-template-columns:104px 1fr;gap:12px;align-items:center}
.kan-kpis{display:grid;gap:10px;justify-items:center}
.kan-kpi{text-align:center}
.kan-ring{display:block;width:78px;height:78px;margin:0 auto}
.kan-ring-bg{fill:none;stroke:var(--line);stroke-width:9}
.kan-ring-arc{fill:none;stroke:var(--emerald-deep);stroke-width:9;stroke-linecap:round}
.kan-ring-arc.warn{stroke:#cf8a1f}
.kan-ring-num{font-family:'Unbounded',sans-serif;font-size:21px;font-weight:700;fill:var(--pine)}
.kan-ring-num.warn{fill:#a86f14}
.kan-kpi-cap{display:block;margin-top:6px;font-size:11.5px;line-height:1.3;color:var(--ink2);text-align:center}
.kan-kpi-cap em{display:block;font-style:normal;font-size:10.5px;color:var(--ink3)}
.kan-map-cap{display:block;font-size:11.5px;font-weight:600;color:var(--ink2);margin-bottom:2px}
.kan-map{display:block;width:100%;max-width:192px;height:auto;margin:0 auto}
.kan-map-bg{fill:rgba(226,239,231,.55);stroke:var(--line-soft)}
.kan-map-axis{stroke:var(--line);stroke-width:1;stroke-dasharray:3 3}
.kan-map-lb{font-size:9px;font-weight:600;fill:var(--ink2)}
.kan-map-val{font-family:'JetBrains Mono',monospace;font-size:8.5px;font-weight:700;fill:var(--ink3)}
.kan-map-halo{fill:rgba(6,214,160,.25)}
.kan-map-dot{fill:var(--pine)}
.kan-rep-foot{margin-top:10px;font-size:11.5px;line-height:1.45;color:var(--ink3)}

/* ---------- печать-замок: «срез не строится» ---------- */
.kan-seal{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:3px;padding:16px 18px;text-align:center;
  background:linear-gradient(0deg,rgba(244,243,236,.92),rgba(244,243,236,.76));
  transition:opacity .4s var(--ease),transform .4s var(--ease)}
.kan-seal.is-out{opacity:0;transform:rotate(-8deg) scale(1.06);pointer-events:none}
.kan-seal-lock{width:26px;height:26px;fill:none;stroke:var(--pine);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.k-anon .kan-seal b{font-size:14px;font-weight:700;color:var(--pine);margin:0}
.k-anon .kan-seal p{font-size:12px;line-height:1.45;color:var(--ink2);max-width:290px;margin-top:3px}
.kan-seal-sub{font-family:'JetBrains Mono',monospace;font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink3)}

/* ---------- телефон: одна колонка, ряд силуэтов не переносится ---------- */
@media (max-width:520px){
  .kan-person{width:29px;height:33px;padding:2px}
  .kan-people{gap:4px}
  .kan-rep-grid{grid-template-columns:84px 1fr;gap:8px}
  .kan-ring{width:84px;height:84px}
  .kan-ring-num{font-size:19px}
}

/* ---------- движение: при «уменьшении движения» состояние меняется мгновенно ---------- */
@media (prefers-reduced-motion:reduce){
  .kan-report,.kan-person,.kan-seal,.kan-hint{transition:none!important}
  .kan-seal{animation:none!important}
}
@media (prefers-reduced-motion:no-preference){
  .kan-seal{animation:kan-seal-in .4s var(--ease)}
}
@keyframes kan-seal-in{
  from{opacity:0;transform:rotate(-6deg) scale(1.05)}
  to{opacity:1;transform:none}
}

/* интерактив в печать не идёт */
@media print{
  .k-anon{display:none!important}
}

/* ============================================================
   «Живой срез» в начале страницы: текст обещания виден всегда,
   механика (силуэты, ползунок, карточка отчёта) — по кнопке со стрелкой.
   ------------------------------------------------------------
   Зачем: обещание анонимности — это довод, он должен читаться сразу;
   интерактив — доказательство, его открывают осознанно. Свёрнутый блок
   занимает три строки и не оттесняет направления.
   Разметка — public/dlya-kompanii.html, поведение — public/k-anon.js.
   ============================================================ */
.kan-sec{margin:26px 0 0}
.kan-sec-in{background:var(--lime);border-radius:var(--r);padding:18px 20px 16px}
.kan-sec .k-anon{background:none;padding:0;margin:0}
.kan-sec .kan-head{max-width:780px}
.kan-sec .kan-head b{font-size:15px}
.kan-sec .kan-head p{margin-top:6px;font-size:13.5px;line-height:1.55;color:var(--ink2)}
.kan-toggle{margin-top:13px;display:inline-flex;align-items:center;gap:8px;font:inherit;font-size:13.5px;font-weight:600;
  color:var(--pine);background:rgba(255,255,255,.72);border:1px solid rgba(14,74,56,.18);border-radius:99px;padding:8px 15px;cursor:pointer;
  transition:background .18s var(--ease),border-color .18s var(--ease)}
.kan-toggle:hover{background:#fff;border-color:var(--pine)}
.kan-toggle:focus-visible{outline:2px solid var(--emerald-deep);outline-offset:2px}
.kan-arrow{flex:none;transition:transform .25s var(--ease)}
.kan-toggle.is-open .kan-arrow{transform:rotate(180deg)}
.kan-body{margin-top:16px}
.kan-body[hidden]{display:none}
/* на широком экране механика раскладывается в две колонки: управление слева, отчёт справа */
@media (min-width:780px){
  .kan-sec .kan{display:grid;grid-template-columns:minmax(220px,300px) minmax(0,1fr);grid-template-rows:auto auto auto auto;column-gap:26px;align-items:start;margin-top:0}
  .kan-sec .kan-ctl{grid-column:1;grid-row:1}
  .kan-sec .kan-range{grid-column:1;grid-row:2}
  .kan-sec .kan-people{grid-column:1;grid-row:3}
  .kan-sec .kan-hint{grid-column:1;grid-row:4}
  .kan-sec .kan-stage{grid-column:2;grid-row:1 / 5;margin-top:0}
  .kan-sec .kan-hint{max-width:300px}
  /* восемь силуэтов должны стоять в одну строку в колонке 300px */
  .kan-sec .kan-person{width:30px;height:34px;padding:2px}
  .kan-sec .kan-people{gap:4px}
}
@media (prefers-reduced-motion:reduce){
  .kan-arrow{transition:none!important}
}
@media print{
  .kan-sec{display:none!important}
}

/* где именно работает анонимный групповой отчёт: уточнение под абзацем обещания,
   чтобы не читалось как «так везде» (у TeamFit роли поимённо, у «Профиля должности» среза нет) */
.kan-where{margin-top:8px;font-size:12.5px;line-height:1.5;color:var(--ink2);max-width:780px}
.kan-where b{color:var(--pine)}