/* v.512 — compact footer and unified white outlines for site controls. */
.footer {
  min-height: 0 !important;
  height: auto !important;
  padding: 0 !important;
}

.footer__top {
  padding: 14px 0 !important;
}

.footer__main,
.footer__container {
  min-height: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.footer__row {
  display: grid !important;
  grid-template-columns: 104px max-content minmax(310px, 1fr) minmax(300px, 1fr) !important;
  grid-template-rows: repeat(3, minmax(34px, auto)) !important;
  grid-template-areas:
    "avatar label mail copy"
    "avatar label phone social"
    "avatar label site social" !important;
  align-items: center !important;
  column-gap: 16px !important;
  row-gap: 6px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 86px 0 0 !important;
}

.footer .avatar {
  grid-area: avatar !important;
  width: 100px !important;
  height: 100px !important;
  margin: 0 !important;
}

.footer .avatar img {
  width: 100px !important;
  height: 100px !important;
  object-fit: cover !important;
}

.footer__label {
  grid-area: label !important;
  align-self: start !important;
  margin: 2px 0 0 !important;
  padding: 0 !important;
  white-space: nowrap !important;
}

.footer__contacts,
.contacts-footer {
  display: contents !important;
}

.contacts-footer__item {
  min-height: 34px !important;
  margin: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  line-height: 34px !important;
  white-space: nowrap !important;
}

.contacts-footer__item:nth-child(1) { grid-area: mail !important; }
.contacts-footer__item:nth-child(2) { grid-area: phone !important; }
.contacts-footer__item:nth-child(3) { grid-area: site !important; }

.footer__bottom,
.footer__bottom .footer__container {
  display: contents !important;
}

.footer__copy {
  grid-area: copy !important;
  align-self: center !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.45 !important;
  text-align: left !important;
}

.footer__social,
.footer .social {
  grid-area: social !important;
  align-self: center !important;
  justify-self: start !important;
  margin: 0 !important;
  padding: 0 !important;
}

@media (max-width: 900px) {
  .footer__row {
    grid-template-columns: 104px max-content minmax(220px, 1fr) !important;
    grid-template-rows: repeat(4, minmax(28px, auto)) !important;
    grid-template-areas:
      "avatar label mail"
      "avatar label phone"
      "avatar label site"
      "copy copy copy" !important;
    padding-right: 70px !important;
  }

  .footer__social,
  .footer .social {
    display: none !important;
  }
}

@media (max-width: 620px) {
  .footer__top {
    padding: 10px 0 !important;
  }

  .footer__row {
    grid-template-columns: 100px minmax(0, 1fr) !important;
    grid-template-rows: repeat(5, minmax(24px, auto)) !important;
    grid-template-areas:
      "avatar label"
      "avatar mail"
      "avatar phone"
      "avatar site"
      "copy copy" !important;
    column-gap: 10px !important;
    padding-right: 52px !important;
  }

  .contacts-footer__item {
    min-height: 26px !important;
    line-height: 26px !important;
    white-space: normal !important;
  }

  .footer__copy {
    font-size: 12px !important;
    line-height: 1.3 !important;
  }
}

/* Contact markers: keep the original circles fully visible and separate rows. */
.contacts-footer__item {
  overflow: visible !important;
  padding-left: 38px !important;
  background-position: left center !important;
  background-size: 120px 30px !important;
  background-clip: border-box !important;
}

/* Match the white outline of the Sound control on every site page. */
html body .quick-nav-trigger,
html body .site-search-trigger,
html body .grafo-music-button,
html body #upbutton,
html body #downbutton {
  box-sizing: border-box !important;
  border-width: 2px !important;
  border-style: solid !important;
  border-color: rgba(255, 255, 255, .92) !important;
}

#upbutton,
#downbutton {
  border-radius: 999px !important;
  background: rgba(14, 95, 95, .28) !important;
}
