/* custom.css */

/* lnk */

.lnk {
	text-decoration: underline;
	color: inherit;
}

.lnk:hover {
	text-decoration: none;
}

/* cookie */

.cookie {
	animation: cookieShow 1s ease forwards;
	color: rgba(255, 255, 255, 1);
	font-size: 0.875rem;
	font-style: normal;
	font-weight: 400;
	line-height: 1.4;
	border-radius: 0;
	border: 0;
	background: rgba(36, 28, 24, 0.55);
	padding: 1.875rem;
	box-sizing: border-box;
	opacity: 0;
	display: none;
	backdrop-filter: blur(0.375rem);
	box-shadow: 0 0 1.875rem #000000b2;
}

.cookie_pos {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 100;
}

@media (min-width: 540px) {
	.cookie {
		font-size: 1rem;
	}
}

@keyframes cookieShow {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

.cookie__body {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	gap: 0.625rem 1.25rem;
	max-width: calc(var(--container-width) + var(--margin) * 4);
	margin: 0 auto;
	padding-right: calc(var(--margin) * 2);
	padding-left: calc(var(--margin) * 2);
	box-sizing: border-box;
}

@media (min-width: 720px) {
	.cookie__body {
		flex-direction: row;
	}
}

.cookie__content {
	flex-grow: 1;
	min-width: 0;
}

.cookie__btns {
	display: flex;
	justify-content: center;
	align-items: center;
}
.container {
	max-width: 100%;
	max-width: calc(var(--container-width) + var(--margin) * 4);
	width: 100%;
	min-width: 0;
	padding-right: 1.75rem;
	padding-right: calc(var(--margin) * 2);
	padding-left: 1.75rem;
	padding-left: calc(var(--margin) * 2);
	position: relative;
	z-index: 1;
	box-sizing: border-box
}

[data-gw-anime] {
	opacity: 0;
	transition: all 1s
}

.zoomIn {
	-webkit-animation: zoomIn 1s ease forwards;
	animation: zoomIn 1s ease forwards
}

@-webkit-keyframes zoomIn {
	0% {
		opacity: 0;
		transform: scale(.8)
	}

	to {
		opacity: 1;
		transform: scale(1)
	}
}

@keyframes zoomIn {
	0% {
		opacity: 0;
		transform: scale(.8)
	}

	to {
		opacity: 1;
		transform: scale(1)
	}
}

.fadeInUp {
	-webkit-animation: fadeInUp 1s ease forwards;
	animation: fadeInUp 1s ease forwards
}

@-webkit-keyframes fadeInUp {
	0% {
		opacity: 0;
		transform: translateY(5vh)
	}

	to {
		opacity: 1;
		transform: translateX(0)
	}
}

@keyframes fadeInUp {
	0% {
		opacity: 0;
		transform: translateY(5vh)
	}

	to {
		opacity: 1;
		transform: translateX(0)
	}
}

.fadeInDown {
	-webkit-animation: fadeInDown 1s ease forwards;
	animation: fadeInDown 1s ease forwards
}

@-webkit-keyframes fadeInDown {
	0% {
		opacity: 0;
		transform: translateY(-5vh)
	}

	to {
		opacity: 1;
		transform: translateX(0)
	}
}

@keyframes fadeInDown {
	0% {
		opacity: 0;
		transform: translateY(-5vh)
	}

	to {
		opacity: 1;
		transform: translateX(0)
	}
}

:root {
	--button-w: 27.5rem;
	--button-h: 5.625rem;
	--button-fs: 1.25rem;
	--button-scale: 0.7;
	--button-img-url: url(../images/button/button.png);
	--button-img-w: 34.1875rem;
	--button-img-h: 13.75rem;
	--button-letter-spacing: 0
}

.button {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	grid-gap: .5rem;
	gap: .5rem;
	box-sizing: border-box;
	text-decoration: none;
	text-align: center;
	flex-shrink: 0;
	font-style: normal;
	color: #fff;
	color: rgba(var(--color-0), 1);
	font-family: BeaufortforLOL, Times New Roman, Times, serif;
	font-family: var(--font-0);
	font-size: .875rem;
	font-size: calc(var(--button-fs) * var(--button-scale));
	font-weight: 700;
	cursor: pointer;
	transition: all .2s;
	box-shadow: none;
	position: relative;
	text-transform: uppercase;
	z-index: 0;
	outline: 0;
	background: transparent;
	border: 0;
	line-height: 1;
	padding: .3125rem .0125rem;
	padding: .3125rem calc(2.875rem * var(--button-scale));
	width: 19.25rem;
	height: 5rem;
	text-wrap: balance;
	letter-spacing: 0;
	will-change: transform
}

.wraps {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.625rem;
	justify-content: space-between;
	width: 100%;
}

.button1:before {
	width: 30rem !important;
}

.button:before {
	display: block;
	content: "";
	position: absolute;
	top: -2.8rem;
	top: calc(-4rem * var(--button-scale));
	left: -2.3625rem;
	width: 23.93125rem;
	height: 5rem;
	z-index: -1;
	top: .1rem;
	transition: all .2s;
	background-image: url(../images/btn.svg);
	background-size: 100% 100%;
	background-position: 50%;
	background-repeat: no-repeat;
	transform-style: preserve-3d;
	perspective: 43.75rem;
	pointer-events: none
}

.button:hover:before {
	filter: brightness(130%)
}

:root {
	--btn-w: 16.3125rem;
	--btn-h: 2.9375rem;
	--btn-fs: 0.875rem;
	--btn-scale: 1;
	--btn-img-url: url(../images/btn/btn.png);
	--btn-letter-spacing: 0
}

:root {
	--scl-color-1: rgba(var(--color-0), 1);
	--scl-width: 4.6875rem;
	--scl-height: 4.8125rem;
	--scl-bg: url(../images/scl/bg.png);
	--scl-font-size: 1.125rem;
	--scl-list-gap: 1.25rem 1.5rem;
	--scl-sep-display: none
}

:root {
	--logo-height: auto
}

:root {
	--countdown-scale: 0.8
}

:root {
	--soc-width: 3.4375rem;
	--soc-height: 3.4375rem;
	--soc-bg-img: url(../images/soc/dec.png);
	--soc-gap: 1.5625rem
}

.timer {
	display: inline-flex;
	flex-direction: column
}

.timer, .timer__heading {
	align-items: center;
	justify-content: center
}

.timer__heading {
	color: #ffe59f;
	color: rgba(var(--color-accent-2), 1);
	text-align: center;
	text-transform: uppercase;
	margin-bottom: .375rem;
	font-family: BeaufortforLOL, Times New Roman, Times, serif;
	font-family: var(--font-0);
	font-size: 1.125rem;
	font-weight: 400;
	display: flex;
	width: 100%;
	grid-gap: .625rem;
	gap: .625rem
}

.timer__heading:after, .timer__heading:before {
	display: block;
	content: "";
	height: .125rem;
	flex-grow: 1;
	background-color: #ffe59f;
	background-color: rgba(var(--color-accent-2), 1)
}

.timer__counter {
	grid-gap: .3125rem;
	gap: .3125rem
}

.timer__counter, .timer__item {
	display: flex;
	justify-content: center;
	align-items: center
}

.timer__item {
	flex-direction: column;
	color: #fff4e1;
	color: rgba(var(--color-2), 1);
	text-align: center;
	width: 4.125rem;
	height: 4.125rem;
	box-sizing: border-box;
	line-height: 1;
	background-color: rgba(0, 0, 0, .6);
	border-radius: .625rem
}

.timer__amount {
	color: #ffe59f;
	color: rgba(var(--color-accent-2), 1);
	font-size: 1.5rem;
	font-weight: 700
}

.timer__amount, .timer__desc {
	text-transform: uppercase;
	box-sizing: border-box
}

.timer__desc {
	color: #fff4e1;
	color: rgba(var(--color-2), 1);
	font-size: .625rem;
	font-weight: 400
}

.header {
	min-height: 100dvh;
	display: flex;
	justify-content: center;
	align-items: flex-end;
	padding-top: 25rem;
	padding-top: calc(21.25rem + var(--navigation-height));
	padding-bottom: 6.25rem;
	text-align: center;
	box-sizing: border-box
}

.header__content {
	filter: drop-shadow(0 -.625rem 2.25rem rgba(0, 0, 0, 0.51)) drop-shadow(0 -.625rem 2.25rem rgba(0, 0, 0, 0.5)) drop-shadow(0 -.625rem 2.25rem rgba(0, 0, 0, 0.43))
}

.header__title {
	color: #dfc683;
	color: rgba(var(--color-accent), 1);
	font-size: 3rem;
	font-family: Georgia;
	font-weight: 500;
	line-height: 1
}

.header__desc {
	color: #fff;
	color: rgba(var(--color-0), 1);
	font-family: Intro, Open Sans, Tahoma, Arial, sans-serif;
	font-family: var(--font-1);
	font-size: 2rem;
	font-weight: 300;
	max-width: 33.75rem;
	margin: .625rem auto 0
}

.header__btns {
	grid-gap: 1.25rem;
	gap: 1.25rem
}

.header__btns, .header__timer {
	display: flex;
	justify-content: center;
	align-items: center
}

.header__timer {
	margin: 1.25rem auto
}

:root {
	--post-size-title: 1rem;
	--post-size-desc: 0.875rem;
	--post-size-status: 0.875rem;
	--post-desc-max-height: auto;
	--post-desc-display: -webkit-box;
	--post-line-clamp: 10;
	--post-bg-mask: linear-gradient(180deg, #000 0%, #000 7.5rem, transparent);
	--post-bg-height: 18.75rem;
	--post-bg-opacity: 1
}

:root {
	--social-pic-width: 9.8125rem;
	--social-pic-height: 9.625rem
}

:where(.theme:not(:last-child)):after {
	content: "";
	position: absolute;
	bottom: -0.0625rem;
	left: 1rem;
	right: 1rem;
	background-color: hsla(0, 0%, 100%, .2);
	z-index: -1;
	height: .125rem
}

.close:not(:disabled):not(.disabled):focus, .close:not(:disabled):not(.disabled):hover {
	opacity: .75
}

.streams__item_play:has(iframe):after {
	content: none
}

:root {
	--influencer-bg: url(../images/influencer/influencer-boh.jpg)
}

@media (min-width: 540px) {

	.timer__heading {
		font-size: 1.25rem
	}

	.timer__counter {
		grid-gap: .625rem;
		gap: .625rem
	}

	.timer__item {
		width: 5rem;
		height: 5rem
	}

	.timer__amount {
		font-size: 1.875rem
	}

	.timer__desc {
		font-size: .75rem
	}
}

@media (min-width: 680px) {

	.header__title {
		font-size: 3.9rem;
		font-weight: 600;
	}

	.header__desc {
		font-size: 1.6rem
	}
}

@media (min-width: 840px) {

	:root {
		--button-scale: 1;
		--countdown-scale: 1
	}
}

@media (min-width: 1050px) {

	.button {
		--button-scale: 1
	}

	:root {
		--post-line-clamp: 5;
		--post-size-title: 1.125rem
	}
}

@media (min-width: 1300px) {
	:root {
		--navigation-height: 5rem;
		--navigation-height-scroll: 5rem
	}

	html {
		font-size: calc(max(.5vw, .25rem) + max(.5vh, .25rem))
	}

	:root {
		--button-fs: 1.5625rem;
		--btn-fs: 1rem
	}

	.header {
		padding-top: 27.5rem;
		padding-top: calc(23.75rem + var(--navigation-height))
	}

	:root {
		--post-size-title: 1.375rem;
		--post-size-desc: 1rem;
		--post-size-status: 0.875rem
	}
}

@media (max-width: 1299.99px) {

	@supports (height: 100dvh) {
	}
}

/*фыв*/
.server-widget{
	padding:1.75rem;
	border-radius:1.125rem;
	background:linear-gradient(180deg,#0f2a46,#0c2036);
	border:0.0625rem solid rgba(120,200,255,.25);
}

.server-widget-title{
	display:flex;
	align-items:center;
	gap:0.625rem;
	font-size:1.25rem;
	font-weight:700;
	margin-bottom:1.75rem;
	color:#c8e6ff;
}

.server-card{
	max-width:100%;
	margin:auto;
}

.server-head{
	display:flex;
	justify-content:space-between;
	align-items:center;
	margin-bottom:0.3125rem;
	width: 100%;
}

.server-text{
	display:flex;
	flex-direction:column;
}

.server-name{
	font-size:1.375rem;
	font-weight:700;
	color:#eaf6ff;
}

.server-sub{
	font-size:1.2rem;
	color:#8fb9e6;
	margin-top:0.25rem;
}

.server-status{
	font-size:1rem;
	font-weight:600;
	color:#dceeff;
}

.server-progress{
	height:1.3rem;
	border-radius:1.875rem;
	background:rgba(255,255,255,.12);
	overflow:hidden;
	margin-bottom:1.25rem;
	width: 100%;
}

.server-bar{
	height:100%;
	border-radius:1.875rem;
	background:linear-gradient(90deg,#2aa8ff,#7fd8ff,#2aa8ff);
	display:flex;
	align-items:center;
	justify-content:center;
	font-size:1rem;
	font-weight:700;
	color: #152059;
	position:relative;
	overflow:hidden;
}

.server-bar::after{
	content:"";
	position:absolute;
	top:0;
	left:-40%;
	width:40%;
	height:100%;
	background:linear-gradient(
			120deg,
			transparent,
			rgba(255,255,255,.35),
			transparent
	);
	animation:ice-shine 3s linear infinite;
}

@keyframes ice-shine{
	0%{
		left:-40%;
	}
	100%{
		left:120%;
	}
}

.server-footer{
	text-align:center;
}

.server-footer a{
	color:#63c4ff;
	text-decoration:none;
	font-weight:600;
}
/* ================= ICE STATUS ================= */

.stat-status {
	position: relative;
	overflow: hidden;
}

/* бегущий ледяной блик */
.stat-status::after {
	content: "";
	position: absolute;
	top: 0;
	left: -40%;
	width: 40%;
	height: 100%;
	background: linear-gradient(
			120deg,
			transparent,
			rgba(184, 243, 255, .35),
			transparent
	);
	animation: iceShine 4s infinite linear;
}

/* ONLINE текст */
.status-online {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.625rem;
	font-weight: 800;
	font-size: 1.375rem;
	letter-spacing: 0.0625rem;
	color: #b8f3ff;
}

/* светящаяся точка */
.status-dot {
	width: 0.625rem;
	height: 0.625rem;
	border-radius: 50%;
	background: #00eaff;
	box-shadow: 0 0 0.625rem #00eaff,
	0 0 1.25rem #3ab6ff,
	0 0 2.1875rem #3ab6ff;
	animation: dotPulse 1.8s infinite ease-in-out;
}

/* === АНИМАЦИИ === */

@keyframes dotPulse {
	0% {
		transform: scale(1);
		opacity: .7;
	}
	50% {
		transform: scale(1.3);
		opacity: 1;
	}
	100% {
		transform: scale(1);
		opacity: .7;
	}
}

@keyframes iceShine {
	from {
		left: -40%;
	}
	to {
		left: 120%;
	}
}

/**/
.section_aboutserv {
	padding: 11rem 0 4.375rem 0;
}

.dual-wrapper {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 1.25rem;
}

/* ОБЩИЕ СТИЛИ КОРОБОК */
.dual-box {
	position: relative;
	padding: 1.25rem;
	border-radius: 1rem;
	border: 0.0625rem solid rgba(120, 200, 255, .25);
	box-shadow: 0 0 3.125rem rgba(0, 0, 0, .8),
	inset 0 0 2.5rem rgba(120, 200, 255, .05);
	overflow: hidden;
}

/* ФОН ЛЕВОГО БЛОКА */
.stats-box {
	background-image: linear-gradient(rgb(9 26 44 / 88%), rgb(6 16 26 / 12%));
	background-size: cover;
	background-position: center;
}

/* ФОН ПРАВОГО БЛОКА */
.news-box {
	background-image: linear-gradient(rgb(9 26 44 / 88%), rgb(6 16 26 / 12%));
	background-size: cover;
	background-position: center;
}

/* СВЕЧЕНИЕ ПОВЕРХ ФОНА */
.dual-box::before {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(circle at 30% 20%, rgba(120, 200, 255, .15), transparent 60%);
	pointer-events: none;
}

/* TITLE */
.dual-title {
	font-size: 1.375rem;
	font-weight: 700;
	margin-bottom: 1.25rem;
	text-transform: uppercase;
	color: #cbeeff;
	display: flex;
	align-items: center;
	gap: 0.75rem;
	text-shadow: 0 0 0.9375rem rgba(120, 200, 255, .6);
}

.dual-title i {
	color: #3ab6ff;
}

/* STATS */
.stats-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.5625rem;
}

.stat-item {
	padding: 1.5625rem 1.25rem;
	border-radius: 0.75rem;
	background: rgba(15, 30, 50, .75);
	border: 0.0625rem solid rgba(120, 200, 255, .2);
	text-align: center;
	transition: .3s;
}

.stat-item:hover {
	transform: scale(1.05);
	box-shadow: 0 0 0.9375rem rgba(120, 200, 255, .6);
}

.stat-value {
	font-size: 1.625rem;
	font-weight: 800;
	color: #fff;
}

.stat-label {
	font-size: 0.75rem;
	margin-top: 0.5rem;
	text-transform: uppercase;
	color: #9ecff5;
}

/* NEWS */
.mini-news {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
}

.mini-news-item {
	padding: 0.5rem 1rem;
	background: rgba(15, 30, 50, .75);
	border: 0.0625rem solid rgba(120, 200, 255, .2);
	transition: .3s;
	gap: 0.625rem;
	flex-wrap: wrap;
}

.mini-news-item:hover {
	transform: translateX(0.375rem);
	box-shadow: 0 0 0.9375rem rgba(120, 200, 255, .4);
}

.mini-news-date {
	font-size: 1rem;
	color: #3ab6ff;
	margin-bottom: 0.375rem;
}

.mini-news-title {
	font-size: 1.2rem;
	font-weight: 600;
	color: #fff;
}

/* MOBILE */
@media (max-width: 992px) {
	.dual-wrapper {
		grid-template-columns: 1fr;
		gap: 2.5rem;
	}
}

/* ================= ICE EDGE FOR STAT CARDS ================= */

.stat-item {
	position: relative;
	overflow: hidden;
	border: 0.0625rem solid rgba(120, 200, 255, .25);
	background: linear-gradient(160deg, rgba(10, 25, 45, .9), rgb(5 18 35 / 0%));
}

/* ледяная правая грань */
.stat-item::after {
	content: "";
	position: absolute;
	top: 15%;
	right: 0;
	width: 0.1875rem;
	height: 70%;
	background: linear-gradient(
			180deg,
			transparent,
			#6ecbff,
			#b8f3ff,
			#6ecbff,
			transparent
	);
	box-shadow: 0 0 0.625rem #6ecbff,
	0 0 1.25rem #3ab6ff;
	animation: iceGlow 3s infinite ease-in-out;
}

/* внутренний ледяной hr */
.stat-item::before {
	content: "";
	position: absolute;
	left: 20%;
	bottom: 0;
	width: 60%;
	height: 0.0625rem;
	background: linear-gradient(90deg, transparent, #6ecbff, transparent);
	opacity: .6;
}

/* ================= ICE EDGE FOR NEWS ================= */

.mini-news-item {
	position: relative;
	overflow: hidden;
	background: linear-gradient(160deg, rgba(10, 25, 45, .9), rgb(5 18 35 / 0%));
}

/* правая ледяная линия */
.mini-news-item::after {
	content: "";
	position: absolute;
	top: 20%;
	right: 0;
	width: 0.1875rem;
	height: 60%;
	background: linear-gradient(
			180deg,
			transparent,
			#6ecbff,
			#b8f3ff,
			#6ecbff,
			transparent
	);
	box-shadow: 0 0 0.5rem #6ecbff,
	0 0 1.125rem #3ab6ff;
	animation: iceGlow 4s infinite ease-in-out;
}

/* ледяная нижняя линия */
.mini-news-item::before {
	content: "";
	position: absolute;
	left: 15%;
	bottom: 0;
	width: 70%;
	height: 0.0625rem;
	background: linear-gradient(90deg, transparent, #6ecbff, transparent);
	opacity: .6;
}

/* ================= GLOW ANIMATION ================= */

@keyframes iceGlow {
	0% {
		opacity: .4;
		transform: scaleY(.9);
	}
	50% {
		opacity: 1;
		transform: scaleY(1.05);
	}
	100% {
		opacity: .4;
		transform: scaleY(.9);
	}
}

/* ================= LEFT SCAN BORDER ================= */

.mini-news-item {
	position: relative;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.25rem
}

/* левая база */
.mini-news-item::before {
	content: "";
	position: absolute;
	left: 0;
	top: 15%;
	width: 0.1875rem;
	height: 70%;
	background: rgba(120, 200, 255, .25);
	transition: opacity .3s ease;
}

/* бегущая энергия */
.mini-news-item::after {
	content: "";
	position: absolute;
	left: 0;
	width: 0.1875rem;
	height: 3.125rem;
	background: linear-gradient(
			180deg,
			transparent,
			#b8f3ff,
			#6ecbff,
			transparent
	);
	box-shadow: 0 0 0.625rem #6ecbff,
	0 0 1.25rem #3ab6ff;
	transform: translateY(-3.75rem);
	opacity: 0;
}

/* бесконечный скан */
.mini-news-item:hover::after {
	opacity: 1;
	animation: scanLoop 1.2s linear infinite;
}

@keyframes scanLoop {
	from {
		transform: translateY(-3.75rem);
	}
	to {
		transform: translateY(120%);
	}
}

@keyframes scanDown {
	from {
		transform: translateY(-2.5rem);
	}
	to {
		transform: translateY(120%);
	}
}

/*stream-wrapper*/
.stream-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.625rem;
	flex-wrap: wrap;
}