/*
 * Altech Doors compatibility layer. Load LAST, after main.css and page CSS.
 * Pair with layout-support.js. Baseline: iOS Safari 13+ (iPhone 11 generation).
 * Feature classes, not device names, select the fallbacks.
 * Flex gaps are tested by measurement, including reverse and wrapped columns.
 * Never apply flex item margins to Grid or an active Splide slide track.
 * Wrapping rows may wrap a little earlier because margins include an outer gutter.
 */

/* 1. Flex layouts without reliable gap support. Explicit zero also handles
   engines that implement row gap but not column-reverse gap correctly. */
html.flexbox.no-flex-gap .btn,
html.flexbox.no-flex-gap .btn-group,
html.flexbox.no-flex-gap .form-wrapper,
html.flexbox.no-flex-gap .input-group,
html.flexbox.no-flex-gap .title-between,
html.flexbox.no-flex-gap .banner .container,
html.flexbox.no-flex-gap .banner .banner-group,
html.flexbox.no-flex-gap .banner .banner-link,
html.flexbox.no-flex-gap .nav .nav-menus,
html.flexbox.no-flex-gap .nav .dropdown + .dropdown-menu,
html.flexbox.no-flex-gap .section-hero .container,
html.flexbox.no-flex-gap .hero-topics,
html.flexbox.no-flex-gap .splide-hero .splide__pagination,
html.flexbox.no-flex-gap .splide-hero .text-wrapper,
html.flexbox.no-flex-gap .splide-work .text-wrapper,
html.flexbox.no-flex-gap .splide-reviews.is-initialized:not(.is-active) .splide__list,
html.flexbox.no-flex-gap .splide-reviews .review-footer,
html.flexbox.no-flex-gap .splide-reviews .reviewer,
html.flexbox.no-flex-gap .reviews-section .review-controls,
html.flexbox.no-flex-gap .stars,
html.flexbox.no-flex-gap ul.list,
html.flexbox.no-flex-gap ul.list-group .label,
html.flexbox.no-flex-gap ul.list-boxed li,
html.flexbox.no-flex-gap .content-row,
html.flexbox.no-flex-gap .pagination-wrapper,
html.flexbox.no-flex-gap .tags-wrapper,
html.flexbox.no-flex-gap .share-to,
html.flexbox.no-flex-gap .article .article-top,
html.flexbox.no-flex-gap .article-table-of-contents ol,
html.flexbox.no-flex-gap .article-footer,
html.flexbox.no-flex-gap .splide-service li .btn-wrapper,
html.flexbox.no-flex-gap .small-note,
html.flexbox.no-flex-gap .footer .info .area,
html.flexbox.no-flex-gap .footer .links .link-wrapper,
html.flexbox.no-flex-gap .footer .socials,
html.flexbox.no-flex-gap .footer .supports,
html.flexbox.no-flex-gap .footer .tnc,
html.flexbox.no-flex-gap .job-heading,
html.flexbox.no-flex-gap .job-meta,
html.flexbox.no-flex-gap .job-meta .tag {
  gap: 0;
}

/* Text and icon pairs, including unwrapped text nodes in existing buttons. */
html.flexbox.no-flex-gap .btn { --layout-inline-gap: 12px; }
html.flexbox.no-flex-gap .banner .banner-link { --layout-inline-gap: 8px; }
html.flexbox.no-flex-gap .small-note { --layout-inline-gap: 16px; }
html.flexbox.no-flex-gap .btn > .icon,
html.flexbox.no-flex-gap .btn > svg,
html.flexbox.no-flex-gap .banner-link > .icon,
html.flexbox.no-flex-gap .banner-link > svg,
html.flexbox.no-flex-gap .small-note > .icon {
  flex-shrink: 0;
  margin-left: 6px;
  margin-right: 6px;
}
html.flexbox.no-flex-gap .btn > .layout-icon-checked,
html.flexbox.no-flex-gap .banner-link > .layout-icon-checked,
html.flexbox.no-flex-gap .small-note > .layout-icon-checked {
  margin-left: 0;
  margin-right: 0;
}
html.flexbox.no-flex-gap .layout-icon-checked.layout-space-before {
  margin-left: var(--layout-inline-gap, 12px);
}
html.flexbox.no-flex-gap .layout-icon-checked.layout-space-after {
  margin-right: var(--layout-inline-gap, 12px);
}
html.flexbox.no-flex-gap .footer .info .area::before,
html.flexbox.no-flex-gap .job-meta .tag::before { margin-right: 8px; }
html.flexbox.no-flex-gap ul.list-group .label::before { margin-right: 12px; }
html.flexbox.no-flex-gap ul.list-boxed li > .icon,
html.flexbox.no-flex-gap .splide-hero .text-wrapper > .icon { margin-right: 16px; }
html.flexbox.no-flex-gap .splide-work .text-wrapper > .icon { margin-right: 12px; }

