/* ---- css/style.css ---- */
/* --RESET STYLES--- */
/* =====================================================
   RESET CSS — очищенная версия
   ===================================================== */

*,
*::before,
*::after {
    padding: 0;
    margin: 0;
    border: 0;
    box-sizing: border-box;
}

html,
body {
    height: 100%;
    line-height: 1;
}





a {
    text-decoration: none;
    color: inherit;
    background-color: transparent;
}

ul,
ol,
li {
    list-style: none;
}

img {
    vertical-align: top;
    border-style: none;
    max-width: 100%;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: inherit;
    font-size: inherit;
}

button,
input,
select,
textarea,
optgroup {
    font: inherit;
    color: inherit;
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
    cursor: pointer;
    background-color: inherit;
    -webkit-appearance: button;
}



/* --------------------------------------------------------------------------- */
html,
body {
	height: 100%;
	line-height: 1;
	background:rgba(158, 187, 142, 0.05);
	font-size: 14px;
	color:rgba(13, 92, 99, 1);
	font-weight: 500;
	font-family: "Montserrat", Arial, sans-serif;
}
.doc2026,
.doc2026 button,
.doc2026 select {
    font-family: Montserrat, Arial, sans-serif;
}
.item-Rules-Blue__text
{
	margin-left: 30px;
	font-weight: bold;
	font-style: italic;
}

/* ------красный color:#34465a------------------------------------- */
.wrapper {
	min-height: 100%;
	overflow: hidden;
	display: flex;
	flex-direction: column;
}
/* ---------------------------------------------------------------------------- */
._container {
	max-width: 1300px;
	padding: 0px 15px;
	margin: 0px auto;
	box-sizing: content-box;
}
._ibg {
	position: relative;
}
._ibg img {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	object-fit: cover;
}
._ibg img__const {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	object-fit: cover;
}
span.bigred {
	font-size: 16px;
	font-weight: bold;
	color:#34465a; 
}
  span.red {
	font-size: 16px;
	font-weight: bold;
	color:#34465a; 
	text-transform: uppercase;
}
  span.big__w {
	font-size: 16px;
	font-weight: bold;
	color:rgba(250, 250, 250, 1);
  }
	span.bigred__it {
	font-size: 16px;
	font-weight: bold;
	color:#34465a;
	font-style: italic;}
/* ------------------------------------------header----------------- */
.header {
	position: absolute;
	width: 100%;
	left: 0;
	top: 0;
	z-index: 50;
	/* background: rgba(250, 250, 250, 1); */
}
.header__container {
	display: flex;
	min-height: 104px;
	align-items: center;
}
@media (max-width: 480px) {
	.header__container {
		min-height: 70px;
	}
}
/* -------------- header__logo - Графология  ------------- */
.header__logo {
	font-size: 24px;
	font-weight: 700;
	color:#34465a;
	text-shadow: 10px 10px 10px rgba(68, 81, 98, 1);
	margin: 0px 0px 0px 20px;
}
/* -- header__menu - button - Услуги и т.д. ------------- */
.header__menu {
	margin: 0px 0px 0px 50px;
}
@media (max-width: 990px) {
	.header__menu {
		margin: 0px 0px 0px 80px;
	}
}
@media (max-width: 770px) {
	.header__menu {
		margin: 0px 0px 0px 40px;
	}
}
@media (max-width: 480px) {
	.header__menu {
		margin: 0px 0px 0px 20px;
	}
}
.menu {
	padding: 5px 0;
}
.menu__list {
	flex-wrap: wrap;
	display: flex;
}
.menu__item:not(:last-child) {
	margin: 0px 21px 0px 0px;
}
.menu__link {
	color: rgba(13, 92, 99, 1);
	font-weight: 600;
	line-height: calc(24 / 14 * 100%);
}
.menu__link:hover {
	text-decoration: underline;
}
@media (max-width: 480px) {
	.menu__link {
		font-size: 18px;
	}
}
.menu__item__green {
	color:#34465a;
	font-weight: 600;
	line-height: calc(24 / 14 * 100%);
}
.menu__item__green:hover {
	text-decoration: underline;
}
@media (max-width: 480px) {
	.menu__item__green {
		font-size: 18px;
	}
}
/* -------------------PAGE-----------Введение--------------------- */
.page {
	flex: 1 1 auto;
}
/* .page__main-block {
} */
.page__services {
	position: relative;
	z-index: 2;
	margin: -111px 0px 0px 0px;
}
/* ---HEADER-BLOCK------------------------------------------------------------------------- */
.header-block {
	text-align: center;
	letter-spacing: 0.2px;
}
.header-block__title {
	font-size: 40px;
	line-height: 137%;
	letter-spacing: 0.2px;
	font-weight: 800;
	text-shadow: 10px 10px 10px rgba(68, 81, 98, 1);
	color: rgba(13, 92, 99, 1);
}
.header-block__title:not(:last-child) {
	margin: 0px 0px 10px 0px;
}
.header-block__sub-title {
	line-height: 142%;
	font-weight: 700;
	font-size: 20px;
	color: rgba(13, 92, 99, 1);
	margin: 0px 0px 30px 0px ;
}
.header-block__text {
	line-height: 142%;
	color: rgba(13, 92, 99, 1);
	font-style: italic;
	text-align:justify;
	font-size: 16px;
	margin: 30px 0px 0px 0px;
}
@media (max-width: 990px) {
	.header-block__title {
		font-size: 35px;
	text-shadow: 10px 10px 10px rgba(68, 81, 98, 1);
	}
}
@media (max-width: 770px) {
	.header-block__title {
		font-size: 30px;
	text-shadow: 10px 10px 10px rgba(68, 81, 98, 1);
	}
}
/* ---MAIN-BLOCK------------------------------------------------------------------------- */
.main-block {
	position: relative;
}
.main-block__body {
	padding: 184px 0px 191px 0px;
	position: relative;
	z-index: 2;
	max-width: 400px;
}
@media (max-width: 990px) {
	.main-block__body {
		padding: 120px 0px 191px 0px;
	}
}
@media (max-width: 480px) {
	.main-block__body {
		padding: 115px 0px 160px 0px;
	}
}
.main-block__body > *:not(:last-child) {
	margin: 0px 0px 35px 0px;
}
.main-block__title {
	font-size: 40px;
	line-height: 137%;
	letter-spacing: 0.2px;
	font-weight: 800;
	text-shadow: 10px 10px 10px rgba(68, 81, 98, 1);
	color: rgba(13, 92, 99, 1);
}
@media (max-width: 480px) {
	.main-block__title {
		font-size: 30px;
	}
}
.main-block__subtitle {
	line-height: 142%;
	font-weight: 700;
	font-size: 30px;
	color: rgba(68, 81, 98, 1);
	margin: 0px 0px 30px 0px ;
}
@media (max-width: 480px) {
	.main-block__subtitle {
		font-size: 20px;
	}
}
.main-block__text {
	color: rgba(31, 37, 44, 1);
	font-size: 16px;
	line-height: 150%;
}
@media (max-width: 480px) {
	.main-block__text {
		color: rgba(68, 81, 98, 1);
	}
}
.main-block__buttons {
	display: flex;
	flex-wrap: wrap;
	margin: -10px 0;
}
.main-block__button {
	border-radius: 40px;
	display: flex;
	min-height: 40px;
	/* высота кнопки = min-height: 40px */
	justify-content: center;
	align-items: center;
	letter-spacing: 0.2px;
	font-weight: 700;
	/* жирность шрифта в кнопке = font-weight: 700 */
	text-align: center;
	line-height: 150%;
	padding: 5px 20px;
	/* ширина кнопки = padding: 5px 20px */
	margin: 10px 0;
	transition: all 0.3s ease 0s;
	/* тень возле кнопки = box-shadow */
	margin-right: 10px;
}
.main-block__button_white {
	border-radius: 4px;
	background-color: rgba(250, 250, 250, 0.1);
	color:#34465a;
}
.main-block__button_white:hover {
	border-radius: 4px;
	background-color: rgba(250, 250, 250, 1);
	color: rgba(13, 92, 99, 1);
}
.main-block__button_green {
	background: rgba(13, 92, 99, 1);
	color: rgba(250, 250, 250, 1);
	box-shadow: 0px 10px 20px rgba(68, 81, 98, 1);
}
.main-block__button_green:hover {
	background-color: rgba(250, 250, 250, 1);
	color: rgba(13, 92, 99, 1);
	box-shadow: 0px 10px 20px rgba(68, 81, 98, 1);
}
.main-block__button_orange {
	background: rgba(165, 42, 42, 1);
	color: rgba(250, 250, 250, 1);
	box-shadow: 0px 10px 20px rgba(68, 81, 98, 1);
}
.main-block__button_orange:hover {
	background-color: rgba(250, 250, 250, 1);
	color: #34465a;
	box-shadow: 0px 10px 20px rgba(68, 81, 98, 1);
}
.main-block__button_border {
	color: rgba(13, 92, 99, 1);
	border: 1px rgba(13, 92, 99, 1);
	box-shadow: 0px 10px 20px rgba(68, 81, 98, 1);
  /* 4 значения - 1) радиус вверху слева; 2) радиус вверху справа; 3) радиус снизу справа; 4) радиус снизу слева */
  /* 3 значения - 1) радиус вверху слева; 2) радиус вверху справа и радиус внизу слева; 3) радиус снизу справа */
  /* 2 значения - 1) радиус вверху слева и внизу справа; 2) радиус вверху справа и внизу слева */
  /* 1 значение радиус со всех сторон */
  /* для наглядности укажем границы блока. solid - сплошная линия, dotted - линия из точек, dashed - пунктирная линия */
}
.main-block__button:hover {
/* псевдо класс hover начинает действовать когда мы наводим мышью на элемент страницы */
	background-color: rgba(13, 92, 99, 1);
	color: rgba(250, 250, 250, 1);
	box-shadow: 0px 10px 20px rgba(68, 81, 98, 1);
}
.main-block__image {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}
@media (max-width: 1300px) {
	.main-block__image img {
		object-position: right;
	}
}
@media (max-width: 990px) {
	.main-block__image {
		opacity: 0.5;
  /* величина прозрачности блока */
}
}
@media (max-width: 770px) {
	.main-block__image {
		opacity: 0.2;
  /* величина прозрачности блока */
}
}
@media (max-width: 480px) {
	.main-block__image {
		opacity: 0.0;
  /* величина прозрачности блока */
}
}

/* --------------------services - column - Графология - наука? и т.д.-- */
/* .services {
} */
/* .services__container {
} */
/* .services__body {
} */
@media (min-width: 670px) {
	.services__body {
		display: flex;
		flex-wrap: wrap;
		margin: 0px -15px;
	}
}
.services__column {
	flex: 0 1 33.333%;
}
@media (min-width: 670px) {
	.services__column {
		padding: 0px 15px;
	}
}
@media (max-width: 990px) {
	.services__column {
		flex: 0 1 50%;
	}
	.services__column:not(:last-child) {
		margin: 0px 0px 30px 0px;
	}
	.services__column:last-child {
		flex: 1 1 100%;
	}
}
.services__item {
	height: 100%;
	box-shadow: 0px 13px 19px rgba(0, 0, 0, 0.07);
	background-color: #fff;
	padding: 35px;
}
@media (max-width: 480px) {
	.services__item {
		padding: 25px;
	}
}
/* .item-service {} */
.item-service_green {
	background-color: #0d5c63;
}
.item-service_green .item-service__title {
	color: #fff;
}
.item-service_green .item-service__text {
	color: #fff;
}
.item-service > *:not(:last-child) {
	margin: 0px 0px 10px 0px;
}
/* .item-service__icon {} */
.item-service__title {
	font-weight: 700;
	letter-spacing: 0.1px;
	font-size: 24px;
	line-height: 133%;
	text-shadow: 10px 10px 10px rgba(68, 81, 98, 1);
}
.item-service__text {
	/* color: #737373; */
	color: rgba(13, 92, 99, 1);
	line-height: 142%;
}
/* ----- page__practice ----Практика----------------- */
.practice {
	/* padding: 0px 0px 20px 0px; */
	padding: 125px 0px 80px 0px;
	/* Отступ от колонок до заголовка Возможности графологии */
}
@media (max-width: 990px) {
	.practice {
		/* padding: 0px 0px 20px 0px; */
		padding: 40px 0px 80px 0px;
	}
}
@media (max-width: 770px) {
	.practice {
		/* padding: 0px 0px 20px 0px; */
		padding: 0px 0px 40px 0px;
	}
}
/* .practice__container {
} */
.practice__header {
	margin: 0px 0px 45px 0px;
}
@media (max-width: 770px) {
	.practice__header {
		margin: 0px 0px 25px 0px;
	}
}
/* --------------------------- Для index */
.practice__body {
	margin: 0px -20px -30px;
	display: flex;
	flex-wrap: wrap;
}
/* ---------------------------- Для hand */
.practice__body_h2 {
	margin: 0px -20px -470px;
	display: flex;
	flex-wrap: wrap;
}
/* ---------------------4 колонки-------- Для index */
.practice__column {
	padding: 0px 10px;
	margin: 0px 0px 30px 0px;
	flex: 0 1 25%;
}
@media (max-width: 990px) {
	.practice__column {
		flex: 0 1 50%;
	}
}
@media (max-width: 770px) {
	.practice__column {
		flex: 0 1 100%;
	}
}
/* ---------------------2 колонки-------- Для graphology */
.practice__column_2 {
	padding: 0px 10px;
	margin: 0px 0px 30px 0px;
	flex: 0 1 50%;
}
@media (max-width: 990px) {
	.practice__column_2 {
		flex: 0 1 70%;
	}
}
@media (max-width: 770px) {
	.practice__column_2 {
		flex: 0 1 100%;
	}
}
/* ---------------------2 колонки-------- Для hand */
.practice__column_2h {
	padding: 0px 10px;
	margin: -30px 0px -180px 0px;
	flex: 0 1 50%;
}
@media (max-width: 990px) {
	.practice__column_2h {
		flex: 0 1 50%;
	}
}
@media (max-width: 770px) {
	.practice__column_2h {
		flex: 0 1 100%;
	}
}
/* ----------------------------- practice__item */
.item-practice {
	background-color: rgba(255, 255, 255, 1);
	display: flex;
	height: 100%;
	flex-direction: column;
}
.item-practice__content {
	padding: 30px;
	flex: 1 1 auto;
}
.item-practice__link {
	color: inherit;
	display: inline-block;
}
.item-practice__link:hover {
	text-decoration: underline;
}
.item-practice__link:not(:last-child) {
	margin: 0px 0px 15px 0px;
}
.item-practice__title {
	line-height: 142%;
	font-weight: 700;
	font-size: 30px;
	/* margin: 0px 0px 0px 0px; */
	text-shadow: 10px 10px 10px rgba(68, 81, 98, 1);
	color: rgba(13, 92, 99, 1);
}
.item-practice__text {
	/* color: #737373; */
	color: rgba(13, 92, 99, 1);
	line-height: 142%;
}
.item-practice__image {
	display: block;
	padding: 0px 0px 60% 0px;
	box-shadow: 0px 13px 19px rgba(2, 62, 78, 0.3);
	/* filter: drop-shadow(5px 5px 30px rgba(0, 0, 0, 0.7)); */
}
/* ------------------------------------- */
.whoweare {
  background: #ffffff;
  padding: 80px 0px 130px 0px;
}
.whoweare__container {
}
.whoweare__header {
  margin: 0px 0px 100px 0px;
}
.whoweare__body {
  display: flex;
  align-items: flex-start;
}
.whoweare__video {
  flex: 0 0 50%;
  position: relative;
  padding: 0px 0px 40% 0px;
}
.whoweare__video iframe {
  position: absolute;
  width:100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover;
}
.whoweare__content {
  flex: 1 1 auto;
  padding: 20px 0px 0px 121px;
}
.whoweare__title {
  font-weight: 800;
  font-size: 40px;
  line-height: 142%;
  letter-spacing: 0.2px;
}
.whoweare__title:not(:last-child) {
  margin: 0px 0px 10px 0px;
}
.whoweare__text {
  color: #737373;
  line-height: 142%;
}
.whoweare__top:not(:last-child) {
  margin: 0px 0px 50px 0px;
}
.whoweare__items {
}
.whoweare__item {
}
.whoweare__item:not(:last-child) {
  margin: 0px 0px 30px 0px;
}

