/* --- RESETEAR ESTILOS --- */
body, h1, h2, h3, h4, h5, h6, ul, ol, li, p, pre, blockquote, figure, hr {margin: 0; padding: 0;}
embed, iframe, img, object, video {display: block; max-width: 100%;}
input {font-family: inherit;}
ul {list-style: none;}
button {color: inherit; font: inherit; letter-spacing: inherit; border: 0; border-radius: 0; padding: 0.375em 0.75em; background-color: transparent;}

:root {
  --color-fondo: #FFFFFF;
  --color-sobre-fondo: #0F172A;
  --color-fondo-contraste: #F5F5F5;
  --color-sobre-fondo-contraste: #0F172A;
  --color-borde-contraste: #ECECEC;
  --color-destacado: #F5F5F5;
  --color-sobre-destacado: #0F172A;
  --color-texto: var(--color-sobre-fondo);
  --color-exito: #3CB371;
  --color-advertencia: #FFD400;
  --color-error: #B22222;

  --color-turquesa: #2CB899;
  --color-verde: #3CB371;
  --color-amarillo: #FFD400;
  --color-naranja: #FF8009;
  --color-marron: #834B2B;
  --color-rojo: #B22222;
  --color-rosa: #E05AC3;
  --color-violeta: #8933DA;
  --color-marino: #0F172A;
  --color-azul: #3765C9;
  --color-gris: #888888;
  --color-gris-claro: #DEDEDE;
  --color-blanco: #FFFFFF;
  --color-negro: #000000;

  --border-radius: 4px;
  --formulario-padding-campos: 0.5em 1em;
  --formulario-gap: 1.5rem;
  --centrado: 90%;
  --centrado-max: 1480px;
  --espacio-1: 0.5rem;
  --espacio-2: 1rem;
  --espacio-3: 2rem;
  --espacio-4: 3rem;
  --espacio-5: 4rem;
  --espacio-6: 6rem;
  --espacio-7: 10rem;
  --gradiente-primario-blanco: linear-gradient(135deg, var(--color-primario), color-mix(in oklch, var(--color-primario), white));
  --gradiente-primario-negro: linear-gradient(135deg, var(--color-primario), color-mix(in oklch, var(--color-primario), black));
  --gradiente-secundario-blanco: linear-gradient(135deg, var(--color-secundario), color-mix(in oklch, var(--color-secundario), white));
  --gradiente-secundario-negro: linear-gradient(135deg, var(--color-secundario), color-mix(in oklch, var(--color-secundario), black));
  --gradiente-primario-secundario: linear-gradient(135deg, var(--color-primario), var(--color-secundario));
}

html.modo-oscuro {
  --color-fondo: #212121;
  --color-sobre-fondo: #BEBEBE;
  --color-fondo-contraste: #313131;
  --color-sobre-fondo-contraste: #BEBEBE;
  --color-borde-contraste: #111111;
  --color-destacado: #313131;
  --color-sobre-destacado: #BEBEBE;
  --color-texto: var(--color-sobre-fondo);
  --color-exito: #31BD70;
  --color-advertencia: #FFD400;
  --color-error: #C54646;
}

.color-exito {color: var(--color-exito) !important;}
.color-advertencia {color: var(--color-advertencia) !important;}
.color-error {color: var(--color-error) !important;}
.fondo-exito {background-color: var(--color-exito) !important;}
.fondo-advertencia {background-color: var(--color-advertencia) !important;}
.fondo-error {background-color: var(--color-error) !important;}

.color-turquesa {color: var(--color-turquesa) !important;}
.color-verde {color: var(--color-verde) !important;}
.color-amarillo {color: var(--color-amarillo) !important;}
.color-naranja {color: var(--color-naranja) !important;}
.color-marron {color: var(--color-marron) !important;}
.color-rojo {color: var(--color-rojo) !important;}
.color-rosa {color: var(--color-rosa) !important;}
.color-violeta {color: var(--color-violeta) !important;}
.color-marino {color: var(--color-marino) !important;}
.color-azul {color: var(--color-azul) !important;}
.color-gris {color: var(--color-gris) !important;}
.color-gris-claro {color: var(--color-gris-claro) !important;}
.color-blanco {color: var(--color-blanco) !important;}
.color-negro {color: var(--color-negro) !important;}
.fondo-turquesa {background-color: var(--color-turquesa) !important;}
.fondo-verde {background-color: var(--color-verde) !important;}
.fondo-amarillo {background-color: var(--color-amarillo) !important;}
.fondo-naranja {background-color: var(--color-naranja) !important;}
.fondo-marron {background-color: var(--color-marron) !important;}
.fondo-rojo {background-color: var(--color-rojo) !important;}
.fondo-rosa {background-color: var(--color-rosa) !important;}
.fondo-violeta {background-color: var(--color-violeta) !important;}
.fondo-marino {background-color: var(--color-marino) !important;}
.fondo-azul {background-color: var(--color-azul) !important;}
.fondo-gris {background-color: var(--color-gris) !important;}
.fondo-gris-claro {background-color: var(--color-gris-claro) !important;}
.fondo-blanco {background-color: var(--color-blanco) !important;}
.fondo-negro {background-color: var(--color-negro) !important;}

.fuente-generica {font-family: var(--fuente-generica);}
.fuente-titulos {font-family: var(--fuente-titulos);}

.fondo-destacado {
	background-color: var(--color-destacado) !important;
	color: var(--color-sobre-destacado) !important;
	padding: .5rem;
}

.fondo-destacado a:not(.boton) {
  color: inherit;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--fuente-titulos);
  font-weight: 400;
}

a {
  color: inherit;
  text-decoration: none
}

::-moz-selection {
  background: var(--color-primario);
  color: var(--color-sobre-primario);
}

::selection {
  background: var(--color-primario);
  color: var(--color-sobre-primario);
  -webkit-text-fill-color: var(--color-sobre-primario);
}

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: #DEDEDE;
}

::-webkit-scrollbar-thumb {
  background: #555555;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--color-primario);
}


/* Hoja de estilos de versión PORTAL */

.bl_izq {position:relative; float:left; margin:0; padding:0;}
.bl_der {position:relative; float:right; margin:0; padding:0;}
.blq {position:relative; float:left; margin:0; padding:0;clear:both;width:100%;}
.blq_nv {position:relative; float:left; margin:0; padding:0;clear:both;width:100%;overflow:hidden;}
.bl_izq_nv {position:relative; float:left; margin:0; padding:0; overflow:hidden;}
.bl_der_nv {position:relative; float:right; margin:0; padding:0; overflow:hidden;}
.psr {position:relative;}
.marauto {margin:0 auto;}

  
.v_form {font-family:var(--fuente-generica); font-size:var(--tamano-2); color:var(--color-generico);}
.v_forminact {font-family:var(--fuente-generica); font-size:var(--tamano-2); color:var(--color-inactivo);}
.v_formact {font-family:var(--fuente-generica); font-size:var(--tamano-2); color:var(--color-activo);}
.v_formsobcp {font-family:var(--fuente-generica); font-size:var(--tamano-2); color:var(--color-sobre-primario);}
.v_formsobcs {font-family:var(--fuente-generica); font-size:var(--tamano-2); color:var(--color-sobre-secundario);}
.v_formsobcn {font-family:var(--fuente-generica); font-size:var(--tamano-2); color:var(--color-sobre-neutro);}
.v_formcampos {font-family:var(--fuente-generica);font-size:var(--tamano-2); color: var(--color-sobre-secundario)}
.v_formselect {font-family:var(--fuente-generica);font-size:var(--tamano-2); color: var(--color-sobre-secundario)}
.v_formcaja {font-family:var(--fuente-generica);font-size:var(--tamano-2); color: var(--color-generico); background-color: var(--color-over-boton)}

.v_btnpestsobcp {font-family:var(--fuente-generica); font-size:var(--tamano-2); color:var(--color-sobre-boton);}
.v_btn {font-family:var(--fuente-generica); font-size:var(--tamano-2); color:var(--color-sobre-boton);}
.v_sobcn {font-family:var(--fuente-generica); font-size:var(--tamano-2); color:var(--color-sobre-neutro);}
.v_sobcs {font-family:var(--fuente-generica); font-size:var(--tamano-2); color:var(--color-sobre-secundario);}
.v_sobcp {font-family:var(--fuente-generica); font-size:var(--tamano-2); color:var(--color-sobre-primario);}

.v_btnbarragr {font-family:var(--fuente-generica); font-size:var(--tamano-2); color:var(--color-sobre-barra);}
.v_btnbarra {font-family:var(--fuente-generica); font-size:var(--tamano-2); color:var(--color-sobre-barra);} 

/* enlaces - color de los link */

.v_form:link {color: var(--color-generico)}
.v_forminact:link {color: var(--color-inactivo)}
.v_formact:link {color: var(--color-activo)}
.v_formsobcn:link {color: var(--color-sobre-neutro)}
.v_formsobcs:link {color: var(--color-sobre-secundario)}
.v_formsobcp:link {color: var(--color-sobre-primario)}

.v_norm:link {color: var(--color-generico)}
.v_normcp:link {color: var(--color-destacado)}
.v_norminact:link {color: var(--color-inactivo)}
.v_normact:link {color: var(--color-activo)}

.v_gr:link {color: var(--color-generico)}
.v_grcp:link {color: var(--color-destacado)}
.v_grinact:link {color: var(--color-inactivo)}
.v_gract:link {color: var(--color-activo)}

.v_btn:link {color: var(--color-sobre-boton)}
.v_btnpestsobcp:link {color: var(--color-sobre-boton)}
.v_sobcn:link {color: var(--color-sobre-neutro)}
.v_sobcs:link {color: var(--color-sobre-secundario)}
.v_sobcp:link {color: var(--color-sobre-primario)}
.v_grsobcn:link {color: var(--color-sobre-neutro)}
.v_grsobcs:link {color: var(--color-sobre-secundario)}
.v_grsobcp:link {color: var(--color-sobre-primario)}

.v_btnbarragr:link {color: var(--color-sobre-barra)}
.v_btnbarra:link {color: var(--color-sobre-barra)} 

/* enlaces - color de los visited */


.v_form:visited {color: var(--color-generico)}
.v_forminact:visited {color: var(--color-inactivo)}
.v_formact:visited {color: var(--color-activo)}
.v_formsobcn:visited {color: var(--color-sobre-neutro)}
.v_formsobcs:visited {color: var(--color-sobre-secundario)}
.v_formsobcp:visited {color: var(--color-sobre-primario)}

.v_norm:visited {color: var(--color-generico)}
.v_normcp:visited {color: var(--color-destacado)}
.v_norminact:visited {color: var(--color-inactivo)}
.v_normact:visited {color: var(--color-activo)}

.v_gr:visited {color: var(--color-generico)}
.v_grcp:visited {color: var(--color-destacado)}
.v_grinact:visited {color: var(--color-inactivo)}
.v_gract:visited {color: var(--color-activo)}

.v_btn:visited {color: var(--color-sobre-boton)}
.v_btnpestsobcp:visited {color: var(--color-sobre-boton)}
.v_sobcn:visited {color: var(--color-sobre-neutro)}
.v_sobcs:visited {color: var(--color-sobre-secundario)}
.v_sobcp:visited {color: var(--color-sobre-primario)}
.v_grsobcn:visited {color: var(--color-sobre-neutro)}
.v_grsobcs:visited {color: var(--color-sobre-secundario)}
.v_grsobcp:visited {color: var(--color-sobre-primario)}

.v_btnbarragr:visited {color: var(--color-sobre-barra)}
.v_btnbarra:visited {color: var(--color-sobre-barra)} 


/*
  Significado de los estilos:
  
  act (color activo)
  barra (texto barra exterior)
  btn (texto botón)
  cn (color neutro)
  cp (color principal)
  cs (color secundario)
  form (texto en formularios)
  gr (texto grande)
  inact (color inactivo)
  norm (texto normal)
  pest (texto pestaña)
  sob (sobre)
  
  ej:
     btnpestsobcp -> texto de botones y pestañas sobre color principal
     normcp -> texto normal de color principal
     titnocp -> título que no es de color principal
*/ 

/* Fin */ 

/*------------------------- GENERAL_BLOQUES.CSS (inicio) --------------------------------*/
html {
  margin: 0;
  padding: 0;
  -webkit-text-size-adjust: 100%; /* iphone-ipad para que respete estilos en orientación a Landscape */
  box-sizing: border-box;
  min-height: 100vh;
  scroll-behavior: smooth;
}

*, *::before, *::after {
  box-sizing: inherit;
}

body {
  margin: 0;
  padding: 0;
  height: 100%;
  width: 100%;
  border: 0;
  font-family: var(--fuente-generica);
  font-size: var(--tamano-2);
  background-color: var(--color-fondo);
  color: var(--color-sobre-fondo);
}


img {
  border: 0;
}

a {
  text-decoration: none;
}

/* Recordar controlar focus y active con navegación teclado */
a:focus, a:active, input:active, input:focus, select:active, select:focus, button:active, button:focus {
  outline: 0;
}

a:hover {
  color: var(--color-over);
}

form {
  margin: 0;
  padding: 0;
}


iframe {position:relative !important;border:none;} /* para el iframe que genera google+ */

