/* =========================================================================
   Tarjeta de la agencia (secciones/agencia2026.php): Bootstrap 5.3 + estas
   reglas. Antes estaba en css/paginas/quienes_somos.css.
   ========================================================================= */

.panel26 {
	border: 1px solid #e6e9ee;
	border-top: 4px solid #f4b333;
}

/* Cabecera: azul oscuro con el nombre de la agencia en amarillo */
.panel26-cabecera {
	background-color: #232d3b;
}

.panel26-icono-cabecera {
	width: 44px;
	height: 44px;
	background-color: rgba(244, 179, 51, .15);
	color: #f4b333;
	font-size: 1.1rem;
}

.panel26-etiqueta {
	color: #c9d0da;
	font-size: .75rem;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.panel26-nombre {
	color: #f4b333;
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.3;
}

/* Datos: icono en circulo + titulo pequeno + valor */
.panel26-datos li {
	color: #3d4654;
	font-size: .92rem;
	line-height: 1.5;
}

.panel26-icono {
	width: 36px;
	height: 36px;
	background-color: #fdf3dd;
	color: #dd9d1f;
	font-size: .9rem;
}

.panel26-dato-titulo {
	color: #8a93a0;
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.panel26-datos a {
	color: #232d3b;
	font-weight: 600;
}

.panel26-datos a:hover {
	color: #dd9d1f;
}

/* Boton "Solicitar mas informacion" */
/* Ancho segun su contenido (d-inline-flex), alineado a la izquierda con los datos */
.panel26-cta {
	padding: .75rem 1.75rem;
	background-color: #f4b333;
	color: #232d3b;
	font-size: .9rem;
	font-weight: 700;
	text-align: center;
	text-decoration: none;
	transition: background-color .15s ease;
}

.panel26-cta:hover,
.panel26-cta:focus-visible {
	background-color: #dd9d1f;
	color: #232d3b;
}

.panel26-cta .fa-solid {
	transition: transform .15s ease;
}

.panel26-cta:hover .fa-solid {
	transform: translateX(3px);
}