:root
{
	--primary-font:"Inter", sans-serif;
	--font-size: 16px;
	--gap:20px;
	--indent: 20px;
	--vu:10px;
	--header-height:calc(4 * var(--vu));
	--footer-height:calc(3 * var(--vu));
	--border-color:#DDD;
	--radius:16px;
	--black: #0E1111;
	--white: #FFF;
	--blue: #33BFDB;
	--lightgray:#F8F8F8;
	--background-color:#F4F4F4;
	--swiper-preloader-color:#ddd;
	--swiper-theme-color: var(--black);
	--transition-time:.4s;
	--transition-ease:cubic-bezier(0.22, 1, 0.36, 1);
	--transition:all var(--transition-time) ease-in-out;
	--icon-close:url("data:image/svg+xml, %3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.8721 15.6607C16.9516 15.7402 17.0147 15.8347 17.0578 15.9386C17.1008 16.0425 17.123 16.1539 17.123 16.2664C17.123 16.3789 17.1008 16.4903 17.0578 16.5942C17.0147 16.6981 16.9516 16.7925 16.8721 16.8721C16.7925 16.9516 16.6981 17.0147 16.5942 17.0578C16.4903 17.1008 16.3789 17.123 16.2664 17.123C16.1539 17.123 16.0425 17.1008 15.9386 17.0578C15.8347 17.0147 15.7402 16.9516 15.6607 16.8721L8.56148 9.77179L1.46227 16.8721C1.30163 17.0327 1.08375 17.123 0.856576 17.123C0.629398 17.123 0.411524 17.0327 0.250885 16.8721C0.0902461 16.7114 4.47822e-09 16.4936 0 16.2664C-4.47822e-09 16.0392 0.0902461 15.8213 0.250885 15.6607L7.35116 8.56148L0.250885 1.46227C0.0902461 1.30163 0 1.08375 0 0.856576C0 0.629398 0.0902461 0.411524 0.250885 0.250885C0.411524 0.0902461 0.629398 0 0.856576 0C1.08375 0 1.30163 0.0902461 1.46227 0.250885L8.56148 7.35116L15.6607 0.250885C15.8213 0.0902461 16.0392 -4.47822e-09 16.2664 0C16.4936 4.47822e-09 16.7114 0.0902461 16.8721 0.250885C17.0327 0.411524 17.123 0.629398 17.123 0.856576C17.123 1.08375 17.0327 1.30163 16.8721 1.46227L9.77179 8.56148L16.8721 15.6607Z' fill='%2333BFDB'/%3E%3C/svg%3E");
}

@media (min-width: 640px)
{
	:root
	{
		--indent: 40px;
	}
}

@media (min-width: 990px)
{
	:root
	{
		--font-size: 16px;
		--header-height:calc(5 * var(--vu));
	}
}

html
{
	overflow-x: hidden;
	width: 100vw;
	scroll-behavior: smooth;
	scroll-padding-top:calc(var(--header-height) + var(--vu));
}

body
{
	font-family:var(--primary-font);
	font-size:var(--font-size);
	font-weight: 200;
	font-optical-sizing: auto;
	color:var(--white);
	display: flex;
	flex-direction: column;
	background-color:var(--black);
	overflow-x: hidden;
}

main
{
	flex: 1 0 auto;
	/*margin-top:var(--header-height);*/
}

footer
{
	flex-shrink: 0;
}

a
{
	color:var(--white);
	text-decoration: none;
	-webkit-tap-highlight-color: transparent;
}

h1,
h2,
h3,
h4,
.h1,
.h2,
.h3,
.h4
{
	font-family:var(--secondary-font);
	font-weight: 500;
	text-transform: uppercase;
	line-height: 1.3;
	margin-bottom: calc(1 * var(--vu));
}

h1,
.h1
{
	text-transform: uppercase;
	font-size: 25px;
}

