/* =========================
   footer.css — подвал и его компоненты
   ========================= */

.footer{
  --f-bg: #2f2c36;
  --f-text: #e2b054;
  --f-accent: #f8d674;
  --f-muted: #a68c5e;
  --f-divider: #4661d6;
  --f-card-bg: #ffffff;
  --f-card-text: #222222;
  --muted: oklch(0.84 0.08 159.12);
  background-color: var(--f-bg);
  color: var(--f-text);
  font-family: Arial, system-ui, -apple-system, "Segoe UI", Roboto, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  font-size: 1.4rem;
  line-height: 1.5;
  user-select: none;
  padding: 3rem 1.5rem 1rem;
  border-top: 0.5rem solid var(--f-divider);
  transition: background-color .3s ease, color .3s ease;
}

/* Ссылки */
.footer a{
  color: inherit;
  text-decoration: none;
  transition: color .25s ease, background-color .25s ease, box-shadow .25s ease;
}
.footer a:hover,
.footer a:focus{ color: var(--f-accent); }
.footer a:focus-visible{
  outline: .2rem solid var(--f-accent);
  outline-offset: .2rem;
  border-radius: .4rem;
}

/* Лэйаут футера (объединено и исправлено) */
.footer-container.container{
  display: flex;
  flex-wrap: wrap;
  gap: 3rem;
  justify-content: space-between; /* валидно */
  align-items: flex-start;
}

/* Колонки навигации */
.footer-nav{
  display: flex;
  flex-wrap: wrap;
  gap: 3rem;
  flex: 1 1 60%;
  min-width: 26rem;
}
.footer-menu{
  list-style: none;
  padding: 0;
  margin: 0;
  min-width: 12rem;
}
.footer-menu__title{
  font-family: Montserrat, Arial, sans-serif;
  font-size: 2rem;
  font-weight: 600;
  line-height: 1.2;
  color: var(--f-accent);
  font-variant: small-caps;
  padding-bottom: 1.5rem;
}
.footer-menu li{ margin-bottom: .8rem; }
.footer-menu li:last-child{ margin-bottom: 0; }
.footer-menu li a{
  font-size: 1.2rem;
  color: oklch(0.94 0.06 158.83);
  text-decoration: none;
  transition: color .25s ease, background-color .25s ease, box-shadow .25s ease;
}

/* Контакты + рейтинг (правый блок) */
.footer-contacts{
  flex: 1 1 30%;
  min-width: 20rem;
  display: flex;
  flex-direction: column;
  gap: 2rem;
  align-items: flex-end;
}
.contacts-list{
  list-style: none;
  padding: 0;
  margin: 0;
  text-align: right;
}
.contacts-list li{ margin-bottom: .8rem; }
.contacts-list li:last-child{ margin-bottom: 0; }

.contacts-phone{
  font-weight: 400;
  font-size: 1.6rem;
  display: inline-block;
  color: var(--muted);
  text-decoration: none;
  transition: color .25s ease, background-color .25s ease, box-shadow .25s ease;
}

/* Кнопка «Заказать звонок» — БЕЗ изменения размеров на :hover */
.contacts-call-button{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 1.6rem;
  line-height: 1;
  color: #e6d2ac;
  cursor: pointer;
  user-select: none;
  padding: .5rem 1rem;                /* фикс. паддинги → без сдвигов */
  border-radius: .6rem;
  border: .2rem solid transparent;    /* резерв под "кольцо" фокуса */
  box-shadow: 0 0 0 0 rgba(110,168,254,0);
  transition: background-color .25s ease, color .25s ease, box-shadow .25s ease, transform .15s ease;
  will-change: transform;
  vertical-align: middle;
}
.contacts-call-button:hover,
.contacts-call-button:focus{
  background-color: #6ea8fe;
  color: #ffffff;
  /* Никаких изменений padding/бордера-ширины → без рефлоу */
  box-shadow: 0 0 0 .2rem rgba(110,168,254,.35);
}
.contacts-call-button:focus-visible{
  outline: none;
  box-shadow: 0 0 0 .2rem rgba(110,168,254,.5);
}
.contacts-call-button:active{
  transform: translateY(.1rem);       /* визуально, без влияния на поток */
}

/* Рейтинг */
.footer-rating{
  background: var(--f-card-bg);
  color: var(--f-card-text);
  padding: 1.5rem 2rem;
  border-radius: 1rem;
  width: 100%;
  max-width: 80rem;
  margin: 1rem 0 0;
  box-shadow: 0 0 0.75rem rgba(0,0,0,.1);
}
.rating-overall{
  display: flex;
  align-items: baseline;
  gap: .5rem;
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 1.25rem;
}
.rating-scale{ font-size: 1.25rem; color: #666; }
.rating-label{ margin-left: auto; font-weight: 500; font-size: 1rem; color: #444; }

.rating-categories{
  width: 100%;
  max-width: 100%;
  display: grid;
  gap: 1rem;
}
.rating-category{
  display: grid;
  grid-template-columns: minmax(10rem, 1fr) 1fr minmax(4rem, auto);
  align-items: center;
  gap: 1rem;
}
.category-name{ font-weight: 600; font-size: 1rem; }

.progress-bar{
  position: relative;
  height: 1.2rem;
  background: #eee;
  border-radius: .6rem;
  overflow: hidden;
}
.progress-fill{
  height: 100%;
  width: 0; /* анимируется к inline-width */
  border-radius: .6rem 0 0 .6rem;
  background: linear-gradient(90deg, #ffc107, #ff9800);
  transition: width 1.2s ease-out;
}
.category-score{ text-align: right; font-weight: 600; font-size: 1rem; }

/* Соцсети */
.footer-socials{
  display: flex;
  gap: 1.5rem;
  margin-top: .2rem;
}
.footer-socials .social-link img{
  width: 2.4rem;
  height: 2.4rem;
  transition: filter .3s ease, transform .2s ease;
}
.footer-socials .social-link:hover img,
.footer-socials .social-link:focus img{
  filter: brightness(1.25) contrast(1.05);
  transform: translateY(-.1rem);
}

/* Копирайт */
.footer-copyright{
  text-align: center;
  padding: 1rem 0 2rem;
  color: var(--f-muted);
  font-size: 1.2rem;
  user-select: none;
}

/* Адаптив футера */
@media (max-width: 64rem){
  .footer-nav{ flex: 1 1 100%; }
  .footer-contacts{
    flex: 1 1 100%;
    align-items: stretch;
  }
  .contacts-list{ text-align: left; }
  .rating-category{
    grid-template-columns: 1fr;
    gap: .6rem;
  }
  .category-score{ text-align: left; }
}

/* Предпочтение «меньше движений» */
@media (prefers-reduced-motion: reduce){
  .footer, .footer a, .contacts-call-button,
  .footer-socials .social-link img, .progress-fill{
    transition: none !important;
  }
}