/* ============================================================
   BANNER.CSS — Estilos de banners
   Patricia Alonso · patriciaalonso.es
   ============================================================ */

/* ============================================================
   BANNER PRINCIPAL
   ============================================================ */
.banner-portada {
    width: 100%;
    display: block;
    position: relative;
    z-index: 1;
}

.banner-contenedor {
    width: 100%;
    max-width: 100%;
    position: relative;
    overflow: visible;
}

.banner-contenedor img {
    width: 100%;
    height: auto;
    display: block;
}

/* ============================================================
   BANNER FORO
   ============================================================ */
.banner-foro {
    max-width: 1150px;
    margin: 10px auto;
    padding: 20px 30px;
    background: rgba(20, 20, 40, 0.8);
    border: 2px solid #7B5FE0;
    border-radius: 12px;
    box-shadow: 0 0 15px #7B5FE0, 0 0 25px #9146FF;
    animation: glowPulse 2s infinite ease-in-out;
}

.banner-contenido {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

.titulo-foro {
    font-family: 'Cinzel', serif;
    font-size: 2rem;
    color: #7B5FE0;
    text-shadow: 0 0 12px #7B5FE0, 0 0 24px #9146FF;
    margin-bottom: 20px;
}

@keyframes glowPulse {
    0% { box-shadow: 0 0 15px #7B5FE0, 0 0 25px #9146FF; }
    50% { box-shadow: 0 0 25px #7B5FE0, 0 0 35px #9146FF; }
    100% { box-shadow: 0 0 15px #7B5FE0, 0 0 25px #9146FF; }
}



/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (min-width: 769px) {
    .banner-portada {
        margin-left: 0;
        width: 100%;
    }
}

    .titulo-foro { font-size: 1.4rem; }
}