.bl_izq {position:relative; float:left; margin:0; padding:0;}
.bl_der {position:relative; float:right; margin:0; padding:0;}
.blq {position:relative; float:left; margin:0; padding:0;clear:both;width:100%;}
.blq_nv {position:relative; float:left; margin:0; padding:0;clear:both;width:100%;overflow:hidden;}
.bl_izq_nv {position:relative; float:left; margin:0; padding:0; overflow:hidden;}
.bl_der_nv {position:relative; float:right; margin:0; padding:0; overflow:hidden;}
.bl_izq_cb {position:relative; float:left; margin:0; padding:0;clear:both;}
.bl_der_cb {position:relative; float:right; margin:0; padding:0;clear:both;}
.bl_col {background:#FFF;position:relative; float:left; clear:both; margin:0 0 1em 0; padding:4%; width:91%;}
.bloque {background:#FFF;clear:both;position:relative;float:left;width:100%;padding:1em 2%;margin:0;}


/* --- COMPONENTES GENÉRICOS --- */

pre {
  background-color: #26232F;
  color: #FFF;
  padding: 1rem 1.5rem;
  border-radius: 4px;
}

code {
  background-color: #26232F;
  color: #FFF;
  font-family: monospace;
  padding: 0.125em 0.5em;
  border-radius: 4px;
}

pre code {
  background-color: unset;
  color: inherit;
  padding: 0;
  border-radius: 0;
}

.hljs-keyword {
  color: #FF6F6F;
  font-weight: 700;
}

.hljs-built_in {
  color: #FFD01E;
  font-weight: 700;
}

.hljs-string {
  color: #74FFB2;
}

/* --- Títulos --- */
      
.titulo {
  position: relative;
  margin: 0;
  padding: 0;
  width: 100%;
  font-size: var(--tamano-3);
  font-family: var(--fuente-titulos);
  font-weight: 400;
}

.titulo a {
  color: inherit;
}

.tit {
  position: relative;
  margin: 0;
  padding: 0;
  font-size: var(--tamano-4);
  font-family: var(--fuente-titulos);
  font-weight: 500;
	line-height: 1.15;
}

.tit a {
  color: inherit;
}

.separador {
  position: relative;
  width: 100%;
  margin: 0.5em 0;
  padding: 0.75em 1.25em;
	background-color: var(--color-fondo-contraste);
  color: var(--color-sobre-fondo-contraste);
  border-radius: var(--border-radius);
  border-bottom: 3px solid var(--color-borde-contraste);
  font-size: var(--tamano-4);
  font-family: var(--fuente-generica);
}

/* --- Botones --- */

.boton {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  white-space: nowrap;
  padding: 0.375em 1em;
  margin: 0;
  border: none;
  background-color: var(--color-primario);
  color: var(--color-sobre-primario);
  border-radius: var(--border-radius);
  font-size: var(--tamano-1);
  text-align: center;
  cursor: pointer;
}

.boton:hover, .boton:focus-visible {
  background: var(--color-secundario);
  color: var(--color-sobre-secundario);
}

/* --- Menús --- */

.menu {
  display: inline-flex;
  margin: 0;
  padding: 0; 
}

.menu--vertical {
  flex-direction: column;
}

.menu li {
  list-style-type: none;
}

/* --- Popup --- */

.popup {
  display: none;
  position: absolute;
  top: 100%;
  z-index: 10;
  width: 75vw;
  max-width: 300px;
  background-color: var(--color-fondo);
  color: var(--color-sobre-fondo);
  padding: 1rem 1.5rem;
  border-radius: var(--border-radius);
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.25);
  font-size: var(--tamano-1);
}

.popup-carrito {
  max-width: 360px;
}

html.modo-oscuro .popup {
  background-color: var(--color-fondo-contraste);
  color: var(--color-sobre-fondo-contraste);
}

.popup__cerrar {
  position: absolute;
  top: 0.5em;
  right: 0.5em;
  width: 2em;
  height: 2em;
  padding: 0.25em;
  stroke: var(--color-sobre-fondo);
  cursor: pointer;
}

.popup__tit {
  margin: 0 0 1em;
  display: flex;
  align-items: center;
  font-size: var(--tamano-3);
  gap: 0.5em;
}

.popup__icono {
  color: var(--color-primario);
  font-size: 1.25em;
}

.popup .formulario {
  --formulario-padding-campos: 0.375em 1em;

  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.75rem;
}

.popup .formulario .campo {
  width: 100%;
}

.popup__enlaces {
  margin-top: 1rem;
  display: flex;
  justify-content: flex-end;
  gap: 1rem;
}

.popup__enlaces a {
  font-size: .95rem;
  font-style: italic;
}

.popup-login__perfil {
  display: flex;
  flex-direction: column;
}

.popup-login__perfil .boton {
  align-self: center;
}

/* --- Valoraciones --- */

.valoraciones-comentarios {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.valoracion {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.valoracion__valor {
  display: flex;
  align-items: center;
}

.valoracion__valor span {
  font-weight: 500;
  margin-right: 0.5rem;
  line-height: 1;
}

.valoracion__votos {
  font-style: italic;
  font-size: var(--tamano-1);
}

/* --- reCaptcha --- */

.grecaptcha-badge {
  z-index: 1;
}


/* --- IDIOMAS --- */

.idiomas {
  position: relative;
	padding: 0.125rem 0.5rem;
  border: 1px solid var(--color-neutro);
	border-radius: var(--border-radius);
  background-color: var(--color-fondo-contraste);
  font-size: var(--tamano-1);
  font-weight: 500;
  text-transform: uppercase;
  cursor: pointer;
}

.idiomas__actual {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.idiomas__actual .fa {
  font-size: 1rem;
}

.idiomas__menu {
	display: none;
	position: absolute;
  width: 100%;
  top: calc(100% + 0.25rem);
  left: 0;
	padding: 0.125rem 0.5rem;
  z-index: 1;
  background-color: var(--color-fondo-contraste);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
	border-radius: var(--border-radius);
  box-sizing: border-box;
}

.idiomas__menu li a {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.idiomas__menu li a img {
  display: flex;
}


/* --- MENÚ PRINCIPAL --- */

.menupri {
	margin: 0;
	padding: 0;
	display: flex;
	justify-content: center;
	gap: 1.5rem;
}

.menupri li {
	list-style-type: none;
	position: relative;
}

.menupri a {
	display: block;
	white-space: nowrap;
	font-size: var(--tamano-1);
	padding: 0.5em 0;
}

.menupri > li {
	display: flex;
	align-items: center;
}

.menupri > li > a {
	padding: 2em 0;
}

.menupri > li:hover > a {
	color: var(--color-primario);
}

.menupri .flecha {
	display: none;
	align-self: stretch;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	padding: 0.5em 0.25em;
}

.menupri ul .flecha {
	display: none;
}

.menupri > li:hover .menusec {
	display: flex;
}

.menupri .menusec {
	display: none;
	position: absolute;
	width: auto;
	min-width: 200px;
	top: 100%;
	right: 0;
	animation: aparecer_menu 0.2s ease;
	flex-direction: column;
	margin: 0;
	padding: 0.5rem;
	background-color: var(--color-fondo);
  border-radius: var(--border-radius);
  filter: drop-shadow(2px 2px 8px rgba(0, 0, 0, 0.25));
}

.menupri .menusec::before {
  content: "";
  position: absolute;
  bottom: 100%;
  right: 1.5rem;
  border-bottom: 0.5rem solid var(--color-fondo);
  border-left: 0.5rem solid transparent;
  border-right: 0.5rem solid transparent;
}

.menupri .menusec::after {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 0;
  width: 100%;
  height: 16px;
}

.menupri .menusec > li + li {
	border-top: 1px solid rgba(0, 0, 0, 0.05);
}

.menupri .menusec a {
	display: flex;
	padding: 0.5em 0.75em;
	font-size: var(--tamano-1);
}

.menupri .menusec a:hover {
	color: var(--color-sobre-fondo-contraste);
	background-color: var(--color-fondo-contraste);
}

.menupri .menusec ul {
  padding: 0;
}

.menupri .menusec ul a {
  padding-left: 1.25em;
}

@keyframes aparecer_menu {
	0% {
		opacity: 0;
		transform: translate(0, -8px);
	}
	20% {
		opacity: 0;
		transform: translate(0, -8px);
	}
	100% {
		opacity: 1;
		transform: translate(0, 0);
	}
}

/* --- MENU DESPLEGABLE --- */

.menu-desplegable {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: flex-end;
  visibility: hidden;
  z-index: -1;
  transition: z-index 0.1s linear 0.2s;
}

.menu-desplegable.abierto {
  visibility: visible;
  z-index: 999999999;
  transition: unset;
}

.menu-desplegable::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: transparent;
	transition: all 0.6s ease;
  z-index: -1;
}

.menu-desplegable.abierto::before {
	background-color: rgba(0, 0, 0, 0.5);
}

.menu-desplegable__conten {
	height: 100%;
	width: 90%;
	max-width: 420px;
	overflow-y: auto;
	left: 100%;
	transition: all 0.3s ease;
  background-color: var(--color-fondo);
  color: var(--color-sobre-fondo);
  box-shadow: 0 0 16px rgba(0, 0, 0, 0.4);
  position: relative;
  padding: 2.75rem 2rem 2rem 2rem;
  display: flex;
  flex-direction: column;
  gap: 2rem;
  font-size: var(--tamano-2);
}

.menu-desplegable.abierto .menu-desplegable__conten {
  left: 0;
}

.menu-movil {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.menu-movil li {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.menu-movil li + li {
  border-top: 1px solid rgba(0, 0, 0, 0.05);
}

.menu-movil a {
  padding: .5em .5em;
  flex: 1;
  color: inherit;
}

.menu-movil a:hover {
  color: var(--color-primario);
}

.menu-movil ul {
  display: none;
  border-top: 1px solid rgba(0, 0, 0, 0.05);
}

.menu-movil ul a {
  padding-left: 1.5em;
}

.menu-movil .flecha {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  align-self: stretch;
  width: 2em;
  padding-right: 0.5rem;
  cursor: pointer;
}

.menu-movil .flecha:last-child {
  display: none;
}

.menu-movil .flecha::before {
  display: inline-block;
  transition: all 0.5s ease-out;
}

.menu-movil .flecha.abierto::before {
  transform: rotateX(180deg);
}

.menu-desplegable__cerrar {
  position: absolute;
  top: 1em;
  right: 1em;
  width: 2rem;
  height: 2rem;
  padding: 0.25em;
  stroke: var(--color-sobre-fondo);
  cursor: pointer;
}

.menu-desplegable .redes-sociales {
  gap: 1rem;
}

.menu-desplegable .redes-sociales li a {
  font-size: var(--tamano-4);
}

.menu-desplegable__login .formulario {
  --formulario-padding-campos: 0.375em 1em;

  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.75rem;
}

.menu-desplegable__login-enlaces {
  margin-top: 1rem;
  display: flex;
  justify-content: flex-end;
  gap: 1rem;
}

.menu-desplegable__login-enlaces a {
  font-size: 0.75rem;
  font-style: italic;
}

.menu-desplegable .bloque_form {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

/* ---------------- Información destacada -------------*/

/*------------------------- Mensajes emergente -----------------------*/
#emergentes {
  width: 1px;
  height: 1px;
  overflow: hidden;
  display: none;
}

/*------------------------- Centrado ---------------------------------*/
.centrado {
  clear: both;
  position: relative;
  margin: 0 auto;
  padding: 0; 
  z-index: 1;
  width: var(--centrado);
  /*max-width: var(--centrado-max);*/
}

/* --- CABECERA --- */

/* --- BOTÓN MODO OSCURO --- */

.boton-modo-oscuro {
  --size: 1.25rem;
  position: relative;
  appearance: none;
  outline: none;
  cursor: pointer;
  margin: 0;
  padding: 0;
  border: 0;
  background-color: transparent;
  width: var(--size);
  height: var(--size);
  border-radius: 999px;
  transition: all 0.5s ease-out;
}

html:not(.modo-oscuro) .boton-modo-oscuro {
  --ray-size: calc(var(--size) * -0.4);
  --offset-orthogonal: calc(var(--size) * 0.65);
  --offset-diagonal: calc(var(--size) * 0.45);
  transform: scale(0.75);
  color: #FFAA00;
  box-shadow: inset 0 0 0 var(--size), calc(var(--offset-orthogonal) * -1) 0 0 var(--ray-size), var(--offset-orthogonal) 0 0 var(--ray-size), 0 calc(var(--offset-orthogonal) * -1) 0 var(--ray-size), 0 var(--offset-orthogonal) 0 var(--ray-size), calc(var(--offset-diagonal) * -1) calc(var(--offset-diagonal) * -1) 0 var(--ray-size), var(--offset-diagonal) var(--offset-diagonal) 0 var(--ray-size), calc(var(--offset-diagonal) * -1) var(--offset-diagonal) 0 var(--ray-size), var(--offset-diagonal) calc(var(--offset-diagonal) * -1) 0 var(--ray-size);
}

html.modo-oscuro .boton-modo-oscuro {
  color: #FFFFFF;
  box-shadow: inset calc(var(--size) * 0.33) calc(var(--size) * -0.25) 0, 0 0 0 -0.5em;
}

.boton-modo-oscuro::after {
  content: "";
  visibility: hidden;
  opacity: 0;
  position: absolute;
  top: 7px;
  right: 0;
  width: 2px;
  height: 2px;
  border-radius: 2px;
  background-color: #FFF8DD;
}

html.modo-oscuro .boton-modo-oscuro::after {
  visibility: visible;
  opacity: 1;
  transition: all 0.5s ease-out 0.6s;
}

.boton-modo-oscuro::before {
  content: "";
  visibility: hidden;
  opacity: 0;
  position: absolute;
  top: 0;
  right: 3px;
  width: 3px;
  height: 3px;
  border-radius: 3px;
  background-color: #EEEEEE;
}

html.modo-oscuro .boton-modo-oscuro::before {
  visibility: visible;
  opacity: 1;
  transition: all 0.5s ease-out 0.25s;
}

.cab-sup {
  z-index: 99999;
  /*position: sticky;*/
  top: 0;
  width: 100%;
  background: var(--color-fondo);
  color: var(--color-sobre-fondo);
	margin-bottom: 1.25rem;
  /*box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);*/
}

.cab-sup .centrado {
  z-index: 9999;
}


.antecabecera {
  padding:0;
  background: var(--color-secundario);
  color: var(--color-sobre-secundario);
	border-bottom: 2px solid  var(--color-primario);
}

.antecabecera .centrado {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  position: unset;
	gap: .95rem;
	font-size: calc(var(--tamano-1) - 2px);
}
.antecabecera .centrado a:hover{
	color: inherit;
}
.gb-shape {
  line-height: 0;
}

.gb-text-c47c8622 {
  align-items: center;
  background-color: #25cc64;
  color: var(--color-sobre-primario);
  column-gap: 0.5em;
  display: inline-flex;
  font-size: 22px;
  padding: 4px;
}
.gb-text-c47c8622:hover{
	color: var(--color-sobre-primario) !important;
}
gb-text-c47c8622 .gb-shape svg {
  width: 1em;
  height: 1em;
  fill: currentColor;
  color: var(--base-3);
}

.gb-text-b8f6fd69 {
  align-items: center;
  color: var(--contrast-2);
  column-gap: 0.5em;
  display: inline-flex;
  font-size: 22px;
}
.gb-text-b8f6fd69 .gb-shape svg {
  width: 1em;
  height: 1em;
  fill: currentColor;
}

.gb-text-bdcb6c80 {
  align-items: center;
  color: var(--contrast-2);
  column-gap: 0.5em;
  display: inline-flex;
  font-size: 20px;
}
.gb-text-bdcb6c80 .gb-shape svg {
  width: 1em;
  height: 1em;
  fill: currentColor;
}

.precabecera {
  /*padding: 0.5rem 0;*/
	border-bottom: 1px solid var(--color-neutro);
}

.precabecera .centrado {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: unset;
}

.precabecera__izquierda {
  margin-right: 1rem;
}

.precabecera__derecha {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.precabecera__iconos {
  display: flex;
  align-items: center;
  gap: .75rem;	
	margin-left: 1.25rem;
	margin-right: 1.25rem;
}

.precabecera__iconos > div {
  position: relative;
}

.precabecera__iconos .popup {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translate(-50%, 2rem);
}

.menu-hamburguesa {
  stroke: var(--color-sobre-fondo);
  width: 1.75rem;
  height: 1.75rem;
  cursor: pointer;
}

.cabecera {
  padding: 0;
  width: 100%;
}

.cabecera .centrado {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: unset;
  gap: 2rem;
}

.logotipo {
  padding: 1rem 0;
  width: 150px;
}

.logotipo img {
  width: 100%;
}

.midi {
	display:none;
}


/* --- Rotación --- */

.glide {
  width: 100%;
  position: relative;
}

.glide__arrow {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: var(--tamano-3);
  color: var(--color-blanco);
  line-height: 1;
  cursor: pointer;
  outline: none;
  z-index: 10;
}

.glide__arrow--left {
  top: 0;
  left: 0;
  width: 8%;
  height: 100%;
}

.glide__arrow--right {
  top: 0;
  right: 0;
  width: 8%;
  height: 100%;
}

.glide__arrow .fa-solid {
  transition: all 0.25s ease-out;
}

.glide__arrow--left:hover .fa-solid {
  transform: translateX(-8px);
}

.glide__arrow--right:hover .fa-solid {
  transform: translateX(8px);
}

.glide__bullets {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  padding: 1rem 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
}

.glide__bullets .glide__bullet {
  width: 12px;
  height: 12px;
  border-radius: 12px;
  padding: 0;
  margin: 0;
  border: 0;
  background-color: var(--color-blanco);
  transition: all 0.15s ease-out;
  cursor: pointer;
}

.glide__bullets .glide__bullet--active {
  transform: scale(1.05);
  background-color: var(--color-primario);
}

.glide__gallery {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.5rem;
}

.glide__gallery img {
  width: min(100px, 20%);
  aspect-ratio: 4 / 3;
  object-fit: cover;
  cursor: pointer;
  transition: all 0.2s ease-out;
}

.glide__gallery .glide__bullet--active {
  transform: scale(1.05);
}

/* --- Rotación - Contenido --- */

.rotacion__info {
  position: relative;
  white-space: initial;
}

.rotacion__icono {
	position: relative;
	width: 100%;
	padding-top: 30%;
	min-height: 360px;
	box-sizing: border-box;
	overflow: hidden;
}

.rotacion__icono img, .rotacion__icono video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rotacion__contenido {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 2rem 0;
	box-sizing: border-box;
	background-color: rgba(0, 0, 0, 0.35);
	color: white;
	display: flex;
	align-items: center;
  pointer-events: none;
}

.rotacion__contenido .centrado {
	display: flex;
	flex-direction: column;
	align-items: center;
  text-align: center;
  gap: 1rem;
}

.rotacion__titulo {
  max-width: 900px;
	margin: 0;
	font-size: var(--tamano-5);
	font-weight: 300;
	opacity: 0;
	text-shadow: 0.06em 0.06em 0.4em rgba(0, 0, 0, 0.75);
	font-family: var(--fuente-titulos);
}

.rotacion__titulo a {
	color: inherit;
}

.rotacion__resumen {
  max-width: 900px;
	font-size: var(--tamano-2);
	font-weight: 300;
	opacity: 0;
	text-shadow: 0.06em 0.06em 0.4em rgba(0, 0, 0, 0.75);
	font-family: var(--fuente-generica);
}

.rotacion__resumen a {
	color: inherit;
}

.rotacion__vermas {
  margin-top: 1rem;
	opacity: 0;
}

.glide__slide--active .rotacion__titulo {
	animation: aparecer_desde_abajo 0.5s ease forwards;
	animation-delay: 0.1s;
}

.glide__slide--active .rotacion__resumen {
	animation: aparecer_desde_abajo 0.5s ease forwards;
	animation-delay: 0.2s;
}

.glide__slide--active .rotacion__vermas {
	animation: aparecer_desde_abajo 0.5s ease forwards;
	animation-delay: 0.3s;
}

@keyframes aparecer_desde_abajo {
  0% {
    opacity: 0;
    transform: translateY(80px);
  }
  20% {
    opacity: 0;
    transform: translateY(80px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ------------------------------------------------------ */

.menujs {
	position:absolute;
	top:5.25em;
	left:0;
	z-index:99999;
}

#cont-menujs .titulo {
	background:var(--color-primario);
	color:var(--color-sobre-primario);
	font-size:2.5em;
	max-width: 86%;
  width: auto;
  padding: 0.5em 2%;
}

.medio{
	margin: 0 0 2rem 0;
}

#medio > .centrado{
	column-gap: 1em;
	display: grid;
	grid-template-columns: 1fr 3fr;
	row-gap: 1em;
}

.contenido {
  width: 100%;
  margin: 1rem 0 3rem 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
}

.contenido.contenido-portada {
  margin: 0;
}

.contenido-listado {
  flex: 100%;
  max-width: 100%;
  display: grid;
  gap: 2rem;
  align-self: flex-start;
}

.menu-lateral + .contenido-listado {
  flex: 1;
}

.col1 {
  grid-template-columns: 1fr;
  gap: 4rem;
}

.col2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4rem 2rem;
}

.col3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2rem;
}

.col4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.col5 {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1rem;
}

.columna {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  position: relative;
  background-color: var(--color-fondo);
  color: var(--color-sobre-fondo);
  border-radius: var(--border-radius);
  overflow: hidden;
  max-width: 100%;
}

.anchocompleto, .columna--desplegada {
  grid-column: 1 / -1 !important;
  box-shadow: unset !important;
  padding: 0 !important;
}

.contenido-columna {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
  padding: 1.5rem;
}

.contenido-columna .txt > * + * {
  margin-top: 1rem;
}

.col1 .columna:not(.desplegada),
.col2 .columna {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 2rem;
  border-radius: 0;
}

.col1 .contenido-columna,
.col2 .contenido-columna {
  padding: 0;
  gap: 0.75rem;
}

.col1 .tit,
.col2 .tit {
  font-size: var(--tamano-4);
}

.col1 .contenido-columna .tipo,
.col2 .contenido-columna .tipo {
  border-bottom: none;
}

.col3 .columna,
.col4 .columna,
.col5 .columna {
  display: flex;
  flex-direction: column;
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.2);
}
.col3 .columna{
	transition: all 0.35s ease-out;
}
.col3 .columna:hover{
	transform: scale(1.025);
	background-color: var(--color-secundario);
}

.columna.columna--desplegada {
  display: block;
}

html.modo-oscuro .col3 .columna,
html.modo-oscuro .col4 .columna,
html.modo-oscuro .col5 .columna {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.75);
}

.col3 .contenido-columna .tit,
.col4 .contenido-columna .tit,
.col5 .contenido-columna .tit {
  font-size: var(--tamano-2);
}

.col3 .contenido-columna .txt,
.col4 .contenido-columna .txt,
.col5 .contenido-columna .txt {
  font-size: var(--tamano-2);
}

.col3 .fot-min .tipo,
.col4 .fot-min .tipo,
.col5 .fot-min .tipo {
  font-size: var(--tamano-1);
}

.columna:not(.producto) .fot-min img {
  transition: all 0.4s ease-out;
}

.columna:not(.producto) .fot-min:hover img {
  transform: scale(1.05);
}

.contenido-columna .leermas {
  padding-top: 1rem;
  align-self: flex-end;
  margin-top: auto;
  margin-bottom: 0;
}

.fot-min .tipo {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  pointer-events: none;
  padding: 0.125em 0.5em;
  border-radius: var(--border-radius);
  text-shadow: 0 0 4px rgba(0, 0, 0, 0.35);
}

.contenido-columna .tipo {
  align-self: flex-start;
  color: var(--color-primario);
  border-bottom: 2px solid currentColor;
  padding-bottom: 0.25em;
  font-size: var(--tamano-1);
  text-transform: uppercase;
  font-weight: 700;
}

.contenido-columna .fecha {
  font-size: var(--tamano-1);
  font-weight: 500;
}

/* -------------------------------------------------------------------- */

.descimg {
  display: block;
  clear: both;
  margin: .3em 0;
  font-size: .75em;
  color: var(--color-generico);
  text-align: center;
}
 
.blink {
  background: url("../imgs/ic_blink.gif") no-repeat 0 0;
  padding: 0;
  margin:0;
  float:left;
  width: 30px;
  height: 24px;
}


/*----------------- imágenes --------------------------------------- */

.fot-min {
  width: 100%;
  padding-top: 100%;
  position: relative;
  overflow: hidden;
}

.col1 .fot-min,
.col2 .fot-min {
  flex-shrink: 0;
  border-radius: var(--border-radius);
  width: 40%;
  padding-top: calc(40% / (16/9));
  z-index: 1;
}

.col3 .fot-min, .col4 .fot-min, .col5 .fot-min {
  width: 100%;
  padding-top: calc(100% / (16/9));
}

.fot-min img {
  position: absolute;
  top: 0;
  left: 0;
	width: 100%;
	height: 100%;
  object-fit: cover;
}
.fot-min-sin-imagen img{
	object-fit: contain;
}

.fot_izq {
  float: left;
  min-width: 1.25em;
  margin: 0 1em 0 0;
  overflow:hidden;
}

.fot_cen {
  text-align: center;
  min-width: 1.25em;
  margin: 0 auto;
  padding:0;
  overflow:hidden;
}

.fot_der {
  float: right;
  min-width: 1.25em;
  margin:0 0 0 1em;
  padding: 0;
  overflow:hidden;
}

.fot_txabs {
	position:absolute;
	left:0;
	bottom:0;
	background-color: rgba(206, 203, 203, 0.55);
}


/* --- Varios --- */

.border-radius {
  border-radius: var(--border-radius);
}

.cs {
  background-color: var(--color-fondo-contraste);
  color: var(--color-sobre-fondo-contraste);
  border-radius: var(--border-radius);
  padding: 2rem;
}


/* --- Carrito --- */

.minicarrito {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.minicarrito p {
  margin: 0;
}


/* --- Formularios --- */

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="password"],
input[type="number"],
input[type="date"],
input[type="datetime-local"],
input[type="month"],
textarea,
select {
  width: 100%;
  padding: var(--formulario-padding-campos);
  font: inherit;
  letter-spacing: inherit;
  border: 1px solid var(--color-borde-contraste);
  background-color: var(--color-fondo);
  color: var(--color-sobre-fondo);
  border-radius: var(--border-radius);
}

input:not([type="radio"]):not([type="checkbox"]):focus-visible, textarea:focus-visible, select:focus-visible {
  outline: 2px solid var(--color-sobre-fondo);
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.25);
}

input[type="radio"]:focus-visible, input[type="checkbox"]:focus-visible {
  outline: 2px solid var(--color-sobre-fondo);
  outline-offset: 2px;
}

input:autofill {
  background-color: transparent !important;
  -webkit-text-fill-color: unset !important;
}

input:-webkit-autofill,
input:-internal-autofill-selected,
textarea:-webkit-autofill,
textarea:-internal-autofill-selected {
  background-color: transparent !important;
  -webkit-box-shadow: 0 0 0 50px var(--color-fondo) inset;
  color: var(--color-sobre-fondo) !important;
  -webkit-text-fill-color: var(--color-sobre-fondo) !important;
}

textarea {
  resize: vertical;
}

label > input[type="file"] {
  display: none;
}

html.modo-oscuro input[type="date"]::-webkit-calendar-picker-indicator,
html.modo-oscuro input[type="datetime-local"]::-webkit-calendar-picker-indicator,
html.modo-oscuro input[type="month"]::-webkit-calendar-picker-indicator {
  filter: invert(1);
}

input[type="checkbox"] {
  -webkit-appearance: none;
  appearance: none;
  font: inherit;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 1rem;
  height: 1rem;
  border-radius: var(--border-radius);
  color: inherit;
  border: 2px solid currentColor;
  outline: none;
  cursor: pointer;
  margin: 0;
  padding: 0;
  transition: all 0.2s ease-out;
}

input[type="checkbox"]::before {
  display: block;
  font-family: "FontAwesome";
  content: "\f00c";
  font-size: 0.75rem;
  width: 1em;
  height: 1em;
  opacity: 0;
  text-align: center;
  color: var(--color-sobre-primario);
  transition: all 0.2s ease-out;
}

input[type="checkbox"]:checked {
  border: 2px solid var(--color-primario);
  background-color: var(--color-primario);
}

input[type="checkbox"]:checked::before {
  opacity: 1;
  transition-delay: 0.1s;
}

input[type="radio"] {
  position: relative;
  -webkit-appearance: none;
  appearance: none;
  font: inherit;
  width: 1rem;
  height: 1rem;
  border-radius: 1rem;
  color: inherit;
  border: 2px solid currentColor;
  outline: none;
  cursor: pointer;
  margin: 0;
  padding: 0;
}

input[type="radio"]::before {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  content: "";
  width: 0.5em;
  height: 0.5em;
  border-radius: 0.5em;
  background-color: var(--color-primario);
  transition: all 0.2s cubic-bezier(0.25, 0.25, 0.56, 2);
  transform: translate(-50%, -50%) scale(0);
  transform-origin: center;
}

input[type="radio"]:checked {
  border: 2px solid var(--color-primario);
}

input[type="radio"]:checked::before {
  transform: translate(-50%, -50%) scale(1);
}

input[type="submit"]:not(.boton) {
  font: inherit;
}

.formulario {
  --formulario-padding-campos: 0.5em 1em;
  --formulario-gap: 2rem max(2rem, 5vw);

  font-size: var(--tamano-2);
}

.formulario.formulario--compacto {
  --formulario-padding-campos: 0.375em 1em;
  --formulario-gap: 1rem max(1rem, 3vw);
  font-size: var(--tamano-2);
}
.formulario.formulario--login{
	font-size: var(--tamano-1);
}

.formulario .campo {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
}

/* --- CAMPO DE BÚSQUEDA CON BOTÓN --- */
.precabecera__busqueda{margin-bottom: 1rem;}

.formulario--compacto .campo {
    position: relative;
}

.formulario--compacto .campo .boton-buscar {
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    padding: 0;
    font-size: var(--tamano-2); /* 0.875rem, adecuado para formulario compacto */
    color: var(--color-sobre-fondo); /* #0F172A en modo claro, #BEBEBE en modo oscuro */
    cursor: pointer;
}

.formulario--compacto .campo .boton-buscar:hover,
.formulario--compacto .campo .boton-buscar:focus {
    color: var(--color-primario); /* #1e3b8a */
}

.formulario--compacto .campo input[type="text"] {
    padding-right: 2.5rem; /* Espacio para el botón */
}
/* --- CAMPO DE BÚSQUEDA CON BOTÓN - fin --- */

.formulario.formulario--horizontal .formulario__campos .campo {
  flex-direction: row;
}

.formulario.formulario--horizontal .formulario__campos .campo > label {
  white-space: nowrap;
  flex-shrink: 0;
  width: 25%;
  min-width: 200px;
  padding: var(--formulario-padding-campos);
  padding-left: 0;
  padding-right: 0;
}

.formulario .campo.required > label::after {
  content: " *";
  color: var(--color-error);
}

.campo__number {
  display: flex;
  width: 140px;
  border-radius: var(--border-radius);
  border: 1px solid var(--color-borde-contraste);
}

.campo__number input[type=number] {
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  appearance: textfield;
  border-radius: 0;
  border-top: 0;
  border-bottom: 0;
  text-align: center;
  font-size: var(--tamano-3);
  padding: 0.25em 0.5em;
}

.campo__number input[type=number]::-webkit-inner-spin-button,
.campo__number input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
}

.campo__number button {
  cursor: pointer;
  font-size: var(--tamano-1);
  padding: 0.375em 1em;
}

.campo__number button:hover,
.campo__number button:focus-visible {
  background-color: var(--color-fondo-contraste);
  color: var(--color-sobre-fondo-contraste);
}

.campo__radio,
.campo__checkbox {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem 1.25rem;
  padding: var(--formulario-padding-campos);
  padding-left: 0;
  padding-right: 0;
}

.campo__radio label,
.campo__checkbox label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  cursor: pointer;
  font-weight: 400;
}

.formulario__campos {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--formulario-gap);
  max-width: 480px;
}

