/* max-width: 1100px */

@media (max-width: 1100px) {
	
	.gallery-container {
		grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
		gap: 20px;
	}

	.gallery-preview img {
		width: 100%;
		height: auto;
	}

	#allcontent {

		padding: 10rem 0.625rem 2.5rem;

	}

	#center_footer, #contacts, #about_company {
		padding: 1.25rem 0.625rem 0;
	}

	.slider .nav {

	display: none;
	}

}
/* max-width: 1099px and min-width: 901px */

@media (max-width: 1099px) and (min-width: 901px) {
	
	.slider {
	flex: 1 1 52%;
	}

	.depatments {
	flex: 1 1 48%;
	}

	.slider-section {
	flex-wrap: nowrap;
	align-items: flex-start;
	max-width: 100%;
	}
}

/* max-width: 1024px */

@media (max-width: 1024px) {
  
	#main_menu ul {
	display: flex;
	gap: 20px;
	list-style: none;
	font-size: 1.25rem;
	font-family: 'texgyreheroscn_regular';
	text-transform: uppercase;
	}


	#about_company {
	flex: 1 1 100%;
	max-width: 100%;
	}

	#center_footer,
	#contacts {
	flex: 1 1 45%;
	max-width: 100%;
	}

	#blog {
	flex-wrap: wrap;
	flex-direction: row;
	align-items: flex-start;
	}

	#blog .text_wrap {
	padding-left: 0;
	flex: 1 1 65%;
	}

	#blog .text_wrap .texts p {
	font-size: 1.125rem;
	line-height: 1.4rem;
	line-height: 1.6875rem;
	}


	#blog .images {
	width: 225px;
	height: auto;
	}

	#blog .add_date,
	#blog .blog_title {
	float: none;
	width: 100%;
	}

	#blog .blog_title {
	font-size: 1.875rem;
	}
}

/* max-width: 900px */

@media (max-width: 900px) {
	
	#header_manu.shrink {
	height: 120px !important;
	background-size: contain;
	}

	#header_manu.shrink #logo a {
	height: 120px !important;
	}

	#header_manu.shrink #main_menu {
	height: auto !important;
	}


	#header {
	height: auto !important;
	}

	.menu-toggle {
	display: block;
	position: absolute;
	width: 60px;
	height: 60px;
	background-image: url(/templates/sunwell/images/toggle_menu.png);
	background-repeat: no-repeat;
	right: 20px;
	top: 60px;
	z-index: 1001;
	border: none;
	}

	#main_menu {
	display: none;
	flex-direction: column;
	align-items: center;
	position: absolute;
	top: 100%; /* сразу под хедером */
	left: 0;
	width: 100%;
	background-color: white;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	z-index: 1000;
	}

	#main_menu.open {
	display: flex;
	}

	#main_menu ul {
	flex-direction: column;
	gap: 1.5rem;
	padding: 1.5rem 0;
	margin: 0;
	list-style: none;
	}

	#main_menu ul li {
	text-align: center;
	margin: 0;
	padding: 0;
	}

	#main_menu ul li a {
	font-size: 1.25rem;
	color: #303030;
	text-decoration: none;
	}

	#main_menu ul li a:hover {
	color: #ff6600;
	}

	.slider-section {
	flex-direction: column;
	align-items: stretch; 
	}

	.slider {

	}

	.slider {
	width: 100%;
	max-width: 100%;
	aspect-ratio: 15 / 8;
	width: 100%;
	height: auto;
	}

	.slider ul li {
	width: 100% !important; /* ключевой момент */
	height: auto;
	aspect-ratio: 15 / 8;
	display: none;
	}

	.slider ul li.active {
	display: block;
	}

	.stamp_area {
	top: 60%;
	left: 0;
	}

	.depatments {
	flex: 0 0 auto;       /* grow 0, shrink 0, basis auto */
	width: 100%;
	height: 300px !important;
	overflow: hidden;     /* чтобы внутренности не раздували визуально */
	background: #226B95;
	}
	
  
}

/* max-width: 768px */