/* Single rows. Do not change the active slider's own slide spacing. */
html.flexbox.no-flex-gap .banner .banner-group > :not([hidden]) ~ :not([hidden]),
html.flexbox.no-flex-gap .share-to > :not([hidden]) ~ :not([hidden]) { margin-left: 8px; }
html.flexbox.no-flex-gap .banner .container > :not([hidden]) ~ :not([hidden]) { padding-left: 32px; }
html.flexbox.no-flex-gap .nav .nav-menus > :not(.close-btn):not([hidden]) ~ :not(.close-btn):not([hidden]) { margin-left: 28px; }
html.flexbox.no-flex-gap .section-hero .container > .panel + .panel { margin-left: 16px; }
html.flexbox.no-flex-gap .splide-hero .splide__pagination > li + li,
html.flexbox.no-flex-gap .reviews-section .review-controls > button + button,
html.flexbox.no-flex-gap .footer .socials > :not([hidden]) ~ :not([hidden]) { margin-left: 12px; }
html.flexbox.no-flex-gap .splide-reviews .reviewer > :not([hidden]) ~ :not([hidden]) { margin-left: 14px; }
html.flexbox.no-flex-gap .splide-reviews .review-footer > :not([hidden]) ~ :not([hidden]),
html.flexbox.no-flex-gap .footer .tnc > :not([hidden]) ~ :not([hidden]) { margin-left: 20px; }
html.flexbox.no-flex-gap .article-footer > :not([hidden]) ~ :not([hidden]) { margin-left: 12px; }
html.flexbox.no-flex-gap .stars > .star + .star { margin-left: 4px; }
html.flexbox.no-flex-gap .content-row > .content + .content { margin-left: 80px; }

/* Columns: retain existing horizontal alignment and auto margins elsewhere. */
html.flexbox.no-flex-gap .form-wrapper > :not([hidden]):not(.hidden) ~ :not([hidden]):not(.hidden) { margin-top: 20px; }
html.flexbox.no-flex-gap .nav .dropdown + .dropdown-menu > :not([hidden]) ~ :not([hidden]) { margin-top: 12px; }
html.flexbox.no-flex-gap ul.list > li + li { margin-top: 0.5ch; }
html.flexbox.no-flex-gap .article-table-of-contents ol > li + li { margin-top: 16px; }
html.flexbox.no-flex-gap .footer .links .link-wrapper > :not([hidden]) ~ :not([hidden]) { margin-top: 8px; }

/* Wrapping rows use contained positive margins. Full-width mobile controls
   are reset below so a gutter cannot push them outside the viewport. */
