/* ============================================================================
   pay-shell.css — Identidad visual de las paginas de pago y paginas sueltas
   del sitio (fondo azul con mapa y nubes, logo redondo, tarjeta blanca).

   EXTRAIDO TAL CUAL de src/pages/pagar.astro para que /pago, la pagina de
   programa finalizado y el 404 se vean exactamente igual que el checkout.
   Si cambia el diseno de /pagar, regenerar este archivo con el mismo script.
   ============================================================================ */

    :root {
      --font:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
      --font-heading:"Manrope",var(--font);
    }
    * { box-sizing:border-box; }
    body { margin:0; }
    button,input { font:inherit; }

    /* Fondo azul + mapa/nubes (portal seguro de pagos). */
    .pagar {
      position:relative; isolation:isolate;
      display:flex; flex-direction:column; align-items:center; justify-content:center;
      width:100%; min-height:100vh; padding:12px 16px 16px;
      color:#fff; font-family:var(--font);
      background-color:#040f2e;
      background-image:
        linear-gradient(to bottom, rgba(4,15,46,.34) 0%, rgba(4,15,46,.12) 42%, rgba(4,15,46,.40) 100%),
        url("/portal-assets/pagar-bg.png");
      background-size:cover; background-position:center bottom; background-attachment:fixed;
      overflow-x:hidden;
    }
    .pagar__header { text-align:center; margin-bottom:16px; }
    .pagar__logo { width:80px; height:80px; border-radius:50%; object-fit:contain; margin-bottom:12px; filter:drop-shadow(0 4px 14px rgba(0,0,0,.45)); }
    .pagar__brand-name { font-family:var(--font-heading); font-size:23px; font-weight:800; letter-spacing:.05em; color:#fff; margin-bottom:4px; }
    .pagar__brand-sub { font-size:13px; font-weight:500; color:rgba(255,255,255,.72); margin-bottom:10px; }
    .pagar__secure { display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:600; color:#34d399; }

    .pagar__card { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(300px,.82fr); width:100%; max-width:960px; overflow:hidden; background:#fff; border-radius:26px; box-shadow:0 28px 70px rgba(4,15,46,.5), 0 6px 18px rgba(4,15,46,.18); color:#16233a; }
    .pagar__main { padding:26px 30px; }
    .pagar__summary { padding:26px 28px; background:radial-gradient(circle at 90% 0%, rgba(16,96,232,.10), transparent 34%), linear-gradient(160deg,#f8fbff 0%,#eef3f9 100%); border-left:1px solid #e9edf4; }

    .pagar__eyebrow { margin:0 0 5px; color:#1060e8; text-transform:uppercase; letter-spacing:.11em; font-size:11px; font-weight:800; }
    .pagar__title { font-family:var(--font-heading); margin:0 0 4px; font-size:26px; line-height:1.08; letter-spacing:-.02em; color:#0a1f50; font-weight:800; }
    .pagar__lead { max-width:520px; margin:8px 0 20px; color:#69758a; line-height:1.5; font-size:13px; }

    .pagar__context { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:18px; }
    .pagar__ctx-card { min-width:0; border:1px solid #e9edf4; border-radius:14px; padding:12px 15px; background:#fff; }
    .pagar__ctx-card span { display:block; color:#8a92a0; font-size:11px; margin-bottom:4px; }
    .pagar__ctx-card strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; color:#16233a; }
    .pagar__ctx-card--ok strong { color:#0c8b61; }

    .pagar__section-label { display:block; margin:0 0 12px; font-size:12px; font-weight:800; color:#34415a; }

    .pagar__methods { display:grid; grid-template-columns:1fr; gap:10px; margin-bottom:18px; }
    .pagar__method { text-align:left; border:1.5px solid #e9edf4; border-radius:14px; padding:13px 16px; display:flex; align-items:center; gap:12px; cursor:pointer; background:#fff; transition:border-color .18s, background .18s, transform .18s; min-height:70px; -webkit-appearance:none; }
    .pagar__method:hover { border-color:#aabbd2; transform:translateY(-1px); }
    .pagar__method--selected { border-color:#0a2d66; background:#fbfdff; box-shadow:0 0 0 3px rgba(13,47,98,.09); }
    .pagar__radio { width:18px; height:18px; border-radius:50%; border:2px solid #cdd6e3; flex-shrink:0; display:grid; place-items:center; transition:border-color .2s; }
    .pagar__method--selected .pagar__radio { border-color:#0a2d66; }
    .pagar__radio-dot { width:9px; height:9px; border-radius:50%; background:#0a2d66; opacity:0; transform:scale(.4); transition:opacity .2s, transform .2s; }
    .pagar__method--selected .pagar__radio-dot { opacity:1; transform:scale(1); }
    .pagar__method-body { flex:1; min-width:0; }
    .pagar__method-title { display:block; font-size:14px; font-weight:700; color:#0a1f50; }
    .pagar__method-sub { display:block; margin-top:2px; font-size:12px; color:#8a92a0; line-height:1.3; }
    .pagar__method-logos { display:flex; align-items:center; gap:6px; flex-shrink:0; }

    .pagar__logo-pill { display:inline-flex; align-items:center; justify-content:center; height:24px; padding:0 7px; background:#fff; border:1.5px solid #e9edf4; border-radius:6px; }
    .pagar__logo-pill--mc { padding:0 6px; }
    .pagar__visa { font-size:10px; font-weight:900; color:#1a1f71; letter-spacing:.03em; }
    .pagar__mc-red, .pagar__mc-yel { display:inline-block; width:14px; height:14px; border-radius:50%; }
    .pagar__mc-red { background:#eb001b; }
    .pagar__mc-yel { background:#f79e1b; margin-left:-5px; }
    .pagar__badge { display:inline-flex; align-items:center; padding:3px 8px; border-radius:5px; font-size:10.5px; font-weight:800; line-height:1; }
    .pagar__badge--pse { color:#0a2d66; background:#dde8ff; }
    .pagar__badge--breb { color:#fff; background:#6d28d9; }
    .pagar__badge--davi { color:#c1121f; background:transparent; }
    .pagar__bold-chip { display:inline-flex; align-items:center; gap:4px; background:#111; color:#fff; font-size:11px; font-weight:800; padding:4px 9px; border-radius:5px; letter-spacing:.02em; }

    .pagar__panel[hidden] { display:none; }
    .pagar__providers { display:flex; align-items:center; gap:7px; flex-wrap:wrap; margin-bottom:10px; }
    .pagar__notice { display:flex; gap:9px; padding:10px 12px; margin:0 0 12px; color:#405069; background:#f7f9fc; border:1px solid #e9edf4; border-radius:11px; font-size:12px; line-height:1.4; }
    .pagar__notice svg { flex:0 0 auto; margin-top:1px; }
    .pagar__amount-input { width:100%; margin:0 0 12px; padding:13px 14px; border:1px solid #e9edf4; border-radius:12px; color:#16233a; }

    .pagar__btn { display:flex; align-items:center; justify-content:center; gap:9px; width:100%; min-height:50px; border-radius:9999px; background:linear-gradient(135deg,#0a2d66 0%,#1060e8 100%); color:#fff; font-size:15px; font-weight:800; border:none; cursor:pointer; box-shadow:0 12px 26px -12px rgba(16,96,232,.8); transition:filter .15s, transform .1s; text-decoration:none; -webkit-appearance:none; }
    .pagar__btn:hover { filter:brightness(1.07); }
    .pagar__btn:active { transform:translateY(1px); }
    .pagar__btn:disabled { opacity:.58; cursor:not-allowed; filter:none; }
    .pagar__btn--wa { background:#1faf54; box-shadow:0 12px 26px -12px rgba(31,175,84,.8); margin-top:4px; }
    .pagar__processor { display:flex; align-items:center; gap:7px; margin-top:8px; }
    .pagar__processor-text { font-size:12px; color:#8a92a0; }
    .pagar__message { margin:12px 0 0; padding:11px 13px; color:#c77700; background:#fdf1dd; border-radius:10px; font-size:12px; line-height:1.45; }
    .pagar__message[hidden] { display:none; }
    .pagar__message.is-error { color:#d6453d; background:#fff0f2; }
    .pagar__message.is-success { color:#0c8b61; background:#e8f7f1; }
    .pagar__message a { color:inherit; font-weight:800; }

    .pagar__bank { display:grid; grid-template-columns:120px 1fr auto; gap:0; border:1px solid #e9edf4; border-radius:14px; overflow:hidden; margin:0 0 14px; }
    .pagar__bank dt, .pagar__bank dd { margin:0; padding:11px 13px; border-bottom:1px solid #e9edf4; font-size:13px; }
    .pagar__bank dt { color:#8a92a0; background:#f8fafc; }
    .pagar__bank dd { font-weight:700; background:#fff; min-width:0; overflow:hidden; text-overflow:ellipsis; }
    .pagar__bank-breb { color:#6d28d9; font-weight:800; }
    .pagar__copy { border:0; border-bottom:1px solid #e9edf4; color:#1060e8; background:#fff; display:grid; place-items:center; padding:0 14px; cursor:pointer; transition:background .12s, color .12s; }
    .pagar__copy:hover { background:#eef4ff; }
    .pagar__copy--done { color:#0c8b61; }
    .pagar__copy svg { display:block; }
    .pagar__bank > :nth-last-child(-n+3) { border-bottom:0; }
    .pagar__no-fee { display:inline-flex; align-items:center; gap:6px; font-size:12.5px; color:#0c8b61; background:#e8f7f1; padding:7px 12px; border-radius:9px; font-weight:700; margin:0 0 14px; }

    .pagar__sum-label { display:block; color:#69758a; font-size:13px; }
    .pagar__amount { font-family:var(--font-heading); min-height:40px; margin:5px 0 4px; font-size:34px; line-height:1; letter-spacing:-.03em; color:#0a1f50; font-weight:800; }
    .pagar__sum-currency { color:#8a92a0; font-size:12.5px; font-weight:700; }
    .pagar__concept { margin:16px 0 12px; }
    .pagar__concept strong { display:block; font-size:14px; line-height:1.4; color:#16233a; }
    .pagar__concept span { display:block; margin-top:5px; color:#69758a; font-size:13px; }
    .pagar__breakdown { border-top:1px solid #e9edf4; border-bottom:1px solid #e9edf4; padding:12px 0; }
    .pagar__breakdown > div { display:flex; justify-content:space-between; gap:16px; padding:7px 0; color:#69758a; font-size:13px; }
    .pagar__breakdown strong { color:#16233a; }
    .pagar__breakdown-total { margin-top:7px; padding-top:13px; border-top:1px dashed #cbd5e2; color:#16233a; font-weight:800; }
    .pagar__sum-status { display:flex; align-items:center; gap:8px; margin:12px 0; padding:9px 12px; color:#0c8b61; background:#e8f7f1; border-radius:10px; font-size:12px; font-weight:700; }
    .pagar__sum-status.is-error { color:#d6453d; background:#fff0f2; }
    .pagar__trust { display:grid; gap:8px; margin-top:14px; }
    .pagar__trust-item { display:flex; gap:9px; color:#69758a; font-size:12px; line-height:1.4; }
    .pagar__trust-item svg { flex:0 0 auto; color:#0c8b61; }

    .pagar__footer { margin-top:28px; text-align:center; max-width:960px; width:100%; }
    .pagar__footer-logos { display:flex; align-items:center; justify-content:center; gap:8px; flex-wrap:wrap; margin-bottom:6px; }
    .pagar__bold-chip--lg { font-size:12px; padding:5px 10px; }
    .pagar__legal { font-size:12px; color:rgba(255,255,255,.5); line-height:1.6; }
    .pagar__brand-line { display:flex; align-items:center; justify-content:center; gap:6px; font-size:12px; color:rgba(255,255,255,.34); margin-top:8px; }
    .pagar__dot { width:3px; height:3px; border-radius:50%; background:rgba(255,255,255,.24); display:inline-block; }

    @media (max-width:860px) {
      .pagar__card { grid-template-columns:1fr; max-width:500px; }
      .pagar__summary { grid-row:1; border-left:0; border-bottom:1px solid #e9edf4; }
      .pagar__main { grid-row:2; }
      .pagar__trust { display:none; }
    }
    @media (max-width:520px) {
      .pagar { padding:18px 12px 30px; }
      .pagar__main, .pagar__summary { padding:24px 20px; }
      .pagar__context, .pagar__methods { grid-template-columns:1fr; }
      .pagar__method { min-height:66px; }
      .pagar__bank { grid-template-columns:104px 1fr auto; }
      .pagar__bank dt, .pagar__bank dd { padding:10px 9px; font-size:12px; }
      .pagar__amount { font-size:30px; }
    }
  

/* --- Complementos para las paginas que usan el shell (no existen en /pagar) --- */
.pagar [hidden] { display:none !important; }
.pagar__field { display:block; margin:0 0 12px; }
.pagar__field span { display:block; margin:0 0 6px; font-size:12px; font-weight:700; color:#34415a; }
.pagar__input, .pagar__select {
  width:100%; padding:12px 14px; border:1px solid #e1e7f0; border-radius:12px;
  color:#16233a; background:#fff; font-size:14px; font-family:var(--font);
  transition:border-color .15s, box-shadow .15s;
}
.pagar__input:focus, .pagar__select:focus { outline:none; border-color:#1060e8; box-shadow:0 0 0 3px rgba(16,96,232,.12); }
.pagar__input--code { font-family:"SF Mono",Menlo,Consolas,monospace; font-size:18px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; text-align:center; }
.pagar__grid2 { display:grid; grid-template-columns:1fr 1fr; gap:0 12px; }
.pagar__grid2 .pagar__field--full { grid-column:1 / -1; }
.pagar__check { display:flex; align-items:flex-start; gap:10px; margin:4px 0 14px; padding:12px 14px; border:1.5px solid #e9edf4; border-radius:14px; cursor:pointer; font-size:13.5px; font-weight:600; color:#0a1f50; }
.pagar__check input { width:17px; height:17px; margin-top:1px; accent-color:#0a2d66; }
.pagar__check small { display:block; font-weight:500; color:#8a92a0; margin-top:2px; }
.pagar__btn--ghost { background:#fff; color:#0a1f50; border:1.5px solid #e1e7f0; box-shadow:none; }
.pagar__btn--ghost:hover { filter:none; border-color:#aabbd2; }
.pagar__stack { display:grid; gap:10px; }
.pagar__card--single { grid-template-columns:1fr; max-width:560px; }
.pagar__center { text-align:center; }
.pagar__icon-badge { width:64px; height:64px; margin:0 auto 16px; border-radius:50%; display:grid; place-items:center; background:#eef4ff; color:#1060e8; }
@media (max-width:520px) { .pagar__grid2 { grid-template-columns:1fr; } }

/* Envio del comprobante por correo, debajo del boton de WhatsApp. */
.pagar__proof-mail { margin: 10px 0 0; font-size: .84rem; color: #667386; text-align: center; }
.pagar__proof-mail a { color: #0058c1; font-weight: 700; text-decoration: none; }
.pagar__proof-mail a:hover { text-decoration: underline; }

/* ============================================================================
   /pago — Medios de pago con logos reales (inspirado en el checkout de Wompi,
   con la identidad del portal). Logos: public/img/pagos (ver CREDITOS.md).
   ============================================================================ */
.pmx { display: flex; flex-direction: column; gap: 14px; margin-bottom: 18px; }
.pmx__block[hidden] { display: none; }
.pmx__group { margin: 0 0 7px; font-size: 12.5px; font-weight: 700; color: #5b6880; }
.pmx__row { width: 100%; min-height: 66px; padding: 12px 14px; gap: 12px; }
.pmx__icon { width: 38px; height: 38px; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: #0a1f50; color: #fff; }
.pmx__brand { width: 34px; height: 34px; flex-shrink: 0; object-fit: contain; margin: 0 2px; }
.pmx__body { flex: 1; min-width: 0; }
.pmx__title { display: block; font-size: 14.5px; font-weight: 700; color: #0a1f50; }
.pmx__sub { display: block; margin-top: 2px; font-size: 12px; color: #8a92a0; line-height: 1.35; }
.pmx__logos { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.pmx__logos img { display: block; height: 20px; width: auto; }
.pmx__logos img[alt="Visa"] { height: 14px; }
.pmx__logos .pmx__breb { height: 24px; border-radius: 5px; }
.pmx__chev { flex-shrink: 0; color: #8a96aa; display: grid; place-items: center; transition: transform .18s, color .18s; }
.pagar__method--selected .pmx__chev { color: #0a2d66; transform: translateX(2px); }
.pagar__method--selected .pmx__icon { background: #0058c1; }
.pagar__wompi-chip { display: inline-flex; align-items: center; background: #2c2a29; color: #dfff61; font-size: 11px; font-weight: 800; padding: 4px 9px; border-radius: 5px; letter-spacing: .02em; }
.pmx-foot { align-items: center; }
.pmx-foot img { display: block; height: 18px; width: auto; background: #fff; border-radius: 5px; padding: 3px 6px; box-sizing: content-box; }
.pmx-foot img[alt="Visa"] { height: 12px; padding: 6px 8px; }
.pmx-foot img[alt="Bre-B"] { background: transparent; padding: 0; height: 24px; }

/* Cobro ya pagado */
.pmx-paid { text-align: center; padding: 8px 0 4px; }
.pmx-paid[hidden] { display: none; }
.pmx-paid__icon { width: 62px; height: 62px; margin: 0 auto 12px; border-radius: 50%; display: grid; place-items: center; background: #e3f3ea; color: #1a7f4b; }
.pmx-paid__title { margin: 0 0 6px; font-family: var(--font-heading); font-size: 22px; color: #0a1f50; }
.pmx-paid__text { margin: 0 0 16px; font-size: 13.5px; color: #5b6880; }
.pmx-paid__data { display: grid; gap: 8px; margin: 0 0 16px; text-align: left; }
.pmx-paid__data div { display: flex; justify-content: space-between; gap: 12px; padding: 10px 12px; border: 1px solid #e9edf4; border-radius: 11px; background: #fbfdff; }
.pmx-paid__data dt { font-size: 12px; color: #8a92a0; }
.pmx-paid__data dd { margin: 0; font-size: 13px; font-weight: 700; color: #0a1f50; text-align: right; }
#pay-flow[hidden] { display: none; }

@media (max-width: 460px) {
  .pmx__row { padding: 11px 12px; gap: 10px; }
  .pmx__logos img[alt="American Express"], .pmx__logos img[alt="Diners Club"] { display: none; }
  .pmx__sub { font-size: 11.5px; }
}

/* ============================================================================
   /pago-resultado — Resultado con animacion (check que se dibuja, halo y
   confeti con los colores de la marca; orbita del avion mientras confirma).
   ============================================================================ */
.res { max-width: 520px; text-align: center; }
.res__main { padding-top: 34px; }
.res [data-state] { display: none; }
.res[data-show="ok"] [data-state="ok"], .res[data-show="no"] [data-state="no"], .res[data-show="wait"] [data-state="wait"] { display: block; }
.res__stage { position: relative; height: 128px; margin-bottom: 8px; }
.res__badge { position: absolute; inset: 0; margin: auto; width: 112px; height: 112px; }
.res__mark { width: 112px; height: 112px; position: relative; z-index: 1; }
.res__ring, .res__tick { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.res__ring { stroke-width: 3.5; stroke-dasharray: 183; stroke-dashoffset: 0; }
.res__tick { stroke-width: 5; stroke-dasharray: 48; stroke-dashoffset: 0; }
.res__badge--ok .res__mark { filter: drop-shadow(0 10px 22px rgba(26,127,75,.28)); }
.res__badge--ok .res__ring { stroke: #1a7f4b; fill: #e9f7ef; }
.res__badge--ok .res__tick { stroke: #1a7f4b; }
.res__badge--no .res__ring { stroke: #d6453d; fill: #fdeceb; }
.res__badge--no .res__tick { stroke: #d6453d; stroke-width: 4.5; }
.res__halo { position: absolute; inset: 0; border-radius: 50%; background: radial-gradient(circle, rgba(26,127,75,.22), rgba(26,127,75,0) 68%); }
.res__confetti { position: absolute; left: 50%; top: 50%; width: 0; height: 0; }
.res__confetti i { position: absolute; width: 8px; height: 13px; border-radius: 2px; left: -4px; top: -6px; opacity: 0;
  --a: calc(var(--i) * 20deg); --d: calc(88px + (var(--i) * 7px) % 34px);
  background: #0058c1; }
.res__confetti i:nth-child(4n+1) { background: #f5a623; }
.res__confetti i:nth-child(4n+2) { background: #1a7f4b; width: 7px; height: 7px; border-radius: 50%; }
.res__confetti i:nth-child(4n+3) { background: #0a1f50; }
.res__eyebrow { color: #1a7f4b; }
.res__eyebrow--no { color: #d6453d; }
.res__title { margin-bottom: 8px; }
.res__lead { max-width: 400px; margin: 0 auto; }
.res__summary { display: grid; gap: 8px; margin: 22px 0 0; text-align: left; }
.res__summary[hidden] { display: none; }
.res__summary div { display: flex; justify-content: space-between; gap: 14px; padding: 11px 14px; border: 1px solid #e9edf4; border-radius: 12px; background: #fbfdff; }
.res__summary dt { font-size: 12px; color: #8a92a0; }
.res__summary dd { margin: 0; font-size: 13.5px; font-weight: 700; color: #0a1f50; text-align: right; }
.res__order { margin: 14px 0 0; font-family: "SF Mono", Menlo, Consolas, monospace; font-size: 11.5px; color: #97a1ad; word-break: break-all; }
.res__actions { display: flex; flex-direction: column; gap: 10px; margin-top: 24px; }
.res__actions .pagar__btn { text-decoration: none; justify-content: center; }
/* Esperando */
.res__badge--wait { display: grid; place-items: center; }
.res__orbit { position: absolute; inset: 6px; border-radius: 50%; border: 2px dashed #c9d6ea; }
.res__plane { position: absolute; top: -13px; left: 50%; margin-left: -11px; font-size: 20px; color: #0058c1; transform: rotate(90deg); }
.res__clock { width: 46px; height: 46px; fill: none; stroke: #0058c1; stroke-width: 2.2; stroke-linecap: round; }
.res__dots { display: flex; justify-content: center; gap: 7px; margin-top: 16px; }
.res__dots i { width: 8px; height: 8px; border-radius: 50%; background: #0058c1; opacity: .25; }

/* Animaciones (se repiten al cambiar de estado: clase .res--play) */
.res--play .res__badge--ok .res__ring { animation: res-draw-ring .7s cubic-bezier(.65,0,.35,1) both; }
.res--play .res__badge--ok .res__tick { animation: res-draw-tick .45s .55s cubic-bezier(.65,0,.35,1) both; }
.res--play .res__badge--ok .res__mark { animation: res-pop .5s .9s cubic-bezier(.34,1.56,.64,1) both; }
.res--play .res__halo { animation: res-halo 1.6s 1s ease-out both; }
.res--play .res__confetti i { animation: res-burst 1.15s calc(.85s + var(--i) * 12ms) cubic-bezier(.15,.8,.3,1) both; }
.res--play .res__badge--no .res__ring { animation: res-draw-ring .6s cubic-bezier(.65,0,.35,1) both; }
.res--play .res__badge--no .res__tick { animation: res-draw-tick .4s .5s ease both; }
.res--play .res__badge--no .res__mark { animation: res-shake .45s .9s ease both; }
.res__badge--wait .res__orbit { animation: res-spin 3.2s linear infinite; }
.res__dots i { animation: res-dot 1.2s infinite ease-in-out; }
.res__dots i:nth-child(2) { animation-delay: .15s; }
.res__dots i:nth-child(3) { animation-delay: .3s; }
.res--play [data-state] > .res__eyebrow, .res--play [data-state] > .res__title, .res--play [data-state] > .res__lead { animation: res-rise .55s .35s ease both; }
.res--play [data-state] > .res__title { animation-delay: .45s; }
.res--play [data-state] > .res__lead { animation-delay: .55s; }

@keyframes res-draw-ring { from { stroke-dashoffset: 183; fill-opacity: 0; } to { stroke-dashoffset: 0; fill-opacity: 1; } }
@keyframes res-draw-tick { from { stroke-dashoffset: 48; } to { stroke-dashoffset: 0; } }
@keyframes res-pop { 0% { transform: scale(1); } 45% { transform: scale(1.12); } 100% { transform: scale(1); } }
@keyframes res-halo { 0% { transform: scale(.6); opacity: 0; } 30% { opacity: 1; } 100% { transform: scale(1.9); opacity: 0; } }
@keyframes res-burst {
  0% { opacity: 1; transform: rotate(var(--a)) translateY(0) scale(.4); }
  70% { opacity: 1; }
  100% { opacity: 0; transform: rotate(var(--a)) translateY(calc(var(--d) * -1)) rotate(260deg) scale(1); }
}
@keyframes res-shake { 0%,100% { transform: translateX(0); } 20%,60% { transform: translateX(-6px); } 40%,80% { transform: translateX(6px); } }
@keyframes res-spin { to { transform: rotate(360deg); } }
@keyframes res-dot { 0%,100% { opacity: .25; transform: translateY(0); } 50% { opacity: 1; transform: translateY(-4px); } }
@keyframes res-rise { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
  .res *, .res *::before, .res *::after { animation: none !important; }
  .res__confetti { display: none; }
}
.res[data-show="wait"] .res__badge--wait { display: grid; }

/* W-05: casillas de consentimiento al pagar */
.pmx-consent { display: grid; gap: 8px; margin: 0 0 16px; }
.pmx-consent .pagar__check { margin: 0; font-weight: 500; font-size: 13px; line-height: 1.45; }
.pmx-consent .pagar__check a { color: #0058c1; font-weight: 700; text-decoration: none; }
.pmx-consent .pagar__check a:hover { text-decoration: underline; }