@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap");
*,
*:before,
*:after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  outline: none;
}

body,
html {
  width: 100%;
  height: 100%;
  min-width: 320px;
}

body {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 16px;
  line-height: normal;
  background-color: #f2f2f2;
  color: #44474e;
}

.container {
  max-width: 1170px;
  margin: auto;
}

a {
  color: #FFB200;
  transition: color 0.3s;
}

a:hover {
  color: #44474e;
}

.svg-icons {
  display: none;
}

.main {
  margin-top: 15px;
}

.main .container {
  display: flex;
  gap: 20px;
}

.sidebar {
  width: 250px;
}

.content {
  width: calc(100% - 270px);
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.content h1 {
  order: -1;
}

footer {
  margin-top: 20px;
  padding-top: 20px;
  padding-bottom: 20px;
}

.text-name {
  margin-top: 40px;
  margin-bottom: 20px;
  font-size: 30px;
}
.text-desc {
  margin-top: 10px;
  margin-bottom: 10px;
  font-size: 16px;
}

:root {
  --navy:#0F2B46; /* базовый цвет логотипа */
  --amber:#FFB200; /* акцент при hover */
  --bg:#F5F7FA;
}

.header {
  background: #fff;
}
.header .container {
  display: flex;
  align-items: center;
  gap: 30px;
}
.header__logo {
  height: 80px;
  width: auto;
  display: flex;
  align-items: center;
  /* ЛОГОТИП */
  /* Поворот ровно на -45° только в состоянии hover */
  /* Перекраска на hover */
  /* Геометрия штрихов */
}
.header__logo a {
  display: flex;
  gap: 15px;
  text-decoration: none;
  align-items: center;
  color: #44474e;
}
.header__logo a:hover {
  color: #FFB200;
}
.header__logo svg {
  display: block;
  width: 40px;
  height: auto;
  color: var(--navy);
  transition: color 0.2s ease;
}
.header__logo svg * {
  stroke: currentColor;
}
.header__logo #root {
  transform-box: fill-box;
  transform-origin: 134px 133.27px; /* твои координаты центра */
  transition: transform 0.3s ease-out; /* плавный поворот туда/обратно */
}
.header__logo a:hover #root {
  transform: rotate(-60deg);
}
.header__logo a:hover .logo {
  color: var(--amber);
}
.header__logo .bristles path {
  stroke-linecap: round;
  stroke-width: 6;
}
.header__logo .ring path {
  stroke-width: 18;
}
.header__logo .right {
  display: block;
}
.header__logo .name {
  display: block;
  text-transform: uppercase;
  font-size: 16px;
  font-weight: bold;
}
.header__logo .desc {
  display: block;
  font-size: 14px;
}
.header__menu {
  flex-grow: 1;
  display: flex;
  justify-content: center;
  align-items: center;
}
.header__contacts {
  display: flex;
  gap: 15px;
  justify-content: flex-end;
}
.header__social {
  display: flex;
  align-items: center;
  gap: 10px;
}
.header__social a {
  display: block;
}
.header__social svg {
  display: block;
}
.header__phone a {
  display: block;
  color: #44474e;
  text-decoration: none;
  font-size: 20px;
  line-height: normal;
}
.header__phone a:hover {
  color: #FFB200;
}

.menu-top ul {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  max-width: 1300px;
  margin: auto;
}
.menu-top li {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  height: 80px;
}
.menu-top a {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  text-align: center;
  text-decoration: none;
  color: #44474e;
  font-size: 14px;
}
.menu-top a:hover {
  color: #FFB200;
}

.main-catalog__list {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}
.main-catalog__item {
  width: calc(33.33333333% - 13.3333333333px);
}
.main-catalog__item a {
  display: block;
  text-decoration: none;
  height: 100%;
  transition: color 0.3s;
  color: #44474e;
}
.main-catalog__item a:hover {
  color: #FFB200;
}
.main-catalog__img {
  display: block;
  width: 100%;
  aspect-ratio: 1/1;
  border-radius: 20px;
  overflow: hidden;
  background: #fff;
}
.main-catalog a:hover .main-catalog__img {
  transition: box-shadow 0.3s, color 0.3s;
  box-shadow: 0px 0px 11px 0px rgba(65, 65, 65, 0.3);
}
.main-catalog__img img {
  display: block;
  max-width: none;
  max-height: none;
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.main-catalog__name {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-size: 20px;
  padding: 20px 20px 30px;
}

.menu-catalog__name {
  font-weight: bold;
  margin-top: 10px;
  margin-bottom: 10px;
}
.menu-catalog ul {
  display: flex;
  flex-direction: column;
  gap: 5px;
  font-size: 16px;
}
.menu-catalog li {
  display: block;
}
.menu-catalog ul ul {
  padding-left: 10px;
  font-size: 14px;
}
.menu-catalog a {
  text-decoration: none;
}

.breadcrumbs {
  display: flex;
  order: -2;
}
.breadcrumbs__item {
  display: block;
}
.breadcrumbs__item + li:before {
  content: "/";
  padding: 0 5px;
  color: #ccc;
}

.smart-filter {
  margin-bottom: 0;
  font-size: 12px;
}
.smart-filter .smart-filter-parameters-box-title, .smart-filter .smart-filter-checkbox-text, .smart-filter .smart-filter-dropdown-text {
  font-size: 12px;
  line-height: 12px;
}
.smart-filter .form-group {
  display: flex;
  align-items: center;
  gap: 3px;
  margin-bottom: 3px;
}
.smart-filter .form-group input {
  width: 13px;
}
.smart-filter .form-group label {
  width: calc(100% - 16px);
}
.smart-filter .smart-filter-angle-up {
  display: none;
}
.smart-filter__blocks {
  display: flex;
  gap: 15px;
}
.smart-filter input:disabled + label {
  color: #ccc;
}

.catalog-section__desc {
  margin-top: 10px;
  margin-bottom: 10px;
}
.catalog-section__items {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.catalog-section__item a {
  display: flex;
  text-decoration: none;
  gap: 15px;
}
.catalog-section__image {
  width: 200px;
  height: 200px;
  border-radius: 15px;
  overflow: hidden;
  box-shadow: 0 5px 30px rgba(34, 34, 34, 0.1);
}
.catalog-section__image img {
  max-width: none;
  max-height: none;
  object-fit: contain;
  width: 100%;
  height: 100%;
}
.catalog-section__right {
  display: block;
  width: calc(100% - 215px);
}
.catalog-section__item-name {
  display: block;
  color: #000;
  font-size: 18px;
  font-weight: bold;
}
.catalog-section__item-desc {
  display: block;
  margin-top: 10px;
  color: #000;
}
.catalog-section__item-properties {
  display: flex;
  flex-direction: column;
  margin-top: 10px;
}
.catalog-section__item-property {
  display: block;
}
.catalog-section__price {
  display: block;
  margin-top: 10px;
}
.catalog-section__more {
  display: block;
  margin-top: 10px;
}

/*# sourceMappingURL=style.css.map */
