@charset "utf-8";
/* CSS Document diferido para estilos CUSTOM VARIABLES del framework */
:root {
  --logo-svg-url: url('/css/logo-desktop.svg');
}
.panel-vertical{background: var(--fondo-oscuro);}
#bloqueador{position: fixed; width: 100%; height: 100%; opacity: 0.5; z-index: 26559205; background: rgb(0, 0, 0) none repeat scroll 0% 0%; top: 0px;}
.visible{display:block !important;}
#asistente {padding: 2vw;text-decoration:none;height: 100%;font-size: 1rem;position: relative; background: var(--fondo-oscuro);}
#asistente .brandmedio{flex:1;}
#asistente #cruz{width: 24px;height: 24px; color:var(--gris-100);}
#asistente nav ul{display:block;height:inherit; background: transparent !important;}
#asistente nav > ul > li {display: block;position:relative;}
#asistente nav ul li {padding: 5px 0;}
#asistente nav ul li:hover {background: none;}
#asistente nav li ul {border-radius:0;box-shadow: none;margin-top: .5rem;}
#asistente nav ul > li.subseccion {margin-top: .5rem;color: var(--paleta-1);}
#asistente nav ul > li.subseccion:hover {background: transparent;color: var(--paleta-1);}
#asistente nav ul li ul li a {padding: 10px;}
#asistente nav ul > li.subseccion::after {display: none;}
.boton:hover{cursor:pointer; background:var(--gris-700); color:var(--gris-100);}
.boton{border: 1px solid var(--gris-700); font-size:1rem; padding:1rem; width:100%; text-align:center; text-transform:uppercase;}

/* contextos */
figure.contexto {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr; /* 2025 */
	grid-auto-rows: min-content !important;
	gap: var(--calle);
	grid-template-areas:
	"media titulo titulo"
	"media bajada bajada";
	margin:var(--calle);
	background: var(--fondo-secundario);
	padding: var(--calle);
	box-shadow: var(--sombra-suave);
	position: relative;
}
figure.contexto::after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100px;
  height: 20px;
  background-image: var(--logo-svg-url);
  background-size: contain;
  background-repeat: no-repeat;
  background-color: var(--paleta-principal);
  border-radius: 4px 4px 0 0;
  background-position-x: 50%;
}
figure.contexto img {
  justify-self: center;
  align-self: flex-start;
  grid-area: media;
  aspect-ratio: 4/3;
  min-height: inherit;
  overflow: hidden;
  /*border-radius: 50%;*/
  padding: 5px;
  border: 1px solid var(--paleta-principal);
  object-fit: cover;
  width: 100%;
  margin:0;
}
figure.contexto p {
  font-size:1rem;
}
figure.contexto div.chinchulin {
  grid-column: 2 / 4;
  grid-row: 1 / 3;
  display: grid;
  grid-auto-rows: min-content;
  align-content: center;
  gap: var(--calle);
}

@media (max-width: 767.98px) {
	figure.contexto {
		grid-template-columns: 110px 1fr 1fr;
		gap: var(--calle);
		grid-template-areas:
		"media titulo titulo" 
		"media titulo titulo";
		margin: var(--calle) 0;
		background: var(--fondo-oscuro);
		padding: var(--calle) 10px;
		box-shadow: none;
		width: 100vw;
		left: calc(0px - var(--calle));
	}
	figure.contexto h2{
		font-size: 18px;
	}
	figure.contexto p{
		display: none;
	}
	figure.contexto h4{
		display: none;
	}
	figure.contexto a{
		text-decoration: none;
		color:var(--gris-100);
	}

}