/*
 * Stadgarna: the Hem room. Loaded only by the home template, so
 * removing the page removes the whole look.
 */

.stadgarna {
	--st-paper: #f7f1e3;
	--st-ink: #1e2a45;
	--st-ink-soft: color-mix(in srgb, var(--st-ink) 55%, var(--st-paper));
	--st-rule: color-mix(in srgb, var(--st-ink) 30%, transparent);
	--st-seal: #9e2b25;
	--st-laid: color-mix(in srgb, var(--st-ink) 5%, transparent);
	padding: 2em 1.5em 2.2em;
	border-radius: var(--radius-card);
	background:
		repeating-linear-gradient(0deg, var(--st-laid) 0 1px, transparent 1px 4px),
		var(--st-paper);
	color: var(--st-ink);
	font-family: var(--font-display);
	text-align: center;
}

@media (prefers-color-scheme: dark) {
	.stadgarna {
		--st-paper: #211e16;
		--st-ink: #e2d8bc;
		--st-seal: #c9584a;
	}
}

.stadgarna h1 {
	margin: 0;
	font-size: 2.2em;
	font-weight: 600;
	letter-spacing: 0.01em;
}

.stadgarna-motto {
	margin: 0.5em 0 0;
	color: var(--st-seal);
	font-size: 0.78em;
	font-weight: 600;
	letter-spacing: 0.28em;
	text-transform: uppercase;
}

.stadgarna-text {
	max-width: 31em;
	margin: 0 auto;
	text-align: left;
}

.stadgarna-section {
	display: flex;
	align-items: center;
	gap: 0.75em;
	max-width: 15em;
	margin: 1.8em auto 1.1em;
	color: var(--st-ink-soft);
	font-size: 0.85em;
	letter-spacing: 0.2em;
}

.stadgarna-section::before,
.stadgarna-section::after {
	content: "";
	flex: 1;
	border-top: 1px solid var(--st-rule);
}

.stadgarna-text p {
	margin: 0;
	line-height: 1.7;
}

/* The illuminated initial is the club's initials, not a lone letter —
   "MB" starts the charter, and ::first-letter would drop only the M. */
.stadgarna-initial {
	float: left;
	padding: 0.08em 0.14em 0 0;
	color: var(--st-seal);
	font-size: 2.7em;
	font-weight: 600;
	line-height: 0.8;
}

/* The closing stamp. In the text flow — never absolutely positioned —
   so it can't overlap the charter on a narrow screen. */
.stadgarna-seal {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 6em;
	height: 6em;
	margin: 2em 0.25em 0 auto;
	border: 2px solid var(--st-seal);
	border-radius: 50%;
	box-shadow: inset 0 0 0 3px var(--st-paper), inset 0 0 0 4px var(--st-seal);
	color: var(--st-seal);
	font-size: 0.8em;
	font-weight: 700;
	letter-spacing: 0.08em;
	line-height: 1.2;
	opacity: 0.6;
	text-align: center;
	transform: rotate(-12deg);
}

@media (max-width: 600px) {
	.stadgarna {
		padding: 1.4em 1em 1.6em;
	}
}