.pp-pricing-wrap { max-width: 1000px; margin: 0 auto; padding: 32px 16px; text-align: center; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif; }
.pp-pricing-title { font-size: 28px; font-weight: 700; color: #14213d; margin-bottom: 24px; }

.pp-period-tabs { display: inline-flex; background: #fff; border: 1px solid #e2e5ea; border-radius: 10px; padding: 4px; margin-bottom: 32px; }
.pp-period-tab { border: none; background: transparent; padding: 10px 22px; font-size: 14px; font-weight: 600; color: #46505c; border-radius: 8px; cursor: pointer; }
.pp-period-tab.is-active { background: #14335c; color: #fff; }

.pp-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; text-align: left; }

.pp-price-block { display: none; }
.pp-price-block.pp-is-default { display: block; }

.pp-card { position: relative; background: #fff; border: 1px solid #e6e8ec; border-radius: 14px; padding: 28px 24px; display: flex; flex-direction: column; }
.pp-card-featured { background: #0e2a52; color: #fff; border-color: #0e2a52; }
.pp-card-featured .pp-card-subtitle,
.pp-card-featured .pp-storage,
.pp-card-featured .pp-price-original,
.pp-card-featured .pp-feature-text { color: rgba(255,255,255,.75); }

.pp-badge { position: absolute; top: -12px; left: 20px; font-size: 12px; font-weight: 700; padding: 4px 12px; border-radius: 20px; }
.pp-badge-popular { background: #e91e63; color: #fff; }
.pp-badge-new { background: #e3f2fd; color: #1565c0; }

.pp-card-name { font-size: 24px; margin: 8px 0 4px; color: #14213d !important; }
.pp-card-featured .pp-card-name { color: #ffffff !important; }
.pp-card-subtitle { font-size: 13px; color: #6b7280; margin: 0 0 14px; }

.pp-price { margin: 0; }
.pp-price-original { text-decoration: line-through; color: #9aa3ad; margin-right: 6px; font-size: 15px; }
.pp-price-current { font-size: 26px; font-weight: 700; }
.pp-price-unit { font-size: 14px; color: inherit; opacity: .75; }
.pp-storage { font-size: 13px; color: #6b7280; margin: 2px 0 16px; }

.pp-btn { display: block; text-align: center; background: #e9edf1; color: #14213d; text-decoration: none; font-weight: 700; padding: 13px 16px; border-radius: 8px; margin-bottom: 18px; }
.pp-card-featured .pp-btn { background: #1e73e6; color: #fff; }
.pp-btn:hover { opacity: .9; }

.pp-features { list-style: none; margin: 0; padding: 0; }
.pp-feature { display: flex; align-items: flex-start; gap: 8px; font-size: 14px; padding: 6px 0; }
.pp-feature-icon { flex: 0 0 16px; font-weight: 700; }
.pp-feature-check .pp-feature-icon { color: #1e73e6; }
.pp-card-featured .pp-feature-check .pp-feature-icon { color: #4da3ff; }
.pp-feature-plus .pp-feature-icon,
.pp-feature-plus .pp-feature-text { color: #9aa3ad; }
.pp-feature-tooltip { flex: 0 0 auto; width: 15px; height: 15px; border-radius: 50%; border: 1px solid #9aa3ad; color: #9aa3ad; font-size: 10px; line-height: 13px; text-align: center; cursor: help; }

.pp-feature-bold { font-weight: 700; }

.pp-card-notes { font-size: 12px; color: #9aa3ad; margin-top: 14px; padding-top: 12px; border-top: 1px solid rgba(0,0,0,.08); }
.pp-card-featured .pp-card-notes { border-top-color: rgba(255,255,255,.15); color: rgba(255,255,255,.6); }

/* Animaciones del botón "Suscribirse" */
.pp-btn { transition: transform .2s ease, box-shadow .2s ease; }

.pp-btn-anim-bounce { animation: pp-bounce 1.6s ease-in-out infinite; }
@keyframes pp-bounce {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-6px); }
}

.pp-btn-anim-pulse { animation: pp-pulse 1.8s ease-in-out infinite; }
@keyframes pp-pulse {
	0%, 100% { transform: scale(1); }
	50% { transform: scale(1.05); }
}

.pp-btn-anim-glow { animation: pp-glow 1.8s ease-in-out infinite; }
@keyframes pp-glow {
	0%, 100% { box-shadow: 0 0 0 0 rgba(30,115,230,.45); }
	50% { box-shadow: 0 0 0 8px rgba(30,115,230,0); }
}

.pp-btn-anim-shake { animation: pp-shake 3.2s ease-in-out infinite; }
@keyframes pp-shake {
	0%, 92%, 100% { transform: translateX(0); }
	93% { transform: translateX(-3px); }
	94% { transform: translateX(3px); }
	95% { transform: translateX(-3px); }
	96% { transform: translateX(3px); }
	97% { transform: translateX(0); }
}

.pp-btn-anim-grow:hover { transform: scale(1.06); box-shadow: 0 6px 16px rgba(0,0,0,.18); }