/* 171 «Инструменты» (финал, решение 01.10) — Inter Tight для заголовков и цифр, IBM Plex Sans для текста.
   Акцент — наклонная брендовая плашка в первом экране и наклонный маркер в заголовках светлых блоков.
   Шкала: первый экран 42–66 px, заголовки разделов 32–46 px, заголовки карточек 20–28 px, текст 16–17 px. */
.bhq--q171{--fd:'Inter Tight','Inter Tight Fallback',sans-serif;--fnum:'Inter Tight','Inter Tight Fallback',sans-serif;--ft:'Inter Tight','Inter Tight Fallback',sans-serif;--fb:'IBM Plex Sans','IBM Plex Sans Text Fallback',sans-serif;--fk:'IBM Plex Sans',sans-serif;
  --hw:800;--hw2:700;--hls:-.014em;--htls:-.018em;--ht:clamp(42px,4.4vw,66px);--htlh:1.03;--hs:clamp(32px,3.1vw,46px);--hlh:1.06;
  --d-bg:#0c0f15;--l-bg:#f1f4f8;--r:0;--rs:0;--rf:0;--rc:0;--rseg:999px;--cut:3.2vw}
.bhq--q171 .q-hero{background:radial-gradient(50% 45% at 72% 12%,rgba(149,206,90,.1),transparent 70%),var(--d-bg)}
.bhq--q171 .q-hero__t,.bhq--q171 .q-h{word-spacing:.04em}
.bhq--q171 .q16-hf .q-hero__t{font-size:var(--ht)}
.bhq--q171 .is-dark .q-h em{color:var(--g)}
.bhq--q171 .q-k{font-weight:700;letter-spacing:.12em}
/* заголовки карточек — тем же гротеском, на ступень ниже заголовка раздела */
.bhq--q171 .qd-card__t{font-size:clamp(22px,1.8vw,26px);letter-spacing:-.015em}
.bhq--q171 .q16-ac__t{font-size:clamp(26px,2.2vw,32px);letter-spacing:-.015em}
.bhq--q171 .q16-am__h b,.bhq--q171 .q16-al__b > b{font-size:clamp(22px,1.9vw,28px);letter-spacing:-.015em}
.bhq--q171 .q11-yt__t{font-size:clamp(20px,1.6vw,24px);letter-spacing:-.01em}
.bhq--q171 .qm-facts dd,.bhq--q171 .q16-cst dd{letter-spacing:-.02em}
/* наклонные стыки, кнопки и вкладки со срезанным углом */
.bhq--q171 .q-btn{border-radius:0;clip-path:polygon(0 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%)}
.bhq--q171 .q-btn--ghost{clip-path:none;border-radius:0}
.bhq--q171 .q16-ac__tabs button,.bhq--q171 .q16-bd__tabs button,.bhq--q171 .q16-al__goals button{border-radius:0;clip-path:polygon(0 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%)}
@media (max-width:760px){
  .bhq--q171{--ht:clamp(34px,9.4vw,44px);--hs:clamp(28px,7.6vw,34px)}
  .bhq--q171 .qd-card__t{font-size:22px}
}
/* ch заголовков в em (Inter Tight 800) */
.bhq--q171{--chx:0.6812em}
/* телефон: ясная иерархия — первый экран ~40 px, разделы ~30 px (базовое правило .bhq .q-h перебивало переменную) */
@media (max-width:760px){
  .bhq--q171{--ht:clamp(36px,10.4vw,46px);--hs:clamp(27px,7.6vw,32px)}
  .bhq--q171 .q16-hf .q-hero__t{font-size:var(--ht)}
  .bhq--q171 .q-h{font-size:var(--hs)}
}
/* ═════ одна система выделения: наклонная брендовая плашка во всех заголовках, как в первом экране (решение 01.10) ═════
   Маркер на тёмном фоне выходил грязно-оливковым, а три приёма вперемешку разрушали систему.
   Иерархию держит размер: в первом экране плашка 63 px, в разделах 45 px. */
.bhq16.bhq--q171 .q-s .q-h{max-width:calc(20*var(--chx,1ch))}
.bhq16.bhq--q171 .q-s .q-h em{color:#0c0f15 !important;font-style:normal;padding:0 .22em;margin-inline:-.07em 0;
  background:var(--plq) 0 .1em/100% calc(100% - .08em) no-repeat;-webkit-box-decoration-break:clone;box-decoration-break:clone}
/* сравнение на копии: B — зелёное слово на тёмных блоках (первый экран тоже), плашка на светлых; C — зелёное слово везде */
.bhq16.bhq--q171.pk-accent-B .q-s.is-dark .q-h em,.bhq16.bhq--q171.pk-accent-B .q-hero .q-hero__t em,
.bhq16.bhq--q171.pk-accent-C .q-s .q-h em,.bhq16.bhq--q171.pk-accent-C .q-hero .q-hero__t em{background:none !important;color:var(--g) !important;padding:0;margin:0}
/* ═════ ритм отступов (01.10): между содержимым блоков ~190 px на ПК, ~105 px на телефоне ═════
   Отступ секции = --pad + высота наклона (--cut); соседние секции перекрываются на --cut, поэтому между содержимым 2×pad + cut. */
.bhq--q171{--pad:clamp(48px,4.4vw,64px)}
.bhq--q171 .q-hero.j-cut-b{padding-bottom:calc(var(--pad) + var(--cut))}
.bhq--q171 .q-head{margin-bottom:clamp(32px,3.2vw,52px)}
@media (max-width:760px){
  .bhq--q171{--pad:44px}
  .bhq--q171 .q-head{margin-bottom:28px}
}
/* 01.10 вечер: ритм «премиум-середина» — плотные отступы смотрелись дешевле (замечание владельца). ПК: ~220–250 px между блоками, заголовок → содержимое до 60 px; телефон без изменений */
.bhq--q171{--pad:clamp(56px,6vw,96px)}
.bhq--q171 .q-head{margin-bottom:clamp(36px,3.8vw,60px)}
@media (max-width:760px){
  .bhq--q171{--pad:44px}
  .bhq--q171 .q-head{margin-bottom:28px}
}