/* График работ в hero лендинга. Задача 395.

   ВИД БЕРЁТСЯ ИЗ ПРОДУКТА, А НЕ РИСУЕТСЯ ЗАНОВО. Решение владельца
   23.08.2026: «берите из нашей системы». Заготовка автора была образцом
   ЛОГИКИ — каскад, пересчёт, удорожание, — а не образцом вида.

   Поэтому здесь почти ничего нет. Классы `.gantt`, `.gantt-labels`,
   `.gantt-bar`, `.gantt-fill`, `.gantt-bar-baseline`, `.gantt-today`,
   `.gantt-legend` — те же самые, что рисуют график объекта в кабинете, и
   лежат они в `app.css` и в слое автора, которые публичный слой уже
   подключает.

   КОПИИ БЫТЬ НЕ ДОЛЖНО НИ ОДНОЙ. Копия разойдётся с оригиналом при
   первой правке продукта, и разойдётся молча: витрина будет показывать
   график, которого в системе уже нет. Ниже — только то, чего в кабинете
   нет по устройству: место блока на странице и его подпись. */

/* Виджет кабинета рассчитан на экран с полосой разделов, вкладками и
   легендой над ним — отсюда `max-height: calc(100vh - 480px)`. На
   лендинге над графиком ничего этого нет, и высота считается по
   содержимому. */
.gantt--vitrina{
  max-height:none;
  min-height:0;
}

.gantt--vitrina .gantt-scroll{overflow:hidden}

.gnt{
  font-family:'Montserrat',-apple-system,'Segoe UI',sans-serif;
}

.gnt *{box-sizing:border-box}

.gnt__foot{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:8px 22px;
  margin-top:14px;
}

.gnt__caption{
  font-size:10.5px;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:#6F6B7D;
}

.gnt__val{
  font-size:21px;
  font-weight:500;
  font-variant-numeric:tabular-nums;
  color:#131747;
}
.gnt__val.is-late{color:#EA5455}

.gnt__tools{display:flex;gap:6px;margin-left:auto;flex-wrap:wrap}

.gnt__note{margin-top:10px;font-size:13px;line-height:1.6;color:#55515F}

/* Ставка правится прямо в подписи. Поле — не «настройка в другом месте»:
   человек читает предложение и меняет число, не выходя из него. */
.gnt__rate{
  font-family:inherit;
  font-size:13px;
  font-weight:500;
  font-variant-numeric:tabular-nums;
  width:6.5em;
  padding:2px 4px;
  border:0;
  border-bottom:1px solid #C4C2CC;
  border-radius:var(--radius-none);
  background:transparent;
  color:#131747;
  text-align:right;
}
.gnt__rate:focus{outline:0;border-bottom-color:#131747}

.gnt__sr{
  position:absolute;
  width:1px;height:1px;
  margin:-1px;padding:0;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap;
  border:0;
}

/* Полоса — настоящая кнопка, а не блок с обработчиком. Кнопка приходит с
   фокусом, с клавиатурой и с ролью для читалки; то же самое на `div`
   выстраивается руками в четырёх местах и всё равно забывается одно.
   Вид при этом остаётся продуктовым: сбрасываем только то, что браузер
   добавляет кнопке от себя. */
.gantt-bar{
  margin:0;
  padding:0;
  font:inherit;
  text-align:left;
  color:inherit;
}
.gantt-bar:focus-visible{outline:2px solid #131747;outline-offset:1px}
.gantt-bar.is-picked{box-shadow:0 0 0 2px #131747}

/* Телефон: имена работ уже, перетаскивание отдаётся странице.

   Палец не умеет одновременно тянуть полосу и прокручивать экран.
   Попытка поделить это жестами кончается тем, что страница не
   скроллится там, где стоит блок, — и человек уходит, решив, что сайт
   сломался. Вместо перетаскивания — выбор работы касанием и кнопки
   «неделя вперёд, неделя назад». */
/* Порог 768 — тот же, на котором продукт прячет полотно (app.css). На
   767 подпись под графиком оставалась настольной ровно в том окне, где
   графика уже не было (#406). */
@media (max-width:768px){
  .gantt--vitrina .gantt-labels{flex:0 0 116px}
  .gantt--vitrina .gantt-label{font-size:11px;padding:0 8px}
  .gantt--vitrina .gantt-bar{touch-action:auto}
  .gnt__val{font-size:18px}
  .gnt__tools{width:100%;margin-left:0}
}
