/* Estilo para texto amarillo en cursiva */ .Estilo1 { color: #FFFF00; font-style: italic; } /* Estilo para texto rojo con subrayado animado */ .Estilo2 { color: #FF0000; position: relative; font-weight: bold; } .Estilo2::after { content: ''; position: absolute; width: 100%; height: 2px; background: #FF0000; left: 0; bottom: 0; animation: parpadeo 1s infinite; } /* Animación alternativa al parpadeo */ @keyframes parpadeo { 0%, 49% { opacity: 0; } 50%, 100% { opacity: 1; } } /* Botón de atención visual */ .boton-atencion { background-color: #ff4d4d; /* Rojo fuerte */ color: white; padding: 15px 25px; border: none; border-radius: 10px; font-size: 18px; font-weight: bold; cursor: pointer; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3); transition: background-color 0.3s ease, transform 0.2s; } .boton-atencion:hover { background-color: #e60000; transform: scale(1.05); } .contenido { max-width: 800px; margin: 10px auto; font-family: inherit; /* Usa la fuente del */ font-size: inherit; /* Usa el tamaño del */ line-height: 1.6; text-align: justify; } .contenido em { font-style: italic; } .contenido blockquote { border-left: 4px solid #cc0000; padding-left:20px; margin-left: 100px; /* Separación del margen izquierdo */ border-radius: 6px; padding-top: 10px; padding-bottom: 10px; background: none; /* Sin fondo */ color: inherit; /* Usa color del body */ } .contenido li { margin-bottom: 10px; } .lista-fractal { margin-left: 40px; /* distancia desde margen */ padding-left: 30px; /* espacio interno para los puntos */ position: relative; } .lista-fractal ul { list-style: none; /* quitamos el marcador normal */ padding: 0; margin: 0; } .lista-fractal li { margin-bottom: 12px; position: relative; padding-left: 25px; /* espacio para el punto */ line-height: 1.6; } /* Punto fractal */ .lista-fractal li::before { content: ""; position: absolute; left: 0; top: 8px; width: 10px; height: 10px; background: radial-gradient(circle, #ff4d4d, #b30000); border-radius: 50%; animation: pulsoFractal 1.6s infinite ease-in-out; box-shadow: 0 0 6px #ff0000, 0 0 12px #ff3333; } /* Animación fractal — una pulsación que entra y sale, como la mente cuando se repliega */ @keyframes pulsoFractal { 0% { transform: scale(0.8); opacity: 0.7; } 50% { transform: scale(1.25); opacity: 1; } 100% { transform: scale(0.8); opacity: 0.7; } }