/* --- COLORES LOKAN --- */
:root {
  --lokan-violeta: #5B2A86;
  --lokan-coral: #F37A6B;
  --lokan-dorado: #D4AF37;
  --lokan-gris-oscuro: #3E3E3E;
  --lokan-gris-claro: #F4F4F4;
  --lokan-blanco: #FFFFFF;
}

/* --- CUERPO DEL SITIO --- */
body {
  background-color: var(--lokan-gris-claro);
  color: var(--lokan-gris-oscuro);
  font-family: Arial, sans-serif;
}

/* --- ENCABEZADOS --- */
h1, h2, h3, h4, h5, h6 {
  color: var(--lokan-violeta);
}

/* --- ENLACES --- */
a {
  color: var(--lokan-violeta);
  text-decoration: none;
}

a:hover {
  color: var(--lokan-coral);
}

/* --- BOTONES --- */
button, .button {
  background-color: var(--lokan-violeta);
  color: var(--lokan-blanco);
  border: none;
  border-radius: 5px;
  padding: 10px 20px;
}

button:hover, .button:hover {
  background-color: var(--lokan-coral);
}

/* --- PIE DE PÁGINA --- */
footer {
  background-color: var(--lokan-gris-claro);
  color: var(--lokan-gris-oscuro);
  text-align: center;
  padding: 20px 10px;
  font-size: 14px;
}