/* ==========================================================================
   Bronisze online — stopka i pasek newslettera
   ========================================================================== */

.bo-footer {
	background: var(--bo-band);
	color: var(--bo-on-brand);
	margin-top: var(--bo-space-16);
}

/* --- newsletter ----------------------------------------------------------- */

.bo-newsletter { border-bottom: 1px solid rgb(255 255 255 / 0.12); }

.bo-newsletter__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--bo-space-6);
	padding-block: var(--bo-space-10);
}

.bo-newsletter__title {
	color: var(--bo-on-brand);
	font-size: var(--bo-text-xl);
}

.bo-newsletter__lead {
	margin-top: var(--bo-space-2);
	color: rgb(255 255 255 / 0.72);
	font-size: var(--bo-text-sm);
}

.bo-newsletter__form {
	display: flex;
	gap: var(--bo-space-3);
	flex: 1 1 360px;
	max-width: 520px;
}

.bo-newsletter__field {
	flex: 1 0 0;
	min-width: 0;
	padding: var(--bo-space-3) var(--bo-space-5);
	border: 1px solid rgb(255 255 255 / 0.24);
	border-radius: var(--bo-radius-sm);
	background: rgb(255 255 255 / 0.06);
	color: var(--bo-on-brand);
}

.bo-newsletter__field::placeholder { color: rgb(255 255 255 / 0.56); }

/* Zapis: wiersz z polem i przyciskiem, pod nim zgoda i komunikat wyniku. */
.bo-newsletter__form { flex-direction: column; align-items: stretch; gap: 10px; }
.bo-newsletter__row { display: flex; gap: 10px; }
.bo-newsletter__row .bo-newsletter__field { flex: 1 1 auto; min-width: 0; }
.bo-newsletter__consent { display: flex; align-items: flex-start; gap: 8px; font-size: 0.8125rem; line-height: 1.45; color: rgb(255 255 255 / 0.72); cursor: pointer; }
/* Pole zgody 20 px zamiast natywnych 13 px — przy kilkuwierszowej treści
   zgody drobny kwadrat ginął obok akapitu. */
.bo-newsletter__consent input { flex: 0 0 auto; width: 20px; height: 20px; margin: 0; accent-color: var(--bo-green); }
.bo-newsletter__hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.bo-newsletter__status { margin: 0; min-height: 0; font-size: 0.875rem; color: var(--bo-white); }
.bo-newsletter__status:empty { display: none; }
.bo-newsletter__status.is-ok { color: #9be7b8; }
.bo-newsletter__status.is-error { color: #ffb3b3; }

@media (max-width: 640px) {
	.bo-newsletter__row { flex-direction: column; }
}

.bo-newsletter__field:focus {
	outline: none;
	border-color: var(--bo-on-brand);
}

/* --- kolumny -------------------------------------------------------------- */

.bo-footer__main {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--bo-space-10);
	padding-block: var(--bo-space-12);
}

/*
 * Telefon: znak i opis na całą szerokość, kolumny odnośników po dwie.
 * W jednej kolumnie trzy listy dawały stopkę wyższą niż dwa ekrany.
 */
@media (min-width: 360px) and (max-width: 767px) {
	.bo-footer__main { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--bo-space-8) var(--bo-space-5); }
	.bo-footer__brand { grid-column: 1 / -1; }
}

@media (max-width: 599px) {
	.bo-footer { margin-top: var(--bo-space-10); }
	.bo-footer__main { padding-block: var(--bo-space-10); }
	.bo-newsletter__inner { padding-block: var(--bo-space-8); }
}

@media (min-width: 768px) {
	.bo-footer__main { grid-template-columns: repeat(3, 1fr); }
}

/* Tablet: trzy listy odnośników w jednym rzędzie pod znakiem. Znak
   w pierwszej z trzech kolumn ściskał opis do ~170 px, a trzecia lista
   spadała samotnie do drugiego rzędu. */
@media (min-width: 768px) and (max-width: 1023px) {
	.bo-footer__brand { grid-column: 1 / -1; }
}

@media (min-width: 1024px) {
	.bo-footer__main { grid-template-columns: 2fr 1fr 1fr 1fr; }
}

.bo-footer__logo {
	width: 166px;
	height: auto;
	/* Znak jest ciemnozielony — w stopce wybielamy go filtrem, aby nie
	   utrzymywać drugiego wariantu pliku. */
	filter: brightness(0) invert(1);
}

.bo-footer__about {
	margin-top: var(--bo-space-5);
	max-width: 42ch;
	color: rgb(255 255 255 / 0.72);
	font-size: var(--bo-text-sm);
}

.bo-footer__col-title {
	color: var(--bo-on-brand);
	font-size: var(--bo-text-base);
	margin-bottom: var(--bo-space-4);
}

.bo-footer__list { display: flex; flex-direction: column; gap: var(--bo-space-3); }

/*
 * Wysokość celu, nie wysokość tekstu. Pozycje stopki mierzyły 18 px i pola
 * dotyku sąsiadujących kolumn zachodziły na siebie — kryterium 2.5.8 nie było
 * spełnione ani rozmiarem, ani odstępem. Cel rośnie do 24 px bez zmiany
 * odstępów między wierszami.
 */
.bo-footer__list a {
	display: inline-flex;
	align-items: center;
	min-height: 24px;
	color: rgb(255 255 255 / 0.72);
	font-size: var(--bo-text-sm);
}

.bo-footer__list a:hover { color: var(--bo-on-brand); }

/* --- pasek prawny --------------------------------------------------------- */

.bo-footer__legal {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: var(--bo-space-3);
	padding-block: var(--bo-space-6);
	border-top: 1px solid rgb(255 255 255 / 0.12);
	color: rgb(255 255 255 / 0.56);
	font-size: var(--bo-text-xs);
}