/* Tripus — páginas de cuenta de cliente (registro, login, olvidé, restablecer, verificar, panel, perfil).
   Va DESPUÉS de tw-cuenta.css: el preflight de Tailwind ([type=submit]…) no pisa estos componentes.
   navy-800 #1B3350 · navy-500 #3B5675 · navy-100 #D7E0EB · brand-600 #C8500E (botones) · brand-500 #F26B1D (acentos) */

/* ───────── Panel dividido ───────── */
.c-hero{min-height:10rem}
.c-hero-shade{background:linear-gradient(180deg,rgba(18,35,57,.35) 0%,rgba(18,35,57,.92) 100%)}
.c-hero-arc{right:-1rem;top:-2.5rem;width:16rem;height:8rem;opacity:.55}
.c-hero-h{font-size:1.375rem;line-height:1.2;max-width:22ch;text-wrap:balance}
@media (min-width:1024px){
  .c-split{min-height:calc(100vh - 5rem - 5rem)}
  .c-hero{min-height:0}
  .c-hero-shade{background:linear-gradient(200deg,rgba(18,35,57,.15) 0%,rgba(18,35,57,.55) 45%,rgba(18,35,57,.95) 100%)}
  .c-hero-arc{right:2rem;top:3rem;width:26rem;height:13rem;opacity:.9}
  .c-hero-h{font-size:2.5rem;line-height:1.1}
}

