@import "https://fonts.googleapis.com/css2?family=Syne:wght@400;600;700;800&family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap";:root{--clr-primary:#006c49;--clr-primary-container:#10b981;--clr-primary-glow:#10b9812e;--clr-primary-tint:#f0fdf4;--clr-bg:#f4fbf4;--clr-surface:#fff;--clr-surface-low:#eef6ee;--clr-surface-mid:#e8f0e9;--clr-surface-high:#dde4dd;--clr-on-surface:#161d19;--clr-on-surface-var:#3c4a42;--clr-muted:#6b7c72;--clr-subtle:#9aada3;--clr-error:#ba1a1a;--clr-warning-bg:#fff7ed;--clr-warning-border:#fed7aa;--clr-warning-text:#92400e;--clr-outline:#6c7a71;--clr-outline-var:#bbcabf;--font-display:"Syne", system-ui, sans-serif;--font-body:"Plus Jakarta Sans", system-ui, sans-serif;--shadow-card:0 4px 24px #161d190f;--shadow-card-hover:0 8px 32px #161d191a;--shadow-btn:0 4px 12px #10b9814d;--shadow-btn-hover:0 6px 20px #10b9816b;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-xl:20px;--radius-full:9999px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-body);background-color:var(--clr-bg);color:var(--clr-on-surface);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100dvh;line-height:1.6}h1,h2,h3,h4{font-family:var(--font-display);letter-spacing:-.02em;color:var(--clr-on-surface);font-weight:700;line-height:1.2}.pay-shell{grid-template-rows:auto 1fr;grid-template-columns:2fr 3fr;min-height:100dvh;display:grid}.pay-topbar{background:var(--clr-surface);border-bottom:1px solid var(--clr-surface-mid);z-index:100;box-shadow:0 1px 0 var(--clr-outline-var);grid-column:1/-1;align-items:center;gap:.75rem;padding:1rem 2rem;display:flex;position:sticky;top:0}.pay-topbar-logo{align-items:center;gap:.5rem;text-decoration:none;display:flex}.pay-topbar-wordmark{font-family:var(--font-display);color:var(--clr-primary);letter-spacing:-.03em;font-size:1.2rem;font-weight:800}.pay-topbar-secure{color:var(--clr-muted);align-items:center;gap:.375rem;margin-left:auto;font-size:.8rem;font-weight:600;display:flex}.pay-summary{background:var(--clr-surface-low);border-right:1px solid var(--clr-surface-mid);flex-direction:column;gap:0;height:calc(100dvh - 57px);padding:2.5rem 2rem;display:flex;position:sticky;top:57px;overflow-y:auto}.pay-summary-section-label{letter-spacing:.1em;text-transform:uppercase;color:var(--clr-muted);margin-bottom:1.25rem;font-size:.7rem;font-weight:700}.pay-summary-service{background:var(--clr-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);align-items:flex-start;gap:.875rem;margin-bottom:1.5rem;padding:1rem 1.125rem;display:flex}.pay-summary-service-icon{flex-shrink:0;font-size:1.75rem;line-height:1}.pay-summary-service-name{color:var(--clr-on-surface);margin-bottom:.2rem;font-size:.9375rem;font-weight:700}.pay-summary-service-meta{color:var(--clr-muted);font-size:.8125rem}.pay-installments{flex-direction:column;gap:.625rem;margin-bottom:1.5rem;display:flex}.pay-installment-row{border-radius:var(--radius-md);background:var(--clr-surface);justify-content:space-between;align-items:center;padding:.75rem 1rem;display:flex;box-shadow:0 1px 4px #161d190a}.pay-installment-row.is-current{background:var(--clr-primary-tint);border:1.5px solid #10b98166}.pay-installment-label{color:var(--clr-on-surface-var);font-size:.875rem;font-weight:500}.pay-installment-badge{letter-spacing:.06em;text-transform:uppercase;background:var(--clr-primary-container);color:#fff;border-radius:var(--radius-full);margin-left:.5rem;padding:.15rem .6rem;font-size:.65rem;font-weight:700}.pay-installment-amount{font-family:var(--font-display);color:var(--clr-on-surface);font-size:.9375rem;font-weight:700}.pay-installment-amount.is-current{color:var(--clr-primary)}.pay-total-row{border-top:1px solid var(--clr-surface-mid);justify-content:space-between;align-items:baseline;margin-top:auto;padding:1.125rem 0 0;display:flex}.pay-total-label{color:var(--clr-muted);font-size:.875rem;font-weight:600}.pay-total-amount{font-family:var(--font-display);color:var(--clr-primary);letter-spacing:-.03em;font-size:2rem;font-weight:800;line-height:1}.pay-total-currency{color:var(--clr-muted);margin-left:.25rem;font-size:1rem;font-weight:600}.pay-trust-badges{flex-wrap:wrap;gap:.625rem;margin-top:1.5rem;display:flex}.pay-trust-badge{color:var(--clr-muted);background:var(--clr-surface);border-radius:var(--radius-full);border:1px solid var(--clr-surface-mid);align-items:center;gap:.35rem;padding:.35rem .75rem;font-size:.75rem;font-weight:600;display:flex}.pay-form-panel{background:var(--clr-surface);min-height:calc(100dvh - 57px);padding:2.5rem 2.5rem 4rem}.pay-form-heading{margin-bottom:.375rem;font-size:1.5rem;font-weight:700}.pay-form-subheading{color:var(--clr-muted);margin-bottom:2rem;font-size:.875rem}.pay-method-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.75rem;margin-bottom:2rem;display:grid}.pay-method-card{border-radius:var(--radius-lg);border:2px solid var(--clr-surface-high);background:var(--clr-surface);cursor:pointer;text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:.5rem;min-height:88px;padding:1rem .75rem;transition:all .2s;display:flex;position:relative}.pay-method-card:hover{border-color:var(--clr-outline-var);box-shadow:var(--shadow-card);transform:translateY(-1px)}.pay-method-card.is-selected{border-color:var(--clr-primary-container);background:var(--clr-primary-tint);box-shadow:0 0 0 4px #10b9811a}.pay-method-badge{background:var(--clr-primary-container);color:#fff;letter-spacing:.06em;text-transform:uppercase;border-radius:var(--radius-full);white-space:nowrap;padding:.15rem .625rem;font-size:.6rem;font-weight:800;position:absolute;top:-9px;left:50%;transform:translate(-50%)}.pay-method-logo{font-size:1.625rem;line-height:1}.pay-method-name{color:var(--clr-on-surface-var);font-size:.8rem;font-weight:700}.pay-method-card.is-selected .pay-method-name{color:var(--clr-primary)}.pay-form-area{background:var(--clr-surface);border-radius:var(--radius-xl);border:1px solid var(--clr-surface-high);margin-bottom:1.25rem;padding:1.75rem}.pay-form-area-header{border-bottom:1px solid var(--clr-surface-mid);align-items:center;gap:.625rem;margin-bottom:1.5rem;padding-bottom:1rem;display:flex}.pay-form-area-title{color:var(--clr-on-surface);font-size:1rem;font-weight:700}.pay-input-group{flex-direction:column;gap:.375rem;margin-bottom:1rem;display:flex}.pay-input-label{color:var(--clr-on-surface-var);font-size:.8125rem;font-weight:600}.pay-input{background:var(--clr-surface);border:1.5px solid var(--clr-outline-var);border-radius:var(--radius-sm);width:100%;font-family:var(--font-body);color:var(--clr-on-surface);outline:none;padding:.75rem 1rem;font-size:.9375rem;transition:border-color .2s,box-shadow .2s}.pay-input::placeholder{color:var(--clr-subtle)}.pay-input:focus{border-color:var(--clr-primary-container);box-shadow:0 0 0 3px var(--clr-primary-glow)}.pay-input-row{grid-template-columns:1fr 1fr;gap:.75rem;display:grid}.pay-stripe-wrap{border:1.5px solid var(--clr-outline-var);border-radius:var(--radius-sm);background:var(--clr-surface);margin-bottom:1rem;padding:.875rem 1rem;transition:border-color .2s,box-shadow .2s}.pay-stripe-wrap:focus-within{border-color:var(--clr-primary-container);box-shadow:0 0 0 3px var(--clr-primary-glow)}.pay-checkbox-label{color:var(--clr-on-surface-var);cursor:pointer;align-items:center;gap:.625rem;margin-top:.5rem;font-size:.875rem;display:flex}.pay-checkbox-label input[type=checkbox]{accent-color:var(--clr-primary-container);cursor:pointer;width:16px;height:16px}.btn-pay{background:linear-gradient(135deg, var(--clr-primary) 0%, var(--clr-primary-container) 100%);color:#fff;border-radius:var(--radius-lg);width:100%;height:56px;font-family:var(--font-body);cursor:pointer;box-shadow:var(--shadow-btn);letter-spacing:.01em;border:none;justify-content:center;align-items:center;gap:.625rem;font-size:1.0625rem;font-weight:700;transition:all .2s;display:inline-flex}.btn-pay:hover:not(:disabled){box-shadow:var(--shadow-btn-hover);filter:brightness(1.05);transform:translateY(-2px)}.btn-pay:disabled{opacity:.5;cursor:not-allowed;box-shadow:none;transform:none}.btn-pay-caption{color:var(--clr-subtle);justify-content:center;align-items:center;gap:.375rem;margin-top:.75rem;font-size:.775rem;display:flex}.btn-secondary{border-radius:var(--radius-md);border:1.5px solid var(--clr-primary-container);color:var(--clr-primary);font-family:var(--font-body);cursor:pointer;background:0 0;align-items:center;gap:.375rem;padding:.625rem 1.25rem;font-size:.875rem;font-weight:600;transition:all .2s;display:inline-flex}.btn-secondary:hover{background:var(--clr-primary-tint)}.pay-demo-banner{background:var(--clr-warning-bg);border:1px solid var(--clr-warning-border);border-radius:var(--radius-md);color:var(--clr-warning-text);margin-bottom:1.25rem;padding:.875rem 1rem;font-size:.8125rem}.pay-info-banner{border-radius:var(--radius-md);margin-bottom:1rem;padding:.875rem 1rem;font-size:.8375rem}.pay-info-banner.blue{color:#1e40af;background:#eff6ff;border:1px solid #bfdbfe}.pay-info-banner.orange{color:#9a3412;background:#fff7ed;border:1px solid #fed7aa}.pay-info-banner.green{background:var(--clr-primary-tint);color:var(--clr-primary);border:1px solid #10b9814d}.pay-oxxo-ref{background:var(--clr-primary-tint);border:2px dashed var(--clr-primary-container);border-radius:var(--radius-lg);text-align:center;margin-bottom:1rem;padding:1.5rem}.pay-spei-table{border-radius:var(--radius-md);border:1px solid var(--clr-surface-mid);margin-bottom:1rem;overflow:hidden}.pay-spei-row{border-bottom:1px solid var(--clr-surface-low);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;padding:.75rem 1rem;display:flex}.pay-spei-row:last-child{border-bottom:none}.pay-spei-key{color:var(--clr-muted);min-width:130px;font-size:.8125rem}.pay-spei-val{color:var(--clr-on-surface);font-size:.875rem;font-weight:700}.pay-spei-val.mono{letter-spacing:.05em;font-family:Courier New,monospace}.pay-error-text{color:var(--clr-error);align-items:center;gap:.375rem;margin-bottom:1rem;font-size:.8125rem;display:flex}.pay-loading-screen,.pay-error-screen{background:var(--clr-bg);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:1rem;min-height:100dvh;padding:2rem;display:flex}.pay-error-icon{color:var(--clr-error);background:#ba1a1a14;border-radius:50%;margin-bottom:.5rem;padding:1.25rem;display:inline-flex}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fadeSlideUp{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}.fade-up{animation:.35s ease-out forwards fadeSlideUp}@media (width<=860px){.pay-shell{grid-template-rows:auto auto 1fr;grid-template-columns:1fr}.pay-summary{border-right:none;border-bottom:1px solid var(--clr-surface-mid);height:auto;padding:1.5rem 1.25rem;position:static}.pay-form-panel{min-height:unset;padding:1.5rem 1.25rem 3rem}.pay-method-grid{grid-template-columns:repeat(2,1fr)}.pay-total-amount{font-size:1.625rem}.pay-topbar{padding:.875rem 1.25rem}}@media (width<=480px){.pay-method-grid{grid-template-columns:repeat(2,1fr);gap:.5rem}.pay-method-card{min-height:76px;padding:.75rem .5rem}.pay-input-row{grid-template-columns:1fr}.pay-form-area{padding:1.25rem}}