html.flexbox.no-flex-gap .btn-group > :not([hidden]):not(.hidden) {
  margin-right: 16px;
  margin-bottom: 12px;
  max-width: calc(100% - 16px);
}
html.flexbox.no-flex-gap .hero-topics > span {
  margin-right: 12px;
  margin-bottom: 8px;
  max-width: calc(100% - 12px);
}
html.flexbox.no-flex-gap .title-between > :not([hidden]):not(.hidden) {
  margin-right: 60px;
  margin-bottom: 32px;
  min-width: 0;
  max-width: calc(100% - 60px);
}
html.flexbox.no-flex-gap .article .article-top > :not([hidden]) {
  margin-right: 40px;
  margin-bottom: 20px;
  max-width: calc(100% - 40px);
}
html.flexbox.no-flex-gap .job-heading > :not([hidden]) {
  margin-right: 20px;
  margin-bottom: 16px;
  max-width: calc(100% - 20px);
}
html.flexbox.no-flex-gap .job-meta > :not([hidden]) {
  margin-right: 40px;
  margin-bottom: 10px;
  max-width: calc(100% - 40px);
}
html.flexbox.no-flex-gap .pagination-wrapper > :not([hidden]) { margin: 0 2px 2px 0; }
html.flexbox.no-flex-gap .tags-wrapper > :not([hidden]),
html.flexbox.no-flex-gap .footer .supports > :not([hidden]) { margin-right: 8px; margin-bottom: 8px; }
html.flexbox.no-flex-gap .splide-reviews.is-initialized:not(.is-active) .splide__list > .splide__slide {
  margin-right: 32px;
  margin-bottom: 32px;
  max-width: calc(100% - 32px);
}
html.flexbox.no-flex-gap .splide-service li .btn-wrapper > .btn {
  margin-right: 12px;
  margin-bottom: 12px;
  max-width: calc(100% - 12px);
}
html.flexbox.no-flex-gap .btn-group > :last-child,
html.flexbox.no-flex-gap .hero-topics > :last-child,
html.flexbox.no-flex-gap .title-between > :last-child,
html.flexbox.no-flex-gap .article .article-top > :last-child,
html.flexbox.no-flex-gap .job-heading > :last-child,
html.flexbox.no-flex-gap .job-meta > :last-child,
html.flexbox.no-flex-gap .splide-service li .btn-wrapper > .btn:last-child {
  margin-right: 0;
  max-width: 100%;
}

/* These wrapping flex layouts can use the Grid engine already present in
   iOS 13. Only these named containers change layout, never all .cards. */
html.flexbox.grid-layout.no-flex-gap .cards.alt-1 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  grid-gap: 28px;
}
html.flexbox.grid-layout.no-flex-gap .stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  grid-gap: 28px;
}
html.flexbox.grid-layout.no-flex-gap .input-group {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  grid-gap: 20px;
}
html.flexbox.grid-layout.no-flex-gap .input-group.no-half { grid-template-columns: 1fr; }
html.flexbox.grid-layout.no-flex-gap .footer .footer-top {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1.4fr) minmax(0, 0.65fr);
  grid-gap: 72px;
}
html.flexbox.grid-layout.no-flex-gap .input-group > *,
html.flexbox.grid-layout.no-flex-gap .cards.alt-1 > *,
html.flexbox.grid-layout.no-flex-gap .stats > *,
html.flexbox.grid-layout.no-flex-gap .footer .footer-top > * { min-width: 0; }

@media (max-width: 1300px) {
  html.flexbox.no-flex-gap .nav .nav-menus > :not(.close-btn):not([hidden]) { margin-left: 0; }
  html.flexbox.no-flex-gap .nav .nav-menus > :not(.close-btn):not([hidden]) ~ :not(.close-btn):not([hidden]) { margin-top: 16px; }
}
@media (max-width: 1200px) {
  html.flexbox.no-flex-gap .section-hero .container > .panel + .panel { margin-left: 0; margin-top: 16px; }
  html.flexbox.no-flex-gap .title-between.alt-1 > :not([hidden]) {
    margin-right: 0;
    max-width: 100%;
    margin-bottom: 32px;
  }
  html.flexbox.no-flex-gap .title-between.alt-1 > :last-child { margin-bottom: 0; }
}
@media (max-width: 1024px) {
  html.flexbox.no-flex-gap .content-row > .content + .content { margin-left: 0; margin-bottom: 80px; }
  html.flexbox.no-flex-gap .content-row.wrap-invert > .content + .content { margin-bottom: 0; margin-top: 80px; }
  html.flexbox.no-flex-gap .interlude { gap: 0; }
  html.flexbox.no-flex-gap .interlude .img-bg { margin-top: 32px; }
  html.flexbox.grid-layout.no-flex-gap .footer .footer-top { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-gap: 80px; }
  html.flexbox.grid-layout.no-flex-gap .footer .footer-top .company { grid-column: 1 / -1; }
}
@media (max-width: 768px) {
  html.flexbox.no-flex-gap .banner .container > :not([hidden]) ~ :not([hidden]) { padding-left: 0; margin-top: 5px; }
  html.flexbox.no-flex-gap .banner .banner-group.banner-hiring > :not([hidden]) { margin: 0 4px 4px; }
  html.flexbox.no-flex-gap .btn-group > :not([hidden]):not(.hidden),
  html.flexbox.no-flex-gap .splide-service li .btn-wrapper > .btn {
    margin-right: 0;
    max-width: 100%;
    margin-bottom: 12px;
  }
  html.flexbox.no-flex-gap .btn-group > :last-child,
  html.flexbox.no-flex-gap .splide-service li .btn-wrapper > .btn:last-child { margin-bottom: 0; }
  html.flexbox.no-flex-gap .content-row > .content + .content { margin-bottom: 60px; }
  html.flexbox.no-flex-gap .content-row.wrap-invert > .content + .content { margin-bottom: 0; margin-top: 60px; }
  html.flexbox.no-flex-gap .title-between > :not([hidden]):not(.hidden),
  html.flexbox.no-flex-gap .job-heading > :not([hidden]) { margin-right: 0; max-width: 100%; }
  html.flexbox.no-flex-gap .job-heading > :last-child { margin-bottom: 0; }
  html.flexbox.no-flex-gap .tags-wrapper > :not([hidden]) { margin-bottom: 0; }
  html.flexbox.grid-layout.no-flex-gap .cards.alt-1,
  html.flexbox.grid-layout.no-flex-gap .stats,
  html.flexbox.grid-layout.no-flex-gap .input-group,
  html.flexbox.grid-layout.no-flex-gap .footer .footer-top { grid-template-columns: minmax(0, 1fr); }
  html.flexbox.grid-layout.no-flex-gap .footer .footer-top { grid-gap: 48px; }
  html.flexbox.no-flex-gap .footer .footer-bottom { gap: 0; }
  html.flexbox.no-flex-gap .footer .footer-bottom > :not([hidden]) ~ :not([hidden]) { margin-top: 12px; }
}
@media (max-width: 360px) {
  html.flexbox.no-flex-gap .banner .banner-emergency > :not([hidden]) { margin: 0 4px 4px; }
}

