/* ========================================================================== */
/* Orion footer structural separation v4                                     */
/* Mobile only: promotional banner widgets are grouped in their own section   */
/* above the institutional footer. Desktop markup/visual remains unchanged.   */
/* ========================================================================== */

/* The mount point exists in footer.php but is only activated by JS on mobile. */
#orion-footer-promos-section {
  display: none;
}

@media (max-width: 767px) {
  /* ----------------------------------------------------------------------- */
  /* Promotional banner section                                             */
  /* ----------------------------------------------------------------------- */
  body #orion-footer-promos-section.orion-is-active {
    display: block !important;
    position: relative !important;
    clear: both !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 28px 0 !important;
    overflow: visible !important;
    background: #ffffff !important;
  }

  body #orion-footer-promos-section > .container {
    display: block !important;
    clear: both !important;
    float: none !important;
    height: auto !important;
  }

  body #orion-footer-promos-grid {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 22px !important;
    clear: both !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body #orion-footer-promos-grid > .widget.orion-footer-promo-widget {
    display: block !important;
    position: static !important;
    clear: both !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    overflow: visible !important;
    text-align: center !important;
  }

  body #orion-footer-promos-grid > .widget.orion-footer-promo-widget p,
  body #orion-footer-promos-grid > .widget.orion-footer-promo-widget .textwidget,
  body #orion-footer-promos-grid > .widget.orion-footer-promo-widget a {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
  }

  body #orion-footer-promos-grid > .widget.orion-footer-promo-widget img {
    display: block !important;
    position: static !important;
    clear: both !important;
    float: none !important;
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
  }

  /* ----------------------------------------------------------------------- */
  /* Institutional footer                                                    */
  /* It now starts only after all promotional banners have finished.          */
  /* ----------------------------------------------------------------------- */
  body #footer-wrapper {
    clear: both !important;
    float: none !important;
    margin-top: 0 !important;
    padding-top: 28px !important;
    background: #273e42 !important;
    color: #ffffff !important;
  }

  body #footer > .row {
    display: block !important;
    clear: both !important;
  }

  body #footer > .row > .span3 {
    display: block !important;
    clear: both !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 0 22px !important;
    padding: 0 0 22px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.14) !important;
  }

  body #footer > .row > .span3:last-child {
    margin-bottom: 0 !important;
    padding-bottom: 8px !important;
    border-bottom: 0 !important;
  }

  /* Any widget remaining in the footer is institutional content. */
  body #footer .widget:not(.orion-footer-promo-widget) {
    display: block !important;
    position: static !important;
    clear: both !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    overflow: visible !important;
  }

  body #footer .widget:not(.orion-footer-promo-widget) + .widget:not(.orion-footer-promo-widget) {
    margin-top: 18px !important;
  }

  body #footer .widget:not(.orion-footer-promo-widget),
  body #footer .widget:not(.orion-footer-promo-widget) p,
  body #footer .widget:not(.orion-footer-promo-widget) li,
  body #footer .widget:not(.orion-footer-promo-widget) span,
  body #footer .widget:not(.orion-footer-promo-widget) div,
  body #footer .widget:not(.orion-footer-promo-widget) a {
    color: #ffffff !important;
  }

  body #footer .widget:not(.orion-footer-promo-widget) .title,
  body #footer .widget:not(.orion-footer-promo-widget) h1,
  body #footer .widget:not(.orion-footer-promo-widget) h2,
  body #footer .widget:not(.orion-footer-promo-widget) h3,
  body #footer .widget:not(.orion-footer-promo-widget) h4,
  body #footer .widget:not(.orion-footer-promo-widget) h5,
  body #footer .widget:not(.orion-footer-promo-widget) h6 {
    color: #ffffff !important;
    margin: 0 0 10px !important;
  }

  body #footer-bottom {
    clear: both !important;
    float: none !important;
    margin-top: 0 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.18) !important;
  }
}