/*!
 * PANDEMONIUM BOX · Component Library (canonical)
 * Usa tokens de pdm-tokens.css · sin libs externas · mobile-first
 */

/* ── BUTTONS ───────────────────────────────────────────────── */
.pdm-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 26px;border-radius:12px;font-weight:800;font-size:13px;letter-spacing:1.5px;text-decoration:none;text-transform:uppercase;cursor:pointer;border:1px solid transparent;transition:all .25s ease;min-height:48px;font-family:inherit}
.pdm-btn:disabled{opacity:.5;cursor:not-allowed}
.pdm-btn--primary{background:linear-gradient(135deg,var(--pdm-gold) 0%,var(--pdm-red) 100%);color:#070318;box-shadow:0 8px 24px rgba(251,191,36,.3)}
.pdm-btn--primary:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(251,191,36,.5)}
.pdm-btn--secondary{background:linear-gradient(135deg,var(--pdm-cyan),var(--pdm-violet));color:#070318}
.pdm-btn--secondary:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(34,211,238,.4)}
.pdm-btn--ghost{background:transparent;color:var(--pdm-cyan);border-color:var(--pdm-cyan)}
.pdm-btn--ghost:hover{background:rgba(34,211,238,.1);transform:translateY(-2px)}
.pdm-btn--gold-cta{background:linear-gradient(135deg,var(--pdm-gold),var(--pdm-red));color:#070318;font-weight:900;font-size:14px;letter-spacing:2px;padding:18px 36px;animation:pdm-pulse-cta 2.5s ease-in-out infinite}
@keyframes pdm-pulse-cta{0%,100%{box-shadow:0 8px 24px rgba(251,191,36,.3)}50%{box-shadow:0 12px 36px rgba(251,191,36,.55),0 0 24px rgba(239,68,68,.35)}}
.pdm-btn--block{width:100%}
.pdm-btn--sm{padding:10px 18px;font-size:11px;min-height:36px}
.pdm-btn--lg{padding:20px 40px;font-size:15px;min-height:60px}

/* ── CARDS ─────────────────────────────────────────────────── */
.pdm-card{background:var(--pdm-bg-1,#0d0726);border:1px solid var(--pdm-border,#4a1f8c);border-radius:16px;padding:24px;transition:all .25s ease}
.pdm-card:hover{transform:translateY(-4px);border-color:var(--pdm-cyan);box-shadow:0 12px 32px rgba(34,211,238,.15)}
.pdm-card--elevated{background:linear-gradient(160deg,var(--pdm-bg-1,#0d0726),var(--pdm-bg-2,#1a0a3a));box-shadow:0 16px 40px rgba(0,0,0,.5)}
.pdm-card--gold-bordered{border-color:var(--pdm-gold);background:linear-gradient(160deg,#1a0a3a,#0d0726)}
.pdm-card--danger-bordered{border-color:var(--pdm-red)}
.pdm-card__header{font-size:14px;letter-spacing:2px;color:var(--pdm-cyan);font-weight:800;text-transform:uppercase;margin-bottom:14px}
.pdm-card__body{color:var(--pdm-text-primary,#e5e7eb);font-size:14px;line-height:1.6}
.pdm-card__footer{margin-top:18px;padding-top:14px;border-top:1px solid var(--pdm-border-soft,rgba(124,58,237,.2));font-size:12px;color:var(--pdm-text-muted,#a78bfa)}

/* ── INPUTS ────────────────────────────────────────────────── */
.pdm-input{width:100%;padding:14px 16px;background:#070318;border:1px solid var(--pdm-border,#4a1f8c);color:var(--pdm-text-primary,#e5e7eb);border-radius:10px;font-size:14px;font-family:inherit;outline:none;transition:border .2s}
.pdm-input:focus{border-color:var(--pdm-cyan);box-shadow:0 0 0 3px rgba(34,211,238,.15)}
.pdm-input:invalid{border-color:var(--pdm-red)}
.pdm-input--lg{padding:18px 20px;font-size:16px}
.pdm-label{display:block;font-size:11px;color:var(--pdm-cyan);letter-spacing:2px;text-transform:uppercase;font-weight:700;margin-bottom:8px}
.pdm-hint{font-size:11px;color:var(--pdm-text-muted,#a78bfa);margin-top:6px}
.pdm-error{font-size:11px;color:var(--pdm-red);margin-top:6px}

/* ── BADGES ────────────────────────────────────────────────── */
.pdm-badge{display:inline-block;padding:4px 10px;border-radius:14px;font-size:10px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase}
.pdm-badge--cyan{background:rgba(34,211,238,.15);border:1px solid var(--pdm-cyan);color:var(--pdm-cyan)}
.pdm-badge--gold{background:rgba(251,191,36,.15);border:1px solid var(--pdm-gold);color:var(--pdm-gold)}
.pdm-badge--red{background:rgba(239,68,68,.15);border:1px solid var(--pdm-red);color:var(--pdm-red)}
.pdm-badge--green{background:rgba(16,185,129,.15);border:1px solid var(--pdm-green);color:var(--pdm-green)}
.pdm-badge--violet{background:rgba(124,58,237,.15);border:1px solid var(--pdm-violet);color:var(--pdm-violet)}

/* ── MODAL ─────────────────────────────────────────────────── */
.pdm-modal__overlay{position:fixed;inset:0;background:rgba(0,0,0,.88);z-index:9999;display:none;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(8px)}
.pdm-modal__overlay.is-open{display:flex}
.pdm-modal__card{background:linear-gradient(180deg,var(--pdm-bg-1,#0d0726),var(--pdm-bg-2,#1a0a3a));border:2px solid var(--pdm-border,#4a1f8c);border-radius:20px;padding:32px 28px;max-width:520px;width:100%;position:relative;box-shadow:0 24px 60px rgba(0,0,0,.7)}
.pdm-modal__close{position:absolute;top:14px;right:14px;width:32px;height:32px;background:rgba(7,3,24,.4);border:0;color:#fff;border-radius:50%;cursor:pointer;font-size:16px;font-weight:900}
.pdm-modal__close:hover{background:rgba(7,3,24,.7)}
.pdm-modal__footer{margin-top:24px;display:flex;justify-content:flex-end;gap:10px;padding-top:18px;border-top:1px solid var(--pdm-border-soft,rgba(124,58,237,.2))}

/* ── TAGS ──────────────────────────────────────────────────── */
.pdm-tag{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:8px;font-size:10px;font-weight:700;letter-spacing:2px;text-transform:uppercase;background:rgba(124,58,237,.15);color:var(--pdm-text-muted,#a78bfa)}

/* ── CTA BANNER (BETA50, etc.) ─────────────────────────────── */
.pdm-cta-banner{display:flex;align-items:center;justify-content:center;gap:12px;padding:14px 20px;background:linear-gradient(135deg,var(--pdm-gold),var(--pdm-red));color:#070318;border-radius:14px;text-decoration:none;font-weight:900;font-size:13px;letter-spacing:1px;animation:pdm-banner-pulse 2.4s ease-in-out infinite;text-transform:uppercase;text-align:center;flex-wrap:wrap}
.pdm-cta-banner:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(251,191,36,.5)}
.pdm-cta-banner__code{background:#070318;color:var(--pdm-gold);padding:4px 10px;border-radius:6px;font-size:11px;letter-spacing:2px}
@keyframes pdm-banner-pulse{0%,100%{box-shadow:0 8px 24px rgba(251,191,36,.35)}50%{box-shadow:0 12px 36px rgba(251,191,36,.55)}}

/* ── COUNTDOWN ─────────────────────────────────────────────── */
.pdm-countdown{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;max-width:520px;margin:0 auto}
.pdm-countdown__box{background:#070318;border:1px solid var(--pdm-border,#4a1f8c);border-radius:10px;padding:14px 6px;text-align:center}
.pdm-countdown__value{display:block;font-size:24px;font-weight:900;color:var(--pdm-cyan);line-height:1;font-family:'JetBrains Mono',monospace}
.pdm-countdown__label{display:block;font-size:9px;color:var(--pdm-text-muted,#a78bfa);letter-spacing:1.5px;text-transform:uppercase;margin-top:4px}

/* ── STAT BOX ──────────────────────────────────────────────── */
.pdm-stat-box{background:linear-gradient(160deg,var(--pdm-bg-1,#0d0726),var(--pdm-bg-2,#1a0a3a));border:1px solid var(--pdm-border,#4a1f8c);border-radius:14px;padding:20px 14px;text-align:center;transition:all .25s ease}
.pdm-stat-box:hover{transform:translateY(-3px);border-color:var(--pdm-cyan)}
.pdm-stat-box__value{font-size:32px;font-weight:900;background:linear-gradient(135deg,var(--pdm-cyan),var(--pdm-violet),var(--pdm-gold));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;line-height:1;font-family:'JetBrains Mono',monospace}
.pdm-stat-box__label{font-size:10px;color:var(--pdm-text-muted,#a78bfa);letter-spacing:2px;text-transform:uppercase;margin-top:8px;font-weight:700}

/* ── SECTION TITLE ─────────────────────────────────────────── */
.pdm-section-title{text-align:center;margin-bottom:32px}
.pdm-section-title__kicker{display:block;font-size:11px;color:var(--pdm-cyan);letter-spacing:4px;font-weight:800;margin-bottom:10px;text-transform:uppercase}
.pdm-section-title__h{font-size:clamp(24px,4vw,40px);font-weight:900;color:#fff;letter-spacing:-.01em;line-height:1.15;margin:0 0 12px}
.pdm-section-title__lead{color:var(--pdm-text-muted,#a78bfa);font-size:15px;max-width:640px;margin:0 auto;line-height:1.6}

/* ── FEATURE GRID ──────────────────────────────────────────── */
.pdm-feature-grid{display:grid;grid-template-columns:1fr;gap:16px}
@media(min-width:640px){.pdm-feature-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:960px){.pdm-feature-grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1200px){.pdm-feature-grid{grid-template-columns:repeat(4,1fr)}}

/* ── PROGRESS BAR ──────────────────────────────────────────── */
.pdm-progress-bar{height:8px;background:#070318;border-radius:4px;overflow:hidden;border:1px solid var(--pdm-border,#4a1f8c)}
.pdm-progress-bar--lg{height:14px}
.pdm-progress-bar__fill{height:100%;background:linear-gradient(90deg,var(--pdm-cyan),var(--pdm-violet),var(--pdm-gold));transition:width 1s ease;border-radius:3px}
.pdm-progress-bar__label{font-size:11px;color:var(--pdm-text-muted,#a78bfa);letter-spacing:1.5px;margin-top:6px;text-align:center}

/* ── TOASTS ────────────────────────────────────────────────── */
.pdm-toast{display:flex;align-items:center;gap:12px;padding:14px 18px;border-radius:10px;font-size:13px;border-left:3px solid;margin:8px 0}
.pdm-toast--success{background:rgba(16,185,129,.1);color:var(--pdm-green);border-left-color:var(--pdm-green)}
.pdm-toast--error{background:rgba(239,68,68,.1);color:var(--pdm-red);border-left-color:var(--pdm-red)}
.pdm-toast__dot{width:8px;height:8px;border-radius:50%;background:currentColor;flex-shrink:0}
.pdm-toast__close{margin-left:auto;background:transparent;border:0;color:inherit;cursor:pointer;font-size:14px;opacity:.7}
.pdm-toast__close:hover{opacity:1}

/* ── PULSE DOT (live indicator) ────────────────────────────── */
.pdm-pulse-dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--pdm-green);position:relative;animation:pdm-pulse 1.8s ease-in-out infinite}
.pdm-pulse-dot--red{background:var(--pdm-red)}
.pdm-pulse-dot--gold{background:var(--pdm-gold)}
@keyframes pdm-pulse{0%{box-shadow:0 0 0 0 currentColor}70%{box-shadow:0 0 0 10px transparent}100%{box-shadow:0 0 0 0 transparent}}

/* ── RESPONSIVE UTILS ──────────────────────────────────────── */
.pdm-hide-mobile{display:none}
@media(min-width:640px){.pdm-hide-mobile{display:initial}.pdm-hide-desktop{display:none}}

/* ── BACKGROUND PATTERN ────────────────────────────────────── */
.pdm-bg{background-color:var(--pdm-bg-0,#070318);background-image:radial-gradient(ellipse at 18% 10%,rgba(124,58,237,.18),transparent 55%),radial-gradient(ellipse at 82% 12%,rgba(34,211,238,.1),transparent 50%),radial-gradient(ellipse at 50% 100%,rgba(251,191,36,.06),transparent 60%);background-attachment:fixed;min-height:100vh}