/*
 * Footer v2 (below-newsletter redesign, 2026-07-04).
 * Scope: footer.site-footer.ck-footer-v2 — the newsletter block (logo, checks,
 * mc4wp form) is intentionally NOT touched; only the background behind it and
 * everything below changes. Accordion mechanics stay in custom.js §14 +
 * common.css (+/- indicators); this layer only restyles appearance.
 */

/* background: soft navy gradient + very faint large grid texture */
body footer.site-footer.ck-footer-v2 {
	position: relative;
	overflow: hidden;
	background:
		radial-gradient(820px 260px at 50% 0%, rgba(255, 255, 255, 0.06), transparent 60%),
		linear-gradient(180deg, #01234A 0%, #011D3F 58%, #01172F 100%) !important;
}
footer.site-footer.ck-footer-v2::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	opacity: 0.02;
	background-image:
		linear-gradient(90deg, rgba(255, 255, 255, 0.18) 1px, transparent 1px),
		linear-gradient(180deg, rgba(255, 255, 255, 0.14) 1px, transparent 1px);
	background-size: 220px 220px;
	-webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 30%, transparent 85%);
	mask-image: linear-gradient(to bottom, transparent 0, #000 30%, transparent 85%);
}
footer.site-footer.ck-footer-v2 .container {
	position: relative;
	z-index: 1;
}

/* ---- main grid: brand column + the 4 footer widgets ---- */
footer.site-footer.ck-footer-v2 .ck-fv2-main {
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	padding-top: 24px;
	margin-bottom: 36px;
}
@media only screen and (min-width: 992px) {
	footer.site-footer.ck-footer-v2 .ck-fv2-main {
		display: grid;
		grid-template-columns: 1.35fr 0.8fr 0.8fr 1fr 1.16fr;
		gap: 34px;
		padding-top: 40px;
		margin-bottom: 52px;
	}
}

/* brand column */
footer.site-footer.ck-footer-v2 .ck-fv2-brand p {
	max-width: 285px;
	margin: 0;
	color: rgba(255, 255, 255, 0.74);
	font-size: 13px;
	line-height: 1.72;
}
footer.site-footer.ck-footer-v2 .ck-fv2-social {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 22px;
}
footer.site-footer.ck-footer-v2 .ck-fv2-social a {
	width: 38px;
	height: 38px;
	border-radius: 999px;
	display: grid;
	place-items: center;
	color: #fff;
	background: rgba(255, 255, 255, 0.075);
	border: 1px solid rgba(255, 255, 255, 0.055);
	transition: transform 0.15s ease, background 0.15s ease;
}
footer.site-footer.ck-footer-v2 .ck-fv2-social a:hover {
	background: rgba(255, 255, 255, 0.14);
	transform: translateY(-1px);
}
footer.site-footer.ck-footer-v2 .ck-fv2-social svg {
	display: block;
}
/* the mobile-only social row (rendered in the bottom bar) is hidden on desktop */
footer.site-footer.ck-footer-v2 .ck-fv2-social--mobile {
	display: none;
}
@media only screen and (max-width: 991px) {
	/* Mobile: drop the brand blurb (dead space right after the newsletter);
	   the social icons move down into the bottom bar via .ck-fv2-social--mobile. */
	footer.site-footer.ck-footer-v2 .ck-fv2-brand {
		display: none;
	}
	/* even accordion rows: kill the grid top-padding on mobile so the first row
	   (Company) sits the same 14px below its divider as every other row does
	   (that 14px comes from each .widget's own top padding in common.css). */
	footer.site-footer.ck-footer-v2 .ck-fv2-main {
		padding-top: 0;
		margin-bottom: 20px;
	}
	footer.site-footer.ck-footer-v2 .ck-fv2-social--mobile {
		display: flex;
		justify-content: center;
		gap: 9px;
		margin: 0;
	}
	footer.site-footer.ck-footer-v2 .ck-fv2-social--mobile a {
		width: 32px;
		height: 32px;
	}
}

