/* RESET */
* { 
	margin:0;
	padding:0;
	box-sizing: border-box;
	line-height: 120%;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
input, select, textarea, button { font-size: inherit; font-family: inherit; border: 0; background: none; }
button { cursor: pointer; }

p { margin-bottom: 1rem;  }
p:last-child { margin-bottom:0; }

a { text-decoration: none; }
p a { text-decoration: underline; color: black; }
p a:hover  { text-decoration: none; }


/* END OF RESET */

:root {
  --red:  	 	#EF3124;
  --alfa-gray:  #505759;
  --violet1: 	#9933FF;
  --black1:  	#1C1C1E;
  --blue1:	 	#266FFF;
  --blue-light: #00FFF3;
  --green1:  	#69F026;
  
  scroll-behavior: smooth;
}

html { font-family: "Styrene A LC";  font-size: 20px; font-feature-settings: "ss01";  }
body { min-width: 320px; background: white; color: black; overflow-x: hidden; }
.wrapper { margin: 0 auto; max-width: 1220px; padding: 5rem 2rem; /*overflow: hidden;*/ position: relative; }
.wide_wrapper { padding: 0 4rem; }


h1 { font-size: 4rem;	font-weight: normal; margin-bottom: 0.8rem; font-family: 'Styrene A LC BLACK'; text-transform: uppercase; line-height: 110%; letter-spacing: -0.1rem; }
h2 { font-size: 2rem;   font-weight: bold; 	 margin-bottom: 2rem; line-height: 110%; }
h3 { font-size: 1.5rem; font-weight: bold; 	 margin-bottom: 1rem; }
h4 { font-size: 1.6rem; font-weight: bold; 	 margin-bottom: 0.5rem; font-family: "Styrene B LC"; }
h5 { font-size: 1.0rem; font-weight: normal; margin-bottom: 0.5rem; line-height: 110%; }
h6 { font-size: 1.2rem; font-weight: 500;    margin-bottom: 2rem; }

button, a.rating_link { 
	font-family: 'Styrene B LC';
    font-weight: 500;
	font-size: 0.9rem;
	line-height: 100%;
	display: inline-block;
	padding: 1rem 3.3rem 1.1rem 3.3rem; 
	text-align: center; 
	border-radius: 2.5rem;
	transition: 300ms ease; 
}

button { background: #fff; color: var(--red); }
a.rating_link { color: #fff; background: var(--red);  }
button:hover, a.rating_link:hover { background: black; color: #fff; }

a.rating_link { /*min-width: 15rem;*/ }


form { margin: 2rem 0 0rem 0; }


section { position: relative; z-index: 1; }




.swiper-wrapper { height: auto !important; align-items: stretch; }
.swiper-slide { height: auto !important; }

.swiper-buttons { display: flex; gap: 1rem; }
.swiper-buttons span { width: 2rem; aspect-ratio: 1/1; background: #F2F3F5; display: flex; align-items: center; justify-content: center; border-radius: 50%; }
.swiper-buttons img { opacity: 0.4; width: 0.6rem; display: block; }
.swiper-buttons span:not(.swiper-button-disabled):hover img { opacity: 1; cursor: pointer; }
.swiper-buttons .prev { transform: scaleX(-1); }

.swiper-buttons span.swiper-button-disabled, .swiper-buttons span.swiper-button-disabled:hover {
    opacity: 0.4 !important;
    cursor: initial !important;
}








.cookie { display: none; background: #F0F1F2; position: fixed; bottom: 0; left: 0; width: 100%; z-index: 999;  color: black; font-size: 0.75rem; }
.cookie .wrapper { padding-top: 1.5rem; padding-bottom: 1.5rem; }
.cookie .wrapper > div { position: relative; display: grid; grid-template-columns: 1fr 18rem; gap: 1rem; align-items: center; }
.cookie aside { text-align: right; }

.cookie button { background: var(--red); color: white; white-space: nobr; font-size: inherit; padding: 1rem 2rem 1.1rem 2rem; }
.cookie button:hover { background: var(--black1); }
.cookie p { line-height: 1.0rem; padding: 0.2rem 0; }
.cookie a { text-decoration: underline; color: inherit; }
.cookie a:hover { text-decoration: none; }


footer { font-size: 0.7rem; background: #000; color: #575757; }
footer .wrapper { padding-top: 1.5rem; padding-bottom: 1.5rem; display: flex; justify-content: space-between; align-items: center; }
footer .copy { display: flex; gap: 1rem; align-items: center; }
footer .copy a { position: relative; top: 0.4rem; display: block; }
footer .copy a img { display: block; height: 1.9rem; }
footer .copy span {  }

footer .links { position: relative; display: flex; gap: 3rem; }
footer .links a { color: #575757; }
footer .links a:hover { color: #EF3124; }

nowrap, nobr { white-space: nowrap; }


.window { position: fixed; z-index: 1000; top: 0; left: 0; height: 100%; width: 100%;  display: none; }
.window > div { height: 100%; width: 100%; display: flex; justify-content: center; align-items: center; }
.window aside { height: 100%; width: 100%; position: absolute; top: 0; left: 0; background: #000000cc; }
.window article { border-radius: 2rem; padding: 2rem; background: white; z-index: 2; position: relative; margin: 1.5rem; }

.window#subscribe 	 article { max-width: 38rem; }
.window#subscribe_ok article { max-width: 26rem; }

a.subscribe:hover { cursor: pointer; text-decoration: none; }

.window form { display: flex; flex-direction: column; gap: 1.5rem; }
.window h3 { text-align: center; }

.window button { background: var(--red); color: white; margin: 0 auto; display: block; }
.window button:hover { background: black; color: white; }

.window small { color: #83838A; font-size: 0.6rem; line-height: 100%; }
.window small a { color: #83838A; text-decoration: underline; }
.window small a:hover { text-decoration: none; }

.field { background: #F5F7F9; color: black; border-bottom: solid 1px #B6BCC3; position: relative; }
.field.warning { border-color: var(--red); margin-bottom: 1rem; }
.field.warning::before { content: 'Заполните поле корректно'; display: block; color:  var(--red); height: 1rem; position: absolute; bottom: -1rem; width: 100%; font-size: 0.6rem; }
.field::after { content: ''; display: none; width: 1rem; aspect-ratio: 1/1;  background-position: 0 0; background-size: contain; position: absolute; right: 0.5rem; top: 50%; margin-top: -0.45rem; z-index: 2; }

.field.warning::after { display: block; background-image: url('images2025/form_error.svg'); }
.field.correct::after { display: block; background-image: url('images2025/form_ok.svg'); }



input[type=text], label { padding: 1.1rem 0.5rem 1rem 0.5rem; font-size: 0.8rem; position: relative; z-index: 2; width: 100%; border: 0; background: none; outline: none; }

form label { position: absolute; width: 100%; transition: 300ms; color: #505759; }
.ch label { font-size: 0.45rem; padding: 0.4rem 0.5rem; z-index: 5; }

.required label::after { content: '*'; }






@media (max-width: 1600px){
	.wide_wrapper { padding: 0 3rem; }

}

@media (max-width: 1399px), (max-height: 850px){
	html { font-size: 19px; }
	
	.wide_wrapper { padding: 0 2rem; }
}
@media (max-width: 1199px), (max-height: 800px){
	html { font-size: 18px; }
	
}
@media (max-width: 1099px), (max-height: 750px){
	html { font-size: 17px; }
}

@media (max-width: 999px), (max-height: 700px){
	html { font-size: 16px; }
}


@media (max-width: 750px){

	h1 { font-size: 2.3rem; }
	h2 { font-size: 1.9rem; }
	h3 { font-size: 1.3rem; }
	h6 { font-size: 1rem; margin-bottom: 1.3rem; }
	
	article { max-width: 100%; }
	
	button, a.rating_link { min-width: 100%; padding: 1rem 2rem 1.1rem 2rem; }
	
	.cookie .wrapper > div { grid-template-columns: initial; flex-direction: column; }
	.cookie aside { text-align: left; }

	footer .copy,
	footer .wrapper { flex-direction: column; gap: 1.3rem; }
	
}


@media (max-width: 499px){
	.wrapper { padding: 3rem 1rem; }
	.wide_wrapper { padding: 0 1rem; }
	

}

@media (max-width: 399px){

	
	
	button, a.rating_link { min-width: 100%; padding: 1rem 1rem 1.1rem 1rem; }
}

@media (max-width: 359px), (max-height: 650px){
	html { font-size: 15px; }
}