/* 2. CSS math fallback, primarily clamp() on early iOS 13. Keep breakpoint
   overrides here because this stylesheet loads after main.css. */
html.no-css-math .service-hero .panel,
html.no-css-math .brand-hero .panel { gap: 40px; padding: 48px 40px; }
html.no-css-math .home-hero .hero-brand-panel .panel-text { padding: 64px 40px; }
html.no-css-math .home-hero .hero-brand-panel p { width: 52%; max-width: 470px; }
html.no-css-math .interlude .img-bg { width: 38%; max-width: 540px; right: 24px; }
html.no-css-math .blog-post-hero h1 { font-size: 56px; }
html.no-css-math .blog-post-featured-image { height: 420px; }
@media (min-width: 1500px) {
  html.no-css-math .interlude .img-bg { right: calc((100% - 1380px) / 2); }
}
@media (max-width: 1024px) {
  html.no-css-math .service-hero .panel,
  html.no-css-math .brand-hero .panel { gap: 32px; }
  html.no-css-math .service-hero .panel::after,
  html.no-css-math .brand-hero .panel::after { width: 100%; max-width: 280px; }
  html.no-css-math .interlude .img-bg { width: calc(100% - 48px); max-width: 340px; right: auto; }
}
@media (max-width: 768px) {
  html.no-css-math .service-hero .panel,
  html.no-css-math .brand-hero .panel { padding: 36px 24px 24px; gap: 28px; }
  html.no-css-math .service-hero .panel::after,
  html.no-css-math .brand-hero .panel::after { max-width: 240px; }
  html.no-css-math .home-hero .hero-brand-panel .panel-text { padding: 44px 24px 32px; }
  html.no-css-math .home-hero .hero-brand-panel p { width: auto; max-width: none; }
  html.no-css-math .home-hero .hero-mascot { width: calc(100% - 48px); max-width: 280px; }
  html.no-css-math .interlude .img-bg { max-width: 300px; }
  html.no-css-math .home-hero .hero-brand-panel h1,
  html.no-css-math .service-hero .panel-overlay h1,
  html.no-css-math .brand-hero .panel-overlay h1 { font-size: 36px; }
  html.no-css-math .blog-post-hero h1 { font-size: 38px; }
  html.no-css-math .blog-post-featured-image { height: 260px; }
}
@media (max-width: 360px) {
  html.no-css-math .home-hero .hero-brand-panel h1,
  html.no-css-math .service-hero .panel-overlay h1,
  html.no-css-math .brand-hero .panel-overlay h1 { font-size: 30px; }
}

