/**
 * Publiczna mapa „Gdzie byliśmy" (/warsztaty).
 * Piny jednokolorowe, jednakowej wielkości — bez kodowania liczby wizyt
 * ani świeżości (to zostaje w panelu).
 */
.section-mapa {
	/* Dolny odstep MNIEJSZY od gornego: pod mapa jest jeszcze lista miast,
	   ktora sama dokłada oddechu, wiec symetryczne 80px robilo za duza dziure
	   przed sekcja opinii. Gorny zostaje - oddziela mape od partnerow. */
	padding: 80px 0 48px;
	background: #fff;
}
.section-mapa__container {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 24px;
}
.section-mapa__header {
	text-align: center;
	margin-bottom: 32px;
}
.section-mapa__subheading {
	display: block;
	font-family: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: #000F99; /* $color__brand-blue */
	margin-bottom: 0.125rem;
}
@media screen and ( min-width: 768px ) {
	.section-mapa__subheading { font-size: 0.875rem; }
}
.section-mapa__heading {
	font-family: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	font-size: 1.75rem;
	font-weight: 700;
	line-height: 1.3;
	color: #3c434a; /* $color__text-main — jak partnerzy i opinie obok */
	margin: 0 0 12px;
}
@media screen and ( min-width: 768px ) {
	.section-mapa__heading { font-size: 2.25rem; }
}
@media screen and ( min-width: 1024px ) {
	.section-mapa__heading { font-size: 2.5rem; }
}
.section-mapa__lead {
	max-width: 620px;
	margin: 0 auto;
	color: #4b5163;
	font-size: 17px;
	line-height: 1.6;
}

.section-mapa__map {
	/* Polska jest WYZSZA niz szersza (~0.8:1). Przy szerokim, niskim kontenerze
	   `fitBounds` musi zmiescic wysokosc kraju i oddala tak, ze w poziomie
	   wchodzi pol Europy — dlatego mapa nie moze byc niskim paskiem.
	   480px to kompromis: kraj wciaz wypelnia kadr, a sekcja nie zjada
	   calego ekranu na laptopie. */
	height: 480px;
	border-radius: 16px;
	overflow: hidden;
	border: 1px solid #e3e5ea;
	background: #eef0f4; /* zanim kafelki dojada */
}
@media ( max-width: 782px ) {
	.section-mapa { padding: 56px 0 32px; }
	/* Na telefonie kontener jest juz waski (proporcje blizej pionu kraju),
	   wiec nie potrzebuje tej samej wysokosci co desktop. */
	.section-mapa__map { height: 380px; }
}

/* Czarno-biale kafle (jak w panelu) — jedynym kolorem na mapie sa piny. */
.scube-mapa-tiles-bw { filter: grayscale(1) contrast(1.05) brightness(1.02); }

/* „Reset widoku" — pojawia sie dopiero, gdy uzytkownik odejdzie od kadru
   poczatkowego (np. klikajac w klaster, ktory przybliza). */
.scube-mapa-reset { display: none; }
.scube-mapa-reset.is-widoczny { display: block; }
/* Specyficznosc celowo podniesiona: Leaflet ma `.leaflet-touch .leaflet-bar a`
   (0,3,0) z `width:26px`, ktore inaczej scisnie przycisk i utnie napis. */
.leaflet-touch .scube-mapa-reset a,
.scube-mapa-reset a {
	width: auto;
	min-width: 0;
	padding: 0 12px;
	font-size: 12px;
	font-weight: 600;
	line-height: 30px;
	height: 30px;
	color: #000F99;
	white-space: nowrap;
	text-decoration: none;
}
.scube-mapa-reset a:hover { background: #f2f4f8; }

/* Pin: jeden kolor, jeden rozmiar. */
.scube-mapa-pin-wrap { background: none; border: 0; }
.scube-mapa-pin {
	display: block;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: #000F99;
	border: 3px solid #fff;
	box-shadow: 0 1px 4px rgba( 0, 0, 0, .35 );
}
.scube-mapa-cluster-wrap { background: none; border: 0; }
.scube-mapa-cluster {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: #000F99;
	color: #fff;
	border: 3px solid #fff;
	box-shadow: 0 1px 5px rgba( 0, 0, 0, .35 );
	font-size: 13px;
	font-weight: 700;
	line-height: 1;
}

.section-mapa .leaflet-popup-content {
	margin: 10px 14px;
	font-size: 14px;
	line-height: 1.45;
	color: #111317;
}
.scube-mapa-popup-city { color: #6b7280; }

/* Lista miast pod mapa — dla czytnikow ekranu i gdy kafelki nie wstana. */
.section-mapa__cities {
	margin: 22px auto 0;
	max-width: 900px;
	text-align: center;
	color: #4b5163;
	font-size: 15px;
	line-height: 1.7;
}
.section-mapa__cities-label {
	font-weight: 700;
	color: #000F99;
}
