/* Página de pago (pagar.html): una sola tarjeta centrada, sin navegación del sitio. */
.pago-body{background:var(--pale);min-height:100vh;display:flex;flex-direction:column}
.pago-body header{position:static}
.pago-seguro{margin-left:auto;font:600 13px Outfit,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.pago-main{flex:1;width:min(560px,calc(100% - 32px));margin:0 auto;padding:40px 0 56px;display:flex;flex-direction:column;gap:20px}
.pago-card{background:var(--paper);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:32px 28px;display:flex;flex-direction:column;gap:18px}
.pago-card h1{font:800 clamp(26px,5vw,32px)/1.15 Raleway,sans-serif;color:var(--navy);margin:0;text-wrap:balance}
.pago-card h2{font:700 24px Raleway,sans-serif;color:var(--navy);margin:0}
.pago-datos{display:grid;gap:12px;margin:0}
.pago-datos div{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.pago-datos dt{color:var(--muted);font:500 15px Outfit,sans-serif}
.pago-datos dd{margin:0;font:600 17px Outfit,sans-serif;color:var(--ink);font-variant-numeric:tabular-nums}
.pago-datos dd.pago-monto{font:800 30px Raleway,sans-serif;color:var(--navy)}
.pago-medios{margin:0;color:var(--muted);font:400 15px/1.55 Outfit,sans-serif}
.pago-boton{width:100%;justify-content:center;font-size:18px;padding:16px 20px}
.pago-boton[disabled]{opacity:.6;cursor:progress}
.pago-estado{color:var(--muted);font:500 16px/1.5 Outfit,sans-serif}
.pago-error{margin:0;padding:12px 14px;border-radius:10px;background:#fdeeea;color:#9a2f12;font:500 15px/1.5 Outfit,sans-serif}
.pago-link{font:600 15px Outfit,sans-serif;color:var(--navy)}
.pago-ok-marca{width:56px;height:56px;border-radius:50%;background:var(--orange);color:#fff;font:700 30px/56px Outfit,sans-serif;text-align:center}
#pago-ok{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
#pago-ok[hidden],#pago-resumen[hidden],#pago-inicio[hidden],.pago-demo[hidden],.pago-demo-aviso[hidden],.pago-estado[hidden],.pago-error[hidden],.pago-link[hidden]{display:none}
#pago-ok p{margin:0;color:var(--muted);font:400 16px/1.55 Outfit,sans-serif}
.pago-ayuda{margin:0;text-align:center;color:var(--muted);font:400 14px/1.6 Outfit,sans-serif}
.pago-ayuda a{color:var(--navy)}
@media (prefers-reduced-motion:no-preference){.pago-card{animation:pagoEntra .25s ease-out}@keyframes pagoEntra{from{opacity:.4;transform:translateY(6px)}to{opacity:1;transform:none}}}
.pago-qr{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:14px}
.pago-qr img{width:240px;height:240px;max-width:100%;background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px}
.pago-qr p{margin:0;text-align:center}
#pago-qr-codigo{font:700 17px Outfit,sans-serif;color:var(--ink);font-variant-numeric:tabular-nums}
.pago-qr-botones{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;width:100%}
.pago-qr-botones .btn{flex:1 1 200px}
.pago-qr-botones [hidden],.pago-qr-aviso[hidden]{display:none}
.pago-qr-aviso{padding:10px 14px;border-radius:10px;background:#eef6ff;color:#0b3b6d;font:500 14px/1.45 Outfit,sans-serif;text-align:center}
.pago-qr-pasos{margin:0;padding-left:20px;display:grid;gap:6px;text-align:left;color:var(--muted);font:400 14px/1.5 Outfit,sans-serif}
.pago-qr-pasos strong{color:var(--ink)}
.pago-qr-ayuda{font:400 14px/1.5 Outfit,sans-serif;color:var(--muted)}
.pago-qr[hidden]{display:none}
.pago-redirigiendo{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:10px;background:#eef6ff;color:#0b3b6d;font:500 15px/1.45 Outfit,sans-serif}
.pago-redirigiendo[hidden]{display:none}
.pago-giro{flex:0 0 auto;width:18px;height:18px;border:3px solid #b9d6f5;border-top-color:#0b3b6d;border-radius:50%}
@media (prefers-reduced-motion:no-preference){.pago-giro{animation:pagoGira .8s linear infinite}@keyframes pagoGira{to{transform:rotate(360deg)}}}
#pago-inicio{display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.pago-lead{margin:0;color:var(--ink);font:400 17px/1.55 Outfit,sans-serif}
.pago-pasos{margin:0;padding-left:22px;display:grid;gap:8px;color:var(--muted);font:400 16px/1.5 Outfit,sans-serif}
.pago-pasos strong{color:var(--ink)}
.pago-demo{width:100%;display:flex;flex-direction:column;gap:12px;margin-top:6px;padding-top:22px;border-top:1px solid var(--line)}
.pago-demo h2{font-size:21px}
.pago-demo p{margin:0;color:var(--muted);font:400 15px/1.55 Outfit,sans-serif}
.pago-demo p strong{color:var(--ink)}
.pago-campo{display:flex;flex-direction:column;gap:6px;font:600 15px Outfit,sans-serif;color:var(--ink)}
.pago-campo input{min-height:48px;padding:10px 14px;border:1px solid var(--line);border-radius:10px;font:400 17px Outfit,sans-serif;color:var(--ink);background:#fff}
.pago-campo input:focus-visible,.pago-boton:focus-visible,.pago-link:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
.pago-demo .btn{align-self:flex-start}
.pago-demo-tarjetas{font-size:14px!important;font-variant-numeric:tabular-nums}
.pago-demo-aviso{margin:0;padding:10px 14px;border-radius:10px;background:#fff4e8;color:#8a3b0a;font:600 14px/1.45 Outfit,sans-serif}