/* 3. inset shorthand: restore the same four offsets on decorative layers. */
html.no-inset .service-hero .panel::before,
html.no-inset .brand-hero .panel::before,
html.no-inset .home-hero .hero-brand-panel::after,
html.no-inset .reviews-section .review-arrow::before,
html.no-inset .footer .social-link::before { top: 0; right: 0; bottom: 0; left: 0; }

/* 4. Image proportions. The detector sizes standalone square images and
   updates them on resize. Industry-card wrappers use a CSS ratio box. */
html.no-aspect-ratio .img-square { height: auto; }
html.no-aspect-ratio .cards.alt-3 .card.alt-1 .img-wrapper {
  position: relative;
  height: 0;
  padding: 0 0 75%;
}
html.no-aspect-ratio .cards.alt-3 .card.alt-1 .img-wrapper img {
  position: absolute;
  top: 16px;
  left: 16px;
  width: calc(100% - 32px);
  height: calc(100% - 16px);
}

/* Fixed background painting is unreliable on older touch Safari, including
   landscape widths above the site's existing 768px cutoff. */
@media (hover: none) and (pointer: coarse) {
  .van-parallax { background-attachment: scroll; }
}


/* 5. Selector fallbacks. Use a DOM class for :has(); never combine these
   rules with unsupported selectors in the same selector list. */
html.no-has-selector .article .container.has-article-toc {
  display: grid;
    grid-template-columns: minmax(260px, 340px) minmax(0, 1fr);
    align-items: start;
}

html.no-has-selector .article .container.has-article-toc .article-table-of-contents {
  grid-column: 1;
}

html.no-has-selector .article .container.has-article-toc .article-content {
  grid-column: 2;
    max-width: 940px;
    padding-left: 64px;
    border-left: 1px solid var(--border-color);
}

@media only screen and (max-width: 1024px) {
html.no-has-selector .article .container.has-article-toc {
  grid-template-columns: 1fr;
}
}

@media only screen and (max-width: 1024px) {
html.no-has-selector .article .container.has-article-toc .article-table-of-contents,
html.no-has-selector .article .container.has-article-toc .article-content {
  grid-column: 1;
}
}

@media only screen and (max-width: 1024px) {
html.no-has-selector .article .container.has-article-toc .article-content {
  max-width: none;
      padding-left: 0;
      border-left: 0;
}
}

/* Restore hover, open, and focus states whose original selector lists also
   contain :focus-visible. On these engines :focus is the keyboard fallback. */
html.no-focus-visible .card.card-blog:hover,
html.no-focus-visible .card.card-blog:focus {
  border-color: var(--brand-tertiary);
    box-shadow: 0 10px 28px rgba(12, 7, 47, 0.08);
}

html.no-focus-visible .card.card-blog:hover .img-wrapper::after,
html.no-focus-visible .card.card-blog:focus .img-wrapper::after {
  opacity: 1;
}

html.no-focus-visible .card.card-blog:hover .img-wrapper .read,
html.no-focus-visible .card.card-blog:focus .img-wrapper .read {
  opacity: 1;
    transform: translate(-50%, -50%) scale(1);
}

html.no-focus-visible .card.card-blog:hover .text-wrapper h4,
html.no-focus-visible .card.card-blog:focus .text-wrapper h4 {
  color: var(--brand-primary);
}

html.no-focus-visible .reviews-section .review-arrow:hover,
html.no-focus-visible .reviews-section .review-arrow:focus {
  background-color: var(--brand-primary);
    border-color: var(--brand-tertiary);
}

html.no-focus-visible .article-table-of-contents a:hover,
html.no-focus-visible .article-table-of-contents a:focus,
html.no-focus-visible .article-table-of-contents a.is-active {
  color: var(--brand-secondary);
}

html.no-focus-visible .alto-contact:hover,
html.no-focus-visible .alto-contact:focus {
  color: #ffffff;
}

html.no-focus-visible .alto-contact:hover .alto-prompt,
html.no-focus-visible .alto-contact:focus .alto-prompt,
html.no-focus-visible .alto-contact:focus-within .alto-prompt,
html.no-focus-visible .alto-contact.is-open .alto-prompt {
  width: 235px;
    max-width: 235px;
    padding-left: 32px;
    padding-right: 54px;
    opacity: 1;
}