.item-whoweare {
  display: flex;
}
.item-whoweare__icon {
  flex: 0 0 32px;
}
.item-whoweare__body {
  flex: 1 1 auto;
  padding: 0px 0px 0px 20px;
}
.item-whoweare__title {
  font-weight: 700;
  font-size: 16px;
  line-height: 150%;
}
.item-whoweare__title:not(:last-child) {
  margin: 0px 0px 5px 0px;
}
.item-whoweare__text {
  color: #737373;
  white-space: nowrap;
  line-height: 142%;
  width: 225px;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (max-width: 1300px) {
  .whoweare__content {
    padding: 0px 0px 0px 50px;
  }
}
@media (max-width: 770px) {
  .whoweare {
    padding: 50px 0px 50px 0px;
  }
  .whoweare__body {
    flex-direction: column-reverse;
    align-items: stretch;
  }
  .whoweare__title {
    font-size: 24px;
  }
  .whoweare__content {
    padding: 0px 0px 0px 0px;
  }
  .whoweare__video {
    padding: 0px 0px 56.25% 0px;
  }
  .whoweare__video:not(:last-child) {
    margin: 50px 0px 0px 0px;
  }
  .whoweare__header {
    margin: 0px 0px 30px 0px;
  }
}
@media (max-width: 320px) {
  .whoweare {
    padding: 20px 0px 50px 0px;
  }
  .whoweare__top:not(:last-child) {
    margin: 0px 0px 30px 0px;
  }
  .whoweare__video:not(:last-child) {
    margin: 30px 0px 0px 0px;
  }
}
/* -----------------------man-------------- */
.man {
	/* padding: 0px 0px 20px 0px; */
	padding: 0px 0px 80px 0px;
}
@media (max-width: 990px) {
	.man {
		/* padding: 0px 0px 20px 0px; */
		padding: 40px 0px 80px 0px;
	}
}
@media (max-width: 770px) {
	.man {
		/* padding: 0px 0px 20px 0px; */
		padding: 0px 0px 40px 0px;
	}
}
/* .man__container {
} */
.man__header {
	margin: 0px 0px 45px 0px;
}
@media (max-width: 770px) {
	.man__header {
		margin: 0px 0px 25px 0px;
	}
}
.man__body {
	margin: 0px -20px -30px;
	display: flex;
	flex-wrap: wrap;
}
.man__column {
	padding: 0px 10px;
	margin: 0px 0px 30px 0px;
	flex: 0 1 33.0%;
}
@media (max-width: 990px) {
	.man__column {
		flex: 0 1 50%;
	}
}
@media (max-width: 770px) {
	.man__column {
		flex: 0 1 100%;
	}
}
/* .man__item {
} */
.item-man {
	background-color: rgba(255, 255, 255, 1);
	display: flex;
	height: 100%;
	flex-direction: column;
}
.item-man__content {
	padding: 10px;
	flex: 1 1 auto;
}
.item-man__link {
	color: inherit;
	display: inline-block;
}
.item-man__link:hover {
	text-decoration: underline;
}
.item-man__link:not(:last-child) {
	margin: 0px 0px 15px 0px;
}
.item-man__title {
	line-height: 142%;
	font-weight: 700;
	font-size: 30px;
	margin: 60px 0px 0px 0px;
	color: rgba(13, 92, 99, 1);
}
.item-man__text {
	color: #737373;
	line-height: 142%;
}
.item-man__image {
	display: block;
	padding: 0px 0px 60% 0px;
	box-shadow: 0px 13px 19px rgba(2, 62, 78, 0.3);
}
.item-man:hover 
.item-man__image img{
	transform: scale(1.1);
}
/* --------------contact-------------------- */
.contact {
	background-color: rgba(255, 255, 255, 1);
	padding: 42px 0;
	text-shadow: 10px 10px 10px rgba(68, 81, 98, 1);
}
/* .contact__container {
} */
.contact__content {
	padding: 0px 0px 20px 0px;
}
@media (min-width: 767px) {
	.contact__body {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.contact__content {
		padding: 0px 20px 0px 0px;
	}
}
.contact__title {
	line-height: 142%;
	font-weight: 700;
	font-size: 40px;
	margin: 60px 0px 0px 0px;
	text-shadow: 10px 10px 10px rgba(68, 81, 98, 1);
	color: rgba(13, 92, 99, 1);
}
.contact__title:not(:last-child) {
	margin: 0px 0px 10px 0px;
}
.contact__text {
	color: #737373;
	line-height: 142%;
}
.contact__button {
	display: flex;
	background-color: rgba(13, 92, 99, 1);
	border-radius: 5px;
	min-height: 58px;
	padding: 5px 40px;
	transition: background-color 0.3s ease 0s;
	justify-content: center;
	align-items: center;
	text-align: center;
	color: rgba(255, 255, 255, 1);
}
.contact__button:hover {
	background-color: rgba(13, 92, 99, 1);
}
/* ---------------categories -------------------- */
.title{
	font-size: 40px;
	line-height: 137%;
	letter-spacing: 0.2px;
	font-weight: 800;
	text-shadow: 10px 10px 10px rgba(68, 81, 98, 1);
	color: rgba(68, 81, 98, 1);
}
.title span{
	color: #34465a;
}
@media (max-width: 770px){
	.title {
		font-size: 35px;
	}
}
@media (max-width: 480px){
	.title {
		font-size: 30px;
	}
}

/* --------------------------------- */
[class*="__container"] {
	max-width: 1300px;
	padding: 0px 15px;
	margin: 0px auto;
	box-sizing: content-box;
}
/* -----------------------categories 1 ---------- */
.categories {
	/* padding: 0px 0px 20px 0px; */
	padding: 125px 0px 80px 0px;
}
@media (max-width: 990px) {
	.categories {
		/* padding: 0px 0px 20px 0px; */
		padding: 40px 0px 80px 0px;
	}
}
@media (max-width: 770px) {
	.categories {
		/* padding: 0px 0px 20px 0px; */
		padding: 0px 0px 40px 0px;
	}
}
.categories__items {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	/* количество картинок в строке = "4" */
	column-gap: 20px;
	/* пробел между картинками в строке = "20px" */
	row-gap: 20px;
	/* пробел между строками с картинками = "15px" */
}
/* .categories__item {} */
.item-category {
	position: relative;
	/* относительное позиционирование = position: relative */
}
.item-category:hover 
.item-category__image img{
	transform: scale(1.1);
	/* изменение размера картинки = transform: scale(1.1) */
}
.item-category__title {
	text-align: center;
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 10px 10px;
	color: rgba(255, 255, 255, 1);
	font-size: 10px;
	line-height: 1.5;
	font-weight: 500;
	z-index: 3;
	width: 100%;
}
.item-category__image {
	position: relative;
	overflow: hidden;
	/* border-radius: 10px; */
	padding-bottom: 127%;
	box-shadow: 0px 13px 19px rgba(2, 62, 78, 0.3);
}
.item-category__image::before{
	content:"";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 2;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.65) 100%);
}
.item-category__image img{
	transition: all 0.3s ease 0s;
	position: absolute;width: 100%;height: 100%;top: 0;left: 0;
	object-fit: cover;
}
@media (max-width: 990px){
	.categories__items {
		column-gap:20px;
	}  
}
@media (max-width: 990px) {
	.categories {
		padding: 40px 0px 80px 0px;
	}
.categories__title {
		margin-bottom: 50px;
	}
	.categories__items {
		column-gap: 20px;
	}
	.categories__items {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (max-width: 770px) {
	.categories {
		padding: 0px 0px 40px 0px;
	}
	.categories__title {
		margin-bottom: 20px;
	}
}
@media (max-width: 480px) {
	.categories__items {
		row-gap: 20px;
		grid-template-columns: repeat(1, 1fr);
	}
}
/* ----------------- What our customer’s say	- Что говорят наши клиенты ---------------------- */
/* .reviews { */
	/* padding-top: 240px; */
	/* padding-bottom:240px; */
/* } */
/* .reviews__container {} */
.reviews__title {
	line-height: 142%;
	font-weight: 700;
	font-size: 40px;
	margin: 60px 0px 0px 0px;
	text-shadow: 10px 10px 10px rgba(68, 81, 98, 1);
	color: rgba(13, 92, 99, 1);
}
.reviews__subtitle {
	line-height: 142%;
	font-weight: 600;
	font-size: 20px;
	color: #737373;
	margin: 0px 0px 20px 0px;
	text-shadow: 10px 10px 10px rgba(68, 81, 98, 1);
}
/* .reviews__swiper {} */
/* .swiper-reviews {} */
/* .swiper-reviews__wrapper {} */
/* .swiper-reviews__slide { */
/* } */
.slide-swiper-reviews {
	display: flex;
}
.slide-swiper-reviews__picture {
	overflow: hidden;
	flex: 0 1 50%;
	display: flex;
	justify-content:center;
	align-items: center;
}
.slide-swiper-reviews__image {
	width: 300px;
	height: 300px;
	position: relative;
}
.slide-swiper-reviews__image img{
	border-radius: 50%;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;left: 0;
	object-fit: center;
	box-shadow: 0px 13px 19px rgba(2, 62, 78, 0.3);
}
.slide-swiper-reviews__body {
	flex: 0 1 50%;
}
.slide-swiper-reviews__text {
	font-size: 24px;
	line-height: 160%;
	font-style: italic;
}
.slide-swiper-reviews__text p:not(:last-child) {
	margin-bottom: 15px;
}
.slide-swiper-reviews__text:not(:last-child){
	margin-bottom: 56px;
}
/* .slide-swiper-reviews__author { */
/* } */
.slide-swiper-reviews__name {
	font-weight: 600;
	font-size: 24px;
	line-height: 160%;
	color: #000;
	text-shadow: 10px 10px 10px rgba(68, 81, 98, 1);
}
.slide-swiper-reviews__name:not(:last-child) {
	margin-bottom: 8px;
}
.slide-swiper-reviews__position {
	color:rgba(134, 134, 134, 1);
	font-size: 18px;
	letter-spacing: 0.08em;
	font-weight: 500;
	text-transform: uppercase;
}
.swiper-reviews__pagination {
	display: flex;
	transform: translate(0px,-100%);
	justify-content: flex-end;
}
.swiper-reviews__pagination .swiper-pagination-bullet{
	opacity: 1;
	background: #C4C4C4;
	border-radius: 20px;
	flex: 0 0 10px;
	height: 16px;
	transition: all 0.3s ease 0s;
}
.swiper-reviews__pagination .swiper-pagination-bullet-active{
	background: rgba(13, 92, 99, 1);
	flex: 0 0 24px;
}
@media (max-width: 1300px) {
	.reviews__swiper.swiper {
		margin-left: -15px;
	}
}
@media (max-width: 990px) {
	.reviews {
		padding-top: 80px;
		padding-bottom: 80px;
	}
	.reviews__title {
		margin-bottom: 50px;
	}
	.slide-swiper-reviews__body{
		padding-left: 15px;
	}
	.slide-swiper-reviews {
		flex-direction: column;
	}
	.slide-swiper-reviews__picture {
		margin-bottom: 25px;
	}
	.swiper-reviews__pagination.swiper-pagination {
		position: relative;
		bottom: 0;
		justify-content: center;
		transform: translate(0px,0px);
		padding-top: 35px;
	}
}
@media (max-width: 770px) {
	.reviews {
		padding-top: 30px;
		padding-bottom: 30px;
	}
	.reviews__title {
		margin-bottom: 30px;
	}
}
@media (max-width: 480px) {
	.slide-swiper-reviews__image {
		width: 270px;
		height: 270px;
	}
	.slide-swiper-reviews__image::before {
		content: "";
		position: absolute;
		width: 225px;
		height: 187px;
		top: 50px;
		left: -80px;
		transform: rotate(-10deg);
		background-color: rgba(13, 92, 99, 1);
		border-radius: 40px 0px 400px 400px;
	}
	.slide-swiper-reviews__text {
		font-size: 18px;
	}
	.slide-swiper-reviews__text:not(:last-child) {
		margin-bottom: 25px;
	}
}
/* -----------------------------------footer---------------- */
/* .footer { */
/* } */
.footer__top {
	background: rgba(13, 92, 99, 1);
	padding: 35px 0;
}
/* .footer__main {
} */
.footer__row {
	display: flex;
	flex-wrap: wrap;
	margin: 0px -15px;
}
.footer__column {
	padding: 15px 15px;
	flex: 0 1 16.6667%;
}
.footer__column:last-child {
	flex: 0 1 33.334%;
}
@media (max-width: 990px) {
	.footer__column {
		flex: 0 1 25%;
	}
	.footer__column:last-child {
		flex: 1 1 100%;
	}
}
@media (max-width: 990px) {
	.footer__column {
		flex: 0 1 50%;
	}
}
.footer__label {
	color: rgba(255, 255, 255, 1);
	font-weight: 700;
	font-size: 16px;
	line-height: 150%;
	margin: 0px 0px 20px 0px;
	padding: 0px 30px 0px 30px;
}
/* .footer__menu {
} */
/* .menu-footer {
} */
/* .menu-footer__list {
} */
.menu-footer__item:not(:last-child) {
	margin: 0px 0px 10px 0px;
}
.menu-footer__link {
	color: rgba(255, 255, 255, 1);
	display: inline-block;
	line-height: 171%;
	letter-spacing: 0.2px;
}
.menu-footer__link:hover {
	text-decoration: underline;
}
/* .footer__contacts {
} */
.contacts-footer {
	display: flex;
	flex-direction: column;
}
.contacts-footer__item {
	padding: 0px 0px 0px 34px;
	line-height: 142%;
	display: flex;
	align-items: center;
	color: rgba(255, 255, 255, 1);
	min-height: 30px;
}
.contacts-footer__item:hover {
	text-decoration: underline;
}
.contacts-footer__item:not(:last-child) {
	margin: 0;
}
.contacts-footer__item_phone {
	background: url("../img/footer/icons/01.svg") 0 0 no-repeat;
}
.contacts-footer__item_map {
	background: url("../img/footer/icons/02.svg") 0 0 no-repeat;

}
.contacts-footer__item_email {
	background: url("../img/footer/icons/03.svg") 0 0 no-repeat;
}
.contacts-footer__item_html {
	background: url("../img/svg/one-dots-green.svg") 0 0 no-repeat;
}
.contacts-footer__item_telegram {
	background: url("../img/svg/one-dots-blue.svg") 0 0 no-repeat;
}
/* icons8-browser-64.png */
.footer__bottom {
	padding: 25px 0;
}
.footer__container {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.footer__copy {
	color: #737373;
	line-height: 171%;
}
/* .footer__social {
} */
.social {
	display: flex;
	align-items: center;
}
.social__item:not(:last-child) {
	margin: 0px 20px 0px 0px;
}
@media (max-width: 770px) {
	.footer__container {
		flex-direction: column;
	}
	.footer__copy {
		margin: 0px 0px 15px 0px;
		text-align: center;
	}
}
/* ------------------------------------------------------- */
.avatar {
  background-color: rgba(255, 255, 255, 1);
  border: solid 1px rgba(0, 90, 156, 1);
  border-radius: 50%;
  height: 6.25rem;
  overflow: hidden;
  width: 6.25rem;
}
.avatar img {
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
}
/* ------------------------------------------------------- */
/* ------------------------------------ */
/* Картинки в карточке №2 */
.item__item {
	display: flex;
	margin: 0px 0px 30px 0px;
}
/* Контейнер картинки */
.item__image {
	flex: 0 0 33.333%;
	position: relative;
	min-height: 500px;
}
/* Картинка */

.item__image {
	flex: 0 0 24%;
	position: relative;
	min-height: 500px;
	min-width: 100px;
}
/* Картинка */
.item__image img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: absolute;
	top: 0;
	left: 0;
}
.item__body {
	flex: 1 1 auto;
	padding: 0px 0px 0px 30px;
}
.item__label {
	font-size: 20px;
	font-weight: 700;
	display: inline-block;
	margin: 0px 0px 20px 0px;
}
/* ------------------- Читать больше - Свернуть */

.text_hide_wrap {
	max-width: 700px;
}

.item_text {
	width: 100%;
	padding: 20px;
}

.item_text p {
	margin-bottom: 20px;
}

.io_item {
	width: 100%;
	padding-bottom: 20px;
}

.io_button_wrap {
	text-align: center;
	margin-top: 10px;
}

.io_button {
	border-radius: 4px;
	display: flex;
	min-height: 40px;
	/* высота кнопки = min-height: 40px */
	justify-content: center;
	align-items: center;
	letter-spacing: 0.2px;
	font-weight: 700;
	/* жирность шрифта в кнопке = font-weight: 700 */
	text-align: center;
	line-height: 150%;
	padding: 10px 20px;
	/* ширина кнопки = padding: 5px 20px */
	/* margin: 10px 0; */
	transition: all 0.3s ease 0s;
	box-shadow: 0px 10px 20px rgba(68, 81, 98, 1);
	/* тень возле кнопки = box-shadow */
	/* margin-right: 10px; */
}
.io_button:hover {
	/* псевдо класс hover начинает действовать когда мы наводим мышью на элемент страницы */
		background-color: rgba(13, 92, 99, 1);
		color: rgba(250, 250, 250, 1);
	}
	
a.io_button:hover {
	text-decoration: none;
}

.io_item .btn_close {
	display: none;
}

.io_item .btn_open {
	display: inline-block;
}

.io_item.open .btn_close {
	display: inline-block;
}

.io_item.open .btn_open {
	display: none;
}

.io_trans {
	width: inherit;
	position: absolute;
	height: 80px;
	bottom: 0;
	pointer-events: none;
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
	transition: 1s;
}

.io_item.open .io_trans {
	height: 0;
	transition: 1s;
}

.io_item_wrap {
	position: relative;
	overflow: hidden;
	max-height: 100px;
	width: inherit;
	transition: max-height 0.5s;
}
.io_item.open .io_item_wrap {
	max-height: 999px !important;
	transition: max-height 1s;
}
/* https://www.w3schools.com/howto/howto_js_responsive_navbar_dropdown.asp */

/* Add a black background color to the top navigation */
/* Добавьте черный цвет фона в верхнюю панель навигации. */
/* Примечание: В настоящем сайте вместо черного цвета: rgba(250, 250, 250, 1)  */
.topnav {
	background-color: rgba(250, 250, 250, 1);
	overflow: hidden;
  }
  
  /* Style the links inside the navigation bar */
  /* Стиль ссылок внутри панели навигации */
  .topnav a {
	float: left;
	display: block;
	color: rgba(13, 92, 99, 1);
	text-align: center;
	padding: 10px 10px;
	text-decoration: none;
	font-size: 14px;
  }
  
  /* Add an active class to highlight the current page */
  /* Добавьте активный класс, чтобы выделить текущую страницу */
  .active {
	background-color:rgba(158, 187, 142, 0.2);
	color: rgba(13, 92, 99, 0.1);
	text-transform: uppercase;
  }
  
  /* Hide the link that should open and close the topnav on small screens */
  /* Скрыть ссылку, которая должна открывать и закрывать topnav на маленьких экранах */
  .topnav .icon {
	display: none;
  }

  .topnav button.icon {
    border: 0;
    border-radius: 0;
    min-height: 0;
    width: auto;
    margin: 0;
    padding: 10px 10px;
    background: transparent;
    color: rgba(13, 92, 99, 1);
    font: inherit;
    line-height: inherit;
    text-align: center;
    box-shadow: none;
    cursor: pointer;
  }
  
  /* Dropdown container - needed to position the dropdown content */
  /* Контейнер выпадающего списка — необходим для позиционирования выпадающего содержимого. */
  .dropdown {
	float: left;
	overflow: hidden;
  }
  
  /* Style the dropdown button to fit inside the topnav */
  /* Настройте кнопку раскрывающегося списка так, чтобы она помещалась внутри верхней навигации. */
  .dropdown .dropbtn {
	font-size: 14px;
	border: none;
	outline: none;
	color:  rgba(13, 92, 99, 1);
	padding: 8px 8px;
	background-color: inherit;
	font-family: inherit;
	margin: 0;
  }
  /* Style the dropdown content (hidden by default) */
  /* Стиль выпадающего содержимого (по умолчанию скрыт) */
  .dropdown-content {
	display: none;
	position: absolute;
	background-color: #f9f9f9;
	min-width: 160px;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	z-index: 1;
	padding-left: 20px;
  }
  
  /* Style the links inside the dropdown */
  /* Оформите ссылки внутри выпадающего списка  */
  .dropdown-content a {
	float: none;
	color:#34465a;
	padding: 10px 10px;
	text-decoration: none;
	display: block;
	text-align: left;
  }
  
  /* Add a dark background on topnav links and the dropdown button on hover */
    /* Сделайте темный фон для ссылок topnav и кнопки выпадающего списка при наведении курсора мыши */
  .topnav a:hover, .dropdown:hover .dropbtn {
	background-color: rgba(133, 9, 9, 1);
	color: white;
  }
  
  /* Add a grey background to dropdown links on hover */
    /* Добавить серый фон для выпадающих ссылок при наведении */
  .dropdown-content a:hover {
	background-color: #ddd;
	color: black;
  }
  
  /* Show the dropdown menu when the user moves the mouse over the dropdown button */
  /* Показывать раскрывающееся меню, когда пользователь наводит указатель мыши на кнопку раскрывающегося списка. */
  .dropdown:hover .dropdown-content {
	display: block;
  }
  /* When the screen is less than 770 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
  /* При ширине экрана менее 770 пикселей скрыть все ссылки, кроме первой ("Главная"). Показать ссылку, которая должна открывать и закрывать topnav (.icon) */
  @media screen and (max-width: 770px) 
	{.topnav a:not(:first-child), .dropdown .dropbtn, .dropdown .dropbtn-n {
	  display: none;
	}
	.topnav .icon {
	  float: right;
	  display: block;
	}
  }
  /* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
  /* «Отзывчивый» класс добавляется в topnav с помощью JavaScript, когда пользователь щелкает значок. Этот класс заставляет topnav хорошо выглядеть на маленьких экранах (отображать ссылки вертикально, а не горизонтально). */
  @media screen and (max-width: 770px) {
	.topnav.responsive {position: relative;}
	.topnav.responsive .icon {
	  position: absolute;
	  right: 0;
	  top: 0;
	}
	.topnav.responsive a {
	  float: none;
	  display: block;
	  text-align: left;
	}
	.topnav.responsive .dropdown {float: none;}
	.topnav.responsive .dropdown-content {position: relative;}
	.topnav.responsive .dropdown .dropbtn {
	  display: block;
	  width: 100%;
	  text-align: left;
	}
  }
  .dropdown .dropbtn-n {
	font-size: 14px;
	border: none;
	outline: none;
	color:  rgba(13, 92, 99, 1);
	padding: 8px 8px;
	font-family: inherit;
	margin: 0;
	text-transform: uppercase;
	background-color: rgba(13, 92, 99, 0.1);
	color: black;
	text-transform: uppercase;
  }
  .dropdown .dropbtn-w {
	font-size: 14px;
	border: none;
	outline: none;
	color: rgba(250, 250, 250, 1);
	padding: 0px 0px 0px 28px;
	font-family: inherit;
	margin: 5px 0px 0px 0px;
	text-transform: uppercase;
	background-color: rgba(13, 92, 99, 0.1);
	text-transform:none;
  }
/* Дополнил из W3.CSS 4.15 December 2020 by Jan Egil and Borge Refsnes */
/* Исключил поз. 5-9 */
html {
	box-sizing: border-box;
  }
/* Extract from normalize.css by Nicolas Gallagher and Jonathan Neal git.io/normalize */
html {
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
  }
body {
	margin: 0;
  }
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section {
  display: block;
}
summary {
	display: list-item;
  }
  audio,
  canvas,
  progress,
  video {
	display: inline-block;
  }
  progress {
	vertical-align: baseline;
  }
  audio:not([controls]) {
	display: none;
	height: 0;
  }
  [hidden],
  template {
	display: none;
  }
  a {
	background-color: transparent;
  }
  a:active,
  a:hover {
	outline-width: 0;
  }
  abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	text-decoration: underline dotted;
  }
  b,
  strong {
	font-weight: bolder;
  }
  dfn {
	font-style: italic;
  }
  mark {
	background: #ff0;
	color: #000;
  }
  small {
	font-size: 80%;
  }
  sub,
  sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
  }
  sub {
	bottom: -0.25em;
  }
  sup {
	top: -0.5em;
  }
  figure {
	margin: 1em 40px;
  }
  img {
	border-style: none;
  }
  code,
  kbd,
  pre,
  samp {
	font-family: monospace, monospace;
	font-size: 1em;
  }
  hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible;
  }
  button,
  input,
  select,
  textarea,
  optgroup {
	font: inherit;
	margin: 0;
  }
  optgroup {
	font-weight: bold;
  }
  button,
  input {
	overflow: visible;
  }
  button,
  select {
	text-transform: none;
  }
  button,
  [type="button"],
  [type="reset"],
  [type="submit"] {
	-webkit-appearance: button;
  }
  button::-moz-focus-inner,
  [type="button"]::-moz-focus-inner,
  [type="reset"]::-moz-focus-inner,
  [type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0;
  }
  button:-moz-focusring,
  [type="button"]:-moz-focusring,
  [type="reset"]:-moz-focusring,
  [type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText;
  }
  fieldset {
	border: 1px solid #c0c0c0;
	margin: 0 2px;
	padding: 0.35em 0.625em 0.75em;
  }
  legend {
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal;
  }
  textarea {
	overflow: auto;
  }
  [type="checkbox"],
  [type="radio"] {
	padding: 0;
  }
  [type="number"]::-webkit-inner-spin-button,
  [type="number"]::-webkit-outer-spin-button {
	height: auto;
  }
  [type="search"] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
  }
  [type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
  }
  ::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
  }

/* html,
body {
  font-family: Verdana, sans-serif;
  font-size: 15px;
  line-height: 1.5;
}
html {
  overflow-x: hidden;
}
h1 {
  font-size: 36px;
}
h2 {
  font-size: 30px;
}
h3 {
  font-size: 24px;
}
h4 {
  font-size: 20px;
}
h5 {
  font-size: 18px;
}
h6 {
  font-size: 16px;
}
.w3-serif {
  font-family: serif;
}
.w3-sans-serif {
  font-family: sans-serif;
}
.w3-cursive {
  font-family: cursive;
}
.w3-monospace {
  font-family: monospace;
} */
/* h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Segoe UI", Arial, sans-serif;
  font-weight: 400;
  margin: 10px 0;
} */


.w3-wide {
	letter-spacing: 4px;
  }
  hr {
	border: 0;
	border-top: 1px solid #eee;
	margin: 20px 0;
  }
  .w3-image {
	max-width: 100%;
	height: auto;
  }
  img {
	vertical-align: middle;
  }
  a {
	color: inherit;
  }
  .w3-table,
  .w3-table-all {
	border-collapse: collapse;
	border-spacing: 0;
	width: 100%;
	display: table;
  }
  .w3-table-all {
	border: 1px solid #ccc;
  }
  .w3-bordered tr,
  .w3-table-all tr {
	border-bottom: 1px solid #ddd;
  }
  .w3-striped tbody tr:nth-child(even) {
	background-color: #f1f1f1;
  }
  .w3-table-all tr:nth-child(odd) {
	background-color: #fff;
  }
  .w3-table-all tr:nth-child(even) {
	background-color: #f1f1f1;
  }
  .w3-hoverable tbody tr:hover,
  .w3-ul.w3-hoverable li:hover {
	background-color: #ccc;
  }
  .w3-centered tr th,
  .w3-centered tr td {
	text-align: center;
  }
  .w3-table td,
  .w3-table th,
  .w3-table-all td,
  .w3-table-all th {
	padding: 8px 8px;
	display: table-cell;
	text-align: left;
	vertical-align: top;
  }
  .w3-table th:first-child,
  .w3-table td:first-child,
  .w3-table-all th:first-child,
  .w3-table-all td:first-child {
	padding-left: 16px;
  }
  .w3-btn,
  .w3-button {
	border: none;
	display: inline-block;
	padding: 8px 16px;
	vertical-align: middle;
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	background-color: inherit;
	text-align: center;
	cursor: pointer;
	white-space: nowrap;
  }
  .w3-btn:hover {
	box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  }
  .w3-btn,
  .w3-button {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
  }
  .w3-disabled,
  .w3-btn:disabled,
  .w3-button:disabled {
	cursor: not-allowed;
	opacity: 0.3;
  }
  .w3-disabled *,
  :disabled * {
	pointer-events: none;
  }
  .w3-btn.w3-disabled:hover,
  .w3-btn:disabled:hover {
	box-shadow: none;
  }
  .w3-badge,
  .w3-tag {
	background-color: #000;
	color: #fff;
	display: inline-block;
	padding-left: 8px;
	padding-right: 8px;
	text-align: center;
  }
  .w3-badge {
	border-radius: 50%;
  }
  .w3-ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
  }
  .w3-ul li {
	padding: 8px 16px;
	border-bottom: 1px solid #ddd;
  }
  .w3-ul li:last-child {
	border-bottom: none;
  }
  .w3-tooltip,
  .w3-display-container {
	position: relative;
  }
  .w3-tooltip .w3-text {
	display: none;
  }
  .w3-tooltip:hover .w3-text {
	display: inline-block;
  }
  .w3-ripple:active {
	opacity: 0.5;
  }
  .w3-ripple {
	transition: opacity 0s;
  }
  .w3-input {
	padding: 8px;
	display: block;
	border: none;
	border-bottom: 1px solid #ccc;
	width: 100%;
  }
  .w3-select {
	padding: 9px 0;
	width: 100%;
	border: none;
	border-bottom: 1px solid #ccc;
  }
  .w3-dropdown-click,
  .w3-dropdown-hover {
	position: relative;
	display: inline-block;
	cursor: pointer;
  }
  .w3-dropdown-hover:hover .w3-dropdown-content {
	display: block;
  }
  .w3-dropdown-hover:first-child,
  .w3-dropdown-click:hover {
	background-color: #ccc;
	color: #000;
  }
  .w3-dropdown-hover:hover > .w3-button:first-child,
  .w3-dropdown-click:hover > .w3-button:first-child {
	background-color: #ccc;
	color: #000;
  }
  .w3-dropdown-content {
	cursor: auto;
	color: #000;
	background-color: #fff;
	display: none;
	position: absolute;
	min-width: 160px;
	margin: 0;
	padding: 0;
	z-index: 1;
  }