.formulario__campos label {
  font-weight: 500;
}

.formulario__otros {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin: 2rem 0;
}

.formulario__otros .campo {
  flex-direction: row;
  align-items: flex-start;
}

.formulario__otros .campo input {
  margin: 0.2em 0;
}


/* --- TABLAS --- */

.tabla {
  border-spacing: 0;
  border-collapse: collapse;
  border: none;
  overflow-x: auto;
  font-size: var(--tamano-1);
  text-align: left;
}

.tabla th, .tabla td {
  padding: 0.75em;
}

.tabla tbody tr:hover {
  background-color: var(--color-fondo-contraste);
}

.tabla--compacta th, .tabla--compacta td {
  padding: 0.375em;
}

.tabla--color thead,
.tabla--color > tbody:first-child > tr:first-child,
.tabla--color > tr:first-child {
  background-color: var(--color-primario);
  color: var(--color-sobre-primario);
}

.tabla--color tbody tr:nth-child(even) {
  background-color: var(--color-fondo-contraste);
  color: var(--color-sobre-fondo-contraste);
}

.tabla--bordes thead tr:last-of-type {
  border-bottom: 2px solid var(--color-fondo-contraste);
}

.tabla--bordes tbody tr + tr {
  border-top: 1px solid var(--color-fondo-contraste);
}

.tabla--fixed {
  table-layout: fixed;
}

/* ------------------------------ CAJAS ------------------------------ */

.cajadesp, .caja {
  box-shadow: 0 3px 6px 0 rgb(0 0 0 / 25%);
  -webkit-border-bottom-left-radius: 3px; 
  -moz-border-radius-bottomright: 3px; 
  -moz-border-radius-bottomleft: 3px;
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
}

/* --- MENÚ ADMINISTRACIÓN ESENCIA --- */

.cab-admin {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  position: relative;
  z-index: 1;
	background: var(--color-fondo);
  border-bottom: 1px solid rgba(0, 0, 0, 0.125);
  font-size: var(--tamano-1);
}

.cab-admin__system {
  position: relative;
  z-index: 1;
}

.cab-admin__logo {
  position: relative;
  background-color: var(--color-primario);
  color: var(--color-sobre-primario);
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  font-weight: 600;
  cursor: pointer;
}

.cab-admin__logo img {
  max-height: 32px;
}

.cab-admin__contenidos > li {
  position: relative;
  border-right: 1px solid rgba(0, 0, 0, 0.05);
}

.cab-admin__personal {
  margin-left: auto;
}

.cab-admin__personal > li {
  position: relative;
  border-left: 1px solid rgba(0, 0, 0, 0.05);
}

.cab-admin__contenidos li a, .cab-admin__personal li a {
  position: relative;
  height: 100%;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1em;
}

.cab-admin .menu .admin-desconectar a .fa {
  color: var(--color-rojo);
}

.cab-admin .menu .admin-desconectar a:hover {
  background-color: var(--color-rojo);
  color: white;
}

.cab-admin .menu .admin-desconectar a:hover i {
  color: white;
}

.cab-admin .cab-admin__contenidos ul,
.cab-admin .cab-admin__personal ul {
  position: absolute;
  top: 100%;
  left: 0;
  padding: 0.5rem;
  display: none;
  flex-direction: column;
  background: var(--color-fondo);
  color: var(--color-sobre-fondo);
  border: 1px solid rgba(0, 0, 0, 0.05);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  z-index: 10;
}

.cab-admin .menu ul > li + li {
  border-top: 1px solid rgba(0, 0, 0, 0.05);
}

.cab-admin__contenidos ul a,
.cab-admin__personal ul a {
  display: block;
  padding: 0.5em 1em;
  white-space: nowrap;
}

.cab-admin__contenidos ul a:hover,
.cab-admin__personal ul a:hover {
  color: inherit;
  background-color: var(--color-fondo-contraste);
}

.cab-admin__contenidos > li:hover ul,
.cab-admin__personal > li:hover ul {
  display: flex;
}

.cab-admin__personal.menu ul {
  left: unset;
  right: 0;
}

.cab-admin__contenidos li i,
.cab-admin__personal li i {
  font-size: 1.375em;
  color: var(--color-primario);
}

