/*
 * «Попробовать» в шапке — выбор из двух путей: демо или свой кабинет.
 *
 * Один файл на все страницы витрины: главная (landing6) и страницы на
 * public.css (цена, документы, 404) — у них разные шапки и разные
 * переменные, поэтому цвета здесь заданы прямо, а не токенами.
 *
 * Меню растёт из кнопки (transform-origin — её правый верх): видно,
 * откуда оно взялось. Появление 180 мс с небольшим масштабом, уход быстрее.
 * Без скрипта кнопка остаётся ссылкой на регистрацию.
 */
.try {
  position: relative;
}
.try .try-menu {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 60;
  display: grid;
  gap: 4px;
  width: 292px;
  padding: 6px;
  border-radius: 18px;
  background: #fff;
  text-align: left;
  box-shadow:
    0 0 0 1px rgba(15, 17, 21, 0.06),
    0 18px 40px -12px rgba(15, 23, 42, 0.28),
    0 4px 10px -4px rgba(15, 23, 42, 0.12);
  transform-origin: top right;
  opacity: 0;
  transform: translateY(-4px) scale(0.97);
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity 0.12s cubic-bezier(0.23, 1, 0.32, 1),
    transform 0.14s cubic-bezier(0.23, 1, 0.32, 1),
    visibility 0s linear 0.14s;
}
.try.open .try-menu {
  opacity: 1;
  transform: none;
  visibility: visible;
  pointer-events: auto;
  transition:
    opacity 0.18s cubic-bezier(0.23, 1, 0.32, 1),
    transform 0.18s cubic-bezier(0.23, 1, 0.32, 1),
    visibility 0s;
}
/* .try впереди — сильнее, чем «.pub-nav-links a» у страниц на public.css */
.try .try-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 12px;
  color: #0f1115;
  text-decoration: none;
  transition: background-color 0.15s ease;
}
.try .try-item:hover,
.try .try-item:focus-visible {
  background: #f3f3f0;
  color: #0f1115;
  text-decoration: none;
}
.try .try-item:focus-visible {
  outline: 2px solid #3a56d4;
  outline-offset: -2px;
}
.try .try-item i {
  display: grid;
  place-items: center;
  flex: none;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: #eef1fc;
  color: #3a56d4;
}
.try .try-item:last-child i {
  background: #0f1115;
  color: #fff;
}
.try .try-item svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.try .try-item span {
  display: grid;
  gap: 1px;
  min-width: 0;
}
.try .try-item b {
  font-size: 14.5px;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.try .try-item small {
  font-size: 12.5px;
  font-weight: 400;
  color: #868c97;
}
/* кнопка, пока меню открыто, — нажатая */
.try.open .try-btn {
  background: #3a56d4;
}
@media (max-width: 420px) {
  .try .try-menu {
    right: -8px;
    width: min(292px, calc(100vw - 24px));
  }
}
@media (prefers-reduced-motion: reduce) {
  .try .try-menu,
  .try.open .try-menu {
    transform: none;
  }
}

/*
 * Страницы на public.css: на телефоне ссылки шапки живут в меню под
 * «☰», и раскрывать внутри него второе меню — матрёшка. Там кнопки
 * «Попробовать» нет, а оба пути стоят сразу — двумя строками.
 */
@media (max-width: 860px) {
  .pub-nav-links .try-btn {
    display: none;
  }
  .pub-nav-links .try .try-menu {
    position: static;
    width: auto;
    margin-top: 6px;
    padding: 6px 0 0;
    border-top: 1px solid #edf0f6;
    border-radius: 0;
    box-shadow: none;
    opacity: 1;
    transform: none;
    visibility: visible;
    pointer-events: auto;
    transition: none;
  }
}