/* SlickNav clones the menu into a full-width white panel for small screens.
   Nothing in slicknav.css hides that panel above the breakpoint: it only
   collapses to zero height because the plugin's JS sets display:none on the
   list inside it, so until that JS runs the clone is laid out and painted.
   With two menu items there is nothing worth collapsing, so drop the clone at
   every width and keep the real menu, which is already inline-block. */
.slicknav_menu,
#menu-button {
    display: none !important;
}

@media screen and (max-width: 992px) {
    .primary-menu {
        display: block !important;
    }
}

/* The contact and signup pages have no page title in the design. Their h1 is
   there for screen readers and crawlers; clip rather than display:none, which
   would take it out of the accessibility tree along with the layout. */
.sr-only-heading {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

/* Faint white rule across the bottom of the transparent front-page header. */
.transparent-menu .mainmenu-area {
    border-bottom: 0;
}

/* ---------------------------------------------------------------- footer ---
   The theme laid the footer out for four col-md-3 widgets. There are two, so
   a quarter of the width went to the address block, a quarter to the about
   text (three paragraphs at roughly five words a line) and the right half of
   the footer was empty. restyle_footer() in build.py strips the bootstrap
   column classes off those two widgets and the Masonry hooks off the rows, so
   the layout below is the only thing positioning them. */

.footer-top .row {
    display: flex;
    flex-direction: column;
    gap: 44px;
    margin-left: 0;
    margin-right: 0;
}

/* Bootstrap clears .row's floats with :before and :after. In a flex container
   those become flex items of their own, so space-between was distributing the
   free width across three gaps instead of one and neither column reached the
   edge of the container. Nothing floats in here now, so the clearfix can go. */
.footer-top .row::before,
.footer-top .row::after {
    display: none;
}

.footer-top .footer-widget {
    /* The theme's 60px carried the gap between stacked widgets; the flex gap
       does that now, and without this the footer ends in dead space. */
    margin-bottom: 0;
    padding-left: 0;
    padding-right: 0;
}

/* Tablet up: contact left, about text right, filling the container width. */
@media (min-width: 768px) {
    .footer-top .row {
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: flex-start;
        justify-content: space-between;
    }

    .footer-top .widget_acrony_address_widget {
        flex: 0 1 32%;
    }

    .footer-top .widget_text {
        flex: 0 1 54%;
    }
}

/* Wide: fix the contact column at the width its longest line needs, which is
   the street address on one line, and let the about text take a comfortable
   measure against the right edge. */
@media (min-width: 1200px) {
    .footer-top .widget_acrony_address_widget {
        flex: 0 0 340px;
    }

    .footer-top .widget_text {
        flex: 0 1 640px;
    }
}

/* Each row is icon plus value. As inline-block, a value that wrapped put its
   second line under the icon and hard against the left edge; as a flex row it
   wraps under itself. */
.footer-area .widget_acrony_address_widget .icon-list li {
    display: flex;
    align-items: flex-start;
    margin-bottom: 12px;
}

.footer-area .widget_acrony_address_widget .icon-list li:last-child {
    margin-bottom: 0;
}

.footer-area .widget_acrony_address_widget .icon-list li .icon {
    flex: 0 0 20px;
    margin-right: 12px;
    text-align: center;
}

.footer-top .widget_text p:last-child {
    margin-bottom: 0;
}

/* Hold the footer against the bottom of the window on pages too short to fill
   it, without pinning it on pages that are long enough. A sticky box offset by
   a full viewport can only be pushed as far as its containing block allows, so
   it sits at the bottom of a short page and stays in normal flow on a tall one.
   The theme already sets bottom:0 and left:0 on .footer-area, inert while the
   element is static: under sticky they become a second constraint that drags
   the footer up over the content, so both are cleared here. z-index likewise
   goes from the theme's -1, which would put a positioned footer behind the
   page, back to the normal flow order. */
body {
    min-height: 100vh;
}

@supports (min-height: 100dvh) {
    body {
        /* Mobile browsers count the collapsing URL bar in 100vh, which leaves
           a short page scrollable by exactly the height of that bar. */
        min-height: 100dvh;
    }
}

.footer-area {
    position: sticky;
    top: 100vh;
    bottom: auto;
    left: auto;
    z-index: 0;
}