.cab-admin .menu .mostrar-tooltip i {
  color: inherit;
}

.cab-admin .menu .num_contador {
  position: absolute;
  top: 0.25rem;
  right: 0.25rem;
  background-color: var(--color-rojo);
  color: white;
  font-size: 0.75em;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 1.75em;
  min-height: 1.75em;
  padding: 0.25em;
  border-radius: 1.5em;
}

#cnav {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 100%;
}

.menu-system {
  filter: drop-shadow(2px 2px 4px rgba(0, 0, 0, 0.2));
  text-transform: uppercase;
  width: 100%;
  border-bottom-right-radius: var(--border-radius);
}

.menu-system li:last-child {
  border-bottom-right-radius: var(--border-radius);
}

.menu-system li a {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 1em 0.75em;
  font-size: var(--tamano-1);
  font-family: var(--fuente-generica);
  font-weight: 500;
  color: var(--color-blanco);
  background-color: inherit;
  border-radius: var(--border-radius);
  transition: all 0.2s ease-out;
}

.menu-system > li:hover > a, .menu-system > li > a.abierto {
  transform: translateX(0.5rem);
}

.menu-system li a i {
  font-size: 1.5em;
  text-align: center;
  width: 1.5em;
}

.menu-system ul li a {
  padding: 0.5em 1.5em;
}

