@import url('https://fonts.googleapis.com/css2?family=Lora:wght@400;500&family=Oswald:wght@200;400&family=Roboto:ital,wght@0,400;0,500;0,700;0,900;1,400&display=swap');

/* Общее */
* 															{box-sizing: border-box; -webkit-text-size-adjust: 100%;}
html, body											{font-family: 'Roboto', sans-serif; font-size: 18px; font-weight: 400; line-height: 1.4; letter-spacing: .5px; color: #333333; width: 100%; height: 100%; margin: 0; padding: 0; background: #FFFFFF;}
section, article								{width: 100%; position: relative; max-width: 1440px; margin: 0 auto;}
section 												{margin: 40px auto 0; padding: 20px 0 40px;}
header 													{padding: 0 20px;}
article 												{margin: 60px auto 0; padding: 0;}

.body_overlay 									{touch-action: none; -webkit-overflow-scrolling: none; overflow: hidden; overscroll-behavior: none;}
.highlight 											{background: #FAFAFD; padding-top: 71px;}

/* Cсылки */
a 															{color: #333333;}
a:hover 												{text-decoration: none; }


/* Формы */
input 													{outline: none; font-size: 18px; padding: 10px 10px; border: #CCCCCC 1px solid; border-radius: 5px;}
input:focus 										{border-color: #666666;}
input:required 									{border-color: #BA0E43;}
.error 													{color: #BA0E43;}


/* Заголовки */
h1, h2, h3, h4, h5, h6 					{line-height: 1.05; padding: 0; margin: 0; text-align: left; max-width: 780px;}
h1															{font-size: 45px; font-weight: 900;}
h2 															{font-size: 35px; font-weight: 700;}
h3															{font-size: 30px; font-weight: 500;}
h4 															{font-size: 22px; font-weight: 400; line-height: 1.25; max-width: 600px;}
h5 															{font-size: 20px; font-weight: normal; max-width: 600px;}
h6 															{font-size: 18px; font-weight: normal; line-height: 1.25;}
/* связки */
	h1 + h4, h1 + h5,
	h2 + h4, h3 + h4, 
	h4 + h5, h4 + h6  					 		{margin-top: 20px;}
	h2 + h4, h3 + h4								{font-size: 20px;}


/* Кнопки */
.button 												{
																	width: 280px; padding: 20px; background: #FFFFFF; border: #333333 1px solid; text-align: center; text-transform: uppercase; letter-spacing: 1.5px; display: block; vertical-align: middle; border-radius: 5px; text-decoration: none;
  																transition: background .2s ease-in-out, border-color .2s ease-in-out, color .2s ease-in-out;
																}
.button:hover 									{cursor: pointer; color: #FFFFFF; background: #333333;}
.button_min 										{padding: 5px 10px; font-size: 16px; width: fit-content; margin-top: 6px;}
.button_med 										{display: inline-block; padding: 20px; font-size: 16px; width: fit-content; margin-top: 6px;}
.button_mini 										{font-size: 14px;}
	/* цвета */
	.button_action 									{color: #BA0E43; border-color: #BA0E43; border-radius: 8px;}
	.button_action:hover 						{color: #FFFFFF; background: #BA0E43;}
	/* отступы */
	.button_main										{margin: 40px auto 0;}


/* Loader */
.loader 												{
																	display: block; padding: 6px; border-radius: 50%;
																	position: fixed; top: 80px; left: 50%; background: #FFFFFF; z-index: 999;
																	animation: mymove .5s ease-out forwards;
																	box-shadow: 0px 5px 10px 2px rgba(0, 0, 0, 0.15);
																}
	@keyframes mymove								{
																		from 	{transform: translateY(0);}
																		to 		{transform: translateY(40px);}
																	}
	.loader::before				 					{
																		content: '';
																		display: block; width: 24px; height: 24px;
																		border: #FFFFFF 2px solid; border-top-color: #BA0E43; border-radius: 50%;
																		animation: spin 1s linear infinite;
																		
																	}
	@keyframes spin 								{
	  																0%		{transform: rotate(0deg);}
	  																100% 	{transform: rotate(360deg);}
																	}





/* Главное меню */
.nav-main 											{
																	width: 100%; position: fixed; top: 0; left: 0; z-index: 10; background: #FFFFFF; box-shadow: 0 1px 4px 0 rgba(0,0,0,0.15);
																	animation: fadein .85s ease-in-out;
																}
	@keyframes fadein 							{
																		from {opacity: 0;}
																		to   {opacity: 1;}
																	}
.nav-main_content								{position: absolute;}
.nav-main a:hover 							{color: #BA0E43;}
	/* бургер */
	.nav-main__toggle 							{position: absolute; top: 0; left: 0; display: block; cursor: pointer; padding: 15px 20px;}
	.nav-main__toggle svg g 				{fill: #333333;}
	.nav-main__toggle:hover svg g 	{fill: #BA0E43;}
	.nav-main__toggle svg 					{display: block;}
	#menuToggle 										{display: none;}
	#menuToggle:checked ~ .nav-main__items		{display: block;}
	#menuToggle:checked ~ .nav-main__account 	{display: block;}
	/* лого */
	.nav-main__logo 								{font-family: 'Lora', serif; font-size: 26px; font-weight: 400; letter-spacing: 6px; text-transform: uppercase; text-decoration: none; width: 180px; display: block; margin: 6px auto; text-align: center;}
	/* пункты меню */
	.nav-main__items 								{margin: 0; padding: 0; display: none; border-top: #EFEFEF 1px solid;}
	.nav-main__items li 						{list-style-type: none; text-transform: uppercase; letter-spacing: 1.5px; margin: 10px 15px; padding: 5px 5px;}
	.nav-main__items li a 					{text-decoration: none;}
	/* аккаунт */
	.nav-main__account 							{text-decoration: none; text-transform: uppercase; border-top: #EFEFEF 1px solid; padding: 11px 20px; display: none;}
	/* корзина */
	.nav-main__cart 								{position: absolute; top: 4px; right: 10px; padding: 10px; text-decoration: none;}
	.nav-main__cart svg 						{height: 20px;}
	.nav-main__cart svg path 				{fill: #333333;}
	.nav-main__cart:hover svg path 	{fill: #BA0E43;}
	.nav-main__cart sup 						{font-size: 10px; color: #FFFFFF; background: #BA0E43; position: relative; top: -9px; left: -10px; padding: 2px 5px; border-radius: 10px;}
	.nav-main__cart:hover sup 			{background: #BA0E43;}


/* Футер */
footer 													{width: 100%; font-size: 16px; background: #FAFAFD; padding: 35px 20px 20px;}
footer, footer a 								{color: #777777;}
footer a:hover 									{color: #333333;}
	/* навигация */
	.footer__nav										{padding: 0 0 10px; text-align: left;}
	.footer__nav li 								{display: block; vertical-align: top; list-style-type: none; margin-top: 10px; margin-right: 20px;}
	/* смена языка */
	.footer__language 							{position: relative; text-transform: uppercase; letter-spacing: 1px; margin-top: -10px; display: inline-block;}
	.footer__language svg 					{height: 16px; margin: 2px 10px 0 0; display: inline-block; vertical-align: top;}
	.footer__language svg path 			{fill: #777777;}
	.footer__language label[for="languageToggle"] 								{cursor: pointer; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; z-index: 950; display: block; padding: 9px 20px; border-radius: 8px; border: #CCCCCC 1px solid;}
	.footer__language label[for="languageToggle"]:hover 					{color: #333333; border-color: #333333;}
	.footer__language label[for="languageToggle"]:hover svg path 	{fill: #333333;}
	#languageToggle, .language-menu 					{display: none;}
	#languageToggle:checked ~ label 					{background: #EFEFEF; border-color: #EFEFEF;}
	#languageToggle:checked ~ .language-menu	{display: block;}
	.language-menu 										{text-align: left; list-style-type: none; margin: 0; padding: 0; position: absolute; bottom: 42px; left: 50%; transform: translate(-50%, 0); z-index: 1; background: #FFFFFF; border-radius: 8px; box-shadow: 0 1px 4px 0 rgba(0,0,0,0.15);}
	.language-menu li									{color: #333333; min-width: 150px;}
	.language-menu li a 							{color: #333333; padding: 12px 20px 10px; margin: 0; display: block; text-decoration: none;}
	.language-menu li a:hover 				{text-decoration: underline;}



@media (min-width: 500px) {
	/* Заголовки */
	h1, h2, h3, h4, h5, h6 							{margin: 0 auto; text-align: center;}

}

@media (min-width: 720px) {
	/* Общее */
/*	section 												{padding-bottom: 60px;} */

	.highlight 											{padding-top: 111px;}

	/* Заголовки */
	h1															{font-size: 70px;}
	h2 															{font-size: 60px;}
	h3															{font-size: 50px;}
	h4 															{font-size: 30px;}
	h5 															{font-size: 25px;}
	h6 															{font-size: 20px;}
		/* связки */
		h1 + h4, h2 + h4,
		h3 + h4, h4 + h5 								{margin-top: 40px;}
		h4 + h6 												{margin-top: 20px;}
		h2 + h4, h3 + h4								{font-size: 25px;}
		h1 + h5, h4 + h6								{font-size: 18px;}

	/* Кнопки */
	.button 												{width: 320px; padding: 25px 0;}
	.button_min 										{padding: 5px 10px; width: fit-content;}
	.button_med 										{padding: 20px; width: fit-content;}
	.button_mini 										{font-size: 14px;}
		/* цвета */
		.button_action 									{color: #FFFFFF; background: #BA0E43; border: none;}
		.button_action:hover 						{background: #A20032;}
		/* отступы */
		.button_main										{margin-top: 60px;}


	/* Главное меню */
		/* бургер */
		.nav-main__toggle 							{display: none;}
		/* логотип */
		.nav-main__logo 								{font-size: 30px; max-width: 240px; margin: 5px auto 0;}
		/* пункты меню */
		.nav-main__items 								{margin: 0 auto; padding: 0; text-align: center; display: block; border: none;}
		.nav-main__items li 						{display: inline-block; vertical-align: top; margin: 8px 20px 10px 0; padding: 0;}
		.nav-main__items li:last-child 	{margin-right: 0;}
		/* аккаунт */
		.nav-main__account 							{display: block; position: absolute; top: 10px; right: 84px; font-size: 14px; border: #CCCCCC 1px solid; border-radius: 5px; padding: 6px 11px;}
		.nav-main__account:hover 				{border-color: #BA0E43;}
		/* корзина */
		.nav-main__cart 								{right: 10px;}
		.nav-main__cart svg 						{height: 24px;}
		.nav-main__cart sup 						{font-size: 12px; top: -11px;}

	/* Футер */
	footer 													{margin-top: 60px;}
}


@media (min-width: 840px) {
	/* Общее */
	header, article 								{margin-left: auto; margin-right: auto;}
	header 													{padding: 0;}

	/* Кнопки */
	.button 												{width: 360px;}
	.button_min 										{width: fit-content;}
	.button_med 										{width: fit-content;}

	/* Главное меню */
		/* пункты меню */
		.nav-main__items li 						{margin-right: 40px;}
}