/* Los planes en la landing de hoy (la raíz). El bloque HTML lo genera platform/landing-precios.mjs desde worker/planes.js;
   acá solo se decide cómo se ve. Es una banda CLARA (Sand) dentro de una página oscura, y no depende de las variables de la
   página: lleva las suyas. El borrador nuevo (/nueva/) tiene los mismos estilos en nueva.css. */
.precios{--p-fondo:var(--qezi-sand,#F4F1E8);--p-sup:#fff;--p-texto:var(--qezi-dark,#081F14);--p-tenue:#3A4F44;--p-borde:#081f1426;
  --p-acento:#0A6B3B;--p-relleno:var(--qezi-green,#00E676);
  background:var(--p-fondo);color:var(--p-texto);padding:64px 0 70px}
.precios .envoltura{max-width:var(--ancho,1180px);margin:0 auto;padding:0 28px}
.precios h2{margin:0;font-size:clamp(26px,3.4vw,38px);font-weight:800;letter-spacing:-.02em;line-height:1.1}
.precios-intro{margin:12px 0 0;max-width:60ch;font-size:17px;color:var(--p-tenue)}
.precios-prueba{margin:22px 0 0;padding:14px 18px;border-radius:14px;background:var(--qezi-mint,#CFF5DD);color:var(--p-texto);font-size:16px;max-width:70ch}
.precios-anual{margin:14px 0 0;font-size:15px;font-weight:700;color:var(--p-acento)}
.planes{margin:30px 0 0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;align-items:stretch}
.plan{position:relative;display:flex;flex-direction:column;background:var(--p-fondo);border:1px solid var(--p-borde);border-radius:20px;padding:26px 20px 22px;background:var(--p-sup)}
.plan-empuja{border:2px solid var(--p-acento);box-shadow:0 1px 2px #081f140f,0 14px 32px #081f1418}
.plan-marca{position:absolute;top:-13px;left:20px;margin:0;background:var(--p-relleno);color:var(--p-texto);padding:4px 12px;border-radius:999px;font-size:12.5px;font-weight:800}
.plan-nombre{margin:0;font-size:21px;font-weight:800}
.plan-trabajo{margin:4px 0 0;color:var(--p-tenue);font-size:15px;min-height:2.9em}
.plan-precio{margin:14px 0 0;font-size:40px;font-weight:800;letter-spacing:-.03em;line-height:1}
.plan-precio small{font-size:15px;font-weight:600;color:var(--p-tenue);letter-spacing:0}
.plan-anual{margin:8px 0 0;font-size:14px;color:var(--p-tenue)}
.plan-anual b{color:var(--p-texto)}
.plan ul{margin:14px 0 0;padding:0;list-style:none;font-size:15px}
.plan li{position:relative;padding-left:22px;margin:7px 0}
.plan li::before{content:"";position:absolute;left:2px;top:.5em;width:10px;height:6px;border-left:2px solid var(--p-acento);border-bottom:2px solid var(--p-acento);transform:rotate(-45deg)}
.plan-cupo{padding-bottom:14px !important;border-bottom:1px solid var(--p-borde)}
.plan-suma{margin:14px 0 0;font-size:13.5px;font-weight:700;color:var(--p-tenue)}
.plan-caps{flex:1}
.plan-cta{display:block;margin-top:20px;padding:13px 16px;border-radius:999px;text-align:center;font-weight:700;font-size:15px;text-decoration:none;
  border:2px solid var(--p-texto);color:var(--p-texto);background:transparent;transition:transform .15s ease,background .15s ease}
.plan-cta:hover{transform:translateY(-1px);background:#081f140d}
.plan-empuja .plan-cta{background:var(--p-relleno);border-color:var(--p-relleno);color:#081F14}
.plan-cta:focus-visible{outline:3px solid var(--p-acento);outline-offset:3px}
.plan-medida{margin:18px 0 0;color:var(--p-tenue);font-size:15.5px;max-width:75ch}
.plan-medida a{color:var(--p-texto)}
@media (max-width:1020px){.planes{grid-template-columns:repeat(2,1fr);gap:24px 16px}}
@media (max-width:640px){.precios{padding:48px 0 54px}.precios .envoltura{padding:0 20px}.planes{grid-template-columns:1fr;gap:22px}.plan-trabajo{min-height:0}}
@media (prefers-reduced-motion:reduce){.plan-cta{transition:none}}
