* { scroll-behavior: smooth; }
img {
	max-width: 100%;
}
body, html {
	overflow-x:hidden;
	font-weight:200;
}
/* HEADER */
heder a {color: #000}
heder a:hover {text-decoration: none;color: #f9238c}
@media (min-width: 992px) {
  .container {
	  width:100%;
	  max-width:1920px;
	  padding:0 3vw;
	  }
}
.nav .open>a, .nav .open>a:focus, .nav .open>a:hover {
    background-color: #0e0e0e;
    border-color: #0e0e0e;
	opacity: 0.7; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70); -moz-opacity: 0.7; -khtml-opacity: 0.7;
}

.grid-header {
  display: grid;
  gap: 2vw;
  grid-template-columns: 
    auto /* 1-я ячейка по ширине содержимого */
    auto /* 2-я ячейка по ширине содержимого */
    auto /* 3-я ячейка по ширине содержимого */
    minmax(150px, 1fr)  /* 4-я ячейка занимает всё оставшееся место */
    auto /* 5-я ячейка по ширине содержимого */
    auto; /* 6-я ячейка по ширине содержимого */
  grid-auto-rows: 90px;
  align-items: center;
  font-size: 12px;
  width: 100%; /* сетка растягивается на всю ширину контейнера */
  grid-auto-flow: row; /* перенос строк при нехватке места */
}

/* Убираем grid-area, чтобы элементы автоматически распределялись */
.grid-1, .grid-2, .grid-3, .grid-4, .grid-5, .grid-6 {
  justify-self: stretch;
  align-self: center;
  text-align: center;
}

/* Для логотипа можно сделать выравнивание по левому краю */
@media (max-width: 768px) {
	.grid-1 {
	  text-align: left;
	}
}
@media (max-width: 768px) {
	.img-responsive {
		display: block;
		margin: auto;
	}
}
/* Для поиска можно увеличить min-width, если нужно */
.grid-4 {
  text-align:left;
}
@media (min-width: 1200px) {
	.grid-4 {

	}
}
#search {
	min-width:100%;
	max-width:100%;
}
/* Для мобильных устройств — элементы в столбик */
@media (max-width: 768px) {
	.grid-header {
	  display: grid;
	  grid-template-columns: 1fr 1fr; /* Две колонки одинаковой ширины */
	  grid-template-rows:
		auto    /* для grid-1 */
		auto    /* для grid-2 и grid-3 */
		auto    /* для grid-4 */
		auto;   /* для grid-5 и grid-6 */
	  gap: 10px 20px; /* отступы между рядами и колонками */

	}

	/* Элемент grid-1 занимает всю ширину первой строки */
	.grid-1 {
	  grid-column: 1 / -1; /* занимает с 1-й по последнюю колонку */
	  grid-row: 1;
	}

	/* Элементы grid-2 и grid-3 занимают по одному столбцу во второй строке */
	.grid-2 {
	  grid-column: 1;
	  grid-row: 2;
	}

	.grid-3 {
	  grid-column: 2;
	  grid-row: 2;
	}

	/* Элемент grid-4 занимает всю ширину третьей строки */
	.grid-4 {
	  grid-column: 1 / -1;
	  grid-row: 3;
	  padding:20px 10vw;
	}

	/* Элементы grid-5 и grid-6 занимают по одному столбцу в четвёртой строке */
	.grid-5 {
	  grid-column: 1;
	  grid-row: 4;
	}

	.grid-6 {
	  grid-column: 2;
	  grid-row: 4;
	}
	.grid-2, .grid-3, .grid-5, .grid-6 {
		padding:5px 5vw;
	}
}

