.olivo-mapa-regiones {
	--omr-ink: #004653;
	--omr-paper: #e8e8e8;
	--omr-card: #fde4e4;
	--omr-green: #7be4ba;
	--omr-red: #f90050;
	--omr-white: #ececec;
	box-sizing: border-box;
	background: var(--omr-paper);
	color: var(--omr-ink);
	font-family: Inter, system-ui, sans-serif;
	padding: 48px 5% 64px;
	width: 100%;
}

.olivo-mapa-regiones *,
.olivo-mapa-regiones *::before,
.olivo-mapa-regiones *::after {
	box-sizing: inherit;
}

.olivo-mapa-regiones a {
	color: var(--omr-ink);
}

.omr-inner {
	max-width: 1600px;
	margin: 0 auto;
	position: relative;
}

.omr-titulo {
	padding-bottom: 480px;
	position: relative;
	z-index: 1;
}

.omr-titulo h2 {
	font-size: clamp(18px, 1.57vw, 28px);
	line-height: 1.25;
	text-transform: none;
	letter-spacing: normal;
	text-align: center;
	font-weight: 400;
	margin: 0 0 8px;
	color: var(--omr-ink);
}

.omr-titulo h2 strong {
	font-family: Inter, sans-serif;
	font-weight: 300;
	display: inline-block;
	position: relative;
	padding: 4px 8px 6px;
	z-index: 1;
}

.omr-titulo h2 strong::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: var(--omr-green);
	z-index: -1;
	transform: rotate(-2deg);
}

.omr-desplegables {
	display: none;
}

.omr-mapa {
	position: relative;
}

.omr-map-base {
	display: block;
	width: 100%;
	height: auto;
}

.omr-map {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: auto;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.25s ease, visibility 0.25s ease;
	pointer-events: none;
}

.omr-map.activo,
.omr-map.hover {
	opacity: 1;
	visibility: visible;
}

.omr-simbologia {
	margin-top: 30px;
	font-size: 15px;
}

.omr-simbologia-tit {
	font-weight: 500;
	display: inline-block;
	margin-right: 15px;
}

.omr-simbologia a {
	color: var(--omr-ink);
	font-weight: 600;
	border: 1px solid transparent;
	display: inline-block;
	padding: 12px 20px;
	margin: 0 8px 8px 0;
	text-decoration: none;
	border-radius: 2px;
}

.omr-simbologia a span {
	font-weight: 600;
	text-decoration: underline;
}

.omr-simbologia a:hover,
.omr-simbologia a.activo {
	border-color: var(--omr-ink);
}

.omr-simbologia-icon {
	width: 16px;
	height: auto;
	margin-right: 5px;
	vertical-align: middle;
}

.omr-leyenda {
	position: absolute;
	left: 50%;
	top: -80%;
	width: 40%;
	transform: translateX(-50%);
	text-align: center;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.25s ease, visibility 0.25s ease;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	z-index: 4;
}

.omr-leyenda.activo {
	opacity: 1;
	visibility: visible;
}

.omr-leyenda-num {
	font-size: clamp(48px, 4.35vw, 80px);
	line-height: 1;
	font-weight: 400;
}

.omr-leyenda-txt p {
	font-size: clamp(16px, 1.57vw, 26px);
	line-height: 1.25;
	font-weight: 500;
	margin: 0;
	text-align: left;
}

.omr-leyenda-txt p strong {
	font-weight: 500;
	display: inline-block;
	position: relative;
	z-index: 1;
	padding: 0 4px;
}

.omr-leyenda-txt p strong::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: var(--omr-green);
	z-index: -1;
	transform: rotate(-2deg);
}

.omr-leyenda.ley2 p strong {
	color: var(--omr-white);
}

.omr-leyenda.ley2 p strong::after {
	background: var(--omr-red);
}

.omr-leyenda.ley3 p strong {
	color: var(--omr-white);
}

.omr-leyenda.ley3 p strong::after {
	background: var(--omr-ink);
}

.omr-modulo {
	background: var(--omr-card);
	max-width: 480px;
	width: 42%;
	position: absolute;
	bottom: 135%;
	left: 0;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.25s ease, visibility 0.25s ease;
	z-index: 3;
}

.omr-modulo.activo {
	opacity: 1;
	visibility: visible;
}