h2,
.h2
{
	font-size: 25px;
	line-height: 1.3;
}

b
{
	font-weight: 500;
}

textarea
{
	resize: none;
}

picture source
{
	display: none;
}

*,
*:focus,
*:hover
{
	outline: none;
}

@media (max-width: 340px)
{
	h2,
	.h2
	{
		font-size: 14.5px;
	}
}

@media (min-width: 990px)
{
	h1,
	.h1
	{
		font-size: 25px;
	}
	
	h2,
	.h2
	{
		font-size: 25px;
	}
}

/*Контейнер*/
.container
{
	width: calc(100vw - var(--indent)*2);
	margin-left: auto;
	margin-right: auto;
	height: 100%;
}

@media (min-width: 990px)
{
	.container
	{
		width: calc(100vw - 160px);
	}
}

@media (min-width: 1460px)
{
	.container
	{
		width: 1440px;
	}
}

/*Сетка*/
.grid
{
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap:var(--gap);
}

@media (max-width: 640px)
{
	.col-xs-1
	{
		grid-column: span 1;
	}
	
	.col-xs-2
	{
		grid-column: span 2;
	}
	
	.col-xs-3
	{
		grid-column: span 3;
	}
	
	.col-xs-4
	{
		grid-column: span 4;
	}
	
	.col-xs-5
	{
		grid-column: span 5;
	}
	
	.col-xs-6
	{
		grid-column: span 6;
	}
	
	.order-1
	{
		order: 1;
	}
	
	.order-2
	{
		order: 2;
	}
	
	.order-3
	{
		order: 3;
	}
	
	.order-4
	{
		order: 4;
	}
	
	.order-5
	{
		order: 5;
	}
	
	.order-6
	{
		order: 6;
	}
	
	.order-7
	{
		order: 7;
	}
}

@media (min-width: 640px)
{
	.grid
	{
		grid-template-columns: repeat(6, 1fr);
	}
	
	.col-md-1
	{
		grid-column: span 1;
	}
	
	.col-md-2
	{
		grid-column: span 2;
	}
	
	.col-md-3
	{
		grid-column: span 3;
	}
	
	.col-md-4
	{
		grid-column: span 4;
	}
	
	.col-md-5
	{
		grid-column: span 5;
	}
	
	.col-md-6
	{
		grid-column: span 6;
	}
}

@media (min-width: 1024px)
{
	.grid
	{
		grid-template-columns: repeat(8, 1fr);
	}
	
	.col-lg-1
	{
		grid-column: span 1;
	}
	
	.col-lg-2
	{
		grid-column: span 2;
	}
	
	.col-lg-3
	{
		grid-column: span 3;
	}
	
	.col-lg-4
	{
		grid-column: span 4;
	}
	
	.col-lg-5
	{
		grid-column: span 5;
	}
	
	.col-lg-6
	{
		grid-column: span 6;
	}
	
	.col-lg-7
	{
		grid-column: span 7;
	}
	
	.order-lg-1
	{
		order: 1;
	}
	
	.order-lg-2
	{
		order: 2;
	}
	
	.order-lg-3
	{
		order: 3;
	}
	
	.order-lg-4
	{
		order: 4;
	}
	
	.order-lg-5
	{
		order: 5;
	}
	
	.order-lg-6
	{
		order: 6;
	}
	
	.order-lg-7
	{
		order: 7;
	}
	
	.column-start-fix
	{
		grid-column-start: 1;
		grid-column-end: 7;
		display: grid;
	}
}

.gap-0
{
	gap: 0;
}

/* Выравнивание*/
.align-items-center
{
	align-items: center;
}

.align-self-center
{
	align-self: center;
}

.justify-items-right
{
	justify-content: right;
}

.text-center
{
	text-align: center;
}

.text-right
{
	text-align: right;
}

/*Разное*/
.overflow-hidden
{
	overflow: hidden;
}

