/*
 * Footer reveal layer
 *
 * Loaded after the existing site CSS. The script adds .footer-reveal-enabled
 * only after it has measured a footer that fits comfortably in the viewport.
 */

:root {
  --footer-reveal-height: 0px;
}

@media (min-width: 760px) {
  body.footer-reveal-enabled .site-footer {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 0;
    width: 100%;
  }

  body.footer-reveal-enabled .site-front {
    position: relative;
    z-index: 1;
    isolation: isolate;
    margin-bottom: var(--footer-reveal-height);
    background: var(--footer-reveal-front-background, var(--cream, #f7f5ee));
    box-shadow: 0 20px 36px rgb(16 42 29 / 18%);
  }
}

/* A static footer is less surprising for motion-sensitive visitors. */
@media (prefers-reduced-motion: reduce) {
  body.footer-reveal-enabled .site-footer {
    position: relative;
    width: auto;
  }

  body.footer-reveal-enabled .site-front {
    margin-bottom: 0;
    box-shadow: none;
  }
}