/* =====================================================================
   REGISTRO EN UNA PANTALLA (1.40) · lujoso pero práctico
   Un panel oscuro con el plan y lo que se cobra (a la izquierda en
   computadora, arriba en el celular) y una sola tarjeta blanca con el
   formulario. Zurex One en marino y azul; Zurex Med en pizarra y salvia,
   con el titular en Montserrat (1.42: sin letra elegante).
   ===================================================================== */
@font-face{font-family:Montserrat;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/montserrat-400.woff2) format('woff2')}
@font-face{font-family:Montserrat;font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/montserrat-500.woff2) format('woff2')}
@font-face{font-family:Montserrat;font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/montserrat-600.woff2) format('woff2')}
@font-face{font-family:Montserrat;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/montserrat-700.woff2) format('woff2')}

.reg-body{margin:0;
  --f-body:"Montserrat",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--f-tit:var(--f-body);
  --r-bg:#F3F4F2;--r-paper:#FFFFFF;--r-ink:#0E1116;--r-ink2:#2E3540;--r-muted:#6A7280;--r-line:#E2E5E9;--r-campo:#FAFBFC;
  --r-acento:#1F2E43;--r-acento2:#699ED2;--r-tinte:#EEF3F9;
  --r-panel:linear-gradient(165deg,#24364F 0%,#1F2E43 48%,#141D2A 100%);--r-panel-txt:#DCE6F1;--r-panel-suave:#9FB6CF;--r-panel-linea:rgba(255,255,255,.12);
  min-height:100vh;display:flex;flex-direction:column;background:var(--r-bg);color:var(--r-ink);font-family:var(--f-body);font-size:15px;-webkit-font-smoothing:antialiased
}
:root[data-marca="zurexmed"] .reg-body{--f-tit:var(--f-body);
  --r-bg:#F4F6F6;--r-ink:#1C2829;--r-ink2:#33433F;--r-muted:#5B6869;--r-line:#E2E7E7;--r-campo:#FAFBFB;
  --r-acento:#233132;--r-acento2:#6B8288;--r-tinte:#EEF3F3;
  --r-panel:linear-gradient(165deg,#2A3B3C 0%,#233132 50%,#1A2526 100%);--r-panel-txt:#DCE5E5;--r-panel-suave:#A9BEC1}
.reg-body input,.reg-body select,.reg-body button,.reg-body textarea{font-family:inherit}

/* ---- Barra superior ---- */
.reg-nav{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--r-bg) 88%,transparent);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--r-line)}
.reg-nav-in{max-width:1120px;margin:0 auto;padding:calc(12px + env(safe-area-inset-top,0px)) 16px 12px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.reg-logo{display:flex;align-items:center}
.reg-logo .zb-marca{height:28px;width:auto}
.reg-entrar{display:inline-flex;align-items:center;padding:8px 16px;border-radius:999px;border:1px solid var(--r-line);background:var(--r-paper);color:var(--r-ink);font-weight:600;font-size:13.5px;text-decoration:none;white-space:nowrap}
@media (hover:hover){.reg-entrar:hover{border-color:var(--r-ink)}}

/* ---- Distribución ---- */
.reg{flex:1;width:100%;max-width:1120px;margin:0 auto;padding:24px 16px 32px;box-sizing:border-box;display:flex;flex-direction:column;gap:18px}
.reg-grid{display:grid;grid-template-columns:1fr;gap:16px;align-items:start}
@media (min-width:920px){
  .reg{padding-top:44px}
  .reg-grid{grid-template-columns:minmax(300px,380px) minmax(0,600px);justify-content:center;gap:28px}
  .reg-panel{position:sticky;top:92px}
}
.reg-solo .reg-grid{grid-template-columns:minmax(0,600px);justify-content:center}
.reg-panel[hidden]{display:none}

/* ---- Panel oscuro con el plan ---- */
.reg-panel{background:var(--r-panel);color:var(--r-panel-txt);border-radius:24px;padding:28px 26px;box-shadow:0 24px 60px -32px rgba(14,17,22,.55)}
.rp-h1{margin:0;font-family:var(--f-tit);font-weight:700;font-size:clamp(28px,3.4vw,38px);line-height:1.08;letter-spacing:-.025em;color:#FFFFFF;text-wrap:balance}
:root[data-marca="zurexmed"] .rp-h1{font-weight:400;letter-spacing:-.01em;font-size:clamp(30px,3.6vw,42px)}
.rp-h1 em{font-style:normal;color:var(--r-panel-suave)}
.rp-lead{margin:12px 0 0;font-size:14.5px;line-height:1.55;color:var(--r-panel-txt);opacity:.86}
.rp-plan{margin-top:24px;padding-top:20px;border-top:1px solid var(--r-panel-linea)}
.rp-eti{display:block;font-size:12px;font-weight:600;color:var(--r-panel-suave)}
.rp-plan>b{display:block;margin-top:4px;font-size:20px;font-weight:700;color:#FFFFFF;letter-spacing:-.01em}
.rp-plan dl{margin:14px 0 0;display:flex;flex-direction:column;gap:9px}
.rp-plan dl div{display:flex;justify-content:space-between;gap:14px;font-size:13.5px}
.rp-plan dt{color:var(--r-panel-suave)}
.rp-plan dd{margin:0;text-align:right;font-weight:600;color:#FFFFFF;font-variant-numeric:tabular-nums}
.rp-nota{margin:12px 0 0;font-size:12px;line-height:1.5;color:var(--r-panel-suave)}
.rp-confianza{list-style:none;margin:22px 0 0;padding:18px 0 0;border-top:1px solid var(--r-panel-linea);display:flex;flex-direction:column;gap:8px;font-size:13px}
.rp-confianza li{display:flex;align-items:center;gap:9px}
.rp-confianza li::before{content:"";width:16px;height:16px;flex:none;border-radius:50%;background:rgba(255,255,255,.12) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2l2.3 2.3 4.7-5' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat}
@media (max-width:919px){
  .reg-panel{padding:22px 20px;border-radius:20px}
  .rp-lead,.rp-confianza{display:none}
  .rp-plan{margin-top:16px;padding-top:14px}
}

/* ---- Tarjeta del formulario ---- */
.reg-card{background:var(--r-paper);border:1px solid var(--r-line);border-radius:24px;padding:clamp(20px,3.6vw,36px);box-shadow:0 1px 2px rgba(14,17,22,.04),0 20px 50px -30px rgba(14,17,22,.25)}
.r-cab h1{margin:0;font-size:24px;font-weight:700;letter-spacing:-.02em}
.r-cab p{margin:6px 0 0;color:var(--r-muted);font-size:14.5px}
.rs{margin-top:26px}
.rs h2,.rs-cab h2{margin:0 0 12px;font-size:13px;font-weight:600;color:var(--r-muted);letter-spacing:.01em}
.rs-cab{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.rg{display:grid;grid-template-columns:1fr;gap:14px}
@media (min-width:600px){.rg{grid-template-columns:1fr 1fr}}
.rf{display:flex;flex-direction:column;gap:6px;position:relative;min-width:0}
.rf label{font-size:13px;font-weight:600;color:var(--r-ink2)}
.reg-card .in{width:100%;box-sizing:border-box;min-height:48px;padding:12px 14px;border-radius:12px;border:1px solid var(--r-line);background:var(--r-campo);color:var(--r-ink);font-size:15.5px;transition:border-color .15s,box-shadow .15s,background .15s}
.reg-card select.in{appearance:none;-webkit-appearance:none;padding-right:38px;background:var(--r-campo) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' fill='none' stroke='%236A7280' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right 12px center/16px no-repeat}
.reg-card .in:focus{outline:none;border-color:var(--r-acento2);background:var(--r-paper);box-shadow:0 0 0 4px color-mix(in srgb,var(--r-acento2) 18%,transparent)}
.rf.falta .in{border-color:#B4362B;box-shadow:0 0 0 4px rgba(180,54,43,.12)}
.r-ver{position:absolute;right:6px;bottom:6px;height:36px;padding:0 12px;border:0;border-radius:9px;background:transparent;color:var(--r-muted);font-size:13px;font-weight:600;cursor:pointer}
.r-ver:hover{color:var(--r-ink);background:var(--r-tinte)}
.r-link{border:0;background:none;padding:0;color:var(--r-ink);font-size:13px;font-weight:600;text-decoration:underline;text-underline-offset:3px;cursor:pointer}

/* Selector de plan: compacto, una fila en computadora */
.r-planes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media (min-width:600px){.r-planes{grid-template-columns:repeat(auto-fit,minmax(118px,1fr))}}
.r-plan{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;padding:14px 14px 13px;border-radius:14px;border:1px solid var(--r-line);background:var(--r-paper);color:var(--r-ink);cursor:pointer;transition:border-color .15s,box-shadow .15s,background .15s}
.r-plan span{font-size:13px;font-weight:600;color:var(--r-ink2);margin-bottom:4px}
.r-plan b{font-size:21px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.r-plan small{font-size:11.5px;color:var(--r-muted);margin-bottom:6px}
.r-plan s{font-size:12px;color:var(--r-muted)}
.r-plan .r-tot{margin-top:auto;padding-top:7px;border-top:1px solid var(--r-line);width:100%;font-size:11px;font-weight:600;color:var(--r-ink2);font-variant-numeric:tabular-nums}
.r-plan[aria-checked="true"]{border-color:var(--r-acento);background:var(--r-tinte);box-shadow:inset 0 0 0 1px var(--r-acento)}
.r-plan[aria-checked="true"]::after{content:"";position:absolute;top:12px;right:12px;width:18px;height:18px;border-radius:50%;background:var(--r-acento) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2l2.3 2.3 4.7-5' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat}
@media (hover:hover){.r-plan:hover:not([aria-checked="true"]){border-color:color-mix(in srgb,var(--r-acento) 45%,var(--r-line))}}
.r-plan:focus-visible,.r-seg button:focus-visible,.r-cta:focus-visible{outline:2px solid var(--r-acento2);outline-offset:2px}

.r-seg{display:inline-flex;gap:4px;padding:4px;margin:0 0 12px;border-radius:12px;background:var(--r-bg);border:1px solid var(--r-line)}
.r-seg button{border:0;background:transparent;color:var(--r-ink2);font:600 13.5px/1 var(--f-body);padding:10px 14px;border-radius:9px;cursor:pointer}
.r-seg button[aria-pressed="true"]{background:var(--r-paper);color:var(--r-ink);box-shadow:0 1px 3px rgba(14,17,22,.12)}
.r-periodo{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px 16px;margin-top:12px}
.r-sw{display:inline-flex;align-items:center;gap:10px;font-size:13.5px;font-weight:600;color:var(--r-ink2);cursor:pointer}
.r-sw em{font-style:normal;font-weight:600;font-size:12px;color:var(--r-acento);background:var(--r-tinte);padding:3px 8px;border-radius:999px}
.r-sw input{position:absolute;opacity:0;width:1px;height:1px}
.r-sw span{width:38px;height:22px;border-radius:999px;background:var(--r-line);position:relative;transition:background .15s;flex:none}
.r-sw span::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#FFFFFF;box-shadow:0 1px 2px rgba(0,0,0,.25);transition:transform .15s}
.r-sw input:checked+span{background:var(--r-acento)}
.r-sw input:checked+span::after{transform:translateX(16px)}
.r-sw input:focus-visible+span{outline:2px solid var(--r-acento2);outline-offset:2px}
.r-cupon{display:flex;gap:8px;flex-wrap:wrap;width:100%}
.r-cupon .in{flex:1;min-width:0;text-transform:uppercase;letter-spacing:.06em}
.r-cupon .btn{border-radius:12px}
.r-cupon .err{flex-basis:100%;margin:0}
.r-cupon-ok{font-size:13px;font-weight:600;color:#1D6B3A}
.r-fijo{display:flex;flex-direction:column;gap:4px;padding:16px;border-radius:14px;background:var(--r-tinte);border:1px solid var(--r-line)}
.r-fijo b{font-size:16px}.r-fijo span{font-size:14px;color:var(--r-ink2)}.r-fijo small{font-size:12.5px;color:var(--r-muted);line-height:1.5}

/* Aceptación y botón */
.r-acs{display:flex;flex-direction:column;gap:8px;padding-top:22px;border-top:1px solid var(--r-line)}
.r-ac{display:flex;gap:12px;align-items:flex-start;font-size:13.5px;line-height:1.5;color:var(--r-ink2);cursor:pointer;padding:10px 12px;margin:0 -12px;border-radius:12px;border:1px solid transparent}
.r-ac input{width:20px;height:20px;flex:none;margin:1px 0 0;accent-color:var(--r-acento)}
.r-ac a{color:var(--r-ink);text-decoration:underline;text-underline-offset:2px}
.r-ac.falta{border-color:#B4362B;background:rgba(180,54,43,.04)}
.reg-card .err{margin:16px 0 0;color:#B4362B;font-size:14px;font-weight:500}
.reg-card .err[hidden]{display:none}
.r-cta{display:flex;justify-content:center;align-items:center;width:100%;min-height:54px;margin-top:20px;border:0;border-radius:14px;background:var(--r-panel);color:#FFFFFF;font:600 16px/1.2 var(--f-body);cursor:pointer;text-decoration:none;box-shadow:0 14px 30px -16px rgba(14,17,22,.6);transition:filter .15s,transform .1s}
@media (hover:hover){.r-cta:hover{filter:brightness(1.12)}}
.r-cta:active{transform:scale(.99)}
.r-cta[disabled]{opacity:.7;cursor:wait}
.r-pie{margin:12px 0 0;text-align:center;font-size:12.5px;line-height:1.5;color:var(--r-muted)}
.trampa{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* Final, invitación y regreso de Stripe */
.r-fin{text-align:center;padding:12px 0}
.r-fin h1{margin:0;font-size:26px;letter-spacing:-.02em}
.r-fin p{color:var(--r-ink2);line-height:1.6;max-width:46ch;margin:10px auto 0}
.r-fin .rg{text-align:left;margin-top:18px}
.ok-grande{width:60px;height:60px;border-radius:50%;background:var(--r-panel);color:#FFFFFF;display:grid;place-items:center;font-size:28px;font-weight:700;margin:0 auto 16px}
.carta{background:var(--r-tinte);border-radius:18px;padding:clamp(18px,3.4vw,30px)}
.carta h1{margin:12px 0 0;font-size:24px;letter-spacing:-.02em}
.carta p{font-size:15.5px;line-height:1.65;margin:10px 0 0}
.carta .firma{margin-top:16px;font-weight:600}
.r-inv{margin-top:16px}

.reg-ayuda{text-align:center;color:var(--r-muted);font-size:13px;margin:0}
.reg-ayuda a{color:var(--r-ink);font-weight:600}

/* ---- Pie ---- */
.reg-foot{background:#0B0D0C;color:#A3ACA5}
.reg-foot-in{max-width:1120px;margin:0 auto;padding:20px 16px calc(20px + env(safe-area-inset-bottom,0px));display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.reg-foot-zb{height:20px;width:auto;opacity:.9}
.reg-foot .credito{display:flex;flex-direction:row;align-items:center;gap:8px;color:#A3ACA5;font-size:11px}
.reg-foot .credito .zl-logo{height:16px;color:#FFFFFF}
.reg-legal{display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:center;font-size:12.5px}
.reg-legal a{color:inherit;opacity:.8}
@media (max-width:560px){.reg-foot-in{justify-content:center}.reg-logo .zb-marca{height:24px}}

:root[data-theme="dark"] .reg-body{--r-bg:#0E1113;--r-paper:#161A1D;--r-ink:#EEF1F3;--r-ink2:#CBD2D8;--r-muted:#949DA6;--r-line:#272D32;--r-campo:#1B2024;--r-tinte:#1C2630;--r-acento:#9CC2EA;--r-acento2:#699ED2}
:root[data-theme="dark"][data-marca="zurexmed"] .reg-body{--r-acento:#A9BEC1;--r-acento2:#6B8288;--r-tinte:#1D2627}
:root[data-theme="dark"] .r-plan[aria-checked="true"]::after{background-color:#2E4157}
@media (prefers-reduced-motion:reduce){.reg-card .in,.r-plan,.r-sw span,.r-sw span::after,.r-cta{transition:none}}