/* Главная: переходы между секциями и шоурил.

   Переход = одна плавная кривая (smootherstep) в OKLab, разрезанная пополам:
   первая половина красит нижний отступ верхней секции, вторая — верхний отступ
   нижней. Обе половины длиной --edge (это и есть отступ секции), поэтому цвет
   и его скорость сходятся на шве: нет ступеньки, нахлёста и лишней высоты.
   Чёрный ↔ белый идёт через приглушённый фиолетовый: серые полутона читаются
   как грязь, фирменный оттенок — как свет. Никаких SVG-размытий, волн и зерна.
   Стопы между маркерами считает scripts/gen-landing-edges.mjs: цвета и пары
   секций меняются там, руками блок не правим. */
main {
  --edge: var(--sec);
}
/* Фиолетовая полоса с глазами — короче: переход на 70% отступа, иначе блок
   разрастается. Значение одно на обе стороны шва, поэтому задано всем троим. */
main > #tools, main > #small-business, main > #small-business + .biz3 { --edge: calc(var(--sec) * .7); }
/* Глазам нужен отступ не меньше половины перехода, иначе градиент заедет под них. */
main > #small-business .kult-in { padding-block: var(--edge); }

/* @generated gen-landing-edges:start */
main > #tools {
  background: #ffffff linear-gradient(to bottom,
    #ffffff 0,
    #ffffff calc(100% - var(--edge) * 1.000),
    #ffffff calc(100% - var(--edge) * 0.875),
    #fcfcff calc(100% - var(--edge) * 0.750),
    #f7f6ff calc(100% - var(--edge) * 0.625),
    #efedff calc(100% - var(--edge) * 0.500),
    #e3dfff calc(100% - var(--edge) * 0.375),
    #d5ceff calc(100% - var(--edge) * 0.250),
    #c5baff calc(100% - var(--edge) * 0.125),
    #b5a4ff calc(100% - var(--edge) * 0.000));
}
main > #small-business {
  background: #7a2cff linear-gradient(to bottom,
    #b5a4ff calc(var(--edge) * 0.000),
    #a58eff calc(var(--edge) * 0.125),
    #9877ff calc(var(--edge) * 0.250),
    #8d62ff calc(var(--edge) * 0.375),
    #844fff calc(var(--edge) * 0.500),
    #7f3eff calc(var(--edge) * 0.625),
    #7c33ff calc(var(--edge) * 0.750),
    #7a2dff calc(var(--edge) * 0.875),
    #7a2cff calc(var(--edge) * 1.000),
    #7a2cff calc(100% - var(--edge) * 1.000),
    #7a2dff calc(100% - var(--edge) * 0.875),
    #7c33ff calc(100% - var(--edge) * 0.750),
    #7f3eff calc(100% - var(--edge) * 0.625),
    #844fff calc(100% - var(--edge) * 0.500),
    #8d62ff calc(100% - var(--edge) * 0.375),
    #9877ff calc(100% - var(--edge) * 0.250),
    #a58eff calc(100% - var(--edge) * 0.125),
    #b5a4ff calc(100% - var(--edge) * 0.000));
}
main > #small-business + .biz3 {
  background: #ffffff linear-gradient(to bottom,
    #b5a4ff calc(var(--edge) * 0.000),
    #c5baff calc(var(--edge) * 0.125),
    #d5ceff calc(var(--edge) * 0.250),
    #e3dfff calc(var(--edge) * 0.375),
    #efedff calc(var(--edge) * 0.500),
    #f7f6ff calc(var(--edge) * 0.625),
    #fcfcff calc(var(--edge) * 0.750),
    #ffffff calc(var(--edge) * 0.875),
    #ffffff calc(var(--edge) * 1.000),
    #ffffff 100%);
}
main > #onprem {
  background: #0c0b10 linear-gradient(to bottom,
    #0c0b10 0,
    #0c0b10 calc(100% - var(--edge) * 1.000),
    #0c0b11 calc(100% - var(--edge) * 0.875),
    #0f0d14 calc(100% - var(--edge) * 0.750),
    #14121c calc(100% - var(--edge) * 0.625),
    #1e1a2a calc(100% - var(--edge) * 0.500),
    #2d263e calc(100% - var(--edge) * 0.375),
    #413858 calc(100% - var(--edge) * 0.250),
    #594e74 calc(100% - var(--edge) * 0.125),
    #746993 calc(100% - var(--edge) * 0.000));
}
main > #onprem + .rights2 {
  background: #ffffff linear-gradient(to bottom,
    #746993 calc(var(--edge) * 0.000),
    #9287af calc(var(--edge) * 0.125),
    #afa6c9 calc(var(--edge) * 0.250),
    #c9c3dd calc(var(--edge) * 0.375),
    #e0dcec calc(var(--edge) * 0.500),
    #f0eef7 calc(var(--edge) * 0.625),
    #faf9fc calc(var(--edge) * 0.750),
    #fefeff calc(var(--edge) * 0.875),
    #ffffff calc(var(--edge) * 1.000),
    #ffffff calc(100% - var(--edge) * 1.000),
    #ffffff calc(100% - var(--edge) * 0.875),
    #ffffff calc(100% - var(--edge) * 0.750),
    #fefeff calc(100% - var(--edge) * 0.625),
    #fefeff calc(100% - var(--edge) * 0.500),
    #fdfcff calc(100% - var(--edge) * 0.375),
    #fcfbff calc(100% - var(--edge) * 0.250),
    #fbfaff calc(100% - var(--edge) * 0.125),
    #f9f8ff calc(100% - var(--edge) * 0.000));
}
main > .gallery {
  background: #f4f1ff linear-gradient(to bottom,
    #f9f8ff calc(var(--edge) * 0.000),
    #f8f6ff calc(var(--edge) * 0.125),
    #f7f5ff calc(var(--edge) * 0.250),
    #f6f4ff calc(var(--edge) * 0.375),
    #f5f2ff calc(var(--edge) * 0.500),
    #f5f2ff calc(var(--edge) * 0.625),
    #f4f1ff calc(var(--edge) * 0.750),
    #f4f1ff calc(var(--edge) * 0.875),
    #f4f1ff calc(var(--edge) * 1.000),
    #f4f1ff calc(100% - var(--edge) * 1.000),
    #f4f1ff calc(100% - var(--edge) * 0.875),
    #f4f1ff calc(100% - var(--edge) * 0.750),
    #f5f2ff calc(100% - var(--edge) * 0.625),
    #f5f2ff calc(100% - var(--edge) * 0.500),
    #f6f4ff calc(100% - var(--edge) * 0.375),
    #f7f5ff calc(100% - var(--edge) * 0.250),
    #f8f6ff calc(100% - var(--edge) * 0.125),
    #f9f8ff calc(100% - var(--edge) * 0.000));
}
main > .clients {
  background: #ffffff linear-gradient(to bottom,
    #f9f8ff calc(var(--edge) * 0.000),
    #fbfaff calc(var(--edge) * 0.125),
    #fcfbff calc(var(--edge) * 0.250),
    #fdfcff calc(var(--edge) * 0.375),
    #fefeff calc(var(--edge) * 0.500),
    #fefeff calc(var(--edge) * 0.625),
    #ffffff calc(var(--edge) * 0.750),
    #ffffff calc(var(--edge) * 0.875),
    #ffffff calc(var(--edge) * 1.000),
    #ffffff calc(100% - var(--edge) * 1.000),
    #fefeff calc(100% - var(--edge) * 0.875),
    #faf9fc calc(100% - var(--edge) * 0.750),
    #f0eef7 calc(100% - var(--edge) * 0.625),
    #e0dcec calc(100% - var(--edge) * 0.500),
    #c9c3dd calc(100% - var(--edge) * 0.375),
    #afa6c9 calc(100% - var(--edge) * 0.250),
    #9287af calc(100% - var(--edge) * 0.125),
    #746993 calc(100% - var(--edge) * 0.000));
}
main > #showreel {
  background: #0c0b10 linear-gradient(to bottom,
    #746993 calc(var(--edge) * 0.000),
    #594e74 calc(var(--edge) * 0.125),
    #413858 calc(var(--edge) * 0.250),
    #2d263e calc(var(--edge) * 0.375),
    #1e1a2a calc(var(--edge) * 0.500),
    #14121c calc(var(--edge) * 0.625),
    #0f0d14 calc(var(--edge) * 0.750),
    #0c0b11 calc(var(--edge) * 0.875),
    #0c0b10 calc(var(--edge) * 1.000),
    #0c0b10 calc(100% - var(--edge) * 1.000),
    #0c0b11 calc(100% - var(--edge) * 0.875),
    #0f0d14 calc(100% - var(--edge) * 0.750),
    #14121c calc(100% - var(--edge) * 0.625),
    #1e1a2a calc(100% - var(--edge) * 0.500),
    #2d263e calc(100% - var(--edge) * 0.375),
    #413858 calc(100% - var(--edge) * 0.250),
    #594e74 calc(100% - var(--edge) * 0.125),
    #746993 calc(100% - var(--edge) * 0.000));
}
main > #journal {
  background: #ffffff linear-gradient(to bottom,
    #746993 calc(var(--edge) * 0.000),
    #9287af calc(var(--edge) * 0.125),
    #afa6c9 calc(var(--edge) * 0.250),
    #c9c3dd calc(var(--edge) * 0.375),
    #e0dcec calc(var(--edge) * 0.500),
    #f0eef7 calc(var(--edge) * 0.625),
    #faf9fc calc(var(--edge) * 0.750),
    #fefeff calc(var(--edge) * 0.875),
    #ffffff calc(var(--edge) * 1.000),
    #ffffff calc(100% - var(--edge) * 1.000),
    #ffffff calc(100% - var(--edge) * 0.875),
    #fcfcff calc(100% - var(--edge) * 0.750),
    #f7f6ff calc(100% - var(--edge) * 0.625),
    #efedff calc(100% - var(--edge) * 0.500),
    #e3dfff calc(100% - var(--edge) * 0.375),
    #d5ceff calc(100% - var(--edge) * 0.250),
    #c5baff calc(100% - var(--edge) * 0.125),
    #b5a4ff calc(100% - var(--edge) * 0.000));
}
main > #career {
  background: #7a2cff linear-gradient(to bottom,
    #b5a4ff calc(var(--edge) * 0.000),
    #a58eff calc(var(--edge) * 0.125),
    #9877ff calc(var(--edge) * 0.250),
    #8d62ff calc(var(--edge) * 0.375),
    #844fff calc(var(--edge) * 0.500),
    #7f3eff calc(var(--edge) * 0.625),
    #7c33ff calc(var(--edge) * 0.750),
    #7a2dff calc(var(--edge) * 0.875),
    #7a2cff calc(var(--edge) * 1.000),
    #7a2cff 100%);
}
/* @generated gen-landing-edges:end */

/* Шоурил: беззвучный цикл 16:9; «Со звуком» открывает полный ролик. */
#showreel .showreel { aspect-ratio: 16 / 9; background: #fff; }
#showreel .showreel > video { display: block; width: 100%; height: 100%; object-fit: contain; }
#showreel .play-xl { left: auto; top: auto; right: 20px; bottom: 20px; transform: none; width: auto; height: 48px; padding: 0 20px; border-radius: 999px; font: 600 15px/1 var(--sans); box-shadow: 0 2px 12px #0002; }
#showreel .play-xl:hover { transform: translateY(-2px); }
@media (max-width: 640px) { #showreel .play-xl { right: 12px; bottom: 12px; height: 44px; padding: 0 14px; font-size: 13px; } }

/* UX-8: чипы готовых задач под полем первого экрана */
.chat-chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:12px auto 0;max-width:720px}
.chat-chips .btn{white-space:nowrap}