/* --- Bądź blisko HAIRBOOM (newsletter) --------------------------------- */

.hb-newsletter.brxe-section {
	padding: 87px 0 88px;
	text-align: center;
}

.hb-newsletter .hb-h2 {
	font-size: var(--fs-48-26);
	line-height: 1.08;
	color: var(--hb-ink);
}

.hb-newsletter__opis {
	margin: 15px 0 0;
	font-family: var(--hb-font-sans);
	font-size: var(--fs-tekst);
	line-height: 1.6;
	color: var(--hb-braz-320);
}

.hb-newsletter__formularz {
	margin-top: 32px;
}

/* Formularz [hb_newsletter] — w sekcji nad stopką i w popupie. */
.hb-nl__pola {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	gap: 14px;
}

.hb-nl input[type="email"] {
	flex: 1 1 440px;
	min-width: 0;
	max-width: 440px;
	height: 60px;
	padding: 0 24px;
	border: 1px solid var(--hb-braz-870);
	border-radius: 999px;
	background-color: var(--hb-braz-995);
	font-family: var(--hb-font-sans);
	font-size: var(--fs-maly);
	text-align: left;
	color: var(--hb-ink);
}

.hb-nl input[type="email"]::placeholder {
	color: var(--hb-szary-pole);
}

.hb-nl button[type="submit"] {
	--hb-btn-kolor: var(--hb-braz-170);
	--hb-btn-wys: 60px;
	--hb-btn-tracking: 0.18em;
	flex: none;
	padding: 0 44px;
}

.hb-nl.is-wysylanie button[type="submit"] {
	opacity: 0.6;
	cursor: progress;
}

.hb-nl__zgoda {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin-top: 22px;
	font-family: var(--hb-font-sans);
	font-size: var(--fs-drobny);
	line-height: 1.5;
	color: var(--hb-braz-320);
	cursor: pointer;
}

.hb-nl__zgoda input {
	flex: none;
}

.hb-nl__zgoda a {
	text-decoration: underline;
	color: inherit;
}

.hb-nl__komunikat {
	margin: 16px 0 0;
	font-family: var(--hb-font-sans);
	font-size: var(--fs-drobny);
	color: var(--hb-braz-320);
}

.hb-nl__komunikat:empty {
	display: none;
}

.hb-nl__pulapka,
.hb-nl .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* Stopka 2026 — cztery kolumny na desktopie, akordeony na telefonie. */

.hb-stopka.brxe-section {
	padding: 76px 0 40px;
	background-color: var(--hb-braz-170);
}

.hb-stopka .hb-kontener {
	display: grid;
	align-items: start;
	grid-template-columns: minmax(0, 1.1fr) repeat(3, minmax(0, 1fr));
	gap: 56px;
}

.hb-stopka__marka {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 19px;
}

/* Logo jedzie w wersji ciemnej — na tle stopki rozjaśniamy je do bieli. */
.hb-stopka__logo img {
	display: block;
	width: 172px;
	height: auto;
	filter: brightness(0) invert(1);
}

.hb-stopka__haslo {
	margin: 0;
	font-family: var(--hb-font-serif);
	font-size: var(--fs-22-17);
	font-weight: 400;
	line-height: normal;
	color: var(--hb-braz-860);
}

.hb-stopka__spolecznosciowe {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 22px;
	margin-top: 11px;
}

.hb-stopka__spolecznosciowe .hb-stopka__link {
	color: var(--hb-braz-860);
}

.hb-stopka__kolumna {
	display: flex;
	flex-direction: column;
	gap: 22px;
}

.hb-stopka__tytul {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-family: var(--hb-font-sans);
	font-size: var(--fs-etykieta);
	font-weight: 700;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--hb-braz-975);
	list-style: none;
}

.hb-stopka__tytul::-webkit-details-marker {
	display: none;
}

/* Bez „display” w regule bazowej: na telefonie kolumna jest zwiniętym <details>
   i własny display odsłoniłby listę mimo zamknięcia. */
.hb-stopka__linki {
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
}

.hb-stopka__link {
	font-family: var(--hb-font-sans);
	font-size: var(--fs-maly);
	line-height: normal;
	color: var(--hb-braz-720);
	transition: color 0.2s ease;
}

