
progress {
border: none;
border-radius: 0.1rem;
width: 100%;
height: 3px;
animation: prog 2s linear;
}

::-webkit-progress-bar-value {background-color: var(--negro); border-radius: 2rem;}
::-webkit-progress-value {background-color: var(--negro); border-radius: 2rem;}
::-moz-progress-bar {background-color: var(--negro); border-radius: 2rem;}

@keyframes prog {
0% {width: 0%; background-color: #f1f1f1;}
100% {width: 100%; background-color: yellow;}
}

.txt_progress {
  font-size: 1.12rem;
  font-weight: 400;
  color: var(--azul-oscuro);
  margin-bottom: 0.5rem;
  letter-spacing: 0.02rem;
  text-transform: uppercase;
}

progress {
  width: 100%;
  height: 0.5rem;
  border-radius: 2rem;
  overflow: hidden;
  background-color: #e0e0e0;
  border: none;
  margin-bottom: 2.5rem;
  transition: all 0.3s ease;
  box-shadow: inset 0 0 5px rgba(0,0,0,0.1);
}

/* Webkit (Chrome, Edge, Safari) */
::-webkit-progress-bar {
  background-color: #e0e0e0;
  border-radius: 2rem;
}

::-webkit-progress-value {
  background-color: var(--secundario);
  border-radius: 2rem;
  transition: width 1.2s ease-in-out;
}

/* Firefox */
::-moz-progress-bar {
  background-color: var(--secundario);
  border-radius: 2rem;
}

/* Animación personalizada para progresivo (opcional) */
@keyframes prog {
  0% { width: 0%; }
  100% { width: 100%; }
}
