/*
 * Find a Provider landing page (/find-a-provider/), enqueued only on that page.
 * Scoped to the page content (.et-l--post) so the Theme Builder header/footer are untouched.
 * section_0 / row_0 are Divi's position-based names for the hero; update them if sections
 * are added or reordered above it.
 */

/* Side margins at every width (the rows were 100% wide below their max width). */
body .et-l--post .et_pb_row {
    width: 90% !important;
}

/* The hero grows with its text instead of a fixed 518px, so the text never spills out of the
   blue background or hides under the plan cards that overlap it. */
body .et-l--post .et_pb_section.et_pb_section_0 {
    height: auto !important;
    min-height: 518px;
}

@media (min-width: 981px) {
    /* Contain the hero's floated text column so it can't push the first plan card sideways,
       and leave room under the text for the cards, which are pulled up into the hero. */
    body .et-l--post .et_pb_section_0 .et_pb_row.et_pb_row_0 {
        display: flow-root;
        padding-bottom: 110px !important;
    }

    /* Plan cards: equal height with the Search buttons aligned along the bottom. Titles wrap to
       2 or 3 lines depending on width, and each card had its own module spacing. */
    body .et-l--post .et_pb_row.et_pb_row_1 {
        display: flex;
        align-items: stretch;
    }

    body .et-l--post .et_pb_row.et_pb_row_1::after {
        display: none;
    }

    body .et-l--post .et_pb_row_1 > .et_pb_column {
        display: flex;
        flex-direction: column;
        /* Keep the mountain artwork anchored under the button as the card height changes. */
        background-position: center bottom !important;
    }

    body .et-l--post .et_pb_row_1 > .et_pb_column > .et_pb_text + .et_pb_text {
        margin-bottom: 0 !important;
    }

    body .et-l--post .et_pb_row_1 > .et_pb_column > .et_pb_button_module_wrapper {
        margin-top: auto !important;
        margin-bottom: 30px !important;
        padding-top: 72px;
    }
}
