.calculator-container {
    max-width: 800px; /* Ограничиваем максимальную ширину */
    width: 90%; /* Задаём ширину 90% от родителя */
    margin: 20px auto; /* Центрируем калькулятор и добавляем отступ сверху и снизу */
    padding: 30px; /* Отступы внутри контейнера */
    background-color: #fff; /* Цвет фона */
    border-radius: 10px; /* Закругленные углы */
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); /* Эффект тени для 3D */
    box-sizing: border-box; /* Корректный расчет ширины и отступов */
    overflow: hidden; /* Скрыть содержимое, выходящее за пределы */
}
.form-group input[type="checkbox"] {
    margin-right: 10px; /* Устанавливаем отступ справа для чекбоксов */
    vertical-align: middle; /* Вертикальное выравнивание чекбоксов по центру */
}

.additional-label {
    margin-bottom: 5px; /* Уменьшаем отступ снизу для метки "Дополнительно" */
    font-weight: 500; /* Полужирный шрифт для меток */
}

.checkbox-group {
    display: flex; /* Используем флексбокс для выравнивания чекбоксов */
    flex-direction: column; /* Вертикальное направление для чекбоксов */
}
.calculator-title {
    text-align: center; /* Выравнивание заголовка по центру */
    color: #c0392b; /* Цвет заголовка */
    margin-bottom: 20px; /* Отступ снизу */
    font-size: 24px; /* Размер шрифта заголовка */
    font-weight: bold; /* Жирный шрифт */
}

.form-group {
    margin-bottom: 15px; /* Уменьшаем отступы между полями */
    display: flex; /* Для горизонтального выравнивания */
    flex-direction: column; /* Вертикальная ориентация */
}

.calculator-label {
    margin-bottom: 5px; /* Уменьшаем отступ снизу меток */
    font-weight: 500; /* Полужирный шрифт для меток */
}

.calculator-input,
.calculator-select {
    padding: 12px; /* Увеличиваем отступы внутри полей */
    border: 1px solid #ccc; /* Цвет границы */
    border-radius: 5px; /* Закругленные углы */
    transition: border-color 0.3s; /* Плавный переход цвета границы */
    width: 100%; /* Ширина 100% для полей */
}

.calculator-input:focus,
.calculator-select:focus {
    border-color: #c0392b; /* Цвет границы при фокусе */
    outline: none; /* Убираем стандартный контур */
}

.button-calculate {
    margin-top: 15px; /* Уменьшаем отступ сверху для кнопки */
    padding: 12px 20px; /* Увеличиваем отступы внутри кнопки */
    background-color: #c0392b; /* Цвет фона кнопки */
    color: #fff; /* Цвет текста */
    border: none; /* Без границы */
    border-radius: 5px; /* Закругленные углы */
    cursor: pointer; /* Указатель курсора */
    transition: background-color 0.3s; /* Плавный переход цвета */
    font-size: 16px; /* Размер шрифта кнопки */
    width: 100%; /* Ширина кнопки */
}

.button-calculate:hover {
    background-color: #a93226; /* Цвет при наведении */
}

.result-title {
    text-align: center; /* Выравнивание итоговой стоимости по центру */
    margin-top: 20px; /* Уменьшаем отступ сверху */
    font-size: 20px; /* Размер шрифта для итоговой стоимости */
    font-weight: bold; /* Жирный шрифт для итоговой стоимости */
}



/* Адаптивные стили для мобильных устройств */
@media (max-width: 768px) {
    .calculator-container {
        padding: 15px; /* Уменьшаем внутренние отступы */
    }

    .form-group {
        margin-bottom: 10px; /* Уменьшаем отступы между полями на мобильных */
    }

    .button-calculate {
        margin-top: 10px; /* Уменьшаем отступ для кнопки на мобильных */
    }
}


/* Стили для чекбоксов */
.additional-options {
    margin-top: 15px; /* Отступ сверху для дополнительного выбора */
    margin-bottom: 20px; /* Отступ снизу для дополнительного выбора */
}

.additional-options input[type="checkbox"] {
    margin-right: 10px; /* Отступ справа для чекбоксов */
}

.additional-options label {
    font-size: 16px; /* Размер шрифта для меток чекбоксов */
    color: #333; /* Цвет текста для меток чекбоксов */
}

/* Медиа-запросы для мобильных устройств */
@media (max-width: 768px) {
    .form-group {
        flex-direction: column; /* Вертикальная ориентация для мобильных устройств */
    }

    .calculator-label {
        margin-right: 0; /* Убираем отступ справа на мобильных */
        margin-bottom: 5px; /* Добавляем отступ снизу */
    }

    .button-calculate {
        width: 100%; /* Ширина кнопки на мобильных устройствах */
    }
}





/* скролл на связь */
.section-contact {
    scroll-behavior:unset;
}