/* ---------------------------------------------------------------------------
 * Banner del evento "Evoluciona SIGAM".
 *
 * Se separa en su propio archivo a proposito: cuando pase el evento basta con
 * poner .bn-evento{display:none} AQUI, en un solo sitio, y desaparece de las
 * seis paginas a la vez. El markup se puede quitar despues con calma.
 *
 * Usa los tokens del diseño nuevo (navy, verde, Inter) en vez del azul y el
 * dorado del banner anterior, que venia del sitio viejo y desentonaba.
 *
 * 03/11/2026. Acacemu.
 * --------------------------------------------------------------------------- */

.bn-evento{
    background:linear-gradient(135deg,#0F2540 0%,#1E3A5F 100%);
    color:#FFFFFF;
    font-family:'Inter',system-ui,-apple-system,sans-serif;
    padding:14px 56px 14px 24px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:22px;
    flex-wrap:wrap;
    text-align:left;
    position:relative;
    border-bottom:1px solid rgba(31,157,108,.45);
}

/* Filo verde superior: ata el banner al acento del sitio */
.bn-evento::before{
    content:'';
    position:absolute; inset:0 0 auto 0; height:3px;
    background:linear-gradient(90deg,#1F9D6C 0%,#2fc78a 50%,#1F9D6C 100%);
}

.bn-evento .bn-txt{ min-width:0 }

.bn-evento .bn-t{
    margin:0;
    font-size:.95rem;
    font-weight:700;
    letter-spacing:-.01em;
    line-height:1.3;
}

.bn-evento .bn-fecha{
    color:#2fc78a;
    font-weight:800;
    white-space:nowrap;
}

.bn-evento .bn-s{
    margin:3px 0 0;
    font-size:.8rem;
    font-weight:400;
    color:#C4CDD6;
    line-height:1.45;
}

.bn-evento .bn-cta{
    display:inline-flex;
    align-items:center;
    gap:8px;
    background:#1F9D6C;
    color:#FFFFFF;
    font-weight:700;
    font-size:.82rem;
    padding:10px 20px;
    border-radius:10px;
    text-decoration:none;
    white-space:nowrap;
    box-shadow:0 6px 18px rgba(31,157,108,.34);
    transition:background .18s cubic-bezier(.22,1,.36,1),
               transform .18s cubic-bezier(.22,1,.36,1),
               box-shadow .18s cubic-bezier(.22,1,.36,1);
}
.bn-evento .bn-cta:hover{
    background:#25b47d;
    transform:translateY(-1px);
    box-shadow:0 9px 24px rgba(31,157,108,.44);
}
.bn-evento .bn-cta:active{ transform:translateY(0) }
.bn-evento .bn-cta svg{ width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:2.4 }

.bn-evento .bn-x{
    position:absolute; right:16px; top:50%; transform:translateY(-50%);
    width:26px; height:26px;
    border:none; border-radius:50%;
    background:rgba(255,255,255,.10);
    color:#C4CDD6;
    cursor:pointer;
    font-size:14px; line-height:1;
    display:flex; align-items:center; justify-content:center;
    transition:background .15s, color .15s;
}
.bn-evento .bn-x:hover{ background:rgba(255,255,255,.2); color:#FFFFFF }

/* En movil el texto se centra y el boton pasa a ocupar el ancho util */
@media (max-width:760px){
    .bn-evento{ padding:14px 48px 14px 18px; gap:12px; text-align:center }
    .bn-evento .bn-t{ font-size:.88rem }
    .bn-evento .bn-fecha{ white-space:normal }
    .bn-evento .bn-s{ font-size:.75rem }
    .bn-evento .bn-cta{ width:100%; justify-content:center }
}