.nav1 {background-color:#37B0A7; width:14%;}
.nav1 .submenu_navegacion {background-color:#37B0A7;}
.nav2 {background-color:#FFC000;}
.nav2 .submenu_navegacion {background-color:#FFC000;}
.col_nav2 {color:#FFC000;}
.nav3 {background-color:#FF9406;}
.col_nav3 {color:#FF9406;}
.nav3 .submenu_navegacion {background-color:#FF9406;}
.nav4 {background-color:#9ED201;}
.col_nav4 {color:#9ED201;}
.nav4 .submenu_navegacion {background-color:#9ED201;}
.nav5 {background-color:#68CA05;}
.col_nav5 {color:#68CA05;}
.nav5 .submenu_navegacion {background-color:#68CA05;}
.nav6 {background-color:#00D09C;}
.col_nav6 {color:#00D09C;}
.nav6 .submenu_navegacion {background-color:#00D09C;}
.nav11 {background-color:#00D2D1;}
.col_nav11 {color:#00D2D1;}
.nav11 .submenu_navegacion {background-color:#00D2D1;}
.nav7 {background-color:#0084B4;}
.col_nav7 {color:#0084B4;}
.nav7 .submenu_navegacion {background-color:#0084B4;}
.nav12 {background-color:#006A93;}
.nav12 .submenu_navegacion {background-color:#006A93;}
.nav8 {background-color:#003267;}
.col_nav8 {color:#003267;}
.nav8 .submenu_navegacion {background-color:#003267;}
.nav10 {background-color:#330065;}
.col_nav10 {color:#330065;}
.nav10 .submenu_navegacion {background-color:#330065;}
.nav9 {background-color:#9387CC;}
.nav9 .submenu_navegacion {background-color:#9387CC;} 
.nav13 {background-color:#30B5E5;}
.col_nav13 {color:#30B5E5;}
.nav13 .submenu_navegacion {background-color:#30B5E5;}
.nav14 {background-color:#0B9FD3;}
.col_nav14 {color:#0B9FD3;}
.nav14 .submenu_navegacion {background-color:#0B9FD3;}

.txtnav {color:#FFF !important;}

#cnav.cp {background:var(--color-primario);}

.nav1 a {padding: 1.25em 10% 1.25em 12%;width:78%;}
.nav1 a.padlr5p {padding: 1.35em 5% 1.35em 5%;}

#navegacion li a.pad0 {padding:0;}
.menu-system ul li a:hover {
  transform: translateX(4px);
  opacity: 0.875;
}
#navegacion .txtnav {display:inline;padding: 0 0 0 .5em;  }

#navegacion.navweb #logotipo_int {display:none;}

#logo-mv {display:none;}

#mcab li.usuario_int {width:auto;}

#mcab li.li_pitaghoras img {width: 30px; margin-top:-5px;}
  
#mcab li .num_avisos, #mcab li .num_msgbz {
  position: absolute;
  top: 6px;
  right: 3px;
  background: #B20000;
  color: #FFF;
  font-size: 11px;
  padding: 3px;
  border-radius: 50%;
  width: 14px;
  height: 14px;
  text-align: center;
}
#mdesp_admin {
	padding:0.875em 0;
	width:14%;
}

.config-on {
	color:#FF9100;
}
		
.config-off {
	color:#A2A1A1;
}
		
/* ------------------------------ prompt ------------------------------ */
#popup_container {min-width:240px;max-width:480px;}
.a_cerrarvw span {background: transparent url("../imgs/bt_cerrar.gif") no-repeat 0 0;position:absolute;top:0;right:0;width:16px; height:16px;}

/*************************************************************************/

.pdf_object {
	height: 600px;
}

.pdf_object p {
   padding:1em;
}

.pdf_object object {
   display:block;
}

.mapa_alojamiento {
  height:600px;
  width:100%;  
}

/* ------------------------------ comercio ------------------------------ */

.cont-arti {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

#carrito_compra {
 box-shadow: 0 3px 6px 0 rgb(0 0 0 / 25%);
 background:#FFF; 
 display:none;
 position:absolute; 
 top:3em;
 right:0;
 width:25em;
 padding:1em 5%;
 z-index:100;
}

.comercio-pasos {
  width: 100%;
  margin: 3rem 0 5rem;
  display: flex;
  justify-content: space-between;
}

.comercio-paso, .comercio-paso > a {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.5rem;
}

.comercio-paso {
  --tamano-circulo-paso: 20px;
  --color-comercio-paso: var(--color-primario);
  --color-comercio-paso-texto: var(--color-primario);

  position: relative;
  flex: 1;
}

.comercio-paso.paso--activo ~ .comercio-paso {
  --color-comercio-paso: var(--color-gris-claro);
  --color-comercio-paso-texto: var(--color-sobre-fondo);
}

.comercio-paso:first-of-type {
  width: min-content;
  flex: unset;
}

.comercio-paso:not(:first-of-type)::before {
  content: "";
  position: absolute;
  top: calc(var(--tamano-circulo-paso) / 2);
  right: calc(var(--tamano-circulo-paso) / 5);
  display: block;
  width: 101%;
  height: calc(var(--tamano-circulo-paso) / 3);
  background-color: var(--color-comercio-paso);
  transform: translateY(-50%);
}

.comercio-paso__icono {
  position: relative;
  width: var(--tamano-circulo-paso);
  height: var(--tamano-circulo-paso);
  border-radius: 50%;
  background-color: var(--color-comercio-paso);
  border: 3px solid var(--color-fondo);
  z-index: 1;
}

.comercio-paso__texto {
  position: absolute;
  top: 150%;
  font-size: var(--tamano-1);
  color: var(--color-comercio-paso-texto);
  font-weight: 600;
  white-space: nowrap;
}

.comercio-paso:not(:first-of-type):not(:last-of-type) .comercio-paso__texto {
  right: calc(var(--tamano-circulo-paso) / 2);
  transform: translateX(50%);
  text-align: center;
}

.comercio-paso:first-of-type .comercio-paso__texto {
  left: 0;
}

.comercio-paso:last-of-type .comercio-paso__texto {
  left: unset;
  right: 0;
  text-align: right;
}

#comercio_pasos {
	width:100%;
	padding:0;
}

#comercio_pasos li {
	width:25%;
	padding:.5em 0;
}

#comercio_pasos .texto {
	font-size:1em;
	font-weight:bold;
	width:80%;
  margin:0 10%;
	color:#999;
	padding-bottom:1em;
}

#comercio_pasos .texto:before {
	content:"";
	position:absolute;
	bottom:0;
	left:40%;
	width:20%;
	border-bottom:2px solid #DDD;
}

#comercio_pasos li.act .texto:before, #comercio_pasos li.activo .texto:before {
	border-bottom:2px solid var(--color-primario);
}

#comercio_pasos li.act .texto, #comercio_pasos li.activo .texto {
	 color:var(--color-primario) !important;
}

#comercio_pasos .num { margin-bottom:1em;}

#comercio_pasos .num .fa {
  border:3px solid #CCC;
  -webkit-border-radius:50px;
  -moz-border-radius:50px;
  border-radius:50px;
  background:#FFF;
  color:#999;
  padding:15px 15px;
  width:35px;
  height:35px;
  font-size:30px;
}

#comercio_pasos .num.paso1 .fa { 
	border:3px solid var(--color-primario);
  color:var(--color-primario);
}

#comercio_pasos li.act .num .fa, #comercio_pasos li.activo .num .fa { 
	border:3px solid var(--color-primario);
  background:var(--color-primario);
  color:var(--color-sobre-primario);
}

#comercio_pasos .num:before{
  right:0;
  content:"";
  position:absolute;
  top:45%;
  width:39%;
  border-bottom:5px solid #DDD;
}
  
#comercio_pasos .num:after{
  left:0;
  content:"";
  position:absolute;
  top:45%;
  width:39%;
  border-bottom:5px solid #DDD;
}

#comercio_pasos li.act .num:before, #comercio_pasos li.act .num:after {
	 border-bottom:5px solid var(--color-primario);
}

#comercio_pasos li.activo .num:after {
	 border-bottom:5px solid var(--color-primario);
}

#comercio_pasos li.activo .num .fa {
	background:var(--color-primario);
	color:var(--color-sobre-primario);
}

#comercio_pasos .num.paso1:after {
	border-bottom:none !important;
}

#comercio_pasos .num.paso4:before {
	border-bottom:none !important;
}

.tabla_comercio{
	box-shadow: 0 3px 6px 0 rgb(0 0 0 / 25%);
}

.tabla_comercio th {
  background: #f9fafb;
  border-bottom: 1px solid #E7E7E7;
}

.tabla_comercio .fa-trash-o.col_ng9:hover {color:#000 !important;}

.tabla_comercio input {
  padding: 5px 0;
  height: 25px;
  border: 1px solid #E7E7E7;
 }
 
.tabla_comercio .decrem {
	border: 1px solid #E2E2E2;
	border-right: none;
	height: 19px;
	width: 25px;
	text-align: center;
	padding: 8px 0 8px 0;
	font-size: 30px;
	vertical-align: top;
	display: block;
	line-height: 15px;
}

.tabla_comercio .increm {
  border: 1px solid #E2E2E2;
  border-left: none;
  height: 19px;
  width: 25px;
  text-align: center;
  padding: 10px 0 6px 0;
  font-size: 25px;
  vertical-align: top;
  display: block;
  line-height: 15px;
}

.tabla_comercio .decrem:hover, .tabla_comercio .increm:hover { color:var(--color-primario);}

.tabla_comercio td.ccol1 {
	display: flex;
  align-items: center;
}

.cont-arti .fot_izq { 
	width:27%; 
	margin: 0 3% 0 0; 
}

.cont-arti .fot_der img, .cont-arti .fot_izq img { width:100%;}

#promocode {  box-shadow: 0 3px 6px 0 rgb(0 0 0 / 25%); }

#promocode input#hpromo { padding:9px; }


/* ------------------------------ chats ------------------------------ */

.chatpriv {
 background-color:#FFF;
 position:absolute;
 top:0;
 left:0; 
}

/* DATEPICKER */
.cab_datepicker{background-color:#EEEEEE;width:228px;margin:30px 0 0 0;}
.ui-datepicker-header{border:1px solid #999999;border-bottom:none;float:left;font-size:12px;position:relative;padding:5px;width:215px;}
.ui-datepicker-title {border:1px solid #999999;background-color:#FFF;position:relative;float:left;width:172px;text-align:center;}
.ui-datepicker-calendar {border:1px solid #999999;border-top:none;background-color:#EEEEEE;padding:5px;z-index:99999;margin-top:0 !important;width:229px;}
.ui-datepicker-calendar td {border:1px solid #EEEEEE;text-align:center;font-family:Trebuchet MS, sans-serif;font-size:12px;padding:1px 3px;background-color:#FFF;}
.ui-datepicker-calendar tr.monthLabel td {background-color:#FFFFFF;border:1px solid #999999;font-weight:bold;}
.ui-datepicker-calendar tr.navigation td {cursor:pointer;}
.ui-datepicker-calendar tr.navigation td:hover {text-decoration:underline;}
.ui-datepicker-calendar th {border:1px solid var(--color-primario);background-color:var(--color-primario);color:var(--color-sobre-primario);font-weight:bold;font-size:12px;}
.ui-datepicker-calendar td.day, .datepickerControl td.dayothermonth {cursor:pointer;background-color:#FFFFFF;border:1px solid #EEEEEE;width:2em;}
.ui-datepicker-calendar td.dayothermonth {color:#999999;font-style:italic;}
.ui-datepicker-calendar td.day:hover {background-color:#EBE4C0;}
.ui-datepicker-calendar td.hour {cursor:pointer;background-color:#FFFFFF;border:1px solid #EEEEEE;width:2em;}
.ui-datepicker-calendar td.minute {cursor:pointer;background-color:#FFFFFF;border:1px solid #EEEEEE;width:2em;}
.ui-datepicker-calendar td input,
.ui-datepicker-calendar td button {font-size:11px;padding:0;border:1px solid #999999;text-align:center;}
.ui-datepicker-calendar td.ampm {cursor:pointer;background-color:#CCCCCC;border:1px solid #EEEEEE;width:2em;}
.ui-datepicker-calendar td.current {font-weight:bold;background-color:var(--color-primario);color:var(--color-sobre-primario);}
.ui-datepicker-calendar input.current {background-color:var(--color-primario);color:var(--color-sobre-primario);}
.ui-datepicker-calendar td.current:hover {background-color:var(--color-primario);color:var(--color-sobre-primario);}
.ui-datepicker-calendar {width:227px;height:140px;margin-top:0;}
.ui-datepicker-calendar td.ui-datepicker-week-end {background-color:var(--color-neutro);color:var(--color-sobre-neutro);}
.ui-datepicker-calendar td.ui-datepicker-today {background-color:var(--color-primario);color:var(--color-sobre-primario);}
.ui-datepicker-calendar td.ui-datepicker-today a {color:var(--color-sobre-primario);}
.ui-datepicker-next {position:relative;float:right;height:12px;width:20px;}
.ui-datepicker-prev {position:relative;float:left;height:12px;width:20px;}
.ui-datepicker-next span {background:#EEE url("../imgs/ic_datepicker_next.png") no-repeat 0 0;display:block;height:12px;left:0;position:absolute;top:2px;width:20px;}
.ui-datepicker-prev span{background:#EEE url("../imgs/ic_datepicker_prev.png") no-repeat 0 0;display:block;height:12px;left:0;position:absolute;top:2px;width:20px;}
.ui-datepicker-trigger {margin:0 0 0 5px;}
.ui-datepicker-current-day {background:var(--color-barra) !important;}

#formbuscaropc .ui-datepicker-trigger { float:left;position:relative; margin:0 .5em 0 0;}

#totalprec_fixed {display:none;}

#totalprec_fixed.total_bottom {
  position:fixed;
  bottom:0;
  left:0;
  background:var(--color-primario);
  color:var(--color-sobre-primario);
  padding:1em 2%;
  text-align:center;
  z-index:10000;
  width: 96%;
}

#totalprec_fixed.total_top {
  background:var(--color-primario);
  color: var(--color-sobre-primario);
	position:relative;
	float:left;
	padding:1em 2%;
	width:96%;
	text-align:center;
	box-shadow:0 5px 10px 0 #888888;
	margin-bottom:1em;
}

.txerror {
	color:#FF0000;
	font-size:var(--tamano-2);
}

.video-container {
   position: relative;
   height: 0px;
   width: 100%;   
   padding-bottom: 56.25%;
}

/* fondo destacado */
.cs .video-container {
  margin: 1em auto;
  width: 96%;
}
 
.video-container iframe,
.video-container object,
.video-container embed {
   position: absolute !important;
   top: 0px;
   left: 0px;
   width: 100%;
   height: 100%;
}

.pdf_object iframe{
   width: 100%;
   height: 600px;
}


/* --- AMPLIACIONES --- */

.tinymce-editor {
  padding: 12px 16px !important;
  --tamano-1: 0.75rem;
  --tamano-2: 0.875rem;
  --tamano-3: 1rem;
  --tamano-4: 1.25rem;
  --tamano-5: 1.75rem;
}

:is(.ampliacion__txt, .tiny-txt) > * + * {
  margin-top: 1rem;
}

:is(.ampliacion__txt, .tiny-txt) ul  {
  list-style: initial;
}

:is(.ampliacion__txt, .tiny-txt) ol {
  list-style: decimal;
}

:is(.ampliacion__txt, .tiny-txt) :is(ul, ol) {
  padding-left: 1.5rem;
}

:is(.ampliacion__txt, .tiny-txt) :is(ul, ol) li {
  list-style-position: outside;
}


/* --- REDES SOCIALES --- */

.redes-sociales {
	display: flex;
	align-items: center;
	gap: 0.75rem;
}

.redes-sociales li a {
  font-size: var(--tamano-3);
}


/* --- ENCABEZADO (FOTO APARTADO, TITULO CONTENIDO, RUTA...) --- */

.encabezado {
  position: relative;
  width: 100%;
  background-color: var(--color-secundario);
  color: var(--color-sobre-secundario);
}

.encabezado::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.encabezado__foto {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.encabezado__foto::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background-color: rgba(0, 0, 0, 0.5);
}

.encabezado__foto img, .encabezado__foto video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.encabezado__info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 0.5rem;
  padding: 1rem 2rem;
  box-sizing: border-box;
}

.encabezado__foto + .encabezado__info {
  color: white;
  min-height: clamp(240px, 18vw, 400px);
  margin-bottom: 4rem;
}

.encabezado__titulo {
  color: inherit;
  width: auto;
  font-weight: 700;
}

.encabezado__descripcion {
  max-width: 900px;
}

.encabezado__descripcion ul {
  list-style: initial;
}

.encabezado__descripcion ol {
  list-style: decimal;
}

.encabezado__descripcion :is(ul, ol) {
  padding-left: 1.5rem;
}

.encabezado__descripcion :is(ul, ol) li {
  list-style-position: outside;
}


/* --- MIGAS / RUTA APARTADO --- */

.migas {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: var(--tamano-1);
}

.migas__menu li {
  display: flex;
  align-items: center;
}

.migas__menu li:not(:last-of-type)::after {
  content: ">";
  display: inline-block;
  width: 0.75rem;
  text-align: center;
}

.migas__menu li a {
  padding: 0.125em 0.375em;
  border-radius: var(--border-radius);
}

.migas__menu li a:hover {
  background-color: var(--color-fondo-contraste);
  color: var(--color-sobre-fondo-contraste);
}

.migas__menu li a[href="#"] {
  pointer-events: none;
}


/* --- COMPARTIR --- */

.compartir {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  width: 100%;
  margin: 2rem 0;
}

.compartir__titulo {
  font-size: var(--tamano-2);
}

.compartir__redes {
  display: flex;
  align-items: center;
  font-size: var(--tamano-4);
  gap: 0.75em;
}


/* --- DESTACADOS --- */

.destacados-listado {
  width: 100%;
  margin: 4rem 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2rem;
  position: relative;
}

.destacado {
  position: relative;
  overflow: hidden;
  border-radius: var(--border-radius);
  overflow: hidden;
}

.destacado__icono {
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  border-radius: var(--border-radius);
  overflow: hidden;
}

.destacado__icono img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.5s ease-out;
}

.destacado__icono:hover img {
  transform: scale(1.1);
}

.destacado__info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
  padding: 1.5rem 0 0;
}

.destacado__tit {
  margin: 0;
  font-weight: 600;
  font-size: var(--tamano-3);
}

.destacado.destac {
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.25);
}

.destacado.fondo-destacado .destacado__info {
  margin-top: 0;
  padding: 1.5rem;
}

.destacado.fondo-destacado .destacado__icono {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}


/* --- PRODUCTOS --- */

.contenido-listado .columna.producto {
  box-shadow: unset;
}

.columna.producto .contenido-columna {
  gap: 1.5rem;
  flex: 1;
}

.col1 .columna.producto {
  gap: max(2rem, 4vw);
}

.col1 .producto .fot-min,
.col2 .producto .fot-min {
  border-radius: 0;
  width: min(400px, 30%);
  padding-top: min(400px, 30%);
}

.col3 .producto:not(.columna--desplegada),
.col4 .producto:not(.columna--desplegada),
.col5 .producto:not(.columna--desplegada) {
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.col3 .producto .fot-min,
.col4 .producto .fot-min,
.col5 .producto .fot-min {
  width: min(280px, 80%);
  padding-top: min(280px, 80%);
}

.col3 .producto .contenido-columna,
.col4 .producto .contenido-columna,
.col5 .producto .contenido-columna {
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 2rem 0.5rem 1rem;
}

.producto .fot-min img {
  object-fit: contain;
}

.producto__form-comprar {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1rem;
}

.contenido-producto {
  width: 100%;
}

.lista-articulos {
  width: 100%;
}


/* --- CENTROS --- */

.centro-contenido {
  display: flex;
  flex-wrap: wrap;
  gap: 3rem;
  max-width: 100%;
}

.centro-contenido > .tit {
  width: 100%;
}

.centro__columna-izquierda {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3rem;
  flex: 1;
}

.centro__columna-derecha {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3rem;
  width: max(260px, 30%);
}

.centro__columna-derecha .tit {
  width: 100%;
  font-size: var(--tamano-3);
  padding-bottom: 0.5rem;
  margin-bottom: 0.25rem;
  border-bottom: 1px solid var(--color-fondo-contraste);
}

.centro__disponibilidad {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2rem;
}

.centro__disponibilidad__calendario {
  width: 100%;
}

.centro__informacion, .centro__localizacion {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.75rem;
}

.centro__dato {
  margin: 0;
}

.centro__servicios, .centro__sellos, .centro__entorno {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
}

.centro__servicios ul, .centro__sellos ul, .centro__entorno ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

.centro__servicios ul, .centro__entorno ul {
  flex-direction: column;
}

.centro__servicios ul li {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.centro__sellos ul {
  gap: 1.5rem;
}

.centro__sellos ul li img {
  height: 60px;
}

.centro__sellos ul li img + span {
  display: none;
}

.centro__galeria {
  width: 100%;
}

.centro__mapa {
  width: 100%;
}


/* --- BOTONES PIE --- */

.botones-navegacion {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin: 2rem 0;
}

.botones-navegacion .boton-imprimir {
  margin-left: auto;
}


/* --- OTRAS HERRAMIENTAS --- */

.bloque-administracion {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 100%;
  padding: 1.25rem 2rem;
  margin-top: 3rem;
  background-color: var(--color-fondo);
  color: var(--color-sobre-fondo);
  border: 2px solid var(--color-borde-contraste);
  border-radius: var(--border-radius);
}

.bloque-administracion__menu {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
}

.bloque-administracion__menu a {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  padding: 0.25em 0.5em;
  border-radius: var(--border-radius);
}

.bloque-administracion__menu a:hover {
  background-color: var(--color-fondo-contraste);
  color: var(--color-sobre-fondo-contraste);
}

.bloque-administracion__menu a .fa {
  font-size: 1.25em;
  color: var(--color-primario);
}

.otras-herramientas__bloque {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin: 3rem 0;
}

.otras-herramientas__menu {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
}

.otras-herramientas__menu a {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  padding: 0.25em 0.5em;
  border-radius: var(--border-radius);
}

.otras-herramientas__menu a:hover {
  background-color: var(--color-fondo-contraste);
  color: var(--color-sobre-fondo-contraste);
}

.otras-herramientas__menu a .fa {
  font-size: 1.25em;
  color: var(--color-primario);
}


/* --- PREFOOT --- */

.prefoot {
  width: 100%;
  padding: 4rem 0;
  background-color: var(--color-primario);
  color: var(--color-sobre-primario);
}

.prefoot .centrado {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 2rem;
}

.prefoot-logo {
  max-width: 200px;
}

.prefoot-logo img {
  width: 100%;
}

.prefoot-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2rem;
  font-size: var(--tamano-1);
}

.prefoot-info__tit {
  font-size: var(--tamano-5);
  font-weight: 600;
  margin: 0;
	text-align: center;
	line-height: 1.1;
	max-width: 984px;
}

.prefoot-info__tit:not(:first-child) {
  margin-top: 1.5em;
}

.prefoot-info .redes-sociales {
	margin-top: 1.5rem;
  gap: 1.5rem;
}

.prefoot-info .redes-sociales li a {
  font-size: var(--tamano-4);
}

.menu-pie {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
}

.menu-pie > li > a {
  font-weight: 600;
}

.menu-pie .menu {
  flex-direction: column;
  gap: 0.25rem;
}

.boletin {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
}

.boletin__tit {
  font-size: var(--tamano-2);
  font-weight: 600;
  margin: 0;
}

.boletin__form {
  font-size: var(--tamano-1);
  width: 100%;
  position: relative;
  display: flex;
}

.boletin__form .boton {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.boletin__masinfo {
  margin: 0;
  font-size: 0.75rem;
  font-style: italic;
}


/* --- FOOT --- */

.foot {
  width: 100%;
  padding: 2rem 0;
  background-color: var(--color-fondo-contraste);
  color: var(--color-sobre-fondo-contraste);
}

.foot .centrado {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 2rem;
}

.foot .copy {
  flex-shrink: 0;
  font-size: var(--tamano-1);
}

.menu-legal {
  display: flex;
  justify-content: flex-end;
  gap: 1rem;
}

.menu-legal a {
  font-size: var(--tamano-1);
	font-weight: normal;
	text-transform: uppercase;
}

.foot-creditos {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.25rem;
  font-size: var(--tamano-1);
	font-weight: normal;
}

.foot-creditos a {
	display: inline-flex;
	align-items: center;
	gap: 0.25em;
	font-weight: 500;
  color: #F6BC25;
}

.foot-creditos a img {
	transition: all 0.25s ease-out;
}

.foot-creditos a:hover img {
	transform: translateX(2px);
}


/* --- BÚSQUEDA --- */

.busqueda-formulario {
  display: flex;
	align-items: flex-start;
  flex-wrap: wrap;
  gap: 2rem;
  width: 100%;
  padding: 1.5rem 2rem;
  margin-bottom: 3rem;
  background-color: var(--color-fondo-contraste);
  border-radius: var(--border-radius);
}

.busqueda-formulario fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

.busqueda-formulario fieldset legend {
  display: none;
}

.busqueda-formulario__texto, .busqueda-formulario__fechas {
  width: calc(50% - 1rem);
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.busqueda-formulario__contenidos {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

.busqueda-formulario__contenidos label {
  display: flex;
  align-items: center;
  gap: 0.5em;
  cursor: pointer;
}

.busqueda-formulario .boton {
  margin: 0 auto;
}


/* --- MENÚS --- */

/* --- MENÚ HORIZONTAL --- */

.menu-horizontal {
  width: 100%;
  margin: 0 0 4rem;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1rem;
}

.menu-horizontal ul {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.menu-horizontal li {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.menu-horizontal a {
  display: inline-flex;
  padding: 0.5em 1.25em;
  font-size: var(--tamano-2);
  background-color: var(--color-fondo-contraste);
  color: var(--color-sobre-fondo-contraste);
  border-radius: var(--border-radius);
  white-space: nowrap;
}

.menu-horizontal a.activo {
  background-color: var(--color-primario);
  color: var(--color-sobre-primario);
}

/* --- MENÚ LATERAL --- */

.menu-lateral {
  align-self: flex-start;
  width: max(230px, 20%);
  margin-right: min(3.5%, 3rem);
  display: flex;
  flex-direction: column;
  padding: 0;
}

.menu-lateral li {
  display: flex;
  flex-wrap: wrap;
}

.menu-lateral li a {
  flex: 1;
  display: inline-flex;
  padding: 0.5em 0;
  color: inherit;
  transition: all 0.2s ease-out;
}

.menu-lateral li ul {
  width: 100%;
}

.menu-lateral > li > a {
  font-weight: 500;
}

.menu-lateral li a.activo {
  color: var(--color-primario);
}

.menu-lateral li a:hover {
  color: var(--color-primario);
  transform: translateX(4px);
}

.menu-lateral ul {
  padding-left: 0.75rem;
  display: flex;
  flex-direction: column;
}

.menu-lateral .flecha {
  font-size: 1.25em;
  padding: 0.5em;
  cursor: pointer;
  display: none;
}

.menu-lateral .flecha::before {
  display: inline-block;
  transition: all 0.5s ease-out;
}

.menu-lateral .flecha.abierto::before {
  transform: rotateX(180deg);
}

/* --- MENÚ SOLAPAS --- */

.menu-solapas {
  position: relative;
  width: 100%;
  padding: 0 0.75rem;
  margin: 2rem 0;
  display: flex;
  gap: 0.5rem;
  overflow-x: auto;
}

.menu-solapas::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background-color: var(--color-borde-contraste);
}

.menu-solapas li {
  display: flex;
  align-items: flex-end;
  gap: 0.5rem;
}

.menu-solapas li a {
  display: inline-flex;
  white-space: nowrap;
  font-size: var(--tamano-1);
  padding: 0.75em 1.25em;
  border: 1px solid var(--color-borde-contraste);
  border-bottom-color: transparent;
	border-top-left-radius: var(--border-radius);
	border-top-right-radius: var(--border-radius);
}

.menu-solapas a:hover {
  background-color: var(--color-fondo-contraste);
  color: var(--color-sobre-fondo-contraste);
}

.menu-solapas a.activo {
  background-color: var(--color-primario);
  color: var(--color-sobre-primario);
}

.menu-solapas ul {
  display: inline-flex;
  gap: 0.5rem;
}

.menu-solapas ul li a {
  padding: 0.5em 1.25em;
}

/*------------------------- GENERAL_BLOQUES.CSS (fin) --------------------------------*/
/* -------------------------------------------------------------------- */

.galeria, .galeria-navegacion {
  max-width: 100%;
}

.galeria .galeria__imagen {
  position: relative;
  overflow: hidden;
}

.galeria .galeria__imagen img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.galeria-navegacion img {
  cursor: pointer;
}

.bloques-rotar-galeria {
	position: relative;
  float: left;
  min-height: 232px;
  margin-top:1em;
}

.bloques-rotar-galeria img{ width:100% !important;}
/*------------------------- CARRUSEL.CSS (fin) --------------------------------*/
/* -------------------------------------------------------------------- */
/* ---------------------- FORMULARIOS.CSS (inicio) (no herramienta) ------------------------------ */

.titform {
  clear: both;
  position: relative;
  float: left;
  width: 99%;
  margin: 0 0 .5em 0;
  padding: 0;
  font-size: var(--tamano-2);
  text-align: left;
  color: var(--color-generico);
}

.txt_avisopeso {
  color: var(--color-destacado);
}

.errorform {
  position: relative;
  float: left;
  color: #FFF;
  font-size: var(--tamano-2);
  padding: .3em;
  margin: 0;
}

.formulario #fset1 {
  border: none;
  padding: 1.0em 0 0 0;
}

.formulario #fset1 legend {
  margin: 0 0 1em 0;
  padding: 0;
}

.fset {
  position: relative;
  float: left;
  margin: 0;
  padding: 0;
  border: 1px solid var(--color-neutro);
  padding: 0 0 .5em 0;
  width: 99%;
  overflow: hidden;
}

.fset legend {
  position: relative;
  float:left;
  margin: 0 0 .5em 0;
  padding: .5em 0;
  background-color: var(--color-secundario);
  font-family: var(--fuente-generica);
  font-size: var(--tamano-4);
  color: var(--color-sobre-secundario);
  width: 100%;
  text-align: center;
}

.lineaf, .lineachk {
  position: relative;
  float: left;
  margin: 0 0 .5em 0;
  padding: 0;
  width: 100%;
  clear: both;
}

.lineafset {
  clear: both;
  position: relative;
  float: left;
  width: 94%;
  margin: 0 0 .625em 0;
  padding: 0 1em;
}

.lineaftab {
  position: relative;
  float: left;
  margin: 0 0 .5em 0;
  padding: 0 0 0 1em;
  width: 95%;
  clear: both;
}

.lineafdest {
 position:relative;
 float:left;
 margin:0 0 1em 0;
 padding:.5em;
 font-size: var(--tamano-2);
 background-color: var(--color-neutro);
 color: var(--color-sobre-neutro);
 width:97%;
}

.formulario span.ftxt {
  position:relative;
  float:left;
  margin:0;
  padding:0;
  color: var(--color-generico);  
  font-size: var(--tamano-2);
}

.formulario input.cajaantispam {
  border: .1em solid var(--color-generico);
  background-color: #FFF;
}

fieldset.fsetoculto {
  border: none;
  margin:0;
  padding:0;
}

.cajaf {
  position: relative;
  float: left;
  width: 68%;
  margin: 0;
  padding: .5em .5em;
  font-size: var(--tamano-2);
}

.lbl {
  display: block;
  position: relative;
  float: left;
  margin: 0 .2em .2em 0;
  padding: .25em 0;
  width: 30%;
  font-size: var(--tamano-2);
}

label.oculto {
  display: none;
}

/* ---------------------- FORMULARIOS.CSS (fin) (no herramienta) ------------------------------ */
/* -------------------------------------------------------------------- */
/*----------------------- CALENDARIO.CSS (inicio) --------------------------------*/

.fila_cal {
  clear: both;
  position: relative;
  float: left;
  width: 100%;
  margin: 0 0 1em 0;
  padding: 0;
}

.fecha_cal {
  clear: both;
  position: relative;
  float: left;
  width: 100%;
  margin: 0 0 .3em 0;
  padding: 0;
  color: var(--color-generico);
  font-size: .6875em;
}

/* ------------------------------------------------------------ */

.calendario-plantilla {
  margin-bottom: 2rem;
}

.calendario-plantilla .contenido-listado {
  gap: 1.5rem;
}

.calendario-plantilla .contenido-listado .columna {
  border-radius: var(--border-radius);
}

.calendario__dia {
  display: block;
  background-color: var(--color-fondo);
  color: var(--color-sobre-fondo);
  font-size: var(--tamano-2);
  margin: 0;
  padding: 0.5rem 0.25rem;
  text-align: center;
}

.calendario__dia:hover {
  background-color: var(--color-fondo-contraste);
  color: var(--color-sobre-fondo-contraste);
}

.calendario__dia.calendario__dia--actual {
  background-color: var(--color-fondo-contraste);
  color: var(--color-sobre-fondo-contraste);
  font-weight: 700;
}

.calendario__dia.calendario__dia--eventos {
  background-color: var(--color-primario);
  color: var(--color-sobre-primario);
}

.calendario {
  position: relative;
  margin: 0 auto;
  width: 100%;
  border-spacing: 0;
  empty-cells: hide;
  border-collapse: collapse;
}

.calendario caption {
  background-color: var(--color-primario);
	color: var(--color-sobre-primario);
  margin: 0 auto;
  padding: 0.5rem 0;
  font-size: var(--tamano-2);
  font-weight: bold;
}

.calendario caption a {
	margin: 0 0.75em;
}

.calendario th {
  font-size: var(--tamano-2);
  padding: 0.5rem 0;
  font-weight: bold;
}

.calendario th abbr[title] {
	text-decoration: none;
}

.calendario img {
  margin: 0;
  padding: 0;
  width: 1rem;
  height: 1rem;
  object-fit: contain;
}

/*----------------------- CALENDARIO.CSS (fin) --------------------------------*/

/*----------------------- SLICK.CSS (inicio) --------------------------------*//* Slider */
.slick-slider {
	position: relative;
	display: block;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-ms-touch-action: initial;
	touch-action: initial;
	-webkit-tap-highlight-color: transparent;
}

.slick-list {
	position: relative;
	overflow: hidden;
	display: block;
	margin: 0;
	padding: 0;
}

.slick-list:focus {
	outline: none;
}

.slick-list.dragging {
	cursor: pointer;
	cursor: hand;
}

.slick-slider .slick-list, .slick-track, .slick-slide, .slick-slide img {
	-webkit-transform: translate3d(0, 0, 0);
	-moz-transform: translate3d(0, 0, 0);
	-ms-transform: translate3d(0, 0, 0);
	-o-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}

.slick-track {
	position: relative;
	left: 0;
	top: 0;
	display: flex;
	zoom: 1;
}

.slick-track::before, .slick-track::after {
	content: "";
	display: table;
}

.slick-track::after {
	clear: both;
}

.slick-loading .slick-track {
	visibility: hidden;
}

.slick-slide {
	height: 100%;
	min-height: 1px;
	display: none;
}

.slick-slide img {
	display: block;
	width: 100%;
}

.slick-slide.slick-loading img {
	display:none;
}

.slick-slide.dragging img {
	pointer-events: none;
}

.slick-initialized .slick-slide {
	display: block;
}

.slick-loading .slick-slide {
	visibility: hidden;
}

.slick-vertical .slick-slide {
	display: block;
	height: auto;
	border: 1px solid transparent;
}


/* --- Flechas --- */

.slick-prev, .slick-next {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  background: transparent;
  color: transparent;
  font-size: 0;
  padding: 0 2rem;
  border: none;
  outline: none;
  z-index: 10;
}

.slick-prev:focus, .slick-next:focus {
  outline: none;
}

.slick-prev.slick-disabled, .slick-next.slick-disabled {
  cursor: unset;
}

.slick-prev.slick-disabled::before, .slick-next.slick-disabled::before {
  opacity: 0.25;
}

.slick-prev::before,
.slick-next::before {
  font-family: "FontAwesome";
  font-size: 2.5rem;
  color: white;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: .75em;
  height: .5em;
	padding: 1.25rem;
  border-radius: 50%;
  background-color: rgba(0, 0, 0, 0.4); /* fondo oscuro semitransparente */
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.5); /* sombra para destacar */
  border: 1px solid rgba(255, 255, 255, 0.3); /* borde claro sutil */
  transition: all 0.25s ease-out;
}


.slick-prev {
  top: 0;
  left: 0;
  width: 8%;
  height: 100%;
}

.slick-next {
  top: 0;
  right: 0;
  width: 8%;
  height: 100%;
}

.slick-prev::before {
  content: "\f104";
}

.slick-next::before {
  content: "\f105";
}

.slick-prev:not(.slick-disabled):hover::before {
  transform: translateX(-8px);
  background-color: rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.6);
}

.slick-next:not(.slick-disabled):hover::before {
  transform: translateX(8px);
  background-color: rgba(0, 0, 0, 0.6);
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.6);
}



/* --- Puntos --- */

.slick-slider {
	margin-bottom: 0;
}

.slick-dots, .slick-miniatura {
	position: absolute;
	box-sizing: border-box;
	left: 0;
	bottom: 2rem;
	width: 100%;
	margin: 0;
	padding: 0 10%;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 0.75rem;
}

.slick-dots li:only-child {
	display: none;
}

.slick-dots li button {
  border: 0;
  display: block;
  width: 15px;
  height: 15px;
  border-radius: 100%;
  line-height: 0;
  font-size: 0;
  cursor: pointer;
  outline: none;
  transition: all 0.2s ease;
  background-color: var(--color-gris-claro);

  /* Mejora de visibilidad */
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.4); /* sombra sutil */
  border: 1px solid rgba(255, 255, 255, 0.6); /* borde claro para contraste */
}


.slick-dots li button:hover {
  background-color: var(--color-primario);
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
}

.slick-dots li.slick-active button {
  transform: scale(1.125);
  background-color: var(--color-primario);
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.6);
  border: 1px solid rgba(255, 255, 255, 0.8);
}

.slick-dots li button:focus {
	outline: none;
}
/*----------------------- SLICK.CSS (fin) --------------------------------*/
/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */

/*----------------------- GENERAL_PROPIEDADES.CSS (inicio) --------------------------------*/
.invisible {
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.disabled {
  opacity: 0.25 !important;
  color: var(--color-sobre-fondo) !important;
  cursor: not-allowed !important;
}

.disabled * {
  color: inherit !important;
  cursor: not-allowed !important;
}

.oculto {display: none;}
.dbl {display: block;}
.dinl {display: inline;}
.dinl-bl {display: inline-block;}
.ohid { overflow: hidden;}
.psr {position:relative;}
.psa {position:absolute;}
.fl_l {float:left;}
.fl_r {float:right;}
.clb {clear:both;}
.oauto_y {overflow-y:auto;}
.oauto_x {overflow-x:auto;}

.cr_p {cursor:pointer;}

/* --------- tablas -----------------*/
.tb_colap {border-collapse:collapse;}
th {font-weight:normal;}

/* --------- bordes ------------------ */
.brcb {border: 1px solid var(--color-barra);}
.brcn {border: 1px solid var(--color-neutro);}
.brcn1 {border-top: 1px solid var(--color-neutro);}
.brcn2 {border-right: 1px solid var(--color-neutro);}
.brcn3 {border-bottom: 1px solid var(--color-neutro);}
.brcn4 {border-left: 1px solid var(--color-neutro);}
.brcn7 {border-bottom: 1px dotted var(--color-neutro);}
  
.brd {border: 1px solid;}
.brd1 {border-top: 1px solid;}
.brd2 {border-right: 1px solid;}
.brd3 {border-bottom: 1px solid;}
.brd4 {border-left: 1px solid;}

.brng1_1 {border-top:1px solid #EEE;}
.brng1_2 {border-right:1px solid #EEE;}
.brng1_3 {border-bottom:1px solid #EEE;}
.brng1_4 {border-left:1px solid #EEE;}

.primero { border: none;}

.brad5 {	
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
 
/* --------- Alineaciones, imágenes ------------------ */	

.va_m {vertical-align:middle;}
.va_t {vertical-align:top;}
.va_b {vertical-align:bottom;}
.va_s {vertical-align:sub;}
.va_sp {vertical-align:super;}
/* --------- listas ------------------ */
.lty_c {list-style-type: circle;}
.lty_s {list-style-type: square;}
.lty_n {list-style-type: none;}

/* --------- tamaños ------------------ */
.t1 {width: 1%;}
.t4 {width: 4%;}
.t5 {width: 5%;}
.t6 {width: 6%;}
.t8 {width: 8%;}
.t8_2 {width: 8.2%;}
.t10 {width: 10%;}
.t15 {width: 15%;}
.t16 {width: 16%;}
.t17_6 {width: 17.6%;}
.t18 {width: 18%;}
.t18_4 {width:18.4%;}
.t20 {width: 20%;}
.t22 {width: 22%;}
.t22_7 {width: 22.75%;}
.t23 {width: 23%;}
.t24 {width: 24%;}
.t25 {width: 25%;}
.t27 {width: 27%;}
.t28 {width: 28%;}
.t30 {width: 30%;}
.t31 {width: 31%;}
.t31_3 {width: 31.3%;}
.t32 {width: 32%;}
.t33 {width: 33%;}
.t35 {width: 35%;}
.t38_8 {width:38.8%;}
.t40 {width: 40%;}
.t44 {width: 44%;}
.t45 {width: 45%;}
.t47 {width: 47%;}
.t48 {width: 48%;}
.t48_5 {width: 48.5%;}
.t49 {width: 49%;}
.t50 {width: 50%;}
.t55 {width: 55%;}
.t59_2 {width:59.2%;}
.t60 {width: 60%;}
.t61 {width: 61%;}
.t62 {width: 62%;}
.t62 {width: 62%;}
.t65 {width: 65%;}
.t65_6 {width: 65.6%;}
.t66 {width: 66%;}
.t67 {width: 67%;}
.t68  {width: 68%;}
.t70 {width: 70%;}
.t74 {width: 74%;}
.t74_2 {width: 74.25%;}
.t75 {width: 75%;}
.t79_6 {width:79.6%;}
.t80 {width: 80%;}
.t84 {width: 84%;}
.t85 {width: 85%;}
.t86 {width: 86%;}
.t89_8 {width: 89.8%;}
.t90 {width: 90%;}
.t91 {width: 91%;}
.t91_5 {width: 91.5%;}
.t92 {width: 92%;}
.t93 {width: 93%;}
.t94 {width: 94%;}
.t95 {width: 95%;}
.t95_8 {width: 95.85%;}
.t96 {width: 96%;}
.t97 {width: 97%;}
.t98 {width: 98%;}
.t99 {width: 99%;}
.t100 {width: 100%;}

.wauto {width: auto !important;}

/* z-index */
.z1 {z-index:1;}
.z20 {z-index:20;}
	
/* --------- alturas ------------------ */

.h150 {height:9.375em;/*150px*/}
.h300 {height:18.75em;/*300px*/}

/* --------- paddings ------------------ */	
.pad0 {padding:0;}
.padl0 {padding-left:0;}
.padtb2 {padding-top:.1em;padding-bottom:.1em;}
.padl2 {padding-left:.1em;}
.pad2 {padding:.125em;}
.padtb2 {padding-top:.125em;padding-bottom:.125em;}
.padb3 {padding-bottom: .2em;}
.padt3 {padding-top: .2em;}
			
.pad4 {padding:.25em;}
.padtb4 {padding-top:.25em;padding-bottom:.25em;}
.padlr4 {padding-left:.25em;padding-right:.25em;}
.padtb5 {padding-top:.3em;padding-bottom:.3em;}
.padtb6 {padding-top:.375em;padding-bottom:.375em;}
.padt4 {padding-top: .25em;}
.padr4 {padding-right: .25em;}
.padb4 {padding-bottom: .25em;}
.padl4 {padding-left: .25em;}
.padtinf025 {padding: .25em 0; }

.pad8 {padding:.5em;}
.padtb8 {padding-top:.5em;padding-bottom:.5em;}
.padlr8 {padding-left:.5em;padding-right:.5em;}
.padt8 {padding-top: .5em;}
.padr8 {padding-right: .5em;}
.padb8 {padding-bottom: .5em;}
.padl8 {padding-left: .5em;}
  
.padt12 {padding-top: .75em;}
.padb12 {padding-bottom: .75em;}
.padl12 {padding-left: .75em;}
.padt13 {padding-top: .8em;}
  
.pad16 {padding:1em;}
.padtb16 {padding-top:1em;padding-bottom:1em;}
.padlr16 {padding-left:1em;padding-right:1em;}
.padt16 {padding-top: 1em;}
.padr16 {padding-right: 1em;}
.padb16 {padding-bottom: 1em;}
.padl16 {padding-left: 1em;}
.padr1p {padding-right: 1%;}

.pad20 {padding:1.25em;}
.padt20  {padding-top: 1.25em;}
.padtb20 {padding-top:1.25em;padding-bottom:1.25em;}
.padl20 {padding-left:1.25em;}
.pad24 {padding:1.5em;}
.padtb24 {padding-top:1.5em;padding-bottom:1.5em;}
.padt24 {padding-top: 1.5em;}
.padr24 {padding-right: 1.5em;}
.padb24 {padding-bottom: 1.5em;}
.padl24 {padding-left: 1.5em;}
.pad26 {padding:1.625em;}
.pad32 {padding:2em;}
.padt32 {padding-top: 2em;}
.padr32 {padding-right: 2em;}
.padb32 {padding-bottom: 2em;}
.padl32 {padding-left: 2em;}
.padtb32 {padding-top: 2em;padding-bottom:2em;}
.padl40 {padding-left:2.5em;}
.padl48 {padding-left: 3em;}
.padl64 {padding-left: 4em;}

.pad2p {padding:2%;}
.padl2p {padding-left:2%;}
.padr2p {padding-right:2%;}
.padlr2p {padding-left:2%;padding-right:2%;}
.pad4p {padding:4%;}
.padl4p {padding-left:4%;}
.padr4p {padding-right:4%;}
.padlr4p {padding-left:4%;padding-right:4%;}

.pad5p {padding:5%;}
.padl5p {padding-left:5%;}
.padr5p {padding-right:5%;}
.padlr5p {padding-left:5%;padding-right:5%;}
.padlr10p {padding-left:10%;padding-right:10%;}



/* --------- márgenes ------------------ */	  
.mar0 {margin:0;}
.marauto {margin:0 auto;}
.mart2 {margin-top: .125em;}

.marl0 {margin-left:0;}
.mart3 {margin-top: .1875em;}
.mart4 {margin-top: .25em;}
.marr4 {margin-right: .25em;}
.marb4 {margin-bottom: .25em;}
.marl4 {margin-left: .25em;}
.mart6{margin-top: .35em;}
.marb6 {margin-bottom:.35em;}

.martb8 {margin-top: .5em; margin-bottom: .5em;}
.marlr8 {margin-left: .5em; margin-right: .5em;}
.mart8 {margin-top: .5em;}
.marr8 {margin-right: .5em;}
.marb8 {margin-bottom: .5em;}
.marl8 {margin-left: .5em;}

.mart10 {margin-top: .625em;}
.marb10 {margin-bottom: .625em;}
.marr12 {margin-right: .75em;}
.marl12 {margin-left: .75em;}
.marb12 {margin-bottom: .75em;}
.mart12 {margin-top: .75em;}
.mart13 {margin-top: .8em;}

.martb16 {margin-top: 1em; margin-bottom:1em;}
.mart16 {margin-top: 1em;}
.marr16 {margin-right: 1em;}
.marb16 {margin-bottom: 1em;}
.marl16 {margin-left: 1em;}

.marl20 {margin-left: 1.25em;}

.mart32 {margin-top: 2em;}
.martb32 {margin-top: 2em;margin-bottom: 2em;}
.marb32 {margin-bottom: 2em;}
.marl32 {margin-left: 2em;}
.marr32 {margin-right: 2em;}
.mart48 {margin-top:48px;} /*área personal*/

.marlr2p {margin-left:2%;margin-right:2%;}
.marl2p {margin-left:2%;}
.marr2p {margin-right:2%;}
.marl3p {margin-left:3%;}
.marlr4p {margin-left:4%;margin-right:4%;}
.marl4p {margin-left:4%;}
.marlr5p {margin-left:5%;margin-right:5%;}

/* --------- fuentes ------------------ */	

.fw_200 {font-weight: 200;}
.fw_300 {font-weight: 300;}
.fw_400 {font-weight: 400;}
.fw_500 {font-weight: 500;}
.fw_600 {font-weight: 600;}
.fw_700 {font-weight: 700;}
.fw_800 {font-weight: 800;}
.fw_900 {font-weight: 900;}

.txt_b {font-weight: bold;}
.txt_n {font-weight: normal;}
.txt_em {font-style: italic;}
.txt_u {text-decoration: underline;}
.txt_up {text-transform: uppercase;}
.txt_c {text-transform: capitalize;}

.v_gr {font-family:var(--fuente-generica); font-size:var(--tamano-4); color:var(--color-generico);}
.v_grcd {font-family:var(--fuente-generica); font-size:var(--tamano-4); color:var(--color-destacado);}
.v_grcd2 {font-family:var(--fuente-generica); font-size:var(--tamano-4); color:var(--color-destacado2);}
.v_grinact {font-family:var(--fuente-generica); font-size:var(--tamano-4); color:var(--color-inactivo);}
.v_gract {font-family:var(--fuente-generica); font-size:var(--tamano-4); color:var(--color-activo);}
.v_grsobcn {font-family:var(--fuente-generica); font-size:var(--tamano-4); color:var(--color-sobre-neutro);}
.v_grsobcs {font-family:var(--fuente-generica); font-size:var(--tamano-4); color:var(--color-sobre-secundario);}
.v_grsobcp {font-family:var(--fuente-generica); font-size:var(--tamano-4); color:var(--color-sobre-primario);}
.v_tdest {font-size:var(--tamano-4)}

.v_norm {font-family:var(--fuente-generica); font-size:var(--tamano-1);}
/* norm --> necesario para estilos de navegacion.inc (este fichero se comparte con system y personal) */
.norm {font-family:var(--fuente-generica);font-size:var(--tamano-2);color:var(--color-generico);}
.norm {font-family:Lato,Arial,sans-serif;font-size:0.875em;color:var(--color-generico);}
.v_normcd {font-family:var(--fuente-generica); font-size:var(--tamano-2);}
.v_normcd2 {font-family:var(--fuente-generica); font-size:var(--tamano-2); color:var(--color-destacado2);}
.v_norminact {font-family:var(--fuente-generica); font-size:var(--tamano-2); color:var(--color-inactivo);}
.v_normact {font-family:var(--fuente-generica); font-size:var(--tamano-2); color:var(--color-activo);}
.v_normsobcp {font-family:var(--fuente-generica); font-size:var(--tamano-2); color:var(--color-sobre-primario);}
.v_normsobcs {font-family:var(--fuente-generica); font-size:var(--tamano-2); color:var(--color-sobre-secundario);}
.v_normsobcn {font-family:var(--fuente-generica); font-size:var(--tamano-2); color:var(--color-sobre-neutro);}
.v_normsobcb {font-family:var(--fuente-generica); font-size:var(--tamano-2); color: var(--color-sobre-barra);}
.v_tnorm {font-size:var(--tamano-2);}

.v_normm {font-family:var(--fuente-generica); font-size:var(--tamano-4); color:var(--color-generico);}
.v_normmcd {font-family:var(--fuente-generica); font-size:var(--tamano-4);}
.v_normmcd2 {font-family:var(--fuente-generica); font-size:var(--tamano-4); color:var(--color-destacado2);}
.v_normminact {font-family:var(--fuente-generica); font-size:var(--tamano-4); color:var(--color-inactivo);}
.v_normmact {font-family:var(--fuente-generica); font-size:var(--tamano-4); color:var(--color-activo);}
.v_normmsobcp {font-family:var(--fuente-generica); font-size:var(--tamano-4); color:var(--color-sobre-primario);}
.v_normmsobcs {font-family:var(--fuente-generica); font-size:var(--tamano-4); color:var(--color-sobre-secundario);}
.v_normmsobcn {font-family:var(--fuente-generica); font-size:var(--tamano-4); color:var(--color-sobre-neutro);}
  
.v_normcd2 a {color:var(--color-destacado2);}
.v_norminact a {color:var(--color-inactivo);}
.v_normact a {color:var(--color-activo);}
.v_normsobcp a {color:var(--color-sobre-primario);}
.v_normsobcs a {color:var(--color-sobre-secundario);}
.v_normsobcn a{color:var(--color-sobre-neutro);}
.v_normsobcb a {color: var(--color-sobre-barra);} 
  
.v_pq {font-family:var(--fuente-generica); font-size:var(--tamano-1); color:var(--color-generico);}
.v_pqcd {font-family:var(--fuente-generica); font-size:var(--tamano-1);}
.v_pqcd2 {font-family:var(--fuente-generica); font-size:var(--tamano-1); color:var(--color-destacado2);}
.v_pqinact {font-family:var(--fuente-generica); font-size:var(--tamano-1); color:var(--color-inactivo);}
.v_pqact {font-family:var(--fuente-generica); font-size:var(--tamano-1); color:var(--color-activo);}
.v_pqsobcp {font-family:var(--fuente-generica); font-size:var(--tamano-1); color:var(--color-sobre-primario);}
.v_pqsobcs {font-family:var(--fuente-generica); font-size:var(--tamano-1); color:var(--color-sobre-secundario);}
.v_pqsobcn {font-family:var(--fuente-generica); font-size:var(--tamano-1); color:var(--color-sobre-neutro);}

/* tamaños de fuentes */
.v_t1, .tamano-1 {font-size:var(--tamano-1);}
.v_t2, .tamano-2 {font-size:var(--tamano-2);}
.v_t3, .tamano-3 {font-size:var(--tamano-3);}
.v_t4, .tamano-4 {font-size:var(--tamano-4);}
.v_t5, .tamano-5 {font-size:var(--tamano-5);}

.fs_12 {font-size:.75em;}
.fs_14 {font-size:.875em;}
.fs_15 {font-size:.9375em;}
.fs_16 {font-size:1em;}
.fs_18 {font-size:1.125em;}
.fs_20 {font-size:1.25em;}
.fs_24 {font-size:1.5em;}
.fs_28 {font-size:1.75em;}
.fs_32 {font-size:2em;}

/* necesarios para el acceso a la administración que aparece cuando estas logueado.*/
.fs_0_9375 {font-size:.9375em;}
.fs_0_75 {font-size:.75em;}
.fs_1_25 {font-size:1.25em;}
.fs_2 {font-size:2em;}
.fs_3 {font-size:3em;}

 /* --------- colores y fondos ------------------ */  
.cb {background-color:var(--color-barra); color: var(--color-sobre-barra);}  
.cp {color:var(--color-sobre-primario);}
.cn {background-color:var(--color-neutro); color:var(--color-sobre-neutro);}
.cap {color:var(--color-sobre-primario);}
.cbot {background-color:var(--color-boton); color:var(--color-sobre-boton);}
	
.colgen {color: var(--color-generico);}
.colact {color: var(--color-activo);}
.colbot {color: var(--color-boton);}
.colovrbot {color: var(--color-over-boton);}
.colborbot {color: var(--color-borde-boton);}
.colovrborbot {color: var(--color-over-borde-boton);}
.colpri {color: var(--color-primario);}
.colsec {color: var(--color-secundario);}
.colneu {color: var(--color-neutro);}
.csbarra {color: var(--color-barra);}
.csobpri {color: var(--color-sobre-primario);}
.csobsec {color: var(--color-sobre-secundario);}
.csobneu {color: var(--color-sobre-neutro);}
.csobbarra {color: var(--color-sobre-barra);}
.csobbot {color: var(--color-sobre-boton);}

/* fondos no genéricos .bg_ng1 , .bg_ng2 ..etc */
.bg_ng1 {background-color:#FFF;}
.bg_ng2 {background-color:#FAFBFC;}

/* colores no genéricos */
.col_ng1 {color:#FFF !important;}
.col_ng1 .v_norm {color:#FFF !important;}
.col_ng2 {color:#85B200 !important;}
.col_ng3 {color:#999 !important;}
.col_ng4 {color:#B20000 !important;}
.col_ng5 {color:#000 !important;}
.col_ng6 {color:#FF0000 !important;}
.col_ng7 {color:#FFBF00 !important;}
.col_ng8 {color:#212121 !important;}
.col_ng9 {color:#7B7B7B !important;}


/* --- ESTRUCTURA --- */

.flex {display: flex;}
.flex-row {flex-direction: row;}
.flex-column {flex-direction: column;}
.justify-content-start {justify-content: flex-start;}
.justify-content-center {justify-content: center;}
.justify-content-end {justify-content: flex-end;}
.align-items-start {align-items: flex-start;}
.align-items-center {align-items: center;}
.align-items-end {align-items: flex-end;}
.justify-self-start {justify-self: flex-start;}
.justify-self-center {justify-self: center;}
.justify-self-end {justify-self: flex-end;}
.align-self-start {align-self: flex-start;}
.align-self-center {align-self: center;}
.align-self-end {align-self: flex-end;}
.flex-wrap {flex-wrap: wrap;}

.grid {display: grid;}
.grid-1 {grid-template-columns: repeat(1, minmax(0, 1fr));}
.grid-2 {grid-template-columns: repeat(2, minmax(0, 1fr));}
.grid-3 {grid-template-columns: repeat(3, minmax(0, 1fr));}
.grid-4 {grid-template-columns: repeat(4, minmax(0, 1fr));}
.grid-5 {grid-template-columns: repeat(5, minmax(0, 1fr));}
.grid-6 {grid-template-columns: repeat(6, minmax(0, 1fr));}

.gap-1 {gap: var(--espacio-1)}
.gap-2 {gap: var(--espacio-2)}
.gap-3 {gap: var(--espacio-3)}
.gap-4 {gap: var(--espacio-4)}
.gap-5 {gap: var(--espacio-5)}
.gap-6 {gap: var(--espacio-6)}
.gap-7 {gap: var(--espacio-7)}

.m-1 {margin: var(--espacio-1)}
.m-2 {margin: var(--espacio-2)}
.m-3 {margin: var(--espacio-3)}
.m-4 {margin: var(--espacio-4)}
.m-5 {margin: var(--espacio-5)}
.m-6 {margin: var(--espacio-6)}
.m-7 {margin: var(--espacio-7)}
.mt-1 {margin-top: var(--espacio-1)}
.mt-2 {margin-top: var(--espacio-2)}
.mt-3 {margin-top: var(--espacio-3)}
.mt-4 {margin-top: var(--espacio-4)}
.mt-5 {margin-top: var(--espacio-5)}
.mt-6 {margin-top: var(--espacio-6)}
.mt-7 {margin-top: var(--espacio-7)}
.mb-1 {margin-bottom: var(--espacio-1)}
.mb-2 {margin-bottom: var(--espacio-2)}
.mb-3 {margin-bottom: var(--espacio-3)}
.mb-4 {margin-bottom: var(--espacio-4)}
.mb-5 {margin-bottom: var(--espacio-5)}
.mb-6 {margin-bottom: var(--espacio-6)}
.mb-7 {margin-bottom: var(--espacio-7)}
.ml-1 {margin-left: var(--espacio-1)}
.ml-2 {margin-left: var(--espacio-2)}
.ml-3 {margin-left: var(--espacio-3)}
.ml-4 {margin-left: var(--espacio-4)}
.ml-5 {margin-left: var(--espacio-5)}
.ml-6 {margin-left: var(--espacio-6)}
.ml-7 {margin-left: var(--espacio-7)}
.mr-1 {margin-right: var(--espacio-1)}
.mr-2 {margin-right: var(--espacio-2)}
.mr-3 {margin-right: var(--espacio-3)}
.mr-4 {margin-right: var(--espacio-4)}
.mr-5 {margin-right: var(--espacio-5)}
.mr-6 {margin-right: var(--espacio-6)}
.mr-7 {margin-right: var(--espacio-7)}

.p-1 {padding: var(--espacio-1)}
.p-2 {padding: var(--espacio-2)}
.p-3 {padding: var(--espacio-3)}
.p-4 {padding: var(--espacio-4)}
.p-5 {padding: var(--espacio-5)}
.p-6 {padding: var(--espacio-6)}
.p-7 {padding: var(--espacio-7)}
.pt-1 {padding-top: var(--espacio-1)}
.pt-2 {padding-top: var(--espacio-2)}
.pt-3 {padding-top: var(--espacio-3)}
.pt-4 {padding-top: var(--espacio-4)}
.pt-5 {padding-top: var(--espacio-5)}
.pt-6 {padding-top: var(--espacio-6)}
.pt-7 {padding-top: var(--espacio-7)}
.pb-1 {padding-bottom: var(--espacio-1)}
.pb-2 {padding-bottom: var(--espacio-2)}
.pb-3 {padding-bottom: var(--espacio-3)}
.pb-4 {padding-bottom: var(--espacio-4)}
.pb-5 {padding-bottom: var(--espacio-5)}
.pb-6 {padding-bottom: var(--espacio-6)}
.pb-7 {padding-bottom: var(--espacio-7)}
.pl-1 {padding-left: var(--espacio-1)}
.pl-2 {padding-left: var(--espacio-2)}
.pl-3 {padding-left: var(--espacio-3)}
.pl-4 {padding-left: var(--espacio-4)}
.pl-5 {padding-left: var(--espacio-5)}
.pl-6 {padding-left: var(--espacio-6)}
.pl-7 {padding-left: var(--espacio-7)}
.pr-1 {padding-right: var(--espacio-1)}
.pr-2 {padding-right: var(--espacio-2)}
.pr-3 {padding-right: var(--espacio-3)}
.pr-4 {padding-right: var(--espacio-4)}
.pr-5 {padding-right: var(--espacio-5)}
.pr-6 {padding-right: var(--espacio-6)}
.pr-7 {padding-right: var(--espacio-7)}

.ratio-1-1 {aspect-ratio: 1 / 1;}
.ratio-3-2 {aspect-ratio: 3 / 2;}
.ratio-2-3 {aspect-ratio: 2 / 3;}
.ratio-4-3 {aspect-ratio: 4 / 3;}
.ratio-3-4 {aspect-ratio: 3 / 4;}
.ratio-16-9 {aspect-ratio: 16 / 9;}

.object-fit-cover {object-fit: cover;}
.object-fit-contain {object-fit: contain;}


/* --- PROPORCIONES --- */

.aspect_16_9 {aspect-ratio: 16 / 9;}
.aspect_4_3 {aspect-ratio: 4 / 3;}
.aspect_3_2 {aspect-ratio: 3 / 2;}
.aspect_1_1 {aspect-ratio: 1 / 1;}

.prop16_9 {padding-top: calc(100% / (16/9));}
.prop8_5 {padding-top: calc(100% / (8/5));}
.prop4_3 {padding-top: calc(100% / (4/3));}
.prop1_1 {padding-top: calc(100% / (1/1));}

/*----------------------- GENERAL_PROPIEDADES.CSS (fin) --------------------------------*/
/* -------------------------------------------------------------------- */
/* ---------------------- HEDITOR.CSS (HERRAMIENTA heditor) (inicio) -------------------- */

.blq_nv p,.blq_nv ul,.blq_nv ol {
  margin-bottom: .25em;
  padding-bottom: .25em;
}

.txa_l {
  text-align: left;
}

.txa_r {
  text-align: right;
}

.txa_c {
  text-align: center;
}

.txa_j {
  text-align: justify;
}

.txa_u {
  text-decoration: underline;
}
/* -------------------------------------------------------------------- */

/*------------------------- DINAMICO.CSS (inicio) --------------------------------*/

/*--------------------- general_bloques.css -----------------*/

/*------------------------- general_propiedades.css ---------------------------*/
.brcp {border: 1px solid var(--color-apartado);}
.brcp1 {border-top: 1px solid var(--color-apartado);}
.brcp2 {border-right: 1px solid var(--color-apartado);}
.brcp3 {border-bottom: 1px solid var(--color-apartado);}
.brcp4 {border-left: 1px solid var(--color-apartado);}
.brcp7 {border-bottom: 1px dotted var(--color-apartado);}
.brcs {border: 1px solid var(--color-apartado-claro);}
.brcs1 {border-top: 1px solid var(--color-apartado-claro);}
.brcs2 {border-right: 1px solid var(--color-apartado-claro);}
.brcs3 {border-bottom: 1px solid var(--color-apartado-claro);}
.brcs4 {border-left: 1px solid var(--color-apartado-claro);}
.brcs5 {border-top: 1px dotted var(--color-apartado-claro);}
.cp {background-color:var(--color-apartado); }
.cap {background-color: var(--color-apartado);}
.txcolap { color: var(--color-apartado-txt);}
.v_grcd {color:var(--color-apartado-txt);}
.v_normcd {color:var(--color-apartado-txt);}
.v_normcd a {color:var(--color-apartado-txt);}
.v_normmcd {color:var(--color-apartado-txt);}
.v_normmcd a {color:var(--color-apartado-txt);}
.v_pqcd {color:var(--color-apartado-txt);}

/*------------------------- general_bloques.css ---------------------------*/


/*------------------------- contenido.css ---------------------------*/
.tabla td.fondo{color: var(--color-apartado-claro-txt);}

/*------------------------- formularios.css ---------------------------*/
.errorform {background-color: var(--color-apartado-txt);}
.lineafdest {border-left: 4px solid var(--color-apartado);}

/*------------------------- calendario.css ---------------------------*/

/*------------------------- general_propiedades.css ---------------------------*/
.brcp {border: 1px solid var(--color-apartado);}
.brcp1 {border-top: 1px solid var(--color-apartado);}
.brcp2 {border-right: 1px solid var(--color-apartado);}
.brcp3 {border-bottom: 1px solid var(--color-apartado);}
.brcp4 {border-left: 1px solid var(--color-apartado);}
.brcp7 {border-bottom: 1px dotted var(--color-apartado);}
.brcs {border: 1px solid var(--color-apartado-claro);}
.brcs1 {border-top: 1px solid var(--color-apartado-claro);}
.brcs2 {border-right: 1px solid var(--color-apartado-claro);}
.brcs3 {border-bottom: 1px solid var(--color-apartado-claro);}
.brcs4 {border-left: 1px solid var(--color-apartado-claro);}
.brcs5 {border-top: 1px dotted var(--color-apartado-claro);}
.cp {background-color:var(--color-apartado); }
.cap {background-color: var(--color-apartado);}
.txcolap { color: var(--color-apartado-txt);}
.v_grcd {color:var(--color-apartado-txt);}
.v_normcd {color:var(--color-apartado-txt);}
.v_normcd a {color:var(--color-apartado-txt);}
.v_normmcd {color:var(--color-apartado-txt);}
.v_pqcd {color:var(--color-apartado-txt);}
/*------------------------- DINAMICO.CSS (fin) --------------------------------*/



/* --- ANIMACIONES --- */

@keyframes beat {
  0%, 90% {
      -webkit-transform: scale(1);
      transform: scale(1)
  }

  45% {
      -webkit-transform: scale(1.25);
      transform: scale(1.25);
  }
}

@keyframes bounce {
  0% {
      -webkit-transform: scale(1) translateY(0);
      transform: scale(1) translateY(0);
  }
  10% {
      -webkit-transform: scale(1.1, 0.9) translateY(0);
      transform: scale(1.1, 0.9) translateY(0);
  }
  30% {
      -webkit-transform: scale(0.9, 1.1) translateY(-0.5em);
      transform: scale(0.9, 1.1) translateY(-0.5em);
  }
  50% {
      -webkit-transform: scale(1.05, 0.95) translateY(0);
      transform: scale(1.05, 0.95) translateY(0);
  }
  57% {
      -webkit-transform: scale(1) translateY(-0.125em);
      transform: scale(1) translateY(-0.125em);
  }
  64% {
      -webkit-transform: scale(1) translateY(0);
      transform: scale(1) translateY(0);
  }
  to {
      -webkit-transform: scale(1) translateY(0);
      transform: scale(1) translateY(0);
  }
}

@keyframes fade {
  50% {
      opacity: 0.4;
  }
}

@keyframes beat-fade {
  0%, to {
      opacity: 0.4;
      -webkit-transform: scale(1);
      transform: scale(1);
  }
  50% {
      opacity: 1;
      -webkit-transform: scale(1.125);
      transform: scale(1.125);
  }
}

@keyframes flip {
  50% {
      -webkit-transform: rotate3d(var(--fa-flip-x,0),var(--fa-flip-y,1),var(--fa-flip-z,0),var(--fa-flip-angle,-180deg));
      transform: rotate3d(var(--fa-flip-x,0),var(--fa-flip-y,1),var(--fa-flip-z,0),var(--fa-flip-angle,-180deg))
  }
}

@keyframes shake {
  0% {
      -webkit-transform: rotate(-15deg);
      transform: rotate(-15deg);
  }
  4% {
      -webkit-transform: rotate(15deg);
      transform: rotate(15deg);
  }
  8%, 24% {
      -webkit-transform: rotate(-18deg);
      transform: rotate(-18deg);
  }
  12%, 28% {
      -webkit-transform: rotate(18deg);
      transform: rotate(18deg);
  }
  16% {
      -webkit-transform: rotate(-22deg);
      transform: rotate(-22deg);
  }
  20% {
      -webkit-transform: rotate(22deg);
      transform: rotate(22deg);
  }
  32% {
      -webkit-transform: rotate(-12deg);
      transform: rotate(-12deg);
  }
  36% {
      -webkit-transform: rotate(12deg);
      transform: rotate(12deg);
  }
  40%, to {
      -webkit-transform: rotate(0deg);
      transform: rotate(0deg);
  }
}

@keyframes spin {
  0% {
      -webkit-transform: rotate(0deg);
      transform: rotate(0deg);
  }
  to {
      -webkit-transform: rotate(1turn);
      transform: rotate(1turn);
  }
}


/* --- ERRORES --- */

.error404 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  gap: 2rem;
  width: 100%;
  min-height: 40vh;
  margin: 2rem 0;
}

.error404__contenido {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 2rem;
}

.error404__contenido p {
  margin: 0;
}

.error404__contenido img {
  width: 300px;
  aspect-ratio: 1 / 1;
  max-width: 80%;
  border: 2px solid var(--color-primario);
}


/* --- CONTACTO ENLACES (PIE) --- */
.contacto-enlaces {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.625em;
    margin-top: 1rem;
}

@media (max-width: 767px) {
    .contacto-enlaces {
        grid-template-columns: 1fr;
    }
}

.contacto-enlace {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    text-decoration: none;
    border-radius: 50px;
    padding: 1rem 1.5rem;
    font-size: var(--tamano-2);
    font-family: var(--fuente-generica);
		justify-content: center;
}

.contacto-enlace--whatsapp {
    background-color: var(--color-verde);
    color: var(--color-sobre-primario);
}

.contacto-enlace--whatsapp:hover,
.contacto-enlace--whatsapp:focus {
    background-color: var(--color-marino);
    color: var(--color-sobre-primario);
}

.contacto-enlace--email {
    background-color: var(--color-generico);
    color: var(--color-sobre-primario);
}

.contacto-enlace--email:hover,
.contacto-enlace--email:focus {
    background-color: var(--color-marino);
    color: var(--color-sobre-primario);
}

.contacto-enlace--phone {
    background-color: var(--color-marino	);
    color: var(--color-sobre-primario);
}

.contacto-enlace--phone:hover,
.contacto-enlace--phone:focus {
    background-color: var(--color-marino);
    color: var(--color-sobre-primario);
}

.contacto-enlace i {
    font-size: 1em;
}

/* --- MENÚ DE TIPOLOGÍAS DE PRODUCTOS --- */
.wpb_category_n_menu_accordion {
    background-color: var(--color-secundario);
    border-radius: var(--border-radius);
    padding: 1rem;
    font-family: var(--fuente-generica);
}

.wpb_category_n_menu_accordion_list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.cat-item {
    margin-bottom: 0.5rem;
}

.cat-item-have-child > a {
    position: relative;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 3rem 0.5rem 1rem; /* Espacio para el indicador */
    background-color: var(--color-secundario);
    border-radius: var(--border-radius);
    font-weight: 600;
    color: var(--color-sobre-fondo);
		font-size: var(--tamano-1);
    transition: background-color 0.3s ease, color 0.3s ease;
}

.cat-item-have-child > a:hover {
    background-color: var(--color-primario);
    color: var(--color-sobre-primario);
}

.wpb-submenu-indicator {
    position: absolute;
    right: 0;
    width: 47px;
    height: 100%;
    top: 0;
    text-align: center;
    font-size: 20px;
    font-weight: 900;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    transition: transform 0.3s linear;
}

.cat-item-have-child.open .wpb-submenu-indicator i {
    transform: rotate(45deg); /* Cambia el icono de + a x */
}

.wpb-category-title {
    flex-grow: 1; /* El título ocupa el espacio restante */
}

.children {
    list-style: none;
    margin: 0 0 0 0;
    padding: .5rem 1rem .5rem 1rem;
    display: none;
		background: var(--color-sobre-primario);
}

.children li a {
    display: block;
    padding: 0.375rem 1rem;
    color: var(--color-sobre-fondo-contraste);
    transition: background-color 0.3s ease, color 0.3s ease;
		font-size: calc(var(--tamano-1) - 1px);
		border-radius: 4px;
		/*border-left: 3px solid transparent;*/
}
.children li a.activo {
    background-color: var(--color-secundario);
    color: var(--color-sobre-secundario);
}
.children li:hover a {
		/*border-color: #009EF7;*/
		background-color: var(--color-secundario);
    color: var(--color-sobre-secundario);
}

.children li a:hover {
		
}
/* --- MENÚ DE TIPOLOGÍAS DE PRODUCTOS --- FIN */




/* --- BÚSQUEDA CATEGORÍAS --- */
.busqueda-categorias {
    margin-top: 2rem;
		margin-bottom: 2rem;
}

.busqueda-categorias__tit {
    font-size: var(--tamano-3);
    font-weight: 600;
    margin: 0 0 2rem 0;
    text-align: center;
}

.busqueda-categorias__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 2rem;
		align-items: stretch;
}

@media (max-width: 1024px) {
    .busqueda-categorias__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .busqueda-categorias__grid {
        grid-template-columns: 1fr;
    }
}

.busqueda-categoria {
    display: flex;
    flex-direction: column;
    border-radius: var(--border-radius);
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    transition: all 0.3s ease;
		height: 100%;
}
.busqueda-categoria > a {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}

.busqueda-categoria:hover {
    transform: translateY(-4px);
		color: var(--color-sobre-primario);
		background-color: var(--color-primario);
}

.busqueda-categoria__img {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 10;
    overflow: hidden;
}

.busqueda-categoria:hover .busqueda-categoria__img::after {
  opacity: 1;
}

.busqueda-categoria__img::after {
  content: "Ver Categoría";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 1rem;
  background-color: rgba(0, 0, 0, 0.25);
  color: var(--color-blanco);
  text-shadow: 0.06em 0.06em 0.25em rgba(0, 0, 0, 0.875);
  font-size: var(--tamano-3);
  font-weight: 600;
  opacity: 0;
  transition: all 0.35s ease-out;
  pointer-events: none;
  border-radius: var(--border-radius-13);
}


.busqueda-categoria__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.busqueda-categoria:hover .busqueda-categoria__img img {
    transform: scale(1.05);
}

.busqueda-categoria__tit {
    flex-grow: 1; 
		display: flex;
		align-items: center; 
		justify-content: center;
		text-align: center;		
    padding: 1rem;
    /*background-color: var(--color-fondo-contraste);*/
    color: var(--color-sobre-fondo-contraste);
    font-size: calc(var(--tamano-2) * 1.2);
    font-weight: 600;
    margin: 0;
}

.busqueda-categoria:hover .busqueda-categoria__tit{
	color: var(--color-sobre-primario);
}

.busqueda-categoria__nombre {
		flex-grow: 0;
    text-align: center;
}

.busqueda-categoria__icono {
    font-size: var(--tamano-1);
    color: var(--color-primario);
}
/*busqueda resultaos (para que el p de "no hay resultados de busqueda ocupe el 100% del contenedor*/
.busqueda-resultados p {
  grid-column: 1 / -1;
}
.busqueda-sin-resultados{  
  grid-column: 1 / -1;
	
	display: flex;
  flex-direction: column;
  width: 100%;
  align-items: center;
  gap: 1rem;
  text-align: center;
}
.busqueda-sin-resultados > img{width: 300px;} 

/* --- RUTA DE CATEGORÍAS (MIGAS DE PAN) --- */
.ruta-categorias {
    margin-bottom: 1rem;
		grid-column: 1 / -1;
}

.ruta-categorias__lista {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    font-size: var(--tamano-1);
    color: var(--color-sobre-fondo);
}

.ruta-categorias__lista li {
    display: flex;
    align-items: center;
    margin-right: 0.5rem;
}

.ruta-categorias__lista li:not(:last-child)::after {
    content: "/";
    margin-left: 0.5rem;
    color: var(--color-sobre-fondo);
}

.ruta-categorias__lista li a {
    color: var(--color-primario);
    text-decoration: none;
    transition: color 0.3s ease;
}

.ruta-categorias__lista li a:hover,
.ruta-categorias__lista li a:focus {
    color: var(--color-sobre-fondo);
}

.ruta-categorias__lista li:last-child {
    font-weight: 600;
    color: var(--color-sobre-fondo);
}

/* --- BOTONES DE SUBCATEGORÍAS --- */
.subcategorias-botones__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.5rem 1rem;
		margin: 1.5rem 0 0 0;
}

@media (max-width: 1024px) {
    .subcategorias-botones__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .subcategorias-botones__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 480px) {
    .subcategorias-botones__grid {
        grid-template-columns: 1fr;
    }
}

.subcategorias-boton {
    text-align: center;
    font-weight: 500;
    background-color: var(--color-fondo-contraste);
    color: var(--color-sobre-fondo-contraste);
		white-space: inherit;
		justify-content: center;
		padding: 1em 1em;
		font-size: var(--tamano-2);
}

.subcategorias-boton:hover,
.subcategorias-boton:focus {
    background-color: var(--color-primario);
    color: var(--color-sobre-primario);
} 

/* --- BANNERS --- */
.banners {
    margin: 2rem 0;
}

.banners__grid {
    display: grid;
    gap: 1rem;
}

.banner--full {
    grid-column: 1 / -1;
}

.banner--half {
    grid-column: span 1 / span 1;
}

.banner--third {
    grid-column: span 1 / span 1;
}

.banners__grid:has(.banner--full) {
    grid-template-columns: 1fr;
}

.banners__grid:has(.banner--half) {
    grid-template-columns: repeat(2, 1fr);
}

.banners__grid:has(.banner--third) {
    grid-template-columns: repeat(3, 1fr);
}

.banner {
    display: block;
    overflow: hidden;
    border-radius: var(--border-radius);
    transition: transform 0.3s ease;
}

.banner:hover {
    transform: translateY(-4px);
}

.banner img {
    width: 100%;
    height: auto;
    object-fit: contain;
    aspect-ratio: 16 / 9;
}

/* Contenedor principal */
.contenedor__productosimple {
 
  margin: 0 auto;
  box-sizing: border-box;
  overflow: hidden; /* para contener floats */
}

/* Imagen flotante a la izquierda */
.contenedor__productosimple_imagen {
  float: left;
  width: 450px;
  height: auto;
  margin-right: 2rem;
  margin-bottom: 1rem;
}

/* Enlace que envuelve la imagen */
.contenedor__productosimple_imagen a {
  display: block;
  width: 100%;
  height: auto;
}

/* Imagen dentro del enlace */
.contenedor__productosimple_imagen img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Texto a la derecha de la imagen */
.contenedor__productosimple aside {
	display: inline;
  overflow: hidden;
}

/* Responsive: apilar en pantallas pequeñas */
@media screen and (max-width: 980px) {
  .contenedor__productosimple_imagen {
    float: none;
    width: 100%;
    margin: 0 0 1rem 0;
  }

  .contenedor__productosimple aside {
    overflow: visible;
  }
}

/*estilo especifico para el input del buscador*/
#txtbuscar {
  border: 2px solid var(--color-negro);
  outline: none;
  background-color: var(--color-secundario);
  transition: all 0.3s ease;
}