/*
 * Стили макета EKVIUM. Сгенерировано tools/convert-design.mjs — правки вносить в макет
 * или в этот генератор, иначе они потеряются при следующем прогоне.
 */

html { background: #08090b; scroll-behavior: smooth; }
  body { margin: 0; background: #08090b; color: #eceae6; font-family: 'Onest', Helvetica, Arial, sans-serif; font-weight: 300; -webkit-font-smoothing: antialiased; overflow-x: clip; }
  * { box-sizing: border-box; }
  h1, h2, h3 { font-family: 'Unbounded', Helvetica, Arial, sans-serif; font-weight: 600; letter-spacing: -0.05em; line-height: 1.03; margin: 0; }
  [data-display] { font-family: 'Unbounded', Helvetica, Arial, sans-serif; font-weight: 500; letter-spacing: -0.04em; }
  a { color: #e8a765; text-decoration: none; }
  a:hover { color: #f6c795; }
  ::selection { background: #e8a765; color: #08090b; }
  ::-webkit-scrollbar { width: 9px; }
  ::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.16); border-radius: 9px; }
  ::-webkit-scrollbar-track { background: #08090b; }
  @keyframes ek-hint { 0% { transform: translateY(-4px); opacity: 0; } 40% { opacity: 1; } 100% { transform: translateY(12px); opacity: 0; } }
  @keyframes ek-pulse { 0%,100% { opacity: .3; } 50% { opacity: 1; } }
  #calc [data-out] { white-space: nowrap; }
  #calc [data-two] > div, #calc [data-two] > div > div { min-width: 0; }
  #calc [data-cg], #calc [data-cp], #calc [data-ci] { flex: 0 1 auto; }
  @media (max-width: 1040px) {
    [data-two] { grid-template-columns: 1fr !important; }
    [data-nav], [data-chips] { display: none !important; }
    [data-cardinner] { grid-template-rows: minmax(170px, 32%) minmax(0, 1fr) !important; }
    [data-cardinner] > div:last-child { padding: 20px 22px 18px !important; gap: 12px !important; }
    [data-cardinner] > div:last-child > div:nth-last-child(2) { display: none !important; }
    [data-cardinner] button { margin-top: auto; position: sticky; bottom: 0; }
    [data-noms] { display: none !important; }
    [data-step] { grid-template-columns: 90px 1fr !important; }
    [data-step] > div:nth-child(3), [data-step] > div:nth-child(4) { display: none; }
  }

/* ── Наведение: перенесено из атрибутов style-hover макета ── */
.hv-1:hover { background:#f6c795; }
.hv-2:hover { background:#e8a765; border-color:#e8a765; color:#08090b; }
.hv-3:hover { background:#e8a765; border-color:#e8a765; color:#08090b; }
.hv-4:hover { background:#e8a765; border-color:#e8a765; color:#08090b; }
.hv-5:hover { background:#e8a765; border-color:#e8a765; color:#08090b; }
.hv-6:hover { border-color:#e8a765; color:#e8a765; }
.hv-7:hover { background:#f6c795; }
.hv-8:hover { border-color:#e8a765; color:#e8a765; }
.hv-9:hover { background:#f6c795; }
.hv-10:hover { border-color:#e8a765; color:#e8a765; }
.hv-11:hover { background:#101216; transform:translateX(10px); }
.hv-12:hover { background:#101216; transform:translateX(10px); }
.hv-13:hover { background:#101216; transform:translateX(10px); }
.hv-14:hover { background:#101216; transform:translateX(10px); }
.hv-15:hover { background:#101216; transform:translateX(10px); }
.hv-16:hover { background:#101216; transform:translateX(10px); }
.hv-17:hover { border-color:#e8a765; color:#e8a765; }

/*
 * Поля ввода на телефоне — не мельче 16px.
 *
 * Safari на iPhone ЗУМИТ страницу при касании поля, у которого шрифт меньше 16px.
 * Человек жмёт «опишите спецификацию», экран прыгает и уезжает, форма пропадает из
 * виду — а это единственный путь заявки на сайте. В макете таких полей семь: он
 * рисовался на десктопе, где поведения нет вовсе. Правило только для узких экранов,
 * чтобы не менять типографику на компьютере.
 */
@media (max-width: 1040px) {
  input, textarea, select { font-size: 16px !important; }
}