/* Для страницы со снежинками */
.snowflake2 {
  z-index: 3;
}

.quote1 {
  z-index: 5;
}


/* Это про электро-магазин */
.t-store__card__sold-out-msg {
  visibility: hidden;
}

/* А это про анимацию карточек кейсов */
    :root {
	--white: #ffff;
	--light-red: #ff7683;
	--dark-red: #330024;

	--card-text-color: var(--white);
	--card-background: linear-gradient(224.6deg, var(--dark-red) 0, var(--light-red) 133.66%);
	--card-title-font-family: 'Oswald', sans-serif;
	--card-text-font-family: 'Inter', sans-serif;

	--radius: 16px;
	--t: 300ms;
	--func: linear;

	--card-offset: 40px;
	--card-inline-padding: 24px;
	--card-inline-padding-: calc(-1 * var(--card-inline-padding));
	--card-inline-hover-padding: 39px;
	--card-inline-hover-padding-: calc(-1 * var(--card-inline-hover-padding));
	--offset-logo-mobile-right: 20%;
}

.cards {
	display: flex;
	gap: var(--card-offset);
	width: 1160px;
	margin-inline: auto;
}

.card {
	background: var(--card-background);
	color: var(--card-text-color);
	transition: padding var(--t) var(--func), width var(--t) var(--func);
	border-radius: var(--radius);
	display: flex;
	flex-direction: column;
	width: calc(33% - var(--card-offset));
	padding: 27px var(--card-inline-padding) 32px;
}


.card:hover {
	flex: none;
	width: 422px;
	padding-inline: var(--card-inline-hover-padding);
}

.card__title,
.card__text {
	transition: max-width var(--t) var(--func);
	max-width: 240px;
}

.card:hover .card__title {
	max-width: 320px;
}

.card:hover .card__text {
	max-width: 376px;
}

.card__title {
	font-family: var(--card-title-font-family);
	font-size: 26px;
	line-height: 30px;
	height: 90px;
	margin-bottom: 19px;
}

.card__text {
	font-family: var(--card-text-font-family);
	font-size: 14px;
	line-height: 17px;
	margin-bottom: 46px;
}

.card__line {
	transition: margin var(--t) var(--func);
	background-color: var(--white);
	position: relative;
	display: flex;
	align-items: center;
	height: 82px;
	padding-left: 39px;
	margin-top: auto;
	margin-inline: var(--card-inline-padding-);
}

.card:hover .card__line {
	margin-inline: var(--card-inline-hover-padding-);
}

.card__btn {
	transition: background-color var(--t) var(--func);
	font-family: var(--card-text-font-family);
	background-color: var(--dark-red);
	border-radius: var(--radius);
	color: var(--white);
	font-weight: 700;
	font-size: 11px;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	user-select: none;
	scale: 0;
	display: inline-flex;
	align-items: center;
	padding-inline: 28px;
	height: 37px;
}

.card__btn:hover {
	background-color: var(--light-red);
}

.card:hover .card__btn {
	animation: btn-show var(--t) var(--func) forwards;
}

.card__logo {
	animation: logo-slide-left var(--t) var(--func) forwards;
	position: absolute;
	top: 50%;
	right: 50%;
	translate: 50% -50%;
}

.card__logo--mars {
	width: 72px;
	height: 24px;
}

.card__logo--lenta {
	width: 140px;
	height: 37px;
}

.card__logo--vimm {
	width: 60px;
	height: 44px;
}

.card__logo--magnit {
	width: 160px;
	height: 30px;
}

.card__logo--ashan {
	width: 140px;
	height: 43px;
}

.card__logo--okey {
	width: 127px;
	height: 35px;
}

.card__logo--mondelez {
	width: 112px;
	height: 27px;
}

.card__logo--baltika {
	width: 140px;
	height: 19px;
}

.card__logo--campari {
	width: 88px;
	height: 27px;
}

.card__logo--asg {
	width: 80px;
	height: 30px;
}

.card__logo--picanta {
	width: 72px;
	height: 30px;
}

.card__logo--kraftheinz {
	width: 100px;
	height: 27px;
}

.card__logo--grass {
	width: 82px;
	height: 28px;
}

.card__logo--example {
	width: 110px;
	height: 28px;
}

.card__logo--sns {
	width: 110px;
	height: 26px;
}


@media only screen and (min-width: 1200px){
    .card:hover .card__logo {
    	animation: logo-slide-right var(--t) var(--func) forwards;
    }
}

@keyframes logo-slide-left {
	from {
		translate: 0 -50%;
		right: 48px;
	}

	to {
		right: 50%;
		translate: 50% -50%;
	}
}

@keyframes logo-slide-right {
	from {
		right: 50%;
		translate: 50% -50%;
	}

	70% {
		right: 38px;
	}

	to {
		translate: 0 -50%;
		right: 48px;
	}
}

@keyframes btn-show {
	from {
		scale: 0;
	}

	70% {
		scale: 1.15;
	}

	to {
		scale: 1;
	}
}

/* А это про стик крошек и главного меню */
 /* #rec561805664 - это крошки */

#rec561805664  {
position: sticky;
position: -webkit-sticky;
z-index: 998;
top: 80px;
}


@media only screen and (max-width: 980px){    
        #rec561805664 {
    	    top: 54px;
        }
    }

/* #rec568188977 - это большое меню */
#rec568188977  {
  position: sticky;
  position: -webkit-sticky;
  z-index: 999;
  top: 0px;
 }

.t-records {
  overflow: unset !important;
}