.hb-stopka__link:hover,
.hb-stopka__link:focus-visible {
	color: var(--hb-braz-975);
}

.hb-stopka__dol {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	grid-column: 1 / -1;
	padding-top: 24px;
	border-top: 1px solid var(--hb-kreska-na-ciemnym-slaba);
}

.hb-stopka__prawa {
	margin: 0;
	font-family: var(--hb-font-sans);
	font-size: var(--fs-drobny);
	letter-spacing: 0.06em;
	line-height: normal;
	color: var(--hb-braz-620);
}

.hb-stopka__prawne {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 24px;
}

.hb-stopka__prawne .hb-stopka__link {
	font-size: var(--fs-drobny);
	color: var(--hb-braz-620);
}

/* Desktop: listy w kolumnach są zawsze widoczne, znacznik akordeonu nie jest potrzebny. */
@media (min-width: 992px) {
	/* Zwinięte <details> Chrome ukrywa przez ::details-content, nie przez samo dziecko. */
	.hb-stopka__kolumna::details-content {
		content-visibility: visible;
		block-size: auto;
	}

	.hb-stopka__linki {
		display: flex;
		content-visibility: visible;
	}

	.hb-stopka__tytul {
		cursor: default;
		pointer-events: none;
	}
}

@media (max-width: 991px) {
	.hb-newsletter.brxe-section {
		padding: 34px 0 30px;
	}

	.hb-newsletter__formularz {
		margin-top: 20px;
	}

	.hb-nl__pola {
		gap: 10px;
	}

	.hb-nl input[type="email"] {
		height: 50px;
		padding: 0 19px;
	}

	.hb-nl button[type="submit"] {
		--hb-btn-wys: 50px;
		--hb-btn-grubosc: 600;
		padding: 0 24px;
	}

	.hb-nl__zgoda {
		gap: 10px;
		margin-top: 18px;
		text-align: left;
	}

	.hb-stopka.brxe-section {
		padding: 32px 0 26px;
		text-align: center;
	}

	.hb-stopka .hb-kontener {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
	}

	.hb-stopka__marka {
		align-items: center;
		gap: 13px;
	}

	.hb-stopka__logo img {
		width: 143px;
	}

	/* Profile społecznościowe stoją na telefonie pod listami, nad odnośnikami prawnymi. */
	.hb-stopka__spolecznosciowe {
		order: 2;
		justify-content: center;
		gap: 18px;
		width: 100%;
		margin-top: 22px;
	}

	.hb-stopka__spolecznosciowe .hb-stopka__link {
		font-size: var(--fs-drobny);
	}

	.hb-stopka__marka {
		display: contents;
	}

	.hb-stopka__logo,
	.hb-stopka__haslo {
		align-self: center;
	}

	.hb-stopka__haslo {
		margin-top: 13px;
	}

	.hb-stopka__kolumna {
		order: 1;
		gap: 0;
		border-bottom: 1px solid var(--hb-kreska-na-ciemnym-slaba);
		text-align: left;
	}

	.hb-stopka__kolumna:first-of-type {
		margin-top: 24px;
	}

	.hb-stopka__tytul {
		padding: 16px 0;
		font-size: var(--fs-maly);
		font-weight: 400;
		letter-spacing: 0;
		text-transform: none;
		cursor: pointer;
	}

	.hb-stopka__tytul::after {
		content: "+";
		font-size: var(--fs-24-19);
		line-height: 1;
		color: var(--hb-braz-720);
	}

	.hb-stopka__kolumna[open] .hb-stopka__tytul::after {
		content: "–";
	}

	/* Bricks nadaje divom „display: flex", więc zamknięte <details> trzeba schować jawnie. */
	.hb-stopka__kolumna:not([open]) > .hb-stopka__linki {
		display: none;
	}

	.hb-stopka__kolumna[open] .hb-stopka__linki {
		display: flex;
		padding-bottom: 16px;
	}

	.hb-stopka__dol {
		flex-direction: column;
		gap: 10px;
		order: 3;
		padding-top: 16px;
		border-top: 0;
	}

	.hb-stopka__prawne {
		order: -1;
		gap: 16px;
	}

	.hb-stopka__prawa {
		font-size: var(--fs-drobny);
	}
}