.w3-check,
.w3-radio {
  width: 24px;
  height: 24px;
  position: relative;
  top: 6px;
}
.w3-sidebar {
  height: 100%;
  width: 200px;
  background-color: #fff;
  position: fixed !important;
  z-index: 1;
  overflow: auto;
}
.w3-bar-block .w3-dropdown-hover,
.w3-bar-block .w3-dropdown-click {
  width: 100%;
}
.w3-bar-block .w3-dropdown-hover .w3-dropdown-content,
.w3-bar-block .w3-dropdown-click .w3-dropdown-content {
  min-width: 100%;
}
.w3-bar-block .w3-dropdown-hover .w3-button,
.w3-bar-block .w3-dropdown-click .w3-button {
  width: 100%;
  text-align: left;
  padding: 8px 16px;
}
.w3-main,
#main {
  transition: margin-left 0.4s;
}
.w3-modal {
  z-index: 3;
  display: none;
  padding-top: 100px;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgb(0, 0, 0);
  background-color: rgba(0, 0, 0, 0.4);
}
.w3-modal-content {
  margin: auto;
  background-color: #fff;
  position: relative;
  padding: 0;
  outline: 0;
  width: 600px;
}
.w3-bar {
  width: 100%;
  overflow: hidden;
}
.w3-center .w3-bar {
  display: inline-block;
  width: auto;
}
.w3-bar .w3-bar-item {
  padding: 8px 16px;
  float: left;
  width: auto;
  border: none;
  display: block;
  outline: 0;
}
.w3-bar .w3-dropdown-hover,
.w3-bar .w3-dropdown-click {
  position: static;
  float: left;
}
.w3-bar .w3-button {
  white-space: normal;
}
.w3-bar-block .w3-bar-item {
  width: 100%;
  display: block;
  padding: 8px 16px;
  text-align: left;
  border: none;
  white-space: normal;
  float: none;
  outline: 0;
}
.w3-bar-block.w3-center .w3-bar-item {
  text-align: center;
}
.w3-block {
  display: block;
  width: 100%;
}
.w3-responsive {
  display: block;
  overflow-x: auto;
}
.w3-container:after,
.w3-container:before,
.w3-panel:after,
.w3-panel:before,
.w3-row:after,
.w3-row:before,
.w3-row-padding:after,
.w3-row-padding:before,
.w3-cell-row:before,
.w3-cell-row:after,
.w3-clear:after,
.w3-clear:before,
.w3-bar:before,
.w3-bar:after {
  content: "";
  display: table;
  clear: both;
}
.w3-col,
.w3-half,
.w3-third,
.w3-twothird,
.w3-threequarter,
.w3-quarter {
  float: left;
  width: 100%;
}
.w3-col.s1 {
  width: 8.33333%;
}
.w3-col.s2 {
  width: 16.66666%;
}
.w3-col.s3 {
  width: 24.99999%;
}
.w3-col.s4 {
  width: 33.33333%;
}
.w3-col.s5 {
  width: 41.66666%;
}
.w3-col.s6 {
  width: 49.99999%;
}
.w3-col.s7 {
  width: 58.33333%;
}
.w3-col.s8 {
  width: 66.66666%;
}
.w3-col.s9 {
  width: 74.99999%;
}
.w3-col.s10 {
  width: 83.33333%;
}
.w3-col.s11 {
  width: 91.66666%;
}
.w3-col.s12 {
  width: 99.99999%;
}
@media (min-width: 601px) {
  .w3-col.m1 {
    width: 8.33333%;
  }
  .w3-col.m2 {
    width: 16.66666%;
  }
  .w3-col.m3,
  .w3-quarter {
    width: 24.99999%;
  }
  .w3-col.m4,
  .w3-third {
    width: 33.33333%;
  }
  .w3-col.m5 {
    width: 41.66666%;
  }
  .w3-col.m6,
  .w3-half {
    width: 49.99999%;
  }
  .w3-col.m7 {
    width: 58.33333%;
  }
  .w3-col.m8,
  .w3-twothird {
    width: 66.66666%;
  }
  .w3-col.m9,
  .w3-threequarter {
    width: 74.99999%;
  }
  .w3-col.m10 {
    width: 83.33333%;
  }
  .w3-col.m11 {
    width: 91.66666%;
  }
  .w3-col.m12 {
    width: 99.99999%;
  }
}
@media (min-width: 993px) {
  .w3-col.l1 {
    width: 8.33333%;
  }
  .w3-col.l2 {
    width: 16.66666%;
  }
  .w3-col.l3 {
    width: 24.99999%;
  }
  .w3-col.l4 {
    width: 33.33333%;
  }
  .w3-col.l5 {
    width: 41.66666%;
  }
  .w3-col.l6 {
    width: 49.99999%;
  }
  .w3-col.l7 {
    width: 58.33333%;
  }
  .w3-col.l8 {
    width: 66.66666%;
  }
  .w3-col.l9 {
    width: 74.99999%;
  }
  .w3-col.l10 {
    width: 83.33333%;
  }
  .w3-col.l11 {
    width: 91.66666%;
  }
  .w3-col.l12 {
    width: 99.99999%;
  }
}
.w3-rest {
  overflow: hidden;
}
.w3-stretch {
  margin-left: -16px;
  margin-right: -16px;
}
.w3-content,
.w3-auto {
  margin-left: auto;
  margin-right: auto;
}
.w3-content {
  max-width: 980px;
}
.w3-auto {
  max-width: 1140px;
}
.w3-cell-row {
  display: table;
  width: 100%;
}
.w3-cell {
  display: table-cell;
}
.w3-cell-top {
  vertical-align: top;
}
.w3-cell-middle {
  vertical-align: middle;
}
.w3-cell-bottom {
  vertical-align: bottom;
}
.w3-hide {
  display: none !important;
}
.w3-show-block,
.w3-show {
  display: block !important;
}
.w3-show-inline-block {
  display: inline-block !important;
}
@media (max-width: 1205px) {
  .w3-auto {
    max-width: 95%;
  }
}
@media (max-width: 600px) {
  .w3-modal-content {
    margin: 0 10px;
    width: auto !important;
  }
  .w3-modal {
    padding-top: 30px;
  }
  .w3-dropdown-hover.w3-mobile .w3-dropdown-content,
  .w3-dropdown-click.w3-mobile .w3-dropdown-content {
    position: relative;
  }
  .w3-hide-small {
    display: none !important;
  }
  .w3-mobile {
    display: block;
    width: 100% !important;
  }
  .w3-bar-item.w3-mobile,
  .w3-dropdown-hover.w3-mobile,
  .w3-dropdown-click.w3-mobile {
    text-align: center;
  }
  .w3-dropdown-hover.w3-mobile,
  .w3-dropdown-hover.w3-mobile .w3-btn,
  .w3-dropdown-hover.w3-mobile .w3-button,
  .w3-dropdown-click.w3-mobile,
  .w3-dropdown-click.w3-mobile .w3-btn,
  .w3-dropdown-click.w3-mobile .w3-button {
    width: 100%;
  }
}
@media (max-width: 768px) {
  .w3-modal-content {
    width: 500px;
  }
  .w3-modal {
    padding-top: 50px;
  }
}
@media (min-width: 993px) {
  .w3-modal-content {
    width: 900px;
  }
  .w3-hide-large {
    display: none !important;
  }
  .w3-sidebar.w3-collapse {
    display: block !important;
  }
}
@media (max-width: 992px) and (min-width: 601px) {
  .w3-hide-medium {
    display: none !important;
  }
}
@media (max-width: 992px) {
  .w3-sidebar.w3-collapse {
    display: none;
  }

.w3-main {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .w3-auto {
    max-width: 100%;
  }
}
.w3-top,
.w3-bottom {
  position: fixed;
  width: 100%;
  z-index: 1;
}
.w3-top {
  top: 0;
}
.w3-bottom {
  bottom: 0;
}
.w3-overlay {
  position: fixed;
  display: none;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 2;
}

.w3-display-topleft {
	position: absolute;
	left: 0;
	top: 0;
  }
  .w3-display-topright {
	position: absolute;
	right: 0;
	top: 0;
  }
  .w3-display-bottomleft {
	position: absolute;
	left: 0;
	bottom: 0;
  }
  .w3-display-bottomright {
	position: absolute;
	right: 0;
	bottom: 0;
  }
  .w3-display-middle {
	position: absolute;
	top: 50%;
	left: 70%;
	transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
  }
  .w3-display-left {
	position: absolute;
	top: 50%;
	left: 0%;
	transform: translate(0%, -50%);
	-ms-transform: translate(-0%, -50%);
  }
  .w3-display-right {
	position: absolute;
	top: 50%;
	right: 0%;
	transform: translate(0%, -50%);
	-ms-transform: translate(0%, -50%);
  }
  .w3-display-topmiddle {
	position: absolute;
	left: 50%;
	top: 0;
	transform: translate(-50%, 0%);
	-ms-transform: translate(-50%, 0%);
  }
  .w3-display-bottommiddle {
	position: absolute;
	left: 50%;
	bottom: 0;
	transform: translate(-50%, 0%);
	-ms-transform: translate(-50%, 0%);
  }
  .w3-display-container:hover .w3-display-hover {
	display: block;
  }
  .w3-display-container:hover span.w3-display-hover {
	display: inline-block;
  }
  .w3-display-hover {
	display: none;
  }
  .w3-display-position {
	position: absolute;
  }
  .w3-circle {
	border-radius: 50%;
  }
  .w3-round-small {
	border-radius: 2px;
  }
  .w3-round,
  .w3-round-medium {
	border-radius: 4px;
  }
  .w3-round-large {
	border-radius: 8px;
  }
  .w3-round-xlarge {
	border-radius: 16px;
  }
  .w3-round-xxlarge {
	border-radius: 32px;
  }
  .w3-row-padding,
  .w3-row-padding > .w3-half,
  .w3-row-padding > .w3-third,
  .w3-row-padding > .w3-twothird,
  .w3-row-padding > .w3-threequarter,
  .w3-row-padding > .w3-quarter,
  .w3-row-padding > .w3-col {
	padding: 0 8px;
  }
.w3-container,
.w3-panel {
  padding: 0.01em 16px;
}
.w3-panel {
  margin-top: 16px;
  margin-bottom: 16px;
}
.w3-code,
.w3-codespan {
  font-family: Consolas, "courier new";
  font-size: 16px;
}
.w3-code {
  width: auto;
  background-color: #fff;
  padding: 8px 12px;
  border-left: 4px solid #4caf50;
  word-wrap: break-word;
}
.w3-codespan {
  color: crimson;
  background-color: #f1f1f1;
  padding-left: 4px;
  padding-right: 4px;
  font-size: 110%;
}
  .w3-card,
  .w3-card-2 {
	box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
  }
  .w3-card-4,
  .w3-hover-shadow:hover {
	box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2), 0 4px 20px 0 rgba(0, 0, 0, 0.19);
  }
  .w3-spin {
	animation: w3-spin 2s infinite linear;
  }
  @keyframes w3-spin {
	0% {
	  transform: rotate(0deg);
	}
	100% {
	  transform: rotate(359deg);
	}
  }
  .w3-animate-fading {
	animation: fading 10s infinite;
  }
  @keyframes fading {
	0% {
	  opacity: 0;
	}
	50% {
	  opacity: 1;
	}
	100% {
	  opacity: 0;
	}
  }
  .w3-animate-opacity {
	animation: opac 0.8s;
  }
  @keyframes opac {
	from {
	  opacity: 0;
	}
	to {
	  opacity: 1;
	}
  }
  .w3-animate-top {
	position: relative;
	animation: animatetop 0.4s;
  }
  @keyframes animatetop {
	from {
	  top: -300px;
	  opacity: 0;
	}
	to {
	  top: 0;
	  opacity: 1;
	}
  }
  .w3-animate-left {
	position: relative;
	animation: animateleft 0.4s;
  }
  @keyframes animateleft {
	from {
	  left: -300px;
	  opacity: 0;
	}
	to {
	  left: 0;
	  opacity: 1;
	}
  }
  .w3-animate-right {
	position: relative;
	animation: animateright 0.4s;
  }
  @keyframes animateright {
	from {
	  right: -300px;
	  opacity: 0;
	}
	to {
	  right: 0;
	  opacity: 1;
	}
  }
  .w3-animate-bottom {
	position: relative;
	animation: animatebottom 0.4s;
  }
  @keyframes animatebottom {
	from {
	  bottom: -300px;
	  opacity: 0;
	}
	to {
	  bottom: 0;
	  opacity: 1;
	}
  }
  .w3-animate-zoom {
	animation: animatezoom 0.6s;
  }
  @keyframes animatezoom {
	from {
	  transform: scale(0);
	}
	to {
	  transform: scale(1);
	}
  }
  .w3-animate-input {
	transition: width 0.4s ease-in-out;
  }
  .w3-animate-input:focus {
	width: 100% !important;
  }
  .w3-opacity,
  .w3-hover-opacity:hover {
	opacity: 0.6;
  }
  .w3-opacity-off,
  .w3-hover-opacity-off:hover {
	opacity: 1;
  }
  .w3-opacity-max {
	opacity: 0.25;
  }
  .w3-opacity-min {
	opacity: 0.75;
  }
  .w3-greyscale-max,
  .w3-grayscale-max,
  .w3-hover-greyscale:hover,
  .w3-hover-grayscale:hover {
	filter: grayscale(100%);
  }
  .w3-greyscale,
  .w3-grayscale {
	filter: grayscale(75%);
  }
  .w3-greyscale-min,
  .w3-grayscale-min {
	filter: grayscale(50%);
  }
  .w3-sepia {
	filter: sepia(75%);
  }
  .w3-sepia-max,
  .w3-hover-sepia:hover {
	filter: sepia(100%);
  }
  .w3-sepia-min {
	filter: sepia(50%);
  }
  .w3-tiny {
	font-size: 10px !important;
  }
  .w3-small {
	font-size: 12px !important;
  }
  .w3-medium {
	font-size: 15px !important;
  }
  .w3-large {
	font-size: 18px !important;
  }
  .w3-xlarge {
	font-size: 24px !important;
  }
  .w3-xxlarge {
	font-size: 36px !important;
  }
  .w3-xxxlarge {
	font-size: 48px !important;
  }
  .w3-jumbo {
	font-size: 64px !important;
  }
  .w3-left-align {
	text-align: left !important;
  }
  .w3-right-align {
	text-align: right !important;
  }
  .w3-justify {
	text-align: justify !important;
  }
  .w3-center {
	text-align: center !important;
  }
  .w3-border-0 {
	border: 0 !important;
  }
  .w3-border {
	border: 1px solid #ccc !important;
  }
  .w3-border-top {
	border-top: 1px solid #ccc !important;
  }
  .w3-border-bottom {
	border-bottom: 1px solid #ccc !important;
  }
  .w3-border-left {
	border-left: 1px solid #ccc !important;
  }
  .w3-border-right {
	border-right: 1px solid #ccc !important;
  }
  .w3-topbar {
	border-top: 6px solid #ccc !important;
  }
  .w3-bottombar {
	border-bottom: 6px solid #ccc !important;
  }
  .w3-leftbar {
	border-left: 6px solid #ccc !important;
  }
  .w3-rightbar {
	border-right: 6px solid #ccc !important;
  }
  .w3-section,
  .w3-code {
	margin-top: 16px !important;
	margin-bottom: 16px !important;
  }
  .w3-margin {
	margin: 16px !important;
  }
  .w3-margin-top {
	margin-top: 16px !important;
  }
  .w3-margin-bottom {
	margin-bottom: 16px !important;
  }
  .w3-margin-left {
	margin-left: 16px !important;
  }
  .w3-margin-right {
	margin-right: 16px !important;
  }
  .w3-padding-small {
	padding: 4px 8px !important;
  }
  .w3-padding {
	padding: 8px 16px !important;
  }
  .w3-padding-large {
	padding: 12px 24px !important;
  }
  .w3-padding-16 {
	padding-top: 16px !important;
	padding-bottom: 16px !important;
  }
  .w3-padding-24 {
	padding-top: 24px !important;
	padding-bottom: 24px !important;
  }
  .w3-padding-32 {
	padding-top: 32px !important;
	padding-bottom: 32px !important;
  }
  .w3-padding-48 {
	padding-top: 48px !important;
	padding-bottom: 48px !important;
  }
  .w3-padding-64 {
	padding-top: 64px !important;
	padding-bottom: 64px !important;
  }
  .w3-padding-top-64 {
	padding-top: 64px !important;
  }
  .w3-padding-top-48 {
	padding-top: 48px !important;
  }
  .w3-padding-top-32 {
	padding-top: 32px !important;
  }
  .w3-padding-top-24 {
	padding-top: 24px !important;
  }
  .w3-left {
	float: left !important;
  }
  .w3-right {
	float: right !important;
  }
  .w3-button:hover {
	color: #000 !important;
	background-color: #ccc !important;
  }
  .w3-transparent,
  .w3-hover-none:hover {
	background-color: transparent !important;
  }
  .w3-hover-none:hover {
	box-shadow: none !important;
  }
  /* Colors */
  .w3-amber,
  .w3-hover-amber:hover {
	color: #000 !important;
	background-color: #ffc107 !important;
  }
  .w3-aqua,
  .w3-hover-aqua:hover {
	color: #000 !important;
	background-color: #00ffff !important;
  }
  .w3-blue,
  .w3-hover-blue:hover {
	color: #fff !important;
	background-color: #2196f3 !important;
  }
  .w3-light-blue,
  .w3-hover-light-blue:hover {
	color: #000 !important;
	background-color: #87ceeb !important;
  }
  .w3-brown,
  .w3-hover-brown:hover {
	color: #fff !important;
	background-color: #795548 !important;
  }
  .w3-cyan,
  .w3-hover-cyan:hover {
	color: #000 !important;
	background-color: #00bcd4 !important;
  }
  .w3-blue-grey,
  .w3-hover-blue-grey:hover,
  .w3-blue-gray,
  .w3-hover-blue-gray:hover {
	color: #fff !important;
	background-color: #607d8b !important;
  }
  .w3-green,
  .w3-hover-green:hover {
	color: #fff !important;
	background-color: #4caf50 !important;
  }
  .w3-light-green,
  .w3-hover-light-green:hover {
	color: #000 !important;
	background-color: #8bc34a !important;
  }
  .w3-indigo,
  .w3-hover-indigo:hover {
	color: #fff !important;
	background-color: #3f51b5 !important;
  }
  .w3-khaki,
  .w3-hover-khaki:hover {
	color: #000 !important;
	background-color: #f0e68c !important;
  }
  .w3-lime,
  .w3-hover-lime:hover {
	color: #000 !important;
	background-color: #cddc39 !important;
  }
  .w3-orange,
  .w3-hover-orange:hover {
	color: #000 !important;
	background-color: #ff9800 !important;
  }
  .w3-deep-orange,
  .w3-hover-deep-orange:hover {
	color: #fff !important;
	background-color: #ff5722 !important;
  }
  .w3-pink,
  .w3-hover-pink:hover {
	color: #fff !important;
	background-color: #e91e63 !important;
  }
  .w3-purple,
  .w3-hover-purple:hover {
	color: #fff !important;
	background-color: #9c27b0 !important;
  }
  .w3-deep-purple,
  .w3-hover-deep-purple:hover {
	color: #fff !important;
	background-color: #673ab7 !important;
  }
  .w3-red,
  .w3-hover-red:hover {
	color: #fff !important;
	background-color: #f44336 !important;
  }
  .w3-sand,
  .w3-hover-sand:hover {
	color: #000 !important;
	background-color: #fdf5e6 !important;
  }
  .w3-teal,
  .w3-hover-teal:hover {
	color: #fff !important;
	background-color: #009688 !important;
  }
  .w3-yellow,
  .w3-hover-yellow:hover {
	color: #000 !important;
	background-color: #ffeb3b !important;
  }
  .w3-white,
  .w3-hover-white:hover {
	color: #000 !important;
	background-color: #fff !important;
  }
  .w3-black,
  .w3-hover-black:hover {
	color: #fff !important;
	background-color: #000 !important;
  }
  .w3-grey,
  .w3-hover-grey:hover,
  .w3-gray,
  .w3-hover-gray:hover {
	color: #000 !important;
	background-color: #9e9e9e !important;
  }
  .w3-light-grey,
  .w3-hover-light-grey:hover,
  .w3-light-gray,
  .w3-hover-light-gray:hover {
	color: #000 !important;
	background-color: #f1f1f1 !important;
  }
  .w3-dark-grey,
  .w3-hover-dark-grey:hover,
  .w3-dark-gray,
  .w3-hover-dark-gray:hover {
	color: #fff !important;
	background-color: #616161 !important;
  }
  .w3-pale-red,
  .w3-hover-pale-red:hover {
	color: #000 !important;
	background-color: #ffdddd !important;
  }
  .w3-pale-green,
  .w3-hover-pale-green:hover {
	color: #000 !important;
	background-color: #ddffdd !important;
  }
  .w3-pale-yellow,
  .w3-hover-pale-yellow:hover {
	color: #000 !important;
	background-color: #ffffcc !important;
  }
  .w3-pale-blue,
  .w3-hover-pale-blue:hover {
	color: #000 !important;
	background-color: #ddffff !important;
  }
  .w3-text-amber,
  .w3-hover-text-amber:hover {
	color: #ffc107 !important;
  }
  .w3-text-aqua,
  .w3-hover-text-aqua:hover {
	color: #00ffff !important;
  }
  .w3-text-blue,
  .w3-hover-text-blue:hover {
	color: #2196f3 !important;
  }
  .w3-text-light-blue,
  .w3-hover-text-light-blue:hover {
	color: #87ceeb !important;
  }
  .w3-text-brown,
  .w3-hover-text-brown:hover {
	color: #795548 !important;
  }
  .w3-text-cyan,
  .w3-hover-text-cyan:hover {
	color: #00bcd4 !important;
  }
  .w3-text-blue-grey,
  .w3-hover-text-blue-grey:hover,
  .w3-text-blue-gray,
  .w3-hover-text-blue-gray:hover {
	color: #607d8b !important;
  }
  .w3-text-green,
  .w3-hover-text-green:hover {
	color: #4caf50 !important;
  }
  .w3-text-light-green,
  .w3-hover-text-light-green:hover {
	color: #8bc34a !important;
  }
  .w3-text-indigo,
  .w3-hover-text-indigo:hover {
	color: #3f51b5 !important;
  }
  .w3-text-khaki,
  .w3-hover-text-khaki:hover {
	color: #b4aa50 !important;
  }
  .w3-text-lime,
  .w3-hover-text-lime:hover {
	color: #cddc39 !important;
  }
  .w3-text-orange,
  .w3-hover-text-orange:hover {
	color: #ff9800 !important;
  }
  .w3-text-deep-orange,
  .w3-hover-text-deep-orange:hover {
	color: #34465a !important;
  }
  .w3-text-pink,
  .w3-hover-text-pink:hover {
	color:#34465a !important;
  }
  .w3-text-purple,
  .w3-hover-text-purple:hover {
	color: #9c27b0 !important;
  }
  .w3-text-deep-purple,
  .w3-hover-text-deep-purple:hover {
	color: #673ab7 !important;
  }
  .w3-text-red,
  .w3-hover-text-red:hover {
	color: #34465a !important;
  }
  .w3-text-sand,
  .w3-hover-text-sand:hover {
	color: #fdf5e6 !important;
  }
  .w3-text-teal,
  .w3-hover-text-teal:hover {
	color: #009688 !important;
  }
  .w3-text-yellow,
  .w3-hover-text-yellow:hover {
	color: #d2be0e !important;
  }
  .w3-text-white,
  .w3-hover-text-white:hover {
	color: #fff !important;
  }
  .w3-text-black,
  .w3-hover-text-black:hover {
	color: #000 !important;
  }
  .w3-text-grey,
  .w3-hover-text-grey:hover,
  .w3-text-gray,
  .w3-hover-text-gray:hover {
	color: #757575 !important;
  }
  .w3-text-light-grey,
  .w3-hover-text-light-grey:hover,
  .w3-text-light-gray,
  .w3-hover-text-light-gray:hover {
	color: #f1f1f1 !important;
  }
  .w3-text-dark-grey,
  .w3-hover-text-dark-grey:hover,
  .w3-text-dark-gray,
  .w3-hover-text-dark-gray:hover {
	color: #3a3a3a !important;
  }
  .w3-border-amber,
  .w3-hover-border-amber:hover {
	border-color: #ffc107 !important;
  }
  .w3-border-aqua,
  .w3-hover-border-aqua:hover {
	border-color: #00ffff !important;
  }
  .w3-border-blue,
  .w3-hover-border-blue:hover {
	border-color: #2196f3 !important;
  }
  .w3-border-light-blue,
  .w3-hover-border-light-blue:hover {
	border-color: #87ceeb !important;
  }
  .w3-border-brown,
  .w3-hover-border-brown:hover {
	border-color: #795548 !important;
  }
  .w3-border-cyan,
  .w3-hover-border-cyan:hover {
	border-color: #00bcd4 !important;
  }
  .w3-border-blue-grey,
  .w3-hover-border-blue-grey:hover,
  .w3-border-blue-gray,
  .w3-hover-border-blue-gray:hover {
	border-color: #607d8b !important;
  }
  .w3-border-green,
  .w3-hover-border-green:hover {
	border-color: #4caf50 !important;
  }
  .w3-border-light-green,
  .w3-hover-border-light-green:hover {
	border-color: #8bc34a !important;
  }
  .w3-border-indigo,
  .w3-hover-border-indigo:hover {
	border-color: #3f51b5 !important;
  }
  .w3-border-khaki,
  .w3-hover-border-khaki:hover {
	border-color: #f0e68c !important;
  }
  .w3-border-lime,
  .w3-hover-border-lime:hover {
	border-color: #cddc39 !important;
  }
  .w3-border-orange,
  .w3-hover-border-orange:hover {
	border-color: #ff9800 !important;
  }
  .w3-border-deep-orange,
  .w3-hover-border-deep-orange:hover {
	border-color: #ff5722 !important;
  }
  .w3-border-pink,
  .w3-hover-border-pink:hover {
	border-color: #e91e63 !important;
  }
  .w3-border-purple,
  .w3-hover-border-purple:hover {
	border-color: #9c27b0 !important;
  }
  .w3-border-deep-purple,
  .w3-hover-border-deep-purple:hover {
	border-color: #673ab7 !important;
  }
  .w3-border-red,
  .w3-hover-border-red:hover {
	border-color: #f44336 !important;
  }
  .w3-border-sand,
  .w3-hover-border-sand:hover {
	border-color: #fdf5e6 !important;
  }
  .w3-border-teal,
  .w3-hover-border-teal:hover {
	border-color: #009688 !important;
  }
  .w3-border-yellow,
  .w3-hover-border-yellow:hover {
	border-color: #ffeb3b !important;
  }
  .w3-border-white,
  .w3-hover-border-white:hover {
	border-color: #fff !important;
  }
  .w3-border-black,
  .w3-hover-border-black:hover {
	border-color: #000 !important;
  }
  .w3-border-grey,
  .w3-hover-border-grey:hover,
  .w3-border-gray,
  .w3-hover-border-gray:hover {
	border-color: #9e9e9e !important;
  }
  .w3-border-light-grey,
  .w3-hover-border-light-grey:hover,
  .w3-border-light-gray,
  .w3-hover-border-light-gray:hover {
	border-color: #f1f1f1 !important;
  }
  .w3-border-dark-grey,
  .w3-hover-border-dark-grey:hover,
  .w3-border-dark-gray,
  .w3-hover-border-dark-gray:hover {
	border-color: #616161 !important;
  }
  .w3-border-pale-red,
  .w3-hover-border-pale-red:hover {
	border-color: #ffe7e7 !important;
  }
  .w3-border-pale-green,
  .w3-hover-border-pale-green:hover {
	border-color: #e7ffe7 !important;
  }
  .w3-border-pale-yellow,
  .w3-hover-border-pale-yellow:hover {
	border-color: #ffffcc !important;
  }
  .w3-border-pale-blue,
  .w3-hover-border-pale-blue:hover {
	border-color: #e7ffff !important;
  }
/*================================================*/

.doc2026{

margin-top:40px;

text-align:center;

}

/*================================================*/

.doc2026__viewer{

background:#ffffff;

padding:15px;

border-radius:12px;

box-shadow:0 0 20px rgba(0,0,0,.15);

}

/*================================================*/

.doc2026__viewer img{

    transition:opacity .3s ease;

}

/*================================================*/

.doc2026__viewer img{

width:100%;

width:auto;

max-height:700px;

display:block;

margin:auto;

border-radius:8px;

transition:opacity .35s;

}



.doc2026__toolbar{

margin-top:20px;

display:flex;

flex-wrap:wrap;

justify-content:center;

gap:12px;

}



.doc2026__toolbar button{

padding:10px 22px;

border:none;

border-radius:8px;

cursor:pointer;

background:#4d6578;

color:white;

font-size:16px;

}



.doc2026__toolbar button:hover{

background:#2c4456;

}



.doc2026__toolbar select{

padding:10px;

font-size:16px;

}



.doc2026__counter{

margin-top:20px;

font-size:22px;

font-weight:bold;

}



@media(max-width:768px){

.doc2026__toolbar{

flex-direction:column;

}

.doc2026__toolbar button{

width:100%;

}

.doc2026__toolbar select{

width:100%;

}

}

/* =====================================================
   Документы 2026: просмотрщик, миниатюры, PHP-список
   ===================================================== */

.doc2026{
    margin: 40px auto 0 auto;
    text-align: center;
    max-width: 1200px;
}

