/* ────── Footer ────── */
.footer {
	background: var(--bg);
	padding: 72px 0 40px;
	border-top: 1px solid var(--border);
}

.footer-cs-grid {
	display: grid;
	grid-template-columns: 1.2fr 1fr 1fr;
	gap: 24px;
	margin-bottom: 40px;
}

/* CS card */
.footer-cs-card {
	background: #1c1d1f;
	color: #fff;
	border-radius: 20px;
	padding: 32px;
	background-image: radial-gradient(ellipse at 100% 0%, rgba(255, 204, 0, 0.2) 0%, transparent 55%);
}

.footer-cs-card a {
	color: inherit;
}

.footer-cs-badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: rgba(255, 255, 255, 0.1);
	padding: 6px 12px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
	color: var(--y-400);
	margin-bottom: 16px;
}

.footer-cs-phone {
	display: block;
	font-size: 42px;
	font-weight: 800;
	letter-spacing: -0.03em;
	color: #fff;
	margin-bottom: 6px;
}

.footer-cs-hours {
	font-size: 13.5px;
	color: rgba(255, 255, 255, 0.65);
	margin-bottom: 20px;
}

.footer-cs-actions {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.footer-btn-remote,
.footer-btn-ghost {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 10px 16px;
	border-radius: 10px;
	font-weight: 700;
	font-size: 13.5px;
}

.footer-btn-remote {
	background: var(--y-400);
	color: #1c1d1f;
}

.footer-btn-ghost {
	background: rgba(255, 255, 255, 0.1);
	color: #fff;
}

/* Account panel */
.footer-account-panel {
	background: var(--surface);
	border: 1px solid var(--border);
	border-radius: 20px;
	padding: 24px;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.footer-account-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}

.footer-account-badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--y-50);
	color: var(--y-700);
	padding: 6px 12px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
}

.footer-copy-btn {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 6px 10px;
	background: var(--ink-100);
	color: var(--ink-700);
	border-radius: 8px;
	font-size: 12px;
	font-weight: 700;
	cursor: pointer;
	transition:
		background 0.15s,
		color 0.15s;
}

.footer-copy-btn:hover {
	background: var(--ink-900);
	color: var(--bg);
}

.footer-account-row {
	display: flex;
	align-items: center;
	gap: 12px;
}

.footer-nh-logo {
	width: 44px;
	height: 44px;
	border-radius: 12px;
	background: #0a8b3a;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	font-weight: 800;
	letter-spacing: -0.02em;
	flex-shrink: 0;
}

.footer-account-info {
	min-width: 0;
}

.footer-account-bank {
	font-size: 13px;
	color: var(--ink-500);
	font-weight: 600;
}

.footer-account-number {
	font-size: 21px;
	font-weight: 800;
	letter-spacing: -0.02em;
	color: var(--ink-900);
	line-height: 1.2;
	font-variant-numeric: tabular-nums;
}

.footer-account-meta {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
	padding-top: 12px;
	border-top: 1px solid var(--border);
}

.footer-acct-label {
	font-size: 11.5px;
	color: var(--ink-500);
	font-weight: 600;
	margin-bottom: 2px;
}

.footer-acct-value {
	font-size: 14px;
	font-weight: 800;
	color: var(--ink-900);
}

.footer-acct-value--numeric {
	font-variant-numeric: tabular-nums;
}

/* Quickstart panel */
.footer-quickstart {
	background: var(--surface);
	border: 1px solid var(--border);
	border-radius: 20px;
	padding: 22px;
}

.footer-qs-badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--ink-100);
	color: var(--ink-800);
	padding: 6px 12px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
	margin-bottom: 10px;
}

.quickstart-list {
	display: grid;
	gap: 2px;
	font-size: 13.5px;
	font-weight: 600;
}

.quickstart-link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 9px 10px;
	margin: 0 -10px;
	border-radius: 10px;
	color: var(--ink-800);
	transition:
		background 0.15s ease,
		color 0.15s ease,
		padding 0.2s ease;
}

.quickstart-link .qs-arrow {
	color: var(--ink-400);
	transition:
		transform 0.2s ease,
		color 0.2s ease;
}

.quickstart-link:hover {
	background: var(--y-50);
	color: var(--y-700);
	padding-left: 14px;
}

.quickstart-link:hover .qs-arrow {
	color: var(--y-600);
	transform: translateX(4px);
}

html[data-theme="dark"] .quickstart-link:hover {
	color: var(--y-400);
}

html[data-theme="dark"] .quickstart-link:hover .qs-arrow {
	color: var(--y-400);
}

/* Footer bottom row */
.footer-row {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 24px;
}

.footer-meta {
	font-size: 12.5px;
	color: var(--ink-500);
	line-height: 1.7;
}

.footer-meta strong {
	color: var(--ink-700);
	margin-right: 4px;
	font-weight: 700;
}

.footer-meta span {
	margin-right: 12px;
}

.footer-links {
	display: flex;
	gap: 18px;
	flex-wrap: wrap;
	font-size: 13px;
}

.footer-links a {
	color: var(--ink-600);
}

.footer-links a:hover {
	color: var(--ink-900);
}

.footer-copy {
	border-top: 1px solid var(--border);
	padding-top: 20px;
	font-size: 12px;
	color: var(--ink-500);
	text-align: center;
}

@media (max-width: 1024px) {
	.footer-cs-grid {
		grid-template-columns: 1fr;
	}
}