/* Footer: the facts a person checks before trusting a tradesman, in four short columns on
   charcoal, darker than the contact section above it. */
.mm-site-footer {
  background: #050f1e;
  border-top: 1px solid rgb(220 227 234 / 12%);
  color: #c9d3df;
  font-size: 0.95rem;
  line-height: 1.55;
}

.mm-site-footer__inner {
  display: grid;
  gap: 2.2rem 2.5rem;
  grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr));
  padding: clamp(2.6rem, 4vw, 3.6rem) var(--mm-section-gutter) clamp(2rem, 3vw, 2.6rem);
}

.mm-site-footer p {
  margin: 0;
}

.mm-site-footer__name {
  display: grid;
  font-family: "Barlow Semi Condensed", sans-serif;
  line-height: 1.05;
}

.mm-site-footer__name strong {
  color: #fff;
  font-size: 1.5rem;
  font-weight: 800;
  letter-spacing: 0.01em;
  text-transform: uppercase;
}

.mm-site-footer__name span {
  color: #f4c542;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  margin-top: 0.3rem;
  text-transform: uppercase;
}

.mm-site-footer__tagline {
  margin-top: 1rem !important;
  max-width: 26rem;
}

.mm-site-footer__trust {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 0.6rem;
  list-style: none;
  margin: 1.1rem 0 0;
  padding: 0;
}

.mm-site-footer__trust li {
  border: 1px solid rgb(220 227 234 / 18%);
  border-radius: 999px;
  color: #eef2f7;
  font-size: 0.82rem;
  padding: 0.3rem 0.7rem;
}

.mm-site-footer__label {
  color: #f4c542;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.09em;
  margin-bottom: 0.7rem !important;
  text-transform: uppercase;
}

/* A second list in the same column: the service pages. */
.mm-site-footer__label--next {
  margin-top: 1.3rem !important;
}

.mm-site-footer__phone {
  color: #fff;
  display: inline-block;
  font-family: "Barlow Semi Condensed", sans-serif;
  font-size: 1.6rem;
  font-weight: 800;
  line-height: 1;
  margin-bottom: 0.6rem;
  text-decoration: none;
}

.mm-site-footer__phone:hover {
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 5px;
}

.mm-site-footer__hours strong {
  color: #fff;
  font-weight: 600;
}

.mm-site-footer__address {
  font-style: normal;
  margin-top: 0.8rem;
}

.mm-site-footer__address span {
  color: #8fa0b5;
  font-size: 0.88rem;
}

.mm-site-footer__nav ul {
  display: grid;
  gap: 0.35rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.mm-site-footer a {
  color: #eef2f7;
  text-decoration: none;
}

.mm-site-footer__nav a:hover,
.mm-site-footer__oferteo:hover,
.mm-site-footer__bottom a:hover {
  color: #f4c542;
  text-decoration: underline;
  text-underline-offset: 4px;
}

.mm-site-footer a:focus-visible {
  border-radius: 4px;
  outline: 3px solid #f4c542;
  outline-offset: 3px;
}

.mm-site-footer__oferteo {
  font-weight: 600;
}

.mm-site-footer__note {
  color: #8fa0b5;
  font-size: 0.88rem;
  margin-top: 0.4rem !important;
}

.mm-site-footer__bottom {
  align-items: center;
  border-top: 1px solid rgb(220 227 234 / 10%);
  color: #8fa0b5;
  display: flex;
  flex-wrap: wrap;
  font-size: 0.85rem;
  gap: 0.5rem 1.5rem;
  justify-content: space-between;
  padding: 1.1rem var(--mm-section-gutter);
}

.mm-site-footer__bottom a {
  color: #c9d3df;
}

@media (max-width: 1023px) {
  .mm-site-footer__inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mm-site-footer__brand {
    grid-column: 1 / -1;
  }
}

@media (max-width: 600px) {
  .mm-site-footer__inner {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.8rem;
  }
}

/* The call bar on phones: pinned to the bottom, out of the way when the hero button or the
   contact section is on screen, and gone while the photo viewer is open. */
.mm-call-bar {
  display: none;
}

@media (max-width: 700px) {
  .mm-site-footer__bottom {
    padding-bottom: calc(1.1rem + 66px + env(safe-area-inset-bottom));
  }

  .mm-call-bar {
    align-items: center;
    background: #f4c542;
    bottom: 0;
    box-shadow: 0 -10px 30px -18px rgb(0 0 0 / 55%);
    color: #101827;
    display: flex;
    gap: 0.8rem;
    left: 0;
    min-height: 66px;
    padding: 0.55rem 1.1rem calc(0.55rem + env(safe-area-inset-bottom));
    position: fixed;
    right: 0;
    text-decoration: none;
    transition: transform 220ms ease-out;
    z-index: 60;
  }

  .mm-call-bar.is-hidden,
  html.mm-lightbox-open .mm-call-bar {
    transform: translateY(110%);
  }

  .mm-call-bar svg {
    background: #101827;
    border-radius: 999px;
    box-sizing: content-box;
    fill: none;
    flex: none;
    height: 20px;
    padding: 0.6rem;
    stroke: #f4c542;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2;
    width: 20px;
  }

  .mm-call-bar__copy {
    display: grid;
    flex: 1;
    line-height: 1;
  }

  .mm-call-bar__label {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    margin-bottom: 0.25rem;
    text-transform: uppercase;
  }

  .mm-call-bar strong {
    font-family: "Barlow Semi Condensed", sans-serif;
    font-size: 1.5rem;
    font-weight: 800;
    letter-spacing: 0.01em;
  }

  .mm-call-bar__note {
    align-items: center;
    color: #101827;
    display: inline-flex;
    font-size: 0.82rem;
    font-weight: 700;
    gap: 0.4rem;
  }

  .mm-call-bar__note::before {
    background: #ef3f35;
    border-radius: 50%;
    box-shadow: 0 0 8px rgb(239 63 53 / 70%);
    content: "";
    height: 8px;
    width: 8px;
  }

  .mm-call-bar__note--zory { display: none; }
  body:has(.mm-zory-hero) .mm-call-bar__note--default { display: none; }
  body:has(.mm-zory-hero) .mm-call-bar__note--zory { display: inline-flex; }
  body:has(.mm-zory-hero) .mm-call-bar__note--zory::before {
    background: #315bff;
    box-shadow: none;
  }

  /* A page for planned work names its own note (service-page.js, data-mm-call-note). */
  .mm-call-bar__note--plan::before {
    background: #315bff;
    box-shadow: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mm-call-bar {
    transition: none;
  }
}
