/* ============================================================
   PRV – Progressive Reveal v2.0.1
   Usa !important nos estilos críticos para garantir que o tema
   não sobrescreva o visual de urgência.
   ============================================================ */

.prv-wrapper {
    max-width: 680px !important;
    margin: 2rem auto !important;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

.prv-hidden { display: none !important; }

/* ── Article above ── */
.prv-wrapper .prv-article-above {
    font-size: 1.05rem;
    line-height: 1.75;
    margin-bottom: 1.5rem;
}
.prv-wrapper .prv-article-above p { margin: 0 0 .9rem; }

/* ── Ad slot ── */
.prv-wrapper .prv-ad-wrapper { text-align: center; margin-bottom: 1.5rem; }
.prv-wrapper .prv-ad-label   { display: block; font-size: 10px; text-transform: uppercase; letter-spacing: .05em; color: #9ca3af; margin-bottom: 6px; }
.prv-wrapper .prv-ad-slot    { min-height: 90px; display: flex; align-items: center; justify-content: center; background: #f9fafb; border: 1px dashed #d1d5db !important; border-radius: 8px; }

/* ── Gate container — !important em tudo crítico ── */
.prv-wrapper .prv-gate {
    border: 2px solid #dc2626 !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    margin: 1.5rem 0 !important;
    background: #fff8f8 !important;
    transition: opacity .3s ease;
    display: block !important;
}

/* ── Stripe topo ── */
.prv-wrapper .prv-gate .prv-gate-stripe {
    background: #dc2626 !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: .1em !important;
    padding: 6px 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    margin: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* ── Live dot ── */
.prv-wrapper .prv-live-dot {
    display: inline-block !important;
    width: 7px !important;
    height: 7px !important;
    background: #ffffff !important;
    border-radius: 50% !important;
    flex-shrink: 0 !important;
    animation: prv-pulse 1s infinite !important;
}
@keyframes prv-pulse { 0%,100%{opacity:1} 50%{opacity:.25} }

/* ── Gate body ── */
.prv-wrapper .prv-gate .prv-gate-body {
    padding: 1.5rem 1.25rem !important;
    text-align: center !important;
    background: #fff8f8 !important;
}

.prv-wrapper .prv-gate .prv-gate-icon {
    font-size: 2rem !important;
    margin-bottom: .5rem !important;
    line-height: 1 !important;
    display: block !important;
}

.prv-wrapper .prv-gate .prv-gate-title {
    font-size: 1rem !important;
    font-weight: 700 !important;
    color: #991b1b !important;
    margin: 0 0 .4rem !important;
    line-height: 1.35 !important;
}

.prv-wrapper .prv-gate .prv-gate-sub {
    font-size: .875rem !important;
    color: #4b5563 !important;
    margin: 0 0 1rem !important;
    line-height: 1.5 !important;
}

/* ── Countdown ── */
.prv-wrapper .prv-counter-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    margin-bottom: .85rem !important;
}
.prv-wrapper .prv-counter-label {
    font-size: 12px !important;
    color: #6b7280 !important;
    font-style: italic !important;
}
.prv-wrapper .prv-counter {
    font-size: 26px !important;
    font-weight: 700 !important;
    color: #dc2626 !important;
    font-variant-numeric: tabular-nums !important;
    letter-spacing: .03em !important;
    line-height: 1 !important;
}

/* ── Users ── */
.prv-wrapper .prv-users {
    font-size: 12px !important;
    color: #6b7280 !important;
    margin: 0 0 1rem !important;
}
.prv-wrapper .prv-users-count {
    color: #dc2626 !important;
    font-weight: 700 !important;
}

/* ── CTA button ── */
.prv-wrapper .prv-cta-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 360px !important;
    margin: 0 auto !important;
    background: #dc2626 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 10px !important;
    padding: .9rem 1.5rem !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    font-family: inherit !important;
    text-decoration: none !important;
    box-shadow: none !important;
    transition: filter .15s ease, transform .1s ease !important;
    line-height: 1.3 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
}
.prv-wrapper .prv-cta-btn:hover  { filter: brightness(1.08) !important; transform: translateY(-1px) !important; background: #dc2626 !important; color: #ffffff !important; }
.prv-wrapper .prv-cta-btn:active { transform: translateY(0) !important; }
.prv-wrapper .prv-cta-btn:disabled { opacity: .65 !important; cursor: not-allowed !important; transform: none !important; filter: none !important; }

.prv-wrapper .prv-cta-icon { font-size: 1rem !important; }

.prv-wrapper .prv-cta-sub {
    font-size: 11px !important;
    color: #9ca3af !important;
    margin: .5rem 0 0 !important;
}

.prv-wrapper .prv-loading {
    font-size: .85rem !important;
    color: #6b7280 !important;
    margin-top: .5rem !important;
}

/* ── Locked content blur ──
   filter e pointer-events com !important para garantir
   que o tema não cancele o efeito de bloqueio. ── */
.prv-wrapper .prv-locked.prv-blurred {
    filter: blur(6px) !important;
    opacity: .35 !important;
    user-select: none !important;
    pointer-events: none !important;
    transition: filter .45s ease, opacity .45s ease !important;
}
.prv-wrapper .prv-locked.prv-blurred.prv-revealed {
    filter: none !important;
    opacity: 1 !important;
    user-select: auto !important;
    pointer-events: auto !important;
}

/* ── Redirect message ── */
.prv-wrapper .prv-redirect-msg {
    text-align: center !important;
    padding: 1.5rem 1rem !important;
}
.prv-wrapper .prv-redirect-msg span { font-size: 1.6rem !important; display: block !important; margin-bottom: .5rem !important; }
.prv-wrapper .prv-redirect-msg p    { font-size: .9rem !important; color: #6b7280 !important; margin: 0 !important; }

/* ── Mobile ── */
@media (max-width: 600px) {
    .prv-wrapper .prv-gate .prv-gate-body { padding: 1.25rem 1rem !important; }
    .prv-wrapper .prv-counter             { font-size: 22px !important; }
    .prv-wrapper .prv-cta-btn             { font-size: .95rem !important; padding: .85rem 1.25rem !important; }
}

/* ── Editor preview ── */
.prv-editor-preview { border: 1px dashed #ddd; border-radius: 12px; padding: 1rem; }
.prv-editor-badge   { font-size: 11px; font-weight: 700; text-transform: uppercase; color: #6b7280; margin-bottom: .75rem; }
.prv-editor-card    { background: #fafafa; border: 1px solid #e5e7eb; border-radius: 12px; padding: 1.25rem; }

/* ── DOM siblings blur (content after the PRV block) ──
   Applied by JS to all elements after .prv-wrapper.
   Content stays in DOM — indexable by Google.
   ────────────────────────────────────────────────── */
.prv-sibling-blurred {
    filter: blur(6px) !important;
    opacity: .35 !important;
    user-select: none !important;
    pointer-events: none !important;
    transition: filter .45s ease, opacity .45s ease !important;
}
.prv-sibling-revealed {
    filter: none !important;
    opacity: 1 !important;
    user-select: auto !important;
    pointer-events: auto !important;
    transition: filter .45s ease, opacity .45s ease !important;
}