/* Precios: 4 planes (Anual · Semestral · Mensual · Gratis) — macro templates/public/_pricing.html.
   El Anual es la oferta principal: borde cónico que gira, barrido de brillo, respiración del halo y precio con reflejo.
   Todo se apaga con prefers-reduced-motion. */
@property --pz-a{syntax:"<angle>";inherits:false;initial-value:0deg}
.pz{position:relative;padding-block:clamp(56px,7vw,104px);scroll-margin-top:16px}
.pz-h h2 span{color:var(--brand)}
.pz-h>p:not(.kicker){color:var(--ink-2)}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.pz-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;align-items:stretch;margin-top:clamp(32px,4vw,52px)}
.pz-card{position:relative;display:flex;flex-direction:column;padding:28px 24px 26px;border:1px solid var(--line);border-radius:18px;background:var(--paper-2);isolation:isolate;overflow:hidden;color:var(--ink)}
.pz-card>*{position:relative;z-index:2}
.pz-kick{margin:0;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-2)}
.pz-tag{display:inline-flex;align-items:center;gap:7px;padding:5px 10px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;border:1px solid oklch(.83 .145 214/.4);color:var(--brand);background:oklch(.83 .145 214/.08)}
.pz-tag i{width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 0 0 currentColor;animation:pz-pulse 1.6s ease-out infinite}
.pz-tag-hot{border-color:transparent;color:var(--on-brand);background:linear-gradient(180deg,oklch(.9 .12 206),oklch(.79 .15 218));box-shadow:0 8px 24px -8px oklch(.83 .145 214/.8)}
.pz-tag-free{color:var(--ink-2);border-color:var(--line);background:none}
.pz-price{margin:22px 0 0;display:flex;align-items:baseline;flex-wrap:wrap;gap:0 8px;font-family:"Poppins","Poppins fallback",system-ui,sans-serif;font-weight:700;letter-spacing:-.035em;font-size:clamp(44px,3.6vw,56px);line-height:.95;font-variant-numeric:tabular-nums}
.pz-price small{font-family:"Archivo","Archivo fallback",system-ui,sans-serif;font-size:15px;font-weight:600;letter-spacing:0;color:var(--ink-2)}
.pz-was{margin:8px 0 0;display:flex;align-items:center;gap:10px;font-size:14px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.pz-was s{opacity:.7}
.pz-per{margin:10px 0 0;font-size:14.5px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.pz-per b{color:var(--ink)}
.pz-save{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:oklch(.78 .17 160/.14);color:oklch(.85 .17 160);font-weight:800;font-size:12.5px;letter-spacing:.02em}
.pz-feats{list-style:none;padding:20px 0 0;margin:20px 0 0;border-top:1px solid var(--line);display:grid;gap:12px}
.pz-feats li{position:relative;padding-left:26px;font-size:14.5px;line-height:1.4;color:var(--ink-2)}
.pz-feats li b{color:var(--ink);font-weight:600}
.pz-feats li::before{content:"";position:absolute;left:2px;top:.34em;width:11px;height:6px;border-left:2px solid var(--brand);border-bottom:2px solid var(--brand);transform:rotate(-45deg)}
.pz-feats li.pz-plus::before{border-color:oklch(.85 .17 160)}
.pz-feats{margin-bottom:26px}
.pz-card .btn{margin-top:auto;width:100%;min-height:52px}
.pz-foot{margin:8px 0 0;font-size:12.5px;color:var(--ink-2);text-align:center}
.pz-fine{margin-top:26px;font-size:14px;color:var(--ink-2);max-width:72ch}
.pz-fine b{color:var(--ink)}

/* ── Anual: la oferta principal ─────────────────────────────── */
.pz-hero{border-color:transparent;background:linear-gradient(165deg,oklch(.23 .045 232) 0%,oklch(.15 .03 243) 55%,oklch(.12 .025 245) 100%);
 box-shadow:0 0 0 1px oklch(.83 .145 214/.55),0 40px 90px -30px oklch(.83 .145 214/.55);animation:pz-breathe 3.4s ease-in-out infinite}
.pz-hero::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:2px;z-index:1;pointer-events:none;
 background:conic-gradient(from var(--pz-a),transparent 0 18%,oklch(.83 .145 214/.35) 28%,var(--brand) 34%,#fff 37%,var(--brand) 40%,oklch(.83 .145 214/.35) 46%,transparent 56% 100%);
 -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
 -webkit-mask-composite:xor;mask-composite:exclude;animation:pz-spin 4.5s linear infinite}
.pz-hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;mix-blend-mode:screen;
 background:linear-gradient(112deg,transparent 38%,oklch(1 0 0/.06) 46%,oklch(.9 .12 206/.28) 50%,oklch(1 0 0/.06) 54%,transparent 62%);
 background-size:260% 100%;animation:pz-shimmer 3.8s cubic-bezier(.4,0,.2,1) infinite}
.pz-aurora{position:absolute;inset:-40% -20%;z-index:0;pointer-events:none;filter:blur(40px);opacity:.55;
 background:radial-gradient(35% 45% at 20% 20%,oklch(.83 .145 214/.55),transparent 70%),radial-gradient(30% 40% at 85% 80%,oklch(.7 .18 300/.35),transparent 70%),radial-gradient(28% 36% at 70% 15%,oklch(.85 .17 160/.3),transparent 70%);
 animation:pz-aurora 9s ease-in-out infinite alternate}
.pz-hero .pz-kick{color:var(--ink)}
.pz-hero .pz-price{background:linear-gradient(100deg,#fff 0%,#fff 35%,var(--brand) 50%,#fff 65%,#fff 100%);background-size:220% auto;
 -webkit-background-clip:text;background-clip:text;color:transparent;animation:pz-text 3.2s linear infinite;filter:drop-shadow(0 0 18px oklch(.83 .145 214/.35))}
.pz-hero .pz-price small{color:var(--ink-2)}
.pz-hero .pz-feats{border-top-color:oklch(.83 .145 214/.3)}
.pz-hero .pz-feats li{color:oklch(.9 .012 230)}
.pz-hero .btn-ink{box-shadow:0 1px 0 oklch(1 0 0/.45) inset,0 16px 44px -10px oklch(.83 .145 214/.95);animation:pz-btn 2.2s ease-in-out infinite}
@media (min-width:1100px){.pz-hero{transform:scale(1.045);z-index:3}}

/* ── Semestral: oferta secundaria ───────────────────────────── */
.pz-offer{border-color:oklch(.83 .145 214/.4);box-shadow:0 30px 70px -36px oklch(.83 .145 214/.6)}
.pz-offer .pz-kick{color:var(--ink)}
/* ── Gratis ─────────────────────────────────────────────────── */
.pz-free{border-style:dashed;background:transparent}

@keyframes pz-spin{to{--pz-a:360deg}}
@keyframes pz-shimmer{0%{background-position:130% 0}55%,100%{background-position:-130% 0}}
@keyframes pz-text{to{background-position:-220% center}}
@keyframes pz-breathe{0%,100%{box-shadow:0 0 0 1px oklch(.83 .145 214/.45),0 40px 90px -30px oklch(.83 .145 214/.45)}
 50%{box-shadow:0 0 0 1px oklch(.83 .145 214/.95),0 50px 120px -26px oklch(.83 .145 214/.9),0 0 70px -8px oklch(.83 .145 214/.35)}}
@keyframes pz-pulse{0%{box-shadow:0 0 0 0 currentColor;opacity:1}100%{box-shadow:0 0 0 8px transparent;opacity:1}}
@keyframes pz-aurora{0%{transform:translate(0,0) rotate(0deg)}100%{transform:translate(8%,-6%) rotate(12deg)}}
@keyframes pz-btn{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}

@media (max-width:1099px){.pz-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}}
@media (max-width:640px){.pz-grid{grid-template-columns:1fr;gap:26px;margin-top:34px}.pz-card{padding:26px 20px 22px}.pz-price{font-size:46px}}
@media (prefers-reduced-motion:reduce){
 .pz-hero,.pz-hero::before,.pz-hero::after,.pz-aurora,.pz-hero .pz-price,.pz-hero .btn-ink,.pz-tag i{animation:none}
 .pz-hero .pz-price{color:var(--ink);background:none;-webkit-background-clip:initial;background-clip:initial}
}