.doc2026__viewer{
    background: #ffffff;
    padding: 15px;
    border-radius: 12px;
    box-shadow: 0 0 20px rgba(0,0,0,.15);
    min-height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.doc2026__viewer img{
    width: auto;
    max-width: 100%;
    max-height: 700px;
    display: block;
    margin: auto;
    border-radius: 8px;
    transition: opacity .3s ease;
}

.doc2026__toolbar{
    margin-top: 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
}

.doc2026__toolbar button,
.doc2026__toolbar select{
    min-height: 48px;
    padding: 10px 22px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 700;
}

.doc2026__toolbar button{
    border: none;
    cursor: pointer;
    background: rgba(13, 92, 99, 1);
    color: #ffffff;
    box-shadow: 0 10px 20px rgba(68, 81, 98, .35);
}

.doc2026__toolbar button:hover{
    background: rgba(133, 9, 9, 1);
}

.doc2026__toolbar select{
    border: 1px solid rgba(13, 92, 99, .35);
    color: rgba(13, 92, 99, 1);
    background: #ffffff;
}

.doc2026__counter{
    margin-top: 20px;
    font-size: 26px;
    line-height: 1.4;
    font-weight: 800;
    color: rgba(13, 92, 99, 1);
}

.doc2026__message{
    margin: 15px auto 0 auto;
    min-height: 26px;
    font-size: 16px;
    font-weight: 700;
    color:#34465a;
}

.doc2026__thumbs-wrap{
    margin-top: 35px;
    padding: 16px;
    border: 1px solid rgba(13, 92, 99, .18);
    border-radius: 12px;
    background: rgba(158, 187, 142, .10);
    text-align: left;
}

.doc2026__thumbs-title{
    margin: 0 0 14px 0;
    font-size: 16px;
    font-weight: 800;
    color: rgba(13, 92, 99, 1);
}

.doc2026__thumbs{
    display: flex;
    gap: 12px;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 8px 2px 14px 2px;
    scroll-behavior: smooth;
}

.doc2026__thumb{
    flex: 0 0 108px;
    border: 2px solid transparent;
    border-radius: 10px;
    background: #ffffff;
    cursor: pointer;
    padding: 7px;
    color: rgba(13, 92, 99, 1);
    box-shadow: 0 5px 15px rgba(0,0,0,.10);
    transition: transform .2s ease, border-color .2s ease, background-color .2s ease;
}

.doc2026__thumb:hover{
    transform: translateY(-2px);
    border-color: rgba(13, 92, 99, .45);
}

.doc2026__thumb.active{
    border-color: rgba(133, 9, 9, 1);
    background: rgba(158, 187, 142, .18);
}

.doc2026__thumb img{
    width: 100%;
    height: 125px;
    display: block;
    object-fit: cover;
    border-radius: 6px;
    background: #f5f5f5;
}

.doc2026__thumb span{
    display: block;
    margin-top: 7px;
    font-size: 12px;
    line-height: 1.25;
    font-weight: 800;
    text-align: center;
    word-break: break-word;
}

@media(max-width: 768px){
    .doc2026__viewer{
        padding: 8px;
    }

    .doc2026__viewer img{
        max-height: 72vh;
    }

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

    .doc2026__toolbar button,
    .doc2026__toolbar select{
        width: 100%;
    }

    .doc2026__thumb{
        flex-basis: 92px;
    }

    .doc2026__thumb img{
        height: 108px;
    }
}

/* =====================================================
   GLOBAL FONT FIX — Montserrat for entire site
   ===================================================== */
html,
body,
body * {
    font-family: "Montserrat", Arial, sans-serif;
}

/* Preserve icon fonts if used */
.fa,
.fas,
.far,
.fab,
[class^="fa-"],
[class*=" fa-"] {
    font-family: "FontAwesome", "Font Awesome 5 Free", "Font Awesome 5 Brands" !important;
}

/* =====================================================
   PARALLAX FIX FOR documentation.html
   ===================================================== */
.bgimg-1,
.bgimg-2,
.bgimg-3 {
    background-attachment: scroll;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

.bgimg-1 {
    background-image: url("../img/parallax1.webp");
    min-height: 720px;
}

.bgimg-2 {
    background-image: url("../img/parallax0.webp");
    min-height: 400px;
}

.bgimg-3 {
    background-image: url("../img/parallax400.webp");
    min-height: 40%;
}

@media (max-width: 770px) {
    .bgimg-1 {
        min-height: 520px;
    }
}

@media (max-width: 480px) {
    .bgimg-1 {
        min-height: 420px;
    }
}



.doc2026__zoom-hint{
    display:none;
    margin: 8px 0 0 0;
    font-size: 15px;
    font-weight: 700;
    text-align: center;
    color: rgba(13, 92, 99, 1);
}

/* =====================================================
   Fullscreen mode for Documents 2026
   Кнопки и миниатюры всегда остаются на экране.
   Документ занимает только доступное пространство между ними.
   ===================================================== */

#exitFullBtn{
    display: none;
}

.doc2026:fullscreen,
.doc2026:-webkit-full-screen{
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    background: #111;
    padding: 10px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.doc2026:fullscreen .doc2026__toolbar,
.doc2026:-webkit-full-screen .doc2026__toolbar{
    order: 1;
    flex: 0 0 auto;
    margin: 0 auto;
    padding: 8px;
    width: fit-content;
    max-width: calc(100vw - 20px);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    background: rgba(255,255,255,.94);
    border-radius: 12px;
    box-shadow: 0 8px 30px rgba(0,0,0,.35);
    z-index: 20;
}

.doc2026:fullscreen .doc2026__viewer,
.doc2026:-webkit-full-screen .doc2026__viewer{
    order: 2;
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    margin: 0 auto;
    padding: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: auto;
    background: #111;
    box-shadow: none;
}

.doc2026:fullscreen .doc2026__viewer img,
.doc2026:-webkit-full-screen .doc2026__viewer img{
    height: 100%;
    width: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    border-radius: 8px;
    box-shadow: 0 0 30px rgba(0,0,0,.55);
}

.doc2026:fullscreen .doc2026__counter,
.doc2026:-webkit-full-screen .doc2026__counter{
    order: 3;
    flex: 0 0 auto;
    margin: 0;
    color: #ffffff;
    font-size: 16px;
    line-height: 1.2;
}

.doc2026:fullscreen .doc2026__message,
.doc2026:-webkit-full-screen .doc2026__message{
    order: 4;
    flex: 0 0 auto;
    margin: 0;
    min-height: 18px;
    color: #ffffff;
    font-size: 14px;
    line-height: 1.2;
}


.doc2026:fullscreen .doc2026__zoom-hint,
.doc2026:-webkit-full-screen .doc2026__zoom-hint{
    order: 5;
    display:block;
    flex: 0 0 auto;
    margin: 0;
    padding: 5px 10px;
    color: #ffffff;
    font-size: 14px;
    line-height: 1.2;
    text-align:center;
    background: rgba(13,92,99,.75);
    border-radius: 8px;
}

.doc2026:fullscreen .doc2026__thumbs-wrap,
.doc2026:-webkit-full-screen .doc2026__thumbs-wrap{
    order: 6;
    flex: 0 0 auto;
    max-height: 124px;
    margin-top: 0;
    padding: 8px;
    overflow: hidden;
    background: rgba(255,255,255,.94);
    border-radius: 12px;
}

.doc2026:fullscreen .doc2026__thumbs-title,
.doc2026:-webkit-full-screen .doc2026__thumbs-title{
    margin-bottom: 6px;
    font-size: 13px;
    line-height: 1.1;
}

.doc2026:fullscreen .doc2026__thumbs,
.doc2026:-webkit-full-screen .doc2026__thumbs{
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    gap: 8px;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 4px;
}

.doc2026:fullscreen .doc2026__thumb,
.doc2026:-webkit-full-screen .doc2026__thumb{
    flex: 0 0 76px;
    width: 76px;
    padding: 4px;
}

.doc2026:fullscreen .doc2026__thumb img,
.doc2026:-webkit-full-screen .doc2026__thumb img{
    height: 62px;
    object-fit: cover;
}

.doc2026:fullscreen .doc2026__thumb span,
.doc2026:-webkit-full-screen .doc2026__thumb span{
    font-size: 11px;
    line-height: 1.1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media(max-width: 768px){
    .doc2026:fullscreen,
    .doc2026:-webkit-full-screen{
        padding: 6px;
        gap: 6px;
    }

    .doc2026:fullscreen .doc2026__viewer img,
    .doc2026:-webkit-full-screen .doc2026__viewer img{
        height: 100%;
    }

    .doc2026:fullscreen .doc2026__toolbar,
    .doc2026:-webkit-full-screen .doc2026__toolbar{
        width: calc(100vw - 12px);
        gap: 6px;
    }

    .doc2026:fullscreen .doc2026__toolbar button,
    .doc2026:-webkit-full-screen .doc2026__toolbar button,
    .doc2026:fullscreen .doc2026__toolbar select,
    .doc2026:-webkit-full-screen .doc2026__toolbar select{
        width: auto;
        padding: 7px 10px;
        font-size: 13px;
    }

    
.doc2026:fullscreen .doc2026__zoom-hint,
.doc2026:-webkit-full-screen .doc2026__zoom-hint{
    order: 5;
    display:block;
    flex: 0 0 auto;
    margin: 0;
    padding: 5px 10px;
    color: #ffffff;
    font-size: 14px;
    line-height: 1.2;
    text-align:center;
    background: rgba(13,92,99,.75);
    border-radius: 8px;
}

.doc2026:fullscreen .doc2026__thumbs-wrap,
    .doc2026:-webkit-full-screen .doc2026__thumbs-wrap{
        max-height: 104px;
        padding: 6px;
    }

    .doc2026:fullscreen .doc2026__thumb,
    .doc2026:-webkit-full-screen .doc2026__thumb{
        flex-basis: 66px;
        width: 66px;
    }

    .doc2026:fullscreen .doc2026__thumb img,
    .doc2026:-webkit-full-screen .doc2026__thumb img{
        height: 52px;
    }
}


/* ===================================================== */
/* FINAL CLEAN: Полный экран документов 2026 */
/* ===================================================== */

.doc2026:fullscreen,
.doc2026:-webkit-full-screen {
    width: 100vw !important;
    height: 100vh !important;
    margin: 0 !important;
    padding: 12px 16px 14px !important;
    display: grid !important;
    grid-template-rows: auto auto 1fr auto !important;
    gap: 8px !important;
    overflow: hidden !important;
    background:
        radial-gradient(circle at 50% 38%, rgba(255,255,255,.58) 0%, rgba(255,255,255,.22) 27%, rgba(255,255,255,0) 52%),
        linear-gradient(180deg, #7a1fe0 0%, #a55fe1 48%, #f4efff 100%) !important;
    color: #fff !important;
}

.doc2026:fullscreen .doc2026__toolbar,
.doc2026:-webkit-full-screen .doc2026__toolbar {
    margin: 0 !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    z-index: 80 !important;
}

.doc2026:fullscreen .doc2026__toolbar button,
.doc2026:fullscreen .doc2026__toolbar select,
.doc2026:-webkit-full-screen .doc2026__toolbar button,
.doc2026:-webkit-full-screen .doc2026__toolbar select {
    min-height: 32px !important;
    padding: 6px 13px !important;
    border-radius: 18px !important;
    background: rgba(255,255,255,.92) !important;
    color: #5c16b4 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    box-shadow: 0 8px 20px rgba(50,0,100,.20) !important;
}

.doc2026:fullscreen .doc2026__counter,
.doc2026:-webkit-full-screen .doc2026__counter {
    margin: 0 !important;
    color: #fff !important;
    font-size: 22px !important;
    text-shadow: 0 2px 10px rgba(0,0,0,.32) !important;
}

.doc2026:fullscreen .doc2026__message,
.doc2026:-webkit-full-screen .doc2026__message {
    min-height: 22px !important;
    margin: 0 !important;
    color: #fff !important;
    font-size: 13px !important;
    text-align: center !important;
    text-shadow: 0 2px 10px rgba(0,0,0,.32) !important;
}

.doc2026:fullscreen #doc2026ZoomHint,
.doc2026:-webkit-full-screen #doc2026ZoomHint {
    display: none !important;
}

.doc2026:fullscreen .doc2026__viewer,
.doc2026:-webkit-full-screen .doc2026__viewer {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    overflow: hidden !important;
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    perspective: 1600px !important;
}

.doc2026:fullscreen .doc2026__viewer > img#doc2026Image,
.doc2026:-webkit-full-screen .doc2026__viewer > img#doc2026Image {
    display: none !important;
}

.doc2026__fs-tape {
    display: none;
}

.doc2026:fullscreen .doc2026__fs-tape,
.doc2026:-webkit-full-screen .doc2026__fs-tape {
    display: flex !important;
    width: 100% !important;
    height: 100% !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    cursor: grab !important;
    user-select: none !important;
    touch-action: pan-y !important;
}

.doc2026:fullscreen .doc2026__fs-tape.dragging,
.doc2026:-webkit-full-screen .doc2026__fs-tape.dragging {
    cursor: grabbing !important;
}

.doc2026__fs-help {
    position: absolute;
    left: 50%;
    bottom: 12px;
    transform: translateX(-50%);
    z-index: 500;
    padding: 5px 12px;
    border-radius: 20px;
    background: rgba(80,20,150,.72);
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    pointer-events: none;
}

.doc2026__fs-track {
    position: relative;
    width: 100%;
    height: 100%;
}

.doc2026__fs-card {
    position: absolute;
    left: 50%;
    top: 50%;
    width: min(23vw, 360px);
    height: min(58vh, calc(100vh - 230px));
    max-height: 58vh;
    aspect-ratio: .707 / 1;
    border-radius: 18px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 22px 48px rgba(44,0,94,.32);
    transform:
        translate(-50%, -50%)
        translateX(var(--x, 0px))
        rotateY(var(--rotate, 0deg))
        scale(var(--scale, 1));
    transform-origin: center center;
    transition: transform .42s cubic-bezier(.22,.8,.24,1), opacity .35s ease, box-shadow .35s ease;
    will-change: transform, opacity;
}

.doc2026__fs-card.active {
    box-shadow:
        0 0 0 9px rgba(255,255,255,.84),
        0 28px 62px rgba(44,0,94,.44);
}

.doc2026__fs-card img {
    display: block !important;
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: #fff;
    pointer-events: none;
}

.doc2026__fs-card strong {
    position: absolute;
    left: 10px;
    bottom: 10px;
    max-width: calc(100% - 20px);
    padding: 5px 10px;
    border-radius: 12px;
    background: rgba(30,30,30,.58);
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.doc2026:fullscreen .doc2026__thumbs-wrap,
.doc2026:-webkit-full-screen .doc2026__thumbs-wrap {
    width: 100% !important;
    margin: 0 !important;
    padding: 10px 18px !important;
    border-radius: 22px !important;
    background: rgba(255,255,255,.70) !important;
    box-shadow: 0 -8px 30px rgba(80,20,150,.15) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
}

.doc2026:fullscreen .doc2026__thumbs-title,
.doc2026:-webkit-full-screen .doc2026__thumbs-title {
    display: none !important;
}

.doc2026:fullscreen .doc2026__thumbs,
.doc2026:-webkit-full-screen .doc2026__thumbs {
    width: 100% !important;
    display: flex !important;
    justify-content: space-between !important;
    gap: 10px !important;
    overflow-x: auto !important;
    padding: 0 0 4px !important;
    scroll-behavior: auto !important;
}

.doc2026:fullscreen .doc2026__thumb,
.doc2026:-webkit-full-screen .doc2026__thumb {
    flex: 0 0 82px !important;
    width: 82px !important;
    padding: 5px !important;
    border-radius: 12px !important;
    background: rgba(255,255,255,.88) !important;
    border: 2px solid transparent !important;
}

.doc2026:fullscreen .doc2026__thumb.active,
.doc2026:-webkit-full-screen .doc2026__thumb.active {
    border-color: #7a1fe0 !important;
    box-shadow: 0 0 0 3px rgba(122,31,224,.16) !important;
}

.doc2026:fullscreen .doc2026__thumb img,
.doc2026:-webkit-full-screen .doc2026__thumb img {
    height: 70px !important;
    object-fit: cover !important;
    border-radius: 8px !important;
}

.doc2026:fullscreen .doc2026__thumb span,
.doc2026:-webkit-full-screen .doc2026__thumb span {
    display: block !important;
    margin-top: 6px !important;
    font-size: 11px !important;
    line-height: 1.1 !important;
    color: #5c16b4 !important;
    font-weight: 900 !important;
    text-align: center !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

@media (max-width: 900px) {
    .doc2026__fs-card {
        width: 44vw;
        height: min(52vh, calc(100vh - 230px));
    }

    .doc2026:fullscreen .doc2026__thumb,
    .doc2026:-webkit-full-screen .doc2026__thumb {
        flex-basis: 72px !important;
        width: 72px !important;
    }
}


/* ===================================================== */
/* HOTFIX: видимость документов в полноэкранной ленте */
/* ===================================================== */

.doc2026:fullscreen .doc2026__fs-track,
.doc2026:-webkit-full-screen .doc2026__fs-track {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    height: 100% !important;
    overflow: visible !important;
    z-index: 20 !important;
}

.doc2026:fullscreen .doc2026__fs-card,
.doc2026:-webkit-full-screen .doc2026__fs-card {
    display: block !important;
    visibility: visible !important;
    z-index: 50;
}

.doc2026:fullscreen .doc2026__fs-card img,
.doc2026:-webkit-full-screen .doc2026__fs-card img {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    background: #fff !important;
}


/* ===================================================== */
/* Overlay-полный экран документов: гарантированная лента */
/* ===================================================== */

.doc2026-no-scroll {
    overflow: hidden !important;
}

.doc2026-overlay {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: none;
    grid-template-rows: auto auto auto 1fr auto;
    gap: 8px;
    padding: 10px 14px 12px;
    background:
        radial-gradient(circle at 50% 38%, rgba(255,255,255,.58) 0%, rgba(255,255,255,.22) 28%, rgba(255,255,255,0) 52%),
        linear-gradient(180deg, #7a1fe0 0%, #a55fe1 48%, #f4efff 100%);
    color: #fff;
    font-family: Montserrat, Arial, sans-serif;
}

.doc2026-overlay.open {
    display: grid;
}

.doc2026-overlay__top {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    z-index: 30;
}

.doc2026-overlay__top button {
    min-height: 32px;
    padding: 6px 13px;
    border-radius: 18px;
    background: rgba(255,255,255,.94);
    color: #5c16b4;
    font-size: 13px;
    font-weight: 800;
    box-shadow: 0 8px 20px rgba(50,0,100,.20);
}

.doc2026-overlay__counter {
    text-align: center;
    font-size: 22px;
    font-weight: 900;
    text-shadow: 0 2px 10px rgba(0,0,0,.32);
}

.doc2026-overlay__hint {
    min-height: 18px;
    text-align: center;
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    text-shadow: 0 2px 10px rgba(0,0,0,.32);
}

.doc2026-overlay__stage {
    position: relative;
    min-height: 0;
    overflow: hidden;
    perspective: 1600px;
    cursor: grab;
    user-select: none;
    touch-action: pan-y;
}



.doc2026-overlay__track {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: visible;
}

.doc2026-overlay__card {
    position: absolute;
    left: 50%;
    top: 50%;
    width: min(26vw, 420px);
    height: min(62vh, calc(100vh - 225px));
    max-height: 62vh;
    aspect-ratio: .707 / 1;
    border-radius: 18px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 22px 48px rgba(44,0,94,.32);
    transform:
        translate(-50%, -50%)
        translateX(var(--x, 0px))
        rotateY(var(--rotate, 0deg))
        scale(var(--scale, 1));
    transform-origin: center center;
    transition: transform .42s cubic-bezier(.22,.8,.24,1), opacity .35s ease, box-shadow .35s ease;
    will-change: transform, opacity;
}

.doc2026-overlay__card.active {
    box-shadow:
        0 0 0 9px rgba(255,255,255,.84),
        0 28px 62px rgba(44,0,94,.44);
}

.doc2026-overlay__card img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    background: #fff !important;
}

.doc2026-overlay__card strong {
    position: absolute;
    left: 10px;
    bottom: 10px;
    max-width: calc(100% - 20px);
    padding: 5px 10px;
    border-radius: 12px;
    background: rgba(30,30,30,.58);
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.doc2026-overlay__thumbs {
    width: 100%;
    display: flex;
    gap: 10px;
    overflow-x: auto;
    padding: 10px 18px;
    border-radius: 22px;
    background: rgba(255,255,255,.70);
    box-shadow: 0 -8px 30px rgba(80,20,150,.15);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.doc2026-overlay__thumb {
    flex: 0 0 82px;
    width: 82px;
    padding: 5px;
    border-radius: 12px;
    background: rgba(255,255,255,.88);
    border: 2px solid transparent;
}

.doc2026-overlay__thumb.active {
    border-color: #7a1fe0;
    box-shadow: 0 0 0 3px rgba(122,31,224,.16);
}

.doc2026-overlay__thumb img {
    display: block !important;
    width: 100%;
    height: 70px;
    object-fit: cover;
    border-radius: 8px;
}

.doc2026-overlay__thumb span {
    display: block;
    margin-top: 6px;
    font-size: 11px;
    line-height: 1.1;
    color: #5c16b4;
    font-weight: 900;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 900px) {
    .doc2026-overlay__card {
        width: 50vw;
        height: min(56vh, calc(100vh - 230px));
    }

    .doc2026-overlay__thumb {
        flex-basis: 72px;
        width: 72px;
    }
}


/* ===================================================== */
/* FIX: перетаскивание ленты мышкой поверх документов */
/* ===================================================== */

.doc2026-overlay__stage,
.doc2026-overlay__track,
.doc2026-overlay__card,
.doc2026-overlay__card img {
    user-select: none !important;
    -webkit-user-select: none !important;
    -webkit-user-drag: none !important;
}

.doc2026-overlay__card img {
    pointer-events: none !important;
}

.doc2026-overlay__track {
    touch-action: none !important;
}

.doc2026-overlay__stage {
    touch-action: none !important;
}


/* ===================================================== */
/* FIX: кнопки снизу слева, изображения не скрываются */
/* ===================================================== */

.doc2026-overlay.open {
    display: grid !important;
}

.doc2026-overlay {
    grid-template-rows: auto auto 1fr auto auto !important;
}

.doc2026-overlay__top {
    grid-row: 4 !important;
    justify-self: start !important;
    align-self: end !important;
    margin: 0 0 6px 12px !important;
    z-index: 80 !important;
}

.doc2026-overlay__counter {
    grid-row: 1 !important;
    position: static !important;
    transform: none !important;
    justify-self: center !important;
    z-index: 70 !important;
}

.doc2026-overlay__hint {
    grid-row: 2 !important;
    position: static !important;
    transform: none !important;
    justify-self: center !important;
    width: 100% !important;
    z-index: 70 !important;
}

.doc2026-overlay__stage {
    grid-row: 3 !important;
    min-height: 0 !important;
    height: 100% !important;
    z-index: 10 !important;
}

.doc2026-overlay__thumbs {
    grid-row: 5 !important;
    z-index: 70 !important;
}

.doc2026-overlay__track,
.doc2026-overlay__card,
.doc2026-overlay__card img {
    visibility: visible !important;
}


/* ===================================================== */
/* PROFESSIONAL DOCUMENT VIEWER UI */
/* ===================================================== */

.doc2026-overlay {
    grid-template-rows: auto auto 1fr auto auto !important;
    padding: 12px 18px 14px !important;
}

.doc2026-overlay__counter {
    grid-row: 1 !important;
    position: static !important;
    transform: none !important;
    justify-self: center !important;
    z-index: 70 !important;
    font-size: 24px !important;
    letter-spacing: .02em;
}

.doc2026-overlay__hint {
    grid-row: 2 !important;
    position: static !important;
    transform: none !important;
    justify-self: center !important;
    width: 100% !important;
    z-index: 70 !important;
    opacity: .95;
}

.doc2026-overlay__stage {
    grid-row: 3 !important;
    min-height: 0 !important;
    height: 100% !important;
    z-index: 10 !important;
    cursor: grab;
}

.doc2026-overlay__stage.dragging {
    cursor: grabbing;
}

.doc2026-overlay__stage.panning {
    cursor: move;
}

.doc2026-overlay__top {
    grid-row: 4 !important;
    justify-self: start !important;
    align-self: end !important;
    margin: 0 0 8px 8px !important;
    z-index: 90 !important;
    display: inline-flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 7px 9px !important;
    border-radius: 999px;
    background: rgba(255,255,255,.68);
    box-shadow: 0 12px 32px rgba(60,0,120,.18);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.doc2026-overlay__top button {
    min-height: 34px !important;
    padding: 7px 15px !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    color: #5d17c5 !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    box-shadow: 0 4px 14px rgba(60,0,120,.16) !important;
    transition: transform .16s ease, box-shadow .16s ease, background .16s ease;
}

.doc2026-overlay__top button:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 20px rgba(60,0,120,.22) !important;
    background: #f7f1ff !important;
}

.doc2026-overlay__thumbs {
    grid-row: 5 !important;
    width: 100vw !important;
    max-width: none !important;
    margin-left: calc(-1 * 18px) !important;
    margin-right: calc(-1 * 18px) !important;
    border-radius: 22px 22px 0 0 !important;
    padding: 12px 18px 10px !important;
    gap: 10px !important;
    scroll-behavior: smooth;
    z-index: 80 !important;
}

.doc2026-overlay__thumb {
    flex: 0 0 84px !important;
    width: 84px !important;
    border: 2px solid rgba(255,255,255,.65) !important;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.doc2026-overlay__thumb:hover {
    transform: translateY(-2px);
}

.doc2026-overlay__thumb.active {
    border-color: #7a1fe0 !important;
    box-shadow:
        0 0 0 3px rgba(122,31,224,.26),
        0 10px 24px rgba(78,0,160,.22) !important;
    transform: translateY(-3px);
}

.doc2026-overlay__thumb img {
    height: 72px !important;
}

.doc2026-overlay__card img {
    transform-origin: center center;
    transition: transform .14s ease;
    user-select: none !important;
    -webkit-user-drag: none !important;
    pointer-events: none !important;
}

.doc2026-overlay__card.active img {
    cursor: move;
}

.doc2026-overlay__track,
.doc2026-overlay__card {
    user-select: none !important;
    -webkit-user-select: none !important;
}

@media (max-width: 800px) {
    .doc2026-overlay__top {
        gap: 5px !important;
        padding: 6px !important;
    }

    .doc2026-overlay__top button {
        padding: 6px 10px !important;
        font-size: 12px !important;
    }

    .doc2026-overlay__thumb {
        flex-basis: 72px !important;
        width: 72px !important;
    }
}


/* ===================================================== */
/* GREEN PLATFORM EFFECT */
/* Активный документ на зеленой площадке.
   У соседних документов зеленый фон уменьшается пропорционально удалению. */
/* ===================================================== */

.doc2026-overlay__card {
    background:
        linear-gradient(
            180deg,
            rgba(130, 215, 135, calc(.22 * var(--green, 0))) 0%,
            rgba(91, 178, 95, calc(.42 * var(--green, 0))) 100%
        ),
        rgba(255,255,255,.72) !important;
    padding: 12px !important;
    border: 1px solid rgba(70, 150, 78, calc(.45 * var(--green, 0))) !important;
    box-shadow:
        0 14px 34px rgba(48, 120, 58, calc(.18 * var(--green, 0))),
        0 22px 48px rgba(44,0,94,.28) !important;
}

.doc2026-overlay__card::before {
    content: "";
    position: absolute;
    left: 8%;
    right: 8%;
    bottom: 8px;
    height: 22px;
    border-radius: 999px;
    background: rgba(54, 150, 66, calc(.44 * var(--green, 0)));
    filter: blur(14px);
    opacity: var(--green, 0);
    z-index: 0;
    pointer-events: none;
}

.doc2026-overlay__card img {
    position: relative;
    z-index: 1;
    border-radius: 12px !important;
    box-shadow: 0 8px 20px rgba(0,0,0,.14);
}

.doc2026-overlay__card strong {
    z-index: 2;
}

.doc2026-overlay__card.active {
    background:
        linear-gradient(180deg, rgba(156, 235, 160, .72) 0%, rgba(84, 183, 92, .94) 100%) !important;
    border-color: rgba(48, 140, 60, .85) !important;
    box-shadow:
        0 0 0 8px rgba(201,255,204,.72),
        0 22px 50px rgba(40, 145, 58, .42),
        0 28px 62px rgba(44,0,94,.34) !important;
}


/* ===================================================== */
/* PARALLAX2 BACKGROUND — без фиолетового цвета */
/* ===================================================== */

.doc2026-overlay {
    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.18) 0%,
            rgba(20,33,27,.26) 42%,
            rgba(5,11,8,.88) 100%
        ),
        url("../img/parallax0.webp") center center / cover fixed no-repeat !important;
    color: #fff !important;
}

.doc2026-overlay::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 50% 22%, rgba(255,255,255,.22) 0%, rgba(255,255,255,0) 38%),
        linear-gradient(180deg, rgba(255,255,255,.08) 0%, rgba(0,0,0,.68) 100%);
}

.doc2026-overlay > * {
    position: relative;
    z-index: 1;
}

.doc2026-overlay__counter,
.doc2026-overlay__hint {
    color: #fff !important;
    text-shadow: 0 2px 12px rgba(0,0,0,.65) !important;
}

.doc2026-overlay__top {
    background: rgba(255,255,255,.82) !important;
    box-shadow: 0 12px 32px rgba(0,0,0,.26) !important;
}

.doc2026-overlay__top button {
    background: #ffffff !important;
    color: #236333 !important;
    box-shadow: 0 5px 15px rgba(0,0,0,.20) !important;
}

.doc2026-overlay__top button:hover {
    background: #eef9ef !important;
    color: #155725 !important;
}

.doc2026-overlay__thumbs {
    background: rgba(16,38,24,.74) !important;
    border: 1px solid rgba(174,225,181,.36) !important;
    box-shadow: 0 -10px 34px rgba(0,0,0,.34) !important;
}

.doc2026-overlay__thumb {
    background: rgba(255,255,255,.86) !important;
    border-color: rgba(199,237,205,.56) !important;
}

.doc2026-overlay__thumb span {
    color: #ffffff !important;
    text-shadow: 0 2px 8px rgba(0,0,0,.72) !important;
}

.doc2026-overlay__thumb.active {
    border-color: #7ad884 !important;
    box-shadow:
        0 0 0 3px rgba(122,216,132,.28),
        0 0 24px rgba(122,216,132,.42) !important;
}

.doc2026-overlay__card {
    background:
        linear-gradient(
            180deg,
            rgba(130,215,135, calc(.22 * var(--green, 0))) 0%,
            rgba(91,178,95, calc(.42 * var(--green, 0))) 100%
        ),
        rgba(255,255,255,.76) !important;
}

.doc2026-overlay__card.active {
    background:
        linear-gradient(180deg, rgba(156,235,160,.72) 0%, rgba(84,183,92,.94) 100%) !important;
    box-shadow:
        0 0 0 8px rgba(201,255,204,.72),
        0 22px 50px rgba(40,145,58,.42),
        0 28px 62px rgba(0,0,0,.42) !important;
}

.doc2026-overlay__card strong {
    background: rgba(36,92,48,.72) !important;
    color: #fff !important;
}


/* ===================================================== */
/* TEAL PLATFORMS — цвет как у кнопок управления */
/* ===================================================== */

:root {
    --doc2026-teal: rgb(13, 92, 99);
    --doc2026-teal-rgb: 13, 92, 99;
}

/* нижняя площадка миниатюр */
.doc2026-overlay__thumbs {
    background:
        linear-gradient(
            180deg,
            rgba(var(--doc2026-teal-rgb), .92) 0%,
            rgba(var(--doc2026-teal-rgb), .78) 100%
        ) !important;
    border: 1px solid rgba(255,255,255,.28) !important;
    box-shadow:
        0 -10px 34px rgba(0,0,0,.34),
        inset 0 1px 0 rgba(255,255,255,.18) !important;
}

/* площадки под документами: активная яркая, остальные затухают по --green */
.doc2026-overlay__card {
    background:
        linear-gradient(
            180deg,
            rgba(var(--doc2026-teal-rgb), calc(.16 + .50 * var(--green, 0))) 0%,
            rgba(var(--doc2026-teal-rgb), calc(.10 + .34 * var(--green, 0))) 100%
        ),
        rgba(255,255,255,.76) !important;
    border-color: rgba(var(--doc2026-teal-rgb), calc(.22 + .45 * var(--green, 0))) !important;
    box-shadow:
        0 14px 34px rgba(var(--doc2026-teal-rgb), calc(.10 + .24 * var(--green, 0))),
        0 22px 48px rgba(0,0,0,.28) !important;
}

.doc2026-overlay__card::before {
    background: rgba(var(--doc2026-teal-rgb), calc(.22 + .44 * var(--green, 0))) !important;
}

.doc2026-overlay__card.active {
    background:
        linear-gradient(
            180deg,
            rgba(var(--doc2026-teal-rgb), .92) 0%,
            rgba(var(--doc2026-teal-rgb), .78) 100%
        ) !important;
    border-color: rgba(var(--doc2026-teal-rgb), .95) !important;
    box-shadow:
        0 0 0 8px rgba(var(--doc2026-teal-rgb), .28),
        0 22px 50px rgba(var(--doc2026-teal-rgb), .38),
        0 28px 62px rgba(0,0,0,.42) !important;
}

.doc2026-overlay__card.active::before {
    background: rgba(var(--doc2026-teal-rgb), .72) !important;
    opacity: 1 !important;
}

/* подписи на карточках */
.doc2026-overlay__card strong {
    background: rgba(var(--doc2026-teal-rgb), .86) !important;
    color: #fff !important;
}

/* активная миниатюра — подсветка тем же цветом */
.doc2026-overlay__thumb.active {
    border-color: var(--doc2026-teal) !important;
    box-shadow:
        0 0 0 3px rgba(var(--doc2026-teal-rgb), .30),
        0 0 24px rgba(var(--doc2026-teal-rgb), .48) !important;
}

/* нижние кнопки — единый цвет */
.doc2026-overlay__top button {
    background: var(--doc2026-teal) !important;
    color: #fff !important;
}

.doc2026-overlay__top button:hover {
    background: rgb(8, 77, 84) !important;
    color: #fff !important;
}


/* Перенос счетчика и подсказки вниз по центру */
.doc2026-overlay__counter,
.doc2026-overlay__hint{
    position:fixed !important;
    left:50% !important;
    transform:translateX(-50%) !important;
    top:auto !important;
    text-align:center !important;
    z-index:1002 !important;
}
.doc2026-overlay__hint{
    bottom:150px !important; /* над лентой миниатюр */
}
.doc2026-overlay__counter{
    bottom:178px !important;
    font-size:30px !important;
    font-weight:700 !important;
}


/* ===================================================== */
/* ACTIVE DOCUMENT PAN + TAPE DRAG */
/* ===================================================== */

.doc2026-overlay__stage.dragging {
    cursor: grabbing !important;
}

.doc2026-overlay__stage.panning {
    cursor: move !important;
}

.doc2026-overlay__card.active {
    cursor: grab !important;
}

.doc2026-overlay__stage.panning .doc2026-overlay__card.active {
    cursor: move !important;
}

.doc2026-overlay__card img {
    transform-origin: center center !important;
    transition: transform .12s ease !important;
    will-change: transform !important;
    user-select: none !important;
    -webkit-user-drag: none !important;
    pointer-events: none !important;
}

.doc2026-overlay__card.active img {
    cursor: move !important;
}

/* Подсказка пользователю */
.doc2026-overlay__hint::after {
    content: "  Увеличенный документ можно двигать мышкой вверх-вниз и вправо-влево.";
}


/* ===================================================== */
/* ADOBE ACROBAT STYLE: нижняя панель управления */
/* ===================================================== */

.doc2026-overlay {
    grid-template-rows: 1fr auto auto !important;
    gap: 8px !important;
    padding: clamp(8px, 1.2vw, 18px) !important;
}

.doc2026-overlay__stage {
    grid-row: 1 !important;
    min-height: 0 !important;
    height: 100% !important;
}

/* общая нижняя панель: кнопки + счетчик + подсказка */
.doc2026-overlay__top {
    grid-row: 2 !important;
    justify-self: center !important;
    align-self: end !important;
    margin: 0 !important;
    max-width: calc(100vw - 28px) !important;
    width: auto !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 7px 10px !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.82) !important;
    box-shadow: 0 10px 28px rgba(0,0,0,.28) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    z-index: 120 !important;
}

.doc2026-overlay__top::after {
    content: "  " attr(data-counter);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 58px;
    min-height: 32px;
    padding: 0 12px;
    border-left: 1px solid rgba(13,92,99,.22);
    color: var(--doc2026-teal, rgb(13,92,99));
    font-weight: 900;
    font-size: 15px;
    white-space: nowrap;
}

/* счетчик остается в DOM, но визуально переносится в строку кнопок через JS data-counter */
.doc2026-overlay__counter {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
}

/* компактная подсказка по центру над миниатюрами */
.doc2026-overlay__hint {
    grid-row: 2 !important;
    position: fixed !important;
    left: 50% !important;
    bottom: clamp(96px, 13vh, 128px) !important;
    transform: translateX(-50%) !important;
    width: min(760px, calc(100vw - 32px)) !important;
    min-height: 0 !important;
    padding: 5px 14px !important;
    border-radius: 999px !important;
    background: rgba(0,0,0,.36) !important;
    color: #fff !important;
    font-size: clamp(11px, 1.1vw, 13px) !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
    text-align: center !important;
    text-shadow: none !important;
    z-index: 110 !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
}

/* убираем длинный псевдотекст из прошлой версии */
.doc2026-overlay__hint::after {
    content: "" !important;
}

/* лента миниатюр на всю ширину и по центру */
.doc2026-overlay__thumbs {
    grid-row: 3 !important;
    width: min(100%, 1600px) !important;
    max-width: calc(100vw - 24px) !important;
    margin: 0 auto !important;
    justify-self: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: clamp(7px, .7vw, 12px) !important;
    padding: 10px clamp(10px, 1.2vw, 18px) !important;
    border-radius: 18px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: thin !important;
    scroll-behavior: smooth !important;
    z-index: 100 !important;
}

.doc2026-overlay__thumb {
    flex: 0 0 clamp(62px, 5.5vw, 86px) !important;
    width: clamp(62px, 5.5vw, 86px) !important;
}

.doc2026-overlay__thumb img {
    height: clamp(52px, 5.2vw, 74px) !important;
}

.doc2026-overlay__thumb span {
    font-size: clamp(9px, .78vw, 11px) !important;
}

/* адаптация для узких экранов */
@media (max-width: 760px) {
    .doc2026-overlay {
        grid-template-rows: 1fr auto auto !important;
    }

    .doc2026-overlay__top {
        gap: 5px !important;
        padding: 6px !important;
        max-width: calc(100vw - 16px) !important;
        overflow-x: auto !important;
        justify-content: flex-start !important;
    }

    .doc2026-overlay__top button {
        min-height: 30px !important;
        padding: 5px 9px !important;
        font-size: 11px !important;
        flex: 0 0 auto !important;
    }

    .doc2026-overlay__top::after {
        min-width: 46px;
        min-height: 28px;
        padding: 0 8px;
        font-size: 12px;
        flex: 0 0 auto;
    }

    .doc2026-overlay__hint {
        bottom: 88px !important;
        padding: 4px 10px !important;
    }
}

@media (min-width: 1280px) {
    .doc2026-overlay__top {
        transform: translateY(-2px);
    }
}


/* ===================================================== */
/* LANDSCAPE DOCUMENTS */
/* Если документ шире, чем выше, карточка и миниатюра становятся шире */
/* ===================================================== */

.doc2026-overlay__card.landscape {
    width: min(52vw, 840px) !important;
    height: min(62vh, calc(100vh - 225px)) !important;
    aspect-ratio: 1.414 / 1 !important;
}

.doc2026-overlay__card.landscape img {
    object-fit: contain !important;
}

/* обычные миниатюры */
.doc2026__thumb.landscape {
    flex-basis: 184px !important;
    width: 184px !important;
}



/* миниатюры в полноэкранном просмотрщике */
.doc2026-overlay__thumb.landscape {
    flex-basis: 168px !important;
    width: 168px !important;
}

.doc2026-overlay__thumb.landscape img {
    object-fit: contain !important;
    background: #fff !important;
}

/* адаптив */
@media (max-width: 900px) {
    .doc2026-overlay__card.landscape {
        width: 88vw !important;
        height: min(52vh, calc(100vh - 230px)) !important;
    }

    .doc2026__thumb.landscape {
        flex-basis: 144px !important;
        width: 144px !important;
    }

    .doc2026-overlay__thumb.landscape {
        flex-basis: 132px !important;
        width: 132px !important;
    }
}


/* Подсказка выше панели кнопок */
.doc2026-overlay__hint{
    bottom: 145px !important;
    z-index: 130 !important;
}

.doc2026-overlay__top{
    z-index:120 !important;
}


/* ===== Responsive layout: hint on separate row above buttons ===== */

.doc2026-overlay{
    position:fixed;
}

.doc2026-overlay__hint{
    position:absolute !important;
    left:50% !important;
    transform:translateX(-50%) !important;
    bottom:170px !important;
    width:min(760px, calc(100vw - 40px)) !important;
    margin:0 !important;
    z-index:140 !important;
    pointer-events:none;
}

.doc2026-overlay__top{
    position:absolute !important;
    left:50% !important;
    transform:translateX(-50%) !important;
    bottom:105px !important;
    margin:0 !important;
    z-index:130 !important;
    max-width:calc(100vw - 40px) !important;
}

.doc2026-overlay__thumbs{
    position:absolute !important;
    left:50% !important;
    transform:translateX(-50%) !important;
    bottom:10px !important;
    width:min(1600px, calc(100vw - 20px)) !important;
}

@media (max-width:900px){
    .doc2026-overlay__hint{
        bottom:155px !important;
        font-size:12px !important;
        width:calc(100vw - 24px) !important;
    }

    .doc2026-overlay__top{
        bottom:92px !important;
        max-width:calc(100vw - 20px) !important;
    }

    .doc2026-overlay__thumbs{
        bottom:6px !important;
        width:calc(100vw - 12px) !important;
    }
}

/* ===== Lift thumbnail strip to avoid overlap ===== */



.doc2026-overlay__top{
    bottom:140px !important;
}

.doc2026-overlay__thumbs{
    bottom:42px !important;
}

@media (max-width:900px){
    .doc2026-overlay__hint{
        bottom:185px !important;
    }
    .doc2026-overlay__top{
        bottom:122px !important;
    }
    .doc2026-overlay__thumbs{
        bottom:34px !important;
    }
}


/* ===================================================== */
/* V5: резерв нижней панели, чтобы элементы не попадали на картинки */
/* ===================================================== */

/* сцена с документами заканчивается выше нижней панели */
.doc2026-overlay__stage{
    position:absolute !important;
    top:12px !important;
    left:0 !important;
    right:0 !important;
    bottom:275px !important;
    height:auto !important;
    min-height:0 !important;
    z-index:20 !important;
}

/* сама лента документов поднимается выше и не занимает область кнопок */
.doc2026-overlay__track{
    height:100% !important;
}

/* немного уменьшаем площадку активного документа, но сам документ остается вписанным */
.doc2026-overlay__card{
    width:min(22vw, 330px) !important;
    height:min(50vh, calc(100vh - 360px)) !important;
    max-height:min(50vh, calc(100vh - 360px)) !important;
}

/* альбомные документы шире, но не ниже остальных */
.doc2026-overlay__card.landscape{
    width:min(44vw, 660px) !important;
    height:min(50vh, calc(100vh - 360px)) !important;
    max-height:min(50vh, calc(100vh - 360px)) !important;
}

/* нижние элементы: сверху вниз — подсказка, кнопки, миниатюры */
.doc2026-overlay__hint{
    position:absolute !important;
    left:50% !important;
    transform:translateX(-50%) !important;
    bottom:218px !important;
    width:min(760px, calc(100vw - 40px)) !important;
    z-index:120 !important;
}

.doc2026-overlay__top{
    position:absolute !important;
    left:50% !important;
    transform:translateX(-50%) !important;
    bottom:158px !important;
    max-width:calc(100vw - 40px) !important;
    margin:0 !important;
    z-index:125 !important;
}

.doc2026-overlay__thumbs{
    position:absolute !important;
    left:50% !important;
    transform:translateX(-50%) !important;
    bottom:22px !important;
    width:min(1600px, calc(100vw - 24px)) !important;
    max-height:118px !important;
    z-index:120 !important;
}

/* счетчик остается в строке кнопок */
.doc2026-overlay__counter{
    display:none !important;
}

@media (max-width:900px){
    .doc2026-overlay__stage{
        top:8px !important;
        bottom:245px !important;
    }

    .doc2026-overlay__card{
        width:38vw !important;
        height:min(44vh, calc(100vh - 320px)) !important;
        max-height:min(44vh, calc(100vh - 320px)) !important;
    }

    .doc2026-overlay__card.landscape{
        width:76vw !important;
        height:min(44vh, calc(100vh - 320px)) !important;
        max-height:min(44vh, calc(100vh - 320px)) !important;
    }

    .doc2026-overlay__hint{
        bottom:195px !important;
        width:calc(100vw - 24px) !important;
    }

    .doc2026-overlay__top{
        bottom:138px !important;
        max-width:calc(100vw - 20px) !important;
    }

    .doc2026-overlay__thumbs{
        bottom:14px !important;
        width:calc(100vw - 14px) !important;
        max-height:110px !important;
    }
}

@media (max-height:720px){
    .doc2026-overlay__stage{
        bottom:225px !important;
    }

    .doc2026-overlay__card,
    .doc2026-overlay__card.landscape{
        height:min(42vh, calc(100vh - 300px)) !important;
        max-height:min(42vh, calc(100vh - 300px)) !important;
    }

    .doc2026-overlay__hint{
        bottom:178px !important;
    }

    .doc2026-overlay__top{
        bottom:124px !important;
    }

    .doc2026-overlay__thumbs{
        bottom:8px !important;
        max-height:102px !important;
    }
}


/* ===================================================== */
/* V6: вернуть размер документов и сделать плотную ленту */
/* ===================================================== */

/* оставляем нижнюю панель внизу, но возвращаем документам прежний крупный размер */
.doc2026-overlay__stage{
    top: 8px !important;
    bottom: 230px !important;
}

/* прежний крупный размер портретных документов */
.doc2026-overlay__card{
    width: min(23vw, 360px) !important;
    height: min(58vh, calc(100vh - 230px)) !important;
    max-height: 58vh !important;
}

/* альбомные документы шире, высота такая же */
.doc2026-overlay__card.landscape{
    width: min(52vw, 840px) !important;
    height: min(58vh, calc(100vh - 230px)) !important;
    max-height: 58vh !important;
}

/* соседние документы могут заходить под активный документ */
.doc2026-overlay__card{
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.doc2026-overlay__card.active{
    z-index: 500 !important;
}

/* соседние карточки чуть ближе и визуально под активной */
.doc2026-overlay__card:not(.active){
    z-index: 120;
}

/* нижние элементы немного ниже, чтобы освободить место крупной картинке */
.doc2026-overlay__hint{
    bottom: 186px !important;
}

.doc2026-overlay__top{
    bottom: 128px !important;
}

.doc2026-overlay__thumbs{
    bottom: 10px !important;
}

/* миниатюры тоже сделать плотнее */
.doc2026-overlay__thumbs{
    gap: 6px !important;
}

.doc2026-overlay__thumb{
    margin-left: 0 !important;
    margin-right: 0 !important;
}

@media (max-width: 900px){
    .doc2026-overlay__stage{
        bottom: 220px !important;
    }

    .doc2026-overlay__card{
        width: 44vw !important;
        height: min(52vh, calc(100vh - 230px)) !important;
        max-height: 52vh !important;
    }

    .doc2026-overlay__card.landscape{
        width: 88vw !important;
        height: min(52vh, calc(100vh - 230px)) !important;
        max-height: 52vh !important;
    }

    .doc2026-overlay__hint{
        bottom: 174px !important;
    }

    .doc2026-overlay__top{
        bottom: 118px !important;
    }

    .doc2026-overlay__thumbs{
        bottom: 8px !important;
    }
}

@media (max-height: 720px){
    .doc2026-overlay__stage{
        bottom: 205px !important;
    }

    .doc2026-overlay__card,
    .doc2026-overlay__card.landscape{
        height: min(50vh, calc(100vh - 230px)) !important;
        max-height: 50vh !important;
    }

    .doc2026-overlay__hint{
        bottom: 160px !important;
    }

    .doc2026-overlay__top{
        bottom: 108px !important;
    }

    .doc2026-overlay__thumbs{
        bottom: 6px !important;
    }
}


/* ===== V7: разделение нижних элементов без изменения размера документов ===== */

.doc2026-overlay__stage{
    top:8px !important;
    bottom:255px !important; /* резерв под нижнюю панель */
}





.doc2026-overlay__thumbs{
    bottom:25px !important;
}

/* одинаковый вертикальный зазор */
.doc2026-overlay__hint{margin-bottom:0!important;}
.doc2026-overlay__top{margin-bottom:0!important;}

@media (max-width:900px){
    .doc2026-overlay__stage{bottom:240px !important;}
    .doc2026-overlay__hint{bottom:190px !important;}
    .doc2026-overlay__top{bottom:132px !important;}
    .doc2026-overlay__thumbs{bottom:18px !important;}
}

@media (max-height:720px){
    .doc2026-overlay__stage{bottom:225px !important;}
    .doc2026-overlay__hint{bottom:176px !important;}
    .doc2026-overlay__top{bottom:122px !important;}
    .doc2026-overlay__thumbs{bottom:10px !important;}
}


/* ===== V8: одинаковые зазоры ===== */

/* Подсказка */


/* Кнопки */


/* Миниатюры подняты так, чтобы расстояние
   Кнопки→Миниатюры ≈ Подсказка→Кнопки */
.doc2026-overlay__thumbs{
    bottom:85px !important;
}

@media (max-width:900px){
    .doc2026-overlay__hint{bottom:190px !important;}
    .doc2026-overlay__top{bottom:132px !important;}
    .doc2026-overlay__thumbs{bottom:74px !important;}
}

@media (max-height:720px){
    .doc2026-overlay__hint{bottom:176px !important;}
    .doc2026-overlay__top{bottom:122px !important;}
    .doc2026-overlay__thumbs{bottom:66px !important;}
}


/* ===== V9: одинаковый зазор между подсказкой→кнопками и кнопками→миниатюрами ===== */

.doc2026-overlay__hint{
    bottom:205px !important;
}

.doc2026-overlay__top{
    bottom:145px !important;
}

/* Верх миниатюр примерно на 60px ниже кнопок */
.doc2026-overlay__thumbs{
    bottom:45px !important;
    max-height:88px !important;
}

@media (max-width:900px){
    .doc2026-overlay__hint{bottom:190px !important;}
    .doc2026-overlay__top{bottom:132px !important;}
    .doc2026-overlay__thumbs{
        bottom:36px !important;
        max-height:84px !important;
    }
}

@media (max-height:720px){
    .doc2026-overlay__hint{bottom:176px !important;}
    .doc2026-overlay__top{bottom:122px !important;}
    .doc2026-overlay__thumbs{
        bottom:30px !important;
        max-height:78px !important;
    }
}


/* ===================================================== */
/* Viewer 2.0 Stage 1 */
/* Автоматические документы + базовый overlay */
/* ===================================================== */









.viewer2026-overlay {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: none;
    grid-template-rows: auto 1fr auto;
    gap: 12px;
    padding: 16px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.10), rgba(0,0,0,.72)),
        url("../img/parallax0.webp") center center / cover fixed no-repeat;
    font-family: Montserrat, Arial, sans-serif;
}

.viewer2026-overlay.open {
    display: grid;
}

.viewer2026-overlay__panel {
    justify-self: center;
    display: flex;
    align-items: center;
    gap: 8px;
    max-width: calc(100vw - 24px);
    padding: 8px 12px;
    border-radius: 999px;
    background: rgba(255,255,255,.84);
    box-shadow: 0 10px 28px rgba(0,0,0,.28);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

.viewer2026-overlay__panel button {
    min-height: 34px;
    padding: 7px 15px;
    border-radius: 999px;
    background: rgba(13,92,99,1);
    color: #fff;
    font-weight: 800;
}

.viewer2026-overlay__counter {
    padding: 0 10px;
    color: rgba(13,92,99,1);
    font-weight: 900;
    white-space: nowrap;
}

.viewer2026-overlay__stage {
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.viewer2026-overlay__image {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 24px 60px rgba(0,0,0,.34);
}

.viewer2026-overlay__image.landscape {
    width: min(92vw, 1200px);
}

.viewer2026-overlay__thumbs {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    padding: 10px 14px;
    border-radius: 18px;
    background: rgba(13,92,99,.78);
    box-shadow: 0 -10px 30px rgba(0,0,0,.25);
}

.viewer2026-overlay__thumb {
    flex: 0 0 84px;
    width: 84px;
    padding: 5px;
    border-radius: 12px;
    background: rgba(255,255,255,.88);
    border: 2px solid transparent;
}

.viewer2026-overlay__thumb.landscape {
    flex-basis: 168px;
    width: 168px;
}

.viewer2026-overlay__thumb.active {
    border-color: rgba(13,92,99,1);
    box-shadow: 0 0 0 3px rgba(13,92,99,.28);
}

.viewer2026-overlay__thumb img {
    width: 100%;
    height: 70px;
    object-fit: cover;
    background: #fff;
    border-radius: 8px;
}

.viewer2026-overlay__thumb.landscape img {
    object-fit: contain;
}

.viewer2026-overlay__thumb span {
    display: block;
    margin-top: 6px;
    font-size: 11px;
    line-height: 1.1;
    color: rgba(13,92,99,1);
    font-weight: 800;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 760px) {
    .viewer2026-overlay {
        padding: 8px;
    }

    .viewer2026-overlay__panel {
        justify-content: flex-start;
        overflow-x: auto;
        width: calc(100vw - 16px);
    }

    .viewer2026-overlay__panel button {
        flex: 0 0 auto;
        padding: 6px 10px;
        font-size: 12px;
    }

    .viewer2026-overlay__thumb {
        flex-basis: 72px;
        width: 72px;
    }

    .viewer2026-overlay__thumb.landscape {
        flex-basis: 144px;
        width: 144px;
    }
}


/* ===================================================== */
/* Viewer 2.0 Stage 2 — Professional Acrobat-like UI */
/* ===================================================== */

.viewer2026-overlay {
    grid-template-rows: 1fr auto auto auto !important;
    gap: 8px !important;
    padding: clamp(8px, 1.1vw, 16px) !important;
    background:
        linear-gradient(180deg, rgba(255,255,255,.12) 0%, rgba(17,30,24,.38) 48%, rgba(5,10,8,.84) 100%),
        url("../img/parallax0.webp") center center / cover fixed no-repeat !important;
}

.viewer2026-overlay__stage {
    grid-row: 1 !important;
    min-height: 0 !important;
    position: relative !important;
    cursor: zoom-in;
}

.viewer2026-overlay__stage.panning {
    cursor: grabbing !important;
}

.viewer2026-overlay__image {
    max-width: min(92vw, 900px) !important;
    max-height: min(72vh, calc(100vh - 210px)) !important;
    object-fit: contain !important;
    border-radius: 16px !important;
    transform-origin: center center !important;
    transition: transform .12s ease, box-shadow .18s ease !important;
    user-select: none !important;
    -webkit-user-drag: none !important;
    will-change: transform;
}

.viewer2026-overlay__image.landscape {
    width: min(92vw, 1240px) !important;
    max-width: min(92vw, 1240px) !important;
}

.viewer2026-overlay__image.zoomed {
    cursor: grab !important;
    box-shadow:
        0 0 0 6px rgba(255,255,255,.35),
        0 26px 70px rgba(0,0,0,.44) !important;
}

.viewer2026-overlay__hint {
    grid-row: 2 !important;
    justify-self: center;
    width: min(760px, calc(100vw - 36px));
    padding: 5px 14px;
    border-radius: 999px;
    background: rgba(0,0,0,.38);
    color: #fff;
    font-size: clamp(11px, 1vw, 13px);
    line-height: 1.25;
    font-weight: 700;
    text-align: center;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.viewer2026-overlay__panel {
    grid-row: 3 !important;
    justify-self: center !important;
    margin: 0 !important;
    max-width: calc(100vw - 28px) !important;
    background: rgba(255,255,255,.86) !important;
}

.viewer2026-overlay__panel button {
    background: rgba(13,92,99,1) !important;
    color: #fff !important;
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}

.viewer2026-overlay__panel button:hover {
    transform: translateY(-1px);
    background: rgba(8,72,78,1) !important;
    box-shadow: 0 8px 18px rgba(0,0,0,.22);
}

.viewer2026-overlay__thumbs {
    grid-row: 4 !important;
    width: min(1600px, calc(100vw - 24px)) !important;
    justify-self: center !important;
    margin: 0 !important;
    gap: 8px !important;
    background: rgba(13,92,99,.82) !important;
    border: 1px solid rgba(255,255,255,.25);
    scrollbar-width: thin;
    scroll-behavior: smooth;
}

.viewer2026-overlay__thumb {
    flex: 0 0 clamp(70px, 6vw, 92px) !important;
    width: clamp(70px, 6vw, 92px) !important;
    border: 2px solid rgba(255,255,255,.66) !important;
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.viewer2026-overlay__thumb.landscape {
    flex-basis: clamp(132px, 12vw, 184px) !important;
    width: clamp(132px, 12vw, 184px) !important;
}

.viewer2026-overlay__thumb:hover {
    transform: translateY(-2px);
}

.viewer2026-overlay__thumb.active {
    border-color: #ffffff !important;
    transform: translateY(-3px);
    box-shadow:
        0 0 0 3px rgba(255,255,255,.28),
        0 12px 24px rgba(0,0,0,.28) !important;
}

.viewer2026-overlay__thumb img {
    height: clamp(58px, 5.4vw, 76px) !important;
    object-fit: cover !important;
}

.viewer2026-overlay__thumb.landscape img {
    object-fit: contain !important;
}

.viewer2026-overlay__thumb span {
    color: rgba(13,92,99,1) !important;
    font-weight: 900 !important;
}

@media (max-width: 760px) {
    .viewer2026-overlay {
        grid-template-rows: 1fr auto auto auto !important;
        padding: 8px !important;
    }

    .viewer2026-overlay__image {
        max-height: min(64vh, calc(100vh - 210px)) !important;
    }

    .viewer2026-overlay__panel {
        justify-content: flex-start !important;
        overflow-x: auto !important;
        width: calc(100vw - 16px) !important;
        padding: 6px !important;
    }

    .viewer2026-overlay__panel button {
        min-height: 30px !important;
        padding: 5px 10px !important;
        font-size: 12px !important;
        flex: 0 0 auto !important;
    }

    .viewer2026-overlay__counter {
        flex: 0 0 auto;
    }

    .viewer2026-overlay__hint {
        font-size: 11px !important;
        width: calc(100vw - 20px) !important;
        padding: 4px 10px !important;
    }
}


/* ===================================================== */
/* Viewer 2.1 — лента с соседними документами */
/* ===================================================== */

.viewer2026-carousel .viewer2026-overlay__stage {
    overflow: hidden !important;
    perspective: 1600px !important;
    cursor: grab !important;
}

.viewer2026-carousel .viewer2026-overlay__stage.dragging {
    cursor: grabbing !important;
}

.viewer2026-carousel .viewer2026-overlay__stage.panning {
    cursor: move !important;
}

.viewer2026-carousel__track {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: visible;
}

.viewer2026-carousel__card {
    --teal: 0;
    position: absolute;
    left: 50%;
    top: 50%;
    width: min(23vw, 360px);
    height: min(62vh, calc(100vh - 230px));
    max-height: 62vh;
    padding: 12px;
    border-radius: 18px;
    background:
        linear-gradient(
            180deg,
            rgba(13, 92, 99, calc(.12 + .58 * var(--teal))) 0%,
            rgba(13, 92, 99, calc(.08 + .42 * var(--teal))) 100%
        ),
        rgba(255,255,255,.78);
    border: 1px solid rgba(13, 92, 99, calc(.16 + .54 * var(--teal)));
    box-shadow:
        0 14px 34px rgba(13, 92, 99, calc(.08 + .22 * var(--teal))),
        0 24px 54px rgba(0,0,0,.28);
    transform:
        translate(-50%, -50%)
        translateX(var(--x, 0px))
        rotateY(var(--rotate, 0deg))
        scale(var(--scale, 1));
    transform-origin: center center;
    transition: transform .42s cubic-bezier(.22,.8,.24,1), opacity .35s ease, box-shadow .35s ease;
    will-change: transform, opacity;
    overflow: hidden;
    user-select: none;
    -webkit-user-select: none;
}

.viewer2026-carousel__card.landscape {
    width: min(52vw, 840px);
    height: min(62vh, calc(100vh - 230px));
}

.viewer2026-carousel__card.active {
    box-shadow:
        0 0 0 8px rgba(255,255,255,.46),
        0 24px 58px rgba(13,92,99,.36),
        0 30px 70px rgba(0,0,0,.40);
}

.viewer2026-carousel__card img {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(0,0,0,.14);
    transform-origin: center center;
    transition: transform .12s ease;
    user-select: none;
    -webkit-user-drag: none;
    pointer-events: none;
    will-change: transform;
}

.viewer2026-carousel__card strong {
    position: absolute;
    left: 14px;
    bottom: 14px;
    z-index: 2;
    max-width: calc(100% - 28px);
    padding: 5px 10px;
    border-radius: 12px;
    background: rgba(13,92,99,.86);
    color: #fff;
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.viewer2026-carousel .viewer2026-overlay__image {
    display: none !important;
}

@media (max-width: 900px) {
    .viewer2026-carousel__card {
        width: 44vw;
        height: min(56vh, calc(100vh - 225px));
    }

    .viewer2026-carousel__card.landscape {
        width: 88vw;
        height: min(56vh, calc(100vh - 225px));
    }
}

@media (max-height: 720px) {
    .viewer2026-carousel__card,
    .viewer2026-carousel__card.landscape {
        height: min(52vh, calc(100vh - 215px));
    }
}


/* ===================================================== */
/* Viewer 2.1 layout v2 */
/* 1) миниатюры на всю ширину экрана
   2) активный документ крупнее в 1.5 раза
   3) подсказка длиннее, без переноса слова "мышью" */
/* ===================================================== */

.viewer2026-overlay__thumbs {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    justify-self: center !important;
}

.viewer2026-carousel__card.active {
    /* было 1.25 в JS; CSS дополнительно усиливает активную карточку */
    transform:
        translate(-50%, -50%)
        translateX(var(--x, 0px))
        rotateY(var(--rotate, 0deg))
        scale(calc(var(--scale, 1) * 1.5)) !important;
}

.viewer2026-carousel__card.active.landscape {
    transform:
        translate(-50%, -50%)
        translateX(var(--x, 0px))
        rotateY(var(--rotate, 0deg))
        scale(calc(var(--scale, 1) * 1.5)) !important;
}

.viewer2026-overlay__hint {
    width: min(1120px, calc(100vw - 36px)) !important;
    max-width: calc(100vw - 36px) !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    font-size: clamp(11px, .92vw, 13px) !important;
}

@media (max-width: 900px) {
    .viewer2026-carousel__card.active {
        transform:
            translate(-50%, -50%)
            translateX(var(--x, 0px))
            rotateY(var(--rotate, 0deg))
            scale(calc(var(--scale, 1) * 1.32)) !important;
    }

    .viewer2026-overlay__hint {
        white-space: normal !important;
        line-height: 1.2 !important;
    }
}

@media (max-height: 760px) {
    .viewer2026-carousel__card.active {
        transform:
            translate(-50%, -50%)
            translateX(var(--x, 0px))
            rotateY(var(--rotate, 0deg))
            scale(calc(var(--scale, 1) * 1.28)) !important;
    }
}


/* ===================================================== */
/* Viewer 2.5 — Glass Professional UI */
/* Внешний вид как на финальной иллюстрации */
/* ===================================================== */

.viewer2026-overlay {
    background:
        radial-gradient(circle at 50% 35%, rgba(255,255,255,.10), rgba(0,0,0,0) 42%),
        linear-gradient(180deg, rgba(0,0,0,.22) 0%, rgba(0,0,0,.48) 58%, rgba(0,0,0,.78) 100%),
        url("../img/parallax0.webp") center center / cover fixed no-repeat !important;
    grid-template-rows: 1fr auto auto auto !important;
    gap: 10px !important;
}

/* верхняя панель */
.viewer2026-overlay__panel {
    background: rgba(5, 69, 75, .92) !important;
    border: 1px solid rgba(255,255,255,.35) !important;
    border-radius: 32px !important;
    padding: 10px 18px !important;
    box-shadow:
        0 14px 32px rgba(0,0,0,.34),
        inset 0 1px 0 rgba(255,255,255,.22) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
}

.viewer2026-overlay__panel button {
    background: rgba(7, 84, 91, .96) !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,.50) !important;
    border-radius: 24px !important;
    min-height: 42px !important;
    padding: 8px 22px !important;
    font-weight: 900 !important;
    font-size: 16px !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.20),
        0 8px 16px rgba(0,0,0,.18) !important;
}

.viewer2026-overlay__panel button:hover {
    background: rgba(12, 104, 112, .98) !important;
    transform: translateY(-2px);
}

.viewer2026-overlay__counter {
    color: #ffffff !important;
    font-size: 18px !important;
    font-weight: 900 !important;
    padding: 0 16px !important;
    text-shadow: 0 2px 10px rgba(0,0,0,.4) !important;
}

/* подсказка */
.viewer2026-overlay__hint {
    width: min(1180px, calc(100vw - 52px)) !important;
    max-width: calc(100vw - 52px) !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    background: rgba(5, 69, 75, .88) !important;
    border: 1px solid rgba(255,255,255,.38) !important;
    border-radius: 999px !important;
    color: #fff !important;
    padding: 8px 22px !important;
    font-weight: 900 !important;
    font-size: clamp(12px, 1vw, 15px) !important;
    box-shadow:
        0 12px 30px rgba(0,0,0,.28),
        inset 0 1px 0 rgba(255,255,255,.20) !important;
}

/* сцена */
.viewer2026-carousel .viewer2026-overlay__stage {
    perspective: 1800px !important;
    overflow: hidden !important;
}

/* карточки документов */
.viewer2026-carousel__card {
    border-radius: 24px !important;
    padding: 14px !important;
    background:
        linear-gradient(
            180deg,
            rgba(5,69,75, calc(.08 + .40 * var(--teal))) 0%,
            rgba(5,69,75, calc(.06 + .28 * var(--teal))) 100%
        ),
        rgba(255,255,255,.34) !important;
    border: 2px solid rgba(255,255,255,.42) !important;
    box-shadow:
        0 20px 45px rgba(0,0,0,.34),
        inset 0 1px 0 rgba(255,255,255,.20) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    overflow: visible !important;
    transform:
        translate(-50%, -50%)
        translateX(var(--x, 0px))
        translateZ(var(--depth, 0px))
        rotateY(var(--rotate, 0deg))
        scale(var(--scale, 1)) !important;
}

/* активная страница — полупрозрачная, закругленная, с белой рамкой */
.viewer2026-carousel__card.active {
    border-radius: 34px !important;
    padding: 16px !important;
    background:
        linear-gradient(180deg, rgba(255,255,255,.70), rgba(255,255,255,.50)) !important;
    border: 4px solid rgba(255,255,255,.82) !important;
    box-shadow:
        0 0 0 2px rgba(190,245,255,.38),
        0 0 34px rgba(255,255,255,.56),
        0 28px 82px rgba(0,0,0,.44),
        inset 0 0 34px rgba(255,255,255,.42) !important;
    backdrop-filter: blur(12px) saturate(1.12) !important;
    -webkit-backdrop-filter: blur(12px) saturate(1.12) !important;
    overflow: hidden !important;
}

/* белое внутреннее свечение активной страницы */
.viewer2026-carousel__card.active::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 30px;
    pointer-events: none;
    box-shadow:
        inset 0 0 28px rgba(255,255,255,.60),
        inset 0 0 2px rgba(255,255,255,.95);
    z-index: 4;
}

/* отражение страниц */
.viewer2026-carousel__card::before {
    content: "";
    position: absolute;
    left: 7%;
    right: 7%;
    bottom: -28%;
    height: 30%;
    border-radius: 50%;
    background:
        radial-gradient(ellipse at center, rgba(255,255,255,.28) 0%, rgba(255,255,255,.08) 45%, rgba(255,255,255,0) 75%);
    transform: scaleY(.65);
    filter: blur(8px);
    opacity: .38;
    pointer-events: none;
    z-index: 0;
}

/* сама страница внутри карточки */
.viewer2026-carousel__card img {
    border-radius: 18px !important;
    background: rgba(255,255,255,.74) !important;
    box-shadow:
        0 8px 22px rgba(0,0,0,.20),
        inset 0 0 18px rgba(255,255,255,.38) !important;
}

.viewer2026-carousel__card.active img {
    border-radius: 24px !important;
    opacity: .82 !important;
    background: rgba(255,255,255,.58) !important;
    box-shadow:
        inset 0 0 26px rgba(255,255,255,.45),
        0 12px 28px rgba(0,0,0,.18) !important;
}

/* подпись на карточке */
.viewer2026-carousel__card strong {
    background: rgba(5,69,75,.84) !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,.25) !important;
    border-radius: 999px !important;
    padding: 5px 12px !important;
    font-size: 13px !important;
}

/* нижняя лента миниатюр на всю ширину */
.viewer2026-overlay__thumbs {
    width: calc(100vw - 28px) !important;
    max-width: calc(100vw - 28px) !important;
    padding: 14px 18px 12px 18px !important;
    background: rgba(5, 69, 75, .90) !important;
    border: 1px solid rgba(255,255,255,.30) !important;
    border-radius: 22px !important;
    box-shadow:
        0 -12px 34px rgba(0,0,0,.36),
        inset 0 1px 0 rgba(255,255,255,.18) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
}

/* миниатюры */
.viewer2026-overlay__thumb {
    background: rgba(255,255,255,.88) !important;
    border: 2px solid rgba(255,255,255,.65) !important;
    border-radius: 13px !important;
    padding: 7px !important;
    box-shadow: 0 8px 18px rgba(0,0,0,.20) !important;
}

.viewer2026-overlay__thumb.active {
    border-color: #ffffff !important;
    background: rgba(255,255,255,.96) !important;
    box-shadow:
        0 0 0 3px rgba(160,245,255,.40),
        0 0 22px rgba(180,250,255,.55),
        0 12px 24px rgba(0,0,0,.24) !important;
}

.viewer2026-overlay__thumb img {
    border-radius: 8px !important;
}

.viewer2026-overlay__thumb span {
    color: #ffffff !important;
    text-shadow: 0 2px 8px rgba(0,0,0,.55) !important;
    font-size: 14px !important;
    font-weight: 900 !important;
}

/* темная нижняя дымка, как на картинке */
.viewer2026-carousel__track::after {
    content: "";
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    height: 34vh;
    background: linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.48));
    pointer-events: none;
    z-index: 1;
}