.absolute-center
{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.btn
{
	position: relative;
	display: grid;
	align-content: center;
	justify-content: center;
	height: calc(1.8 * var(--vu));
	line-height: 0;
	border:3px solid var(--black);
	color:var(--black);
	font-weight: 400;
	font-size: 14px;
	transition:var(--transition);
	border-radius: 2px;
}

.btn:hover
{
	color:var(--white);
}

.btn:after
{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color:var(--black);
	z-index: -1;
	transition:var(--transition);
	clip-path:circle(0% at 50% 50%);
}

.btn:hover:after
{
	transform: scaleY(1);
	clip-path: circle(70.7% at 50% 50%);
}

.btn.white
{
	border:2px solid var(--white);
	color:var(--white);
}

.btn.black
{
	border:1px solid var(--black);
	color:var(--white);
	background:var(--black);
}

.enhance-img
{
	image-rendering: auto;
	/*image-rendering: crisp-edges;
	image-rendering: pixelated;*/
	image-rendering: -webkit-optimize-contrast;
}

.no-scroll
{
	overflow: hidden;
}

.uppercase
{
	text-transform: uppercase;
}

.fit-cover
{
	object-fit: cover;
	width: 100%;
	height: 100%;
}

.overflow-hidden
{
	overflow: hidden;
}

*:disabled
{
	opacity: 0.7;
}

@media (max-width: 340px)
{
	.xsmobile-hide
	{
		display: none !important;
	}
}

@media (max-width: 990px)
{
	.mobile-hide
	{
		display: none !important;
	}
	
	.mobile-full-width
	{
		width: 100vw;
		max-width: 100vw;
		margin-left: calc(var(--indent) * -1);
		margin-right: calc(var(--indent) * -1);
	}
	
	.menu-opened
	{
		overflow: hidden;
	}
}

@media (min-width: 990px)
{
	*
	{
		/*cursor: none;*/
	}
	
	.cursor
	{
		--size:12px;
		pointer-events: none;
		mix-blend-mode: difference;
		position: absolute;
		left: 50vw;
		top: 50vh;
		z-index: 999;
		width:var(--size);
		height:var(--size);
		background-color:var(--red);
		border-radius: 50%;
		transform-origin: center;
		transition: transform 0.5s ease;
	}
	
	.cursor.hover
	{
		mix-blend-mode: normal;
		background-color:var(--red);
		transform: scale(1.8);
	}
	
	.desktop-hide
	{
		display: none !important;
	}
	
	.btn
	{
		width: 220px;
		font-size: 25px;
		height: calc(2.5 * var(--vu));
	}
}

/* Подчёркнутые ссылки*/
.hover-underline
{
	position: relative;
}

.hover-underline:before
{
	position: absolute;
	content: '';
	height: 2px;
	width: 100%;
	background-color:var(--darkgray);
	bottom: -3px;
	left: 0;
	transform: scaleX(0);
	transform-origin: bottom left;
	transition:transform var(--transition-time) ease;
}

.hover-underline:hover:before
{
	transform: scaleX(1);
}

/*Кастомный 
Скроллбар*/
.custom-scroll::-webkit-scrollbar
{
	width: 5px;
}

.custom-scroll::-webkit-scrollbar-track
{
	background:var(--lightgray);
}

.custom-scroll::-webkit-scrollbar-thumb
{
	background:var(--gray);
}

/*hero*/
.hero
{
	position: relative;
	display: grid;
	background-color:var(--black);
	text-align: center;
	width: 100%;
	aspect-ratio:38/43;
	overflow: hidden;
	--logo-color:var(--white);
}

.hero__blend
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.4);
}

.hero__video
{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	object-fit: cover;
}

.hero__meta
{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}

.hero__title
{
	font-size: 29px;
	font-weight: 300;
	line-height: 1;
	letter-spacing: 2px;
}

.hero__estel-logo
{
	line-height: 0;
	margin-top: 10px;
}