/* ───────── Campos (densos: 44 px, 16 px entre campos, error solo si hay texto) ───────── */
.c-group{margin-top:1rem}
.c-label{display:block;margin-bottom:.375rem;font-size:.8125rem;font-weight:600;color:#1B3350}
.c-input{display:block;width:100%;height:2.75rem;border-radius:.75rem;border:1.5px solid #D7E0EB;background:#fff;padding:0 .875rem;font-size:1rem;color:#1B3350;transition:border-color .15s,box-shadow .15s}
select.c-input{padding-right:2rem}
.c-input::placeholder{color:#8DA2BC}
.c-input:hover{border-color:#8DA2BC}
.c-input:focus{outline:none;border-color:#F26B1D;box-shadow:0 0 0 4px rgba(242,107,29,.18)}
.c-input.invalid{border-color:#DC2626}
.c-input.invalid:focus{box-shadow:0 0 0 4px rgba(220,38,38,.15)}
.c-help{margin-top:.375rem;font-size:.75rem;line-height:1.4;color:#3B5675}
.c-page .err{margin-top:.375rem;min-height:0;font-size:.8rem;line-height:1.35;color:#B91C1C}
.c-page .err:empty{display:none}

/* Mostrar/ocultar contraseña (icono) */
.c-eye{position:absolute;right:.375rem;top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;border-radius:.625rem;color:#3B5675;background:transparent}
.c-eye:hover{background:#EEF2F7;color:#1B3350}
.c-eye:focus-visible{outline:2px solid #F26B1D;outline-offset:1px}
.c-eye .c-eye-off,.c-eye[aria-pressed="true"] .c-eye-on{display:none}
.c-eye[aria-pressed="true"] .c-eye-off{display:block}

/* Medidor de contraseña (solo orientativo; las reglas reales están en el servidor) */
.c-meter{margin-top:.5rem}
.c-meter-bar{display:grid;grid-template-columns:repeat(4,1fr);gap:.25rem}
.c-meter-bar span{height:.3rem;border-radius:999px;background:#EEF2F7;transition:background .2s}
.c-meter-row{margin-top:.375rem;display:flex;justify-content:space-between;gap:.75rem;font-size:.75rem;color:#3B5675}
.c-meter-rule::before{content:"";display:inline-block;width:.85rem;height:.85rem;margin-right:.35rem;vertical-align:-.12rem;border-radius:999px;border:1.5px solid #8DA2BC}
.c-meter-rule.ok{color:#047857}
.c-meter-rule.ok::before{border-color:#047857;background:#047857 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5l2.5 2.5L12 5.5' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat}
.c-meter-label{font-weight:600}
.c-meter[data-score="1"] .c-meter-bar span:nth-child(-n+1){background:#DC2626}
.c-meter[data-score="2"] .c-meter-bar span:nth-child(-n+2){background:#D97706}
.c-meter[data-score="3"] .c-meter-bar span:nth-child(-n+3){background:#16A34A}
.c-meter[data-score="4"] .c-meter-bar span{background:#047857}
.c-meter[data-score="1"] .c-meter-label{color:#B91C1C}
.c-meter[data-score="2"] .c-meter-label{color:#92400E}
.c-meter[data-score="3"] .c-meter-label,.c-meter[data-score="4"] .c-meter-label{color:#047857}

/* Casillas de marca */
.c-check{display:flex;align-items:flex-start;gap:.625rem;font-size:.8125rem;line-height:1.45;color:#24405F;cursor:pointer}
.c-check input{appearance:none;-webkit-appearance:none;flex-shrink:0;margin-top:.05rem;width:1.125rem;height:1.125rem;border-radius:.35rem;border:1.5px solid #8DA2BC;background:#fff;display:grid;place-content:center;cursor:pointer;transition:background .15s,border-color .15s}
.c-check input::before{content:"";width:.6rem;height:.6rem;transform:scale(0);transition:transform .12s;background:#fff;clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0,43% 62%)}
.c-check input:checked{background:#C8500E;border-color:#C8500E}
.c-check input:checked::before{transform:scale(1)}
.c-check input:focus-visible{outline:2px solid #F26B1D;outline-offset:2px}
.c-check input.invalid{border-color:#DC2626}
.c-check a{font-weight:600;color:#9E3F0B;text-decoration:underline}
.c-check-muted{font-size:.75rem;color:#3B5675}
.c-check-muted input{width:1rem;height:1rem}

/* reCAPTCHA: cabe a 320 px */
@media (max-width:359px){.c-recaptcha .g-recaptcha{transform:scale(.9);transform-origin:0 0;height:70px}}

/* Botones */
.c-btn{position:relative;display:inline-flex;width:100%;height:3rem;align-items:center;justify-content:center;gap:.5rem;border-radius:999px;background:#C8500E;color:#fff;font-size:1rem;font-weight:600;box-shadow:0 10px 24px -10px rgba(200,80,14,.55);transition:background .15s,transform .15s}
.c-btn:hover{background:#9E3F0B}
.c-btn:active{transform:translateY(1px)}
.c-btn:focus-visible{outline:3px solid #FBC5A3;outline-offset:3px}
.c-btn:disabled{cursor:progress;opacity:.85}
.c-spin{display:none;width:1.1rem;height:1.1rem;border-radius:999px;border:2.5px solid rgba(255,255,255,.35);border-top-color:#fff;animation:c-spin .8s linear infinite}
.is-loading .c-spin{display:inline-block}
@keyframes c-spin{to{transform:rotate(360deg)}}
.c-btn-outline{display:inline-flex;width:100%;height:2.75rem;align-items:center;justify-content:center;border-radius:999px;border:1.5px solid #D7E0EB;color:#1B3350;font-size:.9375rem;font-weight:600;transition:border-color .15s,color .15s,background .15s}
.c-btn-outline:hover{border-color:#C8500E;color:#9E3F0B;background:#FEF3EC}
.c-btn-outline:focus-visible{outline:3px solid #FBC5A3;outline-offset:2px}
.c-btn-outline:disabled{cursor:not-allowed;color:#3B5675;background:#F6F8FB;border-color:#D7E0EB}
.c-divider{display:flex;align-items:center;gap:.75rem;font-size:.8125rem;color:#3B5675}
.c-divider::before,.c-divider::after{content:"";flex:1;height:1px;background:#D7E0EB}

/* Panel de éxito (registro) */
.c-success{text-align:center}
.c-success-mail{display:inline-block;max-width:100%;margin-top:.5rem;padding:.375rem .875rem;border-radius:999px;background:#EEF2F7;font-weight:600;color:#1B3350;overflow-wrap:anywhere}

@media (prefers-reduced-motion:reduce){.c-spin{animation-duration:2s}.c-btn,.c-input{transition:none}}
.c-btn-outline .c-spin{border-color:rgba(200,80,14,.25);border-top-color:#C8500E}
.c-btn-outline{gap:.5rem}
