.site-footer {
  width: var(--site-container);
  margin: 0 auto;
  border: 1px solid rgba(67, 52, 35, .08);
  border-radius: 18px;
  background: rgba(255, 253, 249, .78);
  color: var(--color-text-muted);
}
.site-footer__main {
  display: grid;
  grid-template-columns: 1.3fr .9fr 1.8fr 1.1fr;
  gap: 36px;
  padding: 40px 36px 20px;
}
.site-footer__brand img {
  display: block;
  width: 174px;
  height: auto;
}
.site-footer__brand p {
  margin: 16px 0;
  font-size: 12px;
  line-height: 1.45;
}
.site-footer__brand { display: flex; flex-direction: column; }
.site-footer__social {
  display: flex;
  gap: 8px;
  margin-top: auto;
  padding-top: 26px;
}
.site-footer .site-footer__social a {
  display: grid;
  place-items: center;
  width: 29px;
  height: 29px;
  border-radius: 50%;
  background: var(--color-brand);
  color: #edf4f0;
  text-decoration: none;
  transition: background-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}
.site-footer__social svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.25;
}
.site-footer__social a[aria-label="Telegram"] svg {
  transform: translate(-1px, 1px);
}
.site-footer .site-footer__social a:hover,
.site-footer .site-footer__social a:focus-visible {
  background: #1d725a;
  color: #fff;
  box-shadow: 0 5px 12px rgba(24, 93, 72, .22);
  transform: translateY(-2px) scale(1.06);
}
.site-footer .site-footer__social a:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
}
.site-footer__column {
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 12px;
  line-height: 1.35;
}
.site-footer__accordion summary {
  margin: 0 0 8px;
  color: var(--color-text);
  font-size: 13px;
  font-weight: 800;
  list-style: none;
}
.site-footer__accordion summary::-webkit-details-marker { display: none; }
.site-footer__accordion nav,
.site-footer__accordion > .site-footer__accordion-content > div {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
/* On larger screens, details retain their semantic mobile markup but behave as columns. */
.site-footer__accordion:not([open]) > :not(summary) { display: flex; }
.site-footer a {
  color: inherit;
  text-decoration: none;
}
.site-footer a:hover {
  color: var(--color-brand);
}
.site-footer__catalog-links {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 28px;
}
.site-footer__contacts {
  border-left: 0;
  padding-left: 0;
  position: relative;
  left: -110px;
}
.site-footer__contacts > div { gap: 8px; }
.site-footer__contacts a { overflow-wrap: anywhere; }
.site-footer__legal {
  display: grid;
  grid-template-columns: minmax(160px, .72fr) minmax(0, 3fr);
  gap: 24px;
  align-items: start;
  margin: 0 36px;
  padding: 16px 0;
  border-top: 1px solid rgba(67, 52, 35, .08);
  color: var(--color-text-muted);
  font-size: 11px;
  line-height: 1.45;
}
.site-footer__legal-title {
  margin: 0;
  color: var(--color-text);
  font-size: 12px;
  font-weight: 800;
}
.site-footer__legal-details {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 13px;
}
.site-footer__legal-details span:not(:last-child)::after {
  margin-left: 13px;
  color: rgba(67, 52, 35, .3);
  content: "•";
}
.site-footer__legal-details strong { color: var(--color-text); }
@media (min-width: 641px) {
  .site-footer__accordion > .site-footer__accordion-content { display:block !important; }
  .site-footer__contacts > .site-footer__accordion-content > div { display:flex; flex-direction:column; gap:8px; }
}
.site-footer__bottom {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding: 17px 36px;
  border-top: 1px solid rgba(67, 52, 35, .08);
  font-size: 11px;
}
.site-footer__bottom > span:last-child {
  display: flex;
  gap: 28px;
}
@media (max-width: 900px) {
  .site-footer__main {
    grid-template-columns: 1.15fr .8fr 1.6fr 1fr;
    gap: 24px;
    padding: 34px 32px 28px;
  }
  .site-footer__contacts {
    border-left: 0;
    padding-left: 0;
    left: auto;
  }
  .site-footer__legal { margin: 0 32px; }
}
@media (max-width: 640px) {
  .site-footer {
    width: var(--site-container);
    margin-bottom: 12px;
    border-radius: 14px;
    text-align: left;
  }
  .site-footer__main {
    grid-template-columns: 1fr;
    gap: 18px;
    padding: 28px 28px 18px;
  }
  .site-footer__brand { display: flex; flex-direction: column; align-items: flex-start; }
  .site-footer__brand img { width: 164px; }
  .site-footer__brand p { margin: 15px 0 13px; font-size: 11px; }
  .site-footer__social { gap: 10px; }
  .site-footer .site-footer__social a { width: 31px; height: 31px; }
  .site-footer__accordion {
    width: 100%;
    gap: 0;
    border-top: 1px solid rgba(67, 52, 35, .1);
    padding-top: 13px;
    text-align: left;
  }
  .site-footer__accordion summary {
    position: relative;
    margin: 0;
    padding-right: 25px;
    cursor: pointer;
    font-size: 13px;
  }
  .site-footer__accordion summary::after {
    position: absolute;
    top: 4px;
    right: 2px;
    width: 7px;
    height: 7px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    content: "";
    transform: rotate(45deg);
    transition: top 180ms ease, transform 180ms ease;
  }
  .site-footer__accordion[open] summary::after { transform: rotate(225deg); top: 8px; }
  .site-footer__accordion.is-collapsing summary::after { transform: rotate(45deg); top: 4px; }
  .site-footer__accordion-content {
    display: grid;
    grid-template-rows: 1fr;
    min-height: 0;
    transition: height 320ms cubic-bezier(.16, 1, .3, 1);
  }
  .site-footer__accordion:not([open]) > .site-footer__accordion-content { display: none; }
  .site-footer__accordion-content > * { min-height: 0; overflow: hidden; }
  .site-footer__accordion.is-opening > .site-footer__accordion-content,
  .site-footer__accordion.is-collapsing > .site-footer__accordion-content { overflow: hidden; }
  .site-footer__accordion nav,
  .site-footer__accordion > .site-footer__accordion-content > div {
    gap: 9px;
    padding-top: 15px;
    font-size: 12px;
    transition: padding-top 320ms cubic-bezier(.16, 1, .3, 1);
  }
  .site-footer__contacts > .site-footer__accordion-content > div { display: flex !important; }
  .site-footer__catalog-links { grid-template-columns: 1fr 1fr; }
  .site-footer__contacts { border-left: 0; padding-left: 0; }
  .site-footer__contacts > div a,
  .site-footer__contacts > div span { position: relative; padding-left: 25px; }
  .site-footer__contacts > div a::before,
  .site-footer__contacts > div span::before { position: absolute; left: 3px; color: var(--color-brand); font-size: 14px; }
  .site-footer__contacts > div a[href^="tel"]::before { content: "⌕"; }
  .site-footer__contacts > div span:nth-child(2)::before { content: "⌖"; }
  .site-footer__contacts > div a[href^="mailto"]::before { content: "✉"; }
  .site-footer__contacts > div span:last-child::before { content: "◷"; }
  .site-footer__legal {
    grid-template-columns: 1fr;
    gap: 7px;
    margin: 0 28px;
    padding: 15px 0;
    font-size: 10px;
  }
  .site-footer__legal-title { font-size: 11px; }
  .site-footer__legal-details {
    display: grid;
    gap: 4px;
  }
  .site-footer__legal-details span:not(:last-child)::after { display: none; }
  .site-footer__catalog-links {
    grid-template-columns: 1fr 1fr;
  }
  .site-footer__bottom {
    align-items: flex-start;
    flex-direction: column;
    gap: 13px;
    padding: 16px 28px 18px;
    font-size: 10px;
  }
  .site-footer__bottom > span:last-child {
    align-items: flex-start;
    flex-direction: column;
    gap: 7px;
  }
}