/*
 * Szkoła Matematyki — footer.css
 * Stopka: kolumny, dane kontaktowe, dane do przelewu, dolna belka.
 *
 * Generowane z podziału jednego arkusza. Edytuj ten plik, nie łącz z powrotem.
 */

/* Stopka ------------------------------------------------------------------- */
.smf-footer { background: var(--smf-navy); color: #94a3b8; padding-block: var(--smf-s5) var(--smf-s4); }

.smf-footer__grid { display: grid; gap: var(--smf-s4); margin-bottom: var(--smf-s4); }

/*
 * Nagłówki kolumn stopki to h2, nie h4 — na podstronach poprzedza je h2,
 * więc h4 dawało przeskok poziomu (2 → 4) i błąd dostępności.
 */
.smf-footer h2 { color: #fff; font-size: .8125rem; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 1.125rem; }

.smf-footer p { font-size: .875rem; }

/*
 * Selektor z rodzicem, bo reset `.smf img { height: auto }` ma tę samą wagę
 * co sama klasa i wygrywał — logo rozjeżdżało się do rozmiaru pliku.
 */
.smf-footer img.smf-footer__logo {
	height: 2.75rem;
	width: auto;
	filter: brightness(0) invert(1);
	opacity: .9;
	margin-bottom: 1rem;
}

.smf-social { display: flex; gap: .75rem; margin-top: 1.25rem; }

.smf-social a {
	display: grid;
	place-items: center;
	width: 2.75rem;
	height: 2.75rem;
	border-radius: 50%;
	background: var(--smf-navy-2);
	color: #cbd5e1;
	transition: background-color .18s ease, color .18s ease;
}

.smf-social a:hover { background: var(--smf-blue); color: #fff; }

.smf-links { display: grid; gap: .75rem; }

.smf-links a {
	display: flex;
	align-items: center;
	gap: .5rem;
	padding-block: .375rem; /* cel dotykowy >= 24px (WCAG 2.5.8) */
	font-size: .875rem;
	color: #cbd5e1;
	transition: color .15s ease;
}

.smf-links a:hover { color: var(--smf-gold); }

.smf-links .smf-icon { width: .75rem; height: .75rem; color: var(--smf-gold); }

.smf-fcontact { display: grid; gap: 1rem; font-size: .875rem; }

.smf-fcontact li { display: flex; gap: .75rem; }

.smf-fcontact .smf-icon { margin-top: .1875rem; color: var(--smf-gold); }

.smf-fcontact a { display: inline-block; padding-block: .25rem; color: #fff; font-weight: 600; overflow-wrap: anywhere; }

.smf-fcontact a:hover { color: var(--smf-gold); }

.smf-fcontact small { display: block; color: #94a3b8; font-weight: 400; }

.smf-bank {
	padding: 1.25rem;
	border-radius: var(--smf-radius);
	background: rgba(30, 41, 59, .6);
	border: 1px solid #334155;
	display: grid;
	gap: .875rem;
	font-size: .875rem;
}

.smf-bank small { display: block; font-size: .75rem; color: #94a3b8; margin-bottom: .1875rem; }

.smf-bank b { color: #e2e8f0; font-weight: 600; }

.smf-bank__nr {
	font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
	color: var(--smf-gold);
	font-weight: 700;
	letter-spacing: -.01em;
	font-size: .8125rem;
}

.smf-bank__meta { padding-top: .875rem; border-top: 1px solid #334155; font-size: .75rem; display: grid; gap: .25rem; }

.smf-footer__bar {
	display: flex;
	flex-direction: column;
	gap: .875rem;
	align-items: center;
	text-align: center;
	padding-top: var(--smf-s3);
	border-top: 1px solid var(--smf-navy-2);
	font-size: .75rem;
	color: #94a3b8; /* 6.96:1 na granacie; #64748b dawało tylko 3.75:1 */
}

.smf-footer__bar nav { display: flex; gap: 1.25rem; }

.smf-footer__bar nav a { display: inline-block; padding-block: .375rem; }

.smf-footer__bar a:hover { color: #cbd5e1; }

@media (min-width: 640px) {
	.smf-footer__bar { flex-direction: row; justify-content: space-between; text-align: left; }
}

@media (min-width: 768px) {
	.smf-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1024px) {
	.smf-footer__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}