/* Stage 18: short mobile footer — desktop footer intentionally untouched. */
.footer-mobile{display:none}
@media (max-width:800px){
  .site-footer{
    margin-top:28px !important;
    padding:0 !important;
    background:#f7f9f7;
    border-top:1px solid #e7ece8;
  }
  .site-footer .footer-desktop{display:none !important}
  .site-footer .footer-mobile{
    display:block;
    padding-top:15px;
    padding-bottom:calc(10px + env(safe-area-inset-bottom, 0px));
    color:#304438;
  }
  .footer-mobile-head{display:flex;align-items:center;gap:9px;min-height:37px}
  .footer-mobile-brand{display:inline-flex;align-items:center;gap:7px;min-width:0;white-space:nowrap;color:#1c4936;font-size:19px;font-weight:700;line-height:1.3}
  .footer-mobile-brand:hover{color:#1d6651}
  .footer-mobile-brand img{max-width:86px;max-height:35px;width:auto;height:auto;object-fit:contain}
  .footer-mobile-mark{display:grid;place-items:center;width:31px;height:31px;border-radius:9px;background:#e4eee7;color:#26654b;font-size:16px;flex:none}
  .footer-mobile-dot{color:#2a865f}
  .footer-mobile-description{font-size:10.5px;white-space:nowrap;color:#8a998d;border-right:1px solid #d7e0d8;padding-right:9px;margin-right:1px}
  .footer-mobile-actions{display:flex;align-items:center;gap:6px;margin-right:auto}
  .footer-mobile-actions a{display:grid;place-items:center;width:32px;height:32px;flex:none;border:1px solid #e1e9e3;background:#fff;border-radius:10px;color:#55735f;font-size:16px;line-height:1}
  .footer-mobile-actions a:focus-visible,.footer-mobile-nav a:focus-visible{outline:2px solid #247450;outline-offset:3px}
  .footer-mobile-actions a:hover{background:#e7f1e9;color:#236046}
  .footer-mobile-nav{
    display:flex;align-items:center;justify-content:space-between;
    gap:5px;margin-top:11px;padding:11px 0 10px;
    border-top:1px solid #e6ebe6;border-bottom:1px solid #e6ebe6;
  }
  .footer-mobile-nav a{display:inline-flex;align-items:center;justify-content:center;min-height:24px;padding:1px 0;white-space:nowrap;color:#637568;font-size:11px;font-weight:500;line-height:1.5}
  .footer-mobile-nav a:hover{color:#1d6651}
  .footer-mobile-bottom{padding-top:9px;text-align:center;color:#97a39a;font-size:10px;line-height:1.6}
  /* The mobile product buy bar should not leave a long empty tail inside the footer. */
  .pd-mobile-bar.pd-bar-hidden-by-footer{transform:translate3d(0,110%,0) !important;visibility:hidden !important;pointer-events:none !important}
}
@media(max-width:350px){
  .footer-mobile-description{display:none}
  .footer-mobile-nav{gap:3px}
  .footer-mobile-nav a{font-size:10px}
  .footer-mobile-actions a{width:30px;height:30px}
}
@media(prefers-reduced-motion:reduce){.pd-mobile-bar.pd-bar-hidden-by-footer{transition:none !important}}

/* Stage 44 — Sticky footer on short pages (all screen sizes).
   The footer remains in document flow; there is no fixed positioning or overlap.
   This stylesheet is loaded globally by templates/base.html, after binaar.css. */
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;  /* fallback for older mobile browsers */
  min-height: 100dvh; /* accounts for the browser's dynamic toolbar */
}

body > .main-content {
  flex: 1 0 auto;
  width: 100%;
  min-width: 0;
}

body > .site-footer {
  flex: 0 0 auto;
  width: 100%;
}