/* ── Countdown Timer Plugin Styles ─────────────────────────── */

.ct-countdown-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #fff;
} 

/* Label */
.ct-label {
    margin: 0;
    font-size: clamp(0.9rem, 2.5vw, 1.15rem);
    font-weight: 500;
    letter-spacing: 0.05em;
    opacity: .85;
    text-transform: uppercase;
}

/* Timer row */
.ct-timer {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: center;
}

/* Each digit block */
.ct-unit {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 72px;
    background: #7b5cff;
    border-radius: 8px;
    padding: 14px 10px 10px;
    transition: transform .15s ease;
}

.ct-unit:hover {
    transform: translateY(-2px);
}

.ct-num {
    font-size: clamp(2rem, 6vw, 3.2rem);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    line-height: 1;
    letter-spacing: -0.02em;
}

.ct-desc {
    font-size: 0.68rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    opacity: .65;
    margin-top: 6px;
}

/* Colon separator */
.ct-sep {
    font-size: clamp(1.6rem, 4vw, 2.4rem);
    font-weight: 700;
    line-height: 1;
    opacity: .5;
    margin-bottom: 18px; /* align with numbers (compensate for label) */
}

/* Expired message */
.ct-expired-msg {
    margin: 0;
    font-size: 1.2rem;
    font-weight: 600;
    animation: ct-pulse 1.5s ease-in-out infinite;
}

@keyframes ct-pulse {
    0%, 100% { opacity: 1;   transform: scale(1); }
    50%       { opacity: .7; transform: scale(1.04); }
}

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 480px) {
    .ct-unit   { min-width: 58px; padding: 10px 8px 8px; }
    .ct-sep    { font-size: 1.4rem; }
}