/* Footer — replaces Salient's own footer widgets/copyright bar.
   Loads site-wide (see ca_enqueue_footer_assets() in functions.php) since
   the footer appears on every page, same reasoning as mega-menu.css.
   Uses the --ca-* tokens already mirrored into main.css (:root block,
   "Design-system tokens" comment) rather than introducing new ones — but
   main.css itself only loads on clean templates (ca_enqueue_main_css() /
   ca_is_clean_template()), so every var() here needs its own hardcoded
   fallback (same pattern mega-menu.css already uses for the header) or it
   resolves to nothing on WPBakery pages: background falls back to white,
   "Say Hello" loses its coral colour, and white contact-link text goes
   invisible against that now-white background. */

.ca-ft {
	font-family: var(--font-body, 'Gilroy', system-ui, sans-serif);
	background-color: var(--ca-ink-900, #111223);
}

.ca-ft a {
	text-decoration: none;
}

.ca-ft-mobile {
	display: none;
}

/* ---- Desktop / tablet ---------------------------------------------- */

/* Matches the header's own container (#header-outer .ca-site-header__inner
   in style.css) rather than the generic .ca-container used elsewhere in the
   theme (--max-width/--gutter, a different/narrower system) — so the
   footer's edges line up with the nav above it. */
.ca-ft-container {
	width: 100%;
	max-width: var(--container-width, 1425px);
	margin-inline: auto;
	padding-inline: var(--container-padding, 90px);
}

.ca-ft-top {
	display: grid;
	grid-template-columns: 230px 1fr 300px;
	gap: 64px;
	align-items: start;
	padding-top: 76px;
	padding-bottom: 40px;
}

.ca-ft-logo img {
	height: 26px;
	width: auto;
	display: block;
	margin-top: 4px;
	filter: brightness(0) invert(1);
}

.ca-ft-columns {
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 40px;
	width: 100%;
}

.ca-ft-column {
	flex: 1 1 0;
	min-width: 0;
}

.ca-ft-head {
	margin: 0 0 14px;
	font-size: 12px;
	font-weight: 500;
	color: var(--ca-gray-500, #807e91);
	text-transform: uppercase;
	letter-spacing: 0.2em;
	line-height: 1.3;
}

.ca-ft-link {
	display: block;
	font-size: 12px;
	font-weight: 500;
	color: #b9b8cc;
	padding: 3px 0;
	line-height: 1.2;
	transition: color 140ms cubic-bezier(0.4, 0, 0.2, 1);
}
.ca-ft-link:hover {
	color: #fff;
}

.ca-ft-hello {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	text-align: right;
	gap: 34px;
}

.ca-ft-tagline__small {
	margin: 0;
	font-size: 19px;
	font-weight: 500;
	color: #fff;
	line-height: 1.2;
}
.ca-ft-tagline__big {
	margin: 6px 0 0;
	font-size: 46px;
    font-weight: 700 !important;
	font-style: italic;
	color: var(--ca-coral-pink, #ee486d);
	line-height: 1;
	letter-spacing: -0.02em;
}

.ca-ft-social {
	display: flex;
	gap: 40px;
	align-items: center;
}
.ca-ft-social__link {
	color: #8b89a0;
	font-size: 26px;
	line-height: 1;
	display: inline-flex;
	transition: color 160ms, transform 160ms;
}
.ca-ft-social__link:hover {
	color: #fff;
	transform: translateY(-2px);
}

.ca-ft-bottom {
	margin-top: 64px;
	padding-top: 24px;
	padding-bottom: 24px;
	border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.ca-ft-contact-row {
	display: flex;
	align-items: center;
	gap: 36px;
	flex-wrap: wrap;
	justify-content: space-between;
	padding-bottom: 20px;
}
.ca-ft-contact-link,
.ca-ft-contact-item {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: 15px;
	font-weight: 600;
	color: #fff;
}
.ca-ft-contact-item {
	font-weight: 500;
	color: #8b89a0;
}
.ca-ft-contact-link i,
.ca-ft-contact-item i {
	color: var(--ca-teams-purple-light, #c8bfe0);
	font-size: 15px;
}

.ca-ft-legal-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	padding-top: 18px;
	border-top: 1px solid rgba(255, 255, 255, 0.07);
}

.ca-ft-legal {
	margin: 0;
	font-size: 13px;
	font-weight: 600;
	color: #71708a;
}

.ca-ft-legal-links {
	display: flex;
	align-items: center;
	gap: 26px;
	flex-wrap: wrap;
}

.ca-ft-legal-link {
	font-size: 13px;
	font-weight: 600;
	color: #71708a;
	transition: color 140ms cubic-bezier(0.4, 0, 0.2, 1);
}
.ca-ft-legal-link:hover {
	color: var(--ca-teams-purple-light, #c8bfe0);
}

@media (max-width: 1100px) {
	.ca-ft-top {
		grid-template-columns: 1fr;
		gap: 44px;
	}
	.ca-ft-hello {
		align-items: flex-start;
		text-align: left;
	}
}

/* Same container-padding breakpoints as #header-outer .ca-site-header__inner
   in style.css, so the footer's edges keep matching the nav above it. */
@media (max-width: 999px) {
	.ca-ft-container {
		padding-inline: 24px;
	}
}

@media (max-width: 480px) {
	.ca-ft-container {
		padding-inline: 18px;
	}
}

/* ---- Mobile --------------------------------------------------------- */

@media (max-width: 760px) {
	.ca-ft-desktop {
		display: none;
	}
	.ca-ft-mobile {
		display: block;
		padding: 52px 24px 32px;
		text-align: center;
	}

	.ca-ft-mobile .ca-ft-logo img {
		height: 24px;
		display: block;
		margin: 0 auto 32px;
	}

	.ca-ft-mobile .ca-ft-tagline {
		margin-bottom: 28px;
	}

	.ca-ft-mobile .ca-ft-social {
		justify-content: center;
		margin: 0 0 34px;
	}

	.ca-ft-mobile .ca-ft-contact-row {
		flex-direction: column;
		align-items: center;
		gap: 14px;
		padding: 24px 0;
		border-top: 1px solid rgba(255, 255, 255, 0.1);
		border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	}
	.ca-ft-mobile .ca-ft-contact-item,
	.ca-ft-mobile .ca-ft-contact-link {
		font-size: 14px;
		text-align: center;
		line-height: 1.5;
	}

	.ca-ft-accordions {
		margin-top: 8px;
	}

	.ca-ft-acc {
		border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	}
	.ca-ft-acc summary {
		list-style: none;
		cursor: pointer;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 10px;
		padding: 16px 0;
		font-size: 12px;
		font-weight: 500;
		color: #fff;
		text-transform: uppercase;
		letter-spacing: 0.2em;
	}
	.ca-ft-acc summary::-webkit-details-marker {
		display: none;
	}
	.ca-ft-acc summary i {
		font-size: 11px;
		color: var(--ca-gray-500, #807e91);
		transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1);
	}
	.ca-ft-acc[open] summary i {
		transform: rotate(180deg);
	}
	.ca-ft-acc-body {
		padding: 0 0 18px;
		display: flex;
		flex-direction: column;
		gap: 2px;
		text-align: center;
	}

	.ca-ft-legal-row--mobile {
		flex-direction: column;
		align-items: center;
		gap: 14px;
		padding-top: 28px;
		border-top: none;
	}
	.ca-ft-legal-row--mobile .ca-ft-legal-links {
		justify-content: center;
		gap: 20px;
	}
}