.hero__estel-logo-svg
{
	width: 90px;
}

.hero__logo
{
	margin-top: -10px;
}

.hero__logo-svg
{
	width: 276px;
	height: 122px;
}

.hero__picture
{
	margin: 0 auto;
	width: 100%;
	height: 100%;
}

@media (min-width: 768px)
{
	.hero
	{
		aspect-ratio:78/40;
	}
	
	.hero__title
	{
		font-size: 35px;
	}
	
	.hero__estel-logo
	{
		margin-top: 20px;
	}
	
	.hero__logo-svg
	{
		width: 312px;
		height: 138px;
	}
}

@media (min-width: 1200px)
{
	.hero
	{
		height: 700px;
		aspect-ratio:auto;
	}
	
	.hero__title
	{
		font-size: 55px;
		font-weight: 300;
	}
	
	.hero__estel-logo
	{
		margin-top: 35px;
	}
	
	.hero__estel-logo-svg
	{
		width: 175px;
	}
	
	.hero__logo-svg
	{
		width: 580px;
		height: 265px;
	}
}

/*Описание шоу*/
.descript
{
	margin-top: calc(4 * var(--vu));
	margin-bottom: calc(4 * var(--vu));
}

.descript__when-wrapper
{
	display: grid;
	align-items: center;
}

.descript__when
{
	display: grid;
	align-items: center;
	/*grid-template-columns: 145px 1fr;*/
	grid-template-columns: 1fr 1.5fr;
	gap: 10px;
	margin-bottom: calc(3 * var(--vu));
}

.descript__when-time
{
	display: grid;
	place-content: center;
	font-size: 7vw;
	font-weight: 900;
	letter-spacing: 5px;
	width: 100%;
	height: auto;
	aspect-ratio:143 / 82;
	background-image: url("data:image/svg+xml,%3Csvg width='254' height='146' viewBox='0 0 254 146' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='8' y='8' width='238' height='121' rx='30' stroke='%2333BFDB' stroke-width='16'/%3E%3Ccircle cx='62' cy='138' r='8' fill='%2333BFDB'/%3E%3Ccircle cx='191' cy='138' r='8' fill='%2333BFDB'/%3E%3C/svg%3E%0A");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	text-align: center;
}

.descript__when-time span
{
	display: block;
	margin-top: -5px;
	margin-left: 5px;
}

.descript__when-day
{
	font-size: 14px;
	line-height: 1.3;
	font-weight: 900;
	letter-spacing: 2px;
	text-transform: uppercase;
	margin-top: -10px;
}

.descript__text
{
	font-size: 18px;
	line-height: 1.4;
	font-weight: 300;
	margin-bottom:var(--vu);
}

.descript_description
{
	color:var(--blue);
	font-size: 18px;
	margin-top:var(--vu);
	font-weight: 400;
}

.descript_description a
{
	color:var(--blue);
	text-decoration: underline;
}

@media (min-width: 768px)
{
	.descript__when
	{
		gap: 20px;
		grid-template-columns: 150px 1fr;
	}
	
	.descript__txt-grid
	{
		display: grid;
		gap:var(--gap);
		grid-template-columns: 1fr 1fr;
	}
	
	.descript__when-time
	{
		font-size: 3.5vw;
	}
	
	.descript__text
	{
		font-size: 16px;
	}
	
	.descript_description
	{
		font-size: 16px;
	}
}

@media (min-width: 1024px)
{
	.descript__txt-grid
	{
		display: grid;
		gap:var(--gap);
		grid-template-columns: 1fr 1fr;
	}
	
	.descript__when
	{
		grid-template-columns: 190px 1fr;
	}
	
	.descript__text
	{
		font-size: 2vw;
	}
	
	.descript_description
	{
		font-size: 2vw;
	}
}