/* widget headings + links (overrides common.css values) */
body .site footer.site-footer.ck-footer-v2 .widget .widget-title {
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0.01em;
}
body .site footer.site-footer.ck-footer-v2 .widget ul.menu li.menu-item a {
	display: inline-block;
	font-size: 13px;
	font-weight: 500;
	color: rgba(255, 255, 255, 0.74);
	transition: color 0.14s ease, transform 0.14s ease;
}
body .site footer.site-footer.ck-footer-v2 .widget ul.menu li.menu-item a:hover {
	color: #fff;
	transform: translateX(2px);
}
footer.site-footer.ck-footer-v2 .widget li {
	margin-bottom: 11px;
	line-height: 1.55;
}
@media only screen and (min-width: 992px) {
	footer.site-footer.ck-footer-v2 .widget > div > * {
		margin-top: 17px;
	}
}

/* Get In Touch list (custom_html widget content) */
footer.site-footer.ck-footer-v2 .ck-git-list {
	list-style: none;
	margin: 0;
	padding: 0;
}
footer.site-footer.ck-footer-v2 .ck-git-list li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
}
footer.site-footer.ck-footer-v2 .ck-git-list svg {
	flex: none;
	margin-top: 3px;
	opacity: 0.7;
}
footer.site-footer.ck-footer-v2 .ck-git-list a {
	display: inline-block;
	font-size: 13px;
	font-weight: 500;
	color: rgba(255, 255, 255, 0.74);
	text-decoration: none;
	transition: color 0.14s ease, transform 0.14s ease;
}
footer.site-footer.ck-footer-v2 .ck-git-list a:hover {
	color: #fff;
	transform: translateX(2px);
}
@media only screen and (max-width: 991px) {
	footer.site-footer.ck-footer-v2 .ck-git-list li {
		justify-content: flex-start;
	}
}

/* ghost wordmark (desktop only, very subtle) */
footer.site-footer.ck-footer-v2 .ck-fv2-ghost {
	display: none;
}
@media only screen and (min-width: 992px) {
	footer.site-footer.ck-footer-v2 .ck-fv2-ghost {
		display: block;
		position: absolute;
		left: 12px;
		right: 12px;
		bottom: 62px;
		z-index: 0;
		overflow: hidden;
		white-space: nowrap;
		text-align: center;
		pointer-events: none;
		user-select: none;
		color: rgba(255, 255, 255, 0.03);
		font-size: clamp(92px, 13vw, 172px);
		line-height: 0.82;
		font-weight: 800;
		letter-spacing: 0.08em;
	}
}

/* bottom bar */
footer.site-footer.ck-footer-v2 .ck-fv2-bottom {
	position: relative;
	z-index: 1;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	padding: 15px 0 18px;
}
footer.site-footer.ck-footer-v2 .ck-fv2-bottom-in {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	text-align: center;
}
@media only screen and (min-width: 768px) {
	footer.site-footer.ck-footer-v2 .ck-fv2-bottom-in {
		flex-direction: row;
		justify-content: space-between;
		text-align: left;
	}
}
footer.site-footer.ck-footer-v2 .ck-fv2-copy {
	color: rgba(255, 255, 255, 0.5);
	font-size: 12px;
}
/* payments must never overflow small screens (350px) */
footer.site-footer.ck-footer-v2 .ck-fv2-pay svg {
	display: block;
	max-width: 100%;
	height: auto;
}

/* mobile: texture nearly invisible */
@media only screen and (max-width: 991px) {
	footer.site-footer.ck-footer-v2::before {
		opacity: 0.007;
		background-size: 260px 260px;
	}
}
/* ITER 180 - the 4-plate strip carries chemyo.com's own 339x24 intrinsic box (viewBox padded 48
   units on the LEFT, artwork translated into it) so it scales down at narrow widths exactly as
   theirs does. At >=768 the row is right-aligned, so the left padding costs nothing and the artwork
   does not move. Below 768 the strip is CENTRED, so the 48-unit pad has to be halved back out:
   -24/339 = -7.0796% of the element's own painted width, which stays exact under the scale. */
@media only screen and (max-width: 767px) {
  footer.site-footer.ck-footer-v2 .ck-fv2-pay svg {
    transform: translateX(-7.0796%);
  }
}