.omr-modulo.reg4 { left: 15%; }
.omr-modulo.reg5 { left: 24%; }
.omr-modulo.reg6 { left: 29%; }
.omr-modulo.reg7 { left: 31.5%; }
.omr-modulo.reg8 { left: 33.5%; }
.omr-modulo.reg9 { left: 35.5%; }
.omr-modulo.reg10,
.omr-modulo.reg11,
.omr-modulo.reg12 { left: 42.5%; }
.omr-modulo.reg13,
.omr-modulo.reg14 { left: 42%; }
.omr-modulo.reg15,
.omr-modulo.reg16 { left: 52%; }

.omr-modulo-inn {
	padding: 30px 15px;
	position: relative;
}

.omr-modulo-inn::after {
	content: "";
	width: 1px;
	height: 130px;
	background: var(--omr-ink);
	position: absolute;
	left: 5%;
	bottom: -130px;
}

.omr-modulo.reg2 .omr-modulo-inn::after { left: 15%; }
.omr-modulo.reg3 .omr-modulo-inn::after { left: 33%; }
.omr-modulo.reg4 .omr-modulo-inn::after { left: 20%; }
.omr-modulo.reg5 .omr-modulo-inn::after,
.omr-modulo.reg6 .omr-modulo-inn::after,
.omr-modulo.reg7 .omr-modulo-inn::after,
.omr-modulo.reg8 .omr-modulo-inn::after {
	left: 20%;
	height: 160px;
	bottom: -160px;
}
.omr-modulo.reg9 .omr-modulo-inn::after {
	left: 26%;
	height: 160px;
	bottom: -160px;
}
.omr-modulo.reg10 .omr-modulo-inn::after {
	left: 16%;
	height: 180px;
	bottom: -180px;
}
.omr-modulo.reg11 .omr-modulo-inn::after {
	left: 22%;
	height: 180px;
	bottom: -180px;
}
.omr-modulo.reg12 .omr-modulo-inn::after {
	left: 26%;
	height: 180px;
	bottom: -180px;
}
.omr-modulo.reg13 .omr-modulo-inn::after {
	left: 34%;
	height: 200px;
	bottom: -200px;
}
.omr-modulo.reg14 .omr-modulo-inn::after {
	left: 45%;
	height: 200px;
	bottom: -200px;
}
.omr-modulo.reg15 .omr-modulo-inn::after {
	left: 49%;
	height: 180px;
	bottom: -180px;
}
.omr-modulo.reg16 .omr-modulo-inn::after {
	left: 78%;
	height: 200px;
	bottom: -200px;
}

.omr-modulo-grid {
	display: flex;
	gap: 8px;
}

.omr-modulo-meta,
.omr-conscroll,
.omr-modulo-list {
	flex: 1 1 50%;
	min-width: 0;
}

.omr-conscroll {
	overflow-y: auto;
	overflow-x: hidden;
	height: 260px;
	padding-right: 15px;
	scrollbar-width: thin;
	scrollbar-color: var(--omr-red) var(--omr-card);
}

.omr-conscroll::-webkit-scrollbar {
	width: 7px;
}

.omr-conscroll::-webkit-scrollbar-thumb {
	background-color: var(--omr-red);
}

.omr-modulo h3 {
	font-size: clamp(16px, 1.57vw, 26px);
	line-height: 1.25;
	text-align: right;
	font-weight: 500;
	margin: 0 0 25px;
	color: var(--omr-ink);
}

.omr-num {
	font-size: clamp(48px, 4.35vw, 80px);
	line-height: 1;
	text-align: right;
	display: block;
}

.omr-cuales {
	margin-top: 15px;
}

.omr-cuales p {
	font-size: clamp(12px, 1.01vw, 16px);
	font-weight: 500;
	text-align: right;
	margin: 0 0 6px;
}

.omr-cuales span {
	font-weight: 500;
	display: inline-block;
	position: relative;
	z-index: 2;
	text-align: center;
	width: 32px;
	height: 32px;
	padding-top: 6px;
	margin-left: 5px;
	color: var(--omr-white);
}

.omr-cuales .educacion span {
	color: var(--omr-ink);
}

.omr-cuales .cultura span {
	width: 41px;
	padding-top: 9px;
}

.omr-cuales span::before {
	content: "";
	background: url("../img/simb1.svg") center / 100% 100% no-repeat;
	height: 32px;
	width: 32px;
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	z-index: -1;
}

.omr-cuales .cultura span::before {
	background-image: url("../img/simb2.svg");
	width: 40px;
}

