/* 3 - Clase común para botones /
.boton {
display: inline-block; / Para que respete padding y margenes /
text-decoration: none; / 5 - Eliminar subrayado /
background-color: #4a4a4a; / 2 - Fondo base (puedes personalizar) /
color: white; / 5 - Color del texto /
border-radius: 8px; / 3 - Bordes redondeados /
font-family: 'Montserrat', sans-serif; / 5 - Fuente importada /
font-weight: 600; / 5 - Peso de la fuente /
font-size: 16px; / 2 - Tamaño de la fuente /
padding: 10px 20px; / 4 - Espaciado interno /
margin: 0 10px; / 1 - Espaciado externo entre botones /
border: none; / 2 - Limpio el borde /
cursor: pointer; / Aparece la manito al pasar /
transition: all 0.3s ease; / Animación suave /
box-shadow: 0 4px 6px rgba(0,0,0,0.15); / 2 - Sombra para visibilidad */
}
/* 2 - Efecto hover para mejor visibilidad /
.boton:hover {
background-color: #6c63ff; / Cambia de color al pasar el mouse /
transform: scale(1.05); / Efecto de crecimiento */
}
/* Ejemplo de botones distintos /
.boton.instagram {
background-color: #E4405F; / Color de Instagram */
}
.boton.github {
background-color: #333333; /* Color de GitHub */
}
