@charset "UTF-8";
/* =========================================================
Salzgitter Geo-Karte – Stil analog Hildesheim
========================================================= */
:root {
	color-scheme: light;
	--blue: #87cefa;
	--deep: #244c66;
	--line: #567e98;
	--gold: #a08f43;
	--cream: #fff8dc;
	--ink: #243746;
	--muted: #667782;
	--border: #d9e3e9;
	--white: #fff;
}
* {
	box-sizing: border-box;
}
.abb-standalone {
	width: 100%;
	margin: 0 auto;
}
.abb-heading {
	margin: 0 0 18px;
}
.abb-eyebrow {
	margin: 0 0 5px;
	color: blue;
	font-size: .74rem;
	font-weight: 800;
	letter-spacing: .13em;
	text-transform: uppercase;
}
h1 {
	margin: 0;
	color: #183b55;
	font-size: clamp(1.45rem,3vw,2.15rem);
	line-height: 1.15;
}
.abb-lead {
max-width: 1300px;
margin: 9px 0 0;
color: #52636d;
font-size: .98rem;
text-align: left;
}
.abb-layout {
	display: grid;
	grid-template-columns: minmax(0,1.45fr) minmax(285px,.8fr);
	gap: 18px;
	align-items: stretch;
}
.abb-card {
	min-width: 0;
	overflow: hidden;
	border: 1px solid var(--border);
	border-radius: 18px;
	background: var(--white);
	box-shadow: 0 12px 30px rgb(24 59 85 / 9%);
}
.abb-map-card {
	padding: clamp(12px,2vw,22px);
}
.abb-map-card-head {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 10px;
	margin-bottom: 8px;
}
.abb-map-card-head h2, .abb-info-card h2 {
	margin: 0;
	color: #183b55;
	font-size: 1.1rem;
}
.abb-map-tag {
	flex: none;
	padding: 4px 9px;
	border-radius: 999px;
	background: #eff8fc;
	color: #456d85;
	font-size: .72rem;
	font-weight: 700;
}
.abb-map-help {
	margin: 0 0 4px;
	color: var(--muted);
	font-size: .82rem;
}
.abb-map-scroll {
	overflow: hidden;
	border-radius: 12px;
	background: linear-gradient(145deg,#fbfdfe,#f1f7fa);
}
#salzgitter-region-svg {
	display: block;
	width: 100%;
	height: auto;
	max-height: 760px;
}
.map-area {
	stroke: none;
	cursor: pointer;
	transition: fill .16s ease,filter .16s ease;
}
.map-area:hover, .map-area:focus, .map-area.is-active {
	fill: #f0dfa1!important;
	filter: drop-shadow(0 0 2px rgb(160 143 67 / 35%));
	outline: none;
}
.map-boundary-mesh {
	fill: none;
	stroke: #567e98;
	stroke-width: 1.5px;
	stroke-linecap: round;
	stroke-linejoin: round;
	vector-effect: non-scaling-stroke;
	pointer-events: none;
}
.map-label {
	pointer-events: none;
	fill: #23465e;
	font-family: Arial,Helvetica,sans-serif;
	font-weight: 700;
	paint-order: stroke;
	stroke: #fff;
	stroke-width: 650;
	stroke-linejoin: round;
	opacity: .94;
}
.hq-halo {
	fill: rgb(198 40 40 / 16%);
	pointer-events: none;
}
.hq-dot {
	fill: #c62828;
	stroke: #fff;
	stroke-width: 3.5;
	vector-effect: non-scaling-stroke;
	cursor: help;
}
.hq-label {
	display: none;
	fill: blue;
	font: 700 800px Arial,Helvetica,sans-serif;
	pointer-events: none;
}
.hq-dot:hover~.hq-label,.hq-dot:focus~.hq-label{display:block}
.abb-sidebar {
	display: flex;
	min-height: 100%;
	flex-direction: column;
	gap: 14px;
}
.abb-info-card {
	position: relative;
	min-height: 230px;
	padding: 20px;
}
.abb-info-card[hidden] {
	display: none;
}
.abb-info-kicker {
	margin: 0 0 5px;
	color: blue;
	font-size: .7rem;
	font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
}
.abb-info-card h2 {
	padding-right: 34px;
	font-size: 1.25rem;
}
.abb-info-body {
	margin: 8px 0 0;
	color: #4d5d67;
	font-size: .9rem;
	overflow-wrap: anywhere;
}
.abb-geology {
	margin-top: 16px;
	padding-top: 13px;
	border-top: 1px solid #e6ecef;
}
.abb-geology h3 {
	margin: 0 0 5px;
	color: var(--deep);
	font-size: .9rem;
}
.abb-geology p {
	margin: 0;
	color: red;
	font-size: .86rem;
}
.abb-geology a {
	display: inline-block;
	margin-top: 8px;
	color: #174b70;
	font-size: .82rem;
	font-weight: 700;
}
.abb-close {
	position: absolute;
	top: 11px;
	right: 12px;
	display: grid;
	width: 34px;
	height: 34px;
	place-items: center;
	border: 0;
	border-radius: 50%;
	background: #edf4f7;
	color: var(--deep);
	font-size: 1.55rem;
	line-height: 1;
	cursor: pointer;
}
.abb-close:hover, .abb-close:focus-visible {
	background: #dcecf4;
	outline: 2px solid var(--blue);
}
.abb-list-card {
	padding: 16px 18px;
}
.abb-list-card h2 {
	margin: 0 0 10px;
	color: #183b55;
	font-size: .96rem;
}
.town-list {
	display: grid;
	grid-template-columns: 1fr;
	gap: 6px;
	max-height: 355px;
	margin: 0;
	padding: 0;
	overflow-y: auto;
	list-style: none;
}
.town-button {
	width: 100%;
	min-height: 39px;
	padding: 7px 10px;
	border: 1px solid var(--border);
	border-radius: 8px;
	background: #fff;
	color: var(--deep);
	text-align: left;
	font: inherit;
	font-size: .85rem;
	cursor: pointer;
}
.town-button:hover, .town-button[aria-pressed=true] {
	border-color: #b7dcef;
	background: #eef8fd;
}
.town-button:focus-visible {
	border-color: var(--blue);
	outline: 2px solid rgb(135 206 250 / 38%);
	outline-offset: 2px;
}
.abb-note {
	margin: 10px 0 0;
	color: var(--muted);
	font-size: .75rem;
}
.abb-source {
	margin: 12px 2px 0;
	color: #5e6f79;
	font-size: .7rem;
	line-height: 1.45;
}
.abb-source a {
	color: #385f77;
}
.abb-source p {
	margin: 3px 0;
}
.abb-map-status {
	margin: 7px 0 0;
	color: var(--muted);
	font-size: .72rem;
}
.mobile-list-card {
	display: none;
}
/* Regionale Erweiterung: nur Farben, Legende und Gruppenüberschriften. */
.region-bs {
	fill: #c6e2f0;
	stroke: #c6e2f0;
	stroke-width: 3px;
	stroke-linejoin: round;
}
.region-wf {
	fill: #f4c58b;
	stroke: #f4c58b;
	stroke-width: 3px;
	stroke-linejoin: round;
}
.region-he {
	fill: #f1dc84;
	stroke: #f1dc84;
	stroke-width: 3px;
	stroke-linejoin: round;
}
.region-pe {
	fill: #cfe5b6;
	stroke: #cfe5b6;
	stroke-width: 3px;
	stroke-linejoin: round;
}
.region-gf {
	fill: #d4d0ec;
	stroke: #d4d0ec;
	stroke-width: 3px;
	stroke-linejoin: round;
}
.region-gs {
	fill: #e8c5b9;
	stroke: #e8c5b9;
	stroke-width: 3px;
	stroke-linejoin: round;
}
.region-wob {
	fill: #bfe1d6;
	stroke: #bfe1d6;
	stroke-width: 3px;
	stroke-linejoin: round;
}
.region-sz {
	fill: #efb7a9;
	stroke: #efb7a9;
	stroke-width: 3px;
	stroke-linejoin: round;
}
.region-key {
	display: flex;
	flex-wrap: wrap;
	gap: 5px 10px;
	margin: 7px 0 10px;
	padding: 8px 10px;
	border: 1px solid #e5edf1;
	border-radius: 10px;
	background: #fff;
	color: #52636d;
	font-size: .7rem;
	line-height: 1.25;
}
.region-key-item {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	white-space: nowrap;
}
.region-key-item i {
	display: inline-block;
	width: 10px;
	height: 10px;
	border: 1px solid rgb(36 55 70 / 20%);
	border-radius: 2px;
}
.region-group-title {
	position: sticky;
	top: 0;
	z-index: 1;
	margin-top: 4px;
	padding: 7px 8px;
	border-radius: 6px;
	background: #edf5f9;
	color: #183b55;
	font-size: .72rem;
	font-weight: 800;
	letter-spacing: .03em;
}
@media(max-width:760px){
body {
	padding: 12px;
}
.abb-layout {
	grid-template-columns: 1fr;
	gap: 12px;
}
.desktop-list-card {
	display: none;
}
.mobile-list-card {
	display: block;
}
.abb-map-card {
	display: none;
}
.abb-sidebar {
	gap: 10px;
}
.town-list {
	grid-template-columns: repeat(2,minmax(0,1fr));
	max-height: 34svh;
}
.region-group-title {
	grid-column: 1/-1;
	position: static;
}
.abb-info-card {
	min-height: 0;
	max-height: 32svh;
	padding: 16px;
	overflow-y: auto;
	overscroll-behavior: contain;
}
.abb-info-card h2 {
	font-size: 1.08rem;
}
.abb-source {
	margin: 12px 2px 0;
	color: #5e6f79;
	font-size: .7rem;
	line-height: 1.45;
	text-align: left;
}
}
@media(prefers-reduced-motion:reduce){
*, *::before, *::after {
	transition-duration: .01ms!important;
}
}

