/*
Theme Name: Law Factory Дочерняя тема
Theme URI: https://goodwinpress.ru/tema-law-factory
Author: Goodwin
Author URI: https://goodwinpress.ru/
Description: Свежая адаптивная тема для адвокатского сайта. Красивый шаблон для презентации юриста и его услуг в сети. Статическая главная с готовыми разделами, архив услуг, отдельные страницы для услуг, блог, сбор контактов. Микроразметка. Отложенная загрузка изображений, поп-апы, встроенный виджет, svg иконки. Дополнительные шаблоны страниц для контактов и страницы Спасибо. Липкое меню, липкий сайдбар, хлебные крошки. Автоматическое обновление темы из админки. Тема оптимизирована, топ в Google PageSpeed. Готова к локализации.
Template: lawfactory
*/

/* * * * * * * * * * *  Размещайте ваши стили  под этой строкой  * * * * * * * * * *  */ 

.tg-item::before {
  content: '';
  position: absolute;
  top: -15px;
  left: 22px;
  width: 52px;
  height: 52px;
  background-image: url("img/telegram.svg");
  background-size: 28px 28px;
  background-repeat: no-repeat;
  background-position: center center;
  border-radius: 50%;
  line-height: 52px
}

.benefits-container {
  margin-bottom: 100px
}
 

.benefit-item:before {
  display: none;
}

.benefit-item {
  text-align: center;
}

.benefit-item__icon {
  display: inline-block;
  width: 42px;
  margin: 0 auto 2px;
  aspect-ratio: 1;
}

.page-template-default .type-page {
  margin-bottom: 40px;
}


.values-container {
  margin-bottom: 100px;
}


.values-list {
  display: grid;
  gap: 32px;
  grid-template-columns: repeat(5, 1fr);
}

@media (max-width: 1200px) {
  .values-list {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 680px) {
  .values-list {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 450px) {
  .values-list {
   display: block;
   margin-inline: auto;
  }

  .values-list > * + *  {
      margin-top: 30px;
   }
}

.values-list__item {
  padding: 20px;
  border-radius: 6px;
  font-size: 17px;
  text-align: center;
  color: #fff;
  background-color: #537EC5;
}

@media (max-width: 1024px) {
  .values-list__item {
    padding: 15px;
    font-size: 16px;
  }
}
 
.values-list__number {
  display: block;
  padding: 10px 0;
  font-size: 62px;
  font-weight: 700;
  line-height: 1;
}

@media (max-width: 1024px) {
  .values-list__number {
    font-size: 52px;
  }
}

@media (max-width: 450px) {
  .values-list__number {
    font-size: 42px;
  }
}

.values-list__descr {
  margin: 0;
  line-height: 140%;
}


.rekvisit-box {
  max-width: 370px;
  position: relative;
  margin: 25px 0;
  padding: 25px;
  line-height: 140%;
  background-color: #f7f6fb;
  border-radius: 6px;
  transition: color 0.3s, background-color 0.3s;
}

.rekvisit-box:hover {
  color: #fff;
  background-color: #e2574c;
}

.rekvisit-box__content {
  display: grid;
  gap: 32px;
  grid-template-columns: 44px 1fr;
  align-items: center;
}

.rekvisit-box__link {
 position: absolute;
 inset: 0;
 z-index: 1;
}

.services-list {
  display: grid;
  gap: 40px;
  grid-template-columns: repeat(2, 1fr);
  max-width: 1024px;
  margin-inline: auto;
}


.services-list__item {
  width: 100%;
  margin: 0 !important;
  display: flex;
  align-items: center;
}

@media (max-width: 700px) {
  .services-list {
    display: block;
  }

  .services-list > * + * {
    margin-top: 30px !important;
  }
}


/* .shablon-box {
  display: grid;
  gap: 50px;
  padding: 20px;
  grid-template-columns: repeat(auto-fit,minmax(223px,1fr));
  border: 1px solid #537EC5;
  align-items: center;
  border-radius: 6px;
} */


.shablon-box {
  display: inline-block;
  width: 30%;
  min-width: 370px;
  margin-bottom: 30px;
  padding: 20px;
  border: 1px solid #537EC5;
  border-radius: 6px;
  transition: background-color 0.3s;
}

.shablon-box:not(:last-child) {
  margin-right: 3%;
}

@media (max-width: 1242px) {
  .shablon-box {
    min-width: 340px;
  }
}

@media (max-width: 1024px) {
  .shablon-box {
    width: 100%;
  }
  
  .shablon-box:not(:last-child) {
    margin-right: 0;
  }
}

.shablon-box:hover {
  background-color: #f7f6fb;
}

.shablon-box__item {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.shablon-box__icon {
  width: 90px;
  aspect-ratio: 1;
  margin-bottom: 10px;
  transition: transform 0.3s;
}

.shablon-box:hover .shablon-box__icon {
  transform: scaleX(-1);
  transition: transform 0.3s;
}

.shablon-box__text {
  line-height: 140%;
  text-align: center;
}

.shablon-box__item:hover .shablon-box__text {
  color: #537EC5;
}

.shablon-box__link {
  position: absolute;
  inset: 0;
  z-index: 1;
 }