.viewer2026-carousel__card.active {
    z-index: 20 !important;
}

@media (max-width: 900px) {
    .viewer2026-overlay__hint {
        white-space: normal !important;
        line-height: 1.2 !important;
        width: calc(100vw - 26px) !important;
        max-width: calc(100vw - 26px) !important;
    }

    .viewer2026-overlay__panel button {
        min-height: 34px !important;
        padding: 6px 12px !important;
        font-size: 13px !important;
    }

    .viewer2026-overlay__counter {
        font-size: 14px !important;
        padding: 0 8px !important;
    }

    .viewer2026-carousel__card.active {
        border-radius: 26px !important;
    }

    .viewer2026-carousel__card.active img {
        border-radius: 18px !important;
    }
}


/* ===================================================== */
/* Viewer 2.6 Professional Cover Flow */
/* Исправление двойной экспозиции и профессиональная геометрия */
/* ===================================================== */

/* полностью прячем одиночное изображение overlay, чтобы не было второго документа под каруселью */
.viewer2026-overlay__image,
.viewer2026-carousel .viewer2026-overlay__image {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}

/* фон — только parallax и затемнение, без дублирования документов */
.viewer2026-overlay {
    background:
        radial-gradient(circle at 50% 34%, rgba(255,255,255,.10), rgba(0,0,0,0) 42%),
        linear-gradient(180deg, rgba(0,0,0,.26) 0%, rgba(0,0,0,.50) 58%, rgba(0,0,0,.82) 100%),
        url("../img/parallax0.webp") center center / cover fixed no-repeat !important;
}

