/**
 * Theme Name: astra.child
 * Template: astra
 * Version: 1.0
 */


.directorio{
max-width:1200px;
margin:auto;
font-family:'Barlow',sans-serif;
}


.directorio-titulo{

font-size: 35px;
color: #0d2c6c;
margin-bottom: 10px;
font-weight: 300;
font-family:'Barlow',sans-serif;
}

.ejecutivo-titulo{

font-size: 35px;
color: #0d2c6c;
margin-bottom: 10px;
margin-top: 10px;
font-weight: 300;
font-family:'Barlow',sans-serif;
}

.directorio-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:60px;
}

/* PERSONA */

.persona{
display:flex;
align-items:center;
gap:0px;
cursor:pointer;
opacity:1;
transition:all .35s;
}

.persona:hover{
opacity:1;
}

/* cuando hay una activa, las otras se atenúan */

.directorio.has-active .persona{
opacity:.5;
}

/* la activa queda normal */

.directorio.has-active .persona.active{
opacity:1;
}


.persona img{
width:150px;
height:180px !important;
margin:40px 0px 40px 0;
object-fit:cover;
filter:grayscale(100%);
}

.persona-info h3{
margin:0;
font-size:18px;
color:#0d2c6c;
margin-left: -30px;
}

.persona-info span{
font-size:14px;
color:#6b7a99;
margin-left: -30px;
display: block;
word-wrap: break-word;
overflow-wrap: break-word;
}

/* DETALLE */

.persona-detalle{
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: max-height .5s ease, opacity .3s ease;
}

.persona-detalle.active{
  max-height: 800px; /* ajusta según contenido */
  opacity: 1;
}


/* TEXTO DETALLE */

.detalle-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:40px;
}

.detalle-grid p{
color:#555;
line-height:1.7;
font-size:14px;
}
/* TRAYECTORIA */

.trayectoria h5{
font-family:'Barlow', sans-serif;
font-size:14px;
margin-bottom:20px;
color:#0d2c6c;
}

.trayectoria p{

font-family:'Barlow', sans-serif;
color:#444444;

line-height:1.5em;
font-weight:300;

font-size:14px;

column-count:2;
column-gap:40px;
column-fill:balance;

padding-bottom:20px;

}

/* LINEA */

.directorio-divider{

height:1px;
background:#dcdcdc;
margin: px 0px 40px 0px;

}

/* MOBILE */

/* ===== MOBILE ===== */

@media(max-width:768px){

/* ocultar SOLO las lineas de desktop */

.directorio-divider{
display:none !important;
}

/* grid */

.directorio-grid{
grid-template-columns:1fr;
gap:0;
}

/* persona */

.persona{
flex-direction:row;
align-items:center;
gap:15px;
padding:20px 0;

border-bottom:1px solid #dcdcdc; /* linea siempre visible */
}

/* cuando esta abierta quitamos linea */

.persona.active{
border-bottom:none;
}

/* foto */

.persona img{
width: 130px;
height: 157px;
object-fit:cover;
flex-shrink:0;
}

/* texto */

.persona-info{
display:flex;
flex-direction:column;
justify-content:center;
}

.persona-info h3{
margin:0;
font-size:18px;
margin-left: -65px;
}

.persona-info span{
font-size:14px;
margin-left: -65px;
}

/* detalle */

.persona-detalle{

grid-column:1;

max-height:0;
overflow:hidden;

opacity:0;

border-bottom:1px solid #dcdcdc;

transition: max-height .5s ease, opacity .3s ease;

}

/* detalle abierto */

.persona-detalle.active{

max-height:900px;
opacity:1;

margin:10px 0 20px 0;

}

/* contenido detalle */

.trayectoria p{
column-count:1;
}
}
/* DESACTIVA ANIMACION CUANDO SOLO CAMBIAMOS CONTENIDO */

.no-animacion{
transition:none !important;
}


/*collpse and set the height of the toggle text*/

.pa-toggle-text .et_pb_text_inner {
	max-height: 200px;
	transition: max-height 0.3s ease-out;
	overflow: hidden;
}


/*add gradient to the collapsed text*/

.pa-toggle-text .et_pb_text_inner:after {
	content: “”;
	display: inline-block;
	position: absolute;
	pointer-events: none;
	height: 100px;
	width: 100%;
	left: 0;
	right: 0;
	bottom: 0;
	background-image: linear-gradient(0deg, #fff 10%, transparent);
}


/*style the expand text link*/

.pa-toggle-text .pa-text-expand-button {
	padding: 0.5em;
	text-align: center;
	color: #00d263!important;
}


/*change the curor to a pointed when hovering over the expand text link*/

.pa-toggle-text .pa-text-expand-button span {
	cursor: pointer;
}


/*define the font family for the toggle icon*/

.pa-toggle-text .pa-text-expand-button .pa-text-toggle-icon {
	font-family: ETMODULES, “sans-serif”;
}


/*set the max height and transition of the expanded toggle*/

.pa-toggle-text .pa-text-toggle-expanded {
	max-height: 2000px;
	transition: max-height 0.3s ease-in;
}


/*hide the gradient when the toggle is expanded*/

.pa-toggle-text .pa-text-toggle-expanded.et_pb_text_inner:after {
	background: none;
}