@media (max-width: 768px) {


	#header_info .wrapping .contact_phone:nth-of-type(3) {
	display: none;
	}

	#footer_wrap {
	flex-direction: column;
	align-items: stretch;
	}

	#about_company,
	#center_footer,
	#contacts {
	max-width: 100%;
	flex: 1 1 100%;
	padding: 1.25rem 0.625rem 0;
	}

	#blog {
	flex-direction: column;
	align-items: flex-start;
	}

	#blog .images {
	width: 100%;
	height: auto;
	}

	#blog .text_wrap {
	padding-left: 0;
	}

	#blog .text_wrap .texts p {
	font-size: 1.125rem;
	line-height: 1.4rem;
	line-height: 1.6875rem;
	}

	#blog .blog_title {
	font-size: 1.875rem;
	}


	#blog .add_date {
	font-size: 1rem;
	}
	
    .contact-wrap{ display:block !important; }

    .contact-wrap > .social,
    .contact-wrap > .message_form{
    flex:none !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    margin:20px 0 0 !important;
    box-sizing:border-box;
    }

  .contact-wrap > .message_form{ margin-left:0 !important; }
  
  .goverlay{ background: rgba(0,0,0,.92) !important; } /* вместо #000 */
  .glightbox-container .gslide-title,
	.glightbox-container .gslide-desc{
  color:#fff !important;
  text-shadow:
    0 2px 2px rgba(0,0,0,.6),
    0 6px 16px rgba(0,0,0,.6),
    0 0 1px rgba(0,0,0,.9) !important;
}

/* Фулл-вайд бар подписи у нижнего края */
.glightbox-container .gslide-description{
  position:absolute !important;
  left:0 !important; right:0 !important; bottom:0 !important;
  width:100% !important; max-width:100% !important; margin:0 !important;

  /* мягкий градиент, чтобы текст читался и на светлых фото */
  background:linear-gradient(to top,
              rgba(0,0,0,.65) 0%,
              rgba(0,0,0,.35) 60%,
              rgba(0,0,0,0) 100%) !important;

  padding:14px 16px calc(14px + env(safe-area-inset-bottom)) !important;
  color:#fff !important;
  max-height:none !important; height:auto !important; overflow:visible !important;
  z-index:99998; /* ниже стрелок (у них 99999), но поверх картинки */
}

/* Контейнер текста по центру строки, без лишнего фона */
.glightbox-container .gdesc-inner{
  max-width:min(1100px, 96vw);
  margin:0 auto;
  padding:0 !important;
  background:transparent !important;
}

/* Белый текст + твоя тень сохранится */
.glightbox-container .gslide-title,
.glightbox-container .gslide-desc,
.glightbox-container .gslide-desc *{
  color:#fff !important;
}

/* Переопределяем «мобильные» правила glightbox */
.glightbox-mobile .glightbox-container .gslide-description{
  position:absolute !important;
  left:0 !important; right:0 !important; bottom:0 !important;
  width:100% !important; max-width:100% !important;
  background:linear-gradient(to top,
              rgba(0,0,0,.70) 0%,
              rgba(0,0,0,0) 70%) !important;
  padding:18px 16px calc(18px + env(safe-area-inset-bottom)) !important;
  max-height:none !important; height:auto !important; overflow:visible !important;
}

/* (опционально) не затемнять картинку при «открытой» подписи */
.gdesc-open .gslide-media{ opacity:1 !important; }
  
}

/* max-width: 610px */

@media (max-width: 610px) {

#header_info .wrapping .contact_phone:nth-of-type(2){
	display: none;
	}
}

/* max-width: 480px */

@media (max-width: 480px) {
	h2 {
	display: inline-block;
	}

	#footer_wrap {
	padding: 0 10px;
	}

	#blog .texts p {
	font-size: 1.25rem;
	}

	#blog .add_date {
	text-align: left;
	}


	#header_info .wrapping .contact_email {
	display: none;
	}

	.stamp_area {
	top: 70%;
	padding: 0.5rem;
	font-size: 0.875rem;
	font-family: Arial, sans-serif;
	min-width: 150px;
	}

	.stamp_area_2 {
	display: none;
	}

	.depatments a {
	display: none;
	}

	.depatments .make_app a {
	 display: block;
	}

	.depatments {
	flex: 0 0 auto;       /* grow 0, shrink 0, basis auto */
	width: 100%;
	height: 120px !important;
	overflow: hidden;     /* чтобы внутренности не раздували визуально */
	background: #226B95;
	}
	
	.contact-wrap > .message_form{
	  padding:5px 10px;
	}

	.book_app input {
		margin: 20px auto;
	}
}

/* max-width: 320px */

@media (max-width: 320px){
  .design-frame .tab{
    white-space: normal;        /* разрешаем перенос по словам */
    word-break: keep-all;
    overflow-wrap: break-word;
    text-align: center;
    line-height: 1.2;
  }
}