body 
{
    font-family: 'Montserrat', sans-serif;
    margin: 0;
    overflow: hidden;
}
.mesh-background 
{
    background: linear-gradient(to top, #050714 0%, #0d122b 50%, #1a237e 100%);
    position: relative;
}
.grain-overlay  /* IMAGEN + ANIMACIÓN ORIGINAL */
{
    pointer-events: none;
}
.grain-overlay::before 
{
    content: "";
    position: absolute;
    top: -100%;
    left: -100%;
    width: 300%;
    height: 300%;
    background-image: url(../../img/fondo_sistema.png);
    opacity: 0.05;
    animation: grain 8s steps(10) infinite;
}
.text-title
{
    font-size:72px; 
    line-height:1;
    letter-spacing: -2px;
}
.text-gradient  /* GRADIENTE DEL TÍTULO */
{
    color: #a5b4fc;
    /* background: linear-gradient(90deg, #a5b4fc, #c084fc, #f472b6);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; */
}

/* COPYRIGHT */
.copyright 
{
    position: absolute;
    bottom: 45px;
    left: 3rem;
    font-size: 14px;
    color: #ffffff;
    text-transform: uppercase;
    font-weight: 500;
    letter-spacing: 1.4px;
    margin-bottom: 2px;
}
/* parte derecha */
.form-wrapper 
{
    padding: 10px 40px; /* más compacto verticalmente */
}
.form-box 
{
    width: 100%;
    max-width: 448px;
}
h2 
{
    font-size: 30px;
    font-weight: 700;
    margin-bottom: 6px;
    color: #0f172a;
}
.subtitle 
{
    font-size: 16px;
    font-weight: 500; /* corregido */
    color: #64748b;
    margin-bottom: 18px; /* más compacto */
}
.custom-label 
{
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 6px;
    color: #334155;
}
.div-input
{
    --tw-space-y-reverse: 0;
    margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
}
.soft-input 
{
    background-color: #f8fafccc !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 0.75rem;
    padding: 12px 16px; /* reducido */
    font-size: 0.875rem;
    height: 46px;
}
.soft-input:focus 
{
    /* box-shadow: 0 0 0 3px rgba(26, 35, 126, 0.08);
    border-color: #1a237e !important; */
    box-shadow: none !important;

}
/* Forgot password */
.forgot-link 
{
    font-size: 12px;
    font-weight: 500;
    color: #1a237e;
    text-decoration: none;
    font-weight: 700;
}
.forgot-link:hover 
{
    text-decoration: none;
}
.form-check  /* Checkbox */
{
    margin-bottom: 14px;
}
.form-check-label 
{
    font-size: 14px;
    color: #475569;
}
.form-check-input:checked 
{
    background-color: #1a237e;
    border-color: #1a237e;
}
/* Button */
.btn-login 
{
    background-color: #1a237e;
    border-radius: 0.75rem;
    margin: 5px 0px 0px;
    padding: 14px 0px;
    font-size: 14px;
    border: none;
}
.btn-login:hover, .btn-login:focus 
{
    background-color: #0413b6;
}

/* Footer */
.footer-text 
{
    margin-top: 2.5rem; /* más cercano */
    font-size: 14px;
    font-weight: 500;
    color: #64748b;
    text-align: center;
}
.contact-link 
{
    color: #1a237e;
    text-decoration: none;
    font-weight: 600;
}
.contact-link:hover 
{
    text-decoration: none;
}