.subzag {
  font-size: 10px;
  padding: 10px 0;
}
@media (min-width:1200px) {
	.subzag {
	  white-space: nowrap;
	}
}
@media (max-width: 768px) {
	.subzag {
		display: block;
		margin: auto;
		text-align:center;
		font-size: 17px;
		max-width:70%;
	}
}
.mainmenu {background:#000; padding:10px; white-space: nowrap; border-radius:4px; color:#fff;}
.mainmenu:hover {color:#f9238c;}
.mainmenu img {padding-right: 10px}
.akciy {color:#f9238c}
.akciy img {padding-right: 5px; white-space:nowrap;}
.wishlist img {padding-right: 5px; white-space:nowrap;}
.wishlist {padding-right: 5px; text-align:center; color:#0e0e0e}
.wishlist:hover {padding-right: 5px; text-align:center; color:#f9238c}
.wishlist img {padding-right: 5px}
.profil {padding-right: 5px; text-align:center; color:#0e0e0e}
.profil:hover {padding-right: 5px; text-align:center; color: #f9238c}
.profil img {padding-right: 5px}


/*Слайдер*/
.slider-style-text-1 {padding:1rem; font-size:1rem; background:#2b2b2b;color:#fff}
.slider-style-text-2 {font-size:3rem;color:#fff;font-weight:1000}
.slider-style-text-3 {font-size:1.5rem;color:#fff}
.slider-style-text-4 {padding:1rem 2rem; font-size:1.7rem;color:#fff;border:1px solid #fff !important;border-radius:0.4rem;transition: .2s ease-out; transition-delay: 0.05s}
.slider-style-text-4:hover {color:#ccc;border:1px solid #f9238c !important;transition: .2s ease-out; transition-delay: 0.05s}

/*Категории на главной*/
.kategotymain {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    grid-auto-rows: auto auto;
    gap: 20px;
    align-items: stretch;
	justify-items: stretch;
	margin:40px auto;
}

.kategotymain_ino {
    padding: 10px;
    text-decoration: none;
    color: #0e0e0e;
    border-radius: 8px;
    transition: transform 0.3s;
	background:#f5f5f7;
	text-align:center;
}

.kategotymain_ino:hover {
    transform: scale(1.02);
}
.kategotymain_ino img {
		width: auto;
		height: 100px;
		border-radius: 8px;
		margin-bottom: 15px;
}
@media (min-width: 1200px) {
	.kategotymain_ino img {
		width: auto;
		height: 120px;
		border-radius: 8px;
		margin-bottom: 15px;
	}
}
.kategotymain_ino h3 {
    margin: 1rem auto 0 auto;
    font-size: 1rem;
	height:30px;
	text-align:left;
	padding-left:1rem;
}

.double {
    grid-column: span 2;
}
@media (max-width: 998px) {
  .double {
    grid-column: span 1 !important; /* На узких экранах превращаем в 1 колонку */ 
  }
}
/*FOOTER*/
footer {font-size:0.9rem;line-height:1.5}
.servisnyy-centr {padding:0.7rem 1rem; border:1px solid #ccc; border-radius:0.4rem; display:inline-block; margin-top:0.7rem}
.servisnyy-centr:hover {padding:0.7rem 1rem; border:1px solid #f9238c; border-radius:0.4rem; display:inline-block; margin-top:0.7rem; transition: .4s ease-out; transition-delay: 0.05s;}
.phonefooter a {font-size:1.5rem; font-weight:bold; color:#fff}
.vremya {color:#878787; font-size:0.8rem; padding-bottom: 1rem}
.chat {opacity: 0.6; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70); -moz-opacity: 0.6; -khtml-opacity: 0.6; margin-right:0.5rem}
.chat:hover {opacity: 1; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; transition: .4s ease-out; transition-delay: 0.05s;}

/*Обратный звонок*/
#callback-box .modal-title {
	font-size: 28px;
	text-transform:uppercase;
	font-weight:200;
	color:#f9238c;
}

/*Подкатегории настройка внешнего вида*/
.child_category {
    font-size: 1rem;
    border: 1px solid #f9238c;
    border-radius: 0.1rem;
    transition: .2s ease-out;
    transition-delay: 0.05s;
	line-height:1.1;
	display:flex;
	min-height: 3rem; /* или любое другое значение высоты */
    align-items: center; /* выравнивание по вертикали */
    justify-content: center; /* выравнивание по горизонтали */
	text-align:center;
	margin: 15px 0;
	color:#555;
	font-weight:200;
}
.child_category:hover {
	color:#fff;
	background: #f9238c;
	transition: .2s ease-out;
    transition-delay: 0.05s;
}
.child_category_min {
	
}
.child_category_max {
	
}
/*Сервисный центр форма*/
#form-creator-77 {
	display:block;
	max-width:600px;
	margin:40px auto;
	padding:20px;
	border-radius:4px;
	border:1px solid #f9238c;
}

/* Витринные образцы описание */
.product-description h3 {
  font-size: 18px;
  margin: 15px 0 10px 0;
  color: #000;
}

.product-description ul {
  padding-left: 20px;
  margin: 0 0 15px 0;
}

.product-description ul.advantages {
  list-style-type: none;
  padding-left: 0;
}

.product-description ul.advantages li {
  position: relative;
  padding-left: 25px;
  margin-bottom: 8px;
}

.product-description ul.advantages li:before {
  content: "✓";
  color: #27ae60;
  position: absolute;
  left: 0;
  font-weight: bold;
}
/*Галерея Новинки*/
.text-gallery {
	width:80%;
	margin: 0 10%;
	min-height:110px;
	font-size:19px;
}
