/* MOBILE MENU
----------------------------------------------- */
.mobile-menu {
	width: 320px;
	height: 100%;
	overflow-x: hidden;
	overflow-y: auto;
	z-index: 70;
	position: fixed;
	left: -360px;
	top: 0;
	transition: left 0.35s ease;
	background-color: #050712;
	box-shadow: 0 0 80px rgba(0,0,0,0.95);
}
.mobile-menu.is-active {left: 0;}
body.mobile-menu-is-opened {
	overflow: hidden;
	width: 100%;
	height: 100%;
}
.mobile-menu__header {
	padding: 14px 18px;
	gap: 10px;
	background-color: rgba(7,9,24,1);
	border-bottom: 1px solid rgba(255,255,255,0.08);
}
.mobile-menu__header .logo {
	font-size: 18px;
	padding-left: 34px;
}
.mobile-menu__btn-close {
	font-size: 22px;
	width: 36px;
	height: 36px;
	margin-right: -6px;
	border-radius: 999px;
}
.mobile-menu__content {
	padding: 18px;
}
.mobile-menu__content .header__search,
.mobile-menu__content .header__btn-login {
	display: none;
}
.mobile-menu__content .header__menu {
	display: block;
	margin: 0;
}
.mobile-menu__content .header__menu > li > a {
	height: 46px;
	border-radius: 999px;
	padding: 0 16px;
}
.mobile-menu__content .header__menu-hidden {
	opacity: 1;
	visibility: visible;
	translate: 0 0;
	position: static;
	background-color: rgba(7,9,24,1);
	width: calc(100% + 36px);
	margin: 0 -18px;
	box-shadow: none;
	padding: 16px 18px 18px;
	border-radius: 0;
	border-top: 1px solid rgba(255,255,255,0.06);
}
.mobile-menu__content div.header__menu-hidden {
	grid-template-columns: repeat(2,minmax(0,1fr));
}

/* BREAKPOINTS
----------------------------------------------- */
@media screen and (max-width: 1220px) {
	:root {
		--indent-negative: -20px;
		--indent: 20px;
	}
	.wrapper__container {max-width: 1000px;}
	.wrapper__container--main {border-radius: 0; margin-top: 0;}

	body, .has-branding {padding-top: 0;}

	/* убираем “декор” по бокам – фон уже общий */
	.header .header__menu {display: none;}
	.header {
		padding: 14px var(--indent);
		border-radius: 0;
	}
	.header__search {
		flex: 1 1 0;
		max-width: 100%;
		min-width: 50px;
		margin-left: 10px;
	}
	.header__btn-menu {display: flex;}

	/* fullstory layout */
	.side__cols {display: block;}
	.side__cols-right:has(.filter-block) {display: none;}
	.side__cols:has(.side__player) .side__cols-right {padding: 0;}
	.side__fr {position: static;}
	.side__fr .sect__content {
		height: auto;
		max-height: 160px;
	}
}

@media screen and (max-width: 1220px) and (min-width: 590px) {
	.sect:has(.sect__tabs) .grid-items {
		display: flex;
		overflow-y: hidden;
		overflow-x: auto;
	}
	.sect:has(.sect__tabs) .grid-items > .grid-items__item {
		flex-shrink: 0;
		width: 180px;
	}
}

@media screen and (max-width: 950px) {
	.wrapper__container {max-width: 768px;}

	.footer__notify {margin: 0;}
	.footer__menu {
		width: 100%;
		justify-content: flex-start;
		flex-wrap: wrap;
	}

	.pagination {
		gap: 10px;
	}
	.pagination__btn-loader a,
	.pagination__btn-loader span:not([class]) {
		width: 100%;
	}
	.pagination > a,
	.pagination > span {
		flex-grow: 1;
		order: 10;
	}
	.pagination__pages,
	.pagination__btns {
		min-width: 100%;
	}
	.pagination__pages a,
	.pagination__pages span,
	.pagination__btns > * {
		flex-grow: 1;
	}
}

