:root{
    --azul: #0D5FA6;
    --verde: #688C32;
    --amarillo: #F2B807;
    --naranja: #F25D07;
    --blanco: #F2F2F2;
    --azulopc: #0d5fa630;
    --verdeopc: #688c3230;
    --amarilloopc: #f2b80730;
    --naranjaopc: #f25d0730;
}

*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: inherit;
    text-decoration: none;
    list-style: none;
    border: 0;
    outline: none;
    box-shadow: none;
    appearance: none;
    -webkit-tap-highlight-color: transparent;
    user-select: none;
}

* {
    transition: all 0.3s ease;
}


a {
    text-decoration: none;
    color: white;
}

ul {
    list-style: none;
}

@keyframes slideIn {
    0% {
        transform: translateX(50px) rotate(3deg);
        opacity: 0;
    }

    100% {
        transform: translateX(0) rotate(0);
        opacity: 1;
    }
}

@keyframes scaleUp {
    0% {
        transform: scale(0.95);
        filter: brightness(0.8);
    }

    100% {
        transform: scale(1);
        filter: brightness(1);
    }
}

@keyframes textAppear {
    0% {
        opacity: 0;
        transform: translateY(10px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}