Haga lo que hicimos

/* Contenedor con Flexbox /
.botones {
display: flex; / alinea en fila /
justify-content: center; / centra horizontalmente */
}

/* Estilo de los botones /
.botones a {
text-decoration: none;
background-color: #e0e0e0; / gris claro /
color: #000;
padding: 12px 24px; / tamaño interno del botón /
border-radius: 6px;
margin: 0 10px; / espaciado horizontal entre botones /
font-size: 16px; / tamaño del texto */
display: inline-block;
}

.botones a {
text-decoration: none;
background-color: #1d3557; /* azul oscuro, fuerte contraste /
color: #ffffff; / texto blanco para máxima legibilidad /
padding: 14px 28px; / tamaño más amplio /
border-radius: 8px; / esquinas redondeadas /
font-size: 18px; / fuente más grande para visibilidad /
font-weight: bold; / texto más marcado /
border: 2px solid #457b9d; / borde contrastante /
box-shadow: 0px 4px 8px rgba(0,0,0,0.2); / sombra para resaltar /
display: inline-block;
transition: all 0.3s ease; / animación suave */
}

/* Estado hover para accesibilidad e interactividad /
.botones a:hover {
background-color: #457b9d; / tono más claro al pasar el mouse /
border-color: #1d3557;
transform: translateY(-2px); / pequeño efecto de elevación */
}

/* Estado focus para navegadores y accesibilidad con teclado /
.botones a:focus {
outline: 3px solid #f1faee; / contorno visible */
outline-offset: 2px;
}

/* Estado hover /
.boton:hover {
background-color: #457b9d; / tono más claro al pasar el mouse /
transform: translateY(-2px);/ efecto de elevación */
}

.boton {
display: inline-block;
text-decoration: none;
background-color: #1d3557; /* fondo azul oscuro /
color: #ffffff; / texto blanco */
font-size: 16px;
font-weight: bold;
border-radius: 8px;

/* Espaciado interno /
padding: 14px 28px; / 14px arriba/abajo, 28px izquierda/derecha */

transition: all 0.3s ease;
}

.boton:hover {
background-color: #457b9d;
transform: translateY(-2px);
}

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@600&display=swap');

.boton {
display: inline-block;
text-decoration: none; /* elimina el subrayado /
background-color: #1d3557; / fondo azul oscuro /
color: #ffffff; / texto blanco /
font-family: 'Montserrat', sans-serif; / fuente importada /
font-weight: 600; / peso 600, según Figma /
font-size: 16px; / ajusta según especificación Figma */
padding: 14px 28px;
border-radius: 8px;
transition: all 0.3s ease;
}

.boton:hover {
background-color: #457b9d; /* tono más claro en hover /
transform: translateY(-2px); / efecto visual */
}