@font-face {font-family:'nubelus';src: local('nubelus'), url('/complementos/font/nubelus.ttf');}


html {
	margin: 0;
	padding: 0;
	scroll-behavior: smooth;
	font-size:16px
}
body {
	margin: 0;
	padding: 0;
	min-height: 100vh;
	font-family: Arial, sans-serif;
	background: #ffffff;
	color: #555;
	display: flex;
	flex-direction: column;
	overflow-x: hidden; 
}

header {
	position: fixed;
	display:flex;
	top: 0;
	left: 0;
	width: 100%;
	height: 70px; 
	background: #2196F3;
	color: #fff;
	padding: 5px 15px;
	text-align: center;
	z-index: 1020; 
	box-shadow: 0 2px 5px rgba(0,0,0,0.15);
	box-sizing: border-box;
	flex-wrap: nowrap;
	justify-content: center;
	gap:100px;
    align-items: center;
}
header img { max-width: 240px; }
header div { font-size: 22px; letter-spacing: -0.75px; }

main {
	flex: 1;
	display: flex;
	justify-content: center;
	width: 100%;
	margin-top: 70px;
	padding: 20px 15px;
	position: relative;
	box-sizing: border-box;
}
main:has(aside.indice) { padding-left: 270px;}
@media (max-width: 1024px) { main:has(aside.indice) { padding-left: 15px !important; } }

article {
	max-width: 1000px;
	width: 100%;
	margin: 0 auto; 
}

footer {
	flex-shrink: 0;
	width: 100%;
	background: #000;
	color: #fff;
	min-height: 30px;
	padding: 8px 15px;
	text-align: center;
	box-sizing: border-box;
}

.indice { 
	position: fixed; 
	top: 70px;
	color:#777;
	left: 0px; 
	padding: 25px; 
	width: 250px;
	height: calc(100vh - 70px); 
	background: #2196F315; 
	z-index: 1000;
	overflow-y: auto;
	transition: transform 0.3s ease-in-out;
	box-sizing: border-box;
}
.indice * { font-size: 14px; letter-spacing: -0.5px; }

.indice .titulo-3 {
	font-size: 1em;
	font-weight: bold;
	margin-top: 25px;
	margin-bottom: 5px;
}
.indice ul {margin:0px;padding:0px;}
.indice li {margin-left:15px;}
.indice li::marker{opacity:0.5;}

.indice a {}

.indice ol.breadcrumb-lista { list-style: none; padding-left: 0; margin-bottom: 15px;}
.indice ol.breadcrumb-lista li { margin-left:0px;}
.indice ol.breadcrumb-lista li:nth-child(1) {padding-left: 0px;}
.indice ol.breadcrumb-lista li:nth-child(2) {padding-left: 12px;}
.indice ol.breadcrumb-lista li:nth-child(3) {padding-left: 24px;}
.indice ol.breadcrumb-lista li:nth-child(4) {padding-left: 36px;}
		