@media screen and (max-width: 760px) {
	.wrapper__container {max-width: 640px;}
	.header .header__search,
	.header .header__btn-login,
	.header__btn1 {
		display: none;
	}
	.mobile-menu__content .header__search,
	.mobile-menu__content .header__btn-login {
		display: block;
		width: 100%;
		margin: 0 0 10px;
	}
	.mobile-menu__content .header__btn-login {
		display: flex;
	}
	.header__logo {
		flex: 1 1 0;
		max-width: 100%;
		min-width: 50px;
	}
	.header__btn-menu,
	.header__btns {
		order: 10;
		padding: 0;
	}
	.sect__header:has(.sect__tabs) .sect__title {width: 100%;}
	.sect__tabs {
		margin-top: 10px;
		gap: 10px;
		width: 100%;
	}
	.sect__tabs button {
		flex: 1 1 0;
		max-width: 100%;
		min-width: max-content;
		padding: 0 10px;
		font-size: 12px;
		height: 30px;
	}

	.side__main {
		display: block;
	}
	.side__main > * + * {margin-top: 18px;}
	.side__header h1,
	body:has(.side__header) .speedbar {
		text-align: center;
	}
	.side__poster {
		margin-left: auto;
		margin-right: auto;
		width: 220px;
	}
	.side__list-rates {padding: 8px 0;}
	.side__player .tabs-block__select button {
		flex-grow: 1;
	}
	.side__player-bottom {
		padding: 14px 18px 18px;
	}
	.ya-share2 {
		width: 100%;
		text-align: center;
	}
	.side__fav {margin: 0;}
	.side__likes a {
		padding: 0 8px;
		height: 30px;
		font-size: 12px;
		gap: 6px;
	}

	.side__ac {margin-bottom: 18px;}

	.comm {
		padding: 14px 16px;
		padding-left: 16px;
	}
	.comm__img {
		width: 38px;
		height: 38px;
		position: relative;
		left: 0;
		top: 0;
		margin-bottom: 8px;
	}
	.comm__group {
		margin-top: 4px;
	}
}

@media screen and (max-width: 590px) {
	.wrapper__container {max-width: 480px;}
	.lgn__content {
		padding: 24px 18px 22px;
	}
	.lgn__ctrl > * {
		font-size: 16px;
		height: 40px;
	}
	.lgn__btn-close {
		right: 10px;
		top: 10px;
		color: var(--tt);
		font-size: 24px;
	}
	.lgn__header {
		padding-left: 60px;
	}
	.lgn__avatar {
		width: 40px;
		font-size: 18px;
	}
	.lgn__title {
		font-size: 17px;
	}
	.lgn__caption {
		font-size: 14px;
		margin-top: 0;
	}
	.header__login a,
	.header__btn1 {display: none;}

	.footer__notify {
		width: 100%;
		padding: 0;
		border: 0;
		text-align: center;
	}
	.footer__copyright {
		margin: 0;
		text-align: center;
		width: 100%;
	}

	.side__scr ul:has(li:nth-child(6)) {
		grid-template-columns: repeat(2,1fr);
	}
	.side__scr ul:not(:has(li:nth-child(6))) {
		gap: 10px;
	}
}

@media screen and (max-width: 470px) {
	.wrapper__container {max-width: 410px;}
	.header__theme-select {height: 30px;}
	.pagination__btn-loader a {
		min-width: 0;
		width: 100%;
	}
	.side__bg {
		margin: 0 var(--indent-negative) 20px;
		border-radius: 0;
	}
}

@media screen and (max-width: 400px) {
	.wrapper__container {max-width: 360px;}
	.full-text iframe {
		width: calc(100% + 40px);
		max-width: calc(100% + 40px);
		height: 240px;
		margin-left: -20px;
		margin-right: -20px;
	}
}