/* ---------------------------------------------------------------------------
   Landing page overrides
   ---------------------------------------------------------------------------
   Loaded after the theme's style.css so the theme file stays untouched.
   --------------------------------------------------------------------------- */

/* Centred hero.
   The theme's .flex_column_start left-aligns the copy because it shared the
   row with the illustration. That image has been removed, so the hero is one
   centred column. */
.flex_column_center {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    text-align: center;
    padding-top: 40px;
    padding-bottom: 40px;
    max-width: 860px;
    margin-left: auto;
    margin-right: auto;
}

/* The theme sizes .commonDesc for a half-width column; give it room to breathe
   now that it is the widest thing on the page. */
.flex_column_center .commonDesc {
    max-width: 20ch;
}

.flex_column_center .commonText {
    max-width: 62ch;
}

/* .commonBtn siblings are spaced with mx-5 in the markup, which is lopsided
   once the row is centred. */
.flex_column_center .d-flex {
    gap: 16px;
}

.flex_column_center .d-flex .commonBtn.mx-5 {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

@media (max-width: 575.98px) {
    .flex_column_center .commonDesc {
        max-width: none;
    }
}