/* Responsive repairs for the Contact page, loaded after the legacy styles. */
@media (max-width: 767px) {
    html,
    body,
    .global-content-vertical-fix,
    .global-content-wrapper,
    .contact-container {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
    }

    .contact-container > .contact-info,
    .contact-form .contact-info {
        box-sizing: border-box;
        width: 100%;
        margin: 0;
        padding: 156px 22px 70px;
    }

    .contact-container > .contact-info .section-subtitle,
    .contact-form .section-subtitle {
        width: 100%;
        margin: 0 0 44px !important;
    }

    .contact-info__container,
    .contact-form .contact-info__container {
        display: block;
        width: 100%;
        margin: 0;
    }

    .contact-info__container-headline {
        width: 100%;
        margin: 0 0 54px;
        font-size: clamp(32px, 10vw, 44px) !important;
        line-height: 1.12;
        letter-spacing: -1px;
    }

    .contact-item {
        width: 100%;
        margin: 0 0 42px;
        padding: 0;
    }

    .contact-item__title {
        margin-bottom: 14px;
        font-size: 23px;
        line-height: 1.25;
    }

    .contact-item__phone,
    .contact-item__email {
        max-width: 100%;
        font-size: 15px;
        line-height: 1.65;
        overflow-wrap: anywhere;
    }

    .contact-form {
        display: block;
        width: 100%;
    }

    .contact-form .contact-info {
        margin-bottom: 0;
        padding-top: 70px;
    }

    .contact-form .form-container {
        position: static;
        width: 100% !important;
        margin-top: 70px !important;
    }

    .contact-form .form-container > div:first-child {
        display: block !important;
        margin-top: 0 !important;
    }

    .contact-form .form-container > div:first-child h3 {
        width: 100% !important;
        margin: 0 0 12px !important;
        text-align: left !important;
        font-size: 20px;
    }

    .registercontpage,
    #basicform,
    .setup-content,
    .setup-content .col-md-12 {
        box-sizing: border-box;
        width: 100%;
        max-width: 100%;
    }

    #basicform .input {
        min-height: 48px;
        font-size: 17px;
    }

    #basicform .btn-light {
        float: none !important;
        width: 100%;
        margin-top: 22px;
    }
}

/* Mobile: legacy contact.css pulls the headline up with margin-bottom:-40px,
   overlapping "Let's Talk". Leave 30px between the rule and the headline. */
@media (max-width: 767px) {
    #info .section-subtitle {
        margin-bottom: 30px !important;
    }

    #info .section-subtitle .section-subtitle__rule {
        margin-bottom: 0 !important;
    }
}