@media (min-width: 1440px)
{
	.descript
	{
		margin-top: calc(6 * var(--vu));
	}
	
	.descript__when-wrapper
	{
		padding-right: 60px;
	}
	
	.descript__when
	{
		grid-template-columns: 255px 1fr;
	}
	
	.descript__when-time
	{
		font-size: 46px;
		aspect-ratio:254 / 146;
	}
	
	.descript__text
	{
		font-size: 32px;
	}
	
	.descript_description
	{
		font-size: 32px;
	}
}

/*Адаптивный текст*/
.outline-text
{
	color:var(--black);
	text-shadow: rgb(255, 255, 255) 1px 0px 0px, rgb(255, 255, 255) 0.540302px 0.841471px 0px, rgb(255, 255, 255) -0.416147px 0.909297px 0px, rgb(255, 255, 255) -0.989992px 0.14112px 0px, rgb(255, 255, 255) -0.653644px -0.756802px 0px, rgb(255, 255, 255) 0.283662px -0.958924px 0px, rgb(255, 255, 255) 0.96017px -0.279415px 0px;
}

.fit-text
{
	display: block;
	width: 100%;
	fill:var(--white);
}

.svg-outline-text
{
	fill:var(--black);
	stroke:var(--white);
	stroke-width: 1px;
	stroke-linejoin: round;
	paint-order: stroke;
}

/*Видео*/
.videos__grid
{
	display: grid;
	gap:var(--gap);
	grid-template-columns: repeat(1, 1fr);
}

