/* ==========================================================
   LawyerAI (LAI) site footer
   Lives in the Divi Theme Builder footer layout.
   Colors follow the app's dark theme (app/static/css/brand.css).
   ========================================================== */

.et-l--footer .et_pb_section,
.et-l--footer .et_pb_row,
.et-l--footer .et_pb_column,
.et-l--footer .et_pb_code,
.et-l--footer .et_pb_code_inner {
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
}

.laif {
	--laif-text: #f7f4ff;
	--laif-body: #d2c8e4;
	--laif-muted: #968aae;
	--laif-link: #cdbaff;
	--laif-border: rgba(205, 186, 255, 0.16);
	--laif-surface: rgba(255, 255, 255, 0.055);
	--laif-gradient: linear-gradient(135deg, #7655e9 0%, #a66deb 100%);
	--laif-gradient-hover: linear-gradient(135deg, #6848df 0%, #985edf 100%);
	--laif-font: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;

	position: relative;
	width: 100%;
	overflow: hidden;
	background:
		radial-gradient(circle at top right, rgba(170, 118, 238, 0.24), transparent 31%),
		radial-gradient(circle at 15% 85%, rgba(118, 85, 233, 0.15), transparent 30%),
		linear-gradient(155deg, #171326 0%, #201735 55%, #151221 100%);
	color: var(--laif-body);
	font-family: var(--laif-font);
	-webkit-font-smoothing: antialiased;
}

.laif *,
.laif *::before,
.laif *::after {
	box-sizing: border-box;
}

.laif a {
	text-decoration: none;
}

.laif-inner {
	width: min(calc(100% - 48px), 1240px);
	margin: 0 auto;
	padding: 72px 0 32px;
}

/* ==========================================================
   CTA band
   ========================================================== */

.laif-cta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 32px;
	padding: 32px 36px;
	border: 1px solid var(--laif-border);
	border-radius: 20px;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.065), rgba(255, 255, 255, 0.045));
	box-shadow: 0 18px 38px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.laif-label {
	display: block;
	margin-bottom: 10px;
	color: var(--laif-muted);
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.laif-cta-title {
	margin: 0;
	padding: 0;
	color: var(--laif-text);
	font-family: var(--laif-font);
	font-size: clamp(24px, 2.6vw, 32px);
	font-weight: 700;
	line-height: 1.12;
	letter-spacing: -0.025em;
}

.laif-cta-text {
	max-width: 560px;
	margin: 10px 0 0;
	padding: 0;
	color: var(--laif-body);
	font-size: 15px;
	line-height: 1.6;
}

.laif-cta-actions {
	display: flex;
	flex: 0 0 auto;
	gap: 10px;
}

.laif-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	min-height: 48px;
	padding: 0 20px;
	border: 1px solid transparent;
	border-radius: 14px;
	font-family: var(--laif-font);
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	white-space: nowrap;
	transition: background 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease;
}

.laif-btn svg {
	width: 17px;
	height: 17px;
}

.laif-btn-primary {
	background: var(--laif-gradient);
	color: #ffffff !important;
	box-shadow: 0 8px 18px rgba(118, 85, 233, 0.2);
}

.laif-btn-primary:hover {
	background: var(--laif-gradient-hover);
	box-shadow: 0 10px 24px rgba(118, 85, 233, 0.32);
}

.laif-btn-secondary {
	border-color: var(--laif-border);
	background: rgba(255, 255, 255, 0.06);
	color: var(--laif-text) !important;
}

.laif-btn-secondary:hover {
	border-color: rgba(205, 186, 255, 0.3);
	background: rgba(255, 255, 255, 0.1);
}

/* ==========================================================
   Main grid
   ========================================================== */

.laif-main {
	display: grid;
	grid-template-columns: minmax(0, 1.6fr) repeat(4, minmax(0, 1fr));
	gap: 40px;
	padding: 64px 0 48px;
}

.laif-logo {
	display: inline-flex;
}

.laif-logo img {
	display: block;
	width: auto;
	height: 46px;
}

.laif-tagline {
	max-width: 320px;
	margin: 18px 0 0;
	padding: 0;
	color: var(--laif-body);
	font-size: 15px;
	line-height: 1.6;
}

.laif .laif-trust {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 22px 0 0;
	padding: 0;
	list-style: none;
}

.laif .laif-trust li {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	padding: 0;
	color: var(--laif-body);
	font-size: 13.5px;
	font-weight: 500;
}

.laif-trust svg {
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	color: var(--laif-link);
}

.laif-col {
	display: flex;
	flex-direction: column;
	gap: 12px;
	min-width: 0;
}

.laif-heading {
	margin: 0 0 6px;
	padding: 0;
	color: var(--laif-muted);
	font-family: var(--laif-font);
	font-size: 11.5px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.laif-col a {
	width: fit-content;
	color: var(--laif-body) !important;
	font-size: 14.5px;
	font-weight: 500;
	line-height: 1.4;
	transition: color 0.16s ease;
}

.laif-col a:hover {
	color: var(--laif-text) !important;
}

/* ==========================================================
   Bottom bar
   ========================================================== */

.laif-bottom {
	padding-top: 28px;
	border-top: 1px solid var(--laif-border);
}

.laif-disclaimer {
	max-width: 860px;
	margin: 0 0 20px;
	padding: 0;
	color: var(--laif-muted);
	font-size: 13px;
	line-height: 1.6;
}

.laif-bottom-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px 24px;
	color: var(--laif-muted);
	font-size: 13px;
}

.laif-bottom-links {
	display: flex;
	gap: 22px;
}

.laif-bottom-links a {
	color: var(--laif-muted) !important;
	font-weight: 500;
	transition: color 0.16s ease;
}

.laif-bottom-links a:hover {
	color: var(--laif-text) !important;
}

.laif a:focus-visible {
	outline: 3px solid rgba(205, 186, 255, 0.45);
	outline-offset: 3px;
	border-radius: 6px;
}

/* ==========================================================
   Responsive
   ========================================================== */

@media (max-width: 1080px) {
	.laif-main {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.laif-brand {
		grid-column: 1 / -1;
	}
}

@media (max-width: 860px) {
	.laif-cta {
		flex-direction: column;
		align-items: flex-start;
		padding: 26px 24px;
	}
}

@media (max-width: 768px) {
	/* Clear the homepage's fixed mobile CTA bar. */
	body:has(.lai-mobile-cta) .laif-inner {
		padding-bottom: calc(101px + env(safe-area-inset-bottom, 0px)) !important;
	}
}

@media (max-width: 720px) {
	.laif-inner {
		width: min(calc(100% - 28px), 1240px);
		padding: 48px 0 calc(28px + env(safe-area-inset-bottom, 0px));
	}

	.laif-main {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 32px 20px;
		padding: 48px 0 36px;
	}

	.laif-cta-actions {
		width: 100%;
		flex-direction: column;
	}

	.laif-btn {
		width: 100%;
	}

	.laif-logo img {
		height: 40px;
	}

	.laif-bottom-row {
		flex-direction: column;
		align-items: flex-start;
	}
}