/* ==========================================================================
   1. TIPOGRAFÍAS LOCALES (@font-face)
   ========================================================================== */
@font-face {
    font-family: 'retrobank';
    src: url('../tipografias/retrobank.ttf') format('truetype');
}
@font-face {
    font-family: 'romantic';
    src: url('../tipografias/romantic.ttf') format('truetype');
}
@font-face {
    font-family: 'cairo';
    src: url('../tipografias/Cairopixel.ttf') format('truetype');
}

/* ==========================================================================
   2. ESTILOS GENERALES Y FONDO
   ========================================================================== */
body {
    cursor: url('../imagenes/15.gif'), auto;
    background-image: url("../fondos/stars3.gif");
    background-size: auto; 
    background-attachment: fixed; 
    color: white;
    font-family: 'cairo', sans-serif;
    font-size: 25px;
    margin: 0; 
    padding: 30px 65px;
}

/* Efecto de líneas de escáner CRT */
body::before {
    content: " ";
    display: block;
    position: fixed;
    top: 0; left: 0; bottom: 0; right: 0;
    background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%);
    background-size: 100% 4px;
    z-index: 1000;
    pointer-events: none;
    opacity: 0.6;
}
/* ==========================================================================
   3. COMPONENTES Y2K Y TEXTO NEÓN
   ========================================================================== */
.titulo-neon-medio {
    font-family: 'cairo', sans-serif;
    font-size: 30px;
    color: #ffffff;
    text-align: center;
    text-shadow: 
        0 0 4px #ffffff,
        0 0 10px DarkOrchid,
        0 0 20px DarkOrchid,
        0 0 30px #a955f7;
}