/*--------------------------------------------------------------
# Footer — 4-Column Layout + Trust Badges
#
# Navy dark background with gold accents.
# Uses Bootstrap 5 grid for columns.
--------------------------------------------------------------*/

/* ==========================================================================
   Pre-Footer CTA Strip
   ========================================================================== */

.footer-cta-strip {
	background: linear-gradient(135deg, var(--color-emergency), var(--color-emergency-dark));
	color: var(--color-text-inverse);
	padding: var(--space-6) 0;
	text-align: center;
}

.footer-cta-strip__heading {
	font-family: var(--font-heading);
	font-weight: var(--weight-bold);
	font-size: var(--text-2xl);
	margin-bottom: var(--space-3);
}

.footer-cta-strip__phone {
	display: inline-flex;
	align-items: center;
	gap: var(--space-2);
	color: var(--color-text-inverse);
	font-family: var(--font-heading);
	font-weight: var(--weight-bold);
	font-size: var(--text-3xl);
	text-decoration: none;
	transition: transform var(--transition-fast);
}

.footer-cta-strip__phone:hover {
	color: var(--color-text-inverse);
	transform: scale(1.05);
}

/* ==========================================================================
   Main Footer
   ========================================================================== */

.site-footer {
	background-color: var(--color-primary-dark);
	color: var(--color-text-inverse);
	padding: var(--space-10) 0 var(--space-6);
}

.site-footer a {
	color: rgba(255, 255, 255, 0.8);
	text-decoration: none;
	transition: color var(--transition-fast);
}

.site-footer a:hover {
	color: var(--color-accent);
}

/* Footer column headings */
.footer__heading {
	font-family: var(--font-heading);
	font-weight: var(--weight-bold);
	font-size: var(--text-lg);
	color: var(--color-accent);
	margin-bottom: var(--space-5);
	text-transform: uppercase;
	letter-spacing: var(--tracking-caps);
}

/* Footer brand / description */
.footer__brand-name {
	font-family: var(--font-heading);
	font-weight: var(--weight-bold);
	font-size: var(--text-xl);
	color: var(--color-text-inverse);
	margin-bottom: var(--space-3);
}

.footer__description {
	color: rgba(255, 255, 255, 0.7);
	font-size: var(--text-sm);
	line-height: var(--leading-relaxed);
	margin-bottom: var(--space-4);
}

.footer__kbo {
	font-size: var(--text-xs);
	color: rgba(255, 255, 255, 0.5);
}

/* Footer link lists */
.footer__links {
	list-style: none;
	padding: 0;
	margin: 0;
}

.footer__links li {
	margin-bottom: var(--space-2);
}

.footer__links a {
	font-size: var(--text-base);
	display: inline-flex;
	align-items: center;
	gap: var(--space-2);
}

.footer__links a i {
	width: 16px;
	text-align: center;
	font-size: var(--text-sm);
	color: var(--color-accent);
}

/* Contact info column */
.footer__contact-item {
	display: flex;
	align-items: flex-start;
	gap: var(--space-3);
	margin-bottom: var(--space-4);
	font-size: var(--text-base);
}

.footer__contact-item i {
	color: var(--color-accent);
	font-size: var(--text-lg);
	width: 20px;
	text-align: center;
	flex-shrink: 0;
	margin-top: 2px;
}

.footer__contact-item a {
	font-weight: var(--weight-semibold);
}

/* ==========================================================================
   Social Media Links
   ========================================================================== */

.footer__social {
	display: flex;
	gap: var(--space-3);
	margin-top: var(--space-5);
}

.footer__social-link {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: var(--radius-full);
	background-color: rgba(255, 255, 255, 0.1);
	color: rgba(255, 255, 255, 0.7);
	font-size: var(--text-base);
	transition: all var(--transition-fast);
}

.footer__social-link:hover {
	background-color: var(--color-accent);
	color: var(--color-primary-dark);
	transform: translateY(-2px);
}

/* ==========================================================================
   Trust Badges Row
   ========================================================================== */

.footer__trust-badges {
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	margin-top: var(--space-8);
	padding-top: var(--space-6);
	display: flex;
	justify-content: center;
	align-items: center;
	gap: var(--space-8);
	flex-wrap: wrap;
}

.footer__badge {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-2);
	color: rgba(255, 255, 255, 0.6);
	font-size: var(--text-xs);
	text-align: center;
}

.footer__badge i {
	font-size: var(--text-2xl);
	color: var(--color-accent);
}

/* ==========================================================================
   Copyright Bar
   ========================================================================== */

.footer__copyright {
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	margin-top: var(--space-6);
	padding-top: var(--space-5);
	text-align: center;
	font-size: var(--text-xs);
	color: rgba(255, 255, 255, 0.4);
}

.footer__copyright a {
	color: rgba(255, 255, 255, 0.5);
}

.footer__copyright a:hover {
	color: var(--color-accent);
}

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

@media (max-width: 767.98px) {
	.site-footer {
		padding: var(--space-8) 0 var(--space-5);
		text-align: center;
	}

	.footer__heading {
		margin-top: var(--space-6);
	}

	.footer__contact-item {
		justify-content: center;
	}

	.footer__trust-badges {
		gap: var(--space-5);
	}

	.footer-cta-strip__phone {
		font-size: var(--text-2xl);
	}
}