.indice ol.breadcrumb-lista li:nth-child(n+2)::before {
	font-family: "FontAwesome", "Font Awesome 6 Pro"; 
	content: "\e3d6"; 
	color: #2196F3;
	margin-right: 6px;
	display: inline-block;
	opacity:0.5
}		
.indice ol.breadcrumb-lista li[aria-current="page"] { font-weight: bold;	color: #2196F3; }

.btn-toggle-indice {
	display: none;
	position: fixed;
	bottom: 20px;
	left: 20px;
	z-index: 1010;
	background: #2196F3;
	color: #fff;
	border: none;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	box-shadow: 0 4px 12px rgba(0,0,0,0.3);
	font-size: 20px;
	cursor: pointer;
}


.backdrop-indice {
	display: none;
	position: fixed;
	top: 70px; /* Empieza debajo del header */
	left: 0; 
	width: 100vw; 
	height: calc(100vh - 70px);
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
}

@media (max-width: 1024px) {
	header,header div {font-size:15px;gap:10px;}
	
	.btn-toggle-indice {display: flex;align-items: center;justify-content: center;}

	.indice {
		top: 70px !important;
		left: 0 !important;
		height: calc(100vh - 70px) !important;
		width: 280px;
		max-width: 80vw;
		background: #ffffff !important;
		box-shadow: 4px 0 15px rgba(0,0,0,0.25);
		transform: translateX(-100%);
		z-index: 1005 !important; 
		padding-top: 20px;
	}

	.indice.activo {transform: translateX(0) !important;}
	.backdrop-indice.activo {display: block !important;	}

	.indice p.titulo3 {
		color: #2196F3;
		font-weight: bold;
		font-size: 18px;
		margin-bottom: 15px;
	}
	.indice nav ul {
		padding-left: 0;
		list-style: none;
	}
	.indice nav ul li {
		margin-bottom: 12px;
	}
	.indice nav ul li a {
		color: #333333 !important;
		font-size: 15px;
		text-decoration: none;
		display: block;
		padding: 6px 0;
	}
	.indice nav ul li a:hover {
		color: #2196F3 !important;
	}
}

.nubelus {font-family:"nubelus","Arial",sans-serif;letter-spacing:-.02em;font-weight:200;}
.logo-nubelus {font-family:"nubelus","Arial",sans-serif;letter-spacing:-.02em;font-weight:200;font-style:normal;}
.logo-nubelus:before {content: "\02E9";}

video{max-width:100%;}
a {text-decoration:none;color:#2196F3}

h1, .titulo-1, titulo1 { scroll-margin-top: 85px; font-weight:bold;letter-spacing: -0.02em; font-size: 2.4em; margin:0px 0px; }
h2, .titulo-2, titulo2 { scroll-margin-top: 85px; color: #2196F3; padding-top: 6px; font-size: 1.8em; margin:40px 0px 0px 0px;  }
h3, .titulo-3, titulo3 { scroll-margin-top: 85px; font-size:24px; font-size: 1.4em; margin:25px 0px 0px 0px;  }
h4, .titulo-4, titulo4 { scroll-margin-top: 85px; font-size: 1.2em; margin:15px 0px 0px 0px;  }
h5, .titulo-5, titulo5 { scroll-margin-top: 85px; font-size: 1.1em; margin:10px 0px 0px 0px;  }

section { scroll-margin-top: 85px; }

dl {display:inline-block;width:100%}
dt {font-weight:bold; line-height:1.4em;}
dd {margin-inline-start:0px; line-height:1.4em;}
p {line-height:1.4em;margin:10px 0px 0px 0px;display:inline-block;width:100%;}


ul, ol{margin-top:5px;line-height:1.4em}

li{padding:3px 0px}

.enlace { color: #2196F3; cursor: pointer; }
.marcador .boton {font-size:1.2em;}

.con_enlace { cursor: pointer; }
.con_enlace:hover { color: #2196F3; }

.dl-icono-definicion {display:flex;margin-bottom:7px;}
.dl-icono-definicion .marcador {min-width:60px;font-weight:bold;color:#333}		
.dl-icono-definicion .marcador.circulo {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width:25px;
	width: 25px;
	height: 25px;
	border: 2px solid #b80058; /* Rosa/magenta idéntico al diagrama */
	background-color: #ffffff;
	color: #b80058;
	border-radius: 50%;
	font-weight: bold;
	font-size: 12px;
	box-sizing: border-box;
	flex-shrink: 0;
	margin-right: 15px;
}
.dl-icono-definicion .marcador .boton{padding:5px 10px;min-width:25px;}

.ocupa-todo {display:inline-block;height:100%;width:100%}

ul.sin-marcadores, ol.sin-marcadores { list-style: none; }
li.sin-marcadores { list-style-type: none; }

.limpio, .sinMargen {margin:0px !important; padding:0px !important; }

.linea_nueva {display:block;clear:both;}

.grande {font-size: 1.2em;}
.grande-x2 {font-size: 1.4em;}
.grande-x3 {font-size: 1.8em;}
.grande-x4 {font-size: 2.4em ;}

.indentado {margin-left:20px !important}
.indentado-x2 {margin-left:40px !important}
.indentado-x3 {margin-left:60px !important}

.separado {margin-top:10px !important;}
.separado-x2 {margin-top:20px !important;}
.separado-x3 {margin-top:30px !important;}

.separado-abajo {margin-bottom:10px !important}
.separado-abajo-x2 {margin-bottom:20px !important}
.separado-abajo-x3 {margin-bottom:30px !important}

.sangria {margin-right:10px !important}
.sangria-x2 {margin-right:20px !important}
.sangria-x3 {margin-right:30px !important}

.centrado {text-align:center !important}
.numerico, .numero {text-align:right !important;}

span.boton {display: inline-flex;align-items: center;vertical-align: middle;border: 1px solid #999;border-radius: 5px;padding: 2px 10px;font-size: 12px;line-height: 1;gap:5px;justify-content: center;}