/* сцена: больше места для нормальной карусели */
.viewer2026-carousel .viewer2026-overlay__stage {
    overflow: hidden !important;
    perspective: 1350px !important;
    perspective-origin: 50% 48% !important;
}

/* базовая карточка — компактнее, не такая огромная площадка */
.viewer2026-carousel__card {
    padding: 9px !important;
    border-radius: 20px !important;
    overflow: visible !important;
    background:
        linear-gradient(
            180deg,
            rgba(5,69,75, calc(.10 + .42 * var(--teal))) 0%,
            rgba(5,69,75, calc(.06 + .30 * var(--teal))) 100%
        ),
        rgba(255,255,255,.22) !important;
    border: 2px solid rgba(255,255,255, calc(.22 + .40 * var(--teal))) !important;
    filter: blur(var(--blur, 0px)) brightness(calc(.86 + .14 * var(--teal))) !important;
    box-shadow:
        0 18px 38px rgba(0,0,0,.30),
        inset 0 1px 0 rgba(255,255,255,.16) !important;
    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;
}

/* активная карточка: не прозрачная, но с мягким стеклом */
.viewer2026-carousel__card.active {
    padding: 10px !important;
    border-radius: 30px !important;
    background:
        linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,255,255,.90)) !important;
    border: 4px solid rgba(255,255,255,.84) !important;
    filter: blur(0) brightness(1) !important;
    box-shadow:
        0 0 0 2px rgba(180,245,255,.36),
        0 0 30px rgba(255,255,255,.50),
        0 34px 76px rgba(0,0,0,.46),
        inset 0 0 24px rgba(255,255,255,.42) !important;
    overflow: hidden !important;
}

/* активная страница внутри — почти непрозрачная, читаемая */
.viewer2026-carousel__card.active img {
    opacity: .96 !important;
    background: rgba(255,255,255,.96) !important;
    border-radius: 22px !important;
    box-shadow:
        inset 0 0 18px rgba(255,255,255,.28),
        0 10px 24px rgba(0,0,0,.18) !important;
}

/* остальные документы — мягкий фон */
.viewer2026-carousel__card:not(.active) img {
    opacity: .72 !important;
    border-radius: 14px !important;
}

/* белая стеклянная рамка активного документа */
.viewer2026-carousel__card.active::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 26px;
    pointer-events: none;
    z-index: 4;
    box-shadow:
        inset 0 0 26px rgba(255,255,255,.58),
        inset 0 0 2px rgba(255,255,255,.98);
}

/* отражение — только декоративное, без дублирования изображения на весь экран */
.viewer2026-carousel__card::before {
    content: "";
    position: absolute;
    left: 10%;
    right: 10%;
    bottom: -22%;
    height: 18%;
    border-radius: 50%;
    background:
        radial-gradient(ellipse at center, rgba(255,255,255,.22) 0%, rgba(255,255,255,.08) 42%, rgba(255,255,255,0) 72%);
    transform: scaleY(.55);
    filter: blur(9px);
    opacity: .26;
    pointer-events: none;
    z-index: 0;
}

.viewer2026-carousel__card.active::before {
    left: 7%;
    right: 7%;
    bottom: -18%;
    height: 16%;
    opacity: .34;
}

/* размеры активной области — крупно, но без заполнения всего экрана */
.viewer2026-carousel__card {
    width: min(22vw, 340px) !important;
    height: min(56vh, calc(100vh - 250px)) !important;
    max-height: min(56vh, calc(100vh - 250px)) !important;
}

.viewer2026-carousel__card.landscape {
    width: min(48vw, 780px) !important;
    height: min(56vh, calc(100vh - 250px)) !important;
    max-height: min(56vh, calc(100vh - 250px)) !important;
}

