/* Contact/support page layout.
   Spacing follows the shared MusicMaster golden-ratio scale defined in
   musicmaster-golden-theme.css. Colors deliberately remain inherited from
   the existing theme. */

.mm-contact-page {
    width: 61.803398875%;
    margin-inline: auto;
    display: flex;
    flex-direction: column;
    gap: var(--mm-space-3, 1rem);
}

.mm-contact-page__header {
    margin: 0;
    padding-block: var(--mm-space-2, .618rem);
}

.mm-contact-page__header h1 {
    margin: 0 0 var(--mm-space-2, .618rem);
}

.mm-contact-page__header p {
    margin: 0;
    max-width: 68ch;
}

.mm-contact-page__notice {
    margin: 0;
}

.mm-contact-page__form {
    width: 100%;
    margin: 0;
    padding: var(--mm-space-4, 1.618rem) !important;
    display: flex;
    flex-direction: column;
    gap: var(--mm-space-3, 1rem);
}

.mm-contact-page__form .mb-3 {
    margin: 0 !important;
}

.mm-contact-page__form .form-label {
    margin-bottom: var(--mm-space-1, .382rem);
}

.mm-contact-page__form .form-control:not(textarea),
.mm-contact-page__form .form-select {
    min-height: var(--mm-control-height, 2.618rem);
    height: var(--mm-control-height, 2.618rem);
    padding-block: var(--mm-space-1, .382rem);
}

.mm-contact-page__form textarea.form-control {
    min-height: calc(var(--mm-space-6, 4.236rem) + var(--mm-space-5, 2.618rem));
    resize: vertical;
}

.mm-contact-page__form .btn {
    align-self: flex-start;
    min-height: var(--mm-control-height, 2.618rem);
    padding-inline: var(--mm-space-4, 1.618rem);
}

.mm-contact-page__hint {
    margin-top: var(--mm-space-1, .382rem);
    font-size: var(--mm-font-sm, .875rem);
}

.mm-contact-page__form .alert:empty,
.mm-contact-page__form .field-validation-valid:empty {
    display: none;
}

@media (max-width: 991.98px) {
    .mm-contact-page {
        width: 76.39320225%;
    }
}

@media (max-width: 767.98px) {
    .mm-contact-page {
        width: 100%;
    }

    .mm-contact-page__form {
        padding: var(--mm-space-3, 1rem) !important;
    }
}