/*!
 * ASOFRIO — Estilos específicos de "Quiénes somos" (quienes-somos.php)
 * Cargado únicamente en esta página (ver functions.php).
 */

/* ============ Hero: fondo específico de esta página ============ */
#section-inicio{
	background-image:url('../assets/images/equipo-asofrio.webp');
	background-position:center 30%;
	background-size:cover;
}
/*
 * Degradado más suave que el del resto de heroes: se quita el velo vertical
 * uniforme (que oscurecía toda la foto por igual) y se deja solo el
 * horizontal, para que se intuya a todo el equipo aunque el texto quede
 * a la izquierda. Izquierda ~90% opacidad (legibilidad), derecha igual
 * que en el resto del sitio.
 */
#section-inicio::before{
	background-image:
		linear-gradient(90deg, rgba(6,27,95,.90) 0%, rgba(6,27,95,.90) 55%, rgba(6,27,95,0) 75%),
		radial-gradient(circle at 15% 20%, rgba(140,143,246,.30), transparent 45%),
		radial-gradient(circle at 85% 15%, rgba(22,199,232,.26), transparent 40%),
		radial-gradient(circle at 60% 90%, rgba(0,87,231,.30), transparent 45%);
}

/* ============ Hitos de Asofrío (cronograma interactivo) ============ */
.milestones{
	border-left:2px solid var(--border); margin-left:26px;
}
.milestone-item{
	position:relative; border-bottom:1px solid var(--border);
}
.milestone-item:last-child{border-bottom:none;}
.milestone-item::before{
	content:''; position:absolute; left:-33px; top:24px; width:12px; height:12px;
	border-radius:50%; background:var(--white); border:3px solid var(--action);
	transition:background .2s ease;
}
.milestone-item[open]::before{background:var(--action);}
.milestone-summary{
	list-style:none; cursor:pointer; -webkit-tap-highlight-color:transparent;
	display:flex; align-items:center; gap:16px;
	padding:20px 4px 20px 24px; min-height:44px;
}
.milestone-summary::-webkit-details-marker{display:none;}
.milestone-year{
	flex-shrink:0; font-weight:700; font-size:14.5px;
	color:var(--white); background:var(--brand); border-radius:var(--r-full);
	padding:6px 14px; min-width:60px; text-align:center;
}
.milestone-title{flex:1; min-width:0; font-weight:700; color:var(--text); font-size:15px;}
.milestone-caret{color:var(--text-secondary); flex-shrink:0; font-size:22px; transition:transform .25s ease, color .25s ease;}
.milestone-item[open] .milestone-caret{transform:rotate(180deg); color:var(--action);}
.milestone-body{padding:0 24px 22px 100px; margin-top:-6px;}
.milestone-body p{color:var(--text-secondary); line-height:1.65; font-size:14.5px;}
@media(max-width:600px){
	.milestones{margin-left:12px;}
	.milestone-item::before{left:-19px; top:20px;}
	.milestone-summary{gap:12px; padding:16px 4px 16px 14px;}
	.milestone-year{font-size:12.5px; padding:5px 10px; min-width:48px;}
	.milestone-title{font-size:14px; line-height:1.35;}
	.milestone-body{padding:0 14px 18px 14px;}
}

/* ============ Equipo Asofrío ============ */
.team-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:36px 28px;}
@media(max-width:900px){.team-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.team-grid{grid-template-columns:1fr;}}
.team-card{text-align:center;}
.team-photo{
	width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:var(--r-md);
	display:block; margin-bottom:18px; background:var(--lavender-bg);
}
.team-card h3{font-size:19px; margin-bottom:8px;}
.team-card .role{color:var(--text-secondary); font-size:14px; line-height:1.7;}
.team-card .bio{color:var(--text-secondary); font-size:13px; line-height:1.6; margin-top:10px; opacity:.85;}

/* ============ Consejeros: carrusel paginado (3 en escritorio, 1 en móvil) ============ */
.advisors-viewport{
	overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
	scrollbar-width:none; padding:4px 2px 8px;
	-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 24px),transparent 100%);
	mask-image:linear-gradient(to right,#000 calc(100% - 24px),transparent 100%);
}
.advisors-viewport::-webkit-scrollbar{display:none;}
.advisors-track{display:flex; gap:24px;}
.advisor-tile{
	flex:0 0 calc((100% - 48px) / 3); scroll-snap-align:start; text-align:center;
}
@media(max-width:720px){
	.advisor-tile{flex:0 0 100%;}
}
.advisor-photo{
	width:100%; aspect-ratio:1/1; border-radius:var(--r-md); object-fit:cover; object-position:center;
	display:block; margin:0 0 14px; background:var(--lavender-bg);
	box-shadow:0 1px 3px rgba(11,31,77,.1);
}
.advisor-tile h3{font-size:15px; margin-bottom:4px; line-height:1.3;}
.advisor-tile .role{color:var(--text-secondary); font-size:13px; line-height:1.5;}
.advisors-controls{display:flex; justify-content:center; gap:10px; margin-top:20px;}