footer {
	background-color: var(--black);
	color: var(--white);
	font-family: var(--roboto);
	width: 100%;
	margin-top: 80px;
	padding: 20px 0;
	border-top: 8px solid silver;
}
.mobile footer, .tablet footer { padding:30px 20px 20px; }

footer h3 { color:#6f6f7c; margin-bottom: 5px; }

.desktop.wide footer .wrap  { width: 1200px; }
.desktop footer .wrap { width: 1000px; }
footer .wrap { margin: 0 auto; }

footer a { color:var(--white) }

footer div.logo a { 
	display: block; 
	height: 35px; 
	width: 20px; 
	margin: var(--footer-logo-margin); 
}
footer div.logo a:before {
	font-size:30px;
	color:var(--footer-logo-color);
	/* same 3 shadows always present (transparent) + same easing on everything = no snap at the start/end of the hover */
	text-shadow: 0 0 6px transparent, 0 0 18px transparent, 0 0 36px transparent;
	transform: translate(-50%,-50%) scale(1); /* kft centering */
	transition: color .45s ease-in-out, text-shadow .45s ease-in-out, transform .45s ease-in-out;
	will-change: transform;
	backface-visibility: hidden;
}
@media (hover: hover) {
	footer div.logo a:is(:focus,:hover):before {
		color:var(--footer-logo-hover);
		text-shadow: 0 0 6px var(--prime), 0 0 18px var(--prime), 0 0 36px var(--prime-less);
		transform: translate(-50%,-50%) scale(1.15); /* keep kft centering */
	}
}
@media (prefers-reduced-motion: reduce) { footer div.logo a:is(:focus,:hover):before { transform: translate(-50%,-50%); } }

.desktop .flex-col { justify-content:flex-start; }
.desktop footer nav { max-width: 1100px; margin-inline: auto; }
.desktop #ftr-news { width: 400px; margin-right: 80px; }
.desktop #footer_links { width: calc(100% - 500px); justify-content: space-between; }
.desktop #footerLogin { margin-block: 40px; }

.mobile #ftr-news, .tablet:not(.land) #ftr-news {  border-bottom: 1px solid var(--darkgray); padding-bottom: 20px; }

.tablet #ftr-news { width: 80%; margin: 0 auto 20px; }
.tablet #footer_links { width: 75%; justify-content: space-between; }
.tablet #footerLogin { margin-block: 40px; }

.tablet footer .aa-list a, .mobile footer .aa-list a { height:32px; }
.mobile #ftr-news { width: 80%; margin: 0 auto 20px; }
.mobile #footer_links { width: 75%; justify-content: space-between; }
.mobile footer .social-links { height:unset; margin-top:0; }
.mobile #footerLogin { margin-block: 30px 40px; }

.mobile #footerLinks { justify-content:center; }
#copyright { margin-left:auto; }
.mobile #copyright { width: 100%; text-align: center; margin-left: unset; }