html.no-focus-visible .alto-contact:hover .alto-avatar,
html.no-focus-visible .alto-contact:focus .alto-avatar,
html.no-focus-visible .alto-contact.is-open .alto-avatar {
  transform: scale(1.03);
}

@media only screen and (max-width: 768px) {
html.no-focus-visible .alto-contact:hover .alto-prompt,
html.no-focus-visible .alto-contact:focus .alto-prompt,
html.no-focus-visible .alto-contact:focus-within .alto-prompt,
html.no-focus-visible .alto-contact.is-open .alto-prompt {
  width: 190px;
      max-width: 190px;
      padding-left: 24px;
      padding-right: 42px;
}
}

html.no-focus-visible :focus {
  outline: 2px solid var(--brand-tertiary);
    outline-offset: 3px;
}
/* 6. Readable structural fallback if a layout probe fails entirely. These
   guards are outside the expected iOS 13+ path; this is not IE support.
   !important is confined to disabling broken layout engines. */
html.no-grid-layout .stats,
html.no-grid-layout .input-group,
html.no-grid-layout .footer .footer-top,
html.no-grid-layout .cards,
html.no-grid-layout .teams,
html.no-grid-layout .benefit-grid,
html.no-grid-layout .footer .info .areas,
html.no-grid-layout .article .container.has-article-toc,
html.no-grid-layout .service-hero .panel,
html.no-grid-layout .brand-hero .panel,
html.no-grid-gap .stats,
html.no-grid-gap .input-group,
html.no-grid-gap .footer .footer-top,
html.no-grid-gap .cards,
html.no-grid-gap .teams,
html.no-grid-gap .benefit-grid,
html.no-grid-gap .footer .info .areas,
html.no-grid-gap .service-hero .panel,
html.no-grid-gap .brand-hero .panel {
  display: block !important;
}
html.no-grid-layout .stats > * + *,
html.no-grid-layout .input-group > * + *,
html.no-grid-layout .footer .footer-top > * + *,
html.no-grid-layout .cards > * + *,
html.no-grid-layout .teams > * + *,
html.no-grid-layout .benefit-grid > * + *,
html.no-grid-gap .stats > * + *,
html.no-grid-gap .input-group > * + *,
html.no-grid-gap .footer .footer-top > * + *,
html.no-grid-gap .cards > * + *,
html.no-grid-gap .teams > * + *,
html.no-grid-gap .benefit-grid > * + * { margin-top: 28px; }
html.no-grid-layout .benefit-grid > div + div,
html.no-grid-gap .benefit-grid > div + div { padding-left: 0; border-left: 0; }
html.no-grid-layout .footer .info .areas > * + *,
html.no-grid-gap .footer .info .areas > * + * { margin-top: 12px; }
html.no-grid-layout .service-hero .panel::after,
html.no-grid-layout .brand-hero .panel::after,
html.no-grid-gap .service-hero .panel::after,
html.no-grid-gap .brand-hero .panel::after {
  display: block;
  position: relative;
  width: 100%;
  max-width: 280px;
  height: 340px;
  margin: 32px auto 0;
}
html.no-grid-layout .article .container.has-article-toc .article-content {
  padding-left: 0;
  border-left: 0;
}
html.no-grid-layout .article .container.has-article-toc .article-table-of-contents {
  position: static;
  max-height: none;
  margin-bottom: 32px;
  padding-right: 0;
}
html.no-flexbox .section-hero .container,
html.no-flexbox .content-row,
html.no-flexbox .stats,
html.no-flexbox .input-group,
html.no-flexbox .footer .footer-top { display: block; }
html.no-flexbox .section-hero .container > .panel + .panel,
html.no-flexbox .content-row > .content + .content,
html.no-flexbox .stats > .stat + .stat,
html.no-flexbox .input-group > * + *,
html.no-flexbox .footer .footer-top > * + * { margin-top: 28px; }
html.no-flexbox .btn-group > .btn { display: inline-block; margin: 0 12px 12px 0; }
html.no-flexbox .interlude .title-wrapper { width: 100%; }
html.no-flexbox .interlude .img-bg {
  position: relative;
  top: auto;
  right: auto;
  left: auto;
  bottom: auto;
  transform: none;
  width: 100%;
  max-width: 280px;
  height: 340px;
  margin: 0 auto 32px;
}