/* ============================================================
ФОРМА ЗАЯВКИ, ЛИПКАЯ КНОПКА ЗВОНКА
Подключается на всех страницах: , теперь . У браузера свои
стили для button (серый фон, свой шрифт, рамка), поэтому их
нужно сбросить, чтобы кнопки выглядели точно как до замены. */
button.btn,
button.btn-outline,
button.button,
button.cta-button,
button.js-open-lead-form {
font-family: inherit;
font-size: inherit;
line-height: inherit;
background-color: transparent;
border: none;
cursor: pointer;
-webkit-appearance: none;
appearance: none;
}
/* .btn и .button/.cta-button имеют собственный фон в style.css —
возвращаем его, т.к. сброс выше обнулил background-color */
button.btn {
background: linear-gradient(135deg, #ff8a00, #ff6a00);
color: #fff;
box-shadow: 0 0 25px rgba(255, 140, 0, .25);
}
button.button,
button.cta-button {
background: #ff8a00;
color: #fff;
}
/* .btn-outline изначально прозрачная с оранжевой рамкой */
button.btn-outline {
background: transparent;
border: 2px solid #ff8a00;
color: #fff;
}
button.btn-outline:hover {
background: #ff8a00;
}
/* ---------- Липкая кнопка звонка (только мобильные) ---------- */
.sticky-call {
display: none;
position: fixed; left: 0; right: 0; bottom: 0;
z-index: 9998;
background: #ff8a00;
color: #111;
text-align: center;
padding: 15px;
font-weight: 700;
font-size: 15px;
text-decoration: none;
font-family: 'Montserrat', Arial, sans-serif;
box-shadow: 0 -2px 14px rgba(0,0,0,.35);
}
@media (max-width: 760px) {
.sticky-call { display: block; }
/* чтобы кнопка не перекрывала подвал */
body { padding-bottom: 54px; }
}
/* ---------- Модальная форма заявки ---------- */
.lead-modal-overlay {
display: none;
position: fixed; inset: 0;
z-index: 10000;
background: rgba(0,0,0,.65);
align-items: center; justify-content: center;
padding: 20px;
}
.lead-modal-overlay.open { display: flex; }
.lead-modal {
background: #14161b;
color: #eee;
border-radius: 14px;
padding: 30px 28px;
width: 100%; max-width: 430px;
position: relative;
max-height: 90vh; overflow-y: auto;
font-family: 'Montserrat', Arial, sans-serif;
box-shadow: 0 20px 60px rgba(0,0,0,.5);
}
.lead-modal h3 { margin: 0 0 6px; font-size: 21px; color: #fff; }
.lead-modal-sub { color: #999; font-size: 13px; margin: 0 0 18px; line-height: 1.5; }
.lead-modal-sub a { color: #ff8a00; }
.lead-modal label {
display: block;
font-size: 13px;
color: #bbb;
margin: 14px 0 6px;
}
.lead-modal input[type=text],
.lead-modal input[type=tel],
.lead-modal input[type=email],
.lead-modal textarea {
width: 100%; box-sizing: border-box;
padding: 11px 13px;
border-radius: 8px;
border: 1px solid #333;
background: #0f1115;
color: #eee;
font-size: 14px;
font-family: inherit;
transition: border-color .2s;
}
.lead-modal input:focus,
.lead-modal textarea:focus {
outline: none;
border-color: #ff8a00;
}
.lead-modal textarea { resize: vertical; }
.lead-modal input[type=file] { color: #bbb; font-size: 13px; width: 100%; }
.lead-modal-submit {
width: 100%;
margin-top: 20px;
padding: 14px;
border: none; border-radius: 8px;
background: #ff8a00;
color: #111;
font-weight: 700; font-size: 15px;
font-family: inherit;
cursor: pointer;
transition: background .25s;
}
.lead-modal-submit:hover:not(:disabled) { background: #ff9d1f; }
.lead-modal-submit:disabled { opacity: .65; cursor: default; }
.lead-modal-note {
font-size: 11px; color: #666;
margin-top: 12px; text-align: center; line-height: 1.5;
}
.lead-modal-note a { color: #999; }
.lead-modal-error {
background: #3a1414;
color: #ff9d9d;
padding: 11px 13px;
border-radius: 8px;
font-size: 13px;
margin-top: 14px;
line-height: 1.5;
}
.lead-modal-error a { color: #ffc9c9; font-weight: 700; }
.lead-modal-close {
position: absolute; top: 14px; right: 16px;
background: none; border: none;
color: #888; font-size: 28px; line-height: 1;
cursor: pointer;
transition: color .2s;
}
.lead-modal-close:hover { color: #fff; }
/* ---------- Согласие на обработку персональных данных (152-ФЗ) ---------- */
.lead-consent {
display: flex;
align-items: flex-start;
gap: 10px;
margin-top: 18px;
font-size: 12px;
color: #999;
line-height: 1.55;
cursor: pointer;
}
.lead-consent input[type=checkbox] {
flex: 0 0 auto;
width: 17px;
height: 17px;
margin: 1px 0 0;
accent-color: #ff8a00;
cursor: pointer;
}
.lead-consent a {
color: #bbb;
text-decoration: underline;
}
.lead-consent a:hover { color: #ff8a00; }
/* ============================================================
ФОРМА «РАСЧЁТ СТОИМОСТИ»
Отдельная модалка (id="calcModalOverlay") для блока
«Не нашли свою задачу в списке?» на главной.
Переиспользует базовые классы .lead-modal / .lead-modal-overlay,
ниже — только то, чего в базовой форме не было:
выпадающий список, строка из двух полей, кнопка «прикрепить»,
экран «Заявка отправлена» с мессенджерами.
============================================================ */
/* ---------- Выпадающий список «Что нужно изготовить» ---------- */
.lead-modal select {
width: 100%;
box-sizing: border-box;
padding: 11px 36px 11px 13px;
border-radius: 8px;
border: 1px solid #333;
background: #0f1115;
color: #eee;
font-size: 14px;
font-family: inherit;
cursor: pointer;
-webkit-appearance: none;
appearance: none;
/* стрелочка нарисована фоном, чтобы не тянуть картинку с сервера */
background-image: linear-gradient(45deg, transparent 50%, #888 50%),
linear-gradient(135deg, #888 50%, transparent 50%);
background-position: calc(100% - 19px) calc(50% + 1px),
calc(100% - 14px) calc(50% + 1px);
background-size: 5px 5px, 5px 5px;
background-repeat: no-repeat;
transition: border-color .2s;
}
.lead-modal select:focus { outline: none; border-color: #ff8a00; }
/* пока выбран пункт-заглушка «Выберите направление» — текст серый */
.lead-modal select.is-placeholder { color: #6d6d6d; }
.lead-modal select option { background: #14161b; color: #eee; }
/* ---------- Строка из двух полей: материал + количество ---------- */
.calc-row {
display: flex;
gap: 12px;
}
.calc-row > div { flex: 1 1 0; min-width: 0; }
.calc-row > div.calc-col-qty { flex: 0 0 120px; }
@media (max-width: 400px) {
.calc-row { display: block; }
.calc-row > div.calc-col-qty { flex: none; }
}
/* ---------- Кнопка «Прикрепить чертёж или фото» ----------
Настоящий