/* Стили для footer */
.page-template {

	.footer {
		width: 100%;
		max-width: 1336px;
		margin: 0 auto 40px;
		backdrop-filter: blur(17px);
		box-shadow: 0 4px 30px 0 rgba(14, 49, 127, 0.15);
		background: var(--background-color);
		border-radius: 32px;
		padding: 56px;

		&.footer-white {
			background-color: var(--colors-button-blue-pressed);
		}
	}

	.results-page--main {
		.footer {
			position: relative;
			z-index: 2;
		}
	}

	.footer__top {
		position: relative;

		display: flex;
		justify-content: space-between;

		padding-bottom: 2.4rem;
	}

	.footer__top::after {
		content: '';

		position: absolute;
		bottom: 0;
		left: 0;

		width: 100%;
		height: 0.1rem;

		background-color: var(--color-white);
		opacity: 0.1;
	}

	.footer-white .footer__top::after {
		background-color: var(--colors-button-blue-pressed);
		opacity: 0.1;
	}

	.footer__logos {
		display: flex;
		gap: 2rem;
	}

	.footer__logo-link {
		width: auto;
		height: 42px;
	}

	.footer__logo-link_rosatom {
		width: auto;
		height: 42px;
	}

	.footer__logo-link_atomic {
		width: auto;
		height: 42px;
	}

	.footer__logo-link_quiz {
		width: auto;
		height: 42px;
	}

	.footer__logo {
		width: auto;
		height: 100%;
		max-height: 42px;
	}

	.footer__social {
		gap: 3.2rem;
		--icon-color: var(--color-dark);
	}

	.footer-white .footer__social {
		--icon-color: var(--color-white);
	}

	.footer__bottom {
		display: flex;
		justify-content: space-between;
		gap: 2rem;
		margin-bottom: 0;

		margin-bottom: 0;
		padding-top: 24px;
		padding-bottom: 0;
		border-top: 1px solid #293a5f2b;
		color: var(--color-dark);
	}
	.footer-white .footer__bottom {
		border-top: 1px solid color(srgb 1 1 1 / 0.1);
		color: var(--colors-button-white-default);
	}

	.footer__links {
		list-style: none;
		flex-shrink: 0;
		display: flex;
		gap: 24px;
		font-size: 14px;
	}

	.footer__links a:hover {
		text-decoration: underline;
	}

	.footer__links a:active {
		text-decoration: underline;
		color: var(--color-text-blue);
	}
	
	.footer-white .footer__links a:active {
		text-decoration: underline;
		color: var(--color-text-light-blue);
	}

	.footer__link {
		text-decoration: none;
	}

	@media (min-width: 1025px) {
		.footer__link {
			transition: color 0.2s;
		}

		.footer__link:hover {
			color: #272726;
		}
		.footer-white .footer__link:hover {
			color: var(--colors-button-white-default);
		}
	}

	@media (min-width: 769px) {
		.footer__magnet {
			display: none;
		}
	}

	@media (max-width: 1024px) {
		.footer {
			padding: var(--section-vertical-padding) calc(var(--screen-padding-large));
		}

		.footer__bottom {
			justify-content: unset;
			flex-direction: column;
			align-items: center;

			gap: 1.2rem;

			padding: 0;
			padding-top: 2.4rem;
			border-top: 1px solid #293a5f2b;
		}

		.footer__rights {
			text-align: center;
		}

		
		.footer__link {
			font-size: calc(1.6rem * var(--scale-after-changes));
			line-height: calc(2.4rem * var(--scale-after-changes));
		}
	}

	@media (min-width: 1440px) {

		
		.footer__link {
			font-size: 1.36rem;
			line-height: 2.04rem;
		}
	}

	@media (max-width: 768px) {
		.footer__top {
			position: relative;

			justify-content: center;
			align-items: center;
			flex-direction: column;

			padding-bottom: 2.4rem;
		}

		.footer__logo-link {
			margin-bottom: 3.2rem;
		}

		.footer__logo {
			width: auto;
			height: 100%;
			max-height: 42px;
		}

		.footer__links {
			flex-direction: column;
			align-items: center;
			gap: 1.2rem;
		}

		.footer__magnet {
			position: absolute;
			left: -6rem;
			top: 0;

			width: 20rem;
			height: 13.3rem;

			object-fit: contain;

			transform: rotate(13deg);
		}
	}

	@media (max-width: 600px) {
		.footer__logos {
			width: 100%;
			gap: 0;
			justify-content: space-between;
		}

		.footer__magnet {
			left: -8rem;
			top: -2.5rem;
		}
	}

	/* Стили для социальных сетей */
	.social {
		display: flex;
		align-items: center;
		gap: 2.4rem;
	}

	.social__link {
		position: relative;
		width: 40px;
		height: 40px;
		display: flex;
		align-items: center;
		justify-content: center;
		overflow: hidden;
	}

	.social__link__icon {
		width: 100%;
		height: auto;
		max-width: max-content;
		fill: var(--icon-color, var(--color-background-gray-100));
	}

	.footer-white .social__link__icon {
		fill: var(--colors-button-white-default);
	}

	.link-icon__hover {
		display: none;
	}

	.social__link:hover .link-icon__default {
		display: none;
	}

	.social__link:hover .link-icon__hover {
		display: block;
	}

	@media (min-width: 1025px) {
		.social__link__icon {
			transition: fill 0.2s;
		}

		.social__link:hover .social__link__icon {
			fill: var(--icon-hover-color, var(--color-brand-green));
		}
		.footer-white .social__link:hover .social__link__icon {
			fill: var(--colors-button-white-default);
		}
		
	}

	@media (max-width: 1024px) {
		.footer {
			max-width: calc(100% - 40px);
		}
	}

	@media (max-width: 450px) {
		.footer {
			max-width: calc(100% - 40px);
			background: #fbf9f2;
		}
		.footer-white .footer {
			background: var(--colors-button-blue-pressed);
		}

		.footer__logos {
			flex-wrap: wrap;
			gap: 24px;
			margin-bottom: 40px;
			padding: 0;
			align-items: center;
			justify-content: center;
			max-width: 288px;
		}

		.footer__logo-link {
			margin-bottom: 0;
		}

		.social__link {
			width: 40px;
			height: 43px;
		}

		.footer__links {
			gap: 12px;
		}

		.footer__social {
			gap: 32px;
		}

		.footer__rights,
		.footer__link {
			font-size: 14px;
			line-height: 140%;
			text-align: center;
		}

		.footer__bottom {
			gap: 24px;
		}
	}
}