/* Maqueta de /planes · v3. Un solo sistema de componentes para toda la página (prefijo pv-):
   tarjeta, botón, píldora, glifo de valor, medidor de marcas y cabecera de sección.
   El azul marca solo Elite y las acciones; el verde, solo la garantía y el ahorro. */

.pv {
  --pv-r: 20px;
  --pv-elite: var(--blue);
  --pv-elite-tint: #f4f8ff;
  --pv-cols: minmax(0, 1fr) 188px 188px 228px;
  --pv-gap: 12px;
  --pv-top: 90px;
}
.pv h1, .pv h2, .pv h3 { letter-spacing: -0.03em; }
.pv .i { width: 18px; height: 18px; }

/* ───────── Piezas comunes */
.pv-eyebrow { font-size: 12.5px; font-weight: 850; letter-spacing: 0.1em; text-transform: uppercase; color: var(--blue); }
.pv-accent { color: var(--blue); }
.pv-accent-green { color: var(--dom); }
.pv-card { background: #fff; border: 1px solid var(--line); border-radius: var(--pv-r); box-shadow: 0 1px 2px rgba(10, 33, 79, 0.04), 0 12px 32px rgba(10, 33, 79, 0.06); }

.pv-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 46px; padding: 0 18px; border-radius: 12px; border: 1px solid transparent; font-size: 15px; font-weight: 750; text-decoration: none; white-space: nowrap; cursor: pointer; transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease; }
.pv-btn:hover { transform: translateY(-1px); }
.pv-btn.is-primary { background: var(--blue); color: #fff; box-shadow: 0 8px 20px rgba(8, 103, 255, 0.26); }
.pv-btn.is-primary:hover { background: var(--blue-2); }
.pv-btn.is-ghost { background: #fff; color: var(--ink); border-color: var(--line-2); }
.pv-btn.is-ghost:hover { border-color: var(--ink-2); }
.pv-btn.is-wa { background: var(--wa); color: #fff; }
.pv-btn.is-wa .i { fill: currentColor; stroke: none; }
.pv-btn.is-block { display: flex; width: 100%; }
.pv-btn.is-lg { height: 56px; padding: 0 24px; font-size: 16px; }

.pv-seg { display: inline-flex; gap: 2px; padding: 4px; background: #fff; border: 1px solid var(--line); border-radius: 999px; box-shadow: 0 1px 2px rgba(10, 33, 79, 0.05); }
.pv-seg button { padding: 9px 18px; background: none; border: 0; border-radius: 999px; color: var(--muted); font-size: 14px; font-weight: 750; cursor: pointer; transition: background-color 0.2s ease, color 0.2s ease; }
.pv-seg button[aria-pressed="true"] { background: var(--ink); color: #fff; }
.pv-seg small { margin-left: 4px; font-size: 12px; font-weight: 850; color: var(--dom); }
.pv-seg button[aria-pressed="true"] small { color: #8fe0b9; }

.pv-points { display: grid; gap: 10px; }
.pv-points li { display: grid; grid-template-columns: 20px 1fr; gap: 10px; font-size: 14.5px; line-height: 1.45; color: var(--ink-2); }
.pv-points .i { margin-top: 1px; color: var(--blue); }

/* Glifo de valor: completo / limitado / no */
.pv-v { display: inline-grid; place-items: center; }
.pv-v.is-full { width: 26px; height: 26px; border-radius: 50%; background: var(--blue-3); color: var(--blue); }
.pv-v.is-full .i { width: 15px; height: 15px; stroke-width: 3; }
.pv-v.is-part em { display: inline-block; padding: 4px 9px; border-radius: 999px; background: #fff; border: 1px solid var(--line-2); font-size: 12px; font-style: normal; font-weight: 750; color: var(--ink-2); line-height: 1.2; text-align: center; }
.pv-v.is-none i { display: block; width: 14px; height: 2px; border-radius: 2px; background: var(--line-2); }
.is-elite .pv-v.is-full { background: var(--pv-elite); color: #fff; }
.is-elite .pv-v.is-part em { border-color: #b9d2ff; color: var(--blue-2); }

/* Medidor de marcas: una por característica (completa, limitada o no) */
.pv-meter { margin-top: 16px; }
.pv-meter-bar { display: grid; grid-template-columns: repeat(var(--n, 31), 1fr); gap: 2px; height: 14px; }
.pv-meter-bar i { border-radius: 2px; background: var(--line); transform-origin: bottom; }
.pv-meter-bar i.is-full { background: var(--ink-2); }
.pv-meter-bar i.is-part { background: #9fb0cf; }
.is-elite .pv-meter-bar i.is-full { background: var(--pv-elite); }
.js .pv-meter:not(.is-on) .pv-meter-bar i { transform: scaleY(0.2); opacity: 0.4; }
.pv-meter-bar i { transition: transform 0.35s ease, opacity 0.35s ease; transition-delay: calc(var(--k, 0) * 22ms); }
.pv-meter-label { margin-top: 7px; font-size: 12.5px; color: var(--muted); }
.pv-meter-label b { font-weight: 850; color: var(--ink); font-variant-numeric: tabular-nums; }
.is-elite .pv-meter-label b { color: var(--pv-elite); }

/* ───────── 1 · Cabecera de la página */
.pv-hero { position: relative; padding: clamp(28px, 4vw, 52px) 0 clamp(28px, 3vw, 40px); background: linear-gradient(180deg, #eef5ff 0%, #f7faff 70%, #fff 100%); overflow: clip; }
.pv-hero::before { content: ""; position: absolute; inset: 0; background-image: radial-gradient(rgba(8, 103, 255, 0.12) 1.2px, transparent 1.2px); background-size: 22px 22px; mask-image: radial-gradient(60% 90% at 85% 30%, #000 10%, transparent 70%); -webkit-mask-image: radial-gradient(60% 90% at 85% 30%, #000 10%, transparent 70%); pointer-events: none; }
.pv-hero-in { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 40px; align-items: end; }
.pv-rating { display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px; border-radius: 999px; background: #fff; border: 1px solid var(--line); font-size: 13px; font-weight: 700; color: var(--ink-2); text-decoration: none; }
.pv-rating .stars .i { width: 14px; height: 14px; }
.pv-hero h1 { max-width: 15em; margin: 18px 0 14px; font-size: clamp(38px, 4.4vw, 60px); font-weight: 880; line-height: 1.04; }
.pv-hero h1 .pv-accent { display: block; }
.pv-num { display: inline-grid; place-items: center; min-width: 1.5em; padding: 0 0.14em; border-radius: 0.2em; background: var(--blue); color: #fff; line-height: 1.12; letter-spacing: -0.04em; }
.pv-lead { max-width: 36em; font-size: clamp(16px, 1.3vw, 18px); color: var(--ink-2); }
.pv-billing { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; margin-top: 24px; }
.pv-billing-note { font-size: 14px; font-weight: 700; color: var(--blue); text-decoration: none; }
.pv-billing-note:hover { text-decoration: underline; }
.pv-hero-art { position: relative; margin: 0 0 -40px; justify-self: end; width: 200px; }
.pv-hero-art img { width: 100%; height: auto; filter: drop-shadow(0 18px 22px rgba(10, 33, 79, 0.16)); }
.pv-bubble { position: absolute; right: 78%; top: 18px; width: max-content; max-width: 210px; padding: 9px 13px; background: #fff; border: 1px solid var(--line); border-radius: 14px 14px 4px 14px; box-shadow: 0 12px 28px rgba(10, 33, 79, 0.12); font-size: 13.5px; font-weight: 650; line-height: 1.35; color: var(--ink-2); }
.pv-bubble b { color: var(--blue); font-weight: 850; }

/* ───────── 2 · Comparador */
.pv-compare { position: relative; z-index: 1; padding: 0 0 clamp(56px, 7vw, 96px); }
.pv-heads { display: grid; grid-template-columns: var(--pv-cols); column-gap: var(--pv-gap); align-items: stretch; }
.pv-head-intro { align-self: end; padding: 0 0 18px; }
.pv-intro-title { margin-top: 6px; font-size: 22px; font-weight: 850; letter-spacing: -0.02em; line-height: 1.2; max-width: 12em; }
.pv-legend { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: 14px; font-size: 13px; color: var(--muted); }
.pv-legend li { display: inline-flex; align-items: center; gap: 7px; }
.pv-legend .pv-v.is-full { width: 22px; height: 22px; }
.pv-legend .pv-v.is-part em { padding: 2px 7px; font-size: 11px; }

.pv-head { position: relative; display: flex; flex-direction: column; padding: 20px 18px 18px; background: #fff; border: 1px solid var(--line); border-radius: var(--pv-r) var(--pv-r) 0 0; border-bottom: 0; }
.pv-head.is-elite { border: 2px solid var(--pv-elite); border-bottom: 0; background: linear-gradient(180deg, #fff 0%, var(--pv-elite-tint) 100%); box-shadow: 0 -12px 40px rgba(8, 103, 255, 0.12); }
.pv-ribbon { position: absolute; top: -13px; left: 50%; transform: translateX(-50%); padding: 5px 12px; border-radius: 999px; background: var(--pv-elite); color: #fff; font-size: 11.5px; font-weight: 850; white-space: nowrap; }
.pv-plan-name { display: flex; align-items: center; gap: 8px; font-size: 20px; font-weight: 850; letter-spacing: -0.02em; }
.pv-badge { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: var(--pv-elite); color: #fff; }
.pv-badge .i { width: 16px; height: 16px; }
.pv-plan-for { min-height: 38px; margin-top: 3px; font-size: 13px; line-height: 1.4; color: var(--muted); }
.pv-price { display: flex; align-items: baseline; gap: 4px; margin-top: 12px; }
.pv-price b { font-size: 36px; font-weight: 900; letter-spacing: -0.035em; line-height: 1; font-variant-numeric: tabular-nums; }
.pv-price span { font-size: 13px; font-weight: 650; color: var(--muted); }
.is-elite .pv-price b { color: var(--pv-elite); }
.pv-today { min-height: 34px; margin-top: 6px; font-size: 12.5px; line-height: 1.35; color: var(--muted); }
.is-elite .pv-today { color: var(--ink-2); font-weight: 650; }
.pv-head .pv-btn { margin-top: 12px; width: 100%; }

/* Barra que acompaña (misma rejilla que la tabla) */
.pv-stick { position: sticky; top: var(--pv-top); z-index: 40; height: 0; }
.pv-stick-in { position: absolute; left: -12px; right: -12px; top: 0; display: grid; grid-template-columns: var(--pv-cols); column-gap: var(--pv-gap); align-items: center; padding: 8px 12px; background: rgba(255, 255, 255, 0.94); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 10px 28px rgba(10, 33, 79, 0.1); opacity: 0; transform: translateY(-6px); pointer-events: none; transition: opacity 0.2s ease, transform 0.2s ease; }
.pv-stick.is-on .pv-stick-in { opacity: 1; transform: none; pointer-events: auto; }
.pv-stick-label { font-size: 12.5px; font-weight: 850; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.pv-stick-plan { display: flex; flex-direction: column; align-items: center; font-size: 14px; font-weight: 850; color: var(--ink); text-decoration: none; line-height: 1.2; }
.pv-stick-plan small { font-size: 12px; font-weight: 650; color: var(--muted); }
.pv-stick-plan.is-elite { padding: 6px 8px; border-radius: 10px; background: var(--pv-elite); color: #fff; }
.pv-stick-plan.is-elite small { color: #d6e6ff; }

/* Tabla */
.pv-matrix { position: relative; }
.pv-r { display: grid; grid-template-columns: var(--pv-cols); column-gap: var(--pv-gap); border-bottom: 1px solid var(--line); transition: background-color 0.15s ease; }
.pv-r > * { min-width: 0; }
.pv-c { display: flex; align-items: center; justify-content: center; padding: 12px 8px; text-align: center; }
.pv-c.is-free, .pv-c.is-basic { background: #fff; border-inline: 1px solid var(--line); }
.pv-c.is-elite { background: var(--pv-elite-tint); border-inline: 2px solid var(--pv-elite); }
.pv-r:last-child { border-bottom: 0; }
.pv-r:last-child .pv-c.is-free, .pv-r:last-child .pv-c.is-basic { border-bottom: 1px solid var(--line); border-radius: 0 0 var(--pv-r) var(--pv-r); }
.pv-r:last-child .pv-c.is-elite { border-bottom: 2px solid var(--pv-elite); border-radius: 0 0 var(--pv-r) var(--pv-r); }

.pv-colhead { display: none; }

/* Fila de grupo */
.pv-r.is-group { border-bottom-color: var(--line-2); }
.pv-g-name { display: flex; align-items: center; gap: 12px; padding: 26px 0 12px; }
.pv-g-ic { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: var(--ink); color: #fff; flex: 0 0 auto; }
.pv-g-ic .i { width: 18px; height: 18px; }
.pv-g-name b { display: block; font-size: 17px; font-weight: 850; letter-spacing: -0.01em; }
.pv-g-name small { display: block; font-size: 12.5px; color: var(--muted); }
.pv-r.is-group .pv-c { align-items: flex-end; padding-bottom: 12px; }
.pv-g-count { font-size: 12.5px; font-weight: 750; color: var(--muted); font-variant-numeric: tabular-nums; }
.pv-g-count b { font-size: 15px; font-weight: 850; color: var(--ink); }
.is-elite .pv-g-count b { color: var(--pv-elite); }

/* Fila de característica (se despliega) */
.pv-f { display: grid; align-content: center; padding: 4px 0; }
.pv-f button { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 0; background: none; border: 0; text-align: left; font: inherit; font-size: 15px; font-weight: 650; color: var(--ink); cursor: pointer; }
.pv-f button::after { content: ""; flex: 0 0 auto; width: 8px; height: 8px; margin: -3px 4px 0 auto; border-right: 2px solid var(--blank); border-bottom: 2px solid var(--blank); transform: rotate(45deg); transition: transform 0.2s ease, border-color 0.2s ease; }
.pv-f button[aria-expanded="true"]::after { transform: rotate(-135deg); margin-top: 3px; border-color: var(--blue); }
.pv-f button:hover { color: var(--blue-2); }
.pv-f p { display: none; margin: -2px 0 10px; max-width: 34em; font-size: 13.5px; line-height: 1.5; color: var(--muted); }
.pv-f button[aria-expanded="true"] + p { display: block; animation: pv-in 0.2s ease; }
@keyframes pv-in { from { opacity: 0; transform: translateY(-4px); } }
.pv-r.is-feat:hover { background: rgba(8, 103, 255, 0.03); }

/* Pie de la tabla */
.pv-foot-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-top: 22px; padding: 16px 18px; background: var(--soft); border: 1px solid var(--line); border-radius: 16px; }
.pv-foot-note { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--ink-2); }
.pv-foot-note .i { color: var(--dom); }

/* ───────── Secciones */
.pv-section { padding: clamp(64px, 8vw, 104px) 0; }
.pv-section-soft { background: linear-gradient(180deg, var(--soft) 0%, #fff 100%); }
.pv-sec-head { max-width: 680px; margin-bottom: 32px; }
.pv-sec-head.is-center { margin-inline: auto; text-align: center; }
.pv-sec-head h2 { margin-top: 10px; font-size: clamp(30px, 3.2vw, 44px); font-weight: 860; line-height: 1.1; }
.pv-sec-head h2 span { display: block; }
.pv-sub { margin-top: 14px; font-size: 17px; line-height: 1.55; color: var(--muted); }
.pv-sec-head .pv-points { margin-top: 22px; }
.pv-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(380px, 520px); gap: clamp(28px, 5vw, 72px); align-items: center; }
.pv-split .pv-sec-head { margin-bottom: 0; }

/* ───────── 3 · Calculadora */
.pv-calc { padding: 24px; }
.pv-calc-label { display: block; font-size: 15px; font-weight: 800; }
.pv-slider { display: grid; grid-template-columns: 1fr auto; gap: 14px; align-items: center; margin-top: 12px; }
.pv-slider output { min-width: 92px; padding: 6px 10px; border-radius: 10px; background: var(--ink); color: #fff; font-weight: 850; text-align: center; font-variant-numeric: tabular-nums; }
.pv-slider input { width: 100%; height: 28px; margin: 0; background: none; cursor: pointer; -webkit-appearance: none; appearance: none; }
.pv-slider input::-webkit-slider-runnable-track { height: 8px; border-radius: 999px; background: linear-gradient(90deg, var(--blue) var(--fill, 50%), var(--line) var(--fill, 50%)); }
.pv-slider input::-moz-range-track { height: 8px; border-radius: 999px; background: linear-gradient(90deg, var(--blue) var(--fill, 50%), var(--line) var(--fill, 50%)); }
.pv-slider input::-webkit-slider-thumb { -webkit-appearance: none; width: 26px; height: 26px; margin-top: -9px; border-radius: 50%; background: #fff; border: 3px solid var(--blue); box-shadow: 0 3px 10px rgba(8, 103, 255, 0.35); }
.pv-slider input::-moz-range-thumb { width: 20px; height: 20px; border-radius: 50%; background: #fff; border: 3px solid var(--blue); }
.pv-cal { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; margin-top: 18px; }
.pv-cal-m { position: relative; display: flex; flex-direction: column; gap: 2px; padding: 9px 9px 8px; border-radius: 10px; background: #fff; border: 1px solid var(--line); font-size: 11px; font-weight: 750; color: var(--muted); transition: background-color 0.25s ease, border-color 0.25s ease, color 0.25s ease, opacity 0.25s ease; }
.pv-cal-m b { font-size: 15px; font-weight: 850; color: var(--ink); }
.pv-cal-m.is-paid { background: var(--blue-3); border-color: #b9d2ff; color: var(--blue-2); }
.pv-cal-m.is-gift { background: #eaf7f1; border-color: #9fd9bd; color: var(--dom); }
.pv-cal-m.is-after { opacity: 0.4; }
.pv-cal-m.is-exam { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); }
.pv-cal-m.is-exam::after { content: "examen"; position: absolute; top: -8px; right: 6px; padding: 1px 6px; border-radius: 999px; background: var(--ink); color: #fff; font-size: 9.5px; font-weight: 850; text-transform: uppercase; letter-spacing: 0.06em; }
.pv-cal-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 12px; font-size: 12.5px; color: var(--muted); }
.pv-cal-legend li { display: inline-flex; align-items: center; gap: 6px; }
.pv-cal-legend i { width: 13px; height: 13px; border-radius: 4px; border: 1px solid var(--line); }
.pv-cal-legend i.is-paid { background: var(--blue-3); border-color: #b9d2ff; }
.pv-cal-legend i.is-gift { background: #eaf7f1; border-color: #9fd9bd; }
.pv-cal-legend i.is-exam { box-shadow: inset 0 0 0 2px var(--ink); border-color: var(--ink); }
.pv-totals { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 16px; }
.pv-totals > div { padding: 12px 14px; border: 1px solid var(--line); border-radius: 14px; transition: border-color 0.25s ease, background-color 0.25s ease; }
.pv-totals span { display: block; font-size: 12px; font-weight: 850; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.pv-totals b { display: block; margin-top: 2px; font-size: 24px; font-weight: 900; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.pv-totals small { font-size: 12.5px; color: var(--muted); }
.pv-totals .is-best { border-color: var(--blue); background: var(--blue-3); }
.pv-totals .is-best b { color: var(--blue); }
.pv-verdict { margin-top: 14px; padding: 11px 14px; border-radius: 12px; background: #eaf7f1; color: #0b5b40; font-size: 14.5px; line-height: 1.45; }
.pv-verdict b { font-weight: 850; }
.pv-calc .pv-btn { margin-top: 14px; }

/* ───────── 4 · Confianza */
.pv-trust { overflow: hidden; }
.pv-reviews-head { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 28px 30px; }
.pv-review-rating { display: flex; align-items: center; gap: 22px; }
.pv-trust-big { display: flex; align-items: baseline; gap: 6px; font-size: 58px; font-weight: 900; letter-spacing: -0.05em; line-height: 1; }
.pv-trust-big > span { font-size: 18px; font-weight: 650; letter-spacing: 0; color: var(--muted); }
.pv-rating-detail { display: grid; gap: 6px; }
.pv-rating-detail .stars .i { width: 19px; height: 19px; }
.pv-trust-s { font-size: 14px; line-height: 1.5; color: var(--muted); }
.pv-trust-s b { font-weight: 750; color: var(--ink); }
.pv-reviews-link { flex-shrink: 0; color: var(--blue); border-color: var(--line); }
.pv-reviews-link > span { font-size: 20px; }
.pv-reviews-link:focus-visible { outline: 3px solid var(--blue); outline-offset: 4px; }
.pv-reviews-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; padding: 0 30px 30px; }
.pv-review { display: flex; flex-direction: column; min-width: 0; margin: 0; padding: 22px; border: 1px solid var(--line); border-radius: 16px; background: var(--soft); }
.pv-review-mark { height: 34px; font-family: Georgia, serif; font-size: 64px; line-height: 1; color: var(--blue); }
.pv-review blockquote { flex: 1; margin: 12px 0 24px; font-size: 15px; line-height: 1.65; color: var(--ink-2); }
.pv-review figcaption { display: flex; align-items: center; gap: 10px; }
.pv-review-avatar { display: grid; place-items: center; width: 38px; height: 38px; flex: 0 0 38px; border: 1px solid var(--line); border-radius: 50%; background: #fff; color: var(--blue); font-size: 12px; font-weight: 850; }
.pv-review figcaption b { display: block; font-size: 13px; font-weight: 800; line-height: 1.4; color: var(--ink); }
.pv-review figcaption > span > span { display: block; margin-top: 2px; font-size: 12px; line-height: 1.4; color: var(--muted); }
.pv-trust-stats { display: grid; gap: 18px; padding: 26px 30px; border-top: 1px solid var(--line); }
.pv-trust-k { font-size: 12px; font-weight: 850; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); }
.pv-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px 24px; }
.pv-stats b { display: block; font-size: 28px; font-weight: 900; letter-spacing: -0.03em; color: var(--blue); font-variant-numeric: tabular-nums; line-height: 1.05; }
.pv-stats span { display: block; margin-top: 6px; font-size: 13px; line-height: 1.5; color: var(--muted); }

/* ───────── 5 · Antes de pagar */
.pv-before { display: grid; grid-template-columns: 380px minmax(0, 1fr); gap: 18px; align-items: stretch; }
.pv-guarantee { position: relative; display: flex; flex-direction: column; gap: 18px; padding: 26px; overflow: hidden; background: radial-gradient(120% 60% at 0% 0%, #e6f6ee 0%, rgba(230, 246, 238, 0) 70%), #fff; }
.pv-g-top { display: flex; align-items: center; gap: 16px; }
.pv-g-seal { position: relative; display: grid; place-content: center; justify-items: center; flex: 0 0 auto; width: 76px; height: 76px; border-radius: 50%; background: #fff; color: var(--dom); line-height: 1; box-shadow: 0 0 0 6px #d3eee1, 0 10px 24px rgba(13, 122, 85, 0.18); }
.pv-g-seal::after { content: ""; position: absolute; inset: 5px; border-radius: 50%; border: 1.5px dashed #9fd9bd; }
.pv-g-seal b { font-size: 30px; font-weight: 900; letter-spacing: -0.04em; }
.pv-g-seal small { margin-top: 2px; font-size: 10px; font-weight: 850; letter-spacing: 0.04em; text-transform: uppercase; }
.pv-guarantee h3 { font-size: 21px; font-weight: 850; line-height: 1.2; }
.pv-g-tag { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; padding: 4px 10px 4px 8px; border-radius: 999px; background: #eaf7f1; color: var(--dom); font-size: 13px; font-weight: 800; }
.pv-g-tag .i { width: 15px; height: 15px; }
.pv-g-lead { font-size: 15px; line-height: 1.55; color: var(--ink-2); }
.pv-g-list { display: grid; gap: 10px; }
.pv-g-list li { display: grid; grid-template-columns: 36px 1fr; gap: 12px; align-items: center; padding: 10px 12px; border-radius: 14px; background: var(--soft); }
.pv-g-list li > span { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: #fff; color: var(--dom); box-shadow: 0 1px 2px rgba(10, 33, 79, 0.06); }
.pv-g-list .i { width: 18px; height: 18px; }
.pv-g-list b { display: block; font-size: 14.5px; font-weight: 800; }
.pv-g-list small { display: block; font-size: 13px; line-height: 1.4; color: var(--muted); }
.pv-guarantee .pv-btn { margin-top: auto; }
.pv-faq { padding: 6px 26px; }
.pv-faq details { border-bottom: 1px solid var(--line); }
.pv-faq details:last-child { border-bottom: 0; }
.pv-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 0; font-size: 16px; font-weight: 750; cursor: pointer; list-style: none; }
.pv-faq summary::-webkit-details-marker { display: none; }
.pv-plus { position: relative; flex: 0 0 auto; width: 26px; height: 26px; border-radius: 50%; background: var(--soft-2); }
.pv-plus::before, .pv-plus::after { content: ""; position: absolute; left: 50%; top: 50%; width: 10px; height: 2px; margin: -1px 0 0 -5px; border-radius: 2px; background: var(--ink-2); transition: transform 0.2s ease; }
.pv-plus::after { transform: rotate(90deg); }
.pv-faq details[open] .pv-plus { background: var(--blue); }
.pv-faq details[open] .pv-plus::before, .pv-faq details[open] .pv-plus::after { background: #fff; }
.pv-faq details[open] .pv-plus::after { transform: rotate(0deg); }
.pv-faq details p { margin: -4px 0 18px; max-width: 46em; font-size: 15px; line-height: 1.6; color: var(--muted); }

/* ───────── 6 · Cierre */
.pv-last { padding-top: 0; }
.pv-final { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 32px; align-items: center; padding: clamp(28px, 4vw, 48px); border-radius: 28px; color: #fff; background: radial-gradient(600px 300px at 10% 0%, rgba(8, 103, 255, 0.4), rgba(8, 103, 255, 0)), var(--navy); }
.pv-final h2 { font-size: clamp(28px, 3vw, 42px); font-weight: 860; line-height: 1.1; }
.pv-final h2 span { display: block; color: #7fb0ff; }
.pv-final p { margin-top: 12px; max-width: 36em; font-size: 16px; color: #b9c8e6; }
.pv-final-cta { display: grid; justify-items: center; gap: 10px; }
.pv-final-cta p { margin: 0; font-size: 13px; color: #b9c8e6; }

/* ───────── Barra fija móvil, pago rechazado y panel */
.pv-mbar { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 50; display: none; padding: 8px; background: rgba(255, 255, 255, 0.94); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 18px 50px rgba(10, 33, 79, 0.16); transform: translateY(150%); transition: transform 0.3s ease; }
.pv-mbar.is-on { transform: none; }
.pv-mbar .pv-btn { display: flex; justify-content: space-between; width: 100%; height: 52px; }
.pv-mbar-txt { display: flex; flex-direction: column; align-items: flex-start; line-height: 1.15; }
.pv-mbar-txt small { font-size: 11.5px; font-weight: 700; opacity: 0.8; }
.pv-mbar-go { display: inline-flex; align-items: center; gap: 6px; }

.pv-rescue { position: fixed; inset: 0; z-index: 80; display: grid; place-items: center; padding: 16px; background: rgba(7, 27, 67, 0.55); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }
.pv-rescue[hidden] { display: none; }
.pv-rescue-card { position: relative; width: min(480px, 100%); padding: 28px 24px 22px; background: #fff; border-radius: 22px; box-shadow: 0 30px 80px rgba(7, 27, 67, 0.35); animation: pv-in 0.25s ease; }
.pv-rescue-x { position: absolute; top: 12px; right: 12px; display: grid; place-items: center; width: 36px; height: 36px; background: var(--soft); border: 0; border-radius: 50%; color: var(--muted); cursor: pointer; }
.pv-rescue-ic { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: #fff4dc; color: #b77400; }
.pv-rescue h3 { margin-top: 12px; font-size: 21px; font-weight: 850; line-height: 1.25; }
.pv-rescue-card > p { margin-top: 8px; font-size: 14.5px; line-height: 1.5; color: var(--muted); }
.pv-rescue-opts { display: grid; gap: 10px; margin-top: 18px; }
.pv-rescue-opt { display: block; padding: 14px 16px; border: 1px solid var(--line-2); border-radius: 14px; text-decoration: none; color: var(--ink); }
.pv-rescue-opt b { display: block; font-size: 15.5px; font-weight: 850; }
.pv-rescue-opt span { display: block; margin-top: 2px; font-size: 13px; color: var(--muted); }
.pv-rescue-opt.is-main { background: var(--blue); border-color: var(--blue); color: #fff; }
.pv-rescue-opt.is-main span { color: #d6e6ff; }
.pv-rescue-wa { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 16px; font-size: 14px; font-weight: 750; color: var(--wa); text-decoration: none; }
.pv-rescue-wa .i { fill: currentColor; stroke: none; }
.mq-action { width: 100%; padding: 8px 10px; background: #fff; border: 0; border-radius: 8px; color: #111827; font-size: 12.5px; font-weight: 750; cursor: pointer; }

[data-bill] { transition: opacity 0.16s ease; }
.is-switching [data-bill] { opacity: 0.2; }

/* ───────── Responsive */
@media (max-width: 1180px) {
  .pv { --pv-cols: minmax(0, 1fr) 160px 160px 200px; }
}
@media (max-width: 980px) {
  .pv-split, .pv-before { grid-template-columns: 1fr; }
  .pv-hero-in { grid-template-columns: 1fr; }
  .pv-hero-art { display: none; }
}
/* Móvil: cabeceras apiladas (Elite primero) y tabla con tres columnas estrechas */
@media (max-width: 860px) {
  .pv { --pv-cols: minmax(0, 1fr) 60px 60px 70px; --pv-gap: 4px; }
  .pv-heads { grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 26px; }
  .pv-head-intro { display: none; }
  .pv-head { border-radius: var(--pv-r); border-bottom: 1px solid var(--line); }
  .pv-head.is-elite { grid-column: 1 / -1; order: -1; margin-top: 12px; border-bottom: 2px solid var(--pv-elite); }
  .pv-head:not(.is-elite) .pv-plan-for { min-height: 0; }
  .pv-head:not(.is-elite) .pv-price b { font-size: 28px; }
  .pv-head:not(.is-elite) .pv-today { min-height: 0; }
  .pv-colhead { display: grid; }
  .pv-colhead .pv-c { padding: 10px 2px 8px; font-size: 12px; font-weight: 850; }
  .pv-colhead .pv-c.is-free, .pv-colhead .pv-c.is-basic { border-top: 1px solid var(--line); border-radius: 12px 12px 0 0; }
  .pv-colhead .pv-c.is-elite { border-top: 2px solid var(--pv-elite); border-radius: 12px 12px 0 0; color: var(--pv-elite); }
  .pv-colhead .pv-f { font-size: 12px; font-weight: 850; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
  .pv-stick-in { left: -8px; right: -8px; padding: 8px; }
  .pv-stick-plan small { display: none; }
  .pv-stick-plan.is-elite { padding: 4px; }
  .pv-stick-label { font-size: 11px; }
  .pv-c { padding: 10px 2px; }
  .pv-f button { font-size: 14px; padding: 9px 0; gap: 6px; }
  .pv-f button::after { margin-right: 2px; }
  .pv-v.is-part em { padding: 3px 5px; font-size: 10.5px; }
  .pv-v.is-full { width: 24px; height: 24px; }
  .pv-g-name { padding-top: 22px; }
  .pv-g-name small { display: none; }
  .pv-g-count { font-size: 11px; }
  .pv-g-count b { font-size: 13px; }
  .pv-foot-row { flex-direction: column; align-items: stretch; }
  .pv-foot-row .pv-btn { width: 100%; }
  .pv-reviews-grid { grid-template-columns: 1fr; }
  .pv-review { padding: 20px; }
  .pv-review blockquote { margin-bottom: 18px; }
  .pv-stats { grid-template-columns: 1fr 1fr; }
  .pv-final { grid-template-columns: 1fr; text-align: center; }
  .pv-final p { margin-inline: auto; }
  .pv-mbar { display: block; }
}
@media (max-width: 640px) {
  .pv-reviews-head { flex-direction: column; align-items: flex-start; gap: 20px; padding: 24px 20px; }
  .pv-reviews-link { width: 100%; font-size: 14px; }
  .pv-review-rating { gap: 16px; }
  .pv-trust-big { font-size: 52px; }
  .pv-reviews-grid { padding: 0 16px 20px; gap: 12px; }
  .pv-trust-stats { padding: 24px 20px; }
  .pv-hero h1 { font-size: clamp(34px, 9.6vw, 44px); }
  .pv-billing { flex-direction: column; align-items: stretch; }
  .pv-seg { display: flex; }
  .pv-seg button { flex: 1; }
  .pv-billing-note { text-align: center; }
  .pv-cal { grid-template-columns: repeat(4, 1fr); }
  .pv-calc { padding: 18px 16px; }
  .pv-totals b { font-size: 21px; }
  .pv-faq { padding: 2px 18px; }
  .pv-faq summary { font-size: 15px; }
  .pv-sec-head h2 { font-size: clamp(28px, 8vw, 36px); }
}
@media (prefers-reduced-motion: reduce) {
  .pv-meter-bar i { transition: none; }
}

/* Completo con texto («45 temas», «Ilimitados»): píldora rellena */
.pv-v.is-strong em { background: var(--ink-2); border-color: var(--ink-2); color: #fff; }
.is-elite .pv-v.is-strong em { background: var(--pv-elite); border-color: var(--pv-elite); color: #fff; }

/* Móvil: que las cabeceras nunca desborden */
.pv-heads > * { min-width: 0; }
.pv-price b { white-space: nowrap; }
@media (max-width: 860px) {
  .pv-head:not(.is-elite) { padding: 16px 14px; }
  .pv-head:not(.is-elite) .pv-btn { height: 42px; padding: 0 10px; font-size: 14px; }
  .pv-head:not(.is-elite) .pv-price { flex-wrap: wrap; column-gap: 4px; }
}
