/* CNV Footer — mirrors the reference footer layout */

/* ---------- Cnvapes Promise band (top of the footer, every page) ---------- */
.cnv-promise-band {
	background: #fdecea;
	background: linear-gradient(180deg, #fdecea 0%, #fdf3f2 100%);
	text-align: center;
	padding: 24px 16px 26px;
	line-height: 1.2;
}
.cnv-promise-band > span {
	display: block;
	color: #c40000;
	font-family: "Barlow Condensed", "Barlow", sans-serif;
	font-size: 14.4px;
	font-weight: 700;
	letter-spacing: .02em;
	text-transform: none;
	margin: 0 0 8px;
}
.cnv-promise-band > h2 {
	margin: 0;
	color: #c40000;
	font-family: "Barlow Condensed", "Barlow", sans-serif;
	font-size: 23px;
	font-weight: 700;
	line-height: 1.28;
	letter-spacing: 0;
}

/* ---------- Footer ---------- */
.cnv-footer {
	background: #101010;
	color: #cfcfcf;
	font-family: "Barlow", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}
.cnv-footer__wrap {
	max-width: 1300px;
	margin: 0 auto;
	padding: 34px 32px 0;
}

.cnv-footer__cols {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	align-items: start;
}

/* left: plain link list */
.cnv-footer__nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.cnv-footer__nav li { margin: 0; }
.cnv-footer__nav a {
	display: inline-block;
	padding: 7px 0;
	color: #e6e6e6;
	font-size: 14px;
	line-height: 1.4;
	text-decoration: none;
	transition: color .15s ease;
}
.cnv-footer__nav a:hover,
.cnv-footer__nav a:focus { color: #ffffff; text-decoration: underline; }

/* right: contact */
.cnv-footer__contact h4 {
	color: #ffffff;
	font-size: 16px;
	font-weight: 700;
	margin: 0 0 10px;
	letter-spacing: 0;
}
.cnv-footer__line {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 9px;
	color: #e6e6e6;
	font-size: 16px;
	line-height: 1.45;
}
.cnv-footer__line a { color: #e6e6e6; text-decoration: none; }
.cnv-footer__line a:hover { color: #fff; text-decoration: underline; }
.cnv-footer__ico {
	display: inline-flex;
	flex: 0 0 18px;
	width: 18px;
	height: 18px;
	color: #c40000;
	line-height: 0;
}
.cnv-footer__ico svg { width: 18px; height: 18px; display: block; }

/* social buttons */
.cnv-footer__social {
	display: flex;
	gap: 3px;
	margin: 14px 0 0;
}
.cnv-social {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 29px;
	height: 29px;
	border-radius: 50%;
	color: #fff;
	line-height: 0;
	text-decoration: none;
	transition: transform .15s ease, filter .15s ease;
}
.cnv-social svg { width: 15px; height: 15px; display: block; }
.cnv-social:hover { transform: translateY(-1px); filter: brightness(1.08); }
.cnv-social--facebook  { background: #3b5998; }
.cnv-social--instagram { background: radial-gradient(circle at 32% 106%, #fdf497 0%, #fdf497 8%, #fd5949 45%, #d6249f 62%, #285aeb 100%); }
.cnv-social--x         { background: transparent; color: #e8e8e8; }
.cnv-social--x svg     { width: 22px; height: 22px; }
.cnv-social--youtube   { background: #ff0000; }

/* bottom row */
.cnv-footer__bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-top: 22px;
	padding: 14px 0 18px;
	border-top: 1px solid #2c2c2c;
}
.cnv-footer__copy {
	margin: 0;
	color: #bdbdbd;
	font-size: 14px;
}

/* payment badges */
.cnv-payments {
	display: flex;
	align-items: center;
	gap: 6px;
	flex-wrap: wrap;
	justify-content: flex-end;
}
.cnv-payments__item {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 50px;
	height: 34px;
	border-radius: 6px;
	background: #262626;
	color: #d8d8d8;
}
.cnv-payments__item svg { width: 40px; height: 20px; display: block; fill: currentColor; }
.cnv-payments .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	border: 0;
}

/* ---------- mobile: match the reference stacking ---------- */
@media (max-width: 767px) {
	.cnv-promise-band { padding: 20px 14px 22px; }
	.cnv-promise-band > h2 { font-size: 17.3px; line-height: 1.3; }

	.cnv-footer__wrap { padding: 26px 16px 0; }

	.cnv-footer__cols {
		grid-template-columns: 1fr;
		gap: 0;
	}
	/* contact first, links second — reference order on small screens */
	.cnv-footer__contact { order: 1; }
	.cnv-footer__nav     { order: 2; margin-top: 26px; }

	.cnv-footer__nav ul {
		display: flex;
		flex-wrap: wrap;
		gap: 0 22px;
	}
	.cnv-footer__nav a { padding: 6px 0; font-size: 14px; }

	.cnv-footer__line { font-size: 16px; }

	.cnv-footer__bottom {
		flex-direction: column;
		align-items: flex-start;
		margin-top: 24px;
	}
	.cnv-payments { justify-content: flex-start; }
}

/* ---------- full-bleed: Storefront wraps the footer in a narrow .col-full ---------- */
.site-footer.site-footer {
	background: #101010 !important;
	padding: 0 !important;
	margin: 0 !important;
}
.site-footer > .col-full {
	max-width: none !important;
	width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
}
.cnv-footer { width: 100%; }

/* Storefront also adds a top border/background to .site-footer */
.site-footer::before,
.site-footer::after { display: none !important; }

/* stronger payment marks so they read on the dark bar */
.cnv-payments__item { background: #2a2a2a; color: #e2e2e2; }
.cnv-social svg { width: 16px; height: 16px; }
.cnv-social--facebook svg { width: 16px; height: 16px; }

/* ---------- beat the old theme footer rules (red fill / no gradient) ---------- */
footer#colophon .cnv-footer .cnv-social { color: #ffffff !important; }
footer#colophon .cnv-footer .cnv-social svg,
footer#colophon .cnv-footer .cnv-social svg * { fill: currentColor !important; }

footer#colophon .cnv-footer .cnv-social--facebook { background: #3b5998 !important; color: #fff !important; }
footer#colophon .cnv-footer .cnv-social--instagram {
	background: radial-gradient(circle at 32% 106%, #fdf497 0%, #fdf497 8%, #fd5949 45%, #d6249f 62%, #285aeb 100%) !important;
	color: #fff !important;
}
footer#colophon .cnv-footer .cnv-social--x { background: transparent !important; color: #e8e8e8 !important; }
footer#colophon .cnv-footer .cnv-social--youtube { background: #ff0000 !important; color: #fff !important; }

footer#colophon .cnv-footer .cnv-payments__item { background: #2a2a2a !important; color: #e2e2e2 !important; }
footer#colophon .cnv-footer .cnv-payments__item svg,
footer#colophon .cnv-footer .cnv-payments__item svg * { fill: currentColor !important; }

/* ---------- the theme sets `color` on .cnv-footer__contact svg (red) ---------- */
footer#colophon .cnv-footer .cnv-footer__social svg { color: #fff !important; }
footer#colophon .cnv-footer .cnv-social--x svg { color: #e8e8e8 !important; }

/* footer text is left aligned like the reference (theme centres footers) */
footer#colophon .cnv-footer { text-align: left !important; }

/* promise band: keep the reference type scale */
.cnv-promise-band > h2 { font-size: 23px !important; line-height: 1.28 !important; }
.cnv-promise-band > span { font-size: 14.4px !important; margin-bottom: 8px !important; }

@media (max-width: 767px) {
	.cnv-promise-band > h2 { font-size: 17.3px !important; line-height: 1.3 !important; }
	.cnv-promise-band > span { font-size: 14.4px !important; }

	/* keep the link row clear of the floating buttons */
	footer#colophon .cnv-footer__nav ul { gap: 0 18px !important; padding-right: 62px; }
	footer#colophon .cnv-footer__copy { text-align: left !important; }
	footer#colophon .cnv-footer__wrap { padding-bottom: 8px; }
}

/* mobile: reference centred © line, tighter gap, and links kept off the FAB column */
@media (max-width: 767px) {
	footer#colophon .cnv-footer__copy {
		text-align: center !important;
		width: 100%;
	}
	footer#colophon .cnv-footer__bottom {
		align-items: center !important;
		gap: 10px;
		margin-top: 18px;
	}
	footer#colophon .cnv-footer__bottom .cnv-payments { justify-content: center !important; }
	footer#colophon .cnv-footer__nav { margin-top: 20px !important; }
}

/* tighten desktop spacing to the reference's 391px footer height */
@media (min-width: 768px) {
	footer#colophon .cnv-footer__wrap { padding: 26px 32px 0 !important; }
	footer#colophon .cnv-footer__nav a { padding: 5px 0 !important; font-size: 14px; }
	footer#colophon .cnv-footer__contact h4 { margin-bottom: 8px; }
	footer#colophon .cnv-footer__line { margin-bottom: 6px; }
	footer#colophon .cnv-footer__social { margin-top: 10px; }
	footer#colophon .cnv-footer__bottom { margin-top: 14px; padding: 12px 0 14px; }
}