/* Passwortformular für geschützte Bereiche */
.bp-gate {
	--bp-ink: #16202B;
	--bp-paper: #FBFAF7;
	--bp-rule: #D8D4CA;
	--bp-malachit: #0E6E63;
	--bp-signal: #A8442A;

	max-width: 30rem;
	margin: 2rem auto;
	padding: 1.6rem 1.4rem 1.4rem;
	background: var(--bp-paper);
	border: 1px solid var(--bp-rule);
	border-radius: 4px;
	color: var(--bp-ink);
	font-size: 1rem;
	line-height: 1.5;
	box-sizing: border-box;
}
.bp-gate *, .bp-gate *::before, .bp-gate *::after { box-sizing: border-box; }

.bp-gate .bp-eyebrow {
	display: block;
	font-family: ui-monospace, Menlo, Consolas, monospace;
	font-size: .7rem; letter-spacing: .14em; text-transform: uppercase;
	color: #5B6873;
}
.bp-gate .bp-titel { margin: .3rem 0 .6rem; font-size: 1.5rem; line-height: 1.2; }
.bp-gate .bp-lead { margin: 0 0 1rem; color: #5B6873; }

.bp-gate .bp-fehler {
	margin: 0 0 1rem; padding: .6rem .8rem;
	border: 1px solid var(--bp-signal); border-radius: 3px;
	background: #FBEEEA; color: #7A2F19; font-size: .95rem;
}

.bp-gate .bp-form { display: flex; flex-wrap: wrap; gap: .6rem; align-items: flex-end; }
.bp-gate .bp-label {
	flex: 1 0 100%;
	font-family: ui-monospace, Menlo, Consolas, monospace;
	font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; color: #5B6873;
}
.bp-gate .bp-input {
	flex: 1 1 12rem; min-width: 0;
	padding: .7rem .8rem; font-size: 1.05rem;
	border: 1.5px solid var(--bp-ink); border-radius: 3px;
	background: #fff; color: var(--bp-ink);
	min-height: 46px;
}
.bp-gate .bp-input:focus { outline: 2px solid var(--bp-malachit); outline-offset: 1px; }
.bp-gate .bp-btn {
	flex: 0 0 auto;
	padding: .7rem 1.2rem; min-height: 46px;
	border: 1.5px solid var(--bp-ink); border-radius: 3px;
	background: var(--bp-ink); color: var(--bp-paper);
	font: inherit; font-weight: 600; cursor: pointer;
	white-space: normal;
}
.bp-gate .bp-btn:focus-visible { outline: 2px solid var(--bp-malachit); outline-offset: 2px; }
.bp-gate .bp-hint { margin: 1rem 0 0; font-size: .84rem; color: #5B6873; }

@media (max-width: 30rem) {
	.bp-gate .bp-input, .bp-gate .bp-btn { flex: 1 0 100%; }
}