.omr-cuales .espacio span::before {
	background-image: url("../img/simb3.svg");
}

.omr-modulo ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.omr-modulo ul li {
	padding: 0 0 15px;
	list-style: none;
}

.omr-modulo ul a {
	color: var(--omr-ink);
	font-weight: 400;
	text-decoration: none;
}

.omr-modulo ul a strong {
	font-weight: 400;
	text-decoration: underline;
}

.omr-pin {
	width: 4%;
	height: 22%;
	position: absolute;
	cursor: pointer;
	display: block;
	z-index: 2;
	left: 0;
	top: 0;
	opacity: 0;
}

.omr-mapa .pin1 { left: 0; top: 24%; }
.omr-mapa .pin2 { left: 4.5%; top: 22%; height: 25%; width: 5%; }
.omr-mapa .pin3 { left: 9.5%; top: 4%; width: 11%; height: 45%; }
.omr-mapa .pin4 { left: 21%; top: 20%; width: 8%; height: 38%; }
.omr-mapa .pin5 { left: 29%; top: 40%; width: 8%; }
.omr-mapa .pin6 { left: 37%; top: 37%; width: 2%; }
.omr-mapa .pin7 { left: 39%; top: 37%; width: 3%; }
.omr-mapa .pin8 { left: 41%; top: 41%; width: 3%; }
.omr-mapa .pin9 { left: 43.5%; top: 41%; width: 4%; height: 30%; }
.omr-mapa .pin10 { left: 47%; top: 51%; width: 3%; }
.omr-mapa .pin11 { left: 49.5%; top: 51%; width: 3%; height: 31%; }
.omr-mapa .pin12 { left: 51.5%; top: 49%; width: 4%; height: 33%; }
.omr-mapa .pin13 { left: 55.5%; top: 56%; width: 3%; }
.omr-mapa .pin14 { left: 58%; top: 49%; width: 8.5%; height: 38%; }
.omr-mapa .pin15 { left: 66.5%; top: 49%; width: 15%; height: 51%; }
.omr-mapa .pin16 { left: 81.5%; top: 8%; width: 17%; height: 90%; }

@media screen and (max-width: 992px) {
	.olivo-mapa-regiones {
		padding: 32px 16px 48px;
	}

	.omr-titulo {
		padding-bottom: 0;
		margin-bottom: 24px;
	}

	.omr-titulo h2 {
		font-size: 20px;
		line-height: 1.4;
	}

	.omr-mapa,
	.omr-simbologia {
		display: none;
	}

	.omr-desplegables {
		display: block;
	}

	.omr-desplegador {
		width: 100%;
		background: #fff;
		border: 0;
		border-radius: 10px;
		text-align: center;
		margin-bottom: 5px;
		cursor: pointer;
		padding: 12px 40px 12px 16px;
		color: var(--omr-ink);
		font-family: inherit;
		font-size: 15px;
		line-height: 22px;
		font-weight: 500;
		position: relative;
	}

	.omr-desplegador.is-open {
		background: var(--omr-card);
	}

	.omr-desplegador-icon {
		width: 15px;
		position: absolute;
		top: 50%;
		right: 18px;
		transform: translateY(-50%);
		opacity: 0;
		transition: opacity 0.25s ease;
	}

	.omr-desplegador.is-open .omr-desplegador-icon {
		opacity: 1;
	}

	.omr-desplegable {
		margin-bottom: 8px;
	}

	.omr-modulo-mobile {
		background: var(--omr-card);
		border-radius: 0 0 10px 10px;
	}

	.omr-modulo-mobile .omr-modulo-inn::after {
		display: none;
	}

	.omr-modulo-mobile .omr-modulo-grid {
		display: block;
		text-align: center;
	}

	.omr-modulo-mobile h3 {
		text-align: center;
		font-size: 15px;
		margin-bottom: 12px;
	}

	.omr-modulo-mobile .omr-num {
		text-align: center;
		font-size: 80px;
		line-height: 80px;
		margin-bottom: 30px;
	}

	.omr-modulo-mobile .omr-cuales {
		margin-bottom: 30px;
	}

	.omr-modulo-mobile .omr-cuales p {
		text-align: center;
		font-size: 12px;
	}

	.omr-modulo-mobile .omr-modulo-list {
		text-align: left;
		padding: 0 12px 12px;
	}
}
