.modal-backdrop .branch-modal {
    width: min(760px, calc(100vw - 48px));
    margin: 24px;
    border-radius: 22px;
}

.modal-backdrop .branch-modal > header {
    padding: 28px 30px 24px;
}

.modal-backdrop .branch-modal > form {
    padding: 28px 30px 30px !important;
}

.modal-backdrop .branch-modal .form-grid {
    row-gap: 22px !important;
    column-gap: 24px !important;
}

.modal-backdrop .branch-modal .head-office {
    margin-top: 24px;
    padding: 16px;
}

.modal-backdrop .branch-modal .modal-actions {
    margin-top: 28px;
    padding-top: 22px;
}

@media (max-width: 700px) {
    .modal-backdrop .branch-modal {
        width: 100%;
        min-height: 100vh;
        margin: 0;
        border-radius: 0;
    }

    .modal-backdrop .branch-modal > header {
        padding: 22px 20px;
    }

    .modal-backdrop .branch-modal > form {
        padding: 22px 20px 30px !important;
    }

    .modal-backdrop .branch-modal .form-grid {
        row-gap: 18px !important;
    }
}