/* подписи на карточках — не перекрывают документ слишком сильно */
.viewer2026-carousel__card strong {
    bottom: 10px !important;
    left: 12px !important;
    max-width: calc(100% - 24px) !important;
    background: rgba(5,69,75,.86) !important;
    border-radius: 999px !important;
    font-size: 11px !important;
}

/* панели поверх интерфейса, но не поверх активной страницы */
.viewer2026-overlay__hint {
    z-index: 60 !important;
    background: rgba(5,69,75,.86) !important;
}

.viewer2026-overlay__panel {
    z-index: 65 !important;
    background: rgba(5,69,75,.92) !important;
}

.viewer2026-overlay__thumbs {
    z-index: 65 !important;
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
    background: rgba(5,69,75,.92) !important;
}

/* нижняя дымка должна быть за карточками, а не поверх них */
.viewer2026-carousel__track::after {
    z-index: 0 !important;
    height: 30vh !important;
    background: linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.36)) !important;
}

.viewer2026-carousel__card {
    z-index: 3;
}

.viewer2026-carousel__card.active {
    z-index: 30 !important;
}

@media (max-width: 900px) {
    .viewer2026-carousel__card {
        width: 40vw !important;
        height: min(50vh, calc(100vh - 230px)) !important;
    }

    .viewer2026-carousel__card.landscape {
        width: 82vw !important;
        height: min(50vh, calc(100vh - 230px)) !important;
    }

    .viewer2026-carousel__card.active {
        border-radius: 24px !important;
    }

    .viewer2026-carousel__card.active img {
        border-radius: 16px !important;
    }
}

@media (max-height: 720px) {
    .viewer2026-carousel__card,
    .viewer2026-carousel__card.landscape {
        height: min(48vh, calc(100vh - 220px)) !important;
    }
}


/* ===================================================== */
/* Viewer 2.8 Professional Engine */
/* Single-layer Apple Cover Flow / Adobe Bridge style */
/* ===================================================== */

.viewer2026-no-scroll {
    overflow: hidden !important;
}

/* isolate new overlay from older Viewer 2.x classes */
.viewer28 {
    position: fixed !important;
    inset: 0 !important;
    z-index: 999999 !important;
    display: none !important;
    grid-template-rows: 1fr auto auto auto !important;
    gap: 10px !important;
    padding: clamp(8px, 1vw, 16px) !important;
    font-family: "Montserrat", Arial, sans-serif !important;
    background:
        radial-gradient(circle at 50% 38%, rgba(255,255,255,.10), rgba(0,0,0,0) 42%),
        linear-gradient(180deg, rgba(0,0,0,.22) 0%, rgba(0,0,0,.47) 56%, rgba(0,0,0,.84) 100%),
        url("../img/parallax0.webp") center center / cover fixed no-repeat !important;
}

.viewer28.open {
    display: grid !important;
}

/* Explicitly hide every old overlay artifact if it exists */
.viewer28 .viewer2026-overlay__image,
.viewer28 .viewer2026-carousel__track,
.viewer28 .viewer2026-carousel__card,
.viewer28 .viewer2026-coverflow27__track,
.viewer28 .viewer2026-coverflow27__card {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}

.viewer28__stage {
    grid-row: 1 !important;
    position: relative !important;
    min-height: 0 !important;
    overflow: hidden !important;
    perspective: 1550px !important;
    perspective-origin: 50% 50% !important;
    transform-style: preserve-3d !important;
    cursor: grab !important;
    touch-action: none !important;
}

.viewer28__stage.dragging {
    cursor: grabbing !important;
}

.viewer28__stage.panning {
    cursor: move !important;
}

.viewer28__track {
    position: relative !important;
    width: 100% !important;
    height: 100% !important;
    transform-style: preserve-3d !important;
}

.viewer28__track::after {
    content: "" !important;
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    height: 34vh !important;
    background: linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.50)) !important;
    pointer-events: none !important;
    z-index: 0 !important;
}

/* Card */
.viewer28__card {
    --x: 0px;
    --y: 0px;
    --z: 0px;
    --scale: 1;
    --rotate: 0deg;
    --blur: 0px;
    --brightness: 1;
    --teal: 0;

    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    width: min(22vw, 350px) !important;
    height: min(58vh, calc(100vh - 235px)) !important;
    max-height: min(58vh, calc(100vh - 235px)) !important;
    margin: 0 !important;
    padding: 0 !important;
    transform:
        translate(-50%, -50%)
        translateX(var(--x))
        translateY(var(--y))
        translateZ(var(--z))
        rotateY(var(--rotate))
        scale(var(--scale)) !important;
    transform-origin: center center !important;
    transform-style: preserve-3d !important;
    filter: blur(var(--blur)) brightness(var(--brightness)) !important;
    transition:
        transform .48s cubic-bezier(.17,.84,.22,1),
        opacity .32s ease,
        filter .32s ease !important;
    will-change: transform, opacity, filter !important;
    user-select: none !important;
    -webkit-user-select: none !important;
    pointer-events: auto !important;
}

.viewer28__card.landscape {
    width: min(48vw, 790px) !important;
}

/* Glass page holder */
.viewer28__page {
    position: relative !important;
    width: 100% !important;
    height: 100% !important;
    padding: 9px !important;
    border-radius: 22px !important;
    background:
        linear-gradient(
            180deg,
            rgba(5, 69, 75, calc(.06 + .40 * var(--teal))) 0%,
            rgba(5, 69, 75, calc(.03 + .25 * var(--teal))) 100%
        ),
        rgba(255,255,255,.20) !important;
    border: 2px solid rgba(255,255,255, calc(.20 + .45 * var(--teal))) !important;
    box-shadow:
        0 20px 45px rgba(0,0,0,.34),
        inset 0 1px 0 rgba(255,255,255,.18) !important;
    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;
    transform-style: preserve-3d !important;
    overflow: visible !important;
}

/* Reflection */
.viewer28__page::before {
    content: "" !important;
    position: absolute !important;
    left: 7% !important;
    right: 7% !important;
    bottom: -19% !important;
    height: 18% !important;
    border-radius: 50% !important;
    background:
        radial-gradient(ellipse at center, rgba(255,255,255,.24) 0%, rgba(255,255,255,.08) 42%, rgba(255,255,255,0) 74%) !important;
    transform: scaleY(.55) !important;
    filter: blur(8px) !important;
    opacity: .34 !important;
    pointer-events: none !important;
    z-index: 0 !important;
}

.viewer28__card img {
    position: relative !important;
    z-index: 1 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    background: rgba(255,255,255,.96) !important;
    border-radius: 14px !important;
    box-shadow:
        0 9px 22px rgba(0,0,0,.22),
        inset 0 0 12px rgba(255,255,255,.30) !important;
    transform-origin: center center !important;
    transition: transform .12s ease, opacity .22s ease !important;
    pointer-events: none !important;
    user-select: none !important;
    -webkit-user-drag: none !important;
}

.viewer28__card.near img {
    opacity: .84 !important;
}

.viewer28__card.far img {
    opacity: .58 !important;
}

/* Active page: only readable page */
.viewer28__card.active {
    filter: blur(0) brightness(1) !important;
}

.viewer28__card.active .viewer28__page {
    padding: 10px !important;
    border-radius: 32px !important;
    background:
        linear-gradient(180deg, rgba(255,255,255,.97), rgba(255,255,255,.91)) !important;
    border: 4px solid rgba(255,255,255,.88) !important;
    box-shadow:
        0 0 0 2px rgba(185,245,255,.36),
        0 0 34px rgba(255,255,255,.52),
        0 34px 78px rgba(0,0,0,.48),
        inset 0 0 26px rgba(255,255,255,.42) !important;
    overflow: hidden !important;
}

.viewer28__card.active .viewer28__page::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    border-radius: 28px !important;
    z-index: 4 !important;
    pointer-events: none !important;
    box-shadow:
        inset 0 0 25px rgba(255,255,255,.60),
        inset 0 0 2px rgba(255,255,255,.98) !important;
}

.viewer28__card.active img {
    border-radius: 22px !important;
    opacity: .99 !important;
    background: #fff !important;
    box-shadow:
        inset 0 0 16px rgba(255,255,255,.25),
        0 10px 25px rgba(0,0,0,.18) !important;
}

/* Caption */
.viewer28__card figcaption {
    position: absolute !important;
    left: 14px !important;
    bottom: 14px !important;
    z-index: 5 !important;
    max-width: calc(100% - 28px) !important;
    padding: 5px 11px !important;
    border-radius: 999px !important;
    background: rgba(5,69,75,.88) !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,.28) !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* Zoom mode: side cards disappear, central document becomes Acrobat-like */
.viewer28.is-zoomed .viewer28__card:not(.active) {
    opacity: .06 !important;
    pointer-events: none !important;
}

.viewer28.is-zoomed .viewer28__card.active {
    z-index: 2000 !important;
}

.viewer28.is-zoomed .viewer28__card.active img {
    cursor: move !important;
}

/* Hint */
.viewer28__hint {
    grid-row: 2 !important;
    justify-self: center !important;
    width: min(1180px, calc(100vw - 52px)) !important;
    max-width: calc(100vw - 52px) !important;
    padding: 8px 22px !important;
    border-radius: 999px !important;
    background: rgba(5,69,75,.86) !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,.36) !important;
    font-size: clamp(12px, 1vw, 15px) !important;
    line-height: 1.22 !important;
    font-weight: 900 !important;
    text-align: center !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    box-shadow:
        0 12px 30px rgba(0,0,0,.30),
        inset 0 1px 0 rgba(255,255,255,.18) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    z-index: 80 !important;
}

/* Bottom controls preserved */
.viewer28__controls {
    grid-row: 3 !important;
    justify-self: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    max-width: calc(100vw - 28px) !important;
    padding: 10px 18px !important;
    border-radius: 32px !important;
    background: rgba(5,69,75,.92) !important;
    border: 1px solid rgba(255,255,255,.35) !important;
    box-shadow:
        0 14px 32px rgba(0,0,0,.34),
        inset 0 1px 0 rgba(255,255,255,.22) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    z-index: 90 !important;
}

.viewer28__controls button {
    min-height: 40px !important;
    padding: 8px 22px !important;
    border-radius: 24px !important;
    background: rgba(7,84,91,.96) !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,.50) !important;
    font-weight: 900 !important;
    font-size: 15px !important;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.20),
        0 8px 16px rgba(0,0,0,.18) !important;
    transition: transform .15s ease, background .15s ease, box-shadow .15s ease !important;
}

.viewer28__controls button:hover {
    background: rgba(12,104,112,.98) !important;
    transform: translateY(-2px) !important;
}

.viewer28__controls .viewer2026-overlay__counter {
    color: #fff !important;
    font-size: 18px !important;
    font-weight: 900 !important;
    padding: 0 16px !important;
    text-shadow: 0 2px 10px rgba(0,0,0,.40) !important;
}

/* Thumbnails preserved and stretched */
.viewer28__thumbs {
    grid-row: 4 !important;
    justify-self: center !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: calc(100vw - 28px) !important;
    max-width: calc(100vw - 28px) !important;
    margin: 0 auto !important;
    padding: 14px 18px 12px 18px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    border-radius: 22px !important;
    background: rgba(5,69,75,.92) !important;
    border: 1px solid rgba(255,255,255,.30) !important;
    box-shadow:
        0 -12px 34px rgba(0,0,0,.36),
        inset 0 1px 0 rgba(255,255,255,.18) !important;
    backdrop-filter: blur(14px) !important;
    -webkit-backdrop-filter: blur(14px) !important;
    scrollbar-width: thin !important;
    scroll-behavior: smooth !important;
    z-index: 90 !important;
}

.viewer28__thumbs .viewer2026-overlay__thumb {
    flex: 0 0 clamp(72px, 6vw, 94px) !important;
    width: clamp(72px, 6vw, 94px) !important;
    padding: 7px !important;
    border-radius: 13px !important;
    background: rgba(255,255,255,.88) !important;
    border: 2px solid rgba(255,255,255,.65) !important;
    box-shadow: 0 8px 18px rgba(0,0,0,.20) !important;
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease !important;
}

.viewer28__thumbs .viewer2026-overlay__thumb.landscape {
    flex-basis: clamp(135px, 12vw, 188px) !important;
    width: clamp(135px, 12vw, 188px) !important;
}

.viewer28__thumbs .viewer2026-overlay__thumb.active {
    background: rgba(255,255,255,.96) !important;
    border-color: #fff !important;
    transform: translateY(-3px) !important;
    box-shadow:
        0 0 0 3px rgba(160,245,255,.40),
        0 0 22px rgba(180,250,255,.55),
        0 12px 24px rgba(0,0,0,.24) !important;
}

.viewer28__thumbs .viewer2026-overlay__thumb img {
    width: 100% !important;
    height: clamp(58px, 5.4vw, 78px) !important;
    object-fit: cover !important;
    background: #fff !important;
    border-radius: 8px !important;
}

.viewer28__thumbs .viewer2026-overlay__thumb.landscape img {
    object-fit: contain !important;
}

.viewer28__thumbs .viewer2026-overlay__thumb span {
    display: block !important;
    margin-top: 6px !important;
    color: #fff !important;
    font-size: 13px !important;
    line-height: 1.05 !important;
    font-weight: 900 !important;
    text-align: center !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    text-shadow: 0 2px 8px rgba(0,0,0,.55) !important;
}

/* ordinary page thumbnails still understand landscape orientation */
.doc2026__thumb.landscape {
    flex-basis: 180px !important;
    width: 180px !important;
}

.doc2026__thumb.landscape img {
    object-fit: contain !important;
    background: #fff !important;
}

#doc2026Image.landscape {
    width: min(100%, 1100px);
}

/* responsive */
@media (max-width: 900px) {
    .viewer28__card {
        width: 40vw !important;
        height: min(50vh, calc(100vh - 230px)) !important;
    }

    .viewer28__card.landscape {
        width: 82vw !important;
        height: min(50vh, calc(100vh - 230px)) !important;
    }

    .viewer28__hint {
        width: calc(100vw - 24px) !important;
        max-width: calc(100vw - 24px) !important;
        white-space: normal !important;
        font-size: 11px !important;
        padding: 6px 12px !important;
    }

    .viewer28__controls {
        width: calc(100vw - 18px) !important;
        justify-content: flex-start !important;
        overflow-x: auto !important;
        padding: 7px !important;
    }

    .viewer28__controls button {
        flex: 0 0 auto !important;
        min-height: 32px !important;
        padding: 6px 12px !important;
        font-size: 12px !important;
    }

    .viewer28__controls .viewer2026-overlay__counter {
        flex: 0 0 auto !important;
        font-size: 13px !important;
        padding: 0 8px !important;
    }

    .viewer28__card.active .viewer28__page {
        border-radius: 24px !important;
    }

    .viewer28__card.active img {
        border-radius: 16px !important;
    }
}

@media (max-height: 720px) {
    .viewer28 {
        gap: 7px !important;
    }

    .viewer28__card,
    .viewer28__card.landscape {
        height: min(48vh, calc(100vh - 220px)) !important;
    }

    .viewer28__controls button {
        min-height: 32px !important;
        padding-top: 5px !important;
        padding-bottom: 5px !important;
    }

    .viewer28__thumbs {
        padding-top: 9px !important;
        padding-bottom: 8px !important;
    }
}