/* Salzgitter Layout-Erweiterung */


body{background:#f5f9fc;color:#243c4c}#home{padding-top:100px}.hi-wrap{max-width:1120px;margin:auto;padding:0 24px}.hi-section{padding:60px 0}.hi-eye{font-size:.78rem;letter-spacing:.12em;font-weight:750;text-transform:uppercase;color:#236b92}.hi-hero{padding:48px 0;background:linear-gradient(120deg,#e7f3fc,#fff)}.hi-split{display:grid;grid-template-columns:1.5fr 1fr;gap:35px;align-items:center}.hi-hero h1{font-size:clamp(2rem,4vw,3.4rem);line-height:1.12;text-transform:none;margin:15px 0 22px;color:#153e56}.hi-hero img{max-width:380px;width:100%;margin:auto;display:block}.hi-hero p,.hi-section p,.hi-section li{line-height:1.8}.hi-actions{display:flex;gap:12px;flex-wrap:wrap;margin:25px 0}.hi-btn{display:inline-flex;justify-content:center;padding:14px 20px;background:#185a80;color:#fff!important;font-weight:700;border:1px solid #185a80;border-radius:9px;text-decoration:none}.hi-btn.secondary{background:white;color:#185a80!important}.hi-btn:hover{background:#123f5a;color:white!important}.hi-btn:focus-visible{outline:3px solid #d5a72e;outline-offset:4px}.hi-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.hi-card{background:white;border:1px solid #d7e5ee;border-radius:15px;padding:27px}.hi-section h2{font-size:clamp(1.6rem,3vw,2.1rem);text-transform:none;color:#153e56;margin-bottom:22px}.hi-card h3{font-size:1.2rem;text-transform:none;color:#153e56;margin:15px 0}.hi-trust{display:flex;gap:20px;flex-wrap:wrap;border-top:1px solid #d3e2ed;padding-top:20px;font-size:.85rem}.hi-intro{max-width:760px;margin-bottom:30px}.hi-dark{background:#143c54;color:white}.hi-dark h2{color:white}.hi-dark .hi-card{color:#243c4c}.hi-contact{padding:35px;border-radius:18px;background:#e3f0f8}.hi-map-context{background:#eaf4fa;border-left:4px solid #185a80;border-radius:8px;padding:22px;margin-bottom:25px;line-height:1.8}.abb-standalone{padding-top:50px;padding-bottom:35px;scroll-margin-top:110px}.hi-section[id]{scroll-margin-top:110px}.fixed-footer{position:static!important}.side-rail{display:none!important}.navbar-brand{font-size:1.2rem!important}.hi-faq details{padding:20px 0;border-bottom:1px solid #d5e2ea}.hi-faq summary{cursor:pointer;font-weight:700}.hi-faq p{margin-top:15px}a{overflow-wrap:anywhere}
@media(max-width:767px){#home{padding-top:77px}.hi-split,.hi-grid{grid-template-columns:1fr}.hi-hero{padding:30px 0}.hi-hero img{max-width:220px}.hi-hero .hi-split>div:last-child{order:-1}.hi-hero h1{font-size:2rem}.hi-section{padding:38px 0}.hi-btn{width:100%}.hi-wrap{padding:0 20px}.hi-card,.hi-contact{padding:23px}}

@media(max-width:760px){.abb-map-card{display:block!important}.abb-map-tag{white-space:normal}.abb-map-card-head{flex-wrap:wrap}}
/* Einheitliche Inhaltsflucht wie der Karten-Container */
.hi-wrap{width:100%;max-width:none;margin-left:auto!important;margin-right:auto!important;padding-left:12px;padding-right:12px}
@media(min-width:576px){.hi-wrap{max-width:540px}}
@media(min-width:768px){.hi-wrap{max-width:720px}}
@media(min-width:992px){.hi-wrap{max-width:960px}}
@media(min-width:1200px){.hi-wrap{max-width:1140px}}
@media(min-width:1400px){.hi-wrap{max-width:1320px}}

/* Hildesheim-Bild: natürliches Seitenverhältnis auch mobil */
.hi-hero img{height:auto;object-fit:contain}

/* Mobil: Beratung erst nach Ortsauswahl und Quellen */
.hi-project-mobile{display:none}
@media(max-width:760px){.hi-project-desktop{display:none}.hi-project-mobile{display:block;margin-top:20px}}

/* Regionaler Akzent Salzgitter */
.hi-hero{background:linear-gradient(120deg,#e8f3fc,#f7f5ee)}.hi-card{border-top:3px solid #c5b789}.hi-contact{background:#e5eff5}.region-key{flex-wrap:wrap}

/* Mobile Seitenfläche und Footer ohne seitlichen Außenabstand */
@media(max-width:760px){body{padding-left:0!important;padding-right:0!important}.fixed-footer,.contact-band{width:100%;max-width:none;margin-left:0;margin-right:0}}

/* Salzgitter city overview */
.sz-layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(290px,1fr);gap:24px;align-items:start}.sz-hero-map{display:block;width:100%;max-width:370px;margin:auto;filter:drop-shadow(0 14px 18px #244c6618)}#salzgitter-region-svg{display:block;width:100%;height:auto;max-height:470px}.sz-map-label{font:9px sans-serif;fill:#244c66;font-weight:700}.sz-map-caption{color:#667782;font-size:.9rem;line-height:1.6}.sz-place-info{padding:26px;position:relative}.sz-close{position:absolute;right:12px;top:8px;background:none;border:0;font-size:25px;color:#244c66}.sz-project{margin-top:22px}.sz-districts{padding:28px;margin-top:28px}.sz-town-list{list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.sz-town-list .town-button{width:100%;height:100%;text-align:left}.sz-skip{position:fixed;top:-100px;left:15px;z-index:9999;background:white;padding:14px}.sz-skip:focus{top:10px}.map-area{fill:#c6e2f0;stroke:#244c66;stroke-width:1}.map-area:focus-visible{outline:2px solid #a08f43}.abb-source{line-height:1.7}.sz-districts h2{color:#153e56}@media(max-width:767px){.sz-layout{grid-template-columns:1fr}.sz-town-list{grid-template-columns:repeat(2,minmax(0,1fr))}.sz-hero-map{max-width:210px}.sz-districts{padding:20px}.sz-place-info{padding:22px}.sz-town-list .town-button{min-height:48px}}

/* Individuelle Stadtteilflächen und lesbare Ortsnamen */
.sz-layout{grid-template-columns:minmax(0,1.8fr) minmax(270px,.8fr)}
#salzgitter-region-svg{max-height:none;min-width:650px;touch-action:pan-x pan-y}.abb-map-card{overflow-x:auto}.sz-district{stroke:#6e8290;stroke-width:1.6;transition:filter .15s,stroke .15s;cursor:pointer}.sz-district:hover,.sz-district:focus,.sz-district.is-active{filter:brightness(.91);stroke:#153e56;stroke-width:3.5}.sz-district-label{font:600 18px system-ui,sans-serif;fill:#183b55;paint-order:stroke;stroke:white;stroke-width:5px;stroke-linejoin:round}.sz-label-leader{stroke:#526d7d;stroke-width:1.2}.sz-place-dot{fill:#244c66}.sz-map-caption{min-width:0}@media(max-width:991px){.sz-layout{grid-template-columns:1fr}#salzgitter-region-svg{min-width:720px}.sz-map-caption:after{content:" Auf kleinen Bildschirmen lässt sich die Karte seitlich verschieben."}}

.gs-map-viewport{overflow:auto;max-height:900px;background:#fff;border-radius:10px}.abb-map-card{overflow:hidden}#salzgitter-region-svg{display:block;width:100%;min-width:820px;max-height:none;touch-action:pan-x pan-y}.gs-municipality{stroke:#6c8491;stroke-width:1.5;cursor:pointer}.gs-municipality:hover,.gs-municipality:focus,.gs-municipality.is-active{filter:brightness(.94);stroke:#153e56;stroke-width:3}.map-place{cursor:pointer;outline:none}.map-place circle{fill:#244c66;stroke:white;stroke-width:1.2}.gs-town-label{font:500 14px system-ui,sans-serif;fill:#183b55;paint-order:stroke;stroke:white;stroke-width:5px;stroke-linejoin:round}.gs-town-label.gs-major{font-size:19px;font-weight:750}.map-place:hover text,.map-place:focus text,.map-place.is-active text{fill:#005a8b;stroke:#fff8dc;stroke-width:7px}.map-place.is-active circle{r:7;fill:#005a8b}.gs-zoom{display:flex;align-items:center;gap:9px;margin:18px 0;flex-wrap:wrap}.gs-zoom button{background:#fff;color:#244c66;border:1px solid #8eaabb;border-radius:7px;padding:9px 13px;font-weight:700;min-height:44px}.gs-zoom button:focus-visible{outline:3px solid #a08f43;outline-offset:2px}
.sz-layout{grid-template-columns:minmax(0,1.8fr) minmax(270px,.8fr)}#salzgitter-region-svg{height:auto;max-height:none;min-width:100%}#salzgitter-region-svg text,#salzgitter-region-svg .sz-label-leader{display:none}#salzgitter-region-svg.show-details text,#salzgitter-region-svg.show-details .sz-label-leader{display:block}@media(max-width:991px){.sz-layout{grid-template-columns:1fr}#salzgitter-region-svg{min-width:720px}}

/* Ortsauswahl rechts neben der Karte wie auf den übrigen Regionalseiten */
.sz-layout > aside{min-width:0}
.sz-layout > aside .sz-districts{margin-top:22px;padding:20px}
.sz-layout > aside .sz-place-groups{max-height:355px;overflow-y:auto;overscroll-behavior:contain;padding-right:6px}
.sz-layout > aside .sz-town-list{grid-template-columns:1fr;gap:6px}
.sz-layout > aside .sz-place-group{margin-top:16px;padding-top:14px}
.sz-layout > aside .sz-place-group:first-child{margin-top:0;padding-top:0;border-top:0}
@media(max-width:767px){
 .sz-layout > aside .sz-town-list{grid-template-columns:repeat(2,minmax(0,1fr))}
 .sz-layout > aside .sz-place-groups{max-height:34svh}
}