@media (min-width: 560px)
{
	.videos__grid
	{
		display: grid;
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 1024px)
{
	.videos__grid
	{
		display: grid;
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (min-width: 1400px)
{
	.videos__grid
	{
		display: grid;
		grid-template-columns: repeat(4, 1fr);
	}
}

.videos__title
{
	color:var(--blue);
	font-size: 32px;
	font-weight: 800;
	letter-spacing: 5px;
	margin-bottom: calc(3 * var(--vu));
}

.video
{
	margin-bottom: calc(2 * var(--vu));
}

.video__preview
{
	position: relative;
	overflow: hidden;
	/*+border-radius:var(--radius) var(--radius) 0 0;*/
	-moz-border-radius: var(--radius) var(--radius) 0 0;
	-webkit-border-radius: var(--radius) var(--radius) 0 0;
	-khtml-border-radius: var(--radius) var(--radius) 0 0;
	border-radius:var(--radius) var(--radius) 0 0;
	margin-bottom:var(--vu);
}

.gradient-shadow
{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 140px;
	background: linear-gradient(180deg, rgba(14, 17, 17, 0.02) 0%, rgba(14, 17, 17, 1) 85%);
}

.video__picture
{
	aspect-ratio:4/3;
	overflow: hidden;
	transition:var(--transition);
}

.video__preview:hover .video__picture
{
	transform: scale(1.1);
}

.video__play-button
{
	width: 55px;
	height: 55px;
	background-color: rgba(0, 0, 0, 0.579);
	background-image: url("data:image/svg+xml,%3Csvg width='15' height='17' viewBox='0 0 15 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.5 6.33289C14.8333 7.10269 14.8333 9.02719 13.5 9.79699L3 15.8592C1.66667 16.629 1.09424e-06 15.6667 1.16154e-06 14.1271L1.69151e-06 2.00276C1.75881e-06 0.463164 1.66667 -0.499088 3 0.270713L13.5 6.33289Z' fill='white'/%3E%3C/svg%3E%0A");
	background-repeat: no-repeat;
	background-position: center;
	border-radius: 50%;
}

.disabled .video__picture
{
	opacity: 0.5;
}

.video__number
{
	position: absolute;
	font-size: 84px;
	font-weight: 800;
	line-height: 1;
	left: 20px;
	bottom: 5px;
}

.video__date
{
	width: 100%;
	font-size: 32px;
	font-weight: bold;
	text-align: center;
}

.video__title
{
	font-size: 23px;
	font-weight: 800;
	letter-spacing: 3px;
}

.video__description
{
	font-size: 15px;
	font-weight: 300;
	height: 90px;
	overflow: hidden;
}

.disabled .video__number,
.disabled .video__title,
.disabled .video__description
{
	color: #5A7982;
}

@media (min-width: 990px)
{
	.videos__title
	{
		font-size: 48px;
		margin-bottom: calc(3 * var(--vu));
	}
}

/*Попап*/
.popup__iframe
{
}

.popup__iframe iframe
{
	width: 100%;
	height: auto;
	aspect-ratio:16/9;
	/*+border-radius:var(--radius);*/
	-moz-border-radius: var(--radius);
	-webkit-border-radius: var(--radius);
	-khtml-border-radius: var(--radius);
	border-radius:var(--radius);
}

.popup__title
{
	font-size: 18px;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 2px;
	margin: calc(2 * var(--vu)) 0;
}

.popup__text
{
	font-size: 14px;
}

@supports not (aspect-ratio: 16/9)
{
	.popup__iframe iframe
	{
		height: 0;
		padding-top: 56.66%;
		position: relative;
	}
}

@media (min-width: 990px)
{
	.popup__title
	{
		font-size: 31px;
		margin: calc(3 * var(--vu)) 0;
	}
	
	.popup__text
	{
		font-size: 18px;
	}
}

/*Футер*/
.footer
{
	margin-top: calc(5 * var(--vu));
	margin-bottom: calc(3 * var(--vu));
	font-weight: 300;
	display: grid;
	justify-items: center;
	--logo-color:var(--blue);
}

.footer__estel-logo-svg
{
	width: 95px;
}

.footer__logo-svg
{
	width: 325px;
}

.footer__socials
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: calc(3*var(--gap));
	margin-top: calc(4 * var(--vu));
}

.footer__copyright
{
	font-size: 12px;
	margin-top: calc(7 * var(--vu));
}

@media (min-width: 990px)
{
}

/*Анимации*/
@keyframes rotate
{
	0%
	{
		transform: rotate(-1deg) scale(1);
	}
	
	100%
	{
		transform: rotate(1deg) scale(1.02);
	}
}

@keyframes shadow-pulse
{
	0%
	{
		box-shadow: 0 0 0px 0px rgba(0, 0, 0, 0.311);
	}
	
	100%
	{
		box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
	}
}

@keyframes shadow-pulse-white
{
	0%
	{
		box-shadow: 0 0 0px 0px rgba(255, 255, 255, 0.311);
	}
	
	100%
	{
		box-shadow: 0 0 0 10px rgba(255, 255, 255, 0);
	}
}

@keyframes fade-in
{
	from
	{
		opacity: 0;
	}
	
	to
	{
		opacity: 1;
	}
}

@keyframes fade-out
{
	from
	{
		opacity: 1;
	}
	
	to
	{
		opacity: 0;
	}
}

@keyframes fade-in-clip
{
	from
	{
		clip-path:circle(0% at 50% 50%);
	}
	
	to
	{
		clip-path:circle(100% at 50% 50%);
	}
}

@keyframes rotate-circle
{
	0%
	{
		transform: rotate(-2deg);
	}
	
	100%
	{
		transform: rotate(2deg);
	}
}

@keyframes upndown
{
	from
	{
		transform:translateY(var(--offset, 10px));
	}
	
	to
	{
		transform: translateY(calc(-1 * var(--offset, -10px)));
	}
}

@keyframes show-menu-items
{
	from
	{
		opacity: 0;
		transform: translateY(100%);
	}
	
	to
	{
		opacity: 1;
		transform: translateX(0%);
	}
}

@keyframes hide-menu-items
{
	from
	{
		opacity: 1;
		transform: translateY(0%);
	}
	
	to
	{
		opacity: 0;
		transform: translateY(100%);
	}
}