/* ===================================================== */
/* Viewer 2.9 Professional Cover Flow */
/* ===================================================== */
.viewer29{position:fixed!important;inset:0!important;z-index:999999!important;display:none!important;grid-template-rows:1fr auto auto auto!important;gap:10px!important;padding:clamp(8px,1vw,16px)!important;font-family:"Montserrat",Arial,sans-serif!important;background:radial-gradient(circle at 50% 38%,rgba(255,255,255,.10),rgba(0,0,0,0) 42%),linear-gradient(180deg,rgba(0,0,0,.22) 0%,rgba(0,0,0,.47) 56%,rgba(0,0,0,.84) 100%),url("../img/parallax0.webp") center center/cover fixed no-repeat!important}.viewer29.open{display:grid!important}.viewer29 .viewer2026-overlay__image,.viewer29 .viewer2026-carousel__track,.viewer29 .viewer2026-carousel__card,.viewer29 .viewer2026-coverflow27__track,.viewer29 .viewer2026-coverflow27__card,.viewer29 .viewer28__track,.viewer29 .viewer28__card{display:none!important;visibility:hidden!important;opacity:0!important}.viewer29__stage{grid-row:1!important;position:relative!important;min-height:0!important;overflow:hidden!important;perspective:1900px!important;perspective-origin:50% 48%!important;transform-style:preserve-3d!important;cursor:grab!important;touch-action:none!important}.viewer29__stage.dragging{cursor:grabbing!important}.viewer29__stage.panning{cursor:move!important}.viewer29__track{position:relative!important;width:100%!important;height:100%!important;transform-style:preserve-3d!important}.viewer29__track:after{content:""!important;position:fixed!important;left:0!important;right:0!important;bottom:0!important;height:34vh!important;background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.50))!important;pointer-events:none!important;z-index:0!important}.viewer29__card{--x:0px;--y:0px;--z:0px;--scale:1;--rotate:0deg;--blur:0px;--brightness:1;--teal:0;position:absolute!important;left:50%!important;top:50%!important;width:min(28.5vw,430px)!important;height:min(66vh,calc(100vh - 220px))!important;max-height:min(66vh,calc(100vh - 220px))!important;margin:0!important;padding:0!important;transform:translate(-50%,-50%) translateX(var(--x)) translateY(var(--y)) translateZ(var(--z)) rotateY(var(--rotate)) scale(var(--scale))!important;transform-origin:center center!important;transform-style:preserve-3d!important;filter:blur(var(--blur)) brightness(var(--brightness))!important;transition:transform .48s cubic-bezier(.17,.84,.22,1),opacity .32s ease,filter .32s ease!important;will-change:transform,opacity,filter!important;user-select:none!important;-webkit-user-select:none!important;pointer-events:auto!important}.viewer29__card.landscape{width:min(54vw,860px)!important}.viewer29__page{position:relative!important;width:100%!important;height:100%!important;padding:9px!important;border-radius:22px!important;background:linear-gradient(180deg,rgba(5,69,75,calc(.08 + .40 * var(--teal))) 0%,rgba(5,69,75,calc(.04 + .25 * var(--teal))) 100%),rgba(255,255,255,.22)!important;border:2px solid rgba(255,255,255,calc(.22 + .45 * var(--teal)))!important;box-shadow:0 20px 45px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.18)!important;backdrop-filter:blur(7px)!important;-webkit-backdrop-filter:blur(7px)!important;transform-style:preserve-3d!important;overflow:visible!important}.viewer29__page:before{content:""!important;position:absolute!important;left:7%!important;right:7%!important;bottom:-18%!important;height:16%!important;border-radius:50%!important;background:radial-gradient(ellipse at center,rgba(255,255,255,.22) 0%,rgba(255,255,255,.08) 42%,rgba(255,255,255,0) 74%)!important;transform:scaleY(.55)!important;filter:blur(8px)!important;opacity:.34!important;pointer-events:none!important;z-index:0!important}.viewer29__card img{position:relative!important;z-index:1!important;display:block!important;width:100%!important;height:100%!important;object-fit:contain!important;background:#fff!important;border-radius:14px!important;box-shadow:0 9px 22px rgba(0,0,0,.22),inset 0 0 12px rgba(255,255,255,.30)!important;transform-origin:center center!important;transition:transform .12s ease,opacity .22s ease!important;pointer-events:none!important;user-select:none!important;-webkit-user-drag:none!important}.viewer29__card.near img{opacity:.86!important}.viewer29__card.far img{opacity:.58!important}.viewer29__card.active{filter:blur(0) brightness(1)!important}.viewer29__card.active .viewer29__page{padding:10px!important;border-radius:32px!important;background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(255,255,255,.92))!important;border:4px solid rgba(255,255,255,.88)!important;box-shadow:0 0 0 2px rgba(185,245,255,.36),0 0 34px rgba(255,255,255,.52),0 34px 78px rgba(0,0,0,.48),inset 0 0 26px rgba(255,255,255,.42)!important;overflow:hidden!important}.viewer29__card.active .viewer29__page:after{content:""!important;position:absolute!important;inset:0!important;border-radius:28px!important;z-index:4!important;pointer-events:none!important;box-shadow:inset 0 0 25px rgba(255,255,255,.60),inset 0 0 2px rgba(255,255,255,.98)!important}.viewer29__card.active img{border-radius:22px!important;opacity:1!important;background:#fff!important;box-shadow:inset 0 0 16px rgba(255,255,255,.25),0 10px 25px rgba(0,0,0,.18)!important}.viewer29__card figcaption{position:absolute!important;left:14px!important;bottom:14px!important;z-index:5!important;max-width:calc(100% - 28px)!important;padding:5px 11px!important;border-radius:999px!important;background:rgba(5,69,75,.88)!important;color:#fff!important;border:1px solid rgba(255,255,255,.28)!important;font-size:12px!important;line-height:1!important;font-weight:900!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.viewer29.is-zoomed .viewer29__card:not(.active){opacity:.06!important;pointer-events:none!important}.viewer29.is-zoomed .viewer29__card.active{z-index:3000!important}.viewer29.is-zoomed .viewer29__card.active img{cursor:move!important}.viewer29__hint{grid-row:2!important;justify-self:center!important;width:min(1180px,calc(100vw - 52px))!important;max-width:calc(100vw - 52px)!important;padding:8px 22px!important;border-radius:999px!important;background:rgba(5,69,75,.86)!important;color:#fff!important;border:1px solid rgba(255,255,255,.36)!important;font-size:clamp(12px,1vw,15px)!important;line-height:1.22!important;font-weight:900!important;text-align:center!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;box-shadow:0 12px 30px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.18)!important;backdrop-filter:blur(12px)!important;-webkit-backdrop-filter:blur(12px)!important;z-index:80!important}.viewer29__controls{grid-row:3!important;justify-self:center!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;max-width:calc(100vw - 28px)!important;padding:10px 18px!important;border-radius:32px!important;background:rgba(5,69,75,.92)!important;border:1px solid rgba(255,255,255,.35)!important;box-shadow:0 14px 32px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.22)!important;backdrop-filter:blur(16px)!important;-webkit-backdrop-filter:blur(16px)!important;z-index:90!important}.viewer29__controls button{min-height:40px!important;padding:8px 22px!important;border-radius:24px!important;background:rgba(7,84,91,.96)!important;color:#fff!important;border:1px solid rgba(255,255,255,.50)!important;font-weight:900!important;font-size:15px!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.20),0 8px 16px rgba(0,0,0,.18)!important;transition:transform .15s ease,background .15s ease,box-shadow .15s ease!important}.viewer29__controls button:hover{background:rgba(12,104,112,.98)!important;transform:translateY(-2px)!important}.viewer29__controls .viewer2026-overlay__counter{color:#fff!important;font-size:18px!important;font-weight:900!important;padding:0 16px!important;text-shadow:0 2px 10px rgba(0,0,0,.40)!important}.viewer29__thumbs{grid-row:4!important;justify-self:center!important;display:flex!important;align-items:center!important;gap:10px!important;width:calc(100vw - 28px)!important;max-width:calc(100vw - 28px)!important;margin:0 auto!important;padding:14px 18px 12px 18px!important;overflow-x:auto!important;overflow-y:hidden!important;border-radius:22px!important;background:rgba(5,69,75,.92)!important;border:1px solid rgba(255,255,255,.30)!important;box-shadow:0 -12px 34px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.18)!important;backdrop-filter:blur(14px)!important;-webkit-backdrop-filter:blur(14px)!important;scrollbar-width:thin!important;scroll-behavior:smooth!important;z-index:90!important}.viewer29__thumbs .viewer2026-overlay__thumb{flex:0 0 clamp(72px,6vw,94px)!important;width:clamp(72px,6vw,94px)!important;padding:7px!important;border-radius:13px!important;background:rgba(255,255,255,.88)!important;border:2px solid rgba(255,255,255,.65)!important;box-shadow:0 8px 18px rgba(0,0,0,.20)!important;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease!important}.viewer29__thumbs .viewer2026-overlay__thumb.landscape{flex-basis:clamp(135px,12vw,188px)!important;width:clamp(135px,12vw,188px)!important}.viewer29__thumbs .viewer2026-overlay__thumb.active{background:rgba(255,255,255,.96)!important;border-color:#fff!important;transform:translateY(-3px)!important;box-shadow:0 0 0 3px rgba(160,245,255,.40),0 0 22px rgba(180,250,255,.55),0 12px 24px rgba(0,0,0,.24)!important}.viewer29__thumbs .viewer2026-overlay__thumb img{width:100%!important;height:clamp(58px,5.4vw,78px)!important;object-fit:cover!important;background:#fff!important;border-radius:8px!important}.viewer29__thumbs .viewer2026-overlay__thumb.landscape img{object-fit:contain!important}.viewer29__thumbs .viewer2026-overlay__thumb span{display:block!important;margin-top:6px!important;color:#fff!important;font-size:13px!important;line-height:1.05!important;font-weight:900!important;text-align:center!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;text-shadow:0 2px 8px rgba(0,0,0,.55)!important}@media(max-width:900px){.viewer29__card{width:42vw!important;height:min(54vh,calc(100vh - 230px))!important}.viewer29__card.landscape{width:84vw!important;height:min(54vh,calc(100vh - 230px))!important}.viewer29__hint{width:calc(100vw - 24px)!important;max-width:calc(100vw - 24px)!important;white-space:normal!important;font-size:11px!important;padding:6px 12px!important}.viewer29__controls{width:calc(100vw - 18px)!important;justify-content:flex-start!important;overflow-x:auto!important;padding:7px!important}.viewer29__controls button{flex:0 0 auto!important;min-height:32px!important;padding:6px 12px!important;font-size:12px!important}.viewer29__controls .viewer2026-overlay__counter{flex:0 0 auto!important;font-size:13px!important;padding:0 8px!important}}@media(max-height:720px){.viewer29{gap:7px!important}.viewer29__card,.viewer29__card.landscape{height:min(52vh,calc(100vh - 220px))!important}.viewer29__controls button{min-height:32px!important;padding-top:5px!important;padding-bottom:5px!important}.viewer29__thumbs{padding-top:9px!important;padding-bottom:8px!important}}


/* ===================================================== */
/* Viewer 2.9 Fixed — nonlinear Cover Flow geometry */
/* Исправление просвечивания и пространственной модели */
/* ===================================================== */

.viewer29__stage {
    perspective: 2300px !important;
    perspective-origin: 50% 47% !important;
}

/* Центральная карточка должна физически перекрывать соседние документы */
.viewer29__card.active {
    z-index: 6000 !important;
    opacity: 1 !important;
    filter: none !important;
}

.viewer29__card.active .viewer29__page {
    background: #ffffff !important;
    border: 5px solid rgba(255,255,255,.94) !important;
    box-shadow:
        0 0 0 2px rgba(185,245,255,.42),
        0 0 42px rgba(255,255,255,.62),
        0 38px 86px rgba(0,0,0,.52),
        inset 0 0 22px rgba(255,255,255,.55) !important;
    opacity: 1 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

.viewer29__card.active img {
    opacity: 1 !important;
    background: #ffffff !important;
    mix-blend-mode: normal !important;
    filter: none !important;
}

/* Убираем стеклянную прозрачность только у активного документа */
.viewer29__card.active .viewer29__page::after {
    box-shadow:
        inset 0 0 18px rgba(255,255,255,.45),
        inset 0 0 2px rgba(255,255,255,.95) !important;
}

/* Соседи становятся фоном, а не вторым читаемым документом */
.viewer29__card:not(.active) {
    pointer-events: auto;
    transform-style: preserve-3d !important;
}

.viewer29__card:not(.active) .viewer29__page {
    background:
        linear-gradient(
            180deg,
            rgba(5,69,75, calc(.12 + .34 * var(--teal))) 0%,
            rgba(5,69,75, calc(.06 + .20 * var(--teal))) 100%
        ),
        rgba(255,255,255,.18) !important;
    border-color: rgba(255,255,255, calc(.18 + .34 * var(--teal))) !important;
    box-shadow:
        0 18px 38px rgba(0,0,0,.32),
        inset 0 1px 0 rgba(255,255,255,.14) !important;
}

/* Ближние боковые карточки видны, но не перекрывают центр */
.viewer29__card.near img {
    opacity: .58 !important;
}

/* Второй ряд уходит глубоко назад */
.viewer29__card.middle img {
    opacity: .34 !important;
}

/* Дальние почти исчезают */
.viewer29__card.far {
    pointer-events: none !important;
}

.viewer29__card.far img {
    opacity: .12 !important;
}

/* Чтобы боковые страницы не выглядели как параллельная стена */
.viewer29__card:not(.active) img {
    background: rgba(255,255,255,.72) !important;
    box-shadow:
        0 8px 18px rgba(0,0,0,.24),
        inset 0 0 10px rgba(255,255,255,.18) !important;
}

/* Немного увеличиваем центральную читаемую страницу */
.viewer29__card {
    width: min(30vw, 460px) !important;
    height: min(68vh, calc(100vh - 218px)) !important;
    max-height: min(68vh, calc(100vh - 218px)) !important;
}

.viewer29__card.landscape {
    width: min(56vw, 880px) !important;
}

/* При zoom оставляем строго один активный документ */
.viewer29.is-zoomed .viewer29__card:not(.active) {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

/* Дополнительная защита от старых слоев */
.viewer29 .viewer2026-overlay__image,
.viewer29 .viewer2026-carousel__card,
.viewer29 .viewer2026-coverflow27__card,
.viewer29 .viewer28__card {
    display: none !important;
}

/* На малых экранах уменьшаем агрессию размеров */
@media (max-width: 900px) {
    .viewer29__card {
        width: 44vw !important;
        height: min(56vh, calc(100vh - 230px)) !important;
    }

    .viewer29__card.landscape {
        width: 86vw !important;
    }
}

@media (max-height: 720px) {
    .viewer29__card,
    .viewer29__card.landscape {
        height: min(54vh, calc(100vh - 218px)) !important;
    }
}


/* ===================================================== */
/* Viewer 3.0 Next Generation */
/* One active page + separate 3D side cards */
/* ===================================================== */
.viewer2026-no-scroll{overflow:hidden!important}.viewer30{position:fixed!important;inset:0!important;z-index:999999!important;display:none!important;grid-template-rows:1fr auto auto auto!important;gap:10px!important;padding:clamp(8px,1vw,16px)!important;font-family:"Montserrat",Arial,sans-serif!important;background:radial-gradient(circle at 50% 38%,rgba(255,255,255,.10),rgba(0,0,0,0) 42%),linear-gradient(180deg,rgba(0,0,0,.20) 0%,rgba(0,0,0,.47) 56%,rgba(0,0,0,.84) 100%),url("../img/parallax0.webp") center center/cover fixed no-repeat!important}.viewer30.open{display:grid!important}.viewer30 .viewer2026-overlay__image,.viewer30 .viewer2026-carousel__track,.viewer30 .viewer2026-carousel__card,.viewer30 .viewer2026-coverflow27__track,.viewer30 .viewer2026-coverflow27__card,.viewer30 .viewer28__track,.viewer30 .viewer28__card,.viewer30 .viewer29__track,.viewer30 .viewer29__card{display:none!important;visibility:hidden!important;opacity:0!important}.viewer30__stage{grid-row:1!important;position:relative!important;min-height:0!important;overflow:hidden!important;perspective:2300px!important;perspective-origin:50% 47%!important;transform-style:preserve-3d!important;cursor:grab!important;touch-action:none!important}.viewer30__stage.dragging{cursor:grabbing!important}.viewer30__stage.panning{cursor:move!important}.viewer30__stage:after{content:""!important;position:fixed!important;left:0!important;right:0!important;bottom:0!important;height:34vh!important;background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.50))!important;pointer-events:none!important;z-index:0!important}.viewer30__sides{position:absolute!important;inset:0!important;transform-style:preserve-3d!important;z-index:1!important}.viewer30__side{--sw:320px;--sh:520px;--x:0px;--y:0px;--z:0px;--rotate:0deg;--scale:.7;--blur:0px;--brightness:1;--teal:.5;position:absolute!important;left:50%!important;top:50%!important;width:var(--sw)!important;height:var(--sh)!important;margin:0!important;transform:translate(-50%,-50%) translateX(var(--x)) translateY(var(--y)) translateZ(var(--z)) rotateY(var(--rotate)) scale(var(--scale))!important;transform-origin:center center!important;transform-style:preserve-3d!important;filter:blur(var(--blur)) brightness(var(--brightness))!important;transition:transform .46s cubic-bezier(.17,.84,.22,1),opacity .30s ease,filter .30s ease!important;will-change:transform,opacity,filter!important;user-select:none!important}.viewer30__sidePage{position:relative!important;width:100%!important;height:100%!important;padding:8px!important;border-radius:20px!important;background:linear-gradient(180deg,rgba(5,69,75,calc(.11 + .36 * var(--teal))) 0%,rgba(5,69,75,calc(.05 + .22 * var(--teal))) 100%),rgba(255,255,255,.18)!important;border:2px solid rgba(255,255,255,calc(.20 + .35 * var(--teal)))!important;box-shadow:0 18px 38px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.14)!important;backdrop-filter:blur(7px)!important;-webkit-backdrop-filter:blur(7px)!important}.viewer30__sidePage:before{content:""!important;position:absolute!important;left:8%!important;right:8%!important;bottom:-17%!important;height:16%!important;border-radius:50%!important;background:radial-gradient(ellipse at center,rgba(255,255,255,.18),rgba(255,255,255,0) 72%)!important;filter:blur(8px)!important;opacity:.26!important;pointer-events:none!important}.viewer30__side img{display:block!important;position:relative!important;z-index:1!important;width:100%!important;height:100%!important;object-fit:contain!important;background:rgba(255,255,255,.72)!important;border-radius:13px!important;box-shadow:0 8px 18px rgba(0,0,0,.24),inset 0 0 10px rgba(255,255,255,.18)!important;opacity:.58!important;user-select:none!important;-webkit-user-drag:none!important;pointer-events:none!important}.viewer30__side.middle img{opacity:.34!important}.viewer30__side.far{pointer-events:none!important}.viewer30__side.far img{opacity:.12!important}.viewer30__side figcaption{position:absolute!important;left:12px!important;bottom:12px!important;z-index:5!important;max-width:calc(100% - 24px)!important;padding:5px 10px!important;border-radius:999px!important;background:rgba(5,69,75,.86)!important;color:#fff!important;border:1px solid rgba(255,255,255,.24)!important;font-size:11px!important;line-height:1!important;font-weight:900!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.viewer30__active{--aw:460px;--ah:660px;position:absolute!important;left:50%!important;top:50%!important;width:var(--aw)!important;height:var(--ah)!important;margin:0!important;transform:translate(-50%,-50%)!important;z-index:10000!important;transition:transform .34s cubic-bezier(.17,.84,.22,1)!important;user-select:none!important}.viewer30__activePage{position:relative!important;width:100%!important;height:100%!important;padding:10px!important;border-radius:32px!important;background:#fff!important;border:5px solid rgba(255,255,255,.94)!important;box-shadow:0 0 0 2px rgba(185,245,255,.42),0 0 42px rgba(255,255,255,.62),0 38px 86px rgba(0,0,0,.52),inset 0 0 22px rgba(255,255,255,.55)!important;overflow:hidden!important}.viewer30__activePage:after{content:""!important;position:absolute!important;inset:0!important;border-radius:28px!important;z-index:4!important;pointer-events:none!important;box-shadow:inset 0 0 18px rgba(255,255,255,.45),inset 0 0 2px rgba(255,255,255,.95)!important}.viewer30__active img{position:relative!important;z-index:1!important;display:block!important;width:100%!important;height:100%!important;object-fit:contain!important;background:#fff!important;border-radius:22px!important;opacity:1!important;filter:none!important;mix-blend-mode:normal!important;box-shadow:inset 0 0 16px rgba(255,255,255,.25),0 10px 25px rgba(0,0,0,.18)!important;transform-origin:center center!important;transition:transform .12s ease!important;user-select:none!important;-webkit-user-drag:none!important;pointer-events:none!important}.viewer30__active figcaption{position:absolute!important;left:16px!important;bottom:16px!important;z-index:5!important;max-width:calc(100% - 32px)!important;padding:5px 12px!important;border-radius:999px!important;background:rgba(5,69,75,.88)!important;color:#fff!important;border:1px solid rgba(255,255,255,.28)!important;font-size:12px!important;line-height:1!important;font-weight:900!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.viewer30.is-zoomed .viewer30__sides{opacity:0!important;visibility:hidden!important;pointer-events:none!important}.viewer30.is-zoomed .viewer30__active{z-index:20000!important}.viewer30__hint{grid-row:2!important;justify-self:center!important;width:min(1180px,calc(100vw - 52px))!important;max-width:calc(100vw - 52px)!important;padding:8px 22px!important;border-radius:999px!important;background:rgba(5,69,75,.86)!important;color:#fff!important;border:1px solid rgba(255,255,255,.36)!important;font-size:clamp(12px,1vw,15px)!important;line-height:1.22!important;font-weight:900!important;text-align:center!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;box-shadow:0 12px 30px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.18)!important;backdrop-filter:blur(12px)!important;-webkit-backdrop-filter:blur(12px)!important;z-index:80!important}.viewer30__controls{grid-row:3!important;justify-self:center!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;max-width:calc(100vw - 28px)!important;padding:10px 18px!important;border-radius:32px!important;background:rgba(5,69,75,.92)!important;border:1px solid rgba(255,255,255,.35)!important;box-shadow:0 14px 32px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.22)!important;backdrop-filter:blur(16px)!important;-webkit-backdrop-filter:blur(16px)!important;z-index:90!important}.viewer30__controls button{min-height:40px!important;padding:8px 22px!important;border-radius:24px!important;background:rgba(7,84,91,.96)!important;color:#fff!important;border:1px solid rgba(255,255,255,.50)!important;font-weight:900!important;font-size:15px!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.20),0 8px 16px rgba(0,0,0,.18)!important;transition:transform .15s ease,background .15s ease,box-shadow .15s ease!important}.viewer30__controls button:hover{background:rgba(12,104,112,.98)!important;transform:translateY(-2px)!important}.viewer30__controls .viewer2026-overlay__counter{color:#fff!important;font-size:18px!important;font-weight:900!important;padding:0 16px!important;text-shadow:0 2px 10px rgba(0,0,0,.40)!important}.viewer30__thumbs{grid-row:4!important;justify-self:center!important;display:flex!important;align-items:center!important;gap:10px!important;width:calc(100vw - 28px)!important;max-width:calc(100vw - 28px)!important;margin:0 auto!important;padding:14px 18px 12px!important;overflow-x:auto!important;overflow-y:hidden!important;border-radius:22px!important;background:rgba(5,69,75,.92)!important;border:1px solid rgba(255,255,255,.30)!important;box-shadow:0 -12px 34px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.18)!important;backdrop-filter:blur(14px)!important;-webkit-backdrop-filter:blur(14px)!important;scrollbar-width:thin!important;scroll-behavior:smooth!important;z-index:90!important}.viewer30__thumbs .viewer2026-overlay__thumb{flex:0 0 clamp(72px,6vw,94px)!important;width:clamp(72px,6vw,94px)!important;padding:7px!important;border-radius:13px!important;background:rgba(255,255,255,.88)!important;border:2px solid rgba(255,255,255,.65)!important;box-shadow:0 8px 18px rgba(0,0,0,.20)!important;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease!important}.viewer30__thumbs .viewer2026-overlay__thumb.landscape{flex-basis:clamp(135px,12vw,188px)!important;width:clamp(135px,12vw,188px)!important}.viewer30__thumbs .viewer2026-overlay__thumb.active{background:rgba(255,255,255,.96)!important;border-color:#fff!important;transform:translateY(-3px)!important;box-shadow:0 0 0 3px rgba(160,245,255,.40),0 0 22px rgba(180,250,255,.55),0 12px 24px rgba(0,0,0,.24)!important}.viewer30__thumbs .viewer2026-overlay__thumb img{width:100%!important;height:clamp(58px,5.4vw,78px)!important;object-fit:cover!important;background:#fff!important;border-radius:8px!important}.viewer30__thumbs .viewer2026-overlay__thumb.landscape img{object-fit:contain!important}.viewer30__thumbs .viewer2026-overlay__thumb span{display:block!important;margin-top:6px!important;color:#fff!important;font-size:13px!important;line-height:1.05!important;font-weight:900!important;text-align:center!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;text-shadow:0 2px 8px rgba(0,0,0,.55)!important}.doc2026__thumb.landscape{flex-basis:180px!important;width:180px!important}.doc2026__thumb.landscape img{object-fit:contain!important;background:#fff!important}#doc2026Image.landscape{width:min(100%,1100px)}@media(max-width:900px){.viewer30__hint{width:calc(100vw - 24px)!important;max-width:calc(100vw - 24px)!important;white-space:normal!important;font-size:11px!important;padding:6px 12px!important}.viewer30__controls{width:calc(100vw - 18px)!important;justify-content:flex-start!important;overflow-x:auto!important;padding:7px!important}.viewer30__controls button{flex:0 0 auto!important;min-height:32px!important;padding:6px 12px!important;font-size:12px!important}.viewer30__controls .viewer2026-overlay__counter{flex:0 0 auto!important;font-size:13px!important;padding:0 8px!important}}@media(max-height:720px){.viewer30{gap:7px!important}.viewer30__controls button{min-height:32px!important;padding-top:5px!important;padding-bottom:5px!important}.viewer30__thumbs{padding-top:9px!important;padding-bottom:8px!important}}


/* ===================================================== */
/* Viewer 3.0 Fix — боковые документы рядом с основной */
/* ===================================================== */
.viewer30__sides{
    z-index:8500!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
}
.viewer30__active{
    z-index:10000!important;
}
.viewer30__side{
    display:block!important;
    visibility:visible!important;
    opacity:var(--side-opacity, .86);
    transform-style:preserve-3d!important;
}
.viewer30__sidePage{
    background:
        linear-gradient(180deg,rgba(5,69,75,calc(.08 + .30 * var(--teal))) 0%,rgba(5,69,75,calc(.04 + .20 * var(--teal))) 100%),
        rgba(255,255,255,.34)!important;
    border:2px solid rgba(255,255,255,calc(.28 + .40 * var(--teal)))!important;
    box-shadow:0 18px 38px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.20)!important;
}
.viewer30__side.near img{
    opacity:.88!important;
}
.viewer30__side.middle img{
    opacity:.58!important;
}
.viewer30__side.far img{
    opacity:.28!important;
}
.viewer30__side img{
    background:rgba(255,255,255,.88)!important;
}
/* основная страница остается единственной читаемой и не пропускает соседей */
.viewer30__activePage,
.viewer30__active img{
    opacity:1!important;
    background:#fff!important;
}


/* ===================================================== */
/* Viewer 3.1 — active drag + readable side documents */
/* ===================================================== */

.viewer30__active {
    transition: transform .42s cubic-bezier(.17,.84,.22,1) !important;
}

.viewer30__active.is-dragging {
    transition: none !important;
    cursor: grabbing !important;
    will-change: transform !important;
}

.viewer30__stage.dragging .viewer30__active {
    will-change: transform !important;
}

.viewer30__sidePage {
    background:
        linear-gradient(
            180deg,
            rgba(5,69,75, calc(.07 + .28 * var(--teal))) 0%,
            rgba(5,69,75, calc(.03 + .16 * var(--teal))) 100%
        ),
        rgba(255,255,255,.24) !important;
}





.viewer30__side.far img {
    opacity: .22 !important;
}

.viewer30__active.is-dragging .viewer30__activePage {
    box-shadow:
        0 0 0 2px rgba(185,245,255,.50),
        0 0 50px rgba(255,255,255,.70),
        0 44px 94px rgba(0,0,0,.58),
        inset 0 0 22px rgba(255,255,255,.55) !important;
}

.viewer30__stage {
    cursor: grab !important;
}



.viewer30__stage.panning {
    cursor: move !important;
}


/* ===================================================== */
/* Viewer 3.2 — реальное перетаскивание основной картинки */
/* ===================================================== */

.viewer30__active {
    --drag-x: 0px;
    --drag-rot: 0deg;
    transform:
        translate(-50%, -50%)
        translateX(var(--drag-x))
        rotateY(var(--drag-rot)) !important;
    transform-style: preserve-3d !important;
    transition: transform .38s cubic-bezier(.17,.84,.22,1) !important;
    cursor: grab !important;
    touch-action: none !important;
}

.viewer30__active.is-dragging {
    transition: none !important;
    cursor: grabbing !important;
    z-index: 30000 !important;
}

.viewer30__active.is-dragging .viewer30__activePage {
    box-shadow:
        0 0 0 2px rgba(185,245,255,.55),
        0 0 54px rgba(255,255,255,.72),
        0 46px 96px rgba(0,0,0,.60),
        inset 0 0 22px rgba(255,255,255,.55) !important;
}

.viewer30__stage.dragging {
    cursor: grabbing !important;
}

/* При 100% мышью двигается центральный документ. При увеличении >100% двигается само изображение внутри документа. */
.viewer30.is-zoomed .viewer30__active {
    cursor: move !important;
}

/* Боковые документы меньше повернуты и лучше читаются */
.viewer30__side.near img {
    opacity: .76 !important;
    background: rgba(255,255,255,.86) !important;
}

.viewer30__side.middle img {
    opacity: .54 !important;
    background: rgba(255,255,255,.78) !important;
}

.viewer30__sidePage {
    backdrop-filter: blur(4px) !important;
    -webkit-backdrop-filter: blur(4px) !important;
}


/* Viewer 3.2 Glass update */

.viewer30__activePage{
background:rgba(255,255,255,.78)!important;
backdrop-filter:blur(10px)!important;
-webkit-backdrop-filter:blur(10px)!important;
border:4px solid rgba(255,255,255,.70)!important;
box-shadow:0 30px 70px rgba(0,0,0,.45),inset 0 0 18px rgba(255,255,255,.45)!important;
}

.viewer30__thumbs .viewer2026-overlay__thumb{
background:rgba(255,255,255,.40)!important;
backdrop-filter:blur(6px)!important;
-webkit-backdrop-filter:blur(6px)!important;
border:1px solid rgba(255,255,255,.35)!important;
}

.viewer30__thumbs .viewer2026-overlay__thumb.active{
background:rgba(255,255,255,.62)!important;
border:2px solid rgba(255,255,255,.80)!important;
box-shadow:0 0 18px rgba(180,255,255,.45),0 10px 22px rgba(0,0,0,.25)!important;
}

.viewer30__thumbs .viewer2026-overlay__thumb img{
background:rgba(255,255,255,.82)!important;
border-radius:8px!important;
}

/* v.401 transparent thumbnail backgrounds */
.doc2026__thumb,
.doc2026__thumb::before,
.doc2026__thumb::after,
.doc2026__thumb-card,
.doc2026__thumb-inner,
.doc2026__thumb-wrap{
background:transparent!important;
box-shadow:none!important;
}
.doc2026__thumb .is-active,
.doc2026__thumb.active,
.doc2026__thumb.selected{
background:transparent!important;
}

/* v.604 — active upper-navigation button: red-brown background and white text. */
.topnav > a[aria-current="page"]:not(.icon),
.topnav > a.active:not(.icon),
.topnav > a.categories__title.title:not(.icon) {
  background-color: rgba(133, 9, 9, 1) !important;
  color: #fff !important;
}

.topnav > a[aria-current="page"]:not(.icon) span,
.topnav > a.active:not(.icon) span,
.topnav > a.categories__title.title:not(.icon) span {
  color: #fff !important;
}

/* v.800: remove decorative background strips site-wide in both themes */
.bgimg-2,
.bgimg-3 {
    display: none !important;
    min-height: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
}


/* v.1192 — service-card actions belong to their cards.
   Applies only where a main action is nested inside a service card. */
.services__column > .services__item {
  display: flex;
  flex-direction: column;
}

.services__column > .services__item > .main-block__buttons {
  width: 100%;
  margin: auto 0 0 0 !important;
  padding-top: 24px;
  flex: 0 0 auto;
  align-items: center !important;
  justify-content: flex-start !important;
}

.services__column > .services__item > .main-block__buttons > .main-block__button {
  margin: 0 !important;
}

@media (max-width: 600px) {
  .services__column > .services__item > .main-block__buttons {
    padding-top: 18px;
  }
}

/* v4444-text-select: allow normal mouse/touch text selection site-wide */
html, body, body * {
  -webkit-user-select: text !important;
  -moz-user-select: text !important;
  -ms-user-select: text !important;
  user-select: text !important;
}
input, textarea, [contenteditable="true"] {
  -webkit-user-select: text !important;
  -moz-user-select: text !important;
  -ms-user-select: text !important;
  user-select: text !important;
}


/* ---- css/first-viewport-base-access-v4093.css ---- */
/* ===== css/shared-example-fade.css?v=1014 ===== */
/* v.972 — extracted from identical inline HTML styles. */
#example .new { opacity: 0; }
    #example .div_opacity {
        -webkit-transition: opacity .1s ease-in-out;
        -moz-transition: opacity .1s ease-in-out;
        -ms-transition: opacity .1s ease-in-out;
        -o-transition: opacity .1s ease-in-out;
        transition: opacity .1s ease-in-out;
        opacity: 1;
    }


/* ===== css/shared-standard-parallax.css?v=1014 ===== */
/* v.972 — extracted from identical inline HTML styles. */
/* Create a Parallax Effect */
  .bgimg-1, .bgimg-2, .bgimg-3 {
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }
  
  /* First image (Logo. Full height) */
  .bgimg-1 {
    background-image: url("../img/parallax400.webp");
    /* min-height: 100%; */
    min-height: 200px;
  }
  
  /* Second image (Portfolio) */
  .bgimg-2 {
    background-image: url("../img/parallax0.webp");
    min-height: 300px;
  }
  
  /* Third image (Contact) */
  .bgimg-3 {
    background-image: url("../img/parallax400.webp");
    min-height: 300px;
  }
  
  .w3-wide {letter-spacing: 10px;}
  .w3-hover-opacity {cursor: pointer;}
  
  /* Turn off parallax scrolling for tablets and phones */
  @media only screen and (max-device-width: 1600px) {
    /* .bgimg-1, .bgimg-2, .bgimg-3  */
    .bgimg-2, .bgimg-3 
    {
      background-attachment: scroll;
      min-height: 600px;
    }
  }

/* Phase 2: accessibility improvements without changing the visual design */
.skip-link {
  position: fixed;
  left: 12px;
  top: 12px;
  z-index: 2147483647;
  padding: 10px 14px;
  border-radius: 4px;
  background: #fff;
  color: #111;
  font: 600 14px/1.2 Arial, sans-serif;
  text-decoration: none;
  box-shadow: 0 2px 10px rgba(0,0,0,.25);
  transform: translateY(-180%);
  transition: transform .15s ease;
}
.skip-link:focus { transform: translateY(0); }

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid currentColor;
  outline-offset: 3px;
}

#page-content-anchor {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {
  html:focus-within { scroll-behavior: auto !important; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}