/* contenido-bloqueado.css — muro suave para invitados (ver contenido-bloqueado.js) */

.pw-bloqueado {
    user-select: none;
    -webkit-user-select: none;
    pointer-events: none;
}

.pw-bloqueado--vista {
    max-height: 520px;
    overflow: hidden;
    filter: blur(6px);
    opacity: .7;
}

.pw-bloqueado--vista + .pw-bloqueado--vista {
    -webkit-mask-image: linear-gradient(to bottom, #000 20%, transparent);
    mask-image: linear-gradient(to bottom, #000 20%, transparent);
}

.pw-bloqueado--oculta { display: none !important; }

/* La última sección visible se funde hacia el contenido bloqueado */
.pw-muro-desvanece {
    -webkit-mask-image: linear-gradient(to bottom, #000 70%, rgba(0, 0, 0, .35));
    mask-image: linear-gradient(to bottom, #000 70%, rgba(0, 0, 0, .35));
}

/* Tarjeta: se queda fija al hacer scroll mientras dure el artículo */
.pw-muro {
    position: sticky;
    top: 90px;
    z-index: 20;
    max-width: 520px;
    margin: 1.5rem auto;
    padding: 1.6rem 1.5rem 1.3rem;
    text-align: center;
    background: #fff;
    color: #2c3e50;
    border: 1px solid #dfe4ea;
    border-top: 4px solid #2c3e50;
    border-radius: 14px;
    box-shadow: 0 12px 36px rgba(44, 62, 80, .22);
}

.pw-muro-icono {
    width: 52px;
    height: 52px;
    margin: 0 auto .7rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.35rem;
    color: #fff;
    background: linear-gradient(135deg, #2c3e50, #4e6a85);
}

.pw-muro .pw-muro-titulo {
    margin: 0 0 .45rem;
    font-size: 1.25rem;
    font-weight: 800;
    color: #2c3e50;
}

.pw-muro .pw-muro-texto {
    margin: 0 0 1.1rem;
    font-size: .98rem;
    line-height: 1.5;
    color: #4a5a6a;
}

.pw-muro-botones {
    display: flex;
    flex-wrap: wrap;
    gap: .6rem;
    justify-content: center;
}

.pw-muro-btn {
    min-width: 150px;
    padding: .7rem 1.2rem;
    font: inherit;
    font-weight: 700;
    border-radius: 9px;
    cursor: pointer;
    color: #2c3e50;
    background: transparent;
    border: 2px solid #2c3e50;
    transition: transform .15s ease, background .15s ease, color .15s ease;
}

.pw-muro-btn:hover { transform: translateY(-1px); background: #eef2f6; }

.pw-muro-btn--principal { color: #fff; background: #2c3e50; }
.pw-muro-btn--principal:hover { background: #3d5871; }

.pw-muro-btn:focus-visible { outline: 3px solid #7fb3e0; outline-offset: 2px; }

.pw-muro .pw-muro-nota {
    margin: .9rem 0 0;
    font-size: .82rem;
    color: #6b7a89;
}

/* Modo oscuro del sitio (clase doblada para ganar a darktheme.css) */
.dark-theme .pw-muro.pw-muro {
    background: #1f2a36;
    color: #e6ebf0;
    border-color: #34465a;
    border-top-color: #7fb3e0;
}
.dark-theme .pw-muro.pw-muro .pw-muro-titulo { color: #fff; }
.dark-theme .pw-muro.pw-muro .pw-muro-texto { color: #c3ccd6; }
.dark-theme .pw-muro.pw-muro .pw-muro-nota { color: #9aa8b6; }
.dark-theme .pw-muro.pw-muro .pw-muro-btn { color: #e6ebf0; border-color: #7fb3e0; }
.dark-theme .pw-muro.pw-muro .pw-muro-btn:hover { background: #2a3a4b; }
.dark-theme .pw-muro.pw-muro .pw-muro-btn--principal { color: #13202c; background: #7fb3e0; }
.dark-theme .pw-muro.pw-muro .pw-muro-btn--principal:hover { background: #9cc6ea; }

@media (max-width: 600px) {
    .pw-muro { top: 70px; margin: 1rem .5rem; padding: 1.3rem 1rem 1.1rem; }
    .pw-muro-btn { flex: 1 1 100%; }
    .pw-bloqueado--vista { filter: blur(5px); }
}

@media print {
    .pw-muro { display: none; }
}
