/* ==========================================================================
   Emporiapolis — footer.css
   Dark navy 4-column footer + bottom credential bar.
   ========================================================================== */

.emp-footer {
	background: var(--emp-navy);
	color: #fff;
}

.emp-footer__container {
	max-width: var(--emp-container);
	margin-inline: auto;
	padding: clamp(3rem, 6vw, 5rem) clamp(1rem, 4vw, 4rem);
}

/* ── Brand ── */
.emp-footer__brand { margin-bottom: 3rem; }
.emp-footer__logo { display: flex; align-items: center; gap: 0.75rem; }
.emp-footer__logo-chip {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 12px;
	background: #fff;
	overflow: hidden;
}
.emp-footer__logo-mark { width: 32px; height: 32px; object-fit: contain; }
.emp-footer__logo-name {
	font-family: var(--emp-font-body);
	font-size: 1.5rem;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: #fff;
}
.emp-footer__tagline {
	margin: 0.75rem 0 0;
	font-size: 14px;
	color: var(--emp-light);
	max-width: 24rem;
}

/* ── 4-column grid ── */
.emp-footer__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2rem;
}
@media (min-width: 768px) {
	.emp-footer__grid { grid-template-columns: repeat(4, 1fr); gap: 2.5rem; }
}

.emp-footer__title {
	font-family: var(--emp-font-body);
	font-size: 12px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.15em;
	color: var(--emp-blue);
	margin: 0 0 1rem;
}
.emp-footer__title--tight { margin-bottom: 0.25rem; }

.emp-footer__list { display: flex; flex-direction: column; gap: 0.625rem; }
.emp-footer__list a {
	font-size: 14px;
	color: var(--emp-light);
	transition: color 0.25s var(--emp-ease);
}
.emp-footer__list a:hover { color: var(--emp-blue); }

.emp-footer__sublabel {
	font-size: 10px;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--emp-muted);
	padding-top: 0.125rem;
}
.emp-footer__sublabel--mt { padding-top: 0.75rem; }

/* ── Contact column ── */
.emp-footer__contact { display: flex; flex-direction: column; gap: 0.75rem; }
.emp-footer__contact a,
.emp-footer__address {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 14px;
	color: var(--emp-light);
	transition: color 0.25s var(--emp-ease);
}
.emp-footer__contact a:hover { color: var(--emp-blue); }
.emp-footer__address { align-items: flex-start; }
.emp-footer__contact svg,
.emp-footer__address svg { color: var(--emp-muted); flex-shrink: 0; margin-top: 1px; }

/* ── Hours column ── */
.emp-footer__hours-sub {
	font-size: 10px;
	color: var(--emp-muted);
	line-height: 1.4;
	margin: 0 0 1rem;
}
.emp-footer__hours { display: flex; flex-direction: column; gap: 0.375rem; }
.emp-footer__hours-row { display: flex; justify-content: space-between; font-size: 14px; }
.emp-footer__hours-day { color: var(--emp-light); }
.emp-footer__hours-time { color: var(--emp-muted); }
.emp-footer__ops {
	margin: 1rem 0 0;
	padding-top: 0.75rem;
	border-top: 1px solid var(--emp-border-dark);
	font-size: 11px;
	font-weight: 500;
	line-height: 1.4;
	color: var(--emp-blue);
}

/* ── Bottom bar ── */
.emp-footer__bottom { border-top: 1px solid var(--emp-border-dark); }
.emp-footer__bottom-inner {
	max-width: var(--emp-container);
	margin-inline: auto;
	padding: 1.5rem clamp(1rem, 4vw, 4rem);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}
@media (min-width: 768px) {
	.emp-footer__bottom-inner { flex-direction: row; }
}
.emp-footer__creds { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; }
.emp-footer__cred-pill {
	font-size: 12px;
	color: var(--emp-muted);
	padding: 0.25rem 0.75rem;
	border: 1px solid var(--emp-border-dark);
	border-radius: 999px;
}
.emp-footer__legal {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.5rem;
	font-size: 12px;
	color: var(--emp-muted);
}
@media (min-width: 640px) {
	.emp-footer__legal { flex-direction: row; }
}
.emp-footer__legal a { transition: color 0.25s var(--emp-ease); }
.emp-footer__legal a:hover { color: var(--emp-blue); }

/* Footer extra widget area */
.emp-footer-widget { margin-top: 1.5rem; }
.emp-footer-widget__title { color: var(--emp-blue); font-size: 12px; text-transform: uppercase; letter-spacing: 0.15em; }