/* ── Contador en vivo ────────────────────────────────────────────── */
.lp-contador-wrap {
    background: var(--lp-bordo);
    padding: 0.9rem 1.5rem;
}

.lp-contador-inner {
    max-width: 1060px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 1.25rem;
    flex-wrap: wrap;
}

/* Punto pulsante */
.lp-contador-pulso {
    position: relative;
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

.lp-pulso-dot {
    position: absolute;
    inset: 0;
    margin: auto;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #10b981;
}

.lp-pulso-ring {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 1.5px solid #10b981;
    animation: contadorPulso 1.8s ease-out infinite;
}

@keyframes contadorPulso {
    0% {
        transform: scale(0.8);
        opacity: 1;
    }

    100% {
        transform: scale(2.2);
        opacity: 0;
    }
}

/* Número y label */
.lp-contador-texto {
    display: flex;
    align-items: baseline;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.lp-contador-num {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 1.5rem;
    font-weight: 900;
    color: #fff;
    line-height: 1;
    min-width: 3ch;
    transition: all 0.3s;
}

.lp-contador-label {
    font-size: 0.82rem;
    color: rgba(255,255,255,0.75);
    font-weight: 600;
}

/* Separador */
.lp-contador-sep {
    width: 1px;
    height: 24px;
    background: rgba(255,255,255,0.2);
    flex-shrink: 0;
}

/* Detalle online */
.lp-contador-detalle {
    font-size: 0.75rem;
    color: rgba(255,255,255,0.65);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

@media (max-width: 600px) {
    .lp-contador-sep {
        display: none;
    }

    .lp-contador-detalle {
        display: none;
    }

    .lp-contador-inner {
        gap: 0.85rem;
    }
}