/* footer: original homepage design and editable color variables. */

:where(.wp-site-blocks, .editor-styles-wrapper) .footer a {
	color: inherit;
	text-decoration: none;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .footer a:hover {
	color: var(--purple);
}

:where(.wp-site-blocks, .editor-styles-wrapper) .footer {
	background: #151421;
	color: #dfdbe8;
	padding: 55px max(24px,calc((100vw - 1120px)/2)) 23px;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .footer-top {
	display: grid;
	grid-template-columns: 2fr repeat(3,1fr);
	gap: 36px;
	padding-bottom: 47px;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .footer-top p {
	color: #9994a7;
	line-height: 1.6;
	font-size: 14px;
	max-width: 270px;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .footer h3 {
	color: #fff;
	font-size: 13px;
	margin: 7px 0 14px;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .footer-top a:not(.brand) {
	display: block;
	color: #aaa5b8;
	font-size: 13px;
	margin: 9px 0;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .regulators {
	padding: 23px 0;
	border-top: 1px solid #ffffff1d;
	border-bottom: 1px solid #ffffff1d;
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .regulator {
	border: 1px solid #767181;
	border-radius: 5px;
	padding: 7px 10px;
	font-weight: 700;
	font-size: 13px;
	color: #c7c3ce;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .regulator.wide {
	font-size: 10px;
	letter-spacing: 1px;
}

:where(.wp-site-blocks, .editor-styles-wrapper) .footer-bottom {
	padding-top: 19px;
	display: flex;
	justify-content: space-between;
	color: #817c8d;
	font-size: 11px;
}

@media(max-width:760px) {
	:where(.wp-site-blocks, .editor-styles-wrapper) .footer-top {
		grid-template-columns: 1fr 1fr;
		gap: 25px;
	}
	
	:where(.wp-site-blocks, .editor-styles-wrapper) .footer-top>div:first-child {
		grid-column: span 2;
	}
	
	:where(.wp-site-blocks, .editor-styles-wrapper) .payments {
		margin-left: 0;
		width: 100%;
	}
	
	:where(.wp-site-blocks, .editor-styles-wrapper) .footer-bottom {
		gap: 10px;
		flex-direction: column;
	}
	
}

.np-block.footer { background: var(--footer-bg, #151421); color: var(--footer-text, #dfdbe8); }
.np-block.footer .brand { color: var(--footer-brand, #dfdbe8); }
.np-block.footer h3 { color: var(--footer-heading, #fff); }
.np-block.footer .footer-top p { color: var(--footer-muted, #9994a7); }
.np-block.footer .footer-top a:not(.brand) { color: var(--footer-link, #aaa5b8); }
.np-block.footer .footer-top a:hover { color: var(--purple); }
.np-block.footer .regulators { border-color: var(--footer-border, #ffffff1d); }
.np-block.footer .regulator { color: var(--footer-badge, #c7c3ce); border-color: var(--footer-badge-border, #767181); }
.np-block.footer .regulator-image { max-width: 130px; max-height: 35px; width: auto; object-fit: contain; vertical-align: middle; }
.np-block.footer .footer-bottom { color: var(--footer-copyright, #817c8d); }
.np-block.footer .footer-top > * { min-width: 0; }
.np-block.footer .np-menu,
.np-block.footer .sub-menu { list-style: none; margin: 0; padding: 0; }
.np-block.footer .sub-menu { padding-left: 14px; border-left: 1px solid var(--footer-border, #ffffff1d); }
.np-block.footer .footer-menu a,
.np-block.footer .footer-menu h3 { overflow-wrap: anywhere; }
.np-block.footer .footer-menu a[aria-current="page"] { color: var(--purple); }
.np-block.footer .footer-menu a:focus-visible { outline: 2px solid var(--purple); outline-offset: 3px; }

.np-block.footer .footer-socials { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 10px; margin-inline-start: auto; }
.np-block.footer .footer-social-link { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border: 1px solid var(--footer-badge-border, #767181); border-radius: 8px; color: var(--footer-badge, #c7c3ce); }
.np-block.footer .footer-social-link svg { display: block; flex-shrink: 0; }
.np-block.footer .footer-social-link:hover { color: var(--purple); border-color: currentColor; }
.np-block.footer .footer-social-link:focus-visible { outline: 2px solid var(--purple); outline-offset: 3px; }
@media (max-width: 760px) {
	.np-block.footer .footer-socials { width: 100